源文件
This commit is contained in:
213
jeepay-ui-uapp-agent/pageApply/channel/fuiou/fuiouEvent.vue
Normal file
213
jeepay-ui-uapp-agent/pageApply/channel/fuiou/fuiouEvent.vue
Normal file
@@ -0,0 +1,213 @@
|
||||
<template>
|
||||
<!-- 富有待签约
|
||||
富有签约分为两部分
|
||||
1. 如果状态为5 ,则展示签约地址 二维码 与失效时间等信息,签约后,在调用进件详细信息接口更新状态
|
||||
2. 若状态为6 ,则展示图片上传列表。
|
||||
-->
|
||||
<view class="box wx-open" v-if="(channelInfo.state == 5 || channelInfo.state == 6) && channelInfo.code == 'fuioupay'">
|
||||
|
||||
<template v-if="(channelInfo.state == 5) && (vdata.fuiouState != 6)">
|
||||
<view class="flex" style="margin-bottom: 20rpx">
|
||||
<view>协议编号</view>
|
||||
<view>{{ vdata.storeSuccResParameter.contractNo }}</view>
|
||||
</view>
|
||||
|
||||
<view class="flex" style="margin-bottom: 20rpx">
|
||||
<view>过期时间</view>
|
||||
<view>{{ vdata.storeSuccResParameter.expireTs }}</view>
|
||||
</view>
|
||||
|
||||
<view class="down-img">
|
||||
<image :src="vdata.contractImg" mode="aspectFit"></image>
|
||||
<view style="margin-top: 30rpx">请用微信扫描二维码,根据页面指引完成签约</view>
|
||||
<view class="down" @click="down(vdata.contractImg)">保存至相册</view>
|
||||
</view>
|
||||
|
||||
<view class="second-title">电子合同签约地址和二维码:</view>
|
||||
<view style="margin-top: 20rpx;white-space: pre-wrap; word-wrap: break-word; color: #3981ff" @click="toContract('fuioupay')">
|
||||
{{ vdata.storeSuccResParameter.signUrl }}
|
||||
</view>
|
||||
|
||||
<view class="down-img">
|
||||
<view class="down" @click="fuiouhandle()">确认签署</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<!-- 当点击上面的确认签署后,则展示图片上传列表 -->
|
||||
<template v-if="(channelInfo.state == 6) || (vdata.fuiouState == 6)">
|
||||
<JeePayForm text="营业执照照片" :start="false" v-if="vdata.applyDetailInfo.licenseImg">
|
||||
<image :src="vdata.applyDetailInfo.licenseImg" mode="aspectFit" @click="openBackImg(vdata.applyDetailInfo.licenseImg)" class="fuiou-img" />
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm text="法人身份证人像面照片" :start="false" v-if="vdata.applyDetailInfo.idcard1Img">
|
||||
<image :src="vdata.applyDetailInfo.idcard1Img" mode="aspectFit" @click="openBackImg(vdata.applyDetailInfo.idcard1Img)" class="fuiou-img" />
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm text="法人身份证国徽面照片" :start="false" v-if="vdata.applyDetailInfo.idcard2Img">
|
||||
<image :src="vdata.applyDetailInfo.idcard2Img" mode="aspectFit" @click="openBackImg(vdata.applyDetailInfo.idcard2Img)" class="fuiou-img" />
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm text="门头照" :start="false" v-if="vdata.applyDetailInfo.storeOuterImg">
|
||||
<image :src="vdata.applyDetailInfo.storeOuterImg" mode="aspectFit" @click="openBackImg(vdata.applyDetailInfo.storeOuterImg)" class="fuiou-img" />
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm text="店内环境照" :start="false" v-if="vdata.applyDetailInfo.storeInnerImg">
|
||||
<image :src="vdata.applyDetailInfo.storeInnerImg" mode="aspectFit" @click="openBackImg(vdata.applyDetailInfo.storeInnerImg)" class="fuiou-img" />
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm text="结算银行卡照片" :start="false" v-if="vdata.applyDetailInfo.settAccountLicenseImg">
|
||||
<image :src="vdata.applyDetailInfo.settAccountLicenseImg" mode="aspectFit" @click="openBackImg(vdata.applyDetailInfo.settAccountLicenseImg)" class="fuiou-img" />
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm text="开户许可证照片" :start="false" v-if="vdata.applyDetailInfo.companyAccountLicenseImg">
|
||||
<image :src="vdata.applyDetailInfo.companyAccountLicenseImg" mode="aspectFit" @click="openBackImg(vdata.applyDetailInfo.companyAccountLicenseImg)" class="fuiou-img" />
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm text="入账账户身份证人像照" :start="false" v-if="vdata.applyDetailInfo.settAccountIdcard1Img">
|
||||
<image :src="vdata.applyDetailInfo.settAccountIdcard1Img" mode="aspectFit" @click="openBackImg(vdata.applyDetailInfo.settAccountIdcard1Img)" class="fuiou-img" />
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm text="入账账户身份证国徽面照片" :start="false" v-if="vdata.applyDetailInfo.settAccountIdcard2Img">
|
||||
<image :src="vdata.applyDetailInfo.settAccountIdcard2Img" mode="aspectFit" @click="openBackImg(vdata.applyDetailInfo.settAccountIdcard2Img)" class="fuiou-img" />
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm text="入账非法人证明照片" :start="false" v-if="vdata.applyDetailInfo.acntArtifImg">
|
||||
<image :src="vdata.applyDetailInfo.acntArtifImg" mode="aspectFit" @click="openBackImg(vdata.applyDetailInfo.acntArtifImg)" class="fuiou-img" />
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm text="组织机构代码证照片" :start="false" v-if="vdata.applyDetailInfo.organizationImg">
|
||||
<image :src="vdata.applyDetailInfo.organizationImg" mode="aspectFit" @click="openBackImg(vdata.applyDetailInfo.organizationImg)" class="fuiou-img" />
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm text="税务登记证照片" :start="false" v-if="vdata.applyDetailInfo.taxRegistrationImg">
|
||||
<image :src="vdata.applyDetailInfo.taxRegistrationImg" mode="aspectFit" @click="openBackImg(vdata.applyDetailInfo.taxRegistrationImg)" class="fuiou-img" />
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm text="手持证件照片" :start="false" v-if="vdata.applyDetailInfo.handCertificateImg">
|
||||
<image :src="vdata.applyDetailInfo.handCertificateImg" mode="aspectFit" @click="openBackImg(vdata.applyDetailInfo.handCertificateImg)" class="fuiou-img" />
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm text="补充资料照片" :start="false" v-if="vdata.applyDetailInfo.additionImg">
|
||||
<image :src="vdata.applyDetailInfo.additionImg" mode="aspectFit" @click="openBackImg(vdata.applyDetailInfo.additionImg)" class="fuiou-img" />
|
||||
</JeePayForm>
|
||||
|
||||
<view class="down-img">
|
||||
<view class="down" @click="fuiouUpload()">提交审核</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
</view>
|
||||
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, reactive, onMounted, inject } from 'vue'
|
||||
import JeePayForm from '@/components/applyComponents/JeePayForm.vue' // 通用左右结构布局
|
||||
import JeepayUpLoad from '@/components/JeepayUpLoad/JeepayUpLoad.vue' // 图片上传
|
||||
import { $elecContractGenerate, $elecContractSign, $fuiouUpload } from '@/http/apiManager.js'
|
||||
import qrcode from '@/util/qrcode.js'
|
||||
|
||||
const channelInfo = inject('channelInfo')
|
||||
|
||||
const vdata = reactive({
|
||||
storeSuccResParameter: {}, // 富友协议信息
|
||||
})
|
||||
|
||||
onMounted(() => {
|
||||
// 调用富友签约接口,生成图片的操作,在接口返回的信息中进行
|
||||
if (channelInfo.state == 5) getFuiouInfo()
|
||||
})
|
||||
|
||||
// 富有进件专用, 用于获取签约信息
|
||||
const getFuiouInfo = () => {
|
||||
$elecContractGenerate(channelInfo.applyId).then(({bizData}) => {
|
||||
vdata.storeSuccResParameter = JSON.parse(bizData.storeSuccResParameter)
|
||||
vdata.contractImg = drawQRcode(vdata.storeSuccResParameter.signUrl) // 生成富友签约图片
|
||||
})
|
||||
}
|
||||
|
||||
// 富友确认签署
|
||||
const fuiouhandle = () => {
|
||||
$elecContractSign(channelInfo.applyId).then(res => {
|
||||
uni.showToast({ title: '签署成功', icon: 'none'})
|
||||
vdata.fuiouState = 6 // 切换富友的状态
|
||||
})
|
||||
}
|
||||
|
||||
// 富友提交审核
|
||||
const fuiouUpload = () => {
|
||||
$fuiouUpload(channelInfo.applyId).then(res => {
|
||||
uni.showToast({ title: '审核成功', icon: 'none'})
|
||||
})
|
||||
}
|
||||
|
||||
// 跳转至电子合同页 盛付通 富友 会用到
|
||||
const toContract = () => {
|
||||
let uri = vdata.storeSuccResParameter.signUrl
|
||||
uni.navigateTo({ url: './contract?url=' + uri })
|
||||
}
|
||||
|
||||
// 制作图片
|
||||
const drawQRcode = url => {
|
||||
return qrcode.drawImg(url, {
|
||||
typeNumber: 4, // 密度
|
||||
errorCorrectLevel: 'Q', // 纠错等级
|
||||
size: 175, // 白色边框
|
||||
})
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
|
||||
.flex {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.box {
|
||||
height: auto;
|
||||
transition: .3s;
|
||||
position: relative;
|
||||
border-radius: 20rpx;
|
||||
background: #f5f6fc;
|
||||
padding: 10rpx 40rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.fuiou-img {
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
// 微信签约
|
||||
.wx-open {
|
||||
margin-top: 30rpx;
|
||||
padding: 40rpx;
|
||||
.first-title {
|
||||
font-size: 28rpx;
|
||||
color: #18191d;
|
||||
font-weight: bold;
|
||||
}
|
||||
.tips {
|
||||
font-size: 25rpx;
|
||||
color: #7e7e80;
|
||||
margin: 20rpx 0 40rpx;
|
||||
}
|
||||
.state {
|
||||
margin-bottom: 30rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.second-title {
|
||||
font-size: 27rpx;
|
||||
color: #000;
|
||||
}
|
||||
.wx-img {
|
||||
width: 300rpx;
|
||||
height: 300rpx;
|
||||
margin: 30rpx 0 20rpx ;
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
584
jeepay-ui-uapp-agent/pageApply/channel/fuiou/fuioupay.vue
Normal file
584
jeepay-ui-uapp-agent/pageApply/channel/fuiou/fuioupay.vue
Normal file
@@ -0,0 +1,584 @@
|
||||
<template>
|
||||
<!-- 该页面为填写信息的组件 -->
|
||||
<!-- 只读文件 -->
|
||||
<readOnlyInfo v-if="isDisable" ref="applyInfoRef" applyName="fuioupay" />
|
||||
|
||||
<view v-if="!isDisable">
|
||||
<uni-collapse ref="collapse">
|
||||
<uni-collapse-item title="基础信息" class="coll-title" :open="true">
|
||||
<view class="content">
|
||||
<JeePayForm text="选择商户类型">
|
||||
<uni-data-checkbox
|
||||
v-model="applyDetailInfo.merchantType"
|
||||
:localdata="merchantTypeList"
|
||||
@change="mchTypeInfo"
|
||||
></uni-data-checkbox>
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm text="是否开通微信">
|
||||
<uni-data-checkbox
|
||||
v-model="applyDetailInfo.wxFlag"
|
||||
:localdata="whetherList"
|
||||
></uni-data-checkbox>
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm text="是否开通支付宝">
|
||||
<uni-data-checkbox
|
||||
v-model="applyDetailInfo.aliFlag"
|
||||
:localdata="whetherList"
|
||||
></uni-data-checkbox>
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm text="选择证件类型">
|
||||
<radio-group
|
||||
class="radio-group"
|
||||
@change="publicSelect($event, 'licenseType')"
|
||||
>
|
||||
<label
|
||||
class="radio"
|
||||
v-for="(item, index) in licenseList"
|
||||
:key="index"
|
||||
><radio
|
||||
:value="item.value"
|
||||
:checked="applyDetailInfo.licenseType == item.value"
|
||||
/>{{ item.name }}</label
|
||||
>
|
||||
</radio-group>
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm
|
||||
text="营业执照图片"
|
||||
v-if="['0', '1', 'B'].includes(applyDetailInfo.licenseType)"
|
||||
>
|
||||
<JeepayUpLoad
|
||||
ocrFlag="license"
|
||||
:imgUrl="applyDetailInfo.licenseImg"
|
||||
@uploadSuccess="uploadSuccess($event, 'licenseImg')"
|
||||
@clear="clear('licenseImg')"
|
||||
/>
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm
|
||||
text="商户名称全称"
|
||||
v-model:value="applyDetailInfo.mchFullName"
|
||||
tipText="小微商户,请命名为个体户xxx"
|
||||
/>
|
||||
|
||||
<JeePayForm
|
||||
:text="
|
||||
applyDetailInfo.licenseType == 'A' ? '身份证号码' : '营业执照号'
|
||||
"
|
||||
v-model:value="applyDetailInfo.licenseNo"
|
||||
tipText="请输入编号"
|
||||
/>
|
||||
|
||||
<JeePayForm
|
||||
v-if="['0', '1', 'B'].includes(applyDetailInfo.licenseType)"
|
||||
text="营业执照注册地址"
|
||||
v-model:value="applyDetailInfo.licRegisAddr"
|
||||
/>
|
||||
|
||||
<JeePayForm text="证件有效期开始时间">
|
||||
<termOfValidity
|
||||
:defaultDate="applyDetailInfo.licenseEffectBegin"
|
||||
@publicSelect="publicSelect($event, 'licenseEffectBegin')"
|
||||
:isEnd="false"
|
||||
/>
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm text="证件有效期截止">
|
||||
<termOfValidity
|
||||
:defaultDate="applyDetailInfo.licenseEffectEnd"
|
||||
@publicSelect="publicSelect($event, 'licenseEffectEnd')"
|
||||
/>
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm text="法人身份证人像面照片">
|
||||
<JeepayUpLoad
|
||||
ocrFlag="idCard"
|
||||
:imgUrl="applyDetailInfo.idcard1Img"
|
||||
@uploadSuccess="uploadSuccess($event, 'idcard1Img')"
|
||||
@clear="clear('idcard1Img')"
|
||||
/>
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm
|
||||
text="法人身份证姓名"
|
||||
v-model:value="applyDetailInfo.idcardName"
|
||||
/>
|
||||
|
||||
<JeePayForm
|
||||
text="法人身份证号"
|
||||
v-model:value="applyDetailInfo.idcardNo"
|
||||
/>
|
||||
|
||||
<JeePayForm text="法人身份证国徽面照片">
|
||||
<JeepayUpLoad
|
||||
ocrFlag="idCard"
|
||||
:imgUrl="applyDetailInfo.idcard2Img"
|
||||
@uploadSuccess="uploadSuccess($event, 'idcard2Img')"
|
||||
@clear="clear('idcard2Img')"
|
||||
/>
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm text="法人身份证起始有效期">
|
||||
<termOfValidity
|
||||
:defaultDate="applyDetailInfo.idcardEffectBegin"
|
||||
@publicSelect="publicSelect($event, 'idcardEffectBegin')"
|
||||
:isEnd="false"
|
||||
/>
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm text="法人身份证结束有效期">
|
||||
<termOfValidity
|
||||
:defaultDate="applyDetailInfo.idcardEffectEnd"
|
||||
@publicSelect="publicSelect($event, 'idcardEffectEnd')"
|
||||
@endHandle="endHandle"
|
||||
/>
|
||||
</JeePayForm>
|
||||
</view>
|
||||
</uni-collapse-item>
|
||||
<uni-collapse-item title="经营信息" class="coll-title">
|
||||
<view class="content">
|
||||
<JeePayForm text="选择行业MCC">
|
||||
<jeeDataPicker
|
||||
:code="codeBack.mccCode"
|
||||
:localdata="mccFuiouList"
|
||||
@change="publicSelect($event, 'mccCode')"
|
||||
paramType="last"
|
||||
/>
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm
|
||||
text="商户简称"
|
||||
v-model:value="applyDetailInfo.mchShortName"
|
||||
tipText="建议和商户门头名称保持一致"
|
||||
/>
|
||||
<JeePayForm
|
||||
text="客服电话"
|
||||
v-model:value="applyDetailInfo.servicePhone"
|
||||
/>
|
||||
|
||||
<JeePayForm text="商户经营地区县代码">
|
||||
<jeeDataPicker
|
||||
:code="codeBack.areaCode"
|
||||
:localdata="address"
|
||||
@change="publicSelect($event, 'areaCode')"
|
||||
paramType="arr"
|
||||
/>
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm
|
||||
text="商户详细地址"
|
||||
v-model:value="applyDetailInfo.address"
|
||||
/>
|
||||
|
||||
<JeePayForm text="门头照">
|
||||
<JeepayUpLoad
|
||||
:imgUrl="applyDetailInfo.storeOuterImg"
|
||||
@uploadSuccess="uploadSuccess($event, 'storeOuterImg')"
|
||||
@clear="clear('storeOuterImg')"
|
||||
/>
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm text="店内环境照">
|
||||
<JeepayUpLoad
|
||||
:imgUrl="applyDetailInfo.storeInnerImg"
|
||||
@uploadSuccess="uploadSuccess($event, 'storeInnerImg')"
|
||||
@clear="clear('storeInnerImg')"
|
||||
/>
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm
|
||||
text="商户联系人姓名"
|
||||
v-model:value="applyDetailInfo.contactName"
|
||||
/>
|
||||
<JeePayForm
|
||||
text="商户联系人身份证号"
|
||||
v-model:value="applyDetailInfo.contactCertNo"
|
||||
/>
|
||||
<JeePayForm
|
||||
text="商户联系人电话"
|
||||
v-model:value="applyDetailInfo.contactPhone"
|
||||
/>
|
||||
<JeePayForm
|
||||
text="商户联系人邮箱"
|
||||
v-model:value="applyDetailInfo.contactEmail"
|
||||
/>
|
||||
</view>
|
||||
</uni-collapse-item>
|
||||
<uni-collapse-item title="结算账户" class="coll-title">
|
||||
<view class="content">
|
||||
<JeePayForm text="账户类型">
|
||||
<uni-data-checkbox
|
||||
v-model="applyDetailInfo.settAccountType"
|
||||
:localdata="settlementTypeList"
|
||||
></uni-data-checkbox>
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm
|
||||
text="结算银行卡照片"
|
||||
v-if="applyDetailInfo.settAccountType == 'C'"
|
||||
>
|
||||
<JeepayUpLoad
|
||||
ocrFlag="bankCard"
|
||||
:imgUrl="applyDetailInfo.settAccountLicenseImg"
|
||||
@uploadSuccess="uploadSuccess($event, 'settAccountLicenseImg')"
|
||||
@clear="clear('settAccountLicenseImg')"
|
||||
/>
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm
|
||||
text="开户许可证照片"
|
||||
v-if="
|
||||
applyDetailInfo.settAccountType == 'B' ||
|
||||
applyDetailInfo.licenseType == '0' ||
|
||||
applyDetailInfo.licenseType == '1'
|
||||
"
|
||||
>
|
||||
<JeepayUpLoad
|
||||
:imgUrl="applyDetailInfo.companyAccountLicenseImg"
|
||||
@uploadSuccess="uploadSuccess($event, 'companyAccountLicenseImg')"
|
||||
@clear="clear('companyAccountLicenseImg')"
|
||||
/>
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm
|
||||
text="开户名称"
|
||||
v-model:value="applyDetailInfo.settAccountName"
|
||||
/>
|
||||
<JeePayForm
|
||||
text="银行账号"
|
||||
v-model:value="applyDetailInfo.settAccountNo"
|
||||
/>
|
||||
|
||||
<JeePayForm text="开户行">
|
||||
<jeeDataPicker
|
||||
:code="codeBack.settAccountBankName"
|
||||
:localdata="bankFuiou"
|
||||
@change="publicSelect($event, 'settAccountBankName')"
|
||||
paramType="oneLevel"
|
||||
/>
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm
|
||||
text="联行号"
|
||||
v-model:value="applyDetailInfo.interBankNo"
|
||||
/>
|
||||
<JeePayForm
|
||||
text="开户支行名称"
|
||||
v-model:value="applyDetailInfo.settAccountBankBranchName"
|
||||
/>
|
||||
|
||||
<JeePayForm text="法人入账标识">
|
||||
<uni-data-checkbox
|
||||
v-model="applyDetailInfo.acntArtifFlag"
|
||||
:localdata="acntArtifFlagList"
|
||||
></uni-data-checkbox>
|
||||
</JeePayForm>
|
||||
<template v-if="applyDetailInfo.acntArtifFlag == 0">
|
||||
<JeePayForm text="入账账户身份证人像面照片">
|
||||
<JeepayUpLoad
|
||||
:imgUrl="applyDetailInfo.settAccountIdcard1Img"
|
||||
@uploadSuccess="uploadSuccess($event, 'settAccountIdcard1Img')"
|
||||
@clear="clear('settAccountIdcard1Img')"
|
||||
/>
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm text="入账账户身份证国徽面照片">
|
||||
<JeepayUpLoad
|
||||
:imgUrl="applyDetailInfo.settAccountIdcard2Img"
|
||||
@uploadSuccess="uploadSuccess($event, 'settAccountIdcard2Img')"
|
||||
@clear="clear('settAccountIdcard2Img')"
|
||||
ocrFlag="idCard"
|
||||
/>
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm text="入账非法人证明照片">
|
||||
<JeepayUpLoad
|
||||
:imgUrl="applyDetailInfo.acntArtifImg"
|
||||
@uploadSuccess="uploadSuccess($event, 'acntArtifImg')"
|
||||
@clear="clear('acntArtifImg')"
|
||||
/>
|
||||
</JeePayForm>
|
||||
</template>
|
||||
|
||||
<JeePayForm
|
||||
text="入账证件号"
|
||||
v-model:value="applyDetailInfo.acntCertifId"
|
||||
:start="false"
|
||||
/>
|
||||
<JeePayForm text="入账证件到期日" :start="false">
|
||||
<termOfValidity
|
||||
:defaultDate="applyDetailInfo.acntCertifExpireDt"
|
||||
@publicSelect="publicSelect($event, 'acntCertifExpireDt')"
|
||||
/>
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm text="清算类型">
|
||||
<uni-data-checkbox
|
||||
v-model="applyDetailInfo.settleTp"
|
||||
:localdata="settleTpList"
|
||||
></uni-data-checkbox>
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm
|
||||
text="选择清算类型扣率"
|
||||
v-if="
|
||||
applyDetailInfo.settleTp == 3 || applyDetailInfo.settleTp == 4
|
||||
"
|
||||
>
|
||||
<jeeDataPicker
|
||||
:code="codeBack.settleTpCd"
|
||||
:localdata="settleTpCdArr"
|
||||
@change="publicSelect($event, 'settleTpCd')"
|
||||
paramType="oneLevel"
|
||||
:mapText="{ text: 'rate', value: 'settleTpCd' }"
|
||||
/>
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm
|
||||
text="清算时间"
|
||||
v-model:value="applyDetailInfo.settleTs"
|
||||
tipText="24小时制,如:上午8点输入:08"
|
||||
v-if="applyDetailInfo.settleTp == 4"
|
||||
/>
|
||||
|
||||
<!-- <view style="height: 800px">成高度</view> -->
|
||||
</view>
|
||||
</uni-collapse-item>
|
||||
|
||||
<uni-collapse-item title="补充资料" class="coll-title">
|
||||
<view class="content">
|
||||
<JeePayForm
|
||||
text="组织机构代码证照片"
|
||||
v-if="applyDetailInfo.licenseType == '0'"
|
||||
>
|
||||
<JeepayUpLoad
|
||||
:imgUrl="applyDetailInfo.organizationImg"
|
||||
@uploadSuccess="uploadSuccess($event, 'organizationImg')"
|
||||
@clear="clear('organizationImg')"
|
||||
/>
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm
|
||||
text="税务登记证照片"
|
||||
v-if="applyDetailInfo.licenseType == '0'"
|
||||
>
|
||||
<JeepayUpLoad
|
||||
:imgUrl="applyDetailInfo.taxRegistrationImg"
|
||||
@uploadSuccess="uploadSuccess($event, 'taxRegistrationImg')"
|
||||
@clear="clear('taxRegistrationImg')"
|
||||
/>
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm
|
||||
text="手持证件照片"
|
||||
v-if="applyDetailInfo.licenseType == 'A'"
|
||||
>
|
||||
<JeepayUpLoad
|
||||
:imgUrl="applyDetailInfo.handCertificateImg"
|
||||
@uploadSuccess="uploadSuccess($event, 'handCertificateImg')"
|
||||
@clear="clear('handCertificateImg')"
|
||||
/>
|
||||
</JeePayForm>
|
||||
|
||||
<JeePayForm text="补充资料照片" :start="false">
|
||||
<JeepayUpLoad
|
||||
:imgUrl="applyDetailInfo.additionImg"
|
||||
@uploadSuccess="uploadSuccess($event, 'additionImg')"
|
||||
@clear="clear('additionImg')"
|
||||
/>
|
||||
</JeePayForm>
|
||||
</view>
|
||||
</uni-collapse-item>
|
||||
|
||||
<!-- 费率组件-->
|
||||
<defaultRate
|
||||
ref="defaultRateRef"
|
||||
isCheck="separate"
|
||||
/>
|
||||
</uni-collapse>
|
||||
</view>
|
||||
|
||||
<!-- 富有进价后操作 -->
|
||||
<fuiouEvent />
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, reactive, inject } from "vue";
|
||||
import address from "@/components/applyJson/addressFuiou.json"; // 地址
|
||||
import mccFuiou from "@/components/applyJson/mccFuiou.json"; // 行业
|
||||
import JeepayUpLoad from "@/components/JeepayUpLoad/JeepayUpLoad.vue"; // 图片上传
|
||||
import defaultRate from "../../components/defaultRate.vue"; // 默认费率
|
||||
import readOnlyInfo from "../../components/readOnlyInfo.vue"; // 只读文件
|
||||
import tool from "@/util/tool.js"; // 工具类函数
|
||||
import JeePayForm from "@/components/applyComponents/JeePayForm.vue"; // 通用左右结构布局
|
||||
import termOfValidity from "@/components/applyComponents/termOfValidity.vue"; // 选择证件有效期
|
||||
import jeeDataPicker from "@/components/applyComponents/dataPicker.vue"; // 通用级联选择
|
||||
import bankFuiou from "@/components/applyJson/bankFuiou.json"; // 选择银行
|
||||
import settleTpCdArr from "@/components/applyJson/settleTpCd.json"; // 选择清算折扣率
|
||||
import { filterDcit } from "@/hooks/dict"; // 字典
|
||||
import fuiouEvent from './fuiouEvent.vue' // 富有进件后的操作
|
||||
|
||||
const merchantTypeList = reactive(filterDcit(["A1", "A3", "A2"])); //商户类型
|
||||
const whetherList = reactive(filterDcit(["C0", "C1"])); // 开通or不开通
|
||||
const settlementTypeList = reactive(filterDcit(["B0", "B1"])); // 结算类型
|
||||
const settleTpList = reactive(filterDcit(["D2", "D1", "D0", "D3"])); // 清算类型
|
||||
const acntArtifFlagList = reactive(filterDcit(["K0", "K1"])); // 法人入账标识
|
||||
|
||||
const channelInfo = inject("channelInfo");
|
||||
|
||||
const emit = defineEmits(["paramsHandle", "applyHandle"]);
|
||||
|
||||
// 商户进件详细信息(JSON类型字符串)
|
||||
const applyDetailInfo = reactive({
|
||||
licenseType: "A", // 证件类型
|
||||
settleTp: "1", // 结算类型默认1
|
||||
});
|
||||
|
||||
// 状态分类: 0-未发起、 1-审核中、 2-进件成功、 3-驳回待修改、 4-待验证、 5-待签约
|
||||
// 当状态为 1 2 4 5 时要开启只读模式,0 3 不开启
|
||||
let isDisable = ref(false);
|
||||
if (!["0", "3", "8"].includes(channelInfo.state)) isDisable.value = true;
|
||||
|
||||
// 上传图片成功 以及OCR识别信息回显
|
||||
const uploadSuccess = (res, name) => {
|
||||
applyDetailInfo[name] = res.data;
|
||||
if (res.ocrInfo && Object.keys(res.ocrInfo).length < 1) return false;
|
||||
// OCR图片识别 idCard-身份证 idcard1Img,idcard2Img license-营业执照 licenseImg
|
||||
if (name == "idcard1Img") {
|
||||
applyDetailInfo.idcardName = res.ocrInfo.idcardName; // 法人身份证姓名
|
||||
applyDetailInfo.idcardNo = res.ocrInfo.idcardNo; // 法人身份证号
|
||||
} else if (name == "idcard2Img") {
|
||||
applyDetailInfo.idcardEffectBegin = res.ocrInfo.idcardEffectBegin; // 有效期
|
||||
applyDetailInfo.idcardEffectEnd = res.ocrInfo.idcardEffectEnd; // 有效期end
|
||||
} else if (name == "licenseImg") {
|
||||
applyDetailInfo.licenseEffectBegin = res.ocrInfo.licenseEffectBegin; // 执照有效期
|
||||
applyDetailInfo.licenseEffectEnd = res.ocrInfo.licenseEffectEnd; // 有效期end
|
||||
applyDetailInfo.mchFullName = res.ocrInfo.mchFullName; // 全称
|
||||
applyDetailInfo.licenseNo = res.ocrInfo.licenseNo; // 编号
|
||||
applyDetailInfo.address = applyDetailInfo.licRegisAddr =
|
||||
res.ocrInfo.address;
|
||||
} else if (name == "settAccountLicenseImg") {
|
||||
applyDetailInfo.settAccountNo = res.ocrInfo.settAccountNo; // 银行卡号
|
||||
} else if (name == "settAccountIdcard2Img") {
|
||||
applyDetailInfo.acntCertifExpireDt = res.ocrInfo.idcardEffectEnd; // 持卡人有效期end
|
||||
}
|
||||
};
|
||||
|
||||
// 清除图片 仅前端
|
||||
const clear = (key) => (applyDetailInfo[key] = "");
|
||||
|
||||
let mccFuiouList = ref(); // 富有具体的行业类型
|
||||
|
||||
// 通用选择事件 回调函数
|
||||
const publicSelect = (e, key) => {
|
||||
applyDetailInfo[key] = e.detail.value;
|
||||
// 根据不同的主体类型 走不同的json
|
||||
applyDetailInfo.merchantType == 3
|
||||
? (mccFuiouList.value = mccFuiou.corporationList)
|
||||
: (mccFuiouList.value = mccFuiou.personalList);
|
||||
if (key == "merchantType") {
|
||||
mchTypeInfo(e.detail.value);
|
||||
}
|
||||
};
|
||||
|
||||
// 证件类型,随主体类型变更
|
||||
const licenseList = ref([]);
|
||||
// 证件类型具体内容
|
||||
const mchTypeInfo = (val) => {
|
||||
const value = typeof val == "object" ? val.detail.value : val;
|
||||
if (value == 1) {
|
||||
licenseList.value = [{ value: "A", name: "身份证" }];
|
||||
applyDetailInfo.licenseType = "A";
|
||||
} else if (value == 2) {
|
||||
licenseList.value = [{ value: "B", name: "营业执照" }];
|
||||
} else if (value == 3) {
|
||||
licenseList.value = [
|
||||
{ value: "0", name: "营业执照" },
|
||||
{ value: "1", name: "三证合一" },
|
||||
];
|
||||
}
|
||||
};
|
||||
|
||||
// 发起进件
|
||||
const launchApply = (isTempData) => {
|
||||
// 拿费率组件的值
|
||||
applyDetailInfo.paywayFeeList = defaultRateRef.value.getList(isTempData)
|
||||
|
||||
// 判断类型,对象类型是费率正常提交 Sting 是错误信息
|
||||
if (typeof applyDetailInfo.paywayFeeList === "string")
|
||||
return uni.showToast({
|
||||
title: applyDetailInfo.paywayFeeList,
|
||||
icon: "none",
|
||||
});
|
||||
|
||||
emit("applyHandle", {
|
||||
name: "fuioupay",
|
||||
isTempData,
|
||||
applyDetailInfo,
|
||||
formCheck: [
|
||||
applyDetailInfo.settAccountType,
|
||||
applyDetailInfo.licenseType,
|
||||
applyDetailInfo.acntArtifFlag,
|
||||
applyDetailInfo.settleTp,
|
||||
],
|
||||
});
|
||||
};
|
||||
|
||||
let codeBack = reactive({}); // 用于级联选择器 文字回显
|
||||
|
||||
let applyInfoRef = ref(null); // 只读组件信息
|
||||
|
||||
// 合并信息方法, 智能读取,和信息回显,通过此方法合并
|
||||
const assignObj = (obj) => {
|
||||
obj.merchantType == 3
|
||||
? (mccFuiouList.value = mccFuiou.corporationList)
|
||||
: (mccFuiouList.value = mccFuiou.personalList);
|
||||
|
||||
mchTypeInfo(obj.merchantType);
|
||||
// 开启只读模式
|
||||
if (isDisable.value) {
|
||||
// 证件码转文字
|
||||
let mchType = obj.merchantType;
|
||||
if (mchType == "A") {
|
||||
obj.licenseText = "身份证";
|
||||
} else if (mchType == "B") {
|
||||
obj.licenseText = "营业执照";
|
||||
} else if (mchType == "0") {
|
||||
obj.licenseText = "营业执照";
|
||||
} else if (mchType == "1") {
|
||||
obj.licenseText = "三证合一";
|
||||
}
|
||||
obj.mccText = tool.mccBack(obj.mccCode, mccFuiouList.value, "last"); // 行业码转文字
|
||||
obj.areaText = tool.addressBack(obj.areaCode, address); // 地址码转文字
|
||||
obj.settAccountText = obj.settAccountType == "C" ? "对私" : "对公"; // 账户类型
|
||||
obj.acntArtifText = obj.acntArtifFlag == "0" ? "非法人入账" : "法人入账";
|
||||
|
||||
if (applyDetailInfo.settleTp == "1") {
|
||||
// 清算类型
|
||||
obj.acntArtifText = "自动结算(T1)";
|
||||
} else if (applyDetailInfo.settleTp == "2") {
|
||||
obj.acntArtifText = "手动结算";
|
||||
}
|
||||
|
||||
applyInfoRef.value.getApplyInof(obj);
|
||||
}
|
||||
|
||||
// 用于级联选择器 文字回显
|
||||
Object.assign(applyDetailInfo, obj);
|
||||
codeBack.mccCode = obj.mccCode;
|
||||
codeBack.areaCode = obj.areaCode;
|
||||
codeBack.settAccountBankName = obj.settAccountBankName;
|
||||
codeBack.settleTpCd = obj.settleTpCd; // 清算类型扣率
|
||||
};
|
||||
|
||||
const defaultRateRef = ref(); // 费率组件
|
||||
|
||||
defineExpose({ launchApply, assignObj });
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
@import "../../static/information.scss";
|
||||
</style>
|
||||
Reference in New Issue
Block a user