
<template>
  <div class="jeepay-m-center" style="margin-top: 5px; margin-left: 20px;">
    <a-steps v-show="(vdata.showStyle == showStyleEnum.step) && !isMobile" :current="vdata.currentStep - 1" type="navigation">
      <a-step title="主体信息" />
      <a-step title="经营信息" />
      <a-step title="结算账户" />
    </a-steps>
    <a-divider v-show="!isMobile" />
    <a-divider v-show="isMobile" class="jeepay-m-divider" orientation="left" style="color: #1A66FF;"><span style="color: #2980FD;">{{ vdata.currentStep }}</span>/{{ vdata.steps.length }} {{ vdata.steps[vdata.currentStep - 1] }}</a-divider>
    <!-- 1. 主体信息  -->
    <a-form
      v-show="vdata.showStyle == showStyleEnum.block || vdata.currentStep == 1"
      ref="stepForm1Ref"
      style="margin-top: 20px;"
      :model="applymentDetailInfo"
      :label-col="{ span: 4 }"
      :wrapper-col="{ span: 8 }"
      :rules="vdata.step1Rules"
    >
      <a-divider class="jeepay-m-divider" orientation="left" style="color: #1A66FF;">基础项</a-divider>

      <!-- 1. 账户信息 start  分账接收方：支持法人（若为企业只能对公）-->
      <a-form-item label="商户类型" name="merchantType">
        <a-radio-group v-model:value="applymentDetailInfo.merchantType" @change="mchTypeChange()">
          <a-radio :value="1">小微</a-radio>
          <a-radio :value="2">个体</a-radio>
          <a-radio :value="3">企业</a-radio>
        </a-radio-group>
      </a-form-item>
     
      <a-form-item label="商户手机号" name="accountPhone">
        <a-input v-model:value.trim="applymentDetailInfo.accountPhone" />
        <span class="jeepay-tip-text">（此手机号将用于注册联动惠商app账号）</span>
      </a-form-item>

      <a-form-item label="店铺类型" name="shopType" @change="shopTypeChange()">
        <a-radio-group v-model:value="applymentDetailInfo.shopType">
          <a-radio :value="1">主店</a-radio>
          <a-radio :value="2" :disabled="applymentDetailInfo.merchantType == 1">独立结算分店</a-radio>
          <a-radio :value="3" :disabled="applymentDetailInfo.merchantType == 1">合并结算分店</a-radio>
          <a-radio :value="4">分账接收方</a-radio> 
        </a-radio-group>
        <br><span class="jeepay-tip-text">
          独立结算分店：分公司、连锁店等形式，拥有完全独立的商户资料和结算卡，交易单独结算。<br>
          合并结算分店：分公司、连锁店等形式，使用主店的商户资料和结算卡，交易结算至主店的银行卡内。<br>
          分账接收方：开通此项，不能进行交易，只能接收来自分账方的资金。
        </span>
      </a-form-item>
      
      <a-form-item v-if="applymentDetailInfo.shopType == 2 || applymentDetailInfo.shopType == 3" label="总店商户号" name="shopMerchantId">
        <a-input v-model:value.trim="applymentDetailInfo.shopMerchantId" />
        <span class="jeepay-tip-text">（分店必填，总店进件成功后得到的商户号）</span>
      </a-form-item>

      <a-form-item v-if="applymentDetailInfo.merchantType != 1" label="总-门店关系说明函" name="relationCertPic">
        <JeepayUpload v-model:src="applymentDetailInfo.relationCertPic" bizType="applyment" />
        <span class="jeepay-tip-text">(总分店同个营业执照必填)</span>
      </a-form-item>
      <!-- 1. 账户信息 end -->

      <!-- 4. 商户信息 start -->
      <div v-if="applymentDetailInfo.merchantType == '2' || applymentDetailInfo.merchantType == '3'">
        <a-divider class="jeepay-m-divider" orientation="left" style="color: #1A66FF;">营业执照信息</a-divider>
        <a-form-item label="营业执照照片" name="licenseImg">
          <JeepayUpload v-model:src="applymentDetailInfo.licenseImg" bizType="applyment" ocrType="license" @ocrScan="ocrScanByLicenseFunc" />
          <span class="jeepay-tip-text">(上传图片自动识别：营业执照编号、商户全称、经营详细地址，识别出来的具体内容商户可自行修改)</span>
        </a-form-item>

        <a-form-item label="营业执照名称" name="mchFullName">
          <a-input v-model:value.trim="applymentDetailInfo.mchFullName" />
        </a-form-item>

        <a-form-item label="营业执照号" name="licenseNo">
          <a-input v-model:value.trim="applymentDetailInfo.licenseNo" />
        </a-form-item>

        <a-form-item label="执照地址" name="licenseAddress">
          <a-input v-model:value.trim="applymentDetailInfo.licenseAddress" />
        </a-form-item>

        <a-form-item label="执照有效期起始日期" name="licenseEffectBegin">
          <a-input v-model:value.trim="applymentDetailInfo.licenseEffectBegin" />
        </a-form-item>

        <a-form-item class="jeepay-valid" label="执照有效期结束日期" name="licenseEffectEnd">
          <a-input v-model:value.trim="applymentDetailInfo.licenseEffectEnd" :disabled="applymentDetailInfo.licenseEffectEnd == '长期'" style="width: 150px;margin-right: 10px;" />
          <a-checkbox :checked="applymentDetailInfo.licenseEffectEnd == '长期' " @change="(e) => applymentDetailInfo.licenseEffectEnd = e.target.checked ? '长期' : '' ">长期</a-checkbox>
        </a-form-item>
      </div>
      <!-- 4. 商户信息 end -->

      <!-- 3. 法人信息 start -->
      <a-divider class="jeepay-m-divider" orientation="left" style="color: #1A66FF;">法定代表人证件</a-divider>
      
      <a-form-item label="法人身份证人像面照片" name="idcard1Img">
        <JeepayUpload v-model:src="applymentDetailInfo.idcard1Img" bizType="applyment" ocrType="idCard" @ocrScan="ocrScanByAccountFunc" />
        <span class="jeepay-tip-text">(上传图片自动识别 身份证名称 身份证号)</span>
      </a-form-item>

      <a-form-item label="法人身份证国徽面照片" name="idcard2Img">
        <JeepayUpload v-model:src="applymentDetailInfo.idcard2Img" bizType="applyment" ocrType="idCard" @ocrScan="ocrScanByAccountFunc" />
        <span class="jeepay-tip-text">(上传图片自动识别 有效期)</span>
      </a-form-item>

      <a-form-item label="法人手持身份证" name="idcardInHandImg">
        <JeepayUpload v-model:src="applymentDetailInfo.idcardInHandImg" bizType="applyment" />
      </a-form-item>

      <a-form-item label="法人姓名" name="idcardName">
        <a-input v-model:value.trim="applymentDetailInfo.idcardName" />
      </a-form-item>

      <a-form-item label="法人身份证号" name="idcardNo">
        <a-input v-model:value.trim="applymentDetailInfo.idcardNo" />
      </a-form-item>

      <a-form-item label="法人身份证有效期开始日期" name="idcardEffectBegin">
        <a-input v-model:value.trim="applymentDetailInfo.idcardEffectBegin" />
      </a-form-item>

      <a-form-item class="jeepay-valid" label="法人身份证有效期结束日期" name="idcardEffectEnd">
        <a-input v-model:value.trim="applymentDetailInfo.idcardEffectEnd" :disabled="applymentDetailInfo.idcardEffectEnd == '长期'" style="width: 150px;margin-right: 10px;" />
        <a-checkbox :checked="applymentDetailInfo.idcardEffectEnd == '长期' " @change="(e) => applymentDetailInfo.idcardEffectEnd = e.target.checked ? '长期' : '' ">长期</a-checkbox>
      </a-form-item>
      <!-- 3. 法人信息 end -->
    </a-form>

    <!-- 2. 经营信息  -->
    <a-form
      v-show="vdata.showStyle == showStyleEnum.block || vdata.currentStep == 2"
      ref="stepForm2Ref"
      :model="applymentDetailInfo"
      :label-col="{ span: 4 }"
      :wrapper-col="{ span: 8 }"
      :rules="vdata.step2Rules"
    >
      <a-divider class="jeepay-m-divider" orientation="left" style="color: #1A66FF;">经营信息</a-divider>
      <!-- 2. 店铺信息 start -->
      <a-form-item label="门店名称" name="mchShortName">
        <a-input v-model:value.trim="applymentDetailInfo.mchShortName" />
      </a-form-item>

      <a-form-item label="商户类别MCC" name="mccCode">
        <JeepayMccSelect v-model:value="applymentDetailInfo.mccCode" />
      </a-form-item>

      <a-form-item label="商户经营地省市区" name="areaCode">
        <JeepayAreaSelectUmhs v-model:value="applymentDetailInfo.areaCode" @change="searchAreaFunc" />
      </a-form-item>

      <a-form-item label="商户经营详细地址" name="address">
        <a-input v-model:value.trim="applymentDetailInfo.address" />
      </a-form-item>

      <a-form-item label="门店门头照" name="storeOuterImg">
        <JeepayUpload v-model:src="applymentDetailInfo.storeOuterImg" bizType="applyment" />
      </a-form-item>

      <a-form-item label="门店收银台照" name="storeCashierImg">
        <JeepayUpload v-model:src="applymentDetailInfo.storeCashierImg" bizType="applyment" />
      </a-form-item>

      <a-form-item label="经营场所照" name="storeInnerImg">
        <JeepayUpload v-model:src="applymentDetailInfo.storeInnerImg" bizType="applyment" />
      </a-form-item>
      <!-- 2. 店铺信息 end -->

      <a-divider class="jeepay-m-divider" orientation="left" style="color: #1A66FF;">联系人信息</a-divider>
      <a-form-item label="联系人类型" name="contactType"> 
        <a-radio-group v-model:value="applymentDetailInfo.contactType">
          <a-radio :value="0">法人</a-radio>
          <a-radio :value="1" :disabled="applymentDetailInfo.merchantType == 1">委托人</a-radio>
        </a-radio-group>
      </a-form-item>

      <div v-if="applymentDetailInfo.merchantType != 1 && applymentDetailInfo.contactType == 1">
        <a-form-item label="联系人姓名" name="contactName"> 
          <a-input v-model:value.trim="applymentDetailInfo.contactName" />
        </a-form-item>

        <a-form-item label="联系人身份证号" name="contactIdcardNo"> 
          <a-input v-model:value.trim="applymentDetailInfo.contactIdcardNo" />
        </a-form-item>
      </div>

      <a-form-item label="联系人手机号" name="contactPhone">
        <a-input v-model:value.trim="applymentDetailInfo.contactPhone" />
      </a-form-item>
    </a-form>
    

    <!-- 3. 结算账户  -->
    <a-form
      v-show="vdata.showStyle == showStyleEnum.block || vdata.currentStep == 3"
      ref="stepForm3Ref"
      :model="applymentDetailInfo"
      :label-col="{ span: 4 }"
      :wrapper-col="{ span: 8 }"
      :rules="vdata.step3Rules"
    >
      <a-divider class="jeepay-m-divider" orientation="left" style="color: #1A66FF;">账户信息</a-divider>
      <!-- 5. 结算信息 start -->
      <a-form-item label="结算账户类型" name="settAccountType">
        <a-radio-group v-model:value="applymentDetailInfo.settAccountType" @change="settTypeChange()">
          <a-radio value="B" :disabled="applymentDetailInfo.merchantType == 1">法人对公</a-radio>
          <a-radio value="C" :disabled="applymentDetailInfo.shopType == 4 && applymentDetailInfo.merchantType == 3">法人对私</a-radio>
          <a-radio value="C2" :disabled="applymentDetailInfo.merchantType == 1 || applymentDetailInfo.shopType == 4">非法人对私</a-radio>
        </a-radio-group>
        <br><span v-if="applymentDetailInfo.shopType == 4" class="jeepay-tip-text">
          分账接收方不支持非法人结算；<br>
          分账接收方若为企业只支持对公结算；
        </span>
      </a-form-item>
      
      <a-form-item v-if="applymentDetailInfo.settAccountType == 'C' || applymentDetailInfo.settAccountType == 'C2'" label="银行卡正面照" name="settAccountLicenseImg">
        <JeepayUpload v-model:src="applymentDetailInfo.settAccountLicenseImg" bizType="applyment" ocrType="bankCard" @ocrScan="ocrScanBySettAccountBankCardFunc" />
        <span class="jeepay-tip-text">(上传图片自动识别 银行卡号)</span>
      </a-form-item>

      <a-form-item v-if="applymentDetailInfo.settAccountType == 'B'" label="开户许可证照片" name="companyAccountLicenseImg">
        <JeepayUpload v-model:src="applymentDetailInfo.companyAccountLicenseImg" bizType="applyment" ocrType="license" @ocrScan="ocrScanBySettAccountBankCardFunc" />
      </a-form-item>

      <a-form-item label="结算账户名" name="settAccountName">
        <a-input v-model:value.trim="applymentDetailInfo.settAccountName" />
      </a-form-item> 

      <a-form-item label="结算账户号" name="settAccountNo">
        <a-input v-model:value.trim="applymentDetailInfo.settAccountNo" />
        <span class="jeepay-tip-text">(对私时传银行卡号，对公时传开户账号)</span>
      </a-form-item>

      <a-form-item label="银行预留手机号" name="prePhone">
        <a-input v-model:value.trim="applymentDetailInfo.prePhone" />
      </a-form-item>

      <a-form-item label="开户银行名称" name="settAccountBankName">
        <a-input v-model:value.trim="applymentDetailInfo.settAccountBankName" />
      </a-form-item>

      <a-form-item label="开户行联行号" name="openBankCode">
        <a-input v-model:value.trim="applymentDetailInfo.openBankCode" placeholder="联行号" />
        <span><a href="https://www.icvio.cn/" target="_blank">联行号及开户支行名称查询</a></span>
      </a-form-item>

      <a-form-item label="开户支行名称" name="settAccountBankBranchName">
        <a-input v-model:value.trim="applymentDetailInfo.settAccountBankBranchName" placeholder="开户支行名称" />
        <span class="jeepay-tip-text">(即结算卡开户银行网点名称，例如：中国工商银行股份有限公司北京东铁匠营支行)</span>
      </a-form-item>

      <!-- 存汉字 -->
      <a-form-item label="银行卡开户地" name="settAccountBankBranchAreaCode">
        <JeepayAreaNameSelectUmhs v-model:value="applymentDetailInfo.settAccountBankBranchAreaCode" />
      </a-form-item>


      <!-- 非法人对私 -->
      <div v-if="applymentDetailInfo.merchantType != '1' && applymentDetailInfo.settAccountType == 'C2'">
        <a-divider class="jeepay-m-divider" orientation="left" style="color: #1A66FF;">结算人信息</a-divider>
      
        <a-form-item label="结算人身份证人像面照片" name="settAccountIdcard1Img">
          <JeepayUpload v-model:src="applymentDetailInfo.settAccountIdcard1Img" bizType="applyment" ocrType="idCard" @ocrScan="ocrScanBySettAccountFunc" />
          <span class="jeepay-tip-text">(上传图片自动识别 身份证号)</span>
        </a-form-item>
        
        <a-form-item label="结算人身份证国徽面照片" name="settAccountIdcard2Img">
          <JeepayUpload v-model:src="applymentDetailInfo.settAccountIdcard2Img" bizType="applyment" ocrType="idCard" @ocrScan="ocrScanBySettAccountFunc" />
          <span class="jeepay-tip-text">(上传图片自动识别 有效期)</span>
        </a-form-item>
        
        <a-form-item label="结算人身份证号" name="settAccountIdcardNo">
          <a-input v-model:value.trim="applymentDetailInfo.settAccountIdcardNo" />
        </a-form-item>

        <a-form-item label="结算人身份证起始有效期" name="settAccountIdcardEffectBegin">
          <a-input v-model:value.trim="applymentDetailInfo.settAccountIdcardEffectBegin" />
        </a-form-item>

        <a-form-item class="jeepay-valid" label="结算人身份证结束有效期" name="settAccountIdcardEffectEnd">
          <a-input v-model:value.trim="applymentDetailInfo.settAccountIdcardEffectEnd" :disabled="applymentDetailInfo.settAccountIdcardEffectEnd == '长期'" style="width: 150px;margin-right: 10px;" />
          <a-checkbox :checked="applymentDetailInfo.settAccountIdcardEffectEnd == '长期' " @change="(e) => applymentDetailInfo.settAccountIdcardEffectEnd = e.target.checked ? '长期' : '' ">长期</a-checkbox>
        </a-form-item>

        <a-form-item label="结算授权书图片" name="contactWxAuthImg">
          <JeepayUpload v-model:src="applymentDetailInfo.contactWxAuthImg" bizType="applyment" />
        </a-form-item>
      </div>
      <!-- 5. 结算信息 end -->
    </a-form>
    <a-divider />

    <div class="jeepay-btn-box jeepay-m-btn-box" style="margin-top: 50px; margin-bottom: 50px;text-align: center;">
      <a-button v-show="vdata.showStyle == showStyleEnum.step && vdata.currentStep > 1" class="jeepay-m-btn" data-type="inline" type="primary" @click="toPrevStep"><left-circle-outlined /> 上一步 </a-button>
      <a-button v-show="vdata.showStyle == showStyleEnum.step && vdata.currentStep < 3" class="jeepay-m-btn" data-type="inline" type="primary" @click="toNextStep">下一步 <right-circle-outlined /> </a-button>
    </div>
  </div>
