yunzhupaas-web-vue3/src/views/mdm/corporation/Detail.vue

<template>
  <BasicDrawer v-bind="$attrs" @register="registerDrawer" :title="title" width="1000px" showFooter :showOkBtn="false">
    <template #insertFooter> </template>
    <a-row class="p-10px dynamic-form">
      <!-- 表单 -->
      <a-form :colon="false" size="middle" layout="horizontal" labelAlign="right" :labelCol="{ style: { width: '100px' } }" :model="dataForm" ref="formRef">
        <a-row :gutter="15">
          <!-- 具体表单 -->
          <a-col :span="8" class="ant-col-item">
            <a-form-item name="company_code">
              <template #label>企业编码 </template> <p>{{ dataForm.company_code }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="8" class="ant-col-item">
            <a-form-item name="company_name">
              <template #label>企业名称 </template>
              <YunzhupaasInput
                v-model:value="dataForm.company_name"
                placeholder="请输入"
                disabled
                detailed
                allowClear
                :style="{ width: '100%' }"
                :maskConfig="maskConfig.company_name">
              </YunzhupaasInput>
            </a-form-item>
          </a-col>
          <a-col :span="8" class="ant-col-item">
            <a-form-item name="short_name">
              <template #label>简称/昵称 </template>
              <YunzhupaasInput
                v-model:value="dataForm.short_name"
                placeholder="请输入"
                disabled
                detailed
                allowClear
                :style="{ width: '100%' }"
                :maskConfig="maskConfig.short_name">
              </YunzhupaasInput>
            </a-form-item>
          </a-col>
          <a-col :span="8" class="ant-col-item">
            <a-form-item name="credit_code">
             <template #label>{{ dataForm.entity_type_yunzhupaasId === 'IND' ? '身份证' : '社会信用代码' }} </template>
              <YunzhupaasInput
                v-model:value="dataForm.credit_code"
                placeholder="请输入"
                disabled
                detailed
                allowClear
                :style="{ width: '100%' }"
                :maskConfig="maskConfig.credit_code">
              </YunzhupaasInput>
            </a-form-item>
          </a-col>
          <a-col :span="8" class="ant-col-item" v-if="dataForm.entity_type_yunzhupaasId=='ORG'">
            <a-form-item name="tax_type">
              <template #label>纳税人类别 </template> <p>{{ dataForm.tax_type }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="8" class="ant-col-item" v-if="dataForm.entity_type_yunzhupaasId=='ORG'">
            <a-form-item name="org_id">
              <template #label>归属组织 </template> <p>{{ dataForm.org_id }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="8" class="ant-col-item" v-if="dataForm.entity_type_yunzhupaasId=='ORG'">
            <a-form-item name="province_id">
              <template #label>所属地区 </template> <p>{{ dataForm.province_id }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="8" class="ant-col-item" v-if="dataForm.entity_type_yunzhupaasId=='ORG'">
            <a-form-item name="enterprise_nature">
              <template #label>企业类型 </template> <p>{{ dataForm.enterprise_nature }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="8" class="ant-col-item" v-if="dataForm.entity_type_yunzhupaasId=='ORG'">
            <a-form-item name="industry_code">
              <template #label>行业代码 </template> <p>{{ dataForm.industry_code }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="8" class="ant-col-item" v-if="dataForm.entity_type_yunzhupaasId=='ORG'">
            <a-form-item name="enterprise_scale">
              <template #label>企业规模 </template> <p>{{ dataForm.enterprise_scale }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="8" class="ant-col-item" v-if="dataForm.entity_type_yunzhupaasId=='ORG'">
            <a-form-item name="registration_date">
              <template #label>成立日期 </template> <p>{{ dataForm.registration_date }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="8" class="ant-col-item">
            <a-form-item name="registered_capital">
              <template #label>注册资本 </template>
              <YunzhupaasInputNumber
                v-model:value="dataForm.registered_capital"
                placeholder="请输入"
                disabled
                detailed
                :style="{ width: '100%' }"
                :step="1"
                :controls="false"
                addonAfter="万元">
              </YunzhupaasInputNumber>
            </a-form-item>
          </a-col>
          <a-col :span="8" class="ant-col-item">
            <a-form-item name="legal_representative">
              <template #label>法定代表人 </template>
              <YunzhupaasInput
                v-model:value="dataForm.legal_representative"
                placeholder="请输入"
                disabled
                detailed
                allowClear
                :style="{ width: '100%' }"
                :maskConfig="maskConfig.legal_representative">
              </YunzhupaasInput>
            </a-form-item>
          </a-col>
          <a-col :span="8" class="ant-col-item">
            <a-form-item name="phone">
              <template #label>联系电话 </template>
              <YunzhupaasInput
                v-model:value="dataForm.phone"
                placeholder="请输入"
                disabled
                detailed
                allowClear
                :style="{ width: '100%' }"
                :maskConfig="maskConfig.phone">
              </YunzhupaasInput>
            </a-form-item>
          </a-col>
          <a-col :span="8" class="ant-col-item">
            <a-form-item name="email">
              <template #label>邮箱 </template>
              <YunzhupaasInput
                v-model:value="dataForm.email"
                placeholder="请输入"
                disabled
                detailed
                allowClear
                :style="{ width: '100%' }"
                :maskConfig="maskConfig.email">
              </YunzhupaasInput>
            </a-form-item>
          </a-col>
          <a-col :span="8" class="ant-col-item">
            <a-form-item name="website">
              <template #label>网站 </template>
              <YunzhupaasInput
                v-model:value="dataForm.website"
                placeholder="请输入"
                disabled
                detailed
                allowClear
                :style="{ width: '100%' }"
                :maskConfig="maskConfig.website">
              </YunzhupaasInput>
            </a-form-item>
          </a-col>
          <a-col :span="8" class="ant-col-item">
            <a-form-item name="address">
              <template #label>地址 </template>
              <YunzhupaasInput
                v-model:value="dataForm.address"
                placeholder="请输入"
                disabled
                detailed
                allowClear
                :style="{ width: '100%' }"
                :maskConfig="maskConfig.address">
              </YunzhupaasInput>
            </a-form-item>
          </a-col>
          <a-col :span="8" class="ant-col-item">
            <a-form-item name="yunzhupaas_mdm_corporation_yunzhupaas_major_person_id">
              <template #label>负责人 </template> <p>{{ dataForm.yunzhupaas_mdm_corporation_yunzhupaas_major_person_id }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item name="business_scope">
              <template #label>经营范围 </template> <p>{{ dataForm.business_scope }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-form-item name="remark">
              <template #label>备注 </template> <p>{{ dataForm.remark }}</p>
            </a-form-item>
          </a-col>
          <a-col :span="24" class="ant-col-item">
            <a-tabs v-model:activeKey="state.activetabformItem509c12" tabPosition="top" class="mb-20">
              <a-tab-pane tab="发票抬头" key="1" forceRender>
                <a-row :gutter="15">
                  <a-col :span="24" class="ant-col-item mb-20px">
                    <a-form-item>
                      <a-table
                        :data-source="dataForm.tableField5ced3a"
                        :columns="company_invoiceColumns"
                        size="small"
                        :pagination="false"
                        :scroll="{ x: 'max-content' }">
                        <template #headerCell="{ column }">
                          <span class="required-sign" v-if="column.required">*</span>
                          {{ column.title }}
                          <BasicHelp :text="column.tipLabel" v-if="column.tipLabel && column.title" />
                        </template>
                        <template #bodyCell="{ column, index, record }">
                          <template v-if="column.key === 'index'">{{ index + 1 }}</template>
                          <template v-if="column.key === 'title_code'">
                            <p>{{ record.title_code }}</p>
                          </template>
                          <template v-if="column.key === 'title_name'">
                            <YunzhupaasInput
                              v-model:value="record.title_name"
                              placeholder="请输入"
                              disabled
                              detailed
                              allowClear
                              :style="{ width: '100%' }"
                              :maskConfig="maskConfig.company_invoicetitle_name">
                            </YunzhupaasInput>
                          </template>
                          <template v-if="column.key === 'credit_code'">
                            <YunzhupaasInput
                              v-model:value="record.credit_code"
                              placeholder="请输入"
                              disabled
                              detailed
                              allowClear
                              :style="{ width: '100%' }"
                              :maskConfig="maskConfig.company_invoicecredit_code">
                            </YunzhupaasInput>
                          </template>
                          <template v-if="column.key === 'tax_type'">
                            <p>{{ record.tax_type }}</p>
                          </template>
                          <template v-if="column.key === 'address'">
                            <YunzhupaasInput
                              v-model:value="record.address"
                              placeholder="请输入"
                              disabled
                              detailed
                              allowClear
                              :style="{ width: '100%' }"
                              :maskConfig="maskConfig.company_invoiceaddress">
                            </YunzhupaasInput>
                          </template>
                          <template v-if="column.key === 'phone'">
                            <YunzhupaasInput
                              v-model:value="record.phone"
                              placeholder="请输入"
                              disabled
                              detailed
                              allowClear
                              :style="{ width: '100%' }"
                              :maskConfig="maskConfig.company_invoicephone">
                            </YunzhupaasInput>
                          </template>
                          <template v-if="column.key === 'bank_name'">
                            <YunzhupaasInput
                              v-model:value="record.bank_name"
                              placeholder="请输入"
                              disabled
                              detailed
                              allowClear
                              :style="{ width: '100%' }"
                              :maskConfig="maskConfig.company_invoicebank_name">
                            </YunzhupaasInput>
                          </template>
                          <template v-if="column.key === 'bank_account'">
                            <YunzhupaasInput
                              v-model:value="record.bank_account"
                              placeholder="请输入"
                              disabled
                              detailed
                              allowClear
                              :style="{ width: '100%' }"
                              :maskConfig="maskConfig.company_invoicebank_account">
                            </YunzhupaasInput>
                          </template>
                          <template v-if="column.key === 'is_defalut'">
                            <p>{{ record.is_defalut }}</p>
                          </template>
                          <template v-if="column.key === 'is_valid'">
                            <p>{{ record.is_valid }}</p>
                          </template>
                          <template v-if="column.key === 'remark'">
                            <YunzhupaasInput
                              v-model:value="record.remark"
                              placeholder="请输入"
                              disabled
                              detailed
                              allowClear
                              :style="{ width: '100%' }"
                              :maskConfig="maskConfig.company_invoiceremark">
                            </YunzhupaasInput>
                          </template>
                        </template>
                      </a-table>
                    </a-form-item>
                  </a-col>
                </a-row>
              </a-tab-pane>
              <a-tab-pane tab="银行账户" key="2" forceRender>
                <a-row :gutter="15">
                  <a-col :span="24" class="ant-col-item mb-20px">
                    <a-form-item>
                      <a-table
                        :data-source="dataForm.tableFieldbd0aa4"
                        :columns="companyBankColumns"
                        size="small"
                        :pagination="false"
                        :scroll="{ x: 'max-content' }">
                        <template #headerCell="{ column }">
                          <span class="required-sign" v-if="column.required">*</span>
                          {{ column.title }}
                          <BasicHelp :text="column.tipLabel" v-if="column.tipLabel && column.title" />
                        </template>
                        <template #bodyCell="{ column, index, record }">
                          <template v-if="column.key === 'index'">{{ index + 1 }}</template>
                          <template v-if="column.key === 'bank_name'">
                            <YunzhupaasInput
                              v-model:value="record.bank_name"
                              placeholder="请输入"
                              disabled
                              detailed
                              allowClear
                              :style="{ width: '100%' }"
                              :maskConfig="maskConfig.companyBankbank_name">
                            </YunzhupaasInput>
                          </template>
                          <template v-if="column.key === 'bank_account_name'">
                            <YunzhupaasInput
                              v-model:value="record.bank_account_name"
                              placeholder="请输入"
                              disabled
                              detailed
                              allowClear
                              :style="{ width: '100%' }"
                              :maskConfig="maskConfig.companyBankbank_account_name">
                            </YunzhupaasInput>
                          </template>
                          <template v-if="column.key === 'bank_account_number'">
                            <YunzhupaasInput
                              v-model:value="record.bank_account_number"
                              placeholder="请输入"
                              disabled
                              detailed
                              allowClear
                              :style="{ width: '100%' }"
                              :maskConfig="maskConfig.companyBankbank_account_number">
                            </YunzhupaasInput>
                          </template>
                          <template v-if="column.key === 'bank_province'">
                            <YunzhupaasInput
                              v-model:value="record.bank_province"
                              placeholder="请输入"
                              disabled
                              detailed
                              allowClear
                              :style="{ width: '100%' }"
                              :maskConfig="maskConfig.companyBankbank_province">
                            </YunzhupaasInput>
                          </template>
                          <template v-if="column.key === 'remark'">
                            <YunzhupaasInput
                              v-model:value="record.remark"
                              placeholder="请输入"
                              disabled
                              detailed
                              allowClear
                              :style="{ width: '100%' }"
                              :maskConfig="maskConfig.companyBankremark">
                            </YunzhupaasInput>
                          </template>
                        </template>
                      </a-table>
                    </a-form-item>
                  </a-col>
                </a-row>
              </a-tab-pane>
            </a-tabs>
          </a-col>
          <!-- 表单结束 -->
        </a-row>
      </a-form>
    </a-row>
  </BasicDrawer>
  <!-- 有关联表单详情：开始 -->
  <RelationDetail ref="relationDetailRef" />
  <!-- 有关联表单详情：结束 -->
