第一次提交
This commit is contained in:
244
sub_pages/certification/car/car.vue
Normal file
244
sub_pages/certification/car/car.vue
Normal file
@@ -0,0 +1,244 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view class="form">
|
||||
<u--form :model="form" ref="uForm" label-width="200rpx">
|
||||
<u-gap height="10" bgColor="#f3f3f3"></u-gap>
|
||||
<view class="block">
|
||||
<u-form-item label="车辆品牌" prop="carBrand" borderBottom>
|
||||
<u-input v-model="form.carBrand" maxlength="20" :disabled="isEdit" placeholder="车辆品牌" />
|
||||
</u-form-item>
|
||||
</view>
|
||||
<u-gap height="10" bgColor="#f3f3f3"></u-gap>
|
||||
<view class="block">
|
||||
<view class="upload">
|
||||
<u-upload :fileList="fileList1" :maxSize="3145728" width="250" height="150"
|
||||
@afterRead="afterRead" @delete="deletePic" :disabled="isEdit" name="1" multiple :maxCount="1">
|
||||
<view class="id-card-upload">
|
||||
<image class="photograph" src="../../../static/icon/photograph.png" mode="widthFix">
|
||||
</image>
|
||||
<text>上传行驶证照片</text>
|
||||
</view>
|
||||
</u-upload>
|
||||
</view>
|
||||
</view>
|
||||
<u-gap height="10" bgColor="#f3f3f3"></u-gap>
|
||||
<view class="block">
|
||||
<view class="desc-title">请上传您的行驶证照片</view>
|
||||
<view class="desc"><text>您上传的照片资料仅作为认证使用,并将加密处理</text></view>
|
||||
<view class="photo">
|
||||
<image src="https://file.wsdns.cn/20230619/94d1dba25b104bc89373fc3503049aba.png"
|
||||
style="width: 700rpx;" mode="widthFix"></image>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</u--form>
|
||||
</view>
|
||||
<view class="btn-wrapper">
|
||||
<u-button :text="submitText" color="linear-gradient(to bottom, #010002, #681752)" :disabled="isEdit"
|
||||
shape="circle" @click="handleSubmit()"></u-button>
|
||||
</view>
|
||||
<!-- 地址选择器 -->
|
||||
<liu-customize-sel ref="area" @change="chooseSuccess"></liu-customize-sel>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as UploadApi from '@/api/upload'
|
||||
import * as CertificateApi from '@/api/love-certificate.js'
|
||||
|
||||
const userId = uni.getStorageSync('userId')
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
form: {
|
||||
certificateType: 'car',
|
||||
userId
|
||||
},
|
||||
fileList1: [],
|
||||
disabled: false,
|
||||
// 临时图片 (用于上传)
|
||||
tempFile: null,
|
||||
isEdit: false,
|
||||
submitText: '提交认证信息'
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
this.getData()
|
||||
},
|
||||
methods: {
|
||||
getData() {
|
||||
const app = this
|
||||
const {
|
||||
form
|
||||
} = this
|
||||
CertificateApi.listCertificate({
|
||||
userId,
|
||||
certificateType: 'car',
|
||||
}).then(res => {
|
||||
if (res.data && res.data.length > 0) {
|
||||
app.form = res.data[0]
|
||||
app.fileList1 = JSON.parse(res.data[0].files)
|
||||
|
||||
if(app.form.status == 10){
|
||||
app.submitText = '认证中'
|
||||
app.isEdit = true
|
||||
}
|
||||
if(app.form.status == 20){
|
||||
app.submitText = '提交认证信息'
|
||||
app.isEdit = false
|
||||
}
|
||||
if(app.form.status == 30){
|
||||
app.submitText = '已通过'
|
||||
app.isEdit = true
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
onArea() {
|
||||
this.$refs.area.open()
|
||||
},
|
||||
//地址选择成功
|
||||
chooseSuccess(e) {
|
||||
const data = e.value
|
||||
this.form.city = data[1].label
|
||||
},
|
||||
// 新增图片
|
||||
async afterRead(event) {
|
||||
console.log("event: ", event);
|
||||
// 当设置 multiple 为 true 时, file 为数组格式,否则为对象格式
|
||||
let lists = [].concat(event.file)
|
||||
let fileListLen = this[`fileList${event.name}`].length
|
||||
lists.map((item) => {
|
||||
this[`fileList${event.name}`].push({
|
||||
...item,
|
||||
status: 'uploading',
|
||||
message: '上传中'
|
||||
})
|
||||
})
|
||||
for (let i = 0; i < lists.length; i++) {
|
||||
const result = await this.uploadFilePromise(lists[i].url)
|
||||
let item = this[`fileList${event.name}`][fileListLen]
|
||||
this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
|
||||
status: 'success',
|
||||
message: '',
|
||||
url: result.url,
|
||||
thumb: result.thumbUrl
|
||||
}))
|
||||
fileListLen++
|
||||
}
|
||||
},
|
||||
uploadFilePromise(url) {
|
||||
return new Promise((resolve, reject) => {
|
||||
UploadApi.uploadFile({
|
||||
filePath: url,
|
||||
fileType: 'image',
|
||||
name: 'file',
|
||||
header: {
|
||||
Authorization: uni.getStorageSync('AccessToken')
|
||||
},
|
||||
}).then(result => {
|
||||
setTimeout(() => {
|
||||
resolve(result.data)
|
||||
}, 1000)
|
||||
}).catch(err => {
|
||||
console.log("err: ", err);
|
||||
})
|
||||
})
|
||||
},
|
||||
// 删除图片
|
||||
deletePic(event) {
|
||||
if(this.isEdit == true){
|
||||
return false;
|
||||
}
|
||||
this[`fileList${event.name}`].splice(event.index, 1)
|
||||
},
|
||||
// 确认修改
|
||||
async handleSubmit() {
|
||||
const app = this
|
||||
if(app.fileList1.findIndex(item => item.status != 'success') >= 0){
|
||||
return
|
||||
}
|
||||
if (app.disabled === true) return
|
||||
app.form.files = JSON.stringify(app.fileList1)
|
||||
const saveCertificate = app.isEdit ? CertificateApi.updateCertificate : CertificateApi.addCertificate
|
||||
saveCertificate(app.form).then(result => {
|
||||
app.$success('提交成功')
|
||||
this.getData()
|
||||
}).catch(err => {
|
||||
app.$error(err.message)
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
page {
|
||||
background-color: #f3f3f3;
|
||||
}
|
||||
|
||||
.container {
|
||||
|
||||
.form {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.block {
|
||||
margin: auto;
|
||||
width: 700rpx;
|
||||
font-size: 28rpx;
|
||||
|
||||
.u-input {
|
||||
background-color: #ffffff !important;
|
||||
}
|
||||
|
||||
.upload {
|
||||
width: 360rpx;
|
||||
margin: 0 auto;
|
||||
padding: 20rpx 0;
|
||||
justify-content: center;
|
||||
|
||||
.id-card-upload {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
margin: 10rpx auto;
|
||||
color: #cccccc;
|
||||
border: 5rpx dashed #d9d9d9;
|
||||
border-radius: 20rpx;
|
||||
width: 360rpx;
|
||||
height: 220rpx;
|
||||
|
||||
.photograph {
|
||||
width: 60rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.desc-title {
|
||||
line-height: 3rem;
|
||||
}
|
||||
|
||||
.desc {
|
||||
color: #cccccc;
|
||||
|
||||
text {
|
||||
color: #7f006f;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.btn-wrapper {
|
||||
background: none;
|
||||
width: 360rpx;
|
||||
margin: 50rpx auto;
|
||||
// display: flex;
|
||||
// align-items: center;
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
</style>
|
||||
313
sub_pages/certification/certification.vue
Normal file
313
sub_pages/certification/certification.vue
Normal file
@@ -0,0 +1,313 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view class="page-bg">
|
||||
<view class="title">认证越多 曝光率越高</view>
|
||||
<view class="content">
|
||||
<view>进行认证可提升您的综合竞争力</view>
|
||||
<view>可获得优先匹配和更多推荐机会</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="user-list">
|
||||
<view class="item" v-for="(item, index) in list" :key="index" @click="navTo(item)">
|
||||
<view class="content">
|
||||
<view class="icon">
|
||||
<image :src="item.icon" mode="widthFix"></image>
|
||||
</view>
|
||||
<view class="info">
|
||||
<view class="title">{{ item.name }}</view>
|
||||
<view class="desc">{{ item.desc }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="btn">
|
||||
{{item.submitText}}
|
||||
<u-icon name="arrow-right" color="#681752"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- <u-list @scrolltolower="scrolltolower">
|
||||
<view class="list">
|
||||
<u-list-item v-for="(item, index) in list" :key="index">
|
||||
<u-cell :title="`${item.name}`" :icon="item.icon">
|
||||
<view slot="right-icon" class="follow-btn" @click="navTo(item)">
|
||||
<text>aa{{ item.submitText }}</text>
|
||||
</view>
|
||||
</u-cell>
|
||||
</u-list-item>
|
||||
<u-empty v-if="list.length == 0" mode="search" icon="http://cdn.uviewui.com/uview/empty/search.png">
|
||||
</u-empty>
|
||||
</view>
|
||||
</u-list> -->
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as CertificateApi from '@/api/love-certificate.js'
|
||||
import * as UserProfileApi from '@/api/love-user-profile.js'
|
||||
|
||||
const userId = uni.getStorageSync('userId')
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
form: {
|
||||
userId
|
||||
},
|
||||
list: [{
|
||||
type: 'idCard',
|
||||
icon: 'https://file-jimei.oss-cn-shenzhen.aliyuncs.com/static/idcard.png',
|
||||
name: '身份认证',
|
||||
desc: '远离骗子与婚托,真诚交友安全有保障',
|
||||
url: 'sub_pages/certification/id-card/id-card',
|
||||
submitText: '去认证',
|
||||
isEdit: false
|
||||
},
|
||||
{
|
||||
type: 'house',
|
||||
icon: 'https://file-jimei.oss-cn-shenzhen.aliyuncs.com/static/house.png',
|
||||
name: '房屋认证',
|
||||
desc: '有趣的灵魂万里挑一,遇见同频的TA',
|
||||
url: 'sub_pages/certification/house/house',
|
||||
submitText: '去认证',
|
||||
isEdit: false
|
||||
},
|
||||
{
|
||||
type: 'education',
|
||||
icon: 'https://file-jimei.oss-cn-shenzhen.aliyuncs.com/static/xueli.png',
|
||||
name: '学历认证',
|
||||
desc: '有车一族,来一场说走就走的旅行',
|
||||
url: 'sub_pages/certification/education/education',
|
||||
submitText: '去认证',
|
||||
isEdit: false
|
||||
},
|
||||
{
|
||||
type: 'car',
|
||||
icon: 'https://file-jimei.oss-cn-shenzhen.aliyuncs.com/static/card.png',
|
||||
name: '车辆认证',
|
||||
desc: '完成房产认证,证实你的实力',
|
||||
url: 'sub_pages/certification/car/car',
|
||||
submitText: '去认证',
|
||||
isEdit: false
|
||||
}
|
||||
],
|
||||
page: 0,
|
||||
where: {},
|
||||
// 控制onShow事件是否刷新订单列表
|
||||
canReset: false,
|
||||
disabled: false
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad(options) {
|
||||
this.where = options
|
||||
},
|
||||
onShow() {
|
||||
console.log("onSHow");
|
||||
this.getData()
|
||||
},
|
||||
|
||||
methods: {
|
||||
getData() {
|
||||
const app = this
|
||||
const {
|
||||
form
|
||||
} = this
|
||||
CertificateApi.listCertificate(form).then(res => {
|
||||
res.data.map(d => {
|
||||
if(d.certificateType == 'idCard' ){
|
||||
if(d.status == 30){
|
||||
app.list[0].submitText = '已认证'
|
||||
app.list[0].isEdit = true
|
||||
}else if(d.status == 20){
|
||||
app.list[0].submitText = '已驳回'
|
||||
app.list[0].isEdit = false
|
||||
}else if(d.status == 10){
|
||||
app.list[0].submitText = '认证中'
|
||||
app.list[0].isEdit = false
|
||||
}
|
||||
}
|
||||
if(d.certificateType == 'house' ){
|
||||
if(d.status == 30){
|
||||
app.list[1].submitText = '已认证'
|
||||
app.list[1].isEdit = true
|
||||
}else if(d.status == 20){
|
||||
app.list[1].submitText = '已驳回'
|
||||
app.list[1].isEdit = false
|
||||
}else if(d.status == 10){
|
||||
app.list[1].submitText = '认证中'
|
||||
app.list[1].isEdit = true
|
||||
}
|
||||
}
|
||||
if(d.certificateType == 'education' ){
|
||||
if(d.status == 30){
|
||||
app.list[2].submitText = '已认证'
|
||||
app.list[2].isEdit = true
|
||||
}else if(d.status == 20){
|
||||
app.list[2].submitText = '已驳回'
|
||||
app.list[2].isEdit = false
|
||||
}else if(d.status == 10){
|
||||
app.list[2].submitText = '认证中'
|
||||
app.list[2].isEdit = true
|
||||
}
|
||||
}
|
||||
if(d.certificateType == 'car'){
|
||||
if(d.status == 30){
|
||||
app.list[3].submitText = '已认证'
|
||||
app.list[3].isEdit = true
|
||||
}else if(d.status == 20){
|
||||
app.list[3].submitText = '已驳回'
|
||||
app.list[3].isEdit = false
|
||||
}else if(d.status == 10){
|
||||
app.list[3].submitText = '认证中'
|
||||
app.list[3].isEdit = true
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
// 刷新会员列表
|
||||
onRefreshList() {
|
||||
const app = this
|
||||
app.where.page = app.page
|
||||
return new Promise((resolve, reject) => {
|
||||
UserProfileApi.pageUserProfile(app.where)
|
||||
.then(result => {
|
||||
const list = result.data.list
|
||||
// 合并新数据
|
||||
app.list = app.list.concat(list)
|
||||
if (result.data.count > app.list.length) {
|
||||
app.canReset = true
|
||||
} else {
|
||||
app.canReset = false
|
||||
}
|
||||
resolve(list)
|
||||
})
|
||||
})
|
||||
},
|
||||
scrolltolower(e) {
|
||||
console.log("e: ", e);
|
||||
},
|
||||
navTo(item) {
|
||||
console.log("item: ",item);
|
||||
|
||||
this.$push(item.url)
|
||||
},
|
||||
onFollow(e) {
|
||||
console.log("e11: ", e);
|
||||
},
|
||||
onSearch() {
|
||||
this.list = []
|
||||
this.where.page = 1
|
||||
this.onRefreshList()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.container {
|
||||
// background-color: #ffffff;
|
||||
}
|
||||
|
||||
.search-wrapper {
|
||||
display: flex;
|
||||
height: 64rpx;
|
||||
}
|
||||
|
||||
.user-list {
|
||||
margin: 0 auto;
|
||||
.list{
|
||||
.icon{
|
||||
padding: 10rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.item{
|
||||
width: 660rpx;
|
||||
height: 130rpx;
|
||||
margin: 50rpx auto;
|
||||
padding: 20rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
background-color: #ffffff;
|
||||
box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.1);
|
||||
border-radius: 20rpx;
|
||||
.content{
|
||||
display: flex;
|
||||
.icon{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
image{
|
||||
width: 70rpx;
|
||||
height: 70rpx;
|
||||
}
|
||||
}
|
||||
.info{
|
||||
margin-left: 16rpx;
|
||||
.title{
|
||||
font-size: 32rpx;
|
||||
font-weight: 700;
|
||||
padding-bottom: 5rpx;
|
||||
}
|
||||
.desc{
|
||||
font-size: 26rpx;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
}
|
||||
.btn{
|
||||
font-size: 28rpx;
|
||||
color: #681752;
|
||||
width: 120rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.follow-btn {
|
||||
padding: 4rpx 20rpx;
|
||||
color: #ffffff;
|
||||
font-size: 26rpx;
|
||||
border-radius: 50rpx;
|
||||
margin-right: 10rpx;
|
||||
background: linear-gradient(#47076b, #8d1a50);
|
||||
.content{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
image {
|
||||
width: 24rpx;
|
||||
height: 66rpx;
|
||||
margin-right: 6rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.page-bg {
|
||||
width: 750rpx;
|
||||
height: calc(200rpx + var(--status-bar-height));
|
||||
background: linear-gradient(to bottom, $main-bg, $main-bg2);
|
||||
color: #ffffff;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
.title{
|
||||
font-size: 38rpx;
|
||||
}
|
||||
.content{
|
||||
color: #f3f3f3;
|
||||
font-size: 28rpx;
|
||||
line-height: 1.3rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
285
sub_pages/certification/education/education.vue
Normal file
285
sub_pages/certification/education/education.vue
Normal file
@@ -0,0 +1,285 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view class="form">
|
||||
<u--form :model="form" ref="uForm" label-width="200rpx">
|
||||
<u-gap height="10" bgColor="#f3f3f3"></u-gap>
|
||||
<view class="block">
|
||||
<u-form-item label="学历" prop="education" borderBottom @click="showEducation">
|
||||
<u-input v-model="form.education" :disabled="true" :customStyle="{backgroundColor: '#ffffff'}" placeholder="选择学历" class="u-input" maxlength="20" />
|
||||
</u-form-item>
|
||||
<u-form-item label="认证方式" prop="authType" borderBottom @click="showAuthType">
|
||||
<u-input v-model="form.authType" :disabled="true" :customStyle="{backgroundColor: '#ffffff'}" placeholder="选择认证方式" class="u-input" maxlength="20" />
|
||||
</u-form-item>
|
||||
<u-form-item label="毕业院校" prop="college">
|
||||
<u-input v-model="form.college" :disabled="isEdit" placeholder="毕业院校" class="u-input" maxlength="20" />
|
||||
</u-form-item>
|
||||
</view>
|
||||
<u-gap height="10" bgColor="#f3f3f3"></u-gap>
|
||||
<view class="block">
|
||||
<view class="upload">
|
||||
<u-upload :fileList="fileList1" :maxSize="3145728" width="250" height="150"
|
||||
@afterRead="afterRead" @delete="deletePic" :disabled="isEdit" name="1" multiple :maxCount="1">
|
||||
<view class="id-card-upload">
|
||||
<image class="photograph" src="../../../static/icon/photograph.png" mode="widthFix">
|
||||
</image>
|
||||
<text>上传学历认证照片</text>
|
||||
</view>
|
||||
</u-upload>
|
||||
</view>
|
||||
</view>
|
||||
<u-gap height="10" bgColor="#f3f3f3"></u-gap>
|
||||
<view class="block">
|
||||
<u-form-item label="去学信网截图" prop="authType">
|
||||
<!-- <u-input v-model="form.authType" class="u-input" maxlength="20" /> -->
|
||||
</u-form-item>
|
||||
<view class="desc"><text>登录学信网->在线验证报告,截图后返回上传即可</text></view>
|
||||
<view class="photo">
|
||||
<image src="https://file.wsdns.cn/20230619/e259164339364fb1b2bc43fc50b21c50.png"
|
||||
style="width: 700rpx;" mode="widthFix"></image>
|
||||
</view>
|
||||
</view>
|
||||
</u--form>
|
||||
</view>
|
||||
<view class="btn-wrapper">
|
||||
<u-button :text="submitText" color="linear-gradient(to bottom, #010002, #681752)" :disabled="isEdit"
|
||||
shape="circle" @click="handleSubmit()"></u-button>
|
||||
</view>
|
||||
<!-- 地址选择器 -->
|
||||
<liu-customize-sel ref="area" @change="chooseSuccess"></liu-customize-sel>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as UploadApi from '@/api/upload'
|
||||
import * as CertificateApi from '@/api/love-certificate.js'
|
||||
|
||||
const userId = uni.getStorageSync('userId')
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
form: {
|
||||
certificateType: 'education',
|
||||
userId,
|
||||
education: '',
|
||||
authType: ''
|
||||
},
|
||||
educationColumns: [''],
|
||||
fileList1: [],
|
||||
disabled: false,
|
||||
// 临时图片 (用于上传)
|
||||
tempFile: null,
|
||||
isEdit: false,
|
||||
submitText: '提交认证信息'
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
this.getData()
|
||||
},
|
||||
methods: {
|
||||
getData() {
|
||||
const app = this
|
||||
const {
|
||||
form
|
||||
} = this
|
||||
CertificateApi.listCertificate({
|
||||
userId,
|
||||
certificateType: 'education',
|
||||
}).then(res => {
|
||||
if (res.data && res.data.length > 0) {
|
||||
app.form = res.data[0]
|
||||
app.fileList1 = JSON.parse(res.data[0].files)
|
||||
|
||||
if(app.form.status == 10){
|
||||
app.submitText = '认证中'
|
||||
app.isEdit = true
|
||||
}
|
||||
if(app.form.status == 20){
|
||||
app.submitText = '提交认证信息'
|
||||
app.isEdit = false
|
||||
}
|
||||
if(app.form.status == 30){
|
||||
app.submitText = '已通过'
|
||||
app.isEdit = true
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
showEducation() {
|
||||
if(this.isEdit == true){
|
||||
return false;
|
||||
}
|
||||
const itemList = ['专科以下','专科','本科','硕士研究生','博士研究生'];
|
||||
uni.showActionSheet({
|
||||
itemList,
|
||||
success: ({tapIndex}) => {
|
||||
this.form.education = itemList[tapIndex]
|
||||
}
|
||||
})
|
||||
},
|
||||
showAuthType() {
|
||||
if(this.isEdit == true){
|
||||
return false;
|
||||
}
|
||||
const itemList = ['学信网截图','毕业证/学位证','在校(学生证/在读证明)'];
|
||||
uni.showActionSheet({
|
||||
itemList,
|
||||
success: ({tapIndex}) => {
|
||||
this.form.authType = itemList[tapIndex]
|
||||
}
|
||||
})
|
||||
},
|
||||
onArea() {
|
||||
if(this.isEdit == true){
|
||||
return false;
|
||||
}
|
||||
this.$refs.area.open()
|
||||
},
|
||||
//地址选择成功
|
||||
chooseSuccess(e) {
|
||||
const data = e.value
|
||||
this.form.city = data[1].label
|
||||
},
|
||||
// 新增图片
|
||||
async afterRead(event) {
|
||||
|
||||
console.log("event: ", event);
|
||||
// 当设置 multiple 为 true 时, file 为数组格式,否则为对象格式
|
||||
let lists = [].concat(event.file)
|
||||
let fileListLen = this[`fileList${event.name}`].length
|
||||
lists.map((item) => {
|
||||
this[`fileList${event.name}`].push({
|
||||
...item,
|
||||
status: 'uploading',
|
||||
message: '上传中'
|
||||
})
|
||||
})
|
||||
for (let i = 0; i < lists.length; i++) {
|
||||
const result = await this.uploadFilePromise(lists[i].url)
|
||||
console.log('result: ',result);
|
||||
let item = this[`fileList${event.name}`][fileListLen]
|
||||
this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
|
||||
status: 'success',
|
||||
message: '',
|
||||
url: result.url,
|
||||
thumb: result.thumbUrl
|
||||
}))
|
||||
fileListLen++
|
||||
}
|
||||
},
|
||||
uploadFilePromise(url) {
|
||||
return new Promise((resolve, reject) => {
|
||||
UploadApi.uploadFile({
|
||||
filePath: url,
|
||||
fileType: 'image',
|
||||
name: 'file',
|
||||
header: {
|
||||
Authorization: uni.getStorageSync('AccessToken')
|
||||
},
|
||||
}).then(result => {
|
||||
setTimeout(() => {
|
||||
resolve(result.data)
|
||||
}, 1000)
|
||||
}).catch(err => {
|
||||
console.log("err: ", err);
|
||||
})
|
||||
})
|
||||
},
|
||||
// 删除图片
|
||||
deletePic(event) {
|
||||
if(this.isEdit == true){
|
||||
return false;
|
||||
}
|
||||
this[`fileList${event.name}`].splice(event.index, 1)
|
||||
},
|
||||
// 确认修改
|
||||
async handleSubmit() {
|
||||
const app = this
|
||||
if(app.fileList1.findIndex(item => item.status != 'success') >= 0){
|
||||
return
|
||||
}
|
||||
if (app.disabled === true) return
|
||||
app.form.files = JSON.stringify(app.fileList1)
|
||||
const saveCertificate = app.isEdit ? CertificateApi.updateCertificate : CertificateApi.addCertificate
|
||||
saveCertificate(app.form).then(result => {
|
||||
app.$success('提交成功')
|
||||
this.getData()
|
||||
}).catch(err => {
|
||||
app.$error(err.message)
|
||||
})
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
page {
|
||||
background-color: #f3f3f3;
|
||||
}
|
||||
|
||||
.container {
|
||||
|
||||
.form {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.block {
|
||||
margin: auto;
|
||||
width: 700rpx;
|
||||
font-size: 28rpx;
|
||||
|
||||
.u-input {
|
||||
background-color: #ffffff !important;
|
||||
}
|
||||
|
||||
.upload {
|
||||
width: 360rpx;
|
||||
margin: 0 auto;
|
||||
padding: 20rpx 0;
|
||||
justify-content: center;
|
||||
|
||||
.id-card-upload {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
margin: 10rpx auto;
|
||||
color: #cccccc;
|
||||
border: 5rpx dashed #d9d9d9;
|
||||
border-radius: 20rpx;
|
||||
width: 360rpx;
|
||||
height: 220rpx;
|
||||
|
||||
.photograph {
|
||||
width: 60rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.desc-title {
|
||||
line-height: 3rem;
|
||||
}
|
||||
|
||||
.desc {
|
||||
color: #cccccc;
|
||||
|
||||
text {
|
||||
color: #7f006f;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.btn-wrapper {
|
||||
background: none;
|
||||
width: 360rpx;
|
||||
margin: 50rpx auto;
|
||||
// display: flex;
|
||||
// align-items: center;
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
</style>
|
||||
251
sub_pages/certification/house/house.vue
Normal file
251
sub_pages/certification/house/house.vue
Normal file
@@ -0,0 +1,251 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view class="form">
|
||||
<u--form :model="form" ref="uForm" label-width="200rpx">
|
||||
<u-gap height="10" bgColor="#f3f3f3"></u-gap>
|
||||
<view class="block">
|
||||
<u-form-item label="房产所在城市" prop="cityByHouse" @click="onArea">
|
||||
<u-input v-model="form.cityByHouse" :disabled="true" :customStyle="{backgroundColor: '#ffffff'}" placeholder="选择房产所在城市" class="u-input" maxlength="20" />
|
||||
<!-- <view class="">
|
||||
<view style="border: solid 1px #eeeeee;height: 60rpx;border-radius: 10rpx;line-height: 60rpx;padding-left: 10rpx;margin:0 10rpx;">
|
||||
{{ form.cityByHouse }}
|
||||
</view>
|
||||
</view> -->
|
||||
</u-form-item>
|
||||
</view>
|
||||
<u-gap height="10" bgColor="#f3f3f3"></u-gap>
|
||||
<view class="block">
|
||||
<view class="upload">
|
||||
<u-upload :fileList="fileList1" :maxSize="3145728" width="250" height="150"
|
||||
@afterRead="afterRead" @delete="deletePic" :disabled="isEdit" name="1" multiple :maxCount="1">
|
||||
<view class="id-card-upload">
|
||||
<image class="photograph" src="../../../static/icon/photograph.png" mode="widthFix">
|
||||
</image>
|
||||
<text>上传证件照片</text>
|
||||
</view>
|
||||
</u-upload>
|
||||
</view>
|
||||
</view>
|
||||
<u-gap height="10" bgColor="#f3f3f3"></u-gap>
|
||||
<view class="block">
|
||||
<view class="desc-title">请上传房产证内页或房购房合同内页,需露出署名:</view>
|
||||
<view class="desc"><text>您上传的照片资料仅作为认证使用,并将加密处理</text></view>
|
||||
<view class="photo">
|
||||
<image src="https://file.wsdns.cn/20230619/432114c901dc499197c63e247fafdae6.png" style="width: 400rpx;" mode="widthFix"></image>
|
||||
</view>
|
||||
</view>
|
||||
</u--form>
|
||||
</view>
|
||||
<view class="btn-wrapper">
|
||||
<u-button :text="submitText" color="linear-gradient(to bottom, #010002, #681752)" :disabled="isEdit"
|
||||
shape="circle" @click="handleSubmit()"></u-button>
|
||||
</view>
|
||||
<!-- 地址选择器 -->
|
||||
<liu-customize-sel ref="area" @change="chooseSuccess"></liu-customize-sel>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as UploadApi from '@/api/upload'
|
||||
import * as CertificateApi from '@/api/love-certificate.js'
|
||||
import Vue from 'vue'
|
||||
const userId = uni.getStorageSync('userId')
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
form: {
|
||||
userId,
|
||||
certificateType: 'house',
|
||||
cityByHouse: ''
|
||||
},
|
||||
fileList1: [],
|
||||
disabled: false,
|
||||
// 临时图片 (用于上传)
|
||||
tempFile: null,
|
||||
isEdit: false,
|
||||
submitText: '提交认证信息'
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
this.getData()
|
||||
},
|
||||
methods: {
|
||||
getData() {
|
||||
const app = this
|
||||
const {
|
||||
form
|
||||
} = this
|
||||
CertificateApi.listCertificate({
|
||||
userId,
|
||||
certificateType: 'house',
|
||||
}).then(res => {
|
||||
if (res.data && res.data.length > 0) {
|
||||
app.form = res.data[0]
|
||||
app.fileList1 = JSON.parse(res.data[0].files)
|
||||
|
||||
if(app.form.status == 10){
|
||||
app.submitText = '认证中'
|
||||
app.isEdit = true
|
||||
}
|
||||
if(app.form.status == 20){
|
||||
app.submitText = '提交认证信息'
|
||||
app.isEdit = false
|
||||
}
|
||||
if(app.form.status == 30){
|
||||
app.submitText = '已通过'
|
||||
app.isEdit = true
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
onArea() {
|
||||
if(this.isEdit == true){
|
||||
return false;
|
||||
}
|
||||
this.$refs.area.open()
|
||||
},
|
||||
//地址选择成功
|
||||
chooseSuccess(e) {
|
||||
const app = this
|
||||
const data = e.value
|
||||
app.form.cityByHouse = data[1].label
|
||||
// Vue.set(this.form, 'cityByHouse', data[1].label)
|
||||
},
|
||||
// 新增图片
|
||||
async afterRead(event) {
|
||||
console.log("event: ", event);
|
||||
// 当设置 multiple 为 true 时, file 为数组格式,否则为对象格式
|
||||
let lists = [].concat(event.file)
|
||||
let fileListLen = this[`fileList${event.name}`].length
|
||||
lists.map((item) => {
|
||||
this[`fileList${event.name}`].push({
|
||||
...item,
|
||||
status: 'uploading',
|
||||
message: '上传中'
|
||||
})
|
||||
})
|
||||
for (let i = 0; i < lists.length; i++) {
|
||||
const result = await this.uploadFilePromise(lists[i].url)
|
||||
let item = this[`fileList${event.name}`][fileListLen]
|
||||
this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
|
||||
status: 'success',
|
||||
message: '',
|
||||
url: result.url,
|
||||
thumb: result.thumbUrl
|
||||
}))
|
||||
fileListLen++
|
||||
}
|
||||
},
|
||||
uploadFilePromise(url) {
|
||||
return new Promise((resolve, reject) => {
|
||||
UploadApi.uploadFile({
|
||||
filePath: url,
|
||||
fileType: 'image',
|
||||
name: 'file',
|
||||
header: {
|
||||
Authorization: uni.getStorageSync('AccessToken')
|
||||
},
|
||||
}).then(result => {
|
||||
setTimeout(() => {
|
||||
resolve(result.data)
|
||||
}, 1000)
|
||||
}).catch(err => {
|
||||
console.log("err: ", err);
|
||||
})
|
||||
})
|
||||
},
|
||||
// 删除图片
|
||||
deletePic(event) {
|
||||
if(this.isEdit == true){
|
||||
return false;
|
||||
}
|
||||
this[`fileList${event.name}`].splice(event.index, 1)
|
||||
},
|
||||
// 确认修改
|
||||
async handleSubmit() {
|
||||
const app = this
|
||||
if(app.fileList1.findIndex(item => item.status != 'success') >= 0){
|
||||
return
|
||||
}
|
||||
if (app.disabled === true) return
|
||||
console.log("app.tempFile: ", app.tempFile);
|
||||
app.form.files = JSON.stringify(app.fileList1)
|
||||
const saveCertificate = app.isEdit ? CertificateApi.updateCertificate : CertificateApi.addCertificate
|
||||
saveCertificate(app.form).then(result => {
|
||||
app.$success('提交成功')
|
||||
this.getData()
|
||||
}).catch(err => {
|
||||
app.$error(err.message)
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
page {
|
||||
background-color: #f3f3f3;
|
||||
}
|
||||
|
||||
.container {
|
||||
|
||||
.form{
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.block {
|
||||
margin: auto;
|
||||
width: 700rpx;
|
||||
font-size: 28rpx;
|
||||
.u-input{
|
||||
background-color: #ffffff !important;
|
||||
}
|
||||
|
||||
.upload {
|
||||
width: 360rpx;
|
||||
margin: 0 auto;
|
||||
padding: 20rpx 0;
|
||||
justify-content: center;
|
||||
|
||||
.id-card-upload {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
margin: 10rpx auto;
|
||||
color: #cccccc;
|
||||
border: 5rpx dashed #d9d9d9;
|
||||
border-radius: 20rpx;
|
||||
width: 360rpx;
|
||||
height: 220rpx;
|
||||
|
||||
.photograph {
|
||||
width: 60rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.desc-title {
|
||||
line-height: 3rem;
|
||||
}
|
||||
.desc{
|
||||
color: #cccccc;
|
||||
text{
|
||||
color: #7f006f;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.btn-wrapper {
|
||||
background: none;
|
||||
width: 360rpx;
|
||||
margin: 50rpx auto;
|
||||
// display: flex;
|
||||
// align-items: center;
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
</style>
|
||||
258
sub_pages/certification/id-card/id-card.vue
Normal file
258
sub_pages/certification/id-card/id-card.vue
Normal file
@@ -0,0 +1,258 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<view class="form">
|
||||
<u--form :model="form" ref="uForm" label-width="170rpx">
|
||||
<u-gap height="10" bgColor="#f3f3f3"></u-gap>
|
||||
<view class="block">
|
||||
<u-form-item label="真实姓名" prop="realName" borderBottom>
|
||||
<u-input v-model="form.realName" maxlength="20" :disabled="isEdit" placeholder="真实姓名" />
|
||||
</u-form-item>
|
||||
<u-form-item label="身份证号" prop="certificateCode">
|
||||
<u-input v-model="form.certificateCode" maxlength="20" :disabled="isEdit" placeholder="身份证号" />
|
||||
</u-form-item>
|
||||
</view>
|
||||
<u-gap height="10" bgColor="#f3f3f3"></u-gap>
|
||||
<view class="block">
|
||||
<view class="upload">
|
||||
<u-upload :fileList="fileList1" :maxSize="1048576" width="190" height="120"
|
||||
@afterRead="afterRead" @delete="deletePic" :disabled="isEdit" name="1" multiple :maxCount="2">
|
||||
<view class="id-card-upload">
|
||||
<image class="photograph" src="../../../static/icon/photograph.png" mode="widthFix">
|
||||
</image>
|
||||
<text v-if="fileList1.length == 0">上传正面照片</text>
|
||||
<text v-if="fileList1.length == 1">上传反面照片</text>
|
||||
</view>
|
||||
</u-upload>
|
||||
<!-- <u-upload :fileList="fileList1" :maxSize="3145728" width="250" height="150"
|
||||
@afterRead="afterRead" @delete="deletePic" :disabled="isEdit" name="1" multiple :maxCount="2">
|
||||
<view class="id-card-upload">
|
||||
<image class="photograph" src="../../../static/icon/photograph.png" mode="widthFix">
|
||||
</image>
|
||||
<text>上传反面照片</text>
|
||||
</view>
|
||||
</u-upload> -->
|
||||
</view>
|
||||
</view>
|
||||
<u-gap height="10" bgColor="#f3f3f3"></u-gap>
|
||||
<view class="block">
|
||||
<view class="desc-title">拍摄身份证要求:</view>
|
||||
<view class="desc">大陆公民持有的本人有效二代身份证:<br>拍摄时确保身份证<text>边框完整,字体清晰,亮度均匀;<br>图片大小在1M以内;</text></view>
|
||||
<view class="photo">
|
||||
<image src="https://file.wsdns.cn/20230619/29a8c790211a46529fbbb66ee8d223d5.png"
|
||||
mode="widthFix"></image>
|
||||
</view>
|
||||
</view>
|
||||
</u--form>
|
||||
</view>
|
||||
<view class="btn-wrapper">
|
||||
<u-button :text="submitText" color="linear-gradient(to bottom, #010002, #681752)" :disabled="isEdit"
|
||||
shape="circle" @click="handleSubmit()"></u-button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as UploadApi from '@/api/upload'
|
||||
import store from '@/store'
|
||||
import * as CertificateApi from '@/api/love-certificate.js'
|
||||
|
||||
const userId = uni.getStorageSync('userId')
|
||||
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
form: {
|
||||
certificateType: 'idCard',
|
||||
userId
|
||||
},
|
||||
fileList1: [],
|
||||
disabled: false,
|
||||
// 临时图片 (用于上传)
|
||||
tempFile: null,
|
||||
isEdit: false,
|
||||
submitText: '提交认证信息',
|
||||
eventChannel: null
|
||||
// rules: [
|
||||
|
||||
// ]
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
this.eventChannel = this.getOpenerEventChannel();
|
||||
this.getData()
|
||||
},
|
||||
methods: {
|
||||
getData() {
|
||||
const app = this
|
||||
const {
|
||||
form
|
||||
} = this
|
||||
CertificateApi.listCertificate({
|
||||
certificateType: 'idCard',
|
||||
userId
|
||||
}).then(res => {
|
||||
if (res.data && res.data.length > 0) {
|
||||
app.form = res.data[0]
|
||||
app.fileList1 = JSON.parse(res.data[0].files)
|
||||
|
||||
if(app.form.status == 10){
|
||||
app.submitText = '认证中'
|
||||
app.isEdit = true
|
||||
}
|
||||
if(app.form.status == 20){
|
||||
app.submitText = '提交认证信息'
|
||||
app.isEdit = false
|
||||
}
|
||||
if(app.form.status == 30){
|
||||
app.submitText = '已通过'
|
||||
app.isEdit = true
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
// 新增图片
|
||||
async afterRead(event) {
|
||||
console.log("event: ", event);
|
||||
// 当设置 multiple 为 true 时, file 为数组格式,否则为对象格式
|
||||
let lists = [].concat(event.file)
|
||||
let fileListLen = this[`fileList${event.name}`].length
|
||||
lists.map((item) => {
|
||||
this[`fileList${event.name}`].push({
|
||||
...item,
|
||||
status: 'uploading',
|
||||
message: '上传中'
|
||||
})
|
||||
})
|
||||
for (let i = 0; i < lists.length; i++) {
|
||||
const result = await this.uploadFilePromise(lists[i].url)
|
||||
let item = this[`fileList${event.name}`][fileListLen]
|
||||
this[`fileList${event.name}`].splice(fileListLen, 1, Object.assign(item, {
|
||||
status: 'success',
|
||||
message: '',
|
||||
url: result.url,
|
||||
thumb: result.thumbUrl
|
||||
}))
|
||||
fileListLen++
|
||||
}
|
||||
},
|
||||
uploadFilePromise(url) {
|
||||
return new Promise((resolve, reject) => {
|
||||
UploadApi.uploadFile({
|
||||
filePath: url,
|
||||
fileType: 'image',
|
||||
name: 'file',
|
||||
header: {
|
||||
Authorization: uni.getStorageSync('AccessToken')
|
||||
},
|
||||
}).then(result => {
|
||||
setTimeout(() => {
|
||||
resolve(result.data)
|
||||
}, 1000)
|
||||
}).catch(err => {
|
||||
console.log("err: ", err);
|
||||
})
|
||||
})
|
||||
},
|
||||
// 删除图片
|
||||
deletePic(event) {
|
||||
if(this.isEdit == true){
|
||||
return false;
|
||||
}
|
||||
this[`fileList${event.name}`].splice(event.index, 1)
|
||||
},
|
||||
// 确认修改
|
||||
async handleSubmit() {
|
||||
const app = this
|
||||
if(app.fileList1.findIndex(item => item.status != 'success') >= 0){
|
||||
return
|
||||
}
|
||||
if (app.disabled === true) return
|
||||
console.log("app.tempFile: ", app.tempFile);
|
||||
app.form.files = JSON.stringify(app.fileList1)
|
||||
const saveCertificate = app.isEdit ? CertificateApi.updateCertificate : CertificateApi.addCertificate
|
||||
|
||||
uni.showLoading({
|
||||
mask: true,
|
||||
title: "正在验证"
|
||||
})
|
||||
saveCertificate(app.form).then(result => {
|
||||
app.$success('认证成功')
|
||||
this.getData()
|
||||
}).catch(err => {
|
||||
app.$error(err.message)
|
||||
}).finally(()=>{
|
||||
store.dispatch('GetUserInfo')
|
||||
this.eventChannel.emit('reload');
|
||||
uni.hideLoading()
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
page {
|
||||
background-color: #f3f3f3;
|
||||
}
|
||||
|
||||
.container {
|
||||
|
||||
.form {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.block {
|
||||
margin: auto;
|
||||
width: 700rpx;
|
||||
font-size: 28rpx;
|
||||
|
||||
.upload {
|
||||
width: 360rpx;
|
||||
margin: 0 auto;
|
||||
padding: 20rpx 0;
|
||||
justify-content: center;
|
||||
|
||||
.id-card-upload {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
margin: 10rpx auto;
|
||||
color: #cccccc;
|
||||
border: 5rpx dashed #d9d9d9;
|
||||
border-radius: 20rpx;
|
||||
width: 360rpx;
|
||||
height: 220rpx;
|
||||
|
||||
.photograph {
|
||||
width: 60rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.desc-title {
|
||||
line-height: 3rem;
|
||||
}
|
||||
|
||||
.desc {
|
||||
color: #cccccc;
|
||||
|
||||
text {
|
||||
color: #7f006f;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.btn-wrapper {
|
||||
background: none;
|
||||
width: 360rpx;
|
||||
margin: 50rpx auto;
|
||||
// display: flex;
|
||||
// align-items: center;
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user