</template>

<script setup lang="ts">

import {reactive, getCurrentInstance, inject} from 'vue'
import ruleGenerator from '@/utils/ruleGenerator'

// 获取当前实例的代理对象
const { proxy } : any = getCurrentInstance()

const { $infoBox } = getCurrentInstance()!.appContext.config.globalProperties


// 显示类型枚举值
const showStyleEnum = {
  step: 'step',
  block: 'block'
}

// 参数注入： 是否手机端
let isMobile : any = inject('isMobile')

// 响应式数据
const vdata : any = reactive({
  showStyle: 'step', // 显示类型： step-分步,  block-整页显示 
  steps: ['主体信息', '经营信息', '结算账户'],
  isTempData: false, // 是否保存草稿
  isvDefaultPaywayFee: {} as any, // 服务商默认费率
  currentStep: 1,
  receiverTableData: [] as any,
  branchBankList:[] as any, // 支行列表
  step1Rules: {
                merchantType: [ ruleGenerator.requiredSelect('商户类型', 'number') ],
                accountPhone: [ ruleGenerator.requiredInput('商户手机号') ],
                shopMerchantId: [ ruleGenerator.requiredInput('总店商户号') ],
                shopType: [ ruleGenerator.requiredSelect('店铺类型', 'number') ],
                licenseImg: [ ruleGenerator.requiredUpload('营业执照照片') ],
                mchFullName: [ ruleGenerator.requiredInput('营业执照名称') ],
                licenseNo: [ ruleGenerator.requiredInput('营业执照号') ],
                licenseAddress: [ ruleGenerator.requiredInput('执照地址') ],
                licenseEffectBegin: [ ruleGenerator.requiredInput('执照有效期起始日期'), ruleGenerator.date ],
                licenseEffectEnd: [ ruleGenerator.requiredInput('执照有效期结束日期'), ruleGenerator.dateOrForever ],
                idcard1Img: [ ruleGenerator.requiredUpload('法人身份证人像面') ],
                idcard2Img: [ ruleGenerator.requiredUpload('法人身份证国徽面') ],
                idcardName: [ ruleGenerator.requiredInput('法人姓名') ],
                idcardNo: [ ruleGenerator.requiredInput('法人身份证号') ],
                idcardEffectBegin: [ ruleGenerator.requiredInput('法人身份证有效期开始日期'), ruleGenerator.date ],
                idcardEffectEnd: [ ruleGenerator.requiredInput('法人身份证有效期结束日期'), ruleGenerator.dateOrForever ]
              },
  step2Rules: {
                mchShortName: [ ruleGenerator.requiredInput('门店名称') ],    
                mccCode: [ ruleGenerator.requiredSelect('商户类别MCC') ],
                areaCode: [ ruleGenerator.requiredSelect('商户经营地省市区', 'array') ],
                address: [ ruleGenerator.requiredInput('商户经营详细地址') ],
                storeOuterImg: [ ruleGenerator.requiredUpload('门店门头照') ],
                storeCashierImg: [ ruleGenerator.requiredUpload('门店收银台照') ],
                storeInnerImg: [ ruleGenerator.requiredUpload('经营场所照') ],
                contactType: [ ruleGenerator.requiredSelect('联系人类型', 'number') ],
                contactName: [ ruleGenerator.requiredInput('联系人姓名') ],
                contactIdcardNo: [ ruleGenerator.requiredInput('联系人身份证号') ],
                contactPhone: [ ruleGenerator.requiredInput('联系人手机号') ],
  },
  step3Rules: {
                settAccountType: [ ruleGenerator.requiredSelect('结算账户类型', 'string') ],
                settAccountLicenseImg: [ ruleGenerator.requiredUpload('银行卡正面照') ],
                companyAccountLicenseImg: [ ruleGenerator.requiredUpload('开户许可证照片') ],
                settAccountName: [ ruleGenerator.requiredInput('结算账户名') ],
                settAccountNo: [ ruleGenerator.requiredInput('结算账户号') ],
                prePhone: [ ruleGenerator.requiredInput('银行预留手机号') ],
                settAccountBankName: [ ruleGenerator.requiredInput('开户银行名称') ],
                openBankCode: [ ruleGenerator.requiredInput('开户行联行号') ],
                settAccountBankBranchName: [ ruleGenerator.requiredInput('开户支行名称') ],
                settAccountBankBranchAreaCode: [ ruleGenerator.requiredSelect('银行卡开户地', 'array') ],
                settAccountIdcard1Img: [ ruleGenerator.requiredUpload('结算人身份证人像面照片') ],
                settAccountIdcard2Img: [ ruleGenerator.requiredUpload('结算人身份证国徽面照片') ],
                settAccountIdcardNo: [ ruleGenerator.requiredInput('结算人身份证号') ],
                settAccountIdcardEffectBegin: [ ruleGenerator.requiredInput('结算人身份证起始有效期'), ruleGenerator.date ],
                settAccountIdcardEffectEnd: [ ruleGenerator.requiredInput('结算人身份证结束有效期'), ruleGenerator.dateOrForever ],
                contactWxAuthImg: [ ruleGenerator.requiredUpload('结算授权书图片') ]
  }
})