</template>
<script lang="ts" setup>
  import { getDetailInfo } from './helper/api';
  import { getConfigData } from '@/api/onlineDev/visualDev';
  import { reactive, toRefs, nextTick, ref, computed, unref, toRaw } from 'vue';
  import { BasicModal, useModal } from '@/components/Modal';
  import { BasicDrawer, useDrawer } from '@/components/Drawer';
  // 有关联表单详情
  import RelationDetail from '@/views/common/dynamicModel/list/detail/index.vue';
  // 表单权限
  import { usePermission } from '@/hooks/web/usePermission';
  import { useMessage } from '@/hooks/web/useMessage';
  import { CaretRightOutlined } from '@ant-design/icons-vue';
  import { buildUUID } from '@/utils/uuid';
  import { useI18n } from '@/hooks/web/useI18n';
  import { getDataChange } from '@/api/onlineDev/visualDev';
  import { getDataInterfaceDataInfoByIds } from '@/api/systemData/dataInterface';
  import ExtraRelationInfo from '@/components/yunzhupaas/RelationForm/src/ExtraRelationInfo.vue';

  interface State {
    dataForm: any;
    title: string;
    maskConfig: any;
    interfaceRes: any;
    locationScope: any;
    extraOptions: any;
    extraData: any;

    activetabformItem509c12: any;
  }

  defineOptions({ name: 'Detail' });
  const { createMessage, createConfirm } = useMessage();
  const [registerDrawer, { openDrawer, setDrawerProps, closeDrawer }] = useDrawer();
  const company_invoiceColumns: any[] = computed(() => {
    let list = [
      {
        title: '发票抬头编码',
        dataIndex: 'title_code',
        key: 'title_code',
        labelWidth: '',
        span: '24',
        tipLabel: '',
        required: false,
        style: { width: '100%' },
        align: 'left',
        fixed: false,
        formP: 'title_code',
      },
      {
        title: '发票抬头名称',
        dataIndex: 'title_name',
        key: 'title_name',
        labelWidth: '',
        span: '24',
        tipLabel: '',
        required: false,
        style: { width: '100%' },
        align: 'left',
        fixed: false,
        formP: 'title_name',
      },
      {
        title: '纳税人识别号',
        dataIndex: 'credit_code',
        key: 'credit_code',
        labelWidth: '',
        span: '24',
        tipLabel: '',
        required: false,
        style: { width: '100%' },
        align: 'left',
        fixed: false,
        formP: 'credit_code',
      },
      {
        title: '纳税人类别',
        dataIndex: 'tax_type',
        key: 'tax_type',
        labelWidth: '',
        span: '8',
        tipLabel: '',
        required: false,
        style: { width: '100%' },
        align: 'left',
        fixed: false,
        formP: 'tax_type',
      },
      {
        title: '地址',
        dataIndex: 'address',
        key: 'address',
        labelWidth: '',
        span: '24',
        tipLabel: '',
        required: false,
        style: { width: '100%' },
        align: 'left',
        fixed: false,
        formP: 'address',
      },
      {
        title: '电话',
        dataIndex: 'phone',
        key: 'phone',
        labelWidth: '',
        span: '24',
        tipLabel: '',
        required: false,
        style: { width: '100%' },
        align: 'left',
        fixed: false,
        formP: 'phone',
      },
      {
        title: '开户银行',
        dataIndex: 'bank_name',
        key: 'bank_name',
        labelWidth: '',
        span: '24',
        tipLabel: '',
        required: false,
        style: { width: '100%' },
        align: 'left',
        fixed: false,
        formP: 'bank_name',
      },
      {
        title: '银行账户',
        dataIndex: 'bank_account',
        key: 'bank_account',
        labelWidth: '',
        span: '24',
        tipLabel: '',
        required: false,
        style: { width: '100%' },
        align: 'left',
        fixed: false,
        formP: 'bank_account',
      },
      {
        title: '是否默认抬头',
        dataIndex: 'is_defalut',
        key: 'is_defalut',
        labelWidth: '',
        span: '24',
        tipLabel: '',
        required: false,
        style: '',
        align: 'left',
        fixed: false,
        formP: 'is_defalut',
      },
      {
        title: '是否有效',
        dataIndex: 'is_valid',
        key: 'is_valid',
        labelWidth: '',
        span: '24',
        tipLabel: '',
        required: false,
        style: '',
        align: 'left',
        fixed: false,
        formP: 'is_valid',
      },
      {
        title: '备注',
        dataIndex: 'remark',
        key: 'remark',
        labelWidth: '',
        span: '24',
        tipLabel: '',
        required: false,
        style: { width: '100%' },
        align: 'left',
        fixed: false,
        formP: 'remark',
      },
    ];
    const indexColumn = { title: '序号', showLabel: true, dataIndex: 'index', key: 'index', align: 'center', fixed: 'left', width: 50 };
    //子表复杂表头-处理
    let columnList = list;
    let complexHeaderList: any[] = [];
    if (complexHeaderList.length) {
      let childColumns: any[] = [];
      let firstChildColumns: string[] = [];
      for (let i = 0; i < complexHeaderList.length; i++) {
        const e = complexHeaderList[i];
        e.title = e.fullNameI18nCode ? t(e.fullNameI18nCode, e.fullName) : e.fullName;
        e.align = e.align;
        e.children = [];
        e.yunzhupaasKey = 'complexHeader';
        if (e.childColumns?.length) {
          childColumns.push(...e.childColumns);
          for (let k = 0; k < e.childColumns.length; k++) {
            const item = e.childColumns[k];
            for (let j = 0; j < list.length; j++) {
              const o = list[j];
              if (o.key == item && o.fixed !== 'left' && o.fixed !== 'right') e.children.push({ ...o });
            }
          }
        }
        if (e.children.length) firstChildColumns.push(e.children[0].key);
      }
      complexHeaderList = complexHeaderList.filter(o => o.children.length);
      let newList: any[] = [];
      for (let i = 0; i < list.length; i++) {
        const e = list[i];
        if (!childColumns.includes(e.key) || e.fixed === 'left' || e.fixed === 'right') {
          newList.push(e);
        } else {
          if (firstChildColumns.includes(e.key)) {
            const item = complexHeaderList.find(o => o.childColumns.includes(e.key));
            newList.push(item);
          }
        }
      }
      columnList = newList;
    }
    let columns = [indexColumn, ...columnList];
    const leftFixedList = columns.filter(o => o.fixed === 'left');
    const rightFixedList = columns.filter(o => o.fixed === 'right');
    const noFixedList = columns.filter(o => o.fixed !== 'left' && o.fixed !== 'right');
    return [...leftFixedList, ...noFixedList, ...rightFixedList];
  });
  const companyBankColumns: any[] = computed(() => {
    let list = [
      {
        title: '开户行',
        dataIndex: 'bank_name',
        key: 'bank_name',
        labelWidth: '',
        span: '24',
        tipLabel: '',
        required: false,
        style: { width: '100%' },
        align: 'left',
        fixed: false,
        formP: 'bank_name',
      },
      {
        title: '账户名',
        dataIndex: 'bank_account_name',
        key: 'bank_account_name',
        labelWidth: '',
        span: '24',
        tipLabel: '',
        required: false,
        style: { width: '100%' },
        align: 'left',
        fixed: false,
        formP: 'bank_account_name',
      },
      {
        title: '银行账号',
        dataIndex: 'bank_account_number',
        key: 'bank_account_number',
        labelWidth: '',
        span: '24',
        tipLabel: '',
        required: false,
        style: { width: '100%' },
        align: 'left',
        fixed: false,
        formP: 'bank_account_number',
      },
      {
        title: '开户行城市',
        dataIndex: 'bank_province',
        key: 'bank_province',
        labelWidth: '',
        span: '24',
        tipLabel: '',
        required: false,
        style: { width: '100%' },
        align: 'left',
        fixed: false,
        formP: 'bank_province',
      },
      {
        title: '备注',
        dataIndex: 'remark',
        key: 'remark',
        labelWidth: '',
        span: '24',
        tipLabel: '',
        required: false,
        style: { width: '100%' },
        align: 'left',
        fixed: false,
        formP: 'remark',
      },
    ];
    const indexColumn = { title: '序号', showLabel: true, dataIndex: 'index', key: 'index', align: 'center', fixed: 'left', width: 50 };
    //子表复杂表头-处理
    let columnList = list;
    let complexHeaderList: any[] = [];
    if (complexHeaderList.length) {
      let childColumns: any[] = [];
      let firstChildColumns: string[] = [];
      for (let i = 0; i < complexHeaderList.length; i++) {
        const e = complexHeaderList[i];
        e.title = e.fullNameI18nCode ? t(e.fullNameI18nCode, e.fullName) : e.fullName;
        e.align = e.align;
        e.children = [];
        e.yunzhupaasKey = 'complexHeader';
        if (e.childColumns?.length) {
          childColumns.push(...e.childColumns);
          for (let k = 0; k < e.childColumns.length; k++) {
            const item = e.childColumns[k];
            for (let j = 0; j < list.length; j++) {
              const o = list[j];
              if (o.key == item && o.fixed !== 'left' && o.fixed !== 'right') e.children.push({ ...o });
            }
          }
        }
        if (e.children.length) firstChildColumns.push(e.children[0].key);
      }
      complexHeaderList = complexHeaderList.filter(o => o.children.length);
      let newList: any[] = [];
      for (let i = 0; i < list.length; i++) {
        const e = list[i];
        if (!childColumns.includes(e.key) || e.fixed === 'left' || e.fixed === 'right') {
          newList.push(e);
        } else {
          if (firstChildColumns.includes(e.key)) {
            const item = complexHeaderList.find(o => o.childColumns.includes(e.key));
            newList.push(item);
          }
        }
      }
      columnList = newList;
    }
    let columns = [indexColumn, ...columnList];
    const leftFixedList = columns.filter(o => o.fixed === 'left');
    const rightFixedList = columns.filter(o => o.fixed === 'right');
    const noFixedList = columns.filter(o => o.fixed !== 'left' && o.fixed !== 'right');
    return [...leftFixedList, ...noFixedList, ...rightFixedList];
  });

  const { t } = useI18n();
  const relationDetailRef = ref<any>(null);
  const state = reactive<State>({
    dataForm: {},
    title: t('common.detailText', '详情'),
    maskConfig: {
      company_name: {
        prefixType: 1,
        useUnrealMask: false,
        maskType: 1,
        unrealMaskLength: 1,
        prefixLimit: 0,
        suffixLimit: 0,
        filler: '*',
        prefixSpecifyChar: '',
        suffixType: 1,
        ignoreChar: '',
        suffixSpecifyChar: '',
      },
      short_name: {
        prefixType: 1,
        useUnrealMask: false,
        maskType: 1,
        unrealMaskLength: 1,
        prefixLimit: 0,
        suffixLimit: 0,
        filler: '*',
        prefixSpecifyChar: '',
        suffixType: 1,
        ignoreChar: '',
        suffixSpecifyChar: '',
      },
      credit_code: {
        prefixType: 1,
        useUnrealMask: false,
        maskType: 1,
        unrealMaskLength: 1,
        prefixLimit: 0,
        suffixLimit: 0,
        filler: '*',
        prefixSpecifyChar: '',
        suffixType: 1,
        ignoreChar: '',
        suffixSpecifyChar: '',
      },
      legal_representative: {
        prefixType: 1,
        useUnrealMask: false,
        maskType: 1,
        unrealMaskLength: 1,
        prefixLimit: 0,
        suffixLimit: 0,
        filler: '*',
        prefixSpecifyChar: '',
        suffixType: 1,
        ignoreChar: '',
        suffixSpecifyChar: '',
      },
      phone: {
        prefixType: 1,
        useUnrealMask: false,
        maskType: 1,
        unrealMaskLength: 1,
        prefixLimit: 0,
        suffixLimit: 0,
        filler: '*',
        prefixSpecifyChar: '',
        suffixType: 1,
        ignoreChar: '',
        suffixSpecifyChar: '',
      },
      email: {
        prefixType: 1,
        useUnrealMask: false,
        maskType: 1,
        unrealMaskLength: 1,
        prefixLimit: 0,
        suffixLimit: 0,
        filler: '*',
        prefixSpecifyChar: '',
        suffixType: 1,
        ignoreChar: '',
        suffixSpecifyChar: '',
      },
      website: {
        prefixType: 1,
        useUnrealMask: false,
        maskType: 1,
        unrealMaskLength: 1,
        prefixLimit: 0,
        suffixLimit: 0,
        filler: '*',
        prefixSpecifyChar: '',
        suffixType: 1,
        ignoreChar: '',
        suffixSpecifyChar: '',
      },
      address: {
        prefixType: 1,
        useUnrealMask: false,
        maskType: 1,
        unrealMaskLength: 1,
        prefixLimit: 0,
        suffixLimit: 0,
        filler: '*',
        prefixSpecifyChar: '',
        suffixType: 1,
        ignoreChar: '',
        suffixSpecifyChar: '',
      },
      company_invoicetitle_name: {
        prefixType: 1,
        useUnrealMask: false,
        maskType: 1,
        unrealMaskLength: 1,
        prefixLimit: 0,
        suffixLimit: 0,
        filler: '*',
        prefixSpecifyChar: '',
        suffixType: 1,
        ignoreChar: '',
        suffixSpecifyChar: '',
      },
      company_invoicecredit_code: {
        prefixType: 1,
        useUnrealMask: false,
        maskType: 1,
        unrealMaskLength: 1,
        prefixLimit: 0,
        suffixLimit: 0,
        filler: '*',
        prefixSpecifyChar: '',
        suffixType: 1,
        ignoreChar: '',
        suffixSpecifyChar: '',
      },
      company_invoiceaddress: {
        prefixType: 1,
        useUnrealMask: false,
        maskType: 1,
        unrealMaskLength: 1,
        prefixLimit: 0,
        suffixLimit: 0,
        filler: '*',
        prefixSpecifyChar: '',
        suffixType: 1,
        ignoreChar: '',
        suffixSpecifyChar: '',
      },
      company_invoicephone: {
        prefixType: 1,
        useUnrealMask: false,
        maskType: 1,
        unrealMaskLength: 1,
        prefixLimit: 0,
        suffixLimit: 0,
        filler: '*',
        prefixSpecifyChar: '',
        suffixType: 1,
        ignoreChar: '',
        suffixSpecifyChar: '',
      },
      company_invoicebank_name: {
        prefixType: 1,
        useUnrealMask: false,
        maskType: 1,
        unrealMaskLength: 1,
        prefixLimit: 0,
        suffixLimit: 0,
        filler: '*',
        prefixSpecifyChar: '',
        suffixType: 1,
        ignoreChar: '',
        suffixSpecifyChar: '',
      },
      company_invoicebank_account: {
        prefixType: 1,
        useUnrealMask: false,
        maskType: 1,
        unrealMaskLength: 1,
        prefixLimit: 0,
        suffixLimit: 0,
        filler: '*',
        prefixSpecifyChar: '',
        suffixType: 1,
        ignoreChar: '',
        suffixSpecifyChar: '',
      },
      company_invoiceremark: {
        prefixType: 1,
        useUnrealMask: false,
        maskType: 1,
        unrealMaskLength: 1,
        prefixLimit: 0,
        suffixLimit: 0,
        filler: '*',
        prefixSpecifyChar: '',
        suffixType: 1,
        ignoreChar: '',
        suffixSpecifyChar: '',
      },
      companyBankbank_name: {
        prefixType: 1,
        useUnrealMask: false,
        maskType: 1,
        unrealMaskLength: 1,
        prefixLimit: 0,
        suffixLimit: 0,
        filler: '*',
        prefixSpecifyChar: '',
        suffixType: 1,
        ignoreChar: '',
        suffixSpecifyChar: '',
      },
      companyBankbank_account_name: {
        prefixType: 1,
        useUnrealMask: false,
        maskType: 1,
        unrealMaskLength: 1,
        prefixLimit: 0,
        suffixLimit: 0,
        filler: '*',
        prefixSpecifyChar: '',
        suffixType: 1,
        ignoreChar: '',
        suffixSpecifyChar: '',
      },
      companyBankbank_account_number: {
        prefixType: 1,
        useUnrealMask: false,
        maskType: 1,
        unrealMaskLength: 1,
        prefixLimit: 0,
        suffixLimit: 0,
        filler: '*',
        prefixSpecifyChar: '',
        suffixType: 1,
        ignoreChar: '',
        suffixSpecifyChar: '',
      },
      companyBankbank_province: {
        prefixType: 1,
        useUnrealMask: false,
        maskType: 1,
        unrealMaskLength: 1,
        prefixLimit: 0,
        suffixLimit: 0,
        filler: '*',
        prefixSpecifyChar: '',
        suffixType: 1,
        ignoreChar: '',
        suffixSpecifyChar: '',
      },
      companyBankremark: {
        prefixType: 1,
        useUnrealMask: false,
        maskType: 1,
        unrealMaskLength: 1,
        prefixLimit: 0,
        suffixLimit: 0,
        filler: '*',
        prefixSpecifyChar: '',
        suffixType: 1,
        ignoreChar: '',
        suffixSpecifyChar: '',
      },
    },
    interfaceRes: {
      company_invoicebank_name: [],
      companyBankbank_account_number: [],
      companyBankremark: [],
      company_invoicephone: [],
      industry_code: [],
      remark: [],
      company_invoicetax_type: [],
      company_invoiceis_defalut: [],
      credit_code: [],
      yunzhupaas_mdm_corporation_yunzhupaas_major_person_id: [],
      company_code: [],
      company_invoiceaddress: [],
      email: [],
      website: [],
      address: [],
      company_invoicebank_account: [],
      companyBankbank_account_name: [],
      company_invoicetitle_code: [],
      legal_representative: [],
      enterprise_nature: [],
      registered_capital: [],
      companyBankbank_province: [],
      company_invoicecredit_code: [],
      company_invoiceis_valid: [],
      business_scope: [],
      company_invoiceremark: [],
      entity_type: [],
      registration_date: [],
      tax_type: [],
      province_id: [],
      phone: [],
      org_id: [],
      company_name: [],
      short_name: [],
      enterprise_scale: [],
      company_invoicetitle_name: [],
      companyBankbank_name: [],
    },
    locationScope: {},
    extraOptions: {},
    extraData: {},
    activetabformItem509c12: '1',
  });
  const { title, dataForm, maskConfig } = toRefs(state);
  // 表单权限
  const { hasFormP } = usePermission();

  defineExpose({ init });

  function init(data) {
    state.dataForm.id = data.id;
    openDrawer();
    nextTick(() => {
      setTimeout(initData, 0);
    });
  }
  function initData() {
    changeLoading(true);
    state.activetabformItem509c12 = '1';
    if (state.dataForm.id) {
      getData(state.dataForm.id);
    } else {
      closeDrawer();
    }
  }
  function getData(id) {
    getDetailInfo(id).then(res => {
      state.dataForm = res.data || {};
      nextTick(() => {
        changeLoading(false);
      });
    });
  }

  function toDetail(modelId, id, propsValue) {
    if (!id) return;
    getConfigData(modelId).then(res => {
      if (!res.data || !res.data.formData) return;
      const formConf = JSON.parse(res.data.formData);
      formConf.popupType = 'general';
      formConf.hasPrintBtn = false;
      formConf.customBtns = [];
      const data = { id, formConf, modelId, propsValue };
      relationDetailRef.value?.init(data);
    });
  }
  function setFormProps(data) {
    setDrawerProps(data);
  }
  function changeLoading(loading) {
    setFormProps({ loading });
  }

  function getParamList(key) {
    let templateJson: any[] = state.interfaceRes[key];
    if (!templateJson || !templateJson.length || !state.dataForm) return templateJson;
    for (let i = 0; i < templateJson.length; i++) {
      if (templateJson[i].relationField && templateJson[i].sourceType == 1) {
        templateJson[i].defaultValue = state.dataForm[templateJson[i].relationField + '_id'] || '';
      }
    }
    return templateJson;
  }
</script>