Files
jjx-web/pages/user/components/personal.vue
T
b2894lxlx 17b2d8f117 1、新增旧货市场
2、新增用户等级
2023-12-10 14:53:07 +08:00

782 lines
42 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<template>
<view>
<el-card>
<div slot="header" class="clearfix">
<div class="flex justify-between items-center text-main">
<div class="flex justify-start items-center">
<id-card theme="outline" size="24" fill="#a92924" strokeLinecap="square" style="height: 24px"/>
<span class="text-40" v-if="vk.getVuex('$user.userInfo.accountType') === 1">个人认证</span>
<span class="text-40" v-if="vk.getVuex('$user.userInfo.accountType') === 2">企业认证</span>
<div class="ml-20 flex justify-start items-center" v-if="!userInfo.fadadaConfirm">
<info theme="outline" size="18" fill="#a92924" strokeLinecap="square"
style="height: 18px"/>
<template v-if="userInfo.authStatus === null || userInfo.authStatus === -1">
<span
v-if="vk.getVuex('$user.userInfo.accountType') === 1">您还未提交您的个人资料</span>
<span
v-if="vk.getVuex('$user.userInfo.accountType') === 2">您还未提交您的企业资料</span>
</template>
<template v-else-if="userInfo.authStatus === 0">
<span>审核中</span>
</template>
<template v-else-if="userInfo.authStatus === 1">
<span>审核通过</span>
</template>
<template v-else-if="userInfo.authStatus === 2">
<span>审核不通过:{{ userInfo.refuseReason }}</span>
</template>
</div>
<span class="ml-20" v-else>认证成功</span>
</div>
<el-button type="primary" plain class="empty-bg-plain-btn" size="small" @click.native="makeCard">
制作我的名片
</el-button>
</div>
</div>
<el-form ref="form" :model="form" label-width="120px">
<el-form-item label="认证方式">
<el-radio-group v-model="form.authType" :disabled="[0].includes(userInfo.authStatus)">
<el-radio :label="1">法大大接口认证</el-radio>
<el-radio :label="2">金九信平台审核</el-radio>
</el-radio-group>
</el-form-item>
<template v-if="form.authType === 2 || (userInfo.hasOwnProperty('fadadaConfirm') && userInfo.fadadaConfirm)">
<el-row :gutter="10">
<el-col :span="12">
<el-form-item label="企业名称">
<el-input v-model="userInfo.company.companyName" disabled/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="信用代码" required>
<el-input v-model="form.company.organization"
:disabled="[0, 1].includes(userInfo.authStatus)"/>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="公司所在地" required>
<el-row :gutter="10" class="border-bottom pb-20">
<el-col :span="4">
<el-select v-model="addressIndex[0]" placeholder="请选择省"
:disabled="[0, 1].includes(userInfo.authStatus)">
<el-option v-for="(item, index) in provinceData" :key="index"
:label="item.name"
:value="index">
</el-option>
</el-select>
</el-col>
<el-col :span="4">
<el-select v-model="addressIndex[1]" placeholder="请选择市"
:disabled="addressIndex.length === 0 || [0, 1].includes(userInfo.authStatus)">
<template v-if="addressIndex[0] !== null">
<el-option v-for="(item, index) in cityData[addressIndex[0]]" :key="index"
:label="item.name"
:value="index">
</el-option>
</template>
</el-select>
</el-col>
<el-col :span="4">
<el-select v-model="addressIndex[2]" placeholder="请选择区"
:disabled="addressIndex.length === 1 || [0, 1].includes(userInfo.authStatus)">
<template v-if="addressIndex[0] !== null && addressIndex[1] !== null">
<el-option v-for="(item, index) in areaData[addressIndex[0]][addressIndex[1]]"
:key="index"
:label="item.name"
:value="index">
</el-option>
</template>
</el-select>
</el-col>
<el-col :span="11">
<el-input v-model="form.company.addressDetail" placeholder="请输入详细地址"
:disabled="[0, 1].includes(userInfo.authStatus)"/>
</el-col>
</el-row>
</el-form-item>
<el-form-item label="联系方式" required>
<el-input v-model="form.company.mobile" :disabled="[0, 1].includes(userInfo.authStatus)"/>
</el-form-item>
<el-row :gutter="10">
<el-col :span="12">
<el-form-item label="有效通信地址">
<el-input v-model="form.company.mailAddress"
:disabled="[0, 1].includes(userInfo.authStatus)"/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="有效邮箱地址">
<el-input v-model="form.company.contactEmail"
:disabled="[0, 1].includes(userInfo.authStatus)"/>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="10">
<el-col :span="12">
<el-form-item label="对公账号" required>
<el-input v-model="form.company.companyAccount"
:disabled="[0, 1].includes(userInfo.authStatus)"/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="开户行" required>
<el-input v-model="form.company.companyBankName"
:disabled="[0, 1].includes(userInfo.authStatus)"/>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="10">
<el-col :span="8">
<el-form-item label="个人账号">
<el-input v-model="form.company.personAccount"
:disabled="[0, 1].includes(userInfo.authStatus)"/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="个人开户行">
<el-input v-model="form.company.personBankName"
:disabled="[0, 1].includes(userInfo.authStatus)"/>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="个人账户名">
<el-input v-model="form.company.accountName"
:disabled="[0, 1].includes(userInfo.authStatus)"/>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="经营类目" required>
<el-input v-model="form.company.businessType" :disabled="[0, 1].includes(userInfo.authStatus)"/>
</el-form-item>
<el-form-item label="主营商品" required>
<el-checkbox-group v-model="form.company.mainSpotCategoryIds"
:disabled="[0, 1].includes(userInfo.authStatus)">
<el-checkbox v-for="(item, index) in goodsCate" :key="index" :label="item._id">
{{ item.name }}
</el-checkbox>
</el-checkbox-group>
</el-form-item>
<el-form-item label="上传营业执照" required>
<view class="flex justify-start items-center">
<vk-data-upload :limit="1" v-model="form.company.organizationPath"
:disabled="[0, 1].includes(userInfo.authStatus)"></vk-data-upload>
<text class="text-main ml-20">请您上传盖章的扫描件或者复印件</text>
</view>
</el-form-item>
<el-form-item label="上传开票资料" required>
<view class="flex justify-start items-center">
<vk-data-upload :limit="1" v-model="form.company.invoiceInfo"
:disabled="[0, 1].includes(userInfo.authStatus)"></vk-data-upload>
<text class="text-main ml-20">加盖公章</text>
<view class="ml-35">
<el-radio-group v-model="form.company.taxType"
:disabled="[0, 1].includes(userInfo.authStatus)">
<el-radio label="一般纳税人">一般纳税人</el-radio>
<el-radio label="小规模纳税人">小规模纳税人</el-radio>
<el-radio label="其他">其他</el-radio>
</el-radio-group>
</view>
</view>
</el-form-item>
<el-form-item label="纳税人资格">
<view class="flex justify-start items-center">
<vk-data-upload :limit="1" v-model="form.company.taxImage"
:disabled="[0, 1].includes(userInfo.authStatus)"></vk-data-upload>
<text class="text-main ml-20">加盖公章</text>
</view>
</el-form-item>
<el-form-item label="平台交易账号认证" required>
<div>
<p>请用个人账户向以下账户转账0.10元。请备注:账号认证,平台将7个工作日内退回原账户。</p>
<div>
<span>户名:金久信</span>
<span class="ml-35">开户行:中国广发银行南宁支行</span>
<span class="ml-35">账号:6222XXXXX</span>
</div>
</div>
</el-form-item>
<div class="flex justify-start items-center">
<id-card theme="outline" size="24" fill="#a92924" strokeLinecap="square" style="height: 24px"/>
<span class="text-40 mr-35">企业授权人信息</span>
</div>
<el-form-item label="代理人类型" required>
<el-radio-group v-model="form.manager.type" :disabled="[0, 1].includes(userInfo.authStatus)">
<el-radio :label="1">法人</el-radio>
<el-radio :label="2">代理人</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="代理人姓名" required>
<el-input v-model="form.manager.personName" :disabled="[0, 1].includes(userInfo.authStatus)"/>
</el-form-item>
<el-form-item label="证件类型" required>
<el-radio-group v-model="form.manager.certType"
:disabled="[0, 1].includes(userInfo.authStatus)">
<el-radio :label="0">身份证</el-radio>
<el-radio :label="1">护照</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="代理人证件号" required>
<el-input v-model="form.manager.idCard" :disabled="[0, 1].includes(userInfo.authStatus)"/>
</el-form-item>
<el-form-item label="代理人电话" required>
<el-input v-model="form.manager.mobile" :disabled="[0, 1].includes(userInfo.authStatus)"/>
</el-form-item>
<el-form-item label="身份证正面" required>
<vk-data-upload :limit="1" v-model="form.manager.headPhotoPath"
:disabled="[0, 1].includes(userInfo.authStatus)"></vk-data-upload>
</el-form-item>
<el-form-item label="身份证反面" required>
<vk-data-upload :limit="1" v-model="form.manager.backgroundIdCardPath"
:disabled="[0, 1].includes(userInfo.authStatus)"></vk-data-upload>
</el-form-item>
<el-button type="primary" @click.native="submitAuth"
v-if="form.authType === 2 && (userInfo.authStatus === null || [-1, 2].includes(userInfo.authStatus))">
{{
vk.getVuex('$user.userInfo.accountType') === 2 ? '提交企业认证' : '提交个人认证'
}}
</el-button>
</template>
<template v-else>
<el-button @click="getCertUrl" type="primary" size="small">去认证</el-button>
<el-button @click="getCertRes" type="primary" size="small">获取认证结果</el-button>
</template>
</el-form>
<!-- <vk-data-form ref="form1" v-model="form1.data" :action="form1.props.action" :columns="form1.props.columns"-->
<!-- :footer-show="false"-->
<!-- :before-action="form1.props.beforeAction" :rules="form1.props.rules"-->
<!-- :form-type="form1.props.formType"-->
<!-- :loading.sync="form1.props.loading" :auto-close="true" label-width="140px"-->
<!-- @success="onFormSuccess1">-->
<!-- <template v-slot:toFadada="{form, keyName}">-->
<!-- <el-button @click="getCertUrl" type="primary" size="small">去认证</el-button>-->
<!-- <el-button @click="getCertRes" type="primary" size="small">获取认证结果</el-button>-->
<!-- </template>-->
<!-- <template v-slot:company.organizationPath="{form, keyName}">-->
<!-- <vk-data-upload v-model="form1.data.organizationPath" limit="1"></vk-data-upload>-->
<!-- <text class="text-main">请您上传盖章的扫描件或者复印件</text>-->
<!-- </template>-->
<!-- <template v-slot:accountAuth="{form, keyName}">-->
<!-- <div>-->
<!-- <p>请用个人账户向以下账户转账0.10元。请备注:账号认证,平台将7个工作日内退回原账户。</p>-->
<!-- <div>-->
<!-- <span>户名:金久信</span>-->
<!-- <span class="ml-35">开户行:中国广发银行南宁支行</span>-->
<!-- <span class="ml-35">账号:6222XXXXX</span>-->
<!-- </div>-->
<!-- </div>-->
<!-- </template>-->
<!-- <template v-slot:manageList="{form, keyName}">-->
<!-- <div class="flex justify-start items-center">-->
<!-- <id-card theme="outline" size="24" fill="#a92924" strokeLinecap="square" style="height: 24px"/>-->
<!-- <span class="text-40 mr-35">企业授权人信息</span>-->
<!-- <el-button type="primary" size="small" @click.native="addManage"-->
<!-- v-if="manageList.length === 0 && (JSON.stringify(form.manager) === '{}' || !form.manager)">-->
<!-- 添加授权人-->
<!-- </el-button>-->
<!-- </div>-->
<!-- </template>-->
<!-- </vk-data-form>-->
<!-- <view v-for="(item, index) in manageList" :key="index">-->
<!-- <manage-list v-model="manageList[index]"/>-->
<!-- </view>-->
<!-- <el-button type="primary" @click.native="allSubmit"-->
<!-- v-if="form1.data.authType === 2 && (form1.data.authStatus === null || [-1, 2].includes(form1.data.authStatus))">-->
<!-- {{-->
<!-- vk.getVuex('$user.userInfo.accountType') === 2 ? '提交企业认证' : '提交个人认证'-->
<!-- }}-->
<!-- </el-button>-->
</el-card>
</view>
</template>
<script>
import {IdCard, Info} from '@icon-park/vue'
import ManageList from "./manageList.vue";
import form from "@icon-park/vue/lib/icons/Form";
import provinces from "@/uni_modules/vk-uview-ui/libs/address/provinces.json";
import citys from "@/uni_modules/vk-uview-ui/libs/address/citys.json";
import areas from "@/uni_modules/vk-uview-ui/libs/address/areas.json";
var _ = require('lodash');
export default {
components: {ManageList, IdCard, Info},
data() {
// 页面数据变量
return {
provinceData: provinces,
cityData: citys,
areaData: areas,
addressIndex: [null, null, null],
manageList: [],
goodsCate: [],
form: {
authType: null,
company: {
organization: '',
addressRegion: {},
addressDetail: '',
mobile: '',
mailAddress: '',
contactEmail: '',
companyAccount: '',
companyBankName: '',
personAccount: '',
personBankName: '',
accountName: '',
businessType: '',
invoiceInfo: '',
taxType: '',
taxImage: '',
mainSpotCategoryIds: [],
},
manager: {
type: null,
personName: '',
certType: '',
idCard: '',
mobile: '',
headPhotoPath: '',
backgroundIdCardPath: '',
},
},
userInfo: {},
// 表单相关开始-----------------------------------------------------------
form1: {
// 表单请求数据,此处可以设置默认值
data: {
person: {},
company: {},
manager: null,
fadadaConfirm: false,
authType: 1,
authStatus: null,
refuseReason: '',
organizationPath: '',
},
// 表单属性
props: {
// 表单请求地址
action: "client/user/kh/addAuth",
// 表单字段显示规则
columns: [
{
key: "authType", title: "认证方式", type: "radio",
data: [
{value: 1, label: "法大大接口认证"},
{value: 2, label: "金九信平台审核"},
],
showRule: ({authStatus}) => {
return authStatus === null || [-1, 2].includes(authStatus)
},
},
{
key: "toFadada", title: "认证方式", type: "html",
showLabel: false,
showRule: (formData) => {
return formData.authType === 1 && (!formData.hasOwnProperty('fadadaConfirm') || !formData.fadadaConfirm) && (formData.authStatus === null || [-1, 2].includes(formData.authStatus))
},
},
{
key: "person",
title: "个人",
type: "object",
showLabel: false,
showRule: (formData) => {
return vk.getVuex('$user.userInfo.accountType') === 1
},
columns: [{
key: "personName",
title: "姓名",
type: "text",
readonly: true,
disabled: true
},
{
key: "idCard",
title: "身份证号",
type: "text",
readonly: true,
disabled: true
},
{
key: "bankCardNo",
title: "银行卡号",
type: "text",
readonly: true,
disabled: true
},
{
key: "mobile",
title: "手机号",
type: "text",
readonly: true,
disabled: true
},
]
},
{
key: "company",
title: "企业信息",
type: "object",
showLabel: false,
showRule: (formData) => {
return vk.getVuex('$user.userInfo.accountType') === 2
&& (formData.authType === 2 || (formData.hasOwnProperty('fadadaConfirm') && formData.fadadaConfirm))
},
columns: [
{
key: "", title: "", type: "group", justify: "start",
columns: [
{
key: "companyName",
title: "企业名称",
type: "text",
readonly: true,
disabled: true
},
{
key: "organization",
title: "统一社会信用代码",
type: "text",
},
]
},
{
key: "address", title: "", type: "group", justify: "start",
columns: [
{key: "addressRegion", title: "公司所在地", type: "address"},
{
key: "addressDetail",
title: "详细地址",
type: "text",
showLabel: false,
placeholder: "详细地址",
},
]
},
{
key: "mobile",
title: "联系方式",
type: "text",
placeholder: "请输入您的联系方式",
},
{
key: "mailAddress",
title: "有效通信地址",
type: "text",
placeholder: "请输入您的通信地址",
},
{
key: "contactEmail",
title: "有效邮箱地址",
type: "text",
placeholder: "请输入您的邮箱地址",
},
{
key: "", title: "", type: "group", justify: "start",
columns: [
{
key: "companyAccount",
title: "对公账号",
type: "text",
placeholder: "请输入对公账号",
},
{
key: "companyBankName",
title: "开户行",
type: "text",
placeholder: "请输入开户行",
},
]
},
{
key: "", title: "", type: "group", justify: "start",
columns: [
{
key: "personAccount",
title: "个人账号",
type: "text",
placeholder: "请输入个人账号",
},
{
key: "personBankName",
title: "个人开户行",
type: "text",
placeholder: "请输入个人开户行",
},
]
},
{
key: "accountName",
title: "个人账户名",
type: "text",
placeholder: "请输入个人账户名",
},
{
key: "", title: "", type: "group", justify: "start",
columns: [
{key: "organizationPath", title: "上传营业执照", type: "html"},
{key: "businessType", title: "经营类目", type: "text"},
]
},
{
key: "", title: "", type: "group", justify: "start",
columns: [
{key: "invoiceInfo", title: "上传开票资料", type: "image", limit: 1},
{
key: "taxType", title: "", type: "radio", showLabel: false,
data: [
{value: "一般纳税人", label: "一般纳税人"},
{value: "小规模纳税人", label: "小规模纳税人"},
{value: "其他", label: "其他"},
],
},
]
},
{key: "taxImage", title: "纳税人资格", type: "image", limit: 1},
],
},
{
key: "accountAuth", title: "平台交易账号认证", type: "html", showRule: (formData) => {
return vk.getVuex('$user.userInfo.accountType') === 2
&& (formData.authType === 2 || (formData.hasOwnProperty('fadadaConfirm') && formData.fadadaConfirm))
},
},
{
key: "manageList", title: "", type: "html", showLabel: false, showRule: (formData) => {
return vk.getVuex('$user.userInfo.accountType') === 2
&& (formData.authType === 2 || (formData.hasOwnProperty('fadadaConfirm') && formData.fadadaConfirm))
},
},
{
key: "manager",
title: "代理人",
type: "object",
showLabel: false,
showRule: (formData) => {
return formData.manager.personName != null
},
columns: [{
key: "personName",
title: "代理人",
type: "text",
readonly: true,
disabled: true
},
{
key: "idCard",
title: "代理人身份证号",
type: "text",
readonly: true,
disabled: true
},
{
key: "mobile",
title: "代理人电话",
type: "text",
readonly: true,
disabled: true
},
]
},
],
// 表单验证规则
rules: {
'company.organization': [
{
required: true,
message: "统一社会信用代码不能为空",
trigger: ['blur', 'change']
}
],
'company.address.addressRegion': [
{
required: true,
message: "公司所在地不能为空",
trigger: ['blur', 'change']
}
],
'company.mobile': [
{
required: true,
message: "公司联系方式不能为空",
trigger: ['blur', 'change']
}
],
'company.companyAccount': [
{
required: true,
message: "公司对公账号不能为空",
trigger: ['blur', 'change']
}
],
'company.companyBankName': [
{
required: true,
message: "公司对公账号开户行不能为空",
trigger: ['blur', 'change']
}
],
mailAddress: [
{
required: true,
message: "通讯地址不能为空",
trigger: ['blur', 'change']
}
],
contactQq: [{
required: true,
message: "QQ号码不能为空",
trigger: ['blur', 'change']
}],
contactWechat: [{
required: true,
message: "微信不能为空",
trigger: ['blur', 'change']
}],
contactWechatImage: [{
required: true,
message: "微信二维码不能为空",
trigger: ['blur', 'change']
}],
contactEmail: [
{
required: true,
message: "邮箱不能为空",
trigger: ['blur', 'change']
}, {
validator: vk.pubfn.validator("email"),
message: '邮箱格式错误',
trigger: 'blur'
}
],
},
// add 代表添加 update 代表修改
formType: "",
// 表单是否在请求中
loading: false,
// 是否显示表单1 的弹窗
show: false,
}
},
// 表单相关结束-----------------------------------------------------------
};
},
created() {
this.getUserInfo()
this.getGoodsCate()
},
methods: {
getUserInfo() {
vk.userCenter.getCurrentUserInfo({
success: (data) => {
this.userInfo = data.userInfo
for (let key in this.form) this.form[key] = data.userInfo[key]
if (JSON.stringify(data.userInfo.addressRegion) !== "{}") {
this.addressIndex[0] = this.provinceData.findIndex(item => item.code === data.userInfo.addressRegion.province.code)
if (this.addressIndex[0] !== -1) {
this.addressIndex[1] = this.cityData[this.addressIndex[0]].findIndex(item => item.code === data.userInfo.addressRegion.city.code)
if (this.addressIndex[1] !== -1) {
this.addressIndex[2] = this.areaData[this.addressIndex[0]][this.addressIndex[1]].findIndex(item => item.code === data.userInfo.addressRegion.area.code)
console.log(this.addressIndex[2], this.areaData[this.addressIndex[0]][this.addressIndex[1]], data.userInfo.addressRegion.area.code)
}
}
}
this.form1.data = _.pick(data.userInfo, [
'fadadaConfirm', 'person', 'company', 'manager', 'contactWechat',
'contactEmail', 'contactWechatImage', 'contactQq', 'mailAddress',
'authStatus', 'authType', 'refuseReason'
])
// if (!this.form1.data.hasOwnProperty('fadadaConfirm') || !this.form1.data.fadadaConfirm) this.form1.data.authType = 1
// this.form1.data.authType = 2
if (data.userInfo.fadadaConfirm && data.userInfo.businessCard == null) {
this.$confirm('请完善名片信息', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
vk.navigateTo('/pages/user/user?menu=business-card');
})
}
}
});
},
getGoodsCate() {
vk.callFunction({
url: 'client/spot/category/pub/getList',
data: {
level: 2
},
success: (res) => {
this.goodsCate = res.data
}
});
},
onFormSuccess1() {
window.location.reload()
},
getCertUrl() {
vk.callFunction({
url: 'client/fadada.getVerifyUrl',
success: (res) => {
location.href = res.data.url
}
});
},
addManage() {
this.manageList.push({})
},
allSubmit() {
this.form1.data.authStatus = 0
this.form1.data.refuseReason = null
this.form1.data.manager = this.manageList[0]
this.$refs.form1.submitForm()
},
async submitAuth() {
if (this.addressIndex[2] === null || !this.form.company.addressDetail) return this.$message({
type: 'error',
message: '请完善公司所在地'
})
if (this.form.company.mainSpotCategoryIds.length === 0) return this.$message({
type: 'error',
message: '请选择主营商品'
})
this.form.company.addressRegion.province = this.provinceData[this.addressIndex[0]]
this.form.company.addressRegion.city = this.cityData[this.addressIndex[0]][this.addressIndex[1]]
this.form.company.addressRegion.area = this.areaData[this.addressIndex[0]][this.addressIndex[1]][this.addressIndex[2]]
await vk.callFunction({
url: 'client/user/kh/addAuth',
data: {...this.form, ...{authStatus: 0}},
})
this.$message({
type: 'success',
message: '提交成功'
})
setTimeout(() => {
window.location.reload()
}, 1500)
},
makeCard() {
this.$emit('makeCard')
},
getCertRes() {
vk.callFunction({
url: 'client/user/kh/getFadadaRes',
success: (res) => {
console.log(res)
}
})
}
}
}
</script>
<style scoped>
</style>