// 接收父组件的进件详细参数
let applymentDetailInfoInject : any = inject('applymentDetailInfo')
let applymentDetailInfo : any = applymentDetailInfoInject.value


// 下一步
function toNextStep() {
  // 验证是否通过
  proxy.$refs['stepForm'+vdata.currentStep+'Ref'].validate().then( () => {
      vdata.currentStep ++
  })
  if (!applymentDetailInfo.settleWay) {
    applymentDetailInfo.settleWay = '01'
  }
}

// 上一步
function toPrevStep(){
  vdata.currentStep --
}

function validateAllForm(step: number){
  return proxy.$refs['stepForm'+step+'Ref'].validate().then( () => {
     if(step >= 3){
      return Promise.resolve()
     }
     return validateAllForm(++step)
     
  })
}

if(applymentDetailInfo.feeData) {
  vdata.receiverTableData = applymentDetailInfo.feeData
}

// 图片识别的回调函数  营业执照
function ocrScanByLicenseFunc(orcObject){
  if(orcObject){
    if(orcObject.licenseNo){
      applymentDetailInfo.licenseNo = orcObject.licenseNo
    }
    if(orcObject.mchFullName){
      applymentDetailInfo.mchFullName = orcObject.mchFullName
    }
    if(orcObject.licenseAddress){
      applymentDetailInfo.licenseAddress = orcObject.licenseAddress
    }
    if(orcObject.licenseBusiness){
      applymentDetailInfo.licenseBusiness = orcObject.licenseBusiness
    }
    if(orcObject.licenseEffectBegin){
      applymentDetailInfo.licenseEffectBegin = orcObject.licenseEffectBegin
    }
    if(orcObject.licenseEffectEnd){
      applymentDetailInfo.licenseEffectEnd = orcObject.licenseEffectEnd
    }
  }
}

