<template>
  <!-- 提现账号 -->
  <div class="shandeMchPage flex-col"
    :class="{ page1: pageType === '1', page2: pageType === '2', page3: pageType === '3', page4: pageType === '4' }">
    <s-header :name="$t('joinpayMch.withdrawalAccountNo')" :noback="false"></s-header>
    <div class="shandeMchBox flex-col">
      <div class="topSpeed" v-if="pageType !== '4'"
        :class="{ page1: pageType === '1', page2: pageType === '2', page3: pageType === '3' }"></div>
      <div v-if="pageType === '1' || pageType === '4'">
        <van-form @submit="saveJoinPayMchFun">
          <van-field v-model="altMchName" name="altMchName" :label="$t('joinpayMch.merchantNameLabel')" readonly />
          <van-field v-model="altMchNo" name="altMchNo" :label="$t('joinpayMch.merchantAccountLabel')" readonly />
          <van-field v-model="altMchShortName" name="altMchShortName" :label="$t('joinpayMch.merchantAbbreviationLabel')"
            readonly />
          <div class="van-cell van-field requiredLeft">
            <div class="van-cell__title van-field__label"><span>{{ $t('joinpayMch.merchantType') }}:</span></div>
            <div class="van-cell__value van-field__value radioBox">
              <van-radio-group v-model="altMerchantType" direction="horizontal" @change="fieldUpdate">
                <van-radio name="10" icon-size="18px">{{ $t('joinpayMch.personal') }}</van-radio>
                <van-radio name="11" icon-size="18px">{{ $t('joinpayMch.individualBusinesses') }}</van-radio>
                <van-radio name="12" icon-size="18px">{{ $t('joinpayMch.enterprise') }}</van-radio>
              </van-radio-group>
            </div>
          </div>
          <div class="intervalRow"></div>
          <van-field class="requiredLeft" v-model="busiContactName" name="busiContactName"
            :label="$t('joinpayMch.contactNameLabel')" :placeholder="$t('joinpayMch.contactNamePlaceholder')"
            :rules="[{ required: true, message: $t('joinpayMch.contactNamePlaceholder') }]"
            @update:model-value="fieldUpdate" />
          <van-field class="requiredLeft" v-model="busiContactMobileNo" name="busiContactMobileNo"
            :label="$t('joinpayMch.cellPhoneLabel')" :placeholder="$t('joinpayMch.cellPhonePlaceholder')"
            :rules="[{ required: true, message: $t('joinpayMch.cellPhonePlaceholder') }]"
            @update:model-value="fieldUpdate" />
          <van-field class="requiredLeft" v-model="legalPerson" name="legalPerson"
            :label="$t('joinpayMch.nameOfLegalPerson/IndividualLabel')"
            :placeholder="$t('joinpayMch.nameOfLegalPerson/IndividualPlaceholder')"
            :rules="[{ required: true, message: $t('joinpayMch.nameOfLegalPerson/IndividualPlaceholder') }]"
            @update:model-value="fieldUpdate" />
          <van-field class="requiredLeft" v-model="phoneNo" name="phoneNo"
            :label="$t('joinpayMch.phoneNumberOfLegalPerson/IndividualLabel')"
            :placeholder="$t('joinpayMch.phoneNumberOfLegalPerson/IndividualPlaceholder')"
            :rules="[{ required: true, message: $t('joinpayMch.phoneNumberOfLegalPerson/IndividualPlaceholder') }]"
            @update:model-value="fieldUpdate" />
          <van-field class="requiredLeft" v-model="idCardNo" name="idCardNo" :label="$t('joinpayMch.IDLabel')"
            :placeholder="$t('joinpayMch.IDPlaceholder')"
            :rules="[{ required: true, message: $t('joinpayMch.IDPlaceholder') }]" @update:model-value="fieldUpdate" />
          <van-cell :title="$t('joinpayMch.validityOfIDCard')" :value="idCardExpiry" @click="idCardExpiryShow = true" />
          <van-calendar v-model:show="idCardExpiryShow" @confirm="idCardExpiryOnConfirm" color="#4d6add" />
          <div class="van-cell van-field" v-if="pageType === '4'">
            <div class="van-cell__title van-field__label"><span>{{ $t('joinpayMch.pictureReview') }}:</span></div>
            <div class="van-cell__value van-field__value radioBox"
              style="display: flex; justify-content: space-around; align-items: center;">
              {{ approveStatus }}
              <van-button span="5" round type="primary" style="height: 2em; padding: 0 2em" @click='updateSentImage()'>
                {{ $t('joinpayMch.reUpload') }}</van-button>
            </div>
          </div>
          <div class="van-cell van-field" v-if="pageType === '4'">
            <div class="van-cell__title van-field__label"><span>{{ $t('joinpayMch.signingStatus') }}:</span></div>
            <div class="van-cell__value van-field__value radioBox"
              style="display: flex; justify-content: space-around; align-items: center;">
              {{ signStatus }}
              <van-button span="5" round type="primary" style="height: 2em; padding: 0 2em" @click='altMchSignFun()'>{{
                $t('joinpayMch.signAContract') }}
              </van-button>
            </div>
          </div>
          <div class="intervalRow"></div>
          <div class="van-cell van-field requiredLeft">
            <div class="van-cell__title van-field__label"><span>{{ $t('joinpayMch.accountType') }}:</span></div>
            <div class="van-cell__value van-field__value radioBox">
              <van-radio-group v-model="bankAccountType" direction="horizontal" @change="fieldUpdate">
                <van-radio name="1" icon-size="18px">{{ $t('joinpayMch.debitCard') }}</van-radio>
                <van-radio name="4" icon-size="18px">{{ $t('joinpayMch.corporateAccount') }}</van-radio>
              </van-radio-group>
            </div>
          </div>
          <van-field class="requiredLeft" v-model="bankAccountName" name="bankAccountName"
            :label="$t('joinpayMch.bankAccountNameLabel')" :placeholder="$t('joinpayMch.bankAccountNamePlaceholder')"
            :rules="[{ required: true, message: $t('joinpayMch.bankAccountNamePlaceholder') }]"
            @update:model-value="fieldUpdate" />
          <van-field class="requiredLeft" v-model="bankAccountNo" name="bankAccountNo"
            :label="$t('joinpayMch.bankAccountLabel')" :placeholder="$t('joinpayMch.bankAccountPlaceholder')"
            :rules="[{ required: true, message: $t('joinpayMch.bankAccountPlaceholder') }]"
            @update:model-value="fieldUpdate" />
          <div :class="{ requiredLeft: bankAccountType === '4' }">
            <van-field v-model="bankChannelNo" name="bankChannelNo" :label="$t('joinpayMch.interBankNoLabel')"
              :placeholder="$t('joinpayMch.interBankNoPlaceholder')"
              :rules="[{ required: bankAccountType === '4', message: $t('joinpayMch.interBankNoPlaceholder') }]"
              @update:model-value="fieldUpdate" />
            <van-field v-model="licenseNo" name="licenseNo" :label="$t('joinpayMch.businessLicenseNoLabel')"
              :placeholder="$t('joinpayMch.businessLicenseNoPlaceholder')"
              :rules="[{ required: bankAccountType === '4', message: $t('joinpayMch.businessLicenseNoPlaceholder') }]"
              @update:model-value="fieldUpdate" />
            <van-cell :title="$t('joinpayMch.validityOfBusinessLicenseLabel')" :value="licenseExpiry"
              @click="licenseExpiryShow = true" />
            <van-calendar v-model:show="licenseExpiryShow" @confirm="licenseExpiryOnConfirm" color="#4d6add" />
          </div>
          <div class="intervalRow"></div>
          <div class="van-cell van-field">
            <div class="van-cell__title van-field__label"><span>{{ $t('joinpayMch.settlementMethod') }}:</span></div>
            <div class="van-cell__value van-field__value radioBox">
              <van-radio-group v-model="settMode" direction="horizontal" @change="fieldUpdate">
                <van-radio name="1" icon-size="18px">{{ $t('joinpayMch.autoSettlementByConvergence') }}</van-radio>
                <van-radio name="2" icon-size="18px">{{ $t('joinpayMch.manuallySettledByMerchantPlatform') }}</van-radio>
              </van-radio-group>
            </div>
          </div>
          <div class="van-cell van-field">
            <div class="van-cell__title van-field__label"><span>{{ $t('joinpayMch.settlementCycleType') }}:</span></div>
            <div class="van-cell__value van-field__value radioBox">
              <van-radio-group v-model="settDateType" direction="horizontal" @change="fieldUpdate">
                <van-radio name="1" icon-size="18px">{{ $t('joinpayMch.weekDay') }}</van-radio>
                <van-radio name="2" icon-size="18px">{{ $t('joinpayMch.naturalDay') }}</van-radio>
                <van-radio name="3" icon-size="18px">{{ $t('joinpayMch.monthlySettlementDate') }}</van-radio>
              </van-radio-group>
            </div>
          </div>
          <van-field v-model="riskDay" name="riskDay" :label="$t('joinpayMch.settlementCycleLabel')"
            :placeholder="$t('joinpayMch.settlementCyclePlaceholder')" @update:model-value="fieldUpdate" />
          <van-field v-model="manageScope" name="manageScope" :label="$t('joinpayMch.natureOfBusinessLabel')"
            :placeholder="$t('joinpayMch.natureOfBusinessPlaceholder')" @update:model-value="fieldUpdate" />
          <van-field v-model="manageAddr" name="manageAddr" :label="$t('joinpayMch.businessAddressLabel')"
            :placeholder="$t('joinpayMch.businessAddressPlaceholder')" @update:model-value="fieldUpdate" />
          <!-- 操作 -->
          <van-row justify="space-around" style="padding: 1em">
            <van-button span="5" round type="primary" style="height: 2em; padding: 0 2em" native-type="submit">{{
              $t('joinpayMch.submitDataForReview') }}
            </van-button>
          </van-row>
        </van-form>
      </div>
      <div v-if="pageType === '2'" class="joinPayMch2">
        <img src='../../assets/joinPayMch/center.png' style="width: 50%; margin-top: 3em;" />
        <div v-if="joinPayMchType === '0'" style="width: 100%;">
          <div style="width: 100%; text-align: center;">
            <span style=" font-size: 1.4em; font-weight: bold; line-height: 3;">{{
              $t('joinpayMch.thePlatformAdministratorIsReviewing') }}</span>
          </div>
          <div style="width: 100%; text-align: center;">
            <span style="line-height: 1.2;">{{ $t('joinpayMch.youCan') }}<span
                style="color: #4d6add; text-decoration: underline;" @click='updateJoinPay()'>{{
                  $t('joinpayMch.withdrawAndRevise') }}</span></span>
          </div>
        </div>
        <div v-if="joinPayMchType === '2' || joinPayMchType === '3'" style="width: 100%;">
          <div style="width: 100%; text-align: center;">
            <span style=" font-size: 1.4em; font-weight: bold; line-height: 3; color: #ee0a24;">{{
              $t('joinpayMch.failedToPassTheReview') }}</span>
          </div>
          <div style="width: 100%; text-align: center;">
            <span style="line-height: 1.2;">{{ $t('joinpayMch.failedToPassTheReview') }},<span
                style="color: #4d6add; text-decoration: underline;" @click='pageType = "1"'>{{
                  $t('joinpayMch.clickHereToFillInTheInformationAgain') }}</span></span>
          </div>
        </div>
        <div v-if="joinPayMchStep === '0'">
          <div style="width: 100%; text-align: center;">
            <span style=" font-size: 1.4em; font-weight: bold; line-height: 3; color: #07c160;">{{
              $t('joinpayMch.approvalPassed') }}</span>
          </div>
          <div style="width: 100%; text-align: center;">
            <span style="line-height: 1.2;">{{ $t('joinpayMch.approvalPassed') }},{{ $t('joinpayMch.youCan') }}<span
                style="color: #4d6add; text-decoration: underline;" @click='pageType = "1"'>{{
                  $t('joinpayMch.clickHereToFillInAgainAndSubmitForReview') }}</span></span>
          </div>
          <van-row justify="space-around" style="padding: 1em">
            <van-button span="5" round type="primary" style="height: 2em; padding: 0 2em" @click='pageType = "3"'>
              {{ $t('joinpayMch.nextGoToUploadIDPhotos') }}</van-button>
          </van-row>
        </div>
      </div>
      <div v-if="pageType === '3'">
        <van-form @submit="sentImageFun">
          <div class="upLoaderRow">
            <div class="baseRow flex-row justify-between">
              <div class="group2 flex-col"></div>
              <span class="baseText">{{ $t('joinpayMch.uploYourIdCard') }}</span>
            </div>
            <div class="cardRow">
              <div class="cardLi">
                <van-uploader v-model="cardNegativeList" :max-size="2 * 1024 * 1024" :max-count="1"
                  :after-read="afterRead" @oversize="onOversize" />
                <p>{{ $t('joinpayMch.uploPortrait') }}</p>
              </div>
              <div class="cardLi">
                <van-uploader v-model="cardPositiveList" :max-size="2 * 1024 * 1024" :max-count="1"
                  :after-read="afterRead" @oversize="onOversize" />
                <p>{{ $t('joinpayMch.uploNatiEmblem') }}</p>
              </div>
            </div>
          </div>
          <div class="upLoaderRow" v-if="bankAccountType === '4'">
            <div class="baseRow flex-row justify-between">
              <div class="group2 flex-col"></div>
              <span class="baseText">{{ $t('joinpayMch.businessLicensePlace') }}</span>
            </div>
            <div class="cardRow">
              <div class="cardLi">
                <van-uploader v-model="tradeLicenceList" :max-size="2 * 1024 * 1024" :max-count="1"
                  :after-read="afterRead" @oversize="onOversize" />
                <p>{{ $t('joinpayMch.businessLicense') }}</p>
              </div>
            </div>
          </div>
          <div class="upLoaderRow" v-if="bankAccountType === '4'">
            <div class="baseRow flex-row justify-between">
              <div class="group2 flex-col"></div>
              <span class="baseText">{{ $t('joinpayMch.accountOpeningLicensePlace') }}</span>
            </div>
            <div class="cardRow">
              <div class="cardLi">
                <van-uploader v-model="openAccountLicenceList" :max-size="2 * 1024 * 1024" :max-count="1"
                  :after-read="afterRead" @oversize="onOversize" />
                <p>{{ $t('joinpayMch.accountOpeningLicense') }}</p>
              </div>
            </div>
          </div>
          <van-row justify="space-around" style="padding: 1em">
            <van-button span="5" round type="primary" style="height: 2em; padding: 0 2em" native-type="submit">{{
              $t('joinpayMch.submissions') }}
            </van-button>
          </van-row>
        </van-form>
      </div>
    </div>
  </div>
