<route lang="yaml">
meta:
  enabled: false
</route>

<script lang="ts" setup>
import { ElMessage } from 'element-plus'
import type { FormInstance, FormRules } from 'element-plus'
import { getCompanyProfile, updateCompanyProfile } from '@/api/system/companyApi'

const formRef = ref<FormInstance>()
// eslint-disable-next-line unused-imports/no-unused-vars
const formRules = ref<FormRules>({
  cmpName: [
    { required: true, message: '请输入公司名称', trigger: 'blur' },
  ],
  cmpIntro: [
    { required: true, message: '请输入公司介绍', trigger: 'blur' },
  ],
  cmpContact: [
    { required: true, message: '请输入联系方式', trigger: 'blur' },
  ],
})

const state = reactive({
  title: '',
  dialogVisible: false,
  loading: false,
  formData: {
    positionId: 0,
    positionName: '',
    positionDesc: '',
    cmpName: '',
    cmpContact: '',
    cmpIntro: '',
    cmpWebsite: '',
  },
  actionType: 1,
})

const getData = async () => {
  state.loading = true
  const { data } = await getCompanyProfile()
  state.loading = false
  state.formData = data
}

onMounted(() => {
  getData()
})

function onSubmit() {
  formRef.value && formRef.value.validate(async (valid) => {
    if (valid) {
      state.loading = true
      await updateCompanyProfile(state.formData)
      state.loading = false
      ElMessage.success({
        message: '更新成功',
        center: true,
      })
    }
  })
}
</script>

<template>
  <div>
    <page-header title="公司基本信息">
      <template #content>
        <div>
          设定运营公司的基本信息
        </div>
      </template>
    </page-header>

    <page-main>
      <el-row type="flex" justify="center">
        <el-col :md="12" :sm="18">
          <el-form ref="formRef" :model="state.formData" label-width="80px">
            <el-form-item label="公司名称" prop="cmpName">
              <el-input v-model="state.formData.cmpName" />
            </el-form-item>

            <el-form-item label="公司介绍" prop="cmpIntro">
              <el-input v-model="state.formData.cmpIntro" :rows="20" type="textarea" />
            </el-form-item>

            <el-form-item label="联系方式" prop="cmpContact">
              <el-input v-model="state.formData.cmpContact" />
            </el-form-item>

            <el-form-item label="网址" prop="cmpWebsite">
              <el-input v-model="state.formData.cmpWebsite" />
            </el-form-item>

            <el-form-item>
              <el-button type="primary" @click="onSubmit">
                更新
              </el-button>
            </el-form-item>
          </el-form>
        </el-col>
      </el-row>
    </page-main>
  </div>
</template>
