<template>
  <div class="jeepay-m-center" :style="isMobile?'margin-top: 50px !important; margin-left: 20px; ':'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-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>
      <a-form-item label="商户类型" name="merchantType">
        <a-radio-group v-model:value="applymentDetailInfo.merchantType" @change="changeMerchantType">
          <a-radio :value="1">小微商户</a-radio>
          <a-radio :value="2">个体商户</a-radio>
          <a-radio :value="3">企业商户</a-radio>
        </a-radio-group>
      </a-form-item>

      <div v-if="applymentDetailInfo.merchantType != 1">
        <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" :imgSize="2" bizType="applyment"
                        ocrType="license" @ocrScan="ocrScanFunc" />
          <span class="jeepay-tip-text">(上传图片自动识别 营业执照编号)</span>
        </a-form-item>
        <a-form-item label="营业执照名称" name="mchFullName">
          <a-input v-model:value.trim="applymentDetailInfo.mchFullName"  @change="getDiySettAccountName" />
        </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"  placeholder="示例：2023-10-10"/>
          <span class="jeepay-tip-text">(示例：2023-10-10，中间用 - 分隔)</span>
        </a-form-item>

        <a-form-item label="营业执照经营范围" name="licenseScope">
          <a-input v-model:value.trim="applymentDetailInfo.licenseScope" />
        </a-form-item>

        <a-form-item class="jeepay-valid" label="营业执照有效期截止" name="licenseEffectEnd">
          <div>
            <a-input v-model:value.trim="applymentDetailInfo.licenseEffectEnd"
                     :disabled="applymentDetailInfo.licenseEffectEnd == '长期'"
                     style="width: 150px;margin-right: 10px;"  placeholder="示例：2023-10-10"/>
            <a-checkbox :checked="applymentDetailInfo.licenseEffectEnd == '长期' "
                        @change="(e) => applymentDetailInfo.licenseEffectEnd = e.target.checked ? '长期' : '' ">长期
            </a-checkbox>
          </div>
          <span class="jeepay-tip-text">(示例：2023-10-10，中间用 - 分隔)</span>
        </a-form-item>
      </div>


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

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

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

      <a-form-item label="法人身份证姓名" name="idcardName">
        <a-input v-model:value.trim="applymentDetailInfo.idcardName" @change="getIdcardName()"/>
      </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="idcardAddress">
        <a-input v-model:value.trim="applymentDetailInfo.idcardAddress" />
      </a-form-item>

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

      <a-form-item label="法人身份证起始有效期" name="idcardEffectBegin">
        <a-input v-model:value.trim="applymentDetailInfo.idcardEffectBegin" placeholder="示例：2023-10-10"/>
        <span class="jeepay-tip-text">(示例：2023-10-10，中间用 - 分隔)</span>
      </a-form-item>

      <a-form-item class="jeepay-valid" label="法人身份证结束有效期" name="idcardEffectEnd">
        <div>
          <a-input v-model:value.trim="applymentDetailInfo.idcardEffectEnd"
                   :disabled="applymentDetailInfo.idcardEffectEnd == '长期'" style="width: 150px;margin-right: 10px;" placeholder="示例：2023-10-10"/>
          <a-checkbox :checked="applymentDetailInfo.idcardEffectEnd == '长期' "
                      @change="(e) => applymentDetailInfo.idcardEffectEnd = e.target.checked ? '长期' : '' ">长期
          </a-checkbox>
        </div>
        <span class="jeepay-tip-text">(示例：2023-10-10，中间用 - 分隔)</span>
      </a-form-item>
    </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-form-item label="商户全称" name="mchFullName" v-if="applymentDetailInfo.merchantType == 1" >
        <a-input v-model:value.trim="applymentDetailInfo.mchFullName" placeholder="填写商户全称"/>
        <span class="jeepay-tip-text">
          <p>1、有门头字号：商户所在城市+街道+负责人姓名+商户门头字号名称（<span style="color: #F00">如：上海市峨山路张三湖南米粉店</span>）</p>
          <p>2、无门头字号：商户所在城市+负责人姓名+商户经营名称（<span style="color: #F00">如：上海市张三湖南米粉店</span>）</p>
        </span>
      </a-form-item>
      <a-form-item label="商户简称" name="mchShortName">
        <a-input v-model:value.trim="applymentDetailInfo.mchShortName" placeholder="填写门店或品牌名称，支付时或小票页展示"/>
      </a-form-item>
      <a-form-item label="经营类目（MCC）" name="mccCode">
        <JeepayKqpayMccSelect v-model:merchant-type="applymentDetailInfo.merchantType" v-model:value="applymentDetailInfo.mccCode" @change="changeMccFunc" />
      </a-form-item>
      <a-form-item label="管理员邮箱（登录名）" name="contactEmail">
        <a-input v-model:value.trim="applymentDetailInfo.contactEmail" />
        <span class="jeepay-tip-text">(用于快钱商户平台登录。邮箱全局唯一，<b style="color: #f00">邮箱切记不可以重复使用</b>) </span>
      </a-form-item>
      <!-- 小微商户需要填写经营范围 -->
      <div v-if="applymentDetailInfo.merchantType == 1">
        <a-form-item label="经营范围" name="licenseScope">
          <a-input v-model:value.trim="applymentDetailInfo.licenseScope" placeholder="填写经营业务范围 比如：中餐厅"/>
        </a-form-item>
      </div>

      <!-- <a-form-item label="客户经理姓名" name="cusMgrNm">
        <a-input v-model:value.trim="applymentDetailInfo.cusMgrNm" />
      </a-form-item> -->

      <!-- <a-form-item v-if="applymentDetailInfo.merchantType !== 1" label="实际控制人姓名" name="actualManager">
        <a-input v-model:value.trim="applymentDetailInfo.actualManager" />
      </a-form-item> -->


      <a-divider class="jeepay-m-divider" orientation="left" style="color: #1A66FF;">经营信息</a-divider>

      <a-form-item label="是否为法人（自动补全）" name="isLegalInfo">
        <a-radio-group v-model:value="applymentDetailInfo.isLegalInfo"
                       @change="funLegalInfo(applymentDetailInfo.isLegalInfo)">
          <a-radio value="1">是</a-radio>
          <a-radio value="0">否</a-radio>
        </a-radio-group>
      </a-form-item>

      <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>

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


      <a-form-item label="商户联系人身份证起始有效期" name="contactIdcardEffectBegin">
        <a-input v-model:value.trim="applymentDetailInfo.contactIdcardEffectBegin"  placeholder="示例：2023-10-10"/>
        <span class="jeepay-tip-text">(示例：2023-10-10，中间用 - 分隔)</span>
      </a-form-item>

      <a-form-item class="jeepay-valid" label="商户联系人身份证结束有效期" name="contactIdcardEffectEnd">
        <div>
          <a-input v-model:value.trim="applymentDetailInfo.contactIdcardEffectEnd"
                   :disabled="applymentDetailInfo.contactIdcardEffectEnd == '长期'" style="width: 150px;margin-right: 10px;"  placeholder="示例：2023-10-10"/>
          <a-checkbox :checked="applymentDetailInfo.contactIdcardEffectEnd == '长期' "
                      @change="(e) => applymentDetailInfo.contactIdcardEffectEnd = e.target.checked ? '长期' : '' ">长期
          </a-checkbox>
        </div>
        <span class="jeepay-tip-text">(示例：2023-10-10，中间用 - 分隔)</span>
      </a-form-item>


      <a-form-item label="商户经营省市县" name="areaCode">
        <JeepayAreaSelectKq v-model:value="applymentDetailInfo.areaCode" @change="changeMchAreaFunc" />
      </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="mchAddress">
        <a-input v-model:value.trim="applymentDetailInfo.mchAddress" :addon-before="applymentDetailInfo.areaCodeName"  @change="changeMchAddressFunc"/>
        <span class="jeepay-tip-text" v-if="applymentDetailInfo.addressName && applymentDetailInfo.merchantType != 1">请输入详细经营地址,需要精确到门牌号</span>
        <span class="jeepay-tip-text"  v-if="applymentDetailInfo.merchantType == 1">
          <p>1、有门头（固定门店）：街道+负责人姓名+商户门头名称（<span style="color: #F00">如：峨山路张三湖南米粉店</span>）</p>
          <p>2、无门头（流动摊贩）：街道+负责人姓名+商户经营名称（<span style="color: #F00">如：峨山路张三湖南米粉</span>）</p>
        </span>
      </a-form-item>


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

      <a-form-item label="店内环境照" name="storeInnerImg">
        <JeepayUpload v-model:src="applymentDetailInfo.storeInnerImg" bizType="applyment" :imgSize="2" />
      </a-form-item>

      <a-form-item label="收银台照" name="storeCashierImg">
        <JeepayUpload v-model:src="applymentDetailInfo.storeCashierImg" bizType="applyment" :imgSize="2" />
      </a-form-item>
      <a-form-item label="结算人在收银台内合影" name="cashierWithSettlerImg">
        <JeepayUpload v-model:src="applymentDetailInfo.cashierWithSettlerImg" bizType="applyment" />
        <span class="jeepay-tip-text">(请提供结算人站在收银台内的照片<a href="javascript:void(0)" class="jeepay-tip-bos-img" @click="lookUp(2)"><b>《查看示例》</b></a>  )</span>
      </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>

      <a-form-item label="结算账户类型" name="settlementAccountType">
        <a-radio-group v-model:value="applymentDetailInfo.settlementAccountType" @change="getSettlementAccountType">
          <!--					<a-radio value="C">对私</a-radio>-->
          <!--					<a-radio v-if="applymentDetailInfo.merchantType != 1" value="B">对公</a-radio>-->
          <a-radio value="1">法人对私</a-radio>
          <a-radio value="2" v-if="applymentDetailInfo.merchantType != 1">非法人对私</a-radio>
          <a-radio value="3"  v-if="applymentDetailInfo.merchantType != 1" >对公</a-radio>
        </a-radio-group>
      </a-form-item>



      <div v-if="applymentDetailInfo.merchantType === 3 && applymentDetailInfo.settlementAccountType == 3 ">
        <a-form-item label="开户许可证照片" name="companyAccountLicenseImg">
          <JeepayUpload v-model:src="applymentDetailInfo.companyAccountLicenseImg" bizType="applyment"
                        :imgSize="2" />
        </a-form-item>
      </div>
      <div v-if="applymentDetailInfo.settAccountType == 'C'">
        <!--        <a-form-item label="个人信息单独同意授权书" name="personalInformationAttorney">-->
        <!--          <JeepayUpload v-model:src="applymentDetailInfo.personalInformationAttorney" bizType="applyment"-->
        <!--                        :imgSize="2" />-->
        <!--          <div class="moban_box">-->
        <!--            <span class="moban_box_span" @click="lookUp">查看模版</span>-->
        <!--            <span class="moban_box_span" @click="download">下载模版</span>-->
        <!--          </div>-->
        <!--        </a-form-item>-->

        <!--        <a-form-item label="是否法人结算" name="isUncrpSett"-->
        <!--				v-if="applymentDetailInfo.merchantType != 1 && applymentDetailInfo.settAccountType != 'B'">-->
        <!--				<a-radio-group v-model:value="applymentDetailInfo.isUncrpSett" @change="() => emit('itemRender')">-->
        <!--					<a-radio value="N">法人</a-radio>-->
        <!--					<a-radio value="Y">非法人</a-radio>-->
        <!--				</a-radio-group>-->
        <!--			</a-form-item>-->

        <a-form-item label="结算卡数字面照片" name="settAccountLicenseImg">
          <JeepayUpload v-model:src="applymentDetailInfo.settAccountLicenseImg" bizType="applyment"
                        :imgSize="2" ocrType="bankCard" @ocrScan="ocrScanAccountFunc" />
          <span class="jeepay-tip-text">(上传图片自动识别 银行卡号)</span>
        </a-form-item>
      </div>

      <a-form-item  label="结算卡开户名" name="diySettAccountName"  >

        <a-input v-model:value.trim="applymentDetailInfo.diySettAccountName"  v-if="applymentDetailInfo.merchantType == 1" disabled />
        <a-input v-model:value.trim="applymentDetailInfo.diySettAccountName"  v-else-if="applymentDetailInfo.merchantType != 1 && applymentDetailInfo.settlementAccountType == 1 && applymentDetailInfo.settAccountType == 'C'" disabled />
        <a-input v-model:value.trim="applymentDetailInfo.diySettAccountName"  v-else-if="applymentDetailInfo.merchantType != 1 && applymentDetailInfo.settlementAccountType == 2 && applymentDetailInfo.settAccountType == 'C'"  />
        <a-input v-model:value.trim="applymentDetailInfo.mchFullName"  v-else-if="applymentDetailInfo.merchantType != 1 && applymentDetailInfo.settlementAccountType == 3"  disabled  />
        <span class="jeepay-tip-text" v-if="applymentDetailInfo.merchantType == 1">（小微商户结算卡必须为法人本人结算卡）</span>
      </a-form-item>

      <!-- <a-form-item label="银行开户名" name="settAccountName">
        <a-input v-model:value.trim="applymentDetailInfo.settAccountName" />
        <span class="jeepay-tip-text">如：张三（对私）/公司名称（对公）</span>
      </a-form-item> -->

      <a-form-item label="结算银行卡账号" name="settAccountNo">
        <a-input v-model:value.trim="applymentDetailInfo.settAccountNo" />
      </a-form-item>

      <a-form-item label="开户行省市县" name="settAccountBankBranchAreaCode">
        <JeepayAreaSelectKq v-model:value="applymentDetailInfo.settAccountBankBranchAreaCode"
                            @change="changeBankAreaFunc" />
      </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="settAccountBankBranchName">
        <a-select v-model:value="applymentDetailInfo.settAccountBankBranchName"
                  placeholder="选择支行"
                  show-search
                  label-in-value
                  :filter-option="false"
                  @change="changeBankFunc"
                  @search="settleBranchSearch" :getPopupContainer="(triggerNode) => (triggerNode.parentElement)" >
          <a-select-option v-for="(item, index) in vdata.bankInfoList" :key="index" :value="item.label">
            {{ item.label }}
          </a-select-option>
        </a-select>
        <span class="jeepay-tip-text">(填写银行卡号并且选择开户行省市县后将展开支行列表)</span>
      </a-form-item>
      <div v-if="applymentDetailInfo.merchantType === 3 && applymentDetailInfo.settlementAccountType < 3 ">
        <a-form-item label="开户许可证照片" name="companyAccountLicenseImg">
          <JeepayUpload v-model:src="applymentDetailInfo.companyAccountLicenseImg" bizType="applyment"
                        :imgSize="2" />
        </a-form-item>
      </div>

      <a-form-item label="开户凭证代码" name="accOpenCode" v-if="applymentDetailInfo.merchantType != 1">
        <a-input v-model:value.trim="applymentDetailInfo.accOpenCode" />
      </a-form-item>

      <a-form-item label="开户许可证有效期开始时间" name="accOpenPeriodBegin" v-if="applymentDetailInfo.merchantType != 1">
        <a-input v-model:value.trim="applymentDetailInfo.accOpenPeriodBegin" placeholder="示例：2023-10-10"/>
        <span class="jeepay-tip-text">(示例：2023-10-10，中间用 - 分隔)</span>
      </a-form-item>
      <a-form-item class="jeepay-valid" label="开户许可证有效期截止时间" name="accOpenPeriodEnd" v-if="applymentDetailInfo.merchantType != 1">
        <div>
          <a-input v-model:value.trim="applymentDetailInfo.accOpenPeriodEnd"
                   :disabled="applymentDetailInfo.accOpenPeriodEnd == '长期'"
                   style="width: 150px;margin-right: 10px;" placeholder="示例：2023-10-10"/>
          <a-checkbox :checked="applymentDetailInfo.accOpenPeriodEnd == '长期' "
                      @change="(e) => applymentDetailInfo.accOpenPeriodEnd = e.target.checked ? '长期' : '' ">长期
          </a-checkbox>
        </div>
        <span class="jeepay-tip-text">(示例：2023-10-10，中间用 - 分隔)</span>
      </a-form-item>
      <!--      <a-form-item label="开户意愿函" name="openAccountWillingnessLetter">-->
      <!--        <JeepayUpload v-model:src="applymentDetailInfo.openAccountWillingnessLetter" bizType="applyment" :imgSize="2"/>-->
      <!--      </a-form-item>-->
      <!-- <a-divider class="jeepay-m-divider"
        v-if="applymentDetailInfo.merchantType != 1 && applymentDetailInfo.settAccountType != 'B'"
        orientation="left" style="color: #1A66FF;">结算人信息</a-divider> -->
      <!-- <a-form-item label="是否法人结算" name="isUncrpSett"
        v-if="applymentDetailInfo.merchantType != 1 && applymentDetailInfo.settAccountType != 'B'">
        <a-radio-group v-model:value="applymentDetailInfo.isUncrpSett" @change="() => emit('itemRender')">
          <a-radio value="Y">非法人</a-radio>
          <a-radio value="N">法人</a-radio>
        </a-radio-group>
      </a-form-item> -->
      <!-- && applymentDetailInfo.merchantType != 1 -->
      <div
          v-if="applymentDetailInfo.isUncrpSett == 'Y' && applymentDetailInfo.merchantType != 1 && applymentDetailInfo.settAccountType != 'B'">
        <a-divider class="jeepay-m-divider"  orientation="left"  style="color: #1a66ff"  v-if="applymentDetailInfo.settlementAccountType == 2" >结算人证件信息</a-divider >

        <a-form-item label="结算人身份证人像面照片" name="settAccountIdcard1Img">
          <JeepayUpload v-model:src="applymentDetailInfo.settAccountIdcard1Img" bizType="applyment"
                        :imgSize="2" ocrType="idCard" @ocrScan="ocrScanSettFunc" />
          <span class="jeepay-tip-text">(上传图片自动识别 身份证名称 身份证号)</span>
        </a-form-item>

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

        <a-form-item label="结算人开户名" name="settAccountName">
          <a-input v-model:value.trim="applymentDetailInfo.settAccountName" />
          <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" placeholder="示例：2023-10-10"/>
          <span class="jeepay-tip-text">(示例：2023-10-10，中间用 - 分隔)</span>
        </a-form-item>

        <a-form-item class="jeepay-valid" label="结算人身份证结束有效期" name="settAccountIdcardEffectEnd">
          <div>
            <a-input v-model:value.trim="applymentDetailInfo.settAccountIdcardEffectEnd"
                     :disabled="applymentDetailInfo.settAccountIdcardEffectEnd == '长期'"
                     style="width: 150px;margin-right: 10px;" placeholder="示例：2023-10-10"/>
            <a-checkbox :checked="applymentDetailInfo.settAccountIdcardEffectEnd == '长期' "
                        @change="(e) => applymentDetailInfo.settAccountIdcardEffectEnd = e.target.checked ? '长期' : '' ">
              长期
            </a-checkbox>
          </div>
          <span class="jeepay-tip-text">(示例：2023-10-10，中间用 - 分隔)</span>
        </a-form-item>

        <a-form-item label="结算人身份证地址" name="settleAuthAddress">
          <a-input v-model:value.trim="applymentDetailInfo.settleAuthAddress" />
        </a-form-item>

        <!-- 结算授权书由个人信息单独同意授权书  -->
        <!--        <a-form-item label="结算授权书" name="settleAuthLetterPhoto">-->
        <!--          <JeepayUpload v-model:src="applymentDetailInfo.settleAuthLetterPhoto" bizType="applyment" :imgSize="2"/>-->
        <!--          <span class="jeepay-tip-text">(上传图片自动识别 有效期)</span>-->
        <!--        </a-form-item>-->

        <a-form-item label="结算人手持身份证" name="authHandFssId">
          <JeepayUpload v-model:src="applymentDetailInfo.authHandFssId" bizType="applyment" :imgSize="2" />
        </a-form-item>
      </div>

      <a-form-item
          v-if="applymentDetailInfo.isUncrpSett == 'Y' && applymentDetailInfo.merchantType != 1 && applymentDetailInfo.settAccountType != 'B'"
          label="银行预留手机号" name="bankMobile">
        <a-input v-model:value.trim="applymentDetailInfo.bankMobile" />
      </a-form-item>

            <a-divider class="jeepay-m-divider" orientation="left" style="color: #1A66FF;">结算类型

              <a-popover placement="top" style="background: #0c2640 !important;">
                <template #content  style="background: #ff0 !important;">
                  <p>T1：工作日次日到账，交易资金于周末和法定节假日次日的6点-12点自动结算至银行卡</p>
                  <p>D1：自然日次日到账，全年365天（不分节假日）的交易资金于自然日的次日6点-12点自动结算至银行卡</p>
                  <p>D0：实时到账，全年365天24小时（不分节假日）的交易资金笔笔实时秒到至银行卡，更放心更快捷</p>
                </template>
                <question-circle-outlined />
              </a-popover>
            </a-divider>

            <a-form-item label="结算类型" name="settleType" >
              <div style="display: grid">
                <a-radio-group v-model:value="applymentDetailInfo.settleType">
                  <a-radio value="T1"  v-if="vdata.settlementMethod.indexOf('T1') !== -1">T1-工作日次日到账</a-radio>
                  <a-radio value="D1"  v-if="vdata.settlementMethod.indexOf('D1') !== -1">D1-次日到账</a-radio>
                  <a-radio value="D0"  v-if="vdata.settlementMethod.indexOf('D0') !== -1">D0-实时到账</a-radio>
                </a-radio-group>
                <div class="jeepay-tip-text jeepay-tip-span" v-if="applymentDetailInfo.settleType == 'D0'">(注意：D0实时到账会有额外的秒到手续费，详见下一步费率信息)</div>
              </div>
            </a-form-item>
    </a-form>

    <!-- 4. 费率配置  -->
    <a-form v-show="vdata.showStyle == showStyleEnum.block || vdata.currentStep == 4" ref="stepForm4Ref"
            :model="applymentDetailInfo" :label-col="{ span: 4 }" :wrapper-col="{ span: 16 }" :rules="vdata.step4Rules">
      <div label="配置费率" name="fee" style="width:100%;">
        <!--				<JeepayPaywayRatePanel-->
        <!--            ref="jeepayPaywayRatePanelRef"-->
        <!--            :configMode="configMode"-->
        <!--					 :infoId=" (mchApplymentData.applyId || '') + '_' + mchApplymentData.mchNo"-->
        <!--					 :selectIfCode="mchApplymentData.ifCode"-->
        <!--            onlyRate="true"-->
        <!--            :channelStatus="'2'"-->
        <!--            :channelNo="mchApplymentData.isvNo"-->
        <!--            :channelAppId="mchApplymentData.autoConfigMchAppId"-->
        <!--            :channelRange="mchApplymentData.range"-->
        <!--        />-->
        <JeepayPaywayRateUserOfflinePanel
            v-if="mchApplymentData.range == 0"
            ref="jeepayPaywayRateUserOfflinePanelRef"
            :configMode="configMode"
            :infoId="
            (mchApplymentData.applyId || '') + '_' + mchApplymentData.mchNo
          "
            :selectIfCode="mchApplymentData.ifCode"
            onlyRate="true"
            :channelNo="mchApplymentData.isvNo"
            :channelRange="mchApplymentData.range"
            :channelAppId="mchApplymentData.autoConfigMchAppId"
        />
        <JeepayPaywayRateUserOnlinePanel
            v-if="mchApplymentData.range == 1"
            ref="jeepayPaywayRateUserOnlinePanelRef"
            :configMode="configMode"
            :infoId="
            (mchApplymentData.applyId || '') + '_' + mchApplymentData.mchNo
          "
            :selectIfCode="mchApplymentData.ifCode"
            onlyRate="true"
            :channelNo="mchApplymentData.isvNo"
            :channelRange="mchApplymentData.range"
            :channelAppId="mchApplymentData.autoConfigMchAppId"
        />
      </div>
    </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 < 4" 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, defineEmits, inject, ref } from 'vue'
