<template>
  <div class="app-container">
    <el-form ref="elForm" :model="formData" :rules="rules" inline size="small" label-width="100px"
      label-position="left">
      <div>
        <el-form-item :label="$t('境内外类型')">
          <el-radio v-model="formData.areaType" :label="0" disabled>{{$t('国内')}}</el-radio>
          <el-radio v-model="formData.areaType" :label="1" disabled>{{$t('国外')}}</el-radio>
        </el-form-item>
      </div>
      <div>
        <el-form-item :label="$t('公司全称')" prop="companyZh">
          <el-input v-model="formData.companyZh" :placeholder="$t('请输入公司全称')" show-word-limit clearable readonly></el-input>
        </el-form-item>
        <el-form-item :label="$t('英文名称')" prop="companyEn">
          <el-input v-model="formData.companyEn" :placeholder="$t('请输入公司英文名')" show-word-limit clearable readonly></el-input>
        </el-form-item>
      </div>
      <div>
        <el-form-item :label="$t('合作开始时间')" prop="cooperationDateStart">
          <el-date-picker v-model="formData.cooperationDateStart" value-format="timestamp" clearable disabled></el-date-picker>
        </el-form-item>
        <el-form-item :label="$t('合作结束时间')" prop="cooperationDateEnd">
          <el-date-picker v-model="formData.cooperationDateEnd" value-format="timestamp" clearable disabled></el-date-picker>
        </el-form-item>
      </div>
      <div v-if="formData.areaType==0">
        <el-form-item :label="$t('公司电话')" prop="tell">
          <el-input v-model="formData.tell" :placeholder="$t('请输入公司电话')" clearable readonly></el-input>
        </el-form-item>
        <el-form-item :label="$t('邮件地址')" prop="email">
          <el-input v-model="formData.email" :placeholder="$t('请输入邮箱地址')" clearable readonly></el-input>
        </el-form-item>
      </div>
      <div v-if="formData.areaType==0">
        <el-form-item :label="$t('公司地址')" prop="address">
          {{region}} {{formData.address}}
        </el-form-item>
      </div>
      <div v-if="formData.areaType==0">
        <el-form-item :label="$t('备注')" prop="remark">
          <el-input v-model="formData.remark" type="textarea" :placeholder="$t('请输入备注')"
            :autosize="{minRows: 4, maxRows: 4}" class="w-500" readonly></el-input>
        </el-form-item>
      </div>
      
      <div>
        <el-form-item v-if="formData.areaType==0" :label="$t('供应商类别')" prop="companyType">
          <dict-selector v-model="formData.companyTypeArr" type="company_type" multiple disabled />
        </el-form-item>
        <el-form-item :label="$t('目的港码头')" prop="dockIds">
          <el-select v-model="formData.dockIds" filterable multiple clearable disabled>
            <el-option v-for="(item) in allDocks" :key="item.id" :label="$l(item, 'title')" :value="item.id"></el-option>
          </el-select>
        </el-form-item>
      </div>

      <div>
        <el-form-item :label="$t('合作类型')" prop="cooperationType">
          <dict-selector v-model="formData.cooperationType" type="cooperation_type" disabled />
        </el-form-item>
      </div>
      <div v-if="formData.areaType==1">
        <el-form-item :label="$t('国家')" prop="cooperationType">
          <el-select v-model="formData.country" :placeholder="$t('请选择国家')">
            <el-option
              v-for="item in treeList"
              :key="item.id"
              :label="$l(item,'title')"
              :value="item.id">
            </el-option>
          </el-select>
        </el-form-item>
      </div>
      
      <div v-if="formData.areaType==0">
        <el-form-item :label="$t('营业执照')" prop="license">
          <el-image v-show="formData.license" :src="formData.license" style="width: 146px;height: 146px"></el-image>
        </el-form-item>
        <el-form-item :label="$t('合同')" prop="contract">
          <el-image v-show="formData.contract" :src="formData.contract" style="width: 146px;height: 146px"></el-image>
        </el-form-item>
      </div>
      <div v-if="formData.areaType==0">
        <el-form-item :label="$t('统一信用代码')" prop="licenseNumber">
          <el-input v-model="formData.licenseNumber" :placeholder="$t('请输入统一社会信用代码')" clearable readonly
            :style="{width: '100%'}"></el-input>
        </el-form-item>
      </div>
      <div v-if="formData.areaType==0">
        <el-form-item :label="$t('结算周期')" prop="settlementPeriod">
          <dict-selector v-model="formData.settlementPeriod" type="settlement_period" disabled />
        </el-form-item>
      </div>
      <div>
        <el-form-item :label="$t('价格优势')" prop="priceAdvantage">
          <dict-selector v-model="formData.priceAdvantage" type="price_advantage" disabled />
        </el-form-item>
      </div>
      <el-card class="mt-10" v-if="formData.areaType==0">
        <div class="card-header" slot="header">
          <div class="title">{{$t('优质条件')}}</div>
        </div>
        <div v-if="typeBool(formData.companyTypeArr,['1'])">
          <el-form-item :label="$t('船公司')" prop="shipCompany" label-width="250">
            <suppliers-selector v-model="formData.resourceVO.shipCompany" company-type="9" disabled />
          </el-form-item>
        </div>
        <div v-if="typeBool(formData.companyTypeArr,['1','2','4','5','7'])">
          <el-form-item :label="$t('港口')" prop="ports" label-width="250">
            <el-select v-model="formData.resourceVO.ports" filterable multiple clearable disabled>
                <el-option v-for="(item) in seaPort" :key="item.id" :label="$l(item, 'title')" :value="item.id"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item :label="$t('港口优势条件')" prop="portConditions" label-width="250">
            <dict-selector v-model="formData.resourceVO.portConditions" type="port_conditions" />
          </el-form-item>
          <el-button style="margin-left: 30px;" type="text" v-hasPermi="['ecw:dock:create']" @click="portVisible=true">{{$t('新增港口')}}</el-button>
        </div>
        <div v-if="typeBool(formData.companyTypeArr,['10'])">
          <el-form-item :label="$t('航空公司')" prop="airCompany" label-width="250">
            <suppliers-selector v-model="formData.resourceVO.airCompany" company-type="10" disabled />
          </el-form-item>
          <el-form-item :label="$t('航空公司优势条件')" prop="airConditions" label-width="250">
            <dict-selector v-model="formData.resourceVO.airConditions" type="port_conditions" disabled />
          </el-form-item>
        </div>
        <div v-if="typeBool(formData.companyTypeArr,['3'])">
          <el-form-item :label="$t('出证速度')" prop="certificateSpeed" label-width="250">
            <el-radio v-model="formData.resourceVO.certificateSpeed" :label="0" disabled>{{$t('快')}}</el-radio>
            <el-radio v-model="formData.resourceVO.certificateSpeed" :label="1" disabled>{{$t('慢')}}</el-radio>
          </el-form-item>
        </div>
        <div>
          <el-form-item :label="$t('合作不良记录登记')" prop="badCooperationRecord" label-width="250">
            <el-input v-model="formData.resourceVO.badCooperationRecord" :placeholder="$t('请输入合作不良记录登记')" show-word-limit clearable readonly></el-input>
          </el-form-item>
        </div>
      </el-card>
      <div v-if="formData.areaType==0">
       <el-card class="mt-10">
        <div class="card-header" slot="header">
          <div class="title">{{$t('联系人')}}</div>
        </div>
        <el-table :data="formData.contactList" border class="data-list">
          <el-table-column :label="$t('序号')" width="80px">
            <template slot-scope="scope">{{scope.$index + 1}}</template>
          </el-table-column>
          <el-table-column :label="$t('部门')" prop="department">
          </el-table-column>
          <el-table-column :label="$t('职位')" prop="position">
          </el-table-column>
          <el-table-column :label="$t('名称')" prop="name">
          </el-table-column>
          <el-table-column :label="$t('电话')" prop="phone">
          </el-table-column>
        </el-table>
      </el-card>

      <el-card class="mt-10">
        <div class="card-header" slot="header">
          <div class="title">{{$t('银行信息')}}</div>
        </div>
        <el-table :data="formData.bankList" border class="data-list">
          <el-table-column :label="$t('序号')" width="80px">
            <template slot-scope="scope">{{scope.$index + 1}}</template>
          </el-table-column>
          <el-table-column :label="$t('账户名称')" prop="accountName">
          </el-table-column>
          <el-table-column :label="$t('币别')">
            <template slot-scope="scope">
              <el-form-item>
                <selector :options="currencyList" v-model="scope.row.currency" value-field="id" :label-field="'title' + $l()" disabled></selector>
              </el-form-item>
            </template>
          </el-table-column>
          <el-table-column :label="$t('银行名称')" prop="bankName">
          </el-table-column>
          <el-table-column :label="$t('银行账户')" prop="bankAccount">
          </el-table-column>
          <el-table-column :label="$t('银行代码')" prop="bankCode">
          </el-table-column>
          <el-table-column :label="$t('账户类型')" prop="accountType">
          </el-table-column>
          <el-table-column :label="$t('状态')" prop="status">
            <template slot-scope="scope">
              <dict-selector :type="DICT_TYPE.COMMON_STATUS" v-model="scope.row.status" defaultable disabled />
            </template>
          </el-table-column>
          <el-table-column :label="$t('银行地址')" prop="bankAddress">
          </el-table-column>
        </el-table>
      </el-card>

      
      </div>

      <div v-if="formData.areaType==1">
        <h1>代理商</h1>
        <h2>收货人</h2>
        <div class="supplier-item">
          <el-form-item :label="$t('公司名称')" prop="receiveCompanyName">
            <el-input v-model="formData.externalVO.receiveCompanyName" :placeholder="$t('请输入公司名称')" show-word-limit clearable readonly></el-input>
          </el-form-item>
          <el-form-item :label="$t('地址')" prop="receiveAddress">
            <el-input v-model="formData.externalVO.receiveAddress" :placeholder="$t('请输入地址')" show-word-limit clearable readonly></el-input>
          </el-form-item>
        </div>
        <div class="supplier-item">
          <el-form-item :label="$t('电话')" prop="receiveTel">
            <el-input v-model="formData.externalVO.receiveTel" :placeholder="$t('请输入电话')" show-word-limit clearable readonly></el-input>
          </el-form-item>
          <el-form-item :label="$t('邮箱')" prop="receiveEmail">
            <el-input v-model="formData.externalVO.receiveEmail" :placeholder="$t('请输入邮箱')" show-word-limit clearable readonly></el-input>
          </el-form-item>
        </div>
        <div style="display: flex;align-items: flex-end;">
          <h2>通知方</h2>
        </div>
        <div class="supplier-item">
          <el-form-item :label="$t('公司名称')" prop="notifyCompanyName">
            <el-input v-model="formData.externalVO.notifyCompanyName" :placeholder="$t('请输入公司名称')" show-word-limit clearable readonly></el-input>
          </el-form-item>
          <el-form-item :label="$t('地址')" prop="notifyAddress">
            <el-input v-model="formData.externalVO.notifyAddress" :placeholder="$t('请输入地址')" show-word-limit clearable readonly></el-input>
          </el-form-item>
        </div>
        <div class="supplier-item">
          <el-form-item :label="$t('电话')" prop="notifyTel">
            <el-input v-model="formData.externalVO.notifyTel" :placeholder="$t('请输入电话')" show-word-limit clearable readonly></el-input>
          </el-form-item>
          <el-form-item :label="$t('邮箱')" prop="notifyEmail">
            <el-input v-model="formData.externalVO.notifyEmail" :placeholder="$t('请输入邮箱')" show-word-limit clearable readonly></el-input>
          </el-form-item>
        </div>
        <h2>货物描述</h2>
        <div class="supplier-item">
          <el-form-item :label="$t('品名')" prop="goodName">
            <el-input v-model="formData.externalVO.goodName" :placeholder="$t('请输入品名')" show-word-limit clearable readonly></el-input>
          </el-form-item>
          <el-form-item :label="$t('CTN NO')" prop="clearanceFileId">
            <!-- <el-select v-model="formData.externalVO.clearanceFileId" @change="changeFile">
              <el-option v-for="(item) in fileList" :value="item.id" :label="getCountry(item.country,item.district)" :key="item.id" />
            </el-select> -->
            <el-input v-model="formData.externalVO.ctnNo" :placeholder="$t('请输入CTN NO')" show-word-limit clearable readonly></el-input>
          </el-form-item>
        </div>
        <div class="supplier-item">
          <el-form-item :label="$t('From M No')" prop="fromNo">
            <el-input v-model="formData.externalVO.fromNo" :placeholder="$t('请输入From M No')" show-word-limit clearable readonly></el-input>
          </el-form-item>
          <el-form-item :label="$t('BA NO')" prop="baNo">
            <el-input v-model="formData.externalVO.baNo" :placeholder="$t('请输入BA NO')" show-word-limit clearable readonly></el-input>
          </el-form-item>
        </div>
        <div class="supplier-item">
          <el-form-item :label="$t('包装数量')" prop="packNum">
            <el-input v-model="formData.externalVO.packNum" :placeholder="$t('请输入包装数量')" show-word-limit clearable readonly></el-input>
          </el-form-item>
          <el-form-item :label="$t('包装单位')" prop="packUnit">
            <!-- <el-input v-model="formData.externalVO.packUnit" :placeholder="$t('请输入包装单位')" show-word-limit clearable></el-input> -->
            <dict-selector v-model="formData.externalVO.packUnit" type="packaging_type" disabled />
          </el-form-item>
        </div>
        <div>
          <el-form-item :label="$t('清关要求')" prop="clearanceRequireData">
            <el-select v-model="formData.externalVO.clearanceRequireData" @change="changeRequire" disabled>
              <el-option v-for="(item) in requireData" :value="item" :label="item" :key="item" />
            </el-select>
          </el-form-item>
          <el-form-item v-if="formData.externalVO.clearanceRequireData=='自定义'" :label="$t('自定义要求')" prop="clearanceRequire">
            <el-input v-model="formData.externalVO.clearanceRequire" :placeholder="$t('请输入自定义要求')" show-word-limit clearable readonly></el-input>
          </el-form-item>
        </div>
        <div>
          <el-form-item :label="$t('是否提供')" prop="provide">
            <el-radio v-model="formData.externalVO.provide" :label="1" disabled>{{$t('提供')}}</el-radio>
            <el-radio v-model="formData.externalVO.provide" :label="2" disabled>{{$t('不提供')}}</el-radio>
          </el-form-item>
        </div>
        <div>
          <el-form-item :label="$t('合作不良记录登记')" prop="badCooperationRecord" label-width="250">
            <el-input v-model="formData.externalVO.badCooperationRecord" :placeholder="$t('请输入合作不良记录登记')" show-word-limit clearable readonly></el-input>
          </el-form-item>
        </div>
      </div>
      <el-form-item size="large" class="mt-20">
        <el-button @click="$router.back()">{{$t('返回')}}</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
