492 lines
11 KiB
Vue
492 lines
11 KiB
Vue
|
<template>
|
|||
|
<view style="background-color: rgb(246, 247, 250); height: 100%">
|
|||
|
<u-navbar title="教育经历认证"></u-navbar>
|
|||
|
<view class="content">
|
|||
|
<view class="form">
|
|||
|
<view class="flex-col group">
|
|||
|
<view class="flex-col section_2">
|
|||
|
<view class="flex-col group_5">
|
|||
|
<view class="flex-row group_6">
|
|||
|
<text class="text_15">真实姓名</text>
|
|||
|
<u-input class="input" v-model="user.name" :custom-style="inputStyle" :type="'text'"
|
|||
|
:border="false" placeholder="请输入" inputAlign="right" />
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
|
|||
|
<view class="file">
|
|||
|
<view class="flex-col section_4">
|
|||
|
<view class="title-tips">
|
|||
|
<view class="title">上传证明</view>
|
|||
|
<view class="tips"><text class="red-tips">*</text>上传学生证、毕业证、录取通知书、校园卡,所有上传信息仅供校友身份的认证</view>
|
|||
|
</view>
|
|||
|
<view class="flex-row equal-division" style="margin-top: 0">
|
|||
|
<view class="flex-col equal-division-item">
|
|||
|
<!-- <view class="flex-row">
|
|||
|
<text :class="user.imgType==0?'text_11':'text_12'" @click="handleSelect(0)">学生证</text>
|
|||
|
<text :class="user.imgType==1?'text_11':'text_12'" @click="handleSelect(1)">毕业证</text>
|
|||
|
<text :class="user.imgType==2?'text_11':'text_12'" @click="handleSelect(2)">录取通知书</text>
|
|||
|
<text :class="user.imgType==3?'text_11':'text_12'" @click="handleSelect(3)">校园卡</text>
|
|||
|
</view> -->
|
|||
|
|
|||
|
<view class="flex-col section_5">
|
|||
|
<u-upload :header='header' :action="$u.http.config.baseUrl+action" @on-success="onSuccess"
|
|||
|
:max-size="5 * 1024 * 1024" @on-change='onChange' @on-error='onError' upload-text='' max-count="1"
|
|||
|
ref="uUpload" :auto-upload="true" width="640"
|
|||
|
height="396">
|
|||
|
<template #addBtn>
|
|||
|
<image :src="StudentCard" mode="widthFix"></image>
|
|||
|
</template>
|
|||
|
</u-upload>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
|
|||
|
</view>
|
|||
|
</view>
|
|||
|
<view class="flex-col group_9">
|
|||
|
<u-button class="button" type="primary" :disabled="!state" :plain="!state" @click="commitAuth"
|
|||
|
:throttle-time='1000'>{{state?'提交认证':'提交中'}}</u-button>
|
|||
|
</view>
|
|||
|
|
|||
|
|
|||
|
<!-- 提示 -->
|
|||
|
<u-top-tips ref="uTips" :navbar-height="0"></u-top-tips>
|
|||
|
<u-toast ref="uToast" />
|
|||
|
</view>
|
|||
|
</template>
|
|||
|
|
|||
|
<script>
|
|||
|
import uUpload from '../../../uview-ui/components/u-upload/u-upload.vue';
|
|||
|
import StudentCard from '@/static/common/img/StudentCard.png'
|
|||
|
export default {
|
|||
|
components: {
|
|||
|
uUpload
|
|||
|
},
|
|||
|
data() {
|
|||
|
return {
|
|||
|
// input 样式
|
|||
|
inputStyle: {
|
|||
|
lineHeight: "0.5rem",
|
|||
|
height: "0.5rem",
|
|||
|
width: "1.5rem",
|
|||
|
},
|
|||
|
action: '/app/User/File',
|
|||
|
user: {
|
|||
|
name: '',
|
|||
|
imageFile: '',
|
|||
|
imgType: 0,
|
|||
|
educationId: '',
|
|||
|
userId: '',
|
|||
|
},
|
|||
|
header: {
|
|||
|
Authorization: ""
|
|||
|
},
|
|||
|
state: true,
|
|||
|
StudentCard:StudentCard
|
|||
|
};
|
|||
|
},
|
|||
|
onLoad(e) {
|
|||
|
if (!e.educationId) {
|
|||
|
this.$u.route({
|
|||
|
url: "pages/my/ShoolList/ShoolList"
|
|||
|
})
|
|||
|
}
|
|||
|
this.user.educationId = e.educationId
|
|||
|
this.user.name = this.vuex_user.name ? this.vuex_user.name : ''
|
|||
|
|
|||
|
},
|
|||
|
onShow() {
|
|||
|
if (!this.user.educationId || !this.user.name) {
|
|||
|
this.$u.route({
|
|||
|
url: "pages/my/ShoolList/ShoolList"
|
|||
|
})
|
|||
|
}
|
|||
|
},
|
|||
|
created() {
|
|||
|
this.header.Authorization = "Bearer " + this.vuex_token
|
|||
|
},
|
|||
|
methods: {
|
|||
|
commitAuth() {
|
|||
|
if (!this.user.educationId) {
|
|||
|
/* uni.showToast({
|
|||
|
title: "提交错误",
|
|||
|
duration: 2000,
|
|||
|
}); */
|
|||
|
this.$refs.uToast.show({
|
|||
|
title: "提交错误",
|
|||
|
type: "error",
|
|||
|
});
|
|||
|
setTimeout(() => {
|
|||
|
this.$u.route({
|
|||
|
url: "pages/my/ShoolList/ShoolList"
|
|||
|
})
|
|||
|
}, 1000)
|
|||
|
return;
|
|||
|
}
|
|||
|
|
|||
|
if (!this.state) {
|
|||
|
this.tips("请勿重复提交", "error");
|
|||
|
return;
|
|||
|
}
|
|||
|
// console.log(file)
|
|||
|
let _this = this
|
|||
|
if (!this.user.name) {
|
|||
|
this.tips("请输入真实姓名", "error");
|
|||
|
return;
|
|||
|
}
|
|||
|
var reg = new RegExp("^[\u4e00-\u9fa5]{0,}$", "g");
|
|||
|
if (!reg.test(this.user.name)) {
|
|||
|
// this.$tips("请输入正确的真实姓名", "error");
|
|||
|
this.$refs.uToast.show({
|
|||
|
title: '请输入正确的真实姓名!',
|
|||
|
type: "error",
|
|||
|
});
|
|||
|
|
|||
|
return;
|
|||
|
}
|
|||
|
|
|||
|
if (!this.user.imageFile ) {
|
|||
|
this.tips("请上传文件", "error");
|
|||
|
return
|
|||
|
}
|
|||
|
|
|||
|
this.state = false;
|
|||
|
// uni.showLoading({
|
|||
|
// title: '提交中...'
|
|||
|
// })
|
|||
|
// setTimeout(() => {
|
|||
|
// this.state = true;
|
|||
|
// uni.hideLoading()
|
|||
|
// uni.showToast({
|
|||
|
// title: "提交失败",
|
|||
|
// duration: 2000,
|
|||
|
// });
|
|||
|
// }, 10000)
|
|||
|
this.user.userId = this.vuex_user.id
|
|||
|
this.$u.apiList.SubmitAttestationXY(this.user).then((res) => {
|
|||
|
this.state = true;
|
|||
|
uni.hideLoading()
|
|||
|
/* uni.showToast({
|
|||
|
title: "已提交",
|
|||
|
duration: 2000,
|
|||
|
}); */
|
|||
|
this.$refs.uToast.show({
|
|||
|
title: "已提交",
|
|||
|
type: "success",
|
|||
|
});
|
|||
|
setTimeout(() => {
|
|||
|
this.$u.route({
|
|||
|
url: "pages/my/ShoolList/ShoolList"
|
|||
|
})
|
|||
|
}, 1000)
|
|||
|
this.user.name = "";
|
|||
|
this.$refs.uUpload.clear()
|
|||
|
})
|
|||
|
},
|
|||
|
handleSelect(i) {
|
|||
|
this.user.imgType = i;
|
|||
|
},
|
|||
|
// 提示
|
|||
|
tips(title, type, time) {
|
|||
|
this.$refs.uToast.show({
|
|||
|
title: title ? title : "",
|
|||
|
type: type ? type : "success",
|
|||
|
duration: time ? time + "" : "1000",
|
|||
|
});
|
|||
|
},
|
|||
|
onSuccess(res) {
|
|||
|
this.user.imageFile = res.data
|
|||
|
},
|
|||
|
onChange(res){
|
|||
|
if(res.errMsg.indexOf('fail')>=0){
|
|||
|
this.user.imageFile=''
|
|||
|
}
|
|||
|
},
|
|||
|
onError() {
|
|||
|
this.tips("文件上传错误", "error");
|
|||
|
},
|
|||
|
//返回上一级
|
|||
|
router() {
|
|||
|
this.$u.route({
|
|||
|
url: 'pages/my/ShoolList/ShoolList'
|
|||
|
});
|
|||
|
}
|
|||
|
},
|
|||
|
};
|
|||
|
</script>
|
|||
|
|
|||
|
<style lang="scss" scoped>
|
|||
|
.file {
|
|||
|
|
|||
|
|
|||
|
.section_4 {
|
|||
|
margin-top: 0.06rem;
|
|||
|
// padding: 0.17rem 0.17rem 0.07rem 0.23rem;
|
|||
|
background-color: rgb(255, 255, 255);
|
|||
|
|
|||
|
.text_11 {
|
|||
|
color: #fff;
|
|||
|
font-size: 0.15rem;
|
|||
|
white-space: nowrap;
|
|||
|
padding: 0.05rem 0.05rem;
|
|||
|
background-color: #2e9bff;
|
|||
|
border-radius: 0.05rem;
|
|||
|
margin-right: 0.1rem;
|
|||
|
border: 1px solid #fff;
|
|||
|
}
|
|||
|
|
|||
|
.text_12 {
|
|||
|
color: #2e9bff;
|
|||
|
font-size: 0.15rem;
|
|||
|
white-space: nowrap;
|
|||
|
padding: 0.05rem 0.05rem;
|
|||
|
background-color: #fff;
|
|||
|
border-radius: 0.05rem;
|
|||
|
margin-right: 0.1rem;
|
|||
|
border: 1px solid #2e9bff;
|
|||
|
}
|
|||
|
|
|||
|
.equal-division {
|
|||
|
margin-top: 0.13rem;
|
|||
|
color: rgb(46, 155, 255);
|
|||
|
font-size: 0.12rem;
|
|||
|
line-height: 0.16rem;
|
|||
|
white-space: nowrap;
|
|||
|
|
|||
|
.equal-division-item {
|
|||
|
flex: 1 1 1.6rem;
|
|||
|
max-width: 100%;
|
|||
|
|
|||
|
.section_5 {
|
|||
|
// border-radius: 0.05rem;
|
|||
|
// border: 1px dotted #66b5ff;
|
|||
|
margin-top: 0.1rem;
|
|||
|
|
|||
|
::v-deep .u-upload>view {
|
|||
|
width: 100% !important;
|
|||
|
|
|||
|
}
|
|||
|
|
|||
|
::v-deep.u-list-item {
|
|||
|
width: 100% !important;
|
|||
|
margin: 0;
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
.text_16 {
|
|||
|
margin-top: 0.055rem;
|
|||
|
align-self: center;
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
.equal-division-item_1 {
|
|||
|
max-width: 48.5%;
|
|||
|
margin-left: 0.14rem;
|
|||
|
flex: 1 1 1.6rem;
|
|||
|
|
|||
|
.text_11 {
|
|||
|
margin-bottom: 0.13rem;
|
|||
|
}
|
|||
|
|
|||
|
.section_6 {
|
|||
|
padding: 0.17rem 0.27rem 0.14rem 0.29rem;
|
|||
|
border-radius: 0.05rem;
|
|||
|
border: 1px dotted #66b5ff;
|
|||
|
}
|
|||
|
|
|||
|
.text_19 {
|
|||
|
margin-top: 0.05rem;
|
|||
|
align-self: center;
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
.top-section {
|
|||
|
padding: 0.12rem 0 0.1rem;
|
|||
|
border-radius: 0.05rem;
|
|||
|
background: #eff7ff;
|
|||
|
|
|||
|
.image_6 {
|
|||
|
width: 0.22rem;
|
|||
|
height: 0.17rem;
|
|||
|
}
|
|||
|
|
|||
|
.text_12 {
|
|||
|
margin-left: 0.075rem;
|
|||
|
margin-top: 0.015rem;
|
|||
|
}
|
|||
|
}
|
|||
|
|
|||
|
.bottom-section {
|
|||
|
margin-top: 0.1rem;
|
|||
|
padding: 0.09rem 0.17rem 0.13rem;
|
|||
|
border-radius: 0.05rem;
|
|||
|
background: #eff7ff;
|
|||
|
|
|||
|
.image_8 {
|
|||
|
margin-right: 0.08rem;
|
|||
|
width: 0.23rem;
|
|||
|
height: 0.17rem;
|
|||
|
}
|
|||
|
|
|||
|
.text_14 {
|
|||
|
margin-top: 0.015rem;
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
}
|
|||
|
.group_6{
|
|||
|
display: flex;
|
|||
|
justify-content: space-between;
|
|||
|
}
|
|||
|
|
|||
|
.form {
|
|||
|
.headerImg {
|
|||
|
padding-bottom: 0.05rem;
|
|||
|
}
|
|||
|
|
|||
|
.section_2>view>view {
|
|||
|
// margin-left: 0.21rem;
|
|||
|
padding: 0 !important;
|
|||
|
border-bottom: 0.01rem solid #edeeef;
|
|||
|
position: relative;
|
|||
|
}
|
|||
|
|
|||
|
.section_2>view>view .input,
|
|||
|
.section_2>view>view text {
|
|||
|
line-height: 0.5rem;
|
|||
|
}
|
|||
|
|
|||
|
.section_2>view>view .input {
|
|||
|
// padding-right: 0.2rem !important;
|
|||
|
}
|
|||
|
|
|||
|
.section_2>view>view text {
|
|||
|
margin-right: 0.1rem;
|
|||
|
min-width: 0.91rem;
|
|||
|
white-space: nowrap;
|
|||
|
}
|
|||
|
|
|||
|
.section_2>view>view image {
|
|||
|
position: absolute;
|
|||
|
top: 50%;
|
|||
|
right: 0.14rem;
|
|||
|
transform: translateY(-50%);
|
|||
|
}
|
|||
|
|
|||
|
.image_3 {
|
|||
|
width: 0.075rem;
|
|||
|
height: 0.13rem;
|
|||
|
}
|
|||
|
|
|||
|
.group {
|
|||
|
flex: 1 1 auto;
|
|||
|
overflow-y: auto;
|
|||
|
}
|
|||
|
|
|||
|
.section_2 {
|
|||
|
padding: 0.055rem 0 0 0;
|
|||
|
background-color: rgb(255, 255, 255);
|
|||
|
}
|
|||
|
|
|||
|
.group_16 {
|
|||
|
margin-top: 0.21rem;
|
|||
|
padding: 0 0.02rem;
|
|||
|
}
|
|||
|
|
|||
|
.button_1,
|
|||
|
.button {
|
|||
|
padding: 0.13rem 0;
|
|||
|
color: rgb(255, 255, 255);
|
|||
|
font-size: 0.15rem;
|
|||
|
line-height: 0.14rem;
|
|||
|
letter-spacing: 0.03rem;
|
|||
|
white-space: nowrap;
|
|||
|
background-color: rgb(46, 155, 255);
|
|||
|
border-radius: 0.1rem;
|
|||
|
width: 3.1rem;
|
|||
|
margin: 0 auto;
|
|||
|
}
|
|||
|
|
|||
|
.button_1 {
|
|||
|
margin-top: 0.1rem;
|
|||
|
color: rgb(55, 59, 72);
|
|||
|
background-color: rgb(255, 255, 255);
|
|||
|
border: solid 0.01rem rgba(160, 162, 172, 0.33);
|
|||
|
margin-bottom: 0.2rem;
|
|||
|
}
|
|||
|
|
|||
|
.view_1 {
|
|||
|
margin-left: 0.02rem;
|
|||
|
}
|
|||
|
|
|||
|
.text_15 {
|
|||
|
color: rgb(55, 59, 72);
|
|||
|
font-size: 0.15rem;
|
|||
|
line-height: 0.16rem;
|
|||
|
white-space: nowrap;
|
|||
|
}
|
|||
|
|
|||
|
.image_2 {
|
|||
|
width: 0.6rem;
|
|||
|
height: 0.6rem;
|
|||
|
border-radius: 50%;
|
|||
|
overflow: hidden;
|
|||
|
}
|
|||
|
|
|||
|
.image_4 {
|
|||
|
margin-right: 0.15rem;
|
|||
|
margin-top: 0.28rem;
|
|||
|
}
|
|||
|
}
|
|||
|
.group_9 {
|
|||
|
background-color: rgb(246, 247, 250);
|
|||
|
padding-bottom: 0.2rem;
|
|||
|
position: fixed;
|
|||
|
bottom: 180rpx;
|
|||
|
left: 0;
|
|||
|
right: 0;
|
|||
|
|
|||
|
.button {
|
|||
|
width: 700rpx;
|
|||
|
margin: 0 auto;
|
|||
|
padding: 0.12rem 0;
|
|||
|
color: rgb(255, 255, 255);
|
|||
|
font-size: 32rpx;
|
|||
|
line-height: 0.16rem;
|
|||
|
letter-spacing: 0.03rem;
|
|||
|
white-space: nowrap;
|
|||
|
// background-color: rgb(60, 181, 251);
|
|||
|
border-radius: 50rpx;
|
|||
|
|
|||
|
}
|
|||
|
}
|
|||
|
.content {
|
|||
|
width: calc(100% - 60rpx);
|
|||
|
margin: 24rpx auto;
|
|||
|
padding: 24rpx 32rpx;
|
|||
|
background: #fff;
|
|||
|
border-radius: 32rpx;
|
|||
|
}
|
|||
|
.title{
|
|||
|
font-weight: bold;
|
|||
|
font-size: 32rpx;
|
|||
|
color: rgba(0,0,0,0.9);
|
|||
|
}
|
|||
|
.tips{
|
|||
|
font-size: 24rpx;
|
|||
|
color: #7f7f7f;
|
|||
|
margin-top: 20rpx;
|
|||
|
}
|
|||
|
.red-tips{
|
|||
|
color: #EF3920;
|
|||
|
}
|
|||
|
::v-deep .u-add-wrap {
|
|||
|
display: none !important;
|
|||
|
}
|
|||
|
</style>
|