244 lines
10 KiB
Vue
244 lines
10 KiB
Vue
<template>
|
|
<a-drawer
|
|
v-model:visible="vdata.visible"
|
|
title="上传图片&提交审核"
|
|
width="50%"
|
|
@close="onClose"
|
|
>
|
|
<a-form
|
|
v-if="vdata.currentStep == 1"
|
|
:model="vdata.applyData"
|
|
style="padding-bottom: 30px;"
|
|
:label-col="{ span: 6 }"
|
|
:wrapper-col="{ span: 12 }"
|
|
:rules="vdata.rules"
|
|
>
|
|
<div v-if="vdata.applyData.merchantType != '1'">
|
|
<a-col :offset="1"><a-divider orientation="left" style="color: #1A66FF;">执照信息</a-divider></a-col>
|
|
<a-form-item label="营业执照照片" name="licenseImg">
|
|
<JeepayUpload v-model:src="vdata.applyData.licenseImg" bizType="applyment" />
|
|
|
|
<div v-for="(item, config) in vdata.imgUploadArr" :key="config" :span="8" :offset="1">
|
|
<span v-if="item.picType=='A001'" class="jeepay-tip-text">{{ item.note }}</span>
|
|
</div>
|
|
</a-form-item>
|
|
</div>
|
|
|
|
<a-col :offset="1"><a-divider orientation="left" style="color: #1A66FF;">法人信息</a-divider></a-col>
|
|
<a-form-item label="法人身份证人像面照片" name="idcard1Img">
|
|
<JeepayUpload v-model:src="vdata.applyData.idcard1Img" bizType="applyment" />
|
|
<div v-for="(item, config) in vdata.imgUploadArr" :key="config" :span="8" :offset="1">
|
|
<span v-if="item.picType=='A002'" class="jeepay-tip-text">{{ item.note }}</span>
|
|
</div>
|
|
</a-form-item>
|
|
|
|
<a-form-item label="法人身份证国徽面照片" name="idcard2Img">
|
|
<JeepayUpload v-model:src="vdata.applyData.idcard2Img" bizType="applyment" />
|
|
<div v-for="(item, config) in vdata.imgUploadArr" :key="config" :span="8" :offset="1">
|
|
<span v-if="item.picType=='A003'" class="jeepay-tip-text">{{ item.note }}</span>
|
|
</div>
|
|
</a-form-item>
|
|
|
|
<a-form-item label="手持证件照片" name="idcardInHandImg">
|
|
<JeepayUpload v-model:src="vdata.applyData.idcardInHandImg" bizType="applyment" />
|
|
<div v-for="(item, config) in vdata.imgUploadArr" :key="config" :span="8" :offset="1">
|
|
<span v-if="item.picType=='A009'" class="jeepay-tip-text">{{ item.note }}</span>
|
|
</div>
|
|
</a-form-item>
|
|
|
|
<a-col :offset="1"><a-divider orientation="left" style="color: #1A66FF;">商户信息</a-divider></a-col>
|
|
<a-form-item label="门头照" name="storeOuterImg">
|
|
<JeepayUpload v-model:src="vdata.applyData.storeOuterImg" bizType="applyment" />
|
|
<div v-for="(item, config) in vdata.imgUploadArr" :key="config" :span="8" :offset="1">
|
|
<span v-if="item.picType=='A006'" class="jeepay-tip-text">{{ item.note }}</span>
|
|
</div>
|
|
</a-form-item>
|
|
|
|
<a-form-item label="店内环境照" name="storeInnerImg">
|
|
<JeepayUpload v-model:src="vdata.applyData.storeInnerImg" bizType="applyment" />
|
|
<div v-for="(item, config) in vdata.imgUploadArr" :key="config" :span="8" :offset="1">
|
|
<span v-if="item.picType=='A007'" class="jeepay-tip-text">{{ item.note }}</span>
|
|
</div>
|
|
</a-form-item>
|
|
|
|
<a-form-item label="收银台照" name="storeCashierImg">
|
|
<JeepayUpload v-model:src="vdata.applyData.storeCashierImg" bizType="applyment" />
|
|
<div v-for="(item, config) in vdata.imgUploadArr" :key="config" :span="8" :offset="1">
|
|
<span v-if="item.picType=='A008'" class="jeepay-tip-text">{{ item.note }}</span>
|
|
</div>
|
|
</a-form-item>
|
|
|
|
<a-col :offset="1"><a-divider orientation="left" style="color: #1A66FF;">结算信息</a-divider></a-col>
|
|
|
|
<a-form-item label="结算银行卡正面照片" name="settAccountLicenseImg">
|
|
<JeepayUpload v-model:src="vdata.applyData.settAccountLicenseImg" bizType="applyment" />
|
|
<div v-for="(item, config) in vdata.imgUploadArr" :key="config" :span="8" :offset="1">
|
|
<span v-if="item.picType=='A004'" class="jeepay-tip-text">{{ item.note }}</span>
|
|
</div>
|
|
</a-form-item>
|
|
|
|
<a-form-item label="结算银行卡反面照片" name="settAccountBankImg2">
|
|
<JeepayUpload v-model:src="vdata.applyData.settAccountBankImg2" bizType="applyment" />
|
|
<div v-for="(item, config) in vdata.imgUploadArr" :key="config" :span="8" :offset="1">
|
|
<span v-if="item.picType=='A005'" class="jeepay-tip-text">{{ item.note }}</span>
|
|
</div>
|
|
</a-form-item>
|
|
|
|
<div v-if="vdata.applyData.merchantType == '3'">
|
|
<a-form-item label="开户许可证照片" name="companyAccountLicenseImg">
|
|
<JeepayUpload v-model:src="vdata.applyData.companyAccountLicenseImg" bizType="applyment" />
|
|
<div v-for="(item, config) in vdata.imgUploadArr" :key="config" :span="8" :offset="1">
|
|
<span v-if="item.picType=='A011'" class="jeepay-tip-text">{{ item.note }}</span>
|
|
</div>
|
|
</a-form-item>
|
|
</div>
|
|
|
|
<div v-if="vdata.applyData.codeLegalPersonAcc =='0'">
|
|
<a-form-item label="入账账户身份证人像面照片" name="settAccountIdcard1Img">
|
|
<JeepayUpload v-model:src="vdata.applyData.settAccountIdcard1Img" bizType="applyment" />
|
|
<div v-for="(item, config) in vdata.imgUploadArr" :key="config" :span="8" :offset="1">
|
|
<span v-if="item.picType=='A013'" class="jeepay-tip-text">{{ item.note }}</span>
|
|
</div>
|
|
</a-form-item>
|
|
|
|
<a-form-item label="入账账户身份证国徽面照片" name="settAccountIdcard2Img">
|
|
<JeepayUpload v-model:src="vdata.applyData.settAccountIdcard2Img" bizType="applyment" />
|
|
<div v-for="(item, config) in vdata.imgUploadArr" :key="config" :span="8" :offset="1">
|
|
<span v-if="item.picType=='A014'" class="jeepay-tip-text">{{ item.note }}</span>
|
|
</div>
|
|
</a-form-item>
|
|
|
|
<a-form-item label="结算授权证书照片" name="settleAuthLetterPhoto">
|
|
<JeepayUpload v-model:src="vdata.applyData.settleAuthLetterPhoto" bizType="applyment" />
|
|
<div v-for="(item, config) in vdata.imgUploadArr" :key="config" :span="8" :offset="1">
|
|
<span v-if="item.picType=='B005'" class="jeepay-tip-text">{{ item.note }}</span>
|
|
</div>
|
|
</a-form-item>
|
|
</div>
|
|
|
|
<a-col :offset="1"><a-divider orientation="left" style="color: #1A66FF;">其他信息</a-divider></a-col>
|
|
<a-form-item label="收单协议盖章页照片" name="acquiringAgreementPhoto">
|
|
<JeepayUpload v-model:src="vdata.applyData.acquiringAgreementPhoto" bizType="applyment" />
|
|
<div v-for="(item, config) in vdata.imgUploadArr" :key="config" :span="8" :offset="1">
|
|
<span v-if="item.picType=='A010'" class="jeepay-tip-text">{{ item.note }}</span>
|
|
</div>
|
|
</a-form-item>
|
|
<a-form-item label="其他材料照片" name="other1">
|
|
<JeepayUpload v-model:src="vdata.applyData.other1" bizType="applyment" />
|
|
<div v-for="(item, config) in vdata.imgUploadArr" :key="config" :span="8" :offset="1">
|
|
<span v-if="item.picType=='B008'" class="jeepay-tip-text">{{ item.note }}</span>
|
|
</div>
|
|
</a-form-item>
|
|
</a-form>
|
|
|
|
<div class="drawer-btn-center">
|
|
<a-button :style="{ marginRight: '8px' }" @click="onClose"><close-outlined />关闭</a-button>
|
|
<a-button v-if="vdata.currentStep == 1" type="primary" :loading="vdata.btnLoading" @click="onSubmit"><check-outlined />上传&提审</a-button>
|
|
</div>
|
|
</a-drawer>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import { API_URL_MCH_APPLYMENT_LIST, req, $elecContractGenerate, $elecContractSign, $yspayUpload } from '@/api/manage'
|
|
import moment from 'moment'
|
|
import { getCurrentInstance, reactive } from 'vue'
|
|
import ruleGenerator from '@/utils/ruleGenerator'
|
|
const { $infoBox } = getCurrentInstance()!.appContext.config.globalProperties
|
|
|
|
const props = defineProps({
|
|
callbackFunc: { type: Function, default:null }
|
|
})
|
|
|
|
const vdata : any = reactive({
|
|
currentStep: 1,
|
|
recordId: null, // 更新对象ID
|
|
applyData: {} as any, // 进件资料对象
|
|
visible: false, // 是否显示弹层/抽屉
|
|
signData: {} as any, // 电子协议对象
|
|
isSign: false, // 是否已签署电子协议
|
|
rules: {
|
|
licenseImg: [ ruleGenerator.requiredUpload('营业执照照片') ],
|
|
idcard1Img: [ ruleGenerator.requiredUpload('法人身份证人像面照片') ],
|
|
idcard2Img: [ ruleGenerator.requiredUpload('法人身份证国徽面照片') ],
|
|
idcardInHandImg: [ ruleGenerator.requiredUpload('手持身份证照片') ],
|
|
storeOuterImg: [ ruleGenerator.requiredUpload('门头照') ],
|
|
storeInnerImg: [ ruleGenerator.requiredUpload('内景照') ],
|
|
storeCashierImg: [ ruleGenerator.requiredUpload('收银台照') ],
|
|
settAccountLicenseImg: [ ruleGenerator.requiredUpload('结算银行卡正面照片') ],
|
|
settAccountBankImg2: [ ruleGenerator.requiredUpload('结算银行卡反面照片') ],
|
|
companyAccountLicenseImg: [ ruleGenerator.requiredUpload('开户许可证照片') ],
|
|
settAccountIdcard1Img: [ ruleGenerator.requiredUpload('入账账户身份证人像面照片') ],
|
|
settAccountIdcard2Img: [ ruleGenerator.requiredUpload('入账账户身份证国徽面照片') ],
|
|
settleAuthLetterPhoto: [ ruleGenerator.requiredUpload('结算授权证书照片') ],
|
|
},
|
|
imgUploadArr: [], // 图片上传结果
|
|
})
|
|
|
|
function show (recordId) { // 弹层打开事件
|
|
|
|
vdata.recordId = recordId
|
|
|
|
req.getById(API_URL_MCH_APPLYMENT_LIST, recordId, { originData: '1' }).then( (res) => {
|
|
// 图片上传结果置空
|
|
vdata.imgUploadArr = []
|
|
|
|
vdata.applyData = JSON.parse(res.applyDetailInfo)
|
|
|
|
// 签约完成，上传图片
|
|
vdata.currentStep = 1
|
|
|
|
vdata.visible = true
|
|
})
|
|
}
|
|
|
|
function elecContractGenerate() {
|
|
$elecContractGenerate(vdata.recordId).then( (res) => {
|
|
vdata.detailData = res
|
|
if (vdata.detailData.storeSuccResParameter.includes('协议已审核通过')) {
|
|
vdata.isSign = true
|
|
}else if(vdata.detailData.storeSuccResParameter) {
|
|
vdata.signData = JSON.parse(vdata.detailData.storeSuccResParameter)
|
|
|
|
var dateArr = vdata.signData.expireTs.split(' ')
|
|
vdata.signData.expireTs = moment(dateArr[0]).format('yyyy-MM-DD') + ' ' + dateArr[1]
|
|
}
|
|
})
|
|
}
|
|
|
|
function onSubmit() {
|
|
vdata.btnLoading = true
|
|
|
|
if (vdata.currentStep == 1) {
|
|
$yspayUpload(vdata.recordId, vdata.applyData).then((res) => {
|
|
if(res) {
|
|
vdata.imgUploadArr = JSON.parse(res)
|
|
}
|
|
|
|
$infoBox.message.success('操作成功')
|
|
vdata.currentStep = 1
|
|
props.callbackFunc() // 刷新列表
|
|
vdata.btnLoading = false
|
|
vdata.visible = false
|
|
}).catch(() => {
|
|
vdata.btnLoading = false
|
|
})
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
function onClose () {
|
|
vdata.visible = false
|
|
}
|
|
|
|
|
|
defineExpose({ show })
|
|
</script>
|
|
<style scoped>
|
|
|
|
.form-item-content{
|
|
width: 70%
|
|
}
|
|
|
|
</style> |