import { createSupplier, updateSupplier, getSupplier, createFileNo, getFileNoPage} from "@/api/ecw/supplier";
import upload from '@/components/ImageUpload'
import { listByIds } from "@/api/ecw/region";
import AreaSelector from '@/components/AreaSelector'
import {getCurrencyList} from '@/api/ecw/currency'
import Selector from '@/components/Selector'
import {validatePwd} from '@/api/ecw/busiPwd'
import SuppliersSelector from '@/components/SuppliersSelector'
import { getDockPage } from "@/api/ecw/dock";
import { getListTree } from "@/api/ecw/region";
export default {
  components: {upload,  AreaSelector, Selector, SuppliersSelector},
  props: [],
  data() {
    return {
      disabled: true,
      formData: {
        areaType: 0,
        companyZh: undefined,
        agentName: undefined,
        tell: "",
        address: "",
        remark: undefined,
        field110: undefined,
        companyTypeArr: [],
        cooperationType: undefined,
        settlementPeriod: undefined,
        priceAdvantage: undefined,
        license: null,
        contract: null,
        licenseNumber: undefined,
        contactList:[],
        bankList: [],
        resourceVO: {},
        externalVO: {}
      },
      rules: {
        companyZh: [{
          required: true,
          message: this.$t('请输入公司全称'),
          trigger: 'blur'
        }],
        agentName: [],
        tell: [],
        address: [],
        remark: [],
        companyType: [{
          required: true,
          type: 'string',
          message: this.$t('请至少选择一个供应商类别'),
          trigger: 'change'
        }],
        cooperationType: [{
          required: true,
          message: this.$t('请选择合作类型'),
          trigger: 'change'
        }],
        licenseNumber: [],
      },
      treeList:[],
      provinceList:[],
      cityList:[],
      region: '',
      // 码头
      allDocks: [],
      currencyList:[],
      requireData: [
        'COO证书','CXX证书','ABC证书','QWE证书','自定义'
      ],
      fileList: [],
      fileNoForm: {},
      fileNoRules: {
        country: [{required: true,message: this.$t('请输入国家'),trigger: 'blur'}],
        district: [{required: true,message: this.$t('请输入地区'),trigger: 'blur'}],
        fromNo: [{required: true,message: this.$t('请输入From M No'),trigger: 'blur'}],
        baNo: [{required: true,message: this.$t('请输入BA NO'),trigger: 'blur'}],
      },
      showFileNoDialog: false
    }
  },
  computed: {
    airPort(){
        return this.allDocks.filter(item => item.portType == 1)
    },
    seaPort(){
      if(this.typeBool(this.formData.companyTypeArr,['1','2','4']) && this.typeBool(this.formData.companyTypeArr,['5','7'])) return this.allDocks
      if(this.typeBool(this.formData.companyTypeArr,['5','7'])) return this.allDocks.filter(item => item.portType == 1)
      if(this.typeBool(this.formData.companyTypeArr,['1','2','4'])) return this.allDocks.filter(item => item.portType == 2)
    },
    districtList(){
        if(!this.fileNoForm.country) return []
        let country = this.treeList.find(item => item.id == this.fileNoForm.country)
        return country && country.children || []
    },
  },
  watch: {
      'formData.country'(country){
          this.treeList.forEach(item => {
              if(item.id == country){
                  this.provinceList = item.children || []
              }
          })
      },
      'formData.province'(province){
          this.provinceList.forEach(item => {
              if(item.id == province){
                  this.cityList = item.children || []
              }
          })
      },
      'formData.companyTypeArr'(val){
        this.$set(this.formData, 'companyType', val.join(","))
      }
  },
  created() {
      getCurrencyList().then(res => {
        this.currencyList = res.data
      })
      // 码头
      getDockPage({ pageNo: "1", pageSize: "10000" }).then((res) => {
        this.allDocks = res.data.list;
      });
      getListTree({treeType: 1}).then(response => {
        this.treeList = response.data
      })
      
      this.getFile()

      if(this.$route.query.id){
            getSupplier(this.$route.query.id).then(response => {
                /* response.data.companyType = response.data.companyType.split(",") || [] */
                this.formData = response.data
                
                this.$set(this.formData, 'companyTypeArr', this.strToArray(response.data.companyType))
                this.$set(this.formData, 'dockIds', this.strToArray(response.data.dockIds))
                this.$set(this.formData, 'priceAdvantage', response.data.priceAdvantage==0?'':response.data.priceAdvantage)
                this.$set(this.formData, 'settlementPeriod', response.data.settlementPeriod==0?null:response.data.settlementPeriod)
                this.formData.bankList.forEach(item => {
                  item.currency = +item.currency
                })
                if(response.data.resourceBackVO){
                  this.formData.resourceVO = response.data.resourceBackVO
                  this.formData.externalVO = response.data.externalBackVO??{}
                  this.$set(this.formData.resourceVO,'shipCompany',this.strToArray(response.data.resourceBackVO.shipCompany))
                  this.$set(this.formData.resourceVO,'ports',this.strToArray(response.data.resourceBackVO.ports))
                  this.$set(this.formData.resourceVO,'bookCompany',this.strToArray(response.data.resourceBackVO.bookCompany))
                  this.$set(this.formData.resourceVO,'trailerCompany',this.strToArray(response.data.resourceBackVO.trailerCompany))
                  this.$set(this.formData.resourceVO,'customsCompany',this.strToArray(response.data.resourceBackVO.customsCompany))
                  this.$set(this.formData.resourceVO,'certificateCompany',this.strToArray(response.data.resourceBackVO.certificateCompany))
                  this.$set(this.formData.resourceVO,'airdrome',this.strToArray(response.data.resourceBackVO.airdrome))
                  this.$set(this.formData.resourceVO,'airCompany',this.strToArray(response.data.resourceBackVO.airCompany))
                  this.$set(this.formData.resourceVO,'bookCompanyAir',this.strToArray(response.data.resourceBackVO.bookCompanyAir))
                  this.$set(this.formData.resourceVO,'customsCompanyAir',this.strToArray(response.data.resourceBackVO.customsCompanyAir))
                  this.$set(this.formData.resourceVO,'certificateCompanyAir',this.strToArray(response.data.resourceBackVO.certificateCompanyAir))
                  listByIds({ids: [this.formData.country, this.formData.province, this.formData.city].join(',')}).then(res => {
                    console.log('listById', res)
                    let region = ''
                    res.data.forEach(item => {
                      region += " " + item.titleZh
                    })
                    this.region = region
                  })
                }
                if(response.data.externalBackVO){
                  this.formData.externalVO = response.data.externalBackVO
                  this.formData.resourceVO = response.data.resourceBackVO??{}
                  this.$set(this.formData.externalVO,'receiveCompanyName',response.data.externalBackVO.receiveCompanyName)
                  this.$set(this.formData.externalVO,'receiveAddress',response.data.externalBackVO.receiveAddress)
                  this.$set(this.formData.externalVO,'receiveTel',response.data.externalBackVO.receiveTel)
                  this.$set(this.formData.externalVO,'receiveEmail',response.data.externalBackVO.receiveEmail)
                  this.$set(this.formData.externalVO,'notifyCompanyName',response.data.externalBackVO.notifyCompanyName)
                  this.$set(this.formData.externalVO,'notifyAddress',response.data.externalBackVO.notifyAddress)
                  this.$set(this.formData.externalVO,'notifyTel',response.data.externalBackVO.notifyTel)
                  this.$set(this.formData.externalVO,'notifyEmail',response.data.externalBackVO.notifyEmail)
                  this.$set(this.formData.externalVO,'goodName',response.data.externalBackVO.goodName)
                  this.$set(this.formData.externalVO,'clearanceFileId',response.data.externalBackVO.clearanceFileId)
                  this.$set(this.formData.externalVO,'fromNo',response.data.externalBackVO.fromNo)
                  this.$set(this.formData.externalVO,'baNo',response.data.externalBackVO.baNo)
                  this.$set(this.formData.externalVO,'packNum',response.data.externalBackVO.packNum)
                  this.$set(this.formData.externalVO,'packUnit',response.data.externalBackVO.packUnit)
                  this.$set(this.formData.externalVO,'clearanceRequireData',['COO证书','CXX证书','ABC证书','QWE证书'].includes(response.data.externalBackVO.clearanceRequire)?response.data.externalBackVO.clearanceRequire:'自定义')
                  this.$set(this.formData.externalVO,'clearanceRequire',response.data.externalBackVO.clearanceRequire)
                  this.$set(this.formData.externalVO,'provide',response.data.externalBackVO.provide)
                  this.$set(this.formData.externalVO,'badCooperationRecord',response.data.externalBackVO.badCooperationRecord)
                }
            });
        }
      
  },
  mounted() {},
  methods: {
    strToArray(val) {
      if(!val || val == '') {
        return []
      }else{
        let data = val.split(",")
        return data.map(item=>Number(item))
      }
    },
    typeBool(type,arr) {
      let flag = false
      type.forEach(item=>{
        if(arr.includes(item)){
          flag = true
        }
      })
      return flag
    },
    sameReceive() {
      this.$set(this.formData.externalVO,'notifyCompanyName',this.formData.externalVO.receiveCompanyName)
      this.$set(this.formData.externalVO,'notifyAddress',this.formData.externalVO.receiveAddress)
      this.$set(this.formData.externalVO,'notifyTel',this.formData.externalVO.receiveTel)
      this.$set(this.formData.externalVO,'notifyEmail',this.formData.externalVO.receiveEmail)
    },
    addFileNo() {
      this.showFileNoDialog = true
      this.$refs.fileNoForm.resetFields()
    },
    getFile() {
      getFileNoPage().then(res => {
        this.fileList = res.data.list
      })
    },
    addfile() {
      this.$refs.fileNoForm.validate(vaild=>{
        if(vaild){
          createFileNo(this.fileNoForm).then(()=>{
            this.showFileNoDialog = false
            this.getFile()
          })
        }else{
          this.$message.error(this.$t('请完整填写表单'))
        }
      })
    },
    changeFile(val) {
      let file = this.fileList.find(item=>item.id == val)
      this.$set(this.formData.externalVO,'fromNo',file.fromNo)
      this.$set(this.formData.externalVO,'baNo',file.baNo)
    },
    changeRequire(val) {
      if(val != '自定义'){
        this.$set(this.formData.externalVO,'clearanceRequire',val)
      }else{
        this.$set(this.formData.externalVO,'clearanceRequire','')
      }
    },
    getCountry(countryId, districtId) {
      let country = this.treeList.find(item=>item.id == countryId)
      if(country){
        let district = country.children.find(item=>item.id == districtId)
        return this.$l(country, 'title')+' '+this.$l(district, 'title')
      }
      return ''
    },
    delContact(index){
      this.$confirm(this.$t('确定删除此联系人么？')).then(() => {
        this.formData.contactList.splice(index, 1)
      })
    },
    delBank(index){
      if(this.formData.bankList[index].id){
        this.$prompt(this.$t("请输入密码"), {
          inputType: 'password'
        })
        .then(({value}) => {
          if(value && value != ''){
            return validatePwd({
              busiType: 5,
              pwd: value
            })
          }
          this.$message.error(this.$t('密码不能为空'))
        })
        .then(res => {
          if(!res.data){
            return this.$message.error(this.$t('密码错误'))
          }
          this.formData.bankList.splice(index, 1)
        })
        return
      }

      this.$confirm(this.$t('确定删除此银行信息么？')).then(() => {
        this.formData.bankList.splice(index, 1)
      })
    },
    onAreaChange(type, val){
      this.$set(this.formData, type, val)
    },
  }
}

</script>
<style lang="scss" scoped>
.el-upload__tip {
  line-height: 1.2;
}
.card-header{
  display: flex;
  align-items: center;
  justify-content: space-between;
  .title{
    font-size: 18px;
  }
}
::v-deep .data-list .el-form-item__error{
    position: static;
}
.red{
  color: red;
}
.supplier-item{
  margin-left: 30px;
  
}
</style>