</template>

<script>
import { onMounted, reactive, toRefs, ref } from "vue";
import sHeader from "../../components/SimpleHeader";
import { showFailToast, showSuccessToast } from "vant";
import { getOneJoinPayMch, saveJoinPayMch, updateJoinPayMchCheck, sentImage, altMchSign } from '../../service/joinpayMch';
import { getLoginUser, styleUrl } from "../../common/js/utils";
import dateUtil from "../../utils/dateUtil";
import { useI18n } from "vue-i18n";

export default {
  components: { sHeader },
  setup() {
    // 引入语言
    const { t } = useI18n();
    const user = getLoginUser();
    const idCardExpiryShow = ref(false);
    const idCardExpiryOnConfirm = (value) => {
      idCardExpiryShow.value = false;
      addParams.idCardExpiry = dateUtil.formateDate(value, "yyyy-MM-dd");
      fieldUpdate();
    };
    const licenseExpiryShow = ref(false);
    const licenseExpiryOnConfirm = (value) => {
      licenseExpiryShow.value = false;
      addParams.licenseExpiry = dateUtil.formateDate(value, "yyyy-MM-dd");
      fieldUpdate();
    };
    let addParams = reactive({
      adminId: user.id, // 当前登录账户的id Long 必填
      altMchName: '', // 分账方名称; string 必填
      altMchNo: '', // 分账方账号; string	必填
      altMchShortName: '', // 分账方商户简称;	string
      altMerchantType: '10', // 分账方商户类型，10:个人，11：个体工商户，12：企业;	integer(int32)	必填

      busiContactName: '', // 业务联系人姓名;	string	必填
      busiContactMobileNo: '', // 业务联系人手机;	string	必填
      legalPerson: '', // 法人;	string	必填
      phoneNo: '', // 电话;	string	必填
      idCardNo: '', // 身份证;	string	必填
      idCardExpiry: '', // 身份证有效期;	string

      bankAccountType: 1, // 账户类型 * 1 借记卡，4 对公账户;	integer(int32)	必填
      bankAccountName: '', // 银行账户名称，分账方结算银行账户名称;	string	必填
      bankAccountNo: '', // 银行账号;	string	必填
      bankChannelNo: '', // 联行号;	string	对公账户;必填
      licenseNo: '', // 营业执照编号;	string	对公账户;必填
      licenseExpiry: '', // 营业执照有效期;	string

      settMode: 1, // 结算方式 * 1 由汇聚自动结算 * 2 由商户平台手工结算（结算接口）;	integer(int32)	默认填1
      settDateType: 1, // 结算周期类型 * 1 工作日，2 自然日，3 月结日;	integer(int32)	默认填1
      riskDay: 1, // 结算周期;	integer(int32)	默认填1
      manageScope: '', // 经营范围;	string
      manageAddr: '', // 经营地址;	string

      bizCode: '', // 业务响应码;	string
      loginName: '', // 分账方登录名，即邮箱;	string
    });
    let cardPositiveList = ref([]);
    let cardNegativeList = ref([]);
    let tradeLicenceList = ref([]);
    let openAccountLicenceList = ref([]);
    let sentImageForm = reactive({
      cardPositive: '', // 身份证正面	String	必填
      cardNegative: '', // 	身份证背面	String	必填
      tradeLicence: '', // 	营业执照图片	String	Type=0时必填
      openAccountLicence: '', // 	开户许可证	String	Type=0时必填
      type: '', // 	账户类型	String	必填 0：对公；1，个人
      status: '0', // 	第几次提交	String	必填 0，第一次提交；1，第n次提交（重新上传）
    });
    const pageType = ref('1');
    const joinPayMchType = ref(null);
    const joinPayMchStep = ref(null);
    let joinPayMchID = null;
    const approveStatus = ref(null);
    const signStatus = ref(null);
    let isMemoryFormType = false;
    onMounted(async () => {
      styleUrl('joinpayMch');
      getOneJoinPayMchFun();
    });
    // 获取备用提现账号回显
    const getOneJoinPayMchFun = async () => {
      const { data } = await getOneJoinPayMch({ adminId: user.id });
      if (data.code === "00000") {
        if (data.data.type === '2' || data.data.type === '3' || data.data.type === '0') {
          joinPayMchType.value = data.data.type;
          pageType.value = '2';
        }
        if ((data.data.type === null || data.data.type === '1') && data.data.step === '0') {
          pageType.value = '2';
          joinPayMchStep.value = '0';
        }
        if ((data.data.type === null || data.data.type === '1') && data.data.step === '1') {
          pageType.value = '4';
        }
        console.log('pageType', pageType.value);

        joinPayMchID = data.data.id;
        approveStatus.value = data.data.approveStatus;
        signStatus.value = data.data.signStatus;
        addParams.altMchName = data.data.altMchName;
        addParams.altMchNo = data.data.altMchNo;
        addParams.altMchShortName = data.data.altMchShortName;
        addParams.altMerchantType = data.data.altMerchantType ? data.data.altMerchantType.toString() : '';

        addParams.busiContactName = data.data.busiContactName;
        addParams.busiContactMobileNo = data.data.busiContactMobileNo;
        addParams.legalPerson = data.data.legalPerson;
        addParams.phoneNo = data.data.phoneNo;
        addParams.idCardNo = data.data.idCardNo;
        if (data.data.idCardExpiry) {
          addParams.idCardExpiry = dateUtil.formateDate(new Date(data.data.idCardExpiry), "yyyy-MM-dd");
        }

        addParams.bankAccountType = data.data.bankAccountType ? data.data.bankAccountType.toString() : '';
        addParams.bankAccountName = data.data.bankAccountName;
        addParams.bankAccountNo = data.data.bankAccountNo;
        addParams.bankChannelNo = data.data.bankChannelNo;
        addParams.licenseNo = data.data.licenseNo;
        if (data.data.licenseExpiry) {
          addParams.licenseExpiry = dateUtil.formateDate(new Date(data.data.licenseExpiry), "yyyy-MM-dd");
        }

        addParams.settMode = data.data.settMode ? data.data.settMode.toString() : '';
        addParams.settDateType = data.data.settDateType ? data.data.settDateType.toString() : '';
        addParams.riskDay = data.data.riskDay;
        addParams.manageScope = data.data.manageScope;
        addParams.manageAddr = data.data.manageAddr;

        addParams.bizCode = data.data.bizCode;
        addParams.loginName = data.data.loginName;
      } else {
        pageType.value = '1';
        showFailToast(data.message);
      }
      memoryForm();
      isMemoryFormType = true;
    };
    // 记忆表单
    const memoryForm = () => {
      const formDataString = localStorage.getItem('joinPayMchForm');
      if (formDataString) {
        const formData = JSON.parse(formDataString);
        Object.keys(formData).forEach(key => {
          addParams[key] = formData[key];
        });
      }
    };
    // 提交审批表单
    const saveJoinPayMchFun = async () => {
      const params = Object.assign({}, addParams);
      params.altMerchantType = parseInt(params.altMerchantType);
      params.bankAccountType = parseInt(params.bankAccountType);
      params.settMode = parseInt(params.settMode);
      params.settDateType = parseInt(params.settDateType);
      const { data } = await saveJoinPayMch(addParams);
      if (data.code === "00000") {
        showSuccessToast(t(('joinpayMch.submittedSuccessfully')));
        // 提交成功后删除记忆的表单
        localStorage.removeItem('joinPayMchForm');
        location.reload();
      } else {
        showFailToast(`${t('joinpayMch.submitFailed')} ${data.message}`);
      }
    };
    // 撤回
    const updateJoinPay = async () => {
      const { data } = await updateJoinPayMchCheck({ id: joinPayMchID });
      if (data.code === "00000") {
        showSuccessToast(t('joinpayMch.withdrawalSucceeded'));
        location.reload();
      } else { showFailToast(`${data.message}`); }
    }
    // 图片上传表单提交
    const sentImageFun = async () => {
      const params = {
        id: joinPayMchID,
        type: addParams.bankAccountType === '4' ? '0' : '1',
        status: sentImageForm.status,
        tradeLicence: null,
        openAccountLicence: null
      };
      if (cardNegativeList.value.length < 1) { showFailToast(t('joinpayMch.uploPortrait')); return; }
      if (cardPositiveList.value.length < 1) { showFailToast(t('joinpayMch.uploNatiEmblem')); return; }
      params.cardPositive = cardPositiveList.value[0].content;
      params.cardNegative = cardNegativeList.value[0].content;
      if (addParams.bankAccountType === '4') {
        if (tradeLicenceList.value.length < 1) { showFailToast(t('joinpayMch.businessLicensePlace')); return; }
        if (openAccountLicenceList.value.length < 1) { showFailToast(t('joinpayMch.accountOpeningLicensePlace')); return; }
      }
      if (tradeLicenceList.value.length > 0) { params.tradeLicence = tradeLicenceList.value[0].content; }
      if (openAccountLicenceList.value.length > 0) { params.openAccountLicence = openAccountLicenceList.value[0].content; }
      const { data } = await sentImage(params);
      if (data.code === "00000") {
        showSuccessToast(t('joinpayMch.uploadSucceeded'));
        location.reload();
      } else { showFailToast(`${data.message}`); }
    }
    // 图片重新上传触发
    const updateSentImage = () => {
      sentImageForm.status = '1';
      pageType.value = '3';
    }
    // 签约触发
    const altMchSignFun = async () => {
      const { data } = await altMchSign({ id: joinPayMchID });
      if (data.code === "00000") {
        showSuccessToast(t('joinpayMch.signingSuccessfully'));
        location.reload();
      } else { showFailToast(`${data.message}`); }
    }
    // 记录表单填写
    const fieldUpdate = () => {
      console.log('fieldUpdate');
      if (isMemoryFormType) {
        localStorage.setItem('joinPayMchForm', JSON.stringify(addParams));
      }
    };
    // 文件上传
    const afterRead = (file) => {
      console.log('afterRead', file);
      console.log('afterRead', file.content);
      console.log(cardPositiveList);
    }
    const onOversize = () => { showFailToast(t('joinpayMch.exceedPictSize')); }
    return {
      pageType,
      joinPayMchType,
      joinPayMchStep,
      ...toRefs(addParams),
      ...toRefs(sentImageForm),
      cardPositiveList,
      cardNegativeList,
      tradeLicenceList,
      openAccountLicenceList,
      saveJoinPayMchFun,
      updateJoinPay,
      sentImageFun,
      approveStatus,
      signStatus,
      updateSentImage,
      altMchSignFun,
      idCardExpiryShow,
      idCardExpiryOnConfirm,
      licenseExpiryShow,
      licenseExpiryOnConfirm,
      fieldUpdate,
      afterRead,
      onOversize
    };
  },
};
</script>

<style lang="less" scoped>
@import "../../common/style/common.less";
</style>