// 识别银行卡信息 
function ocrScanBySettAccountBankCardFunc(orcObject){
  if(orcObject){
    if(orcObject.settAccountNo){
      applymentDetailInfo.settAccountNo = orcObject.settAccountNo
    }
    if(orcObject.settAccountBankName){
      applymentDetailInfo.settAccountBankName = orcObject.settAccountBankName
    }
  }
}

// 图片识别的回调函数  法人身份证
function ocrScanByAccountFunc(orcObject){
  if(orcObject){
    if(orcObject.idcardName){
      applymentDetailInfo.idcardName = orcObject.idcardName
    }
    if(orcObject.idcardNo){
      applymentDetailInfo.idcardNo = orcObject.idcardNo
    }
    if(orcObject.idcardAddress){
      applymentDetailInfo.idcardAddress = orcObject.idcardAddress
    }
    if(orcObject.idcardEffectBegin){
      applymentDetailInfo.idcardEffectBegin = orcObject.idcardEffectBegin
    }
    if(orcObject.idcardEffectEnd){
      applymentDetailInfo.idcardEffectEnd = orcObject.idcardEffectEnd
    }
  }
}

// 图片识别的回调函数  结算人身份证
function ocrScanBySettAccountFunc(orcObject){
  if(orcObject){
    if(orcObject.idcardNo){
      applymentDetailInfo.settAccountIdcardNo = orcObject.idcardNo
    }
    if(orcObject.idcardEffectBegin){
      applymentDetailInfo.settAccountIdcardEffectBegin = orcObject.idcardEffectBegin
    }
    if(orcObject.idcardEffectEnd){
      applymentDetailInfo.settAccountIdcardEffectEnd = orcObject.idcardEffectEnd
    }
  }
}

