<template>
  <AFormPanel
    ref="formPanel"
    :details-loader="detailsLoader"
    :do-submit="doSubmit"
    :rules="rules"
    :title="status === 'add' ? '新建企业信息' : '修改企业信息'"
  >
    <template #default="{formData}">
      <div class="form-items">
        <ElFormItem label="Id" prop="id">
          <ElInput
            v-model="formData.id"
            placeholder="Id"/>
        </ElFormItem>
        <ElFormItem label="主体类型，GeTiHu-->个体户、QiYe-->企业" prop="orgCategory">
          <ElInput
            v-model="formData.orgCategory"
            placeholder="主体类型，GeTiHu-->个体户、QiYe-->企业"/>
        </ElFormItem>
        <ElFormItem label="统一社会信用代码" prop="uscc">
          <ElInput
            v-model="formData.uscc"
            placeholder="统一社会信用代码"/>
        </ElFormItem>
        <ElFormItem label="企业名称" prop="orgName">
          <ElInput
            v-model="formData.orgName"
            placeholder="企业名称"/>
        </ElFormItem>
        <ElFormItem label="营业执照" prop="businessLicense">
          <ElInput
            v-model="formData.businessLicense"
            placeholder="营业执照"/>
        </ElFormItem>
        <ElFormItem label="营业执照有效期" prop="licenseStartTime">
          <ElInput
            v-model="formData.licenseStartTime"
            placeholder="营业执照有效期"/>
        </ElFormItem>
        <ElFormItem label="营业执照有效期" prop="licenseEndTime">
          <ElInput
            v-model="formData.licenseEndTime"
            placeholder="营业执照有效期"/>
        </ElFormItem>
        <ElFormItem label="法人名称" prop="legalRepresentative">
          <ElInput
            v-model="formData.legalRepresentative"
            placeholder="法人名称"/>
        </ElFormItem>
        <ElFormItem label="法人身份证号" prop="idcard">
          <ElInput
            v-model="formData.idcard"
            placeholder="法人身份证号"/>
        </ElFormItem>
        <ElFormItem label="法人身份证有效期" prop="idcardStartTime">
          <ElInput
            v-model="formData.idcardStartTime"
            placeholder="法人身份证有效期"/>
        </ElFormItem>
        <ElFormItem label="法人身份证有效期" prop="idcardEndTime">
          <ElInput
            v-model="formData.idcardEndTime"
            placeholder="法人身份证有效期"/>
        </ElFormItem>
        <ElFormItem label="法人身份证正面" prop="idcardFront">
          <ElInput
            v-model="formData.idcardFront"
            placeholder="法人身份证正面"/>
        </ElFormItem>
        <ElFormItem label="法人身份证反面" prop="idcardBack">
          <ElInput
            v-model="formData.idcardBack"
            placeholder="法人身份证反面"/>
        </ElFormItem>
        <ElFormItem label="省；代码" prop="province">
          <ElInput
            v-model="formData.province"
            placeholder="省；代码"/>
        </ElFormItem>
        <ElFormItem label="市；代码" prop="city">
          <ElInput
            v-model="formData.city"
            placeholder="市；代码"/>
        </ElFormItem>
        <ElFormItem label="区县；代码" prop="area">
          <ElInput
            v-model="formData.area"
            placeholder="区县；代码"/>
        </ElFormItem>
        <ElFormItem label="乡镇街道；代码" prop="town">
          <ElInput
            v-model="formData.town"
            placeholder="乡镇街道；代码"/>
        </ElFormItem>
        <ElFormItem label="省；名称" prop="provinceName">
          <ElInput
            v-model="formData.provinceName"
            placeholder="省；名称"/>
        </ElFormItem>
        <ElFormItem label="市；名称" prop="cityName">
          <ElInput
            v-model="formData.cityName"
            placeholder="市；名称"/>
        </ElFormItem>
        <ElFormItem label="区县；名称" prop="areaName">
          <ElInput
            v-model="formData.areaName"
            placeholder="区县；名称"/>
        </ElFormItem>
        <ElFormItem label="乡镇街道；名称" prop="townName">
          <ElInput
            v-model="formData.townName"
            placeholder="乡镇街道；名称"/>
        </ElFormItem>
        <ElFormItem label="详细地址" prop="address">
          <ElInput
            v-model="formData.address"
            placeholder="详细地址"/>
        </ElFormItem>
        <ElFormItem label="经度" prop="lng">
          <ElInput
            v-model="formData.lng"
            placeholder="经度"/>
        </ElFormItem>
        <ElFormItem label="纬度" prop="lat">
          <ElInput
            v-model="formData.lat"
            placeholder="纬度"/>
        </ElFormItem>
        <ElFormItem label="创建人 Id； sys_user.id" prop="creatorId">
          <ElInput
            v-model="formData.creatorId"
            placeholder="创建人 Id； sys_user.id"/>
        </ElFormItem>
        <ElFormItem label="修改人 Id； sys_user.id" prop="modifierId">
          <ElInput
            v-model="formData.modifierId"
            placeholder="修改人 Id； sys_user.id"/>
        </ElFormItem>
        <ElFormItem label="创建时间" prop="createTime">
          <ElInput
            v-model="formData.createTime"
            placeholder="创建时间"/>
        </ElFormItem>
        <ElFormItem label="修改时间" prop="modifyTime">
          <ElInput
            v-model="formData.modifyTime"
            placeholder="修改时间"/>
        </ElFormItem>
      </div>
    </template>
  </AFormPanel>
