kd-aiot-frontend-eom/src/views/purchasingManage/producerManage/components/addContactDialog.vue

<template>
  <ele-modal
    custom-class="ele-dialog-form long-dialog-form"
    :centered="true"
    v-if="visible"
    :visible.sync="visible"
    :title="title"
    :close-on-click-modal="false"
    width="70%"
    @close="cancel"
    :maxable="true"
    :resizable="true"
  >
    <el-tabs v-model="activeName" type="card" @tab-click="handleActive">
      <el-tab-pane label="基本信息" :name="1">
        <headerTitle title="基本信息" style="margin-top: 30px"></headerTitle>
        <el-form
          label-width="120px"
          ref="form"
          :model="form"
          :rules="rules"
          class="el-form-box"
        >
          <el-row>
            <el-col :span="8">
              <el-form-item label="生产厂家分类" prop="categoryId">
                <ele-tree-select
                  multiple
                  filterable
                  :checkStrictly="true"
                  :data="categoryTreeList"
                  v-model="categoryIdList"
                  valueKey="id"
                  labelKey="name"
                  placeholder="请选择"
                  default-expand-all
                />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="是否受托企业">
                <el-select
                  v-model="form.isEntrustedEnterprise"
                  placeholder="请选择"
                  style="width: 100%"
                >
                  <el-option label="是" :value="1"></el-option>
                  <el-option label="否" :value="0"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="名称" prop="name">
                <el-input
                  placeholder="请输入"
                  v-model="form.name"
                  maxlength="50"
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="8">
              <el-form-item label="生产厂家代号" prop="serialNo">
                <el-input
                  placeholder="请输入"
                  v-model="form.serialNo"
                  maxlength="50"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="生产厂家简称" prop="simpleName">
                <el-input
                  placeholder="请输入"
                  v-model="form.simpleName"
                  maxlength="50"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="注册资金" prop="registeredCapital">
                <el-input
                  placeholder="请输入"
                  v-model="form.registeredCapital"
                  maxlength="50"
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="8">
              <el-form-item label="授信额度" prop="authorizationLimit">
                <el-input
                  placeholder="请输入"
                  v-model="form.authorizationLimit"
                  maxlength="17"
                  oninput="value=value.replace(/[^0-9.]/g,'')"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="单位电话" prop="phone">
                <el-input
                  placeholder="请输入"
                  v-model="form.phone"
                  maxlength="20"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="地址" prop="addressId">
                <el-cascader
                  clearable
                  v-model="form.addressId"
                  filterable
                  :options="options.cityData"
                  ref="address"
                  style="width: 100%"
                ></el-cascader>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="8">
              <el-form-item label="详细地址" prop="address">
                <el-input
                  placeholder="请输入"
                  v-model="form.address"
                  maxlength="50"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item
                label="统一社会信用代码	"
                prop="unifiedSocialCreditCode"
                class="form_item_label"
              >
                <el-input
                  placeholder="请输入"
                  v-model="form.unifiedSocialCreditCode"
                  maxlength="18"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="所属行业" prop="industry">
                <el-cascader
                  :options="options.categoryData"
                  v-model="form.industry"
                  style="width: 100%"
                  ref="industry"
                >
                </el-cascader>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="8">
              <el-form-item label="营业类型" prop="companyCategoryId">
                <DictSelection
                  dictName="营业类型"
                  clearable
                  v-model="form.companyCategoryId"
                >
                </DictSelection>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="登记日期" prop="registerDate">
                <el-date-picker
                  style="width: 100%"
                  clearable
                  v-model="form.registerDate"
                  type="date"
                  value-format="yyyy-MM-dd"
                  placeholder="请选择日期"
                >
                </el-date-picker>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="经营范围" prop="businessScope">
                <el-input
                  placeholder="请输入"
                  v-model="form.businessScope"
                  maxlength="100"
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="8">
              <el-form-item label="主营产品" prop="mainProduct">
                <el-input
                  placeholder="请输入"
                  v-model="form.mainProduct"
                  maxlength="100"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="关联上级单位" prop="parentId">
                <el-input
                  placeholder="请选择关联上级单位"
                  v-model="form.parentName"
                  readonly
                  @click.native="handParent"
                ></el-input>
              </el-form-item>
            </el-col>

            <el-col :span="8">
              <el-form-item label="级别">
                <DictSelection
                  dictName="生产厂家级别"
                  clearable
                  v-model="form.level"
                >
                </DictSelection>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="16">
              <el-form-item label="备注" prop="remark">
                <el-input
                  type="textarea"
                  resize="none"
                  v-model="form.remark"
                  :rows="2"
                  placeholder="请输入"
                  size="small"
                  maxlength="200"
                ></el-input>
              </el-form-item>
              <el-col :span="8">
                <el-form-item prop="businessLicenseFiles" label="营业执照附件">
                  <fileMain v-model="form.businessLicenseFile"></fileMain>
                  <!--                  <fileUpload-->
                  <!--                    v-model="form.businessLicenseFiles"-->
                  <!--                    module="main"-->
                  <!--                    :showLib="false"-->
                  <!--                    :limit="1"-->
                  <!--                  />-->
                </el-form-item>
              </el-col>
            </el-col>
            <el-col :span="8">
              <el-form-item label="法定代表人" prop="legalPerson">
                <el-input
                  placeholder="请输入"
                  v-model="form.legalPerson"
                  maxlength="50"
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </el-tab-pane>
      <el-tab-pane label="银行信息" :name="2">
        <headerTitle title="银行信息" style="margin-top: 30px"></headerTitle>
        <ele-pro-table
          ref="table"
          :columns="bankColumns"
          :datasource="tableBankData"
          height="350px"
          :need-page="false"
        >
          <!-- 表头工具栏 -->
          <template v-slot:toolbar>
            <el-button type="primary" @click="addBank">添加</el-button>
          </template>
          <template v-slot:action="{ row, $index }">
            <el-link type="primary" @click="handleBankDel(row, $index)"
              >删除</el-link
            >
          </template>
          <template v-slot:accountNameHeader="{ column }">
            <span>{{ column.label }}</span
            ><span style="color: red">*</span>
          </template>

          <template v-slot:accountName="{ row }">
            <el-input
              v-model="row.accountName"
              placeholder="请输入"
              maxlength="50"
            ></el-input>
          </template>
          <template v-slot:accountNo="{ row }">
            <el-input
              v-model="row.accountNo"
              placeholder="请输入"
              maxlength="50"
            ></el-input>
          </template>
          <template v-slot:bankName="{ row }">
            <el-input
              v-model="row.bankName"
              placeholder="请输入"
              maxlength="50"
            ></el-input>
          </template>
          <template v-slot:interbankNo="{ row }">
            <el-input
              v-model="row.interbankNo"
              placeholder="请输入"
              maxlength="50"
            ></el-input>
          </template>
        </ele-pro-table>
      </el-tab-pane>
      <el-tab-pane label="联系人信息" :name="3">
        <headerTitle title="联系人信息" style="margin-top: 30px"></headerTitle>
        <ele-pro-table
          ref="linkTable"
          :columns="linkColumns"
          :datasource="tableLinkData"
          height="350px"
          :need-page="false"
        >
          <!-- 表头工具栏 -->
          <template v-slot:toolbar>
            <el-button type="primary" @click="addLink">添加</el-button>
          </template>
          <template v-slot:action="{ row, $index }">
            <el-link type="primary" @click="handleLinkDel(row, $index)"
              >删除</el-link
            >
          </template>
          <template v-slot:linkNameHeader="{ column }">
            <span>{{ column.label }}</span
            ><span style="color: red">*</span>
          </template>
          <template v-slot:mobilePhoneHeader="{ column }">
            <span>{{ column.label }}</span
            ><span style="color: red">*</span>
          </template>
          <template v-slot:statusHeader="{ column }">
            <span>{{ column.label }}</span
            ><span style="color: red">*</span>
          </template>

          <template v-slot:linkName="{ row }">
            <el-input
              v-model="row.linkName"
              placeholder="请输入"
              maxlength="50"
            ></el-input>
          </template>
          <template v-slot:mobilePhone="{ row }">
            <el-input
              v-model="row.mobilePhone"
              placeholder="请输入"
              maxlength="20"
            ></el-input>
          </template>

          <template v-slot:phone="{ row }">
            <el-input
              v-model="row.phone"
              placeholder="请输入"
              maxlength="20"
            ></el-input>
          </template>

          <template v-slot:wechat="{ row }">
            <el-input
              v-model="row.wechat"
              placeholder="请输入"
              maxlength="5cls0"
            ></el-input>
          </template>
          <template v-slot:email="{ row }">
            <el-input
              v-model="row.email"
              placeholder="请输入"
              maxlength="50"
            ></el-input>
          </template>
          <template v-slot:post="{ row }">
            <el-input
              v-model="row.post"
              placeholder="请输入"
              maxlength="20"
            ></el-input>
          </template>
          <template v-slot:ifChief="{ row, $index }">
            <el-select
              v-model="row.ifChief"
              placeholder="请选择"
              class="w100"
              @change="
                (value) => {
                  ifChiefChange(value, $index);
                }
              "
            >
              <el-option
                v-for="item in ifChiefList"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </template>
          <template v-slot:status="{ row }">
            <DictSelection
              dictName="联系人状态"
              v-model="row.status"
            ></DictSelection>
          </template>
          <template v-slot:remark="{ row }">
            <el-input
              v-model="row.remark"
              placeholder="请输入"
              maxlength="50"
            ></el-input>
          </template>
        </ele-pro-table>
      </el-tab-pane>
      <el-tab-pane label="其他信息" :name="4">
        <headerTitle title="其他信息" style="margin-top: 30px"></headerTitle>
        <el-form
          label-width="100px"
          ref="otherForm"
          :model="otherForm"
          :rules="otherRules"
          class="el-form-box"
        >
          <el-row>
            <el-col :span="8">
              <el-form-item label="结算方式" prop="settlementMode">
                <DictSelection
                  dictName="结算方式"
                  clearable
                  @itemChange="settlementModeChange"
                  v-model="otherForm.settlementMode"
                >
                </DictSelection>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="税率" prop="taxRate">
                <el-input
                  v-model="otherForm.taxRate"
                  maxlength="5"
                  oninput="value=value.replace(/[^0-9.]/g,'')"
                >
                  <template slot="append">%</template>
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="折扣率" prop="discount">
                <el-input
                  v-model="otherForm.discount"
                  maxlength="5"
                  oninput="value=value.replace(/[^0-9.]/g,'')"
                >
                  <template slot="append">%</template>
                </el-input>
              </el-form-item>
            </el-col>
            <!-- <el-col :span="8">
              <el-form-item label="分管部门" prop="deptId" style="margin-bottom: 22px">
                <ele-tree-select clearable :data="groupTreeData" v-model="otherForm.deptId" valueKey="id" labelKey="name"
                  placeholder="请选择" @change="change_principalDep" default-expand-all />
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="业务员" prop="salesmanId">
                <personSelect ref="directorRef" v-model="otherForm.salesmanId" @selfChange="salesmanChange"
                  :init="false" />
              </el-form-item>
            </el-col> -->

            <el-col :span="8">
              <el-form-item label="寄件人">
                <el-input
                  placeholder="请输入"
                  v-model="otherForm.sender"
                  maxlength="50"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="寄件人电话">
                <el-input
                  placeholder="请输入"
                  v-model="otherForm.senderPhone"
                  maxlength="20"
                ></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="寄件人地址">
                <el-cascader
                  clearable
                  v-model="otherForm.addressId"
                  :options="options.cityData"
                  ref="sendAddress"
                  style="width: 100%"
                ></el-cascader>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="寄件人详细地址" class="form_item_label">
                <el-input
                  placeholder="请输入"
                  v-model="otherForm.address"
                  maxlength="50"
                ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
      </el-tab-pane>
      <el-tab-pane label="供货列表" :name="5">
        <headerTitle title="供货列表" style="margin-top: 30px"></headerTitle>
        <ele-pro-table
          ref="supplyRef"
          :columns="supplyColumns"
          :need-page="false"
          :datasource="supplyList"
          height="350px"
        >
          <!-- 表头工具栏 -->
          <template v-slot:toolbar>
            <el-button type="primary" @click="handSelectSupply">新增</el-button>
          </template>
          <!-- 操作栏 -->
          <template v-slot:action="scope">
            <el-popconfirm
              class="ele-action"
              title="确定要删除此产品吗？"
              @confirm="handleRemoveSupply(scope.$index)"
            >
              <template v-slot:reference>
                <el-link type="danger" :underline="false" icon="el-icon-delete">
                  删除
                </el-link>
              </template>
            </el-popconfirm>
          </template>
        </ele-pro-table>
      </el-tab-pane>
      <el-tab-pane label="证书资质" :name="6">
        <headerTitle title="证书资质" style="margin-top: 30px"></headerTitle>
        <ele-pro-table
          ref="certificateTable"
          :columns="certificateColumns"
          :need-page="false"
          :datasource="tableCertificateData"
          height="350px"
        >
          <!-- 表头工具栏 -->
          <template v-slot:toolbar>
            <el-button
              type="primary"
              v-if="form.id"
              @click="addCertificate('add', '')"
              >新增</el-button
            >
          </template>
          <!-- 操作栏 -->
          <template v-slot:action="scope">
            <el-link
              v-if="[1, 2].includes(scope.row.processStatus)"
              type="primary"
              :underline="false"
              icon="el-icon-edit"
              @click="addCertificate('view', scope.row)"
            >
              详情
            </el-link>
            <el-link
              v-if="
                (isNeed_process_is_close &&
                  [0, 3].includes(scope.row.processStatus)) ||
                !isNeed_process_is_close
              "
              type="primary"
              :underline="false"
              icon="el-icon-edit"
              @click="addCertificate('update', scope.row)"
            >
              修改
            </el-link>

            <el-link
              v-if="
                (isNeed_process_is_close &&
                  [0, 3].includes(scope.row.processStatus)) ||
                !isNeed_process_is_close
              "
              type="primary"
              :underline="false"
              icon="el-icon-plus"
              @click="submit(scope.row)"
              v-click-once
            >
              提交
            </el-link>

            <el-popconfirm
              class="ele-action"
              title="确定要删除此资质吗？"
              @confirm="handleRemove(scope.row)"
            >
              <template v-slot:reference>
                <el-link
                  v-if="
                    (isNeed_process_is_close &&
                      [0, 3].includes(scope.row.processStatus)) ||
                    !isNeed_process_is_close
                  "
                  type="danger"
                  :underline="false"
                  icon="el-icon-delete"
                >
                  删除
                </el-link>
              </template>
            </el-popconfirm>
          </template>
        </ele-pro-table>
      </el-tab-pane>
    </el-tabs>

    <div slot="footer" class="footer">
      <el-button
        type="primary"
        @click="pageChange('up')"
        :disabled="activeName == 1"
        >上一步</el-button
      >
      <el-button
        type="primary"
        @click="pageChange('next')"
        :disabled="activeName == 6"
        >下一步</el-button
      >
      <el-button
        type="primary"
        v-if="activeName == 6 || title != '新建生产厂家'"
        @click="save"
        v-click-once
        >保存</el-button
      >
      <el-button @click="cancel">返回</el-button>
    </div>

    <parentList
      ref="parentRef"
      :classType="3"
      @changeParent="changeParent"
    ></parentList>
    <!-- 资质证书弹窗   -->
    <certificate-qualifications-dialog
      :certificate-qualifications-dialog-flag.sync="
        certificateQualificationsDialogFlag
      "
      v-if="certificateQualificationsDialogFlag"
      typeInfo="2"
      ref="certificateQualificationsDialogRef"
      :contactInfo="form"
      @reload="reload"
    >
    </certificate-qualifications-dialog>
    <product-list
      ref="productListRef"
      :data="supplyList"
      @changeParent="getSupplyList"
    ></product-list>
  </ele-modal>