// 点击【保存】的前置事件, 需要返回Promise对象
function saveDataPreCallback(isTemp){

  // 站点信息
  applymentDetailInfo.feeData = vdata.receiverTableData

  // 用于进件列表【进件商户名】的展示
  if(!applymentDetailInfo.mchFullName) {
    applymentDetailInfo.mchFullName = applymentDetailInfo.mchShortName
  }

  // 保存草稿只校验当前步骤数据
  if (isTemp) {
    return Promise.resolve()
  }

  // 验证所有表单
  return validateAllForm(1).then(() => {
    return Promise.resolve()
  }).catch((params: any) => {
    $infoBox.message.error('数据填写不完整， 请检查后提交')
    return Promise.reject()
  })
}


// 商户经营地省市县 回调
function searchAreaFunc(value) {
  if (applymentDetailInfo.address) {
    applymentDetailInfo.address = ''
  }
  if (value.length) {
    if (value.length == 2) {
      applymentDetailInfo.address = value[0].label + '' + value[1].label + ''
    } else if (value.length == 3) {
      applymentDetailInfo.address = value[0].label + '' + value[1].label + '' + value[2].label + ''
    }
  }
}

// 当商户类型发送改变时清除微信经营类目、初始化结算账户类型
function mchTypeChange(){
  applymentDetailInfo.shopType = ''
  applymentDetailInfo.contactType = '' 
  applymentDetailInfo.settAccountType = ''
  applymentDetailInfo.settAccountName = ''
}

