Commit 02148fd1 authored by Junling Bu's avatar Junling Bu
Browse files

chore[litemall-vue]: 删除实名认证组件

parent 8f2890f8
<template>
<div class="id_card_upload">
<div>身份证照片</div>
<van-row class="upload_hint text-desc">
<van-icon name="hint"/>
温馨提示: 请上传原始比例的身份证正反面, 请勿剪裁涂改,保证身份证信息清晰显示, 否则无法通过审核
</van-row>
<van-row gutter="20" class="id_card_row upload_box">
<van-col span=12>
<div class="upload_wrap">
<div v-if="frontUrl">
<img :src="frontUrl" alt="反面">
</div>
<div class="add_btn" v-else>
<van-icon name="add" />
<div>上传照片</div>
</div>
</div>
</van-col>
<van-col span=12>
<div class="upload_wrap">
<div v-if="reverseUrl">
<img :src="reverseUrl" alt="反面">
</div>
<div class="add_btn" v-else>
<van-icon name="add" />
<div>上传照片</div>
</div>
</div>
</van-col>
</van-row>
<van-row gutter="10" class="id_card_row">
<van-col span=12>
<div class="text-desc">正面示例</div>
<img src="../../../assets/images/id_card_front.png" alt="正面" width="50%">
</van-col>
<van-col span=12>
<div class="text-desc">反面示例</div>
<img src="../../../assets/images/id_card_reverse.png" alt="反面" width="50%">
</van-col>
</van-row>
</div>
</template>
<script>
import { Row, Col } from 'vant';
export default {
name: 'id-card-upload',
props: {
frontUrl: String,
reverseUrl: String
},
components: {
[Row.name]: Row,
[Col.name]: Col
}
};
</script>
<style lang="scss" scoped>
.id_card_upload {
margin: 10px 0 30px 0;
background-color: #fff;
padding: 15px 10px;
> div {
margin-bottom: 15px;
}
}
.upload_hint {
position: relative;
padding-left: 20px;
line-height: 1.6;
i {
position: absolute;
top: 2px;
left: 0;
}
}
.id_card_row {
> div {
text-align: center;
}
.text-desc {
margin-bottom: 8px;
}
}
.upload_box .upload_wrap {
position: relative;
border: 1px dashed $gray;
min-height: 100px;
box-sizing: border-box;
padding: 5px;
img {
max-width: 100%;
display: block;
}
.add_btn {
position: absolute;
top: 50%;
left: 50%;
font-size: 20px;
color: $gray;
transform: translate(-50%, -50%);
i {
font-size: 24px;
}
}
}
</style>
<template>
<div>
<van-cell-group>
<van-field
v-model="field.username"
label="姓名"
placeholder="请输入姓名"
required
:error="nameErr"
@blur="checkUserName"
@focus="nameErr = false"/>
<van-field
v-model="field.idCard"
label="身份证号"
placeholder="请输入身份证号码"
required
:error="idCardErr"
@blur="checkIdCard"
@focus="idCardErr = false"/>
</van-cell-group>
<id-card-upload
:front.sync="field.frontUrl"
:reverse.sync="field.reverseUrl"/>
<div class="save_div">
<van-button type="danger" size="large" @click="save">保存</van-button>
</div>
<ul class="text-desc">
<li>根据海关规定: 购买跨境商品需要办理相关手续.</li>
<li>根据海关规定: 购买跨境商品需要办理相关手续.</li>
</ul>
</div>
</template>
<script>
import idCardUpload from './id-card-upload';
import { idCard } from 'core/regexp';
export default {
data() {
return {
field: {
username: '',
idCard: '',
frontUrl: '',
reverseUrl: ''
},
nameErr: true,
idCardErr: true
};
},
methods: {
save() {
const keys = Object.keys(this.field);
const isValid = keys.every(key => {
const message = this.getErrorMessageByKey(key);
if (message) {
this.$toast.fail({ message, duration: 1000 });
}
return !message;
});
if (isValid) {
console.log('保存');
}
},
checkUserName() {
this.nameErr =
this.field.username == '' || this.field.username.length > 5;
},
checkIdCard() {
this.idCardErr = !idCard.test(this.field.idCard);
},
getErrorMessageByKey(key) {
const val = this.field[key];
switch (key) {
case 'username':
return val ? (val.length < 5 ? '' : '名字太长了') : '请输入名字';
case 'idCard':
return val ? (idCard(val) ? '' : '请输入正确身份证') : '请输入身份证';
case 'frontUrl':
return val ? '' : '请上传正面照片';
case 'reverseUrl':
return val ? '' : '请上传背面照片';
}
}
},
components: {
[idCardUpload.name]: idCardUpload
}
};
</script>
<style lang="scss" scoped>
.save_div {
padding: 0 20px;
}
ul.text-desc {
padding: 20px;
list-style: inside;
li {
margin-bottom: 15px;
}
}
</style>
<template>
<div>
<van-radio-group v-model="default_address" @change="setDefaultAddress">
<van-cell-group v-for="item in addressList" :key="item.id" class="addressGroup">
<van-cell
isLink
icon="id-card"
title="张三"
label="身份证: 3303271996455332544"
/>
<van-cell>
<van-radio
slot="title"
:name="item.id"
@change="setDefaultAddress(item.id)">
<span :class="item.isDefault && 'red'">{{item.isDefault ? '默认地址' : '设为默认'}}</span>
</van-radio>
<div>
<router-link
:to="{name: 'autonym-edit', params: {addressId: item.id}}"
style="margin-right: 10px;">
<van-icon name="editor" />
编辑
</router-link>
<span>
<van-icon name="lajitong" />
删除
</span>
</div>
</van-cell>
</van-cell-group>
</van-radio-group>
<van-button class="bottom_btn" @click="setNewAddress" type="primary" bottomAction>
添加认证
</van-button>
</div>
</template>
<script>
import { Checkbox, Radio, RadioGroup } from 'vant';
export default {
data() {
return {
default_address: 1,
addressList: [
{
id: 1
},
{
id: 2
},
{
id: 3
},
{
id: 4
}
]
};
},
methods: {
setDefaultAddress(id) {
console.log(id);
},
setNewAddress() {
this.$router.push({ name: 'autonym-edit', params: { addressId: -1 } });
}
},
components: {
[Checkbox.name]: Checkbox,
[Radio.name]: Radio,
[RadioGroup.name]: RadioGroup
}
};
</script>
<style lang="scss" scoped>
.addressGroup {
margin-bottom: 10px;
&:last-child {
margin-bottom: 0;
}
}
.bottom_btn {
position: fixed;
bottom: 0;
}
</style>
...@@ -3,9 +3,7 @@ ...@@ -3,9 +3,7 @@
<van-cell-group> <van-cell-group>
<van-cell icon="shoucang" title="我的收藏" to="/user/collect" isLink/> <van-cell icon="shoucang" title="我的收藏" to="/user/collect" isLink/>
<!-- <van-cell icon="team" title="我的团队" to="/user/team" isLink /> --> <!-- <van-cell icon="team" title="我的团队" to="/user/team" isLink /> -->
<!-- <van-cell icon="gold-bean" title="我的金豆" isLink /> -->
<van-cell icon="dingwei" title="收货地址" to="/user/address" isLink/> <van-cell icon="dingwei" title="收货地址" to="/user/address" isLink/>
<!-- <van-cell icon="id-card" title="实名认证" to="/user/autonym" isLink /> -->
<van-cell icon="kefu" title="服务中心" to="/user/server" isLink/> <van-cell icon="kefu" title="服务中心" to="/user/server" isLink/>
</van-cell-group> </van-cell-group>
</div> </div>
......
import asyncLoader from 'core/async-loader'; import asyncLoader from 'core/async-loader';
const tab_user = asyncLoader('user/tabbar-user'); const tab_user = asyncLoader('user/tabbar-user');
const UserCollect = asyncLoader('user/module-collect'); const UserCollect = asyncLoader('user/module-collect');
const UserTeam = asyncLoader('user/module-team'); const UserTeam = asyncLoader('user/module-team');
const UserInvitation = asyncLoader('user/module-invitation'); const UserInvitation = asyncLoader('user/module-invitation');
const UserAddress = asyncLoader('user/module-address'); const UserAddress = asyncLoader('user/module-address');
const UserAddressEdit = asyncLoader('user/module-address-edit'); const UserAddressEdit = asyncLoader('user/module-address-edit');
const UserAutonym = asyncLoader('user/module-autonym'); const UserServer = asyncLoader('user/module-server');
const UserAutonymEdit = asyncLoader('user/module-autonym-edit');
const UserServer = asyncLoader('user/module-server'); const UserInformation = asyncLoader('user/user-information-set');
const UserInfo_SetBg = asyncLoader('user/user-information-set/set-bg');
const UserInformation = asyncLoader('user/user-information-set'); const UserInfo_SetMobile = asyncLoader('user/user-information-set/set-mobile');
const UserInfo_SetBg = asyncLoader('user/user-information-set/set-bg'); const UserInfo_SetNickname = asyncLoader(
const UserInfo_SetMobile = asyncLoader('user/user-information-set/set-mobile'); 'user/user-information-set/set-nickname'
const UserInfo_SetNickname = asyncLoader( );
'user/user-information-set/set-nickname' const UserInfo_SetPassword = asyncLoader(
); 'user/user-information-set/set-password'
const UserInfo_SetPassword = asyncLoader( );
'user/user-information-set/set-password'
); const UserOrderEntityList = asyncLoader('user/order-entity-list');
const UserOrderEleList = asyncLoader('user/order-ele-list');
const UserOrderEntityList = asyncLoader('user/order-entity-list'); const UserRefundList = asyncLoader('user/refund-list');
const UserOrderEleList = asyncLoader('user/order-ele-list');
const UserRefundList = asyncLoader('user/refund-list'); const Tabbar = () =>
import(/* webpackChunkName: "Tabbar" */ '@/vue/components/Tabbar/');
const Tabbar = () =>
import(/* webpackChunkName: "Tabbar" */ '@/vue/components/Tabbar/'); export default [
{
export default [ path: '/user',
{ name: 'user',
path: '/user', meta: {
name: 'user', keepAlive: true
meta: { },
keepAlive: true components: { default: tab_user, tabbar: Tabbar }
}, },
components: { default: tab_user, tabbar: Tabbar } {
}, path: '/user/collect',
{ name: 'collect',
path: '/user/collect', meta: {
name: 'collect', login: true
meta: { },
login: true component: UserCollect
}, },
component: UserCollect {
}, path: '/user/team',
{ name: 'team',
path: '/user/team', meta: {
name: 'team', login: true
meta: { },
login: true component: UserTeam
}, },
component: UserTeam {
}, path: '/user/invitation',
{ name: 'invitation',
path: '/user/invitation', meta: {
name: 'invitation', login: true
meta: { },
login: true component: UserInvitation
}, },
component: UserInvitation {
}, path: '/user/address',
{ name: 'address',
path: '/user/address', meta: {
name: 'address', login: true
meta: { },
login: true component: UserAddress
}, },
component: UserAddress {
}, path: '/user/address/edit/:addressId',
{ name: 'address-edit',
path: '/user/address/edit/:addressId', props: true,
name: 'address-edit', meta: {
props: true, login: true
meta: { },
login: true component: UserAddressEdit
}, },
component: UserAddressEdit {
}, path: '/user/server',
{ name: 'user-server',
path: '/user/autonym', component: UserServer
name: 'autonym', },
component: UserAutonym {
}, path: '/user/information',
{ name: 'user-information',
path: '/user/autonym/edit', meta: {
name: 'autonym-edit', login: true
component: UserAutonymEdit },
}, component: UserInformation
{ },
path: '/user/server', {
name: 'user-server', path: '/user/information/setbg',
component: UserServer name: 'user-info-setbg',
}, component: UserInfo_SetBg
{ },
path: '/user/information', {
name: 'user-information', path: '/user/information/setMobile',
meta: { name: 'user-info-setMobile',
login: true component: UserInfo_SetMobile
}, },
component: UserInformation {
}, path: '/user/information/setNickname',
{ name: 'user-info-setNickname',
path: '/user/information/setbg', component: UserInfo_SetNickname
name: 'user-info-setbg', },
component: UserInfo_SetBg {
}, path: '/user/information/setPassword',
{ name: 'user-info-setPassword',
path: '/user/information/setMobile', component: UserInfo_SetPassword
name: 'user-info-setMobile', },
component: UserInfo_SetMobile {
}, path: '/user/order/list/:active',
{ name: 'user-order-list',
path: '/user/information/setNickname', props: true,
name: 'user-info-setNickname', component: UserOrderEntityList
component: UserInfo_SetNickname },
}, {
{ path: '/user/orderEle/list/:active',
path: '/user/information/setPassword', name: 'user-order-ele-list',
name: 'user-info-setPassword', props: true,
component: UserInfo_SetPassword component: UserOrderEleList
}, },
{ {
path: '/user/order/list/:active', path: '/user/refund/list',
name: 'user-order-list', name: 'user-refund-list',
props: true, component: UserRefundList
component: UserOrderEntityList }
}, ];
{
path: '/user/orderEle/list/:active',
name: 'user-order-ele-list',
props: true,
component: UserOrderEleList
},
{
path: '/user/refund/list',
name: 'user-refund-list',
component: UserRefundList
}
];
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment