You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
298 lines
7.6 KiB
298 lines
7.6 KiB
<template>
|
|
<view class="content">
|
|
<uni-nav-bar left-icon="back" @clickLeft="back" statusBar fixed title="特约商户设置"></uni-nav-bar>
|
|
<view class="justify-center section_1" v-show="auditDetail">
|
|
<image src="/static/imgs/merchant/error-icon.png" class="image_4" />
|
|
<text class="text_4">申请被驳回，{{ auditDetail }}</text>
|
|
</view>
|
|
<qn-form-item label="商户信息" type="title"></qn-form-item>
|
|
<qn-form-item label="商户名称">
|
|
<text>{{ form.name }}</text>
|
|
</qn-form-item>
|
|
<qn-form-item label="商户类型" required>
|
|
<qn-select
|
|
contentStyle="background: none; padding: 0;text-align: right;"
|
|
:options="types"
|
|
v-model="form.mallSupplierType"
|
|
placeholder="请选择商户类型"
|
|
></qn-select>
|
|
</qn-form-item>
|
|
<qn-form-item label="客服电话" required>
|
|
<qn-easyinput :maxlength="11" v-model="form.servicePhone" :inputBorder="false" text="right" placeholder="请输入客服电话"></qn-easyinput>
|
|
</qn-form-item>
|
|
<qn-form-item label="联系邮箱" required>
|
|
<qn-easyinput :maxlength="25" v-model="form.contactEmail" :inputBorder="false" text="right" placeholder="请输入联系邮箱"></qn-easyinput>
|
|
</qn-form-item>
|
|
<qn-form-item label="商户资料" size="large">
|
|
<view class="flex-row img-area">
|
|
<image v-for="(url, index) in imgs" :key="index" class="img" :src="url" @click="preview(url)"></image>
|
|
</view>
|
|
</qn-form-item>
|
|
<qn-form-item label="结算账户" type="title"></qn-form-item>
|
|
<qn-form-item label="账户类型">
|
|
<text>{{ accountTypeName }}</text>
|
|
</qn-form-item>
|
|
<qn-form-item label="账户名">
|
|
<text>{{ form.accountName }}</text>
|
|
</qn-form-item>
|
|
<qn-form-item label="账户号码">
|
|
<text>{{ form.accountNumber }}</text>
|
|
</qn-form-item>
|
|
<qn-form-item label="开户行">
|
|
<text>{{ form.accountBank }}</text>
|
|
</qn-form-item>
|
|
<qn-form-item label="法人信息" type="title"></qn-form-item>
|
|
<qn-form-item label="法人姓名">
|
|
<text>{{ form.contactName }}</text>
|
|
</qn-form-item>
|
|
<qn-form-item label="法人身份证号">
|
|
<text>{{ form.contactIdNumber }}</text>
|
|
</qn-form-item>
|
|
<qn-form-item label="法人手机号">
|
|
<text>{{ form.mobilePhone }}</text>
|
|
</qn-form-item>
|
|
<qn-footer fixed height="120rpx">
|
|
<view class="button-area">
|
|
<view class="button button__cancel" @click="back">
|
|
<text class="text">取消</text>
|
|
</view>
|
|
<view class="button button__submit" @click="apply">
|
|
<text class="text" style="color: white">提交申请</text>
|
|
</view>
|
|
</view>
|
|
</qn-footer>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { go2, back } from '@/utils/hook.js'
|
|
import { applyMerchant } from '@/apis/merchantApi.js'
|
|
import { mallSupplierTypeEnum, applyStatusEnum } from '@/enums/index.js'
|
|
import { validateField } from '@/utils/index.js'
|
|
const types = [
|
|
{
|
|
label: '个体工商户',
|
|
value: mallSupplierTypeEnum.PERSONAL
|
|
},
|
|
{
|
|
label: '企业',
|
|
value: mallSupplierTypeEnum.ENTERPRISE
|
|
}
|
|
]
|
|
|
|
const accountFields = [
|
|
{
|
|
label: '开户银行',
|
|
key: 'accountBank'
|
|
},
|
|
{
|
|
label: '开户名称',
|
|
key: 'accountName'
|
|
},
|
|
{
|
|
label: '银行账号',
|
|
key: 'accountNumber'
|
|
},
|
|
{
|
|
label: '开户银行省市编码',
|
|
key: 'bankAddressCode'
|
|
},
|
|
{
|
|
label: '开户银行联行号',
|
|
key: 'bankBranchId'
|
|
}
|
|
]
|
|
|
|
const validateFields = [
|
|
{
|
|
name: 'contactEmail',
|
|
rules: [{ required: true, message: '请输入联系邮箱' }]
|
|
},
|
|
{
|
|
name: 'servicePhone',
|
|
rules: [
|
|
{ required: true, message: '请输入客服电话' },
|
|
{ type: 'phone', message: '请输入正确的手机号' }
|
|
]
|
|
}
|
|
]
|
|
export default {
|
|
data() {
|
|
return {
|
|
types: Object.freeze(types),
|
|
accountTypeName: '私账',
|
|
privateAccounts: {}, // 私账
|
|
corporateAccount: {}, // 公账
|
|
imgs: [],
|
|
auditDetail: '',
|
|
form: {
|
|
businessType: 0, // 业务类型 0 云工厂 1 纸通宝
|
|
enterpriseId: null,
|
|
name: 'xxx',
|
|
mallSupplierType: null,
|
|
accountName: '',
|
|
accountNumber: '',
|
|
accountBank: '',
|
|
bankAddressCode: '',
|
|
bankBranchId: '',
|
|
servicePhone: '',
|
|
contactName: '',
|
|
contactIdNumber: '',
|
|
mobilePhone: '',
|
|
contactEmail: ''
|
|
}
|
|
}
|
|
},
|
|
onLoad(option) {
|
|
if (!option.info) {
|
|
uni.showToast({
|
|
title: '参数错误',
|
|
icon: 'none',
|
|
success: () => {
|
|
setTimeout(() => {
|
|
back()
|
|
}, 1500)
|
|
}
|
|
})
|
|
} else {
|
|
let info = JSON.parse(option.info)
|
|
this.privateAccounts = info.privateAccounts
|
|
this.corporateAccount = info.corporateAccount
|
|
this.imgs.push(info.businessLicenseImg, info.legalPersonIdCardFrontImg, info.legalPersonIdCardBackImg)
|
|
let keys = Object.keys(this.form)
|
|
keys.forEach((key) => {
|
|
if (info[key] != undefined) {
|
|
this.form[key] = info[key]
|
|
}
|
|
})
|
|
if (info.applymentState === applyStatusEnum.REJECTED) {
|
|
if (info.auditDetail) {
|
|
let reasons = info.auditDetail.map((item) => item.rejectReason)
|
|
this.auditDetail = reasons.join('，')
|
|
}
|
|
}
|
|
}
|
|
},
|
|
watch: {
|
|
'form.mallSupplierType': function (val) {
|
|
if (val === mallSupplierTypeEnum.PERSONAL) {
|
|
this.accountTypeName = '私账'
|
|
this.updateAccount(this.privateAccounts)
|
|
} else {
|
|
this.accountTypeName = '公账'
|
|
this.updateAccount(this.corporateAccount)
|
|
}
|
|
}
|
|
},
|
|
methods: {
|
|
go2,
|
|
back,
|
|
preview(url) {
|
|
uni.previewImage({
|
|
urls: this.imgs,
|
|
current: url
|
|
})
|
|
},
|
|
// 更新账户信息
|
|
updateAccount(account) {
|
|
accountFields.forEach((item) => {
|
|
this.form[item.key] = account[item.key]
|
|
})
|
|
},
|
|
apply() {
|
|
for (let field of validateFields) {
|
|
const { name, rules } = field
|
|
const value = this.form[name]
|
|
const { isValid, msg } = validateField(value, rules)
|
|
if (!isValid) {
|
|
uni.showToast({
|
|
title: msg,
|
|
icon: 'none'
|
|
})
|
|
return false
|
|
}
|
|
}
|
|
applyMerchant(this.form).then((res) => {
|
|
if (res) {
|
|
uni.showToast({
|
|
title: '申请成功',
|
|
icon: 'none',
|
|
success: () => {
|
|
setTimeout(() => {
|
|
back()
|
|
}, 1500)
|
|
}
|
|
})
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.content {
|
|
width: 750rpx;
|
|
.img-area {
|
|
width: 686rpx;
|
|
padding-bottom: 32rpx;
|
|
}
|
|
.img {
|
|
margin-left: 12rpx;
|
|
border-radius: 10rpx;
|
|
width: 120rpx;
|
|
height: 120rpx;
|
|
border: 1px solid #f7f8fa;
|
|
}
|
|
}
|
|
.section_1 {
|
|
width: 750rpx;
|
|
padding: 28rpx 32rpx;
|
|
color: rgb(0, 0, 0);
|
|
font-size: 32rpx;
|
|
font-weight: 500;
|
|
line-height: 45rpx;
|
|
white-space: pre-wrap;
|
|
background-color: rgb(255, 192, 195);
|
|
.image_4 {
|
|
margin: 4rpx 0;
|
|
width: 36rpx;
|
|
height: 36rpx;
|
|
}
|
|
.text_4 {
|
|
width: 100%;
|
|
margin-left: 12rpx;
|
|
}
|
|
}
|
|
.button-area {
|
|
width: 750rpx;
|
|
padding: 0 32rpx;
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
.button {
|
|
flex-grow: 0;
|
|
flex-shrink: 0;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
border-radius: 10rpx;
|
|
.text {
|
|
font-size: 30rpx;
|
|
font-weight: 500;
|
|
text-align: center;
|
|
}
|
|
}
|
|
.button__cancel {
|
|
width: 270rpx;
|
|
height: 88rpx;
|
|
border: 2rpx solid #979797;
|
|
}
|
|
.button__submit {
|
|
width: 400rpx;
|
|
height: 88rpx;
|
|
background: #007aff;
|
|
}
|
|
}
|
|
</style>
|