import {$bankBranchList, $getSettType} from '@/api/manage'
import ruleGenerator from '@/utils/ruleGenerator'
import { debounce } from 'lodash-es';
import fileDownload from 'js-file-download'

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

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

const jeepayPaywayRatePanelRef = ref()
const jeepayPaywayRateUserOfflinePanelRef = ref()
const jeepayPaywayRateUserOnlinePanelRef = ref()

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

// emit： 向父组件进行通讯。
const emit = defineEmits(['itemRender'])

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

// 响应式数据
const vdata : any = reactive({
  showStyle: 'step', // 显示类型： step-分步,  block-整页显示
  steps: ['主体信息', '经营信息', '结算信息'],
  isTempData: false, // 是否保存草稿
  payWayFee: '未设置',
  currentStep: 1,
  settlementMethod:[] as any,
  bankInfoList: [],
  initBankInfoList: [],
  step1Rules: {
    merchantType: [ruleGenerator.requiredSelect('商户类型', 'number')],
    licenseImg: [ruleGenerator.requiredUpload('营业执照照片')],
    licenseNo: [ruleGenerator.requiredInput('营业执照编号')],
    licenseEffectBegin: [ruleGenerator.requiredInput('营业执照起始有限期'), ruleGenerator.dateOrForever],
    licenseEffectEnd: [ruleGenerator.requiredInput('营业执照截止有限期'), ruleGenerator.dateOrForever],
    licenseScope: [ruleGenerator.requiredInput('营业执照已经范围不能为空')],
    // mchFullName: [ruleGenerator.requiredInput('商户名称')],
    idcardName: [ruleGenerator.requiredInput('身份证中的姓名')],
    idcardNo: [ruleGenerator.requiredInput('身份证号')],
    idcardAddress: [ruleGenerator.requiredInput('法人地址')],
    legalPersonPhone: [ruleGenerator.requiredInput('法人电话')],
    idcardEffectBegin: [ruleGenerator.requiredInput('身份证起始有效期'), ruleGenerator.date],
    idcardEffectEnd: [ruleGenerator.requiredInput('身份证有效期截止日期'), ruleGenerator.dateOrForever],
    idcard1Img: [ruleGenerator.requiredUpload('法人身份证人像面照片')],
    idcard2Img: [ruleGenerator.requiredUpload('法人身份证国徽面照片')],
    licenseAddress: [ruleGenerator.requiredInput('营业执照注册地址')],
    idcardInHandImg: [ruleGenerator.requiredInput('法人手持身份证照片')],
  },
  step2Rules: {
    mccCode: [ruleGenerator.requiredSelect('行业')],
    mchFullName: [ruleGenerator.requiredInput('商户全称')],
    mchShortName: [ruleGenerator.requiredInput('商户简称')],
    contactName: [ruleGenerator.requiredInput('联系人姓名')],
    contactPhone: [ruleGenerator.requiredInput('联系人电话')],
    contactEmail: [ruleGenerator.requiredInput('联系人邮箱')],
    contactIdcardNo: [ruleGenerator.requiredInput('联系人身份证号码')],
    contactIdcardEffectBegin: [ruleGenerator.requiredInput('联系人身份证有效期开始时间')],
    contactIdcardEffectEnd: [ruleGenerator.requiredInput('联系人身份证有效期截止时间')],
    // cusMgrNm: [ruleGenerator.requiredInput('客户经理姓名')],
    areaCode: [ruleGenerator.requiredSelect('位置编码', 'array')],
    address: [ruleGenerator.requiredInput('经营地址')],
    mchAddress: [ruleGenerator.requiredInput('经营地址')],
    merBusiContent: [ruleGenerator.requiredSelect('经营内容')],
    storeOuterImg: [ruleGenerator.requiredUpload('门头照')],
    storeInnerImg: [ruleGenerator.requiredUpload('店内环境照')],
    storeCashierImg: [ruleGenerator.requiredUpload('收银台照')],
    cashierWithSettlerImg: [ ruleGenerator.requiredInput('请提供结算人站在收银台内的照片') ],

  },
  step3Rules: {
    personalInformationAttorney: [ruleGenerator.requiredUpload('个人信息单独授权同意书')],
    // openAccountWillingnessLetter: [ruleGenerator.requiredUpload("开户意愿函")],
    // isUncrpSett: [ruleGenerator.requiredSelect('是否法人结算')],
    settlementAccountType: [ruleGenerator.requiredSelect('结算账户类型')],
    settType: [ruleGenerator.requiredSelect('账户方式')],
    settAccountNo: [ruleGenerator.requiredInput('银行帐号')],
    // settAccountName: [ruleGenerator.requiredInput('开户名')],
    settAccountBankName: [ruleGenerator.requiredInput('银行名称')],
    bankType: [ruleGenerator.requiredInput('开户行编号')],
    openAccBanktype: [ruleGenerator.requiredInput('开户行行号')],
    bankMobile: [ruleGenerator.requiredInput('预留手机号')],
    settAccountBankBranchAreaCode: [ruleGenerator.requiredSelect('支行地区', 'array')],
    settAccountBankBranchName: [ruleGenerator.requiredInput('开户支行名称')],

    settAccountIdcard1Img: [ruleGenerator.requiredUpload('结算人身份证人像面照片')],
    settAccountIdcard2Img: [ruleGenerator.requiredUpload('结算人身份证国徽面照片')],
    settleAuthLetterPhoto: [ruleGenerator.requiredUpload('结算授权书')],
    settleAuthLetterHandlePhoto: [ruleGenerator.requiredUpload('法人手持结算授权书')],
    settAccountIdcardNo: [ruleGenerator.requiredInput('结算人身份证号')],
    settleAuthAddress: [ruleGenerator.requiredInput('结算人身份证地址')],
    settAccountIdcardEffectBegin: [ruleGenerator.requiredInput('结算人身份证有效期开始时间')],
    settAccountIdcardEffectEnd: [ruleGenerator.requiredInput('结算人身份证有效期截止时间')],
    settAccountLicenseImg: [ruleGenerator.requiredUpload('银行卡正面照')],
    diySettAccountName: [ruleGenerator.requiredUpload('结算卡开户名')],
    settAccountBankImg2: [ruleGenerator.requiredUpload('银行卡反面照')],
    companyAccountLicenseImg: [ruleGenerator.requiredUpload('开户许可证照片')],
    accOpenCode: [ruleGenerator.requiredInput('开户凭证代码不能为空')],
    accOpenPeriodBegin: [ruleGenerator.requiredInput('开户凭证代码不能为空')],
    accOpenPeriodEnd: [ruleGenerator.requiredInput('开户凭证代码不能为空')],
    authHandFssId: [ruleGenerator.requiredInput('结算人手持身份证图')],

    settleType: [ruleGenerator.requiredInput('结算类型\n')],
  },

})