</template>

<script lang="ts" setup>
import Strings from '@/common/utils/strings.ts'
import { type FormRules } from 'element-plus'
import AFormPanel from '@/components/a-form-panel/AFormPanel.tsx'
import type { ComponentExposed } from 'vue-component-type-helpers'
import OrgApi from '@/pages/cst/org/org-api.ts'

const rules = reactive<FormRules<OrgTypes.SearchOrgResult>>({
  id: [ {required: true, message: '请填写Id', trigger: 'blur'} ],
  orgCategory: [ {required: true, message: '请填写主体类型，GeTiHu-->个体户、QiYe-->企业', trigger: 'blur'} ],
  uscc: [ {required: true, message: '请填写统一社会信用代码', trigger: 'blur'} ],
  orgName: [ {required: true, message: '请填写企业名称', trigger: 'blur'} ],
  businessLicense: [ {required: true, message: '请填写营业执照', trigger: 'blur'} ],
  licenseStartTime: [ {required: true, message: '请填写营业执照有效期', trigger: 'blur'} ],
  licenseEndTime: [ {required: true, message: '请填写营业执照有效期', trigger: 'blur'} ],
  legalRepresentative: [ {required: true, message: '请填写法人名称', trigger: 'blur'} ],
  idcard: [ {required: true, message: '请填写法人身份证号', trigger: 'blur'} ],
  idcardStartTime: [ {required: true, message: '请填写法人身份证有效期', trigger: 'blur'} ],
  idcardEndTime: [ {required: true, message: '请填写法人身份证有效期', trigger: 'blur'} ],
  idcardFront: [ {required: true, message: '请填写法人身份证正面', trigger: 'blur'} ],
  idcardBack: [ {required: true, message: '请填写法人身份证反面', trigger: 'blur'} ],
  province: [ {required: true, message: '请填写省；代码', trigger: 'blur'} ],
  city: [ {required: true, message: '请填写市；代码', trigger: 'blur'} ],
  area: [ {required: true, message: '请填写区县；代码', trigger: 'blur'} ],
  town: [ {required: true, message: '请填写乡镇街道；代码', trigger: 'blur'} ],
  provinceName: [ {required: true, message: '请填写省；名称', trigger: 'blur'} ],
  cityName: [ {required: true, message: '请填写市；名称', trigger: 'blur'} ],
  areaName: [ {required: true, message: '请填写区县；名称', trigger: 'blur'} ],
  townName: [ {required: true, message: '请填写乡镇街道；名称', trigger: 'blur'} ],
  address: [ {required: true, message: '请填写详细地址', trigger: 'blur'} ],
  lng: [ {required: true, message: '请填写经度', trigger: 'blur'} ],
  lat: [ {required: true, message: '请填写纬度', trigger: 'blur'} ],
  creatorId: [ {required: true, message: '请填写创建人 Id； sys_user.id', trigger: 'blur'} ],
  modifierId: [ {required: true, message: '请填写修改人 Id； sys_user.id', trigger: 'blur'} ],
  createTime: [ {required: true, message: '请填写创建时间', trigger: 'blur'} ],
  modifyTime: [ {required: true, message: '请填写修改时间', trigger: 'blur'} ],
  deleted: [ {required: true, message: '请填写是否删除； 0-->未删除、1-->已删除', trigger: 'blur'} ],
})

const props = withDefaults(defineProps<{
  research?: () => void
}>(), {
  research: () => {
  },
})

const formPanelIns = useTemplateRef<ComponentExposed<typeof AFormPanel>>('formPanel')
const status = ref<'add' | 'modify'>('add')


function detailsLoader(id?: string) {
  if (Strings.isBlank(id)) {
    status.value = 'add'
    return Promise.resolve()
  } else {
    status.value = 'modify'
    return OrgApi
      .detail(id!)
      .then(res => res.data)
  }
}

function doSubmit(data: OrgTypes.SearchOrgResult) {
  if (status.value === 'add') {
    return OrgApi.add(data)
      .then(props.research)
  } else {
    return OrgApi.modify(data)
      .then(props.research)
  }
}

defineExpose({
  open(data?: OrgTypes.SearchOrgResult) {
    formPanelIns.value?.open(data?.id)
  },
})
</script>

<style lang="stylus" scoped>
.form-items {
  grid-template-columns: 1fr 1fr;

  :deep(.el-form-item) {
  }
}
</style>
