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.
707 lines
18 KiB
707 lines
18 KiB
<template>
|
|
<view class="park" :style="{backgroundImage:`url(${indexBackgroundImage})`}">
|
|
<view class="park-navbar">
|
|
<u-navbar title="" :border-bottom="false" :background="background"></u-navbar>
|
|
</view>
|
|
<view class="park-but">
|
|
<view class="but" @click="handleSortType(10)" :style="{ color: (formData.type==10)?'#794007':'#fff' }">
|
|
公司
|
|
</view>
|
|
<view class="but" @click="handleSortType(20)" :style="{ color: (formData.type==20)?'#794007':'#fff' }">
|
|
个体户
|
|
</view>
|
|
</view>
|
|
<view class="forms">
|
|
<view class="form-title">
|
|
法人姓名<text style="color: red;">*</text>
|
|
</view>
|
|
<view class="form-input">
|
|
<input type="text" v-model="formData.name" placeholder="请输入法人姓名">
|
|
</view>
|
|
<view class="form-title">
|
|
法人手机号码<text style="color: red;">*</text>
|
|
</view>
|
|
<view class="form-input">
|
|
<input type="text" @blur="mobileReg" v-model="formData.mobile" placeholder="请输入法人手机号码">
|
|
</view>
|
|
<view class="form-title">
|
|
法人身份证正面<text style="color: red;">*</text>
|
|
</view>
|
|
<view class="card">
|
|
<u-upload :action="action" :header="header" @on-uploaded="cardJustSuccess" @on-remove="cardJustRemove"
|
|
:file-list="proveList" :custom-btn="true" max-count="1">
|
|
<template v-slot:addBtn>
|
|
<view class="card-box">
|
|
<image :src="$picUrl+'/static/news/icon-upload.png'" style="height: 96rpx;" mode="">
|
|
</image>
|
|
</view>
|
|
</template>
|
|
</u-upload>
|
|
</view>
|
|
<view style="font-size: 22rpx;color: #999;margin-bottom: 30rpx;">
|
|
仅支持jpg、png、gif、50M以内/个
|
|
</view>
|
|
<view class="form-title">
|
|
法人身份证反面<text style="color: red;">*</text>
|
|
</view>
|
|
<view class="card">
|
|
<u-upload :action="action" :header="header" @on-uploaded="cardBackSuccessve" @on-remove="cardBackRemove"
|
|
:file-list="proveList" :custom-btn="true" max-count="1">
|
|
<template v-slot:addBtn>
|
|
<view class="card-box">
|
|
<image :src="$picUrl+'/static/news/icon-upload.png'" style="height: 96rpx;" mode="">
|
|
</image>
|
|
</view>
|
|
</template>
|
|
</u-upload>
|
|
</view>
|
|
<view style="font-size: 22rpx;color: #999;margin-bottom: 30rpx;">
|
|
仅支持jpg、png、gif、50M以内/个
|
|
</view>
|
|
<view class="form-title">
|
|
营业执照<text style="color: red;">*</text>
|
|
</view>
|
|
<view class="card">
|
|
<u-upload :action="action" :header="header" @on-uploaded="proveSuccess" @on-remove="proveRemove"
|
|
:file-list="proveList" :custom-btn="true" max-count="1">
|
|
<template v-slot:addBtn>
|
|
<view class="card-box">
|
|
<image :src="$picUrl+'/static/news/icon-upload.png'" style="height: 96rpx;" mode="">
|
|
</image>
|
|
</view>
|
|
</template>
|
|
</u-upload>
|
|
</view>
|
|
<view style="font-size: 22rpx;color: #999;margin-bottom: 30rpx;">
|
|
仅支持jpg、png、gif、50M以内/个
|
|
</view>
|
|
<view class="form-title">
|
|
法人手持营业执照<text style="color: red;">*</text>
|
|
</view>
|
|
<view class="card">
|
|
<u-upload :action="action" :header="header" @on-uploaded="proveHoldSuccess" @on-remove="proveholdRemove"
|
|
:file-list="proveList" :custom-btn="true" max-count="1">
|
|
<template v-slot:addBtn>
|
|
<view class="card-box">
|
|
<image :src="$picUrl+'/static/news/icon-upload.png'" style="height: 96rpx;" mode="">
|
|
</image>
|
|
</view>
|
|
</template>
|
|
</u-upload>
|
|
</view>
|
|
<view style="font-size: 22rpx;color: #999;margin-bottom: 30rpx;">
|
|
仅支持jpg、png、gif、50M以内/个
|
|
</view>
|
|
<view class="form-title" v-if="formData.type==20">
|
|
法人银行卡号
|
|
<!-- <text style="color: red;">*</text> -->
|
|
</view>
|
|
<view class="form-input" v-if="formData.type==20">
|
|
<input type="text" v-model="formData.bank_account_number" placeholder="请输入法人银行卡号">
|
|
</view>
|
|
<view class="form-title" v-if="formData.type==20">
|
|
法人银行卡开户行
|
|
<!-- <text style="color: red;">*</text> -->
|
|
</view>
|
|
<view class="form-input" v-if="formData.type==20">
|
|
<input type="text" v-model="formData.bank_name" placeholder="请输入法人银行卡开户行">
|
|
</view>
|
|
<view class="form-title" v-if="formData.type==20">
|
|
法人收款二维码
|
|
<!-- <text style="color: red;">*</text> -->
|
|
</view>
|
|
<view class="card" v-if="formData.type==20">
|
|
<u-upload :action="action" :header="header" @on-uploaded="proveCodeSuccess" @on-remove="proveCodeRemove"
|
|
:file-list="codeList" :custom-btn="true" max-count="1">
|
|
<template v-slot:addBtn>
|
|
<view class="card-box">
|
|
<image :src="$picUrl+'/static/news/icon-upload.png'" style="height: 96rpx;" mode="">
|
|
</image>
|
|
</view>
|
|
</template>
|
|
</u-upload>
|
|
</view>
|
|
<view style="font-size: 22rpx;color: #999;margin-bottom: 30rpx;" v-if="formData.type==20">
|
|
仅支持jpg、png、gif、50M以内/个
|
|
</view>
|
|
<view class="form-title" v-if="formData.type==10">
|
|
对公开户名称<text style="color: red;">*</text>
|
|
</view>
|
|
<view class="form-input" v-if="formData.type==10">
|
|
<input type="text" v-model="formData.corporate_account_name" placeholder="请输入对公开户名称">
|
|
</view>
|
|
<view class="form-title" v-if="formData.type==10">
|
|
对公账号<text style="color: red;">*</text>
|
|
</view>
|
|
<view class="form-input" v-if="formData.type==10">
|
|
<input type="text" v-model="formData.corporate_account_number" placeholder="请输入对公账号">
|
|
</view>
|
|
<view class="form-title" v-if="formData.type==10">
|
|
对公开户行<text style="color: red;">*</text>
|
|
</view>
|
|
<view class="form-input" v-if="formData.type==10">
|
|
<input type="text" v-model="formData.corporate_bank_name" placeholder="请输入对公开户行">
|
|
</view>
|
|
<view class="form-title" v-if="formData.type==20">
|
|
收款二维码商户名称
|
|
<!-- <text style="color: red;">*</text> -->
|
|
</view>
|
|
<view class="form-input" v-if="formData.type==20">
|
|
<input type="text" v-model="formData.merchant_name" placeholder="请输入收款二维码商户名称">
|
|
</view>
|
|
<view class="form-title">
|
|
小程序名称
|
|
</view>
|
|
<view class="form-input">
|
|
<input type="text" v-model="formData.mini_program_name" placeholder="请输入小程序名称">
|
|
</view>
|
|
<view class="form-title">
|
|
小程序AppId
|
|
</view>
|
|
<view class="form-input">
|
|
<input type="text" v-model="formData.mini_program_app_id" placeholder="请输入AppId">
|
|
</view>
|
|
<view class="form-title">
|
|
小程序AppSecret
|
|
</view>
|
|
<view class="form-input">
|
|
<input type="text" v-model="formData.mini_program_app_secret" placeholder="请输入AppSecret">
|
|
</view>
|
|
<view class="form-title">
|
|
法人电子邮箱
|
|
</view>
|
|
<view class="form-input">
|
|
<input type="text" v-model="formData.legal_person_email" placeholder="请输入法人电子邮箱">
|
|
</view>
|
|
</view>
|
|
<view class="park-button" @click="nextStep">
|
|
提交
|
|
</view>
|
|
<view class="dia" v-if="cdDia">
|
|
<view class="diaMain">
|
|
<image src="/static/order/ld.png" mode="" class="ld"></image>
|
|
<view class="cdTitle">
|
|
提交成功
|
|
</view>
|
|
<view class="cdInfo">
|
|
您的开通商城的相关信息已提交，请您耐心等待，谢谢！
|
|
</view>
|
|
<view class="iKnow" @click="meKone()">
|
|
我知道了
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
<script>
|
|
import * as help from '@/api/help'
|
|
import Config from '@/core/config'
|
|
export default {
|
|
data() {
|
|
return {
|
|
background: {
|
|
background: 'none'
|
|
},
|
|
indexBackgroundImage: 'https://www.amiami.com.cn/static/openShopping.png?t=' + new Date().getTime(),
|
|
action: '',
|
|
header: '',
|
|
cdDia: false,
|
|
justList: [],
|
|
backList: [],
|
|
holdList: [],
|
|
proveList: [],
|
|
formData: {
|
|
name: "",
|
|
mobile: "",
|
|
id_card_front_id: "",
|
|
id_card_back_id: "",
|
|
business_license_id: "",
|
|
photo_id: "",
|
|
bank_account_number: "",
|
|
bank_name: "",
|
|
qr_code_id: "",
|
|
merchant_name: "",
|
|
corporate_account_name: "",
|
|
corporate_account_number: "",
|
|
corporate_bank_name: "",
|
|
mini_program_name: "",
|
|
mini_program_app_id: "",
|
|
mini_program_app_secret: "",
|
|
legal_person_email: "",
|
|
type: 10
|
|
},
|
|
}
|
|
},
|
|
onLoad(options) {
|
|
this.storeInfo = JSON.parse(uni.getStorageSync("storeInfo"));
|
|
},
|
|
onShow() {
|
|
|
|
},
|
|
onReady() {
|
|
this.action = (Config.get('apiUrl') + 'upload/image').replace("index.php?s=/", "")
|
|
this.header = {
|
|
'Storeid': uni.getStorageSync('Store').storeInfo.store_id,
|
|
'Access-Token': uni.getStorageSync('AccessToken'),
|
|
'platform': "MP-WEIXIN",
|
|
}
|
|
},
|
|
/**
|
|
* 分享当前页面
|
|
*/
|
|
onShareAppMessage() {
|
|
// 构建页面参数
|
|
// const params = this.$getShareUrlParams()
|
|
// return {
|
|
// title: '诚挚邀请，欢迎开通！',
|
|
// path: `/pages/gamll/mall`
|
|
// }
|
|
},
|
|
methods: {
|
|
mobileReg() {
|
|
let reg = /^[1][3,4,5,7,8,9][0-9]{9}$/
|
|
if (!this.formData.mobile) { //判断如果手机号为空，提示用户输入手机号
|
|
uni.showToast({
|
|
title: '请输入手机号码',
|
|
icon: 'none'
|
|
})
|
|
return
|
|
} else if (!reg.test(this.formData.mobile)) { //判断手机号格式时候正确
|
|
uni.showToast({
|
|
title: '手机号码不正确',
|
|
icon: 'none'
|
|
})
|
|
this.formData.mobile = ''
|
|
}
|
|
},
|
|
meKone() {
|
|
this.cdDia = false
|
|
},
|
|
handleSortType(type) {
|
|
Object.keys(this.formData).forEach(key => {
|
|
this.formData[key] = ''; // 或者使用 delete obj[key];
|
|
});
|
|
this.formData.type = type
|
|
},
|
|
nextStep() {
|
|
let that = this
|
|
if (!that.formData.name) {
|
|
uni.showToast({
|
|
title: "请输入法人姓名",
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
if (!that.formData.mobile) {
|
|
uni.showToast({
|
|
title: "请输入法人手机号码",
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
if (that.formData.id_card_front_id.length == 0) {
|
|
uni.showToast({
|
|
title: "请上传身份证正面",
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
if (that.formData.id_card_back_id.length == 0) {
|
|
uni.showToast({
|
|
title: "请上传身份证反面",
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
if (that.formData.business_license_id.length == 0) {
|
|
uni.showToast({
|
|
title: "请上传营业执照",
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
if (that.formData.photo_id.length == 0) {
|
|
uni.showToast({
|
|
title: "请上传手持营业执照",
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
if (that.formData.type == 10) {
|
|
if (!that.formData.corporate_account_name) {
|
|
uni.showToast({
|
|
title: "请输入对公开户名称",
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
if (!that.formData.corporate_account_number) {
|
|
uni.showToast({
|
|
title: "请输入对公账号",
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
if (!that.formData.corporate_bank_name) {
|
|
uni.showToast({
|
|
title: "请输入对公开户行",
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
}
|
|
// if (that.formData.type == 20) {
|
|
// if (!that.formData.bank_account_number) {
|
|
// uni.showToast({
|
|
// title: "请输入法人银行卡号",
|
|
// icon: 'none'
|
|
// })
|
|
// return
|
|
// }
|
|
// if (!that.formData.bank_name) {
|
|
// uni.showToast({
|
|
// title: "请输入法人银行卡开户行",
|
|
// icon: 'none'
|
|
// })
|
|
// return
|
|
// }
|
|
// if (that.formData.qr_code_id.length == 0) {
|
|
// uni.showToast({
|
|
// title: "请上传法人收款二维码",
|
|
// icon: 'none'
|
|
// })
|
|
// return
|
|
// }
|
|
// if (!that.formData.merchant_name) {
|
|
// uni.showToast({
|
|
// title: "收款二维码商户名称",
|
|
// icon: 'none'
|
|
// })
|
|
// return
|
|
// }
|
|
// }
|
|
|
|
if (that.formData.type == 10) {
|
|
that.formData.bank_account_number = '';
|
|
that.formData.bank_name = '';
|
|
that.formData.merchant_name = '';
|
|
that.formData.qr_code_id = "";
|
|
}
|
|
if (that.formData.type == 20) {
|
|
that.formData.corporate_account_name = '';
|
|
that.formData.corporate_account_number = '';
|
|
that.formData.corporate_bank_name = '';
|
|
}
|
|
help.openShop({
|
|
form: that.formData
|
|
}).then(result => {
|
|
if (result.status == 200) {
|
|
that.cdDia = true
|
|
}
|
|
uni.showToast({
|
|
title: result.message,
|
|
icon: 'none',
|
|
duration: 2000
|
|
})
|
|
})
|
|
},
|
|
// 正面
|
|
cardJustSuccess(list) {
|
|
if (list.length > 0) {
|
|
const {
|
|
response
|
|
} = list[0];
|
|
if (response.status == 200) {
|
|
uni.showToast({
|
|
title: "上传成功"
|
|
})
|
|
let idList = []
|
|
list.forEach(item => {
|
|
idList.push(item.response.data.fileInfo.file_id)
|
|
});
|
|
this.formData.id_card_front_id = idList.join(',');
|
|
}
|
|
}
|
|
},
|
|
cardJustRemove(file, fileList) {
|
|
this.formData.id_card_front_id = this.handleRemove(file, fileList);
|
|
},
|
|
// 反面
|
|
cardBackSuccessve(list) {
|
|
if (list.length > 0) {
|
|
const {
|
|
response
|
|
} = list[0];
|
|
if (response.status == 200) {
|
|
uni.showToast({
|
|
title: "上传成功"
|
|
})
|
|
let idList = []
|
|
list.forEach(item => {
|
|
idList.push(item.response.data.fileInfo.file_id)
|
|
});
|
|
this.formData.id_card_back_id = idList.join(',');
|
|
}
|
|
}
|
|
},
|
|
cardBackRemove(file, fileList) {
|
|
this.formData.id_card_back_id = this.handleRemove(file, fileList);
|
|
},
|
|
// 手持营业执照
|
|
proveHoldSuccess(list) {
|
|
if (list.length > 0) {
|
|
const {
|
|
response
|
|
} = list[0];
|
|
if (response.status == 200) {
|
|
uni.showToast({
|
|
title: "上传成功"
|
|
})
|
|
let idList = []
|
|
list.forEach(item => {
|
|
idList.push(item.response.data.fileInfo.file_id)
|
|
});
|
|
this.formData.photo_id = idList.join(',');
|
|
}
|
|
}
|
|
},
|
|
proveholdRemove(file, fileList) {
|
|
this.formData.photo_id = this.handleRemove(file, fileList);
|
|
},
|
|
// 营业证
|
|
proveSuccess(list) {
|
|
if (list.length > 0) {
|
|
const {
|
|
response
|
|
} = list[0];
|
|
if (response.status == 200) {
|
|
uni.showToast({
|
|
title: "上传成功"
|
|
})
|
|
let idList = []
|
|
list.forEach(item => {
|
|
idList.push(item.response.data.fileInfo.file_id)
|
|
});
|
|
this.formData.business_license_id = idList.join(',');
|
|
}
|
|
}
|
|
},
|
|
proveRemove(file, fileList) {
|
|
this.formData.business_license_id = this.handleRemove(file, fileList);
|
|
},
|
|
// 二维码
|
|
proveCodeSuccess(list) {
|
|
if (list.length > 0) {
|
|
const {
|
|
response
|
|
} = list[0];
|
|
if (response.status == 200) {
|
|
uni.showToast({
|
|
title: "上传成功"
|
|
})
|
|
let idList = []
|
|
list.forEach(item => {
|
|
idList.push(item.response.data.fileInfo.file_id)
|
|
});
|
|
this.formData.qr_code_id = idList.join(',');
|
|
}
|
|
}
|
|
},
|
|
proveCodeRemove(file, fileList) {
|
|
this.formData.qr_code_id = this.handleRemove(file, fileList);
|
|
},
|
|
handleRemove: function(file, fileList) {
|
|
let idList = []
|
|
fileList.forEach(item => {
|
|
idList.push(item.response.data.fileInfo.file_id)
|
|
});
|
|
return idList.join(',')
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
<style>
|
|
page {
|
|
background: #fff;
|
|
width: 100%;
|
|
}
|
|
</style>
|
|
<style lang="scss" scoped>
|
|
.park {
|
|
overflow: hidden;
|
|
width: 100%;
|
|
background-size: 100% auto;
|
|
height: 3720rpx;
|
|
background-size: cover;
|
|
|
|
.park-but {
|
|
overflow: hidden;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
margin: 200rpx 60rpx 110rpx 60rpx;
|
|
|
|
.but {
|
|
width: 200rpx;
|
|
background: orange;
|
|
border-radius: 45rpx;
|
|
height: 70rpx;
|
|
text-align: center;
|
|
font-weight: 700;
|
|
font-size: 32rpx;
|
|
color: #fff;
|
|
line-height: 70rpx;
|
|
}
|
|
}
|
|
|
|
.park-button {
|
|
width: 630rpx;
|
|
height: 88rpx;
|
|
border-radius: 8rpx;
|
|
margin: 30rpx auto 0 auto;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
font-size: 28rpx;
|
|
color: #fff;
|
|
background: orange;
|
|
line-height: 88rpx;
|
|
text-align: center;
|
|
font-style: normal;
|
|
text-transform: none;
|
|
}
|
|
|
|
.forms {
|
|
margin: 0 60rpx;
|
|
overflow: hidden;
|
|
|
|
.form-title {
|
|
font-size: 28rpx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #333;
|
|
}
|
|
|
|
.form-input {
|
|
background: #fff;
|
|
border: 1rpx solid mediumpurple;
|
|
height: 80rpx;
|
|
line-height: 80rpx;
|
|
padding: 0 24rpx;
|
|
margin: 30rpx 0;
|
|
border-radius: 8rpx;
|
|
|
|
input {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
.card {
|
|
overflow: hidden;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
margin: 30rpx 0 20rpx 0;
|
|
|
|
.card-box {
|
|
width: 150rpx;
|
|
height: 150rpx;
|
|
background: #fff;
|
|
border-radius: 16rpx;
|
|
border: 1rpx solid mediumpurple;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
|
|
image {
|
|
width: 60rpx !important;
|
|
height: 60rpx !important;
|
|
}
|
|
|
|
.card-tips {
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
font-size: 24rpx;
|
|
color: #999999;
|
|
text-align: center;
|
|
font-style: normal;
|
|
text-transform: none;
|
|
}
|
|
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
::v-deep .u-list-item {
|
|
width: 153rpx !important;
|
|
height: 153rpx !important;
|
|
margin: 0 !important;
|
|
}
|
|
|
|
.dia {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
background: rgba(0, 0, 0, 0.7);
|
|
z-index: 99;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
|
|
.diaMain {
|
|
width: 560rpx;
|
|
height: 432rpx;
|
|
background: linear-gradient(180deg, #FFE4E4 0%, #FFFFFF 100%);
|
|
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
|
opacity: 1;
|
|
position: relative;
|
|
|
|
.ld {
|
|
width: 100rpx;
|
|
height: 100rpx;
|
|
position: absolute;
|
|
top: -50rpx;
|
|
left: 230rpx;
|
|
}
|
|
|
|
.cdTitle {
|
|
width: 128rpx;
|
|
height: 44rpx;
|
|
font-size: 32rpx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 500;
|
|
color: #000000;
|
|
line-height: 44rpx;
|
|
margin: 80rpx 0 0 216rpx;
|
|
}
|
|
|
|
.cdInfo {
|
|
width: 498rpx;
|
|
height: 120rpx;
|
|
font-size: 28rpx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #727272;
|
|
line-height: 38rpx;
|
|
margin-left: 48rpx;
|
|
margin-top: 28rpx;
|
|
}
|
|
|
|
.iKnow {
|
|
width: 412rpx;
|
|
height: 72rpx;
|
|
background: #F55349;
|
|
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
|
opacity: 1;
|
|
font-size: 28rpx;
|
|
font-family: PingFang SC, PingFang SC;
|
|
font-weight: 400;
|
|
color: #FFFFFF;
|
|
line-height: 72rpx;
|
|
margin: 36rpx 0 0 74rpx;
|
|
text-align: center;
|
|
}
|
|
}
|
|
}
|
|
</style>
|
|
|