// 接收进件参数（包含 用户号， ifCode ）
let mchApplymentDataRef : any = inject('mchApplymentData')
let mchApplymentData : any = mchApplymentDataRef.value

console.log(mchApplymentData,'mchApplymentData')

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

if (!applymentDetailInfo.merchantType) {
  applymentDetailInfo.merchantType = 3;
}
if(!applymentDetailInfo.diySettAccountName){

  if(applymentDetailInfo.merchantType == 1){
    applymentDetailInfo.diySettAccountName = applymentDetailInfo.idcardName
  }else{
    applymentDetailInfo.diySettAccountName = applymentDetailInfo.mchFullName
  }
}
getSettType()
// 参数注入： 配置方式
let configMode : any = inject('configMode')


// 获取地区信息
/* function changeAreaCodeFunc(e) {
  $getAreaCodeList(mchApplymentData.mchNo, mchApplymentData.ifCode, e ? { cityCode: e[1].value, bankAliasCode: applymentDetailInfo.bankAliasCode } : undefined).then((res) => {
  vdata.bankBranchList = res
  applymentDetailInfo.settAccountBankBranchName = ''
  })
} */
// changeAreaCodeFunc(undefined)

const settleBranchSearch = debounce(value => {
  console.log('settleBranchSearch', value);
  // 区编码
  if (applymentDetailInfo?.openAccCity) {
    vdata.bankInfoList = []
    const param = {
      cityCode: applymentDetailInfo.openAccCity,
      bankName: applymentDetailInfo.settAccountBankName,
      branchName: value
    };
    addCity(value)
    // $bankBranchList(mchApplymentData.mchNo, mchApplymentData.ifCode, param,mchApplymentData.isvNo).then((res) => {
    //   if (res?.length) {
    //     vdata.initBankInfoList = res
    //     vdata.initBankInfoList.forEach(element => {
    //       vdata.bankInfoList.push({
    //         label: element.branchName,
    //         value: element.branchNo,
    //         branchNo: element.branchNo,
    //         bankName: element.bankName,
    //         bankCode: element.bankCode,
    //       })
    //     })
    //   } else {
    //     $infoBox.message.error('该支行名称未搜索到或该地区没有对应的银行列表')
    //   }
    // })
  } else {
    $infoBox.message.warn('请先选择地区')
  }
}, 300)