</template>

<script>
  import {
    contactDetail,
    contactQcPackPageAPI,
    contactSave,
    contactUpdate,
    contactQcPackDeleteAPI,
    contactQcSubmit
  } from '@/api/saleManage/contact';
  import { categoryData } from 'element-china-category-data';
  import fileUpload from '@/components/upload/fileUpload';
  import { cityData } from 'ele-admin/packages/utils/regions';
  import dictMixins from '@/mixins/dictMixins';
  import deptSelect from '@/components/CommomSelect/dept-select.vue';
  import personSelect from '@/components/CommomSelect/person-select.vue';
  import { listOrganizations } from '@/api/system/organization';
  import { copyObj } from '@/utils/util';
  import certificateQualificationsDialog from '@/views/purchasingManage/supplierManage/components/certificateQualificationsDialog.vue';
  import parentList from './parentList.vue';
  import { reviewStatus,lbjtList } from '@/enum/dict';
  import productList from '@/BIZComponents/product-list.vue';
  import fileMain from '@/components/addDoc/index.vue';

  export default {
    props: {
      categoryTreeList: Array
    },
    mixins: [dictMixins],
    components: {
      fileMain,
      productList,
      fileUpload,
      deptSelect,
      personSelect,
      parentList,
      certificateQualificationsDialog
    },
    data() {
      let formDef = {
        address: '',
        addressId: 0,
        addressName: '',
        authorizationLimit: 0,
        businessLicenseFiles: [],
        businessLicenseFile: [],
        businessScope: '',
        categoryId: '',
        level: '',
        companyCategoryId: '',
        companyCategoryName: '',
        parentId: null,
        industry: '',
        industryCode: '',
        industryFullName: '',
        mainProduct: '',
        name: '',
        officialIndustry: '',
        phone: '',
        registerDate: '',
        legalPerson: '',
        registeredCapital: '',
        remark: '',
        serialNo: '',
        simpleName: '',
        type: 3,
        unifiedSocialCreditCode: ''
      };
      let otherFormDef = {
        settlementMode: '',
        settlementModeName: '',
        taxRate: 0,
        address: '',
        addressId: '',
        deptId: '',
        deptName: '',
        discount: 0,
        salesmanId: '',
        salesmanName: '',
        sender: '',
        senderPhone: ''
      };
      return {
        visible: false,
        certificateQualificationsDialogFlag: false,
        title: '',
        row: {},
        activeName: 1,
        formDef,
        otherFormDef,
        form: copyObj(formDef),
        otherForm: copyObj(otherFormDef),
        // removeBankList: [],
        // removeLinkList: [],
        tableBankData: [],
        tableLinkData: [],
        categoryIdList: [],
        supplyList: [],
        ifChiefList: [
          {
            value: 0,
            label: '否'
          },
          {
            value: 1,
            label: '是'
          }
        ],
        bankColumns: [
          {
            type: 'index',
            width: 55,
            align: 'center'
          },
          {
            label: '单位名称',
            prop: 'accountName',
            slot: 'accountName',
            action: 'accountName',
            headerSlot: 'accountNameHeader',
            align: 'center'
          },
          {
            label: '银行账号',
            prop: 'accountNo',
            slot: 'accountNo',
            action: 'accountNo',
            align: 'center'
          },
          {
            label: '开户行',
            prop: 'bankName',
            slot: 'bankName',
            action: 'bankName',
            align: 'center'
          },
          {
            label: '银行银联号',
            prop: 'interbankNo',
            slot: 'interbankNo',
            action: 'interbankNo',
            align: 'center'
          },
          {
            action: 'action',
            slot: 'action',
            label: '操作',
            align: 'center'
          }
        ],
        linkColumns: [
          {
            type: 'index',
            width: 55,
            align: 'center'
          },
          {
            label: '姓名',
            prop: 'linkName',
            slot: 'linkName',
            action: 'linkName',
            headerSlot: 'linkNameHeader',
            align: 'center'
          },
          {
            label: '手机',
            prop: 'mobilePhone',
            slot: 'mobilePhone',
            action: 'mobilePhone',
            headerSlot: 'mobilePhoneHeader',
            align: 'center'
          },

          {
            label: '电话',
            prop: 'phone',
            slot: 'phone',
            action: 'phone',
            align: 'center'
          },

          {
            label: '微信号',
            prop: 'wechat',
            slot: 'wechat',
            action: 'wechat',
            align: 'center'
          },

          {
            label: '邮箱',
            prop: 'email',
            slot: 'email',
            action: 'email',
            align: 'center'
          },
          {
            label: '职务',
            prop: 'post',
            slot: 'post',
            action: 'post',
            align: 'center'
          },
          {
            label: '状态',
            prop: 'status',
            slot: 'status',
            action: 'status',
            headerSlot: 'statusHeader',
            align: 'center'
          },
          {
            label: '是否首要',
            prop: 'ifChief',
            slot: 'ifChief',
            action: 'ifChief',
            align: 'center'
          },
          {
            label: '备注',
            prop: 'remark',
            slot: 'remark',
            action: 'remark',
            align: 'center'
          },
          {
            action: 'action',
            slot: 'action',
            label: '操作',
            align: 'center'
          }
        ],
        certificateColumns: [
          {
            type: 'index',
            width: 55,
            align: 'center'
          },
          {
            label: '编码',
            prop: 'code',
            slot: 'code',
            align: 'center',
            minWidth: 120
          },
          {
            label: '名称',
            prop: 'name',
            slot: 'name',
            align: 'center',
            minWidth: 120
          },
          // {
          //   label: '创建人',
          //   prop: 'createUserName',
          //   slot: 'createUserName',
          //   align: "center",
          //   width: 120
          // },
          {
            label: '创建时间',
            prop: 'createTime',
            slot: 'createTime',
            align: 'center',
            minWidth: 120
          },
          {
            label: '备注',
            prop: 'remark',
            slot: 'remark',
            align: 'center',
            minWidth: 120
          },
          {
            label: '状态',
            prop: 'processStatus',
            slot: 'processStatus',
            align: 'center',
            width: 120,
            formatter: (_row, _column, cellValue) => {
              return reviewStatus[_row.processStatus];
            }
          },
          {
            action: 'action',
            slot: 'action',
            label: '操作',
            align: 'center',
            width: 200
          }
        ],
        supplyColumns: [
          {
            columnKey: 'index',
            type: 'index',
            width: 50,
            align: 'center',
            showOverflowTooltip: true,
            label: '序号'
          },
          {
            prop: 'productCode',
            label: '编码',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 110
          },
          {
            prop: 'productName',
            label: '名称',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 110
          },
          {
            prop: 'imgCode',
            align: 'center',
            label: '图号/件号',
            showOverflowTooltip: true,
            minWidth: 110
          },
          {
            prop: 'produceType',
            align: 'center',
            label: '属性类型',
            showOverflowTooltip: true,
            minWidth: 110,
            formatter: (row, column) => {
              if (row.produceType) {
                return row.produceType
                  .map((item) => {
                    return lbjtList[item];
                  })
                  .toString();
              }
            }
          },
          // {
          //   prop: 'approvalNumber',
          //   align: 'center',
          //   label: '批准文号',
          //   showOverflowTooltip: true,
          //   minWidth: 110
          // },
          {
            prop: 'packingSpecification',
            align: 'center',
            label: '包装规格',
            showOverflowTooltip: true,
            minWidth: 110
          },
          {
            prop: 'brandNum',
            align: 'center',
            label: '牌号',
            showOverflowTooltip: true
          },
          {
            prop: 'modelType',
            label: '型号',
            align: 'center',
            showOverflowTooltip: true
          },
          {
            prop: 'specification',
            label: '规格',
            align: 'center',
            showOverflowTooltip: true
          },
          {
            prop: 'measuringUnit',
            label: '计量单位',
            showOverflowTooltip: true,
            align: 'center',
            minWidth: 90
          },

          // {
          //   prop: 'weightUnit',
          //   label: '重量单位',
          //   showOverflowTooltip: true,
          //   align: 'center',
          //   minWidth: 90
          // },
          //
          // {
          //   prop: 'roughWeight',
          //   label: '毛重',
          //   showOverflowTooltip: true,
          //   align: 'center',
          //   minWidth: 90
          // },
          //
          // {
          //   prop: 'netWeight',
          //   label: '净重',
          //   showOverflowTooltip: true,
          //   align: 'center',
          //   minWidth: 90
          // },
          //
          // {
          //   prop: 'packingUnit',
          //   align: 'center',
          //   label: '包装单位',
          //   showOverflowTooltip: true
          // },
          // {
          //   prop: 'categoryLevelPath',
          //   label: '分类',
          //   align: 'center',
          //   showOverflowTooltip: true
          // },
          {
            slot: 'action',
            align: 'center',
            minWidth: 90,
            fixed: 'right',
            label: '操作'
          }
        ],
        rules: {
          categoryId: [
            { required: true, message: '请选择生产厂家分类', trigger: 'change' }
          ],
          name: [{ required: true, message: '请输入名称', trigger: 'blur' }],
          authorizationLimit: [
            { required: true, message: '请输入授信额度', trigger: 'blur' }
          ],

          addressId: [
            { required: true, message: '请选择地址', trigger: 'change' }
          ]
        },
        otherRules: {
          // settlementMode: [
          //   { required: true, message: '请输入结算方式', trigger: 'blur' }
          // ],
          taxRate: [
            { required: true, message: '请输入税率', trigger: 'change' }
          ],

          sender: [
            { required: true, message: '请输入收件人', trigger: 'change' }
          ],

          senderPhone: [
            { required: true, message: '请输入收件人电话', trigger: 'change' }
          ],

          addressId: [
            { required: true, message: '请选择收件人地址', trigger: 'change' }
          ],

          address: [
            { required: true, message: '请输入收件人详细地址', trigger: 'blur' }
          ]
        },
        options: {
          cityData,
          categoryData
        },
        // 提交状态
        loading: false,
        // 是否是修改
        isUpdate: false,

        // 组织机构树形结构数据
        groupTreeData: [],
        // 组织机构平铺数据
        groupData: []
      };
    },
    watch: {
      categoryIdList(val) {
        if (val.length > 0) {
          this.$refs.form.clearValidate('categoryId');
          this.form.categoryId = this.categoryIdList.join(',');
        } else {
          this.form.categoryId = '';
          this.$refs.form.validateField('categoryId');
        }
      }
    },
    created() {
      this.getGroupAll();
    },
    methods: {
      async open(type, row, contactCategoryId) {
        this.title = type;
        this.row = row;
        this.visible = true;
        if (type == '新建生产厂家') {
          this.isUpdate = false;
          // 默认带出列表页面选中的分类
          this.form.categoryId = contactCategoryId;
        } else {
          this.isUpdate = true;
          await this._getById(row.id);
        }
      },

      // 获取公司数据
      getGroupAll() {
        listOrganizations().then((list) => {
          this.groupData = list;
          this.groupTreeData = this.$util.toTreeData({
            data: list,
            idField: 'id',
            parentIdField: 'parentId'
          });
        });
      },

      handleActive(val) {
        if (val.name == '6') {
          this.reload();
        }
      },
      // 选择负责人部门
      change_principalDep(id) {
        const info = this.groupData.find((e) => e.id == id);
        this.otherForm.deptName = info.name;
        this.otherForm.salesmanId = '';
        this.otherForm.salesmanName = '';
        // 根据部门获取人员
        const params = { groupId: id };
        this.$nextTick(() => {
          this.$refs.directorRef.getList(params);
        });
      },
      salesmanChange(val, info) {
        this.otherForm.salesmanName = info.name;
      },
      settlementModeChange(info) {
        this.otherForm.settlementModeName = info.dictValue;
      },
      ifChiefChange(value, idx) {
        if (value === 1) {
          this.tableLinkData.forEach((e) => (e.ifChief = 0));
          this.tableLinkData[idx].ifChief = 1;
        }
      },
      addBank() {
        this.tableBankData.push({
          accountName: '',
          accountNo: '',
          bankName: '',
          interbankNo: ''
        });
      },
      addLink() {
        this.tableLinkData.push({
          linkName: '',
          mobilePhone: '',
          phone: '',
          email: '',
          post: '',
          status: '',
          ifChief: 0,
          remark: ''
        });
      },
      handleBankDel(row, index) {
        this.tableBankData.splice(index, 1);
        if (row?.id) {
          //   this.removeBankList.push(row.id);
        }
      },
      handleLinkDel(row, index) {
        this.tableLinkData.splice(index, 1);
        if (row?.id) {
          //   this.removeLinkList.push(row.id);
        }
      },
      //新增/查看/修改资质
      addCertificate(type, row) {
        this.certificateQualificationsDialogFlag = true;
        this.$nextTick(() => {
          this.$refs.certificateQualificationsDialogRef.init(type, row);
        });
      },
      /* 证书资质表格数据源 */
      tableCertificateData({ page, limit, where }) {
        if (!this.form.id) return [];
        return contactQcPackPageAPI({
          certificationType: '3',
          relationId: this.form.id
        });
      },
      /* 刷新表格 */
      reload(where) {
        where = {
          certificationType: '3',
          relationId: this.form.id
        };
        this.$refs.certificateTable.reload({ ...where });
      },
      //删除资质包
      handleRemove(row) {
        contactQcPackDeleteAPI([row.id]).then((res) => {
          this.$message.success('删除成功！');
          this.reload();
        });
      },
      formValid() {
        return new Promise((resolve, reject) => {
          this.$refs.form.validate((valid) => {
            if (!valid) {
              this.activeName = 1;
              reject(false);
            } else {
              resolve(true);
            }
          });
        });
      },
      otherFormValid() {
        return new Promise((resolve, reject) => {
          this.$refs.otherForm.validate((valid) => {
            if (!valid) {
              this.activeName = 4;
              reject(false);
            } else {
              resolve(true);
            }
          });
        });
      },
      tableLinkDataValid() {
        return new Promise((resolve, reject) => {
          if (this.tableLinkData.length == 0) {
            this.activeName = 3;
            this.$message.error('联系人信息至少有1条');
            reject(false);
          } else {
            resolve(true);
          }
        });
      },
      getValidate() {
        return Promise.all([
          this.formValid(),
          this.otherFormValid(),
          this.tableLinkDataValid()
        ]);
      },

      async pageChange(type) {
        if (type == 'up') {
          this.activeName -= 1;
        }
        if (type == 'next') {
          if (this.activeName == 1 && !(await this.formValid())) {
            return;
          }
          if (this.activeName == 3 && !(await this.tableLinkDataValid())) {
            this.$message.error('联系人信息至少有1条');
            return;
          }
          if (this.activeName == 4 && !(await this.otherFormValid())) {
            return;
          }
          this.activeName += 1;
        }
      },
      //开启资质提交流程
      async submit(row) {
        await contactQcSubmit({ businessId: row.id, certificationType: '3' });
        this.reload();
      },
      async save() {
        try {
          await this.getValidate();
          // 表单验证通过，执行保存操作
          this.loading = true;
          // 基本信息处理
          if (this.$refs.address.getCheckedNodes()) {
            let node = this.$refs.address.getCheckedNodes()[0];
            if (node) {
              this.form.addressId = node.path.join();
              this.form.addressName = node.pathLabels.join();
            } else {
              this.form.addressId = '';
              this.form.addressName = '';
            }
          }

          if (this.$refs.industry.getCheckedNodes()) {
            let node = this.$refs.industry.getCheckedNodes()[0];
            if (node) {
              this.form.industryCode = node.path.join();
              this.form.industryFullName = node.pathLabels.join();
            } else {
              this.form.industryCode = '';
              this.form.industryFullName = '';
            }
          }
          if (this.form.companyCategoryId) {
            this.form.companyCategoryName = this.getDictValue(
              '营业类型',
              this.form.companyCategoryId
            );
          }
          // if (
          //   this.form.businessLicenseFiles &&
          //   this.form.businessLicenseFiles.length > 0
          // ) {
          //   this.form.businessLicenseFile = this.form.businessLicenseFiles[0];
          // } else {
          //   this.form.businessLicenseFile = null;
          // }

          // 其他信息处理
          if (this.form.settlementMode) {
            this.form.settlementModeName = this.getDictValue(
              '结算方式',
              this.form.settlementMode
            );
          }
          if (this.$refs.sendAddress.getCheckedNodes()) {
            let node = this.$refs.sendAddress.getCheckedNodes()[0];
            if (node) {
              this.otherForm.addressId = node.path.join();
              this.otherForm.addressName = node.pathLabels.join();
            } else {
              this.otherForm.addressId = '';
              this.otherForm.addressName = '';
            }
          }

          if (!this.isUpdate) {
            delete this.form.id;
          } else {
            //   this.form.removeBankList = this.removeBankList;
            //   this.form.removeLinkList = this.removeLinkList;
          }
          const data = {
            base: this.form,
            other: this.otherForm,
            bankList: this.tableBankData,
            linkList: this.tableLinkData,
            productList: this.supplyList
          };
          if (this.isUpdate) {
            contactUpdate(data)
              .then((res) => {
                this.loading = false;
                this.$message.success('修改成功');
                this.cancel();
                this.$emit('done');
              })
              .catch((e) => {
                //this.loading = false;
              });
          } else {
            contactSave(data)
              .then((id) => {
                this.loading = false;
                this.$message.success('新增成功');
                this.cancel();
                this.$emit('done');

                // this._getById(id);
                // this.title = '编辑客户';
                // this.$emit('done');
                // this.isUpdate = true;
              })
              .catch((e) => {
                //this.loading = false;
              });
          }
        } catch (error) {
          // 表单验证未通过，不执行保存操作
        }
      },
      cancel() {
        this.$nextTick(() => {
          this.activeName = 1;
          // 关闭后，销毁所有的表单数据
          this.$refs['otherForm'] && this.$refs['otherForm'].resetFields();
          this.$refs['formRef'] && this.$refs['formRef'].resetFields();
          (this.form = copyObj(this.formDef)),
            (this.otherForm = copyObj(this.otherFormDef)),
            (this.tableBankData = []);
          this.tableLinkData = [];
          this.categoryIdList = [];
          this.visible = false;
        });
      },
      async _getById(id) {
        const data = await contactDetail(id);
        this.form = data.base || {};
        this.otherForm = data.other || {};
        this.tableBankData = data.bankList || [];
        this.tableLinkData = data.linkList || [];
        this.supplyList = data.productList || [];
        // if (
        //   data.base.businessLicenseFile &&
        //   data.base.businessLicenseFile !== ''
        // ) {
        //   this.$set(this.form, 'businessLicenseFiles', [
        //     data.base.businessLicenseFile
        //   ]);
        // }
        this.categoryIdList = this.form.categoryId.split(',');
        if (this.tableLinkData && this.tableLinkData.length > 0) {
          this.tableLinkData.forEach((e) => (e.status = e.status + ''));
        }
        if (this.otherForm.settlementMode) {
          this.otherForm.settlementMode = this.otherForm.settlementMode + '';
        }
        if (this.form.level) {
          this.form.level = this.form.level + '';
        }
        // 回显地址选择器
        if (this.form.addressId && this.form.addressId.length > 0) {
          this.form.addressId = this.form.addressId.split(',');
        }
        if (this.otherForm.addressId && this.otherForm.addressId.length > 0) {
          this.otherForm.addressId = this.otherForm.addressId.split(',');
        }
        // 回显行业
        if (this.form.industryCode && this.form.industryCode.length > 0) {
          this.form.industry = this.form.industryCode.split(',');
        }
        if (this.otherForm.deptId) {
          // 编辑时，默认查询组织相关的用户列表，用于回显
          this.$nextTick(async () => {
            await this.$refs.directorRef.getList({
              groupId: this.otherForm.deptId
            });
          });
        }
      },

      handParent() {
        let item = {
          id: this.form.parentId
        };
        this.$refs.parentRef.open(item);
      },

      changeParent(obj) {
        this.$set(this.form, 'parentId', obj.id);
        this.$set(this.form, 'parentName', obj.name);
      },
      //选择产品
      handSelectSupply() {
        this.$refs.productListRef.open(this.supplyList, -1);
      },
      getSupplyList(obj) {
        obj.forEach((item, index) => {
          let params = {};
          this.$set(params, 'contactId', this.row.id);
          this.$set(params, 'productId', item.id);
          this.$set(params, 'categoryName', item.name);
          this.$set(params, 'productCategoryId', item.categoryLevelId);
          this.$set(params, 'productBrand', item.brandNum);
          this.$set(params, 'productCategoryName', item.categoryLevelPath);
          this.$set(params, 'productCode', item.code);
          this.$set(params, 'productName', item.name);
          this.$set(params, 'modelType', item.modelType);
          this.$set(params, 'availableCountBase', item.availableCountBase);
          this.$set(params, 'measuringUnit', item.measuringUnit);
          this.$set(params, 'specification', item.specification);
          this.$set(params, 'weightUnit', item.weightUnit);
          this.$set(params, 'imgCode', item.imgCode);
          this.$set(params, 'produceType', item.componentAttribute);
          this.$set(params, 'approvalNumber', item.approvalNumber);
          this.$set(params, 'packingSpecification', item.packingSpecification);
          this.supplyList.push(params);
        });
      },
      //删除供货产品
      handleRemoveSupply(index) {
        this.supplyList.splice(index, 1);
      }
    }
  };
</script>