<!-- 工商信息 -->
<template>
  <div>
    <CtForm ref="CtFormRef" class="mt-3" :items="formItems" style="width: 900px;margin: 0 auto">
    </CtForm>
    <div class="text-center">
      <v-btn color="primary" class="buttons mt-3 mb-10" @click="handleSave">{{ $t('common.save') }}</v-btn>
    </div>
  </div>
</template>

<script setup>
import CtForm from '@/components/CtForm'
import { getEnterpriseBusiness, updateEnterpriseBusiness } from '@/api/enterprise'
import Snackbar from '@/plugins/snackbar'

import { reactive, ref } from 'vue'

defineOptions({name: 'informationSettingsComponents-businessInformation'})
const formItems = ref({
  options: [
    {
      type: 'text',
      key: 'name',
      value: '',
      col: 6,
      flexStyle: 'mr-3',
      label: '企业名称 *',
      rules: [v => !!v || '请输入企业名称']
    },
    {
      type: 'text',
      key: 'representative',
      value: '',
      col: 6,
      label: '法定代表人 *',
      rules: [v => !!v || '请输入法定代表人']
    },
    {
      type: 'text',
      key: 'code',
      value: '',
      col: 6,
      flexStyle: 'mr-3',
      label: '统一社会信用代码 *',
      rules: [v => !!v || '请输入统一社会信用代码']
    },
    {
      type: 'text',
      key: 'type',
      value: '',
      col: 6,
      label: '企业类型 *',
      rules: [v => !!v || '请输入企业类型']
    },
    {
      type: 'datePicker',
      key: 'establishmentTime',
      dateType: 'date', // 时间类型 year month date time
      value: null,
      label: '成立时间 *',
      col: 6,
      flexStyle: 'mr-3',
      outlined: true,
      rules: [v => !!v || '请选择成立时间']
      // options: {},
    },
    {
      type: 'text',
      key: 'registeredCapital',
      value: '',
      col: 6,
      label: '注册资金 *',
      rules: [v => !!v || '请输入注册资金']
    },
    {
      type: 'text',
      key: 'approvalTime',
      value: '',
      col: 6,
      flexStyle: 'mr-3',
      label: '核准日期 *',
      rules: [v => !!v || '请输入核准日期']
    },
    {
      type: 'text',
      key: 'registrationAuthority',
      value: '',
      col: 6,
      label: '注册机关 *',
      rules: [v => !!v || '请输入注册机关']
    },
    {
      type: 'text',
      key: 'businessStatus',
      value: '',
      col: 6,
      flexStyle: 'mr-3',
      label: '经营状态 *',
      rules: [v => !!v || '请输入经营状态']
    },
    {
      type: 'text',
      key: 'businessTerm',
      value: null,
      col: 6,
      class: 'mb-3',
      label: '营业期限(示例：2020-03-13 至 2030-03-13) *',
      rules: [v => !!v || '请填写营业期限']
    },
    {
      type: 'text',
      key: 'area',
      value: '',
      col: 6,
      flexStyle: 'mr-3',
      label: '所属地区 *',
      rules: [v => !!v || '请输入所属地区']
    },
    {
      type: 'text',
      key: 'formerName',
      value: '',
      col: 6,
      label: '曾用名',
    },
    {
      type: 'text',
      key: 'address',
      value: '',
      label: '注册地址 *',
      rules: [v => !!v || '请输入注册地址']
    },
    {
      type: 'textarea',
      key: 'businessScope',
      value: null,
      resize: true,
      counter: 1600,
      rows: 5,
      label: '经营范围 *',
      outlined: true,
      rules: [v => !!v || '请输入经营范围']
    },
  ]
})

const CtFormRef = ref()
const query = reactive({})
const handleSave = async () => {
  const { valid } = await CtFormRef.value.formRef.validate()
  if (!valid) return
  formItems.value.options.forEach(e => {
    if (e.noParam) return
    query[e.key] = e.value
  })
  await updateEnterpriseBusiness(query)
  Snackbar.success('编辑成功')
  getBaseInfo()
}

// 获取基本信息
const getBaseInfo = async () => {
  const data = await getEnterpriseBusiness()
  if (!data) return
  query.id = data.id
  formItems.value.options.forEach(item => {
    item.value = data[item.key]
  })
}
getBaseInfo()
</script>
<style lang="scss" scoped>
</style>