function addCity(value) {
  vdata.bankInfoList = []
  if(applymentDetailInfo.openAccCityName){
    return false;
  }
  const param = {
    cityCode:applymentDetailInfo.openAccCity,
    branchName: value
  };
  $bankBranchList(mchApplymentData.mchNo, mchApplymentData.ifCode, param,mchApplymentData.isvNo).then((res) => {
    if (res?.length) {
      vdata.initBankInfoList = res
      vdata.initBankInfoList.forEach(element => {
        vdata.bankInfoList.push({
          label: element.branchName,
          value: element.branchNo,
          branchNo: element.branchNo,
          bankName: element.bankName,
          bankCode: element.bankCode,
        })
      })
    } else {
      $infoBox.message.error('该支行名称未搜索到或该地区没有对应的银行列表')
    }
  })
}

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

// 上一步
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)
  })
}

// 切换商户类型
function changeMerchantType() {
  if (applymentDetailInfo.merchantType == 1) {
    applymentDetailInfo.isUncrpSett = 'Y'
  } else {
    applymentDetailInfo.isUncrpSett = ''
  }
  applymentDetailInfo.mccCode = ''
}

// 图片识别的回调函数
function ocrScanFunc(orcObject : any) {
  if (orcObject) {
    applymentDetailInfo.settAccountBankName = orcObject.settAccountBankName
    applymentDetailInfo.settAccountBankBranchName = orcObject.settAccountBankName
    Object.assign(applymentDetailInfo, orcObject)
  }
  getIdcardName()
}
function ocrScanAccountFunc(orcObject : any) {
  if (orcObject) {
    applymentDetailInfo.settAccountBankName = orcObject.settAccountBankName
    applymentDetailInfo.settAccountBankBranchName = orcObject.settAccountBankName
    addCity(applymentDetailInfo.settAccountBankBranchName)
    Object.assign(applymentDetailInfo, orcObject)
  }
  getIdcardName()
}