// 当店铺类型发生改变时，分账接收方类型：清除掉结算账户类型
function shopTypeChange(){
  if (applymentDetailInfo.shopType == 4 && applymentDetailInfo.merchantType != 1) {
    applymentDetailInfo.settAccountType = ''
  }
}

// 当结算账户类型发送改变时，填充结算账户信息
function settTypeChange(){
  if (applymentDetailInfo.settAccountType == 'B') {
    // 法人对公
    applymentDetailInfo.settAccountName = applymentDetailInfo.mchFullName
  } else if (applymentDetailInfo.settAccountType == 'C'){
    // 法人对私
    applymentDetailInfo.settAccountName = applymentDetailInfo.idcardName
  } else {
    // 非法人对私及其他
    applymentDetailInfo.settAccountName = ''
  }
}

defineExpose({ saveDataPreCallback })

</script>

<style lang="less" scoped>
.jeepay-tip-text{
  font-size: 10px; color: rebeccapurple
}
.option-left {
  width: 50%;
  word-wrap: break-word; 
  white-space: normal;
  word-break: break-all;
}
.option-right {
  color: rgb(153, 153, 153);
}
.option-bottom {
  word-wrap: break-word; 
  white-space: normal;
  word-break: break-all;
  color: rgb(153, 153, 153);
}
.jeepay-btn-box {
  margin: 15px -12px !important;
}
.jeepay-btn-box .ant-btn {
  margin: 0 10px;
}
</style>