// 结算人身份证  图片识别的回调函数
function ocrScanSettFunc(orcObject : any) {
  if (orcObject?.idcardName) {
    applymentDetailInfo.settAccountName = orcObject.idcardName
    applymentDetailInfo.settAccountIdcardNo = orcObject.idcardNo
    applymentDetailInfo.settleAuthAddress = orcObject.idcardAddress
  }
  if (orcObject?.idcardEffectBegin) {
    applymentDetailInfo.settAccountIdcardEffectBegin = orcObject.idcardEffectBegin
    applymentDetailInfo.settAccountIdcardEffectEnd = orcObject.idcardEffectEnd
  }
}

// 备用结算银行卡  图片识别的回调函数
function ocrStandByStlAccCardImgFunc(orcObject : any) {
  if (orcObject) {
    applymentDetailInfo.standByStlAccNo = orcObject.settAccountNo
  }
}

// 图片识别的回调函数
function ocrScanFuncByCompanyBeneficiary(orcObject, i) {
  if (orcObject) {
    Object.assign(applymentDetailInfo.companyBeneficiaryList[i], orcObject)
  }
}

// 点击【保存】的前置事件, 需要返回Promise对象
function saveDataPreCallback(isTemp) {
  // 判断下： 是否包含该组件， 若没有该组件（比如分账模式下）， 则无需获取此费率数据
  // if (jeepayPaywayRatePanelRef.value) {
  //
  // 	// 放置费率配置项
  // 	let paywayFeeList = jeepayPaywayRatePanelRef.value.getReqMchRatePaywayFeeList()
  // 	if (typeof (paywayFeeList) != 'object') {
  // 		return Promise.reject()
  // 	}
  //
  // 	// 赋值到对象中
  // 	applymentDetailInfo.reqPaywayFeeList = paywayFeeList
  // }
  if(mchApplymentData.range == 0 && jeepayPaywayRateUserOfflinePanelRef.value){
    // 放置费率配置项
    let paywayFeeList = jeepayPaywayRateUserOfflinePanelRef.value.getReqMchRatePaywayFeeList();
    if (typeof paywayFeeList != "object") {
      return Promise.reject();
    }
    // 赋值到对象中
    applymentDetailInfo.paywayFeeList = paywayFeeList;
  }

  if(mchApplymentData.range == 1 && jeepayPaywayRateUserOnlinePanelRef.value){
    // 放置费率配置项
    let paywayFeeList = jeepayPaywayRateUserOnlinePanelRef.value.getReqMchRatePaywayFeeList();
    if (typeof paywayFeeList != "object") {
      return Promise.reject();
    }
    // 赋值到对象中
    applymentDetailInfo.paywayFeeList = paywayFeeList;
  }

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

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

// 行业编码选择
function changeMccFunc(value) {
  if (value[1]?.licenseCode) {
    applymentDetailInfo.industryQualificationType = value[1]?.licenseCode
  } else {
    applymentDetailInfo.industryQualificationType = ''
  }
}

function funLegalInfo(value) {
  if (value == '1') {
    // 联系人姓名
    applymentDetailInfo.contactName = applymentDetailInfo.idcardName
    // 联系人手机号
    applymentDetailInfo.contactPhone = applymentDetailInfo.legalPersonPhone
    applymentDetailInfo.contactIdcardEffectBegin = applymentDetailInfo.idcardEffectBegin
    applymentDetailInfo.contactIdcardEffectEnd = applymentDetailInfo.idcardEffectEnd
    applymentDetailInfo.contactIdcardNo = applymentDetailInfo.idcardNo
  } else {
    // 联系人姓名
    applymentDetailInfo.contactName = ''
    // 联系人手机号
    applymentDetailInfo.contactPhone = ''
  }
}

// 商户所在省市区
function changeMchAreaFunc(value) {
  if (applymentDetailInfo.address) {
    applymentDetailInfo.address = ''
  }
  vdata.city = value[1].label;
  applymentDetailInfo.areaName = [] as any;
  const areaCodeName = value[0].label + '' + value[1].label + '' + value[2]?.label + ''
  applymentDetailInfo.areaCodeName=areaCodeName

  applymentDetailInfo.areaName.push(value[0].label)
  applymentDetailInfo.areaName.push(value[1].label)
  applymentDetailInfo.areaName.push(value[2].label)

  // applymentDetailInfo.address = value[0].label + '' + value[1].label + '' + value[2]?.label + ''
  applymentDetailInfo.address =( areaCodeName+applymentDetailInfo.mchAddress).replaceAll('undefined', '');
  console.log(applymentDetailInfo.address,'applymentDetailInfo.address')

  applymentDetailInfo.addressName = value[0].label + '' + value[1].label + '' + value[2]?.label + ''
}

// 开户行所在省市区
function changeBankAreaFunc(value) {
  // 区编码
  if (value?.[1]) {
    applymentDetailInfo.openAccCity = value[1].label
    applymentDetailInfo.openAccCity = value[1].label
    vdata.bankInfoList = []
    // applymentDetailInfo.settAccountBankBranchName = null
    addCity(applymentDetailInfo.settAccountBankBranchName)
  }
}

function changeBankFunc(value) {
  console.log(value,'valuevaluevaluevaluevalue')
  if (vdata.initBankInfoList) {
    vdata.initBankInfoList.forEach(element => {
      if (element.branchName == value.value) {
        console.log(element.branchName.value,'branchNamebranchNamebranchNamebranchNamebranchName')
        applymentDetailInfo.settAccountBankBranchName = element.branchName
        applymentDetailInfo.settAccountBankBranchCode = element.branchNo
        applymentDetailInfo.settAccountBankName = element.bankName
        applymentDetailInfo.settAccountBankCode = element.bankCode
        applymentDetailInfo.openAccBanktype = element.branchNo
      }
    })
  }
  console.log(applymentDetailInfo,'applymentDetailInfoapplymentDetailInfo')
}


function lookUp(type){
  let images = "https://syb-manage.oss-cn-hangzhou.aliyuncs.com/personalInformationAttorney.png";
  if(type == 2){
      images = 'https://syb-manage.oss-cn-hangzhou.aliyuncs.com/shouyinbei/cashier_photo.jpg';
  }else if(type == 4){
    images = 'https://syb-manage.oss-cn-hangzhou.aliyuncs.com/personalInformationAttorney.png';
  }
  $viewerApi({images: [images]})
}

function download(){
  // fileDownload('https://syb-manage.oss-cn-hangzhou.aliyuncs.com/personalInformationAttorney.png')
  let fileUrl = 'https://syb-manage.oss-cn-hangzhou.aliyuncs.com/personalInformationAttorney.png';
  if(isMobile){
    lookUp(4)
    return false;
  }
  // 创建一个虚拟的 a 标签
  const link = document.createElement('a');
  link.href = fileUrl;
  link.target = '_blank'; // 在新窗口或标签页中打开
  link.download = 'filename'; // 下载的文件名，你可以根据需要更改

  // 将 a 标签添加到 DOM 中
  document.body.appendChild(link);

  // 模拟点击 a 标签，触发下载
  link.click();

  // 移除添加的 a 标签
  document.body.removeChild(link);
}
function changeMchAddressFunc(){
  const areaCodeName =  applymentDetailInfo.areaCodeName.replaceAll('/', '');
  applymentDetailInfo.address = areaCodeName+(applymentDetailInfo.mchAddress??"")
}

function getSettlementAccountType() {
  if(applymentDetailInfo.settlementAccountType == 1){
    applymentDetailInfo.settAccountType = "C"
    applymentDetailInfo.isUncrpSett = "N"
  }
  if(applymentDetailInfo.settlementAccountType == 2){
    applymentDetailInfo.settAccountType = "C"
    applymentDetailInfo.isUncrpSett = "Y"
  }

  if(applymentDetailInfo.settlementAccountType == 3){
    applymentDetailInfo.settAccountType = "B"
  }

  emit('itemRender')
  getIdcardName()
}
function getIdcardName() {
  applymentDetailInfo.diySettAccountName =   applymentDetailInfo.idcardName;
  applymentDetailInfo.standByStlAccNm =   applymentDetailInfo.idcardName;
}
function getDiySettAccountName() {
  applymentDetailInfo.diySettAccountName =   applymentDetailInfo.mchFullName;
}

function getSettType() {
  $getSettType( mchApplymentData.ifCode,mchApplymentData.isvNo).then((res) => {
    vdata.settlementMethod = res
  })
}
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;
}
.moban_box{
  color: #1965FF;
  margin: 10px 0;
}
.moban_box_span{
  padding: 5px 10px;
}

:deep(.jeepay-valid .ant-form-item-control-input-content){
  display: block !important;
}

.jeepay-tip-span::before{
  display: none !important;
}
</style>
