10 changed files with 415 additions and 237 deletions
@ -1,32 +1,44 @@ |
|||
<template> |
|||
<view> |
|||
<view class="cu-timeline"> |
|||
<view class="cu-time">昨天</view> |
|||
<view class="cu-item cur cuIcon-noticefill"> |
|||
<view class="content bg-green shadow-blur"> |
|||
<text>22:22</text>【广州市】快件已到达地球 |
|||
</view> |
|||
</view> |
|||
<view class="cu-item text-red cuIcon-attentionforbidfill"> |
|||
<view class="content bg-red shadow-blur">这是第一次，我家的铲屎官走了这么久。久到足足有三天！！</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="cu-timeline"> |
|||
<view class="cu-time">06-17</view> |
|||
<view class="cu-item"> |
|||
<view class="content"> |
|||
<text>01:30</text>【喵星】 MX-12138 已揽收，准备发往银河系 |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view> |
|||
<view class="cu-timeline"> |
|||
<!-- <view class="cu-time">昨天</view> --> |
|||
<view :key="index" class="cu-item cur" v-for="(item, index) in userSigns"> |
|||
<view class="content bg-green shadow-blur"> |
|||
<text>{{ generateTime(item.time - 0) }}</text> |
|||
【 {{ item.siteName }} 】打卡 |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return {}; |
|||
}, |
|||
}; |
|||
import { mapState } from 'vuex'; |
|||
|
|||
export default { |
|||
data() { |
|||
return {}; |
|||
}, |
|||
|
|||
computed: mapState('statistics', ['userSigns']), |
|||
|
|||
methods: { |
|||
/** |
|||
* 格式化时间为文本 |
|||
* @param {number} time ms数 |
|||
*/ |
|||
generateTime(time) { |
|||
let type = 'YYYY-MM-DD HH:mm'; |
|||
if (this.$moment().isSame(time, 'day')) { |
|||
return `今天 ${this.$moment(time).format('HH:mm')}`; |
|||
} |
|||
|
|||
if (this.$moment().isSame(time, 'year')) { |
|||
type = 'MM-DD HH:mm'; |
|||
} |
|||
|
|||
return this.$moment(time).format(type); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
@ -1,209 +1,243 @@ |
|||
<template> |
|||
<view> |
|||
<form class="padding-lr cu-form-group flex-direction"> |
|||
<view class="cu-form-group flex flex-direction padding-tb"> |
|||
<view class="title padding-bottom-sm"><span v-show="!userInfo" class="text-red padding-right-xs">*</span>姓名</view> |
|||
<input :disabled="userInfo ? true : false" placeholder="请输入真实姓名" name="input" type="text" v-model="name" /> |
|||
</view> |
|||
<view class="cu-form-group flex flex-direction padding-tb"> |
|||
<view class="title padding-bottom-sm"><span v-show="!userInfo" class="text-red padding-right-xs">*</span>身份证</view> |
|||
<input :disabled="userInfo ? true : false" placeholder="请输入身份证号" name="input" type="text" v-model="idCard" /> |
|||
</view> |
|||
<view class="cu-form-group flex flex-direction padding-tb"> |
|||
<view class="title padding-bottom-sm"><span v-show="!userInfo" class="text-red padding-right-xs">*</span>联系方式</view> |
|||
<input :disabled="userInfo ? true : false" placeholder="请输入手机号码" name="input" type="number" v-model="phone" /> |
|||
</view> |
|||
<view class="cu-form-group flex flex-direction padding-tb"> |
|||
<view class="title padding-bottom-sm"><span v-show="!userInfo" class="text-red padding-right-xs">*</span>身份</view> |
|||
<radio-group class="block" @change="RadioChange" v-if="!userInfo"> |
|||
<view class="flex"> |
|||
<view class="flex-sub margin-tb-sm" v-for="(identity,index) in identitys" :key="index"> |
|||
<label class="flex justify-between align-center"> |
|||
<radio class="round margin-right-xs" :checked="index === current" :value="identity.value"></radio> |
|||
<text class="flex-sub" style="font-size: 34rpx;">{{ identity.name }}</text> |
|||
</label> |
|||
</view> |
|||
</view> |
|||
</radio-group> |
|||
<input v-else disabled name="input" type="text" :value="current === 0 ? '学生' : current === 1 ? '教师' : '工作人员'" /> |
|||
</view> |
|||
<view class="cu-form-group flex flex-direction padding-tb"> |
|||
<view class="title padding-bottom-sm"><span v-show="!userInfo" class="text-red padding-right-xs">*</span>学号</view> |
|||
<input :disabled="userInfo ? true : false" placeholder="请输入学号" name="input" type="text" v-model="studentID" /> |
|||
</view> |
|||
|
|||
</form> |
|||
<user-agreement v-if="!userInfo" @changeIntentions='changeIntentions'></user-agreement> |
|||
<button v-show="!userInfo" class="bg-cyan margin primary-btn" hover-class="cc-active" @tap="handleSubmitUserInfo">确认提交</button> |
|||
</view> |
|||
<view> |
|||
<form class="padding-lr cu-form-group flex-direction"> |
|||
<view class="cu-form-group flex flex-direction padding-tb"> |
|||
<view class="title padding-bottom-sm"> |
|||
<span class="text-red padding-right-xs" v-show="!userInfo">*</span>姓名 |
|||
</view> |
|||
<input |
|||
:disabled="(userinfo && userInfo.id) ? true : false" |
|||
name="input" |
|||
placeholder="请输入真实姓名" |
|||
type="text" |
|||
v-model="name" |
|||
/> |
|||
</view> |
|||
<view class="cu-form-group flex flex-direction padding-tb"> |
|||
<view class="title padding-bottom-sm"> |
|||
<span class="text-red padding-right-xs" v-show="!(userinfo && userInfo.id)">*</span>身份证 |
|||
</view> |
|||
<input |
|||
:disabled="(userinfo && userInfo.id) ? true : false" |
|||
name="input" |
|||
placeholder="请输入身份证号" |
|||
type="text" |
|||
v-model="idCard" |
|||
/> |
|||
</view> |
|||
<view class="cu-form-group flex flex-direction padding-tb"> |
|||
<view class="title padding-bottom-sm"> |
|||
<span class="text-red padding-right-xs" v-show="!(userinfo && userInfo.id)">*</span>联系方式 |
|||
</view> |
|||
<input |
|||
:disabled="(userinfo && userInfo.id) ? true : false" |
|||
name="input" |
|||
placeholder="请输入手机号码" |
|||
type="number" |
|||
v-model="phone" |
|||
/> |
|||
</view> |
|||
<view class="cu-form-group flex flex-direction padding-tb"> |
|||
<view class="title padding-bottom-sm"> |
|||
<span class="text-red padding-right-xs" v-show="!(userinfo && userInfo.id)">*</span>身份 |
|||
</view> |
|||
<radio-group @change="RadioChange" class="block" v-if="!(userinfo && userInfo.id)"> |
|||
<view class="flex"> |
|||
<view :key="index" class="flex-sub margin-tb-sm" v-for="(identity,index) in identitys"> |
|||
<label class="flex justify-between align-center"> |
|||
<radio |
|||
:checked="index === current" |
|||
:value="identity.value" |
|||
class="round margin-right-xs" |
|||
></radio> |
|||
<text class="flex-sub" style="font-size: 34rpx;">{{ identity.name }}</text> |
|||
</label> |
|||
</view> |
|||
</view> |
|||
</radio-group> |
|||
<input |
|||
:value="current === 0 ? '学生' : current === 1 ? '教师' : '工作人员'" |
|||
disabled |
|||
name="input" |
|||
type="text" |
|||
v-else |
|||
/> |
|||
</view> |
|||
<view class="cu-form-group flex flex-direction padding-tb"> |
|||
<view class="title padding-bottom-sm"> |
|||
<span class="text-red padding-right-xs" v-show="!(userinfo && userInfo.id)">*</span>学号 |
|||
</view> |
|||
<input |
|||
:disabled="(userinfo && userInfo.id) ? true : false" |
|||
name="input" |
|||
placeholder="请输入学号" |
|||
type="text" |
|||
v-model="studentID" |
|||
/> |
|||
</view> |
|||
</form> |
|||
<user-agreement @changeIntentions="changeIntentions" v-if="!(userinfo && userInfo.id)"></user-agreement> |
|||
<button |
|||
@tap="handleSubmitUserInfo" |
|||
class="bg-cyan margin primary-btn" |
|||
hover-class="cc-active" |
|||
v-show="!(userinfo && userInfo.id)" |
|||
>确认提交</button> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import { |
|||
showToast |
|||
} from 'common/script/util'; |
|||
import { |
|||
SUBMIT_USER_INFO |
|||
} from 'api/api'; |
|||
import { mapState,mapMutations } from 'vuex'; |
|||
import { showToast } from 'common/script/util'; |
|||
import { SUBMIT_USER_INFO } from 'api/api'; |
|||
import { mapState, mapMutations } from 'vuex'; |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
name: '', |
|||
idCard: '', |
|||
phone: '', |
|||
identitys: [{ |
|||
value: '0', |
|||
name: '学生', |
|||
}, |
|||
{ |
|||
value: '1', |
|||
name: '教师', |
|||
}, |
|||
{ |
|||
value: '2', |
|||
name: '工作人员', |
|||
}, |
|||
], |
|||
studentID: '', |
|||
current: 0, |
|||
agree: false |
|||
}; |
|||
}, |
|||
|
|||
created() { |
|||
if(this.userInfo){ |
|||
this.name = this.userInfo.name; |
|||
this.idCard = this.userInfo.idCard; |
|||
this.phone = this.userInfo.phone; |
|||
this.studentID = this.userInfo.no; |
|||
this.current = this.userInfo.post; |
|||
} |
|||
}, |
|||
|
|||
computed: mapState('user', ['userInfo','pagePath']), |
|||
|
|||
methods: { |
|||
...mapMutations('user', ['setUserInfo']), |
|||
RadioChange: function(evt) { |
|||
for (let i = 0; i < this.identitys.length; i++) { |
|||
if (this.identitys[i].value === evt.target.value) { |
|||
this.current = i; |
|||
break; |
|||
} |
|||
} |
|||
}, |
|||
|
|||
changeIntentions(data){ |
|||
this.agree = data; |
|||
}, |
|||
|
|||
/** |
|||
* 提交基本信息 |
|||
*/ |
|||
async handleSubmitUserInfo() { |
|||
try { |
|||
if (!this.checkRules()) return; |
|||
|
|||
const { |
|||
name, |
|||
idCard, |
|||
phone, |
|||
studentID, |
|||
current |
|||
} = this; |
|||
const params = { |
|||
param: { |
|||
idCard, |
|||
name, |
|||
no: studentID, |
|||
phone, |
|||
post: current |
|||
} |
|||
}; |
|||
export default { |
|||
data() { |
|||
return { |
|||
name: '', |
|||
idCard: '', |
|||
phone: '', |
|||
identitys: [ |
|||
{ |
|||
value: '0', |
|||
name: '学生', |
|||
}, |
|||
{ |
|||
value: '1', |
|||
name: '教师', |
|||
}, |
|||
{ |
|||
value: '2', |
|||
name: '工作人员', |
|||
}, |
|||
], |
|||
studentID: '', |
|||
current: 0, |
|||
agree: false, |
|||
}; |
|||
}, |
|||
|
|||
const res = await this.$http.post(SUBMIT_USER_INFO, params); |
|||
const { |
|||
success, |
|||
code, |
|||
msg, |
|||
data |
|||
} = res.data; |
|||
if (success && code === 200) { |
|||
this.success = true; |
|||
this.setUserInfo(data); |
|||
this.openPage(pagePath) |
|||
} else { |
|||
uni.showToast({ |
|||
title: msg || '提交基本信息成功', |
|||
icon: 'none' |
|||
}); |
|||
} |
|||
} catch (error) { |
|||
console.log('error: ', error); |
|||
if (error.msg) { |
|||
uni.showToast({ |
|||
title: error.msg || '提交基本信息失败', |
|||
icon: 'none' |
|||
}); |
|||
} |
|||
} |
|||
}, |
|||
|
|||
// 验证信息 |
|||
checkRules() { |
|||
const { name,idCard,phone,identitys,studentID,agree } = this; |
|||
if (!name) { |
|||
showToast('请输入姓名'); |
|||
return; |
|||
} |
|||
if (!this.verifyIdCard(idCard)) { |
|||
showToast('请输入正确的身份证号'); |
|||
return; |
|||
} |
|||
if (!this.verifyPhone(phone)) { |
|||
showToast('请输入正确的手机号'); |
|||
return false; |
|||
} |
|||
if (!identitys) { |
|||
showToast('请选择身份'); |
|||
return; |
|||
} |
|||
if (!studentID) { |
|||
showToast('请输入学号'); |
|||
return; |
|||
} |
|||
if(!agree) { |
|||
showToast('请选择是否同意《用户服务协议》和《隐私政策》'); |
|||
return; |
|||
} |
|||
return true; |
|||
}, |
|||
|
|||
/** |
|||
* 验证手机号格式 |
|||
* @param {string} phone 手机号 |
|||
*/ |
|||
verifyPhone(phone) { |
|||
const phoneExg = /^1\d{10}$/; |
|||
return phoneExg.test(phone); |
|||
}, |
|||
|
|||
/** |
|||
* 验证身份证号格式 |
|||
* @param {string} idCard 身份证号 |
|||
*/ |
|||
verifyIdCard(idCard) { |
|||
const idCardExg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/; |
|||
return idCardExg.test(idCard); |
|||
}, |
|||
}, |
|||
}; |
|||
created() { |
|||
if (this.userInfo) { |
|||
this.name = this.userInfo.name; |
|||
this.idCard = this.userInfo.idCard; |
|||
this.phone = this.userInfo.phone; |
|||
this.studentID = this.userInfo.no; |
|||
this.current = this.userInfo.post; |
|||
} |
|||
}, |
|||
|
|||
computed: mapState('user', ['userInfo', 'pagePath']), |
|||
|
|||
methods: { |
|||
...mapMutations('user', ['setUserInfo']), |
|||
RadioChange: function(evt) { |
|||
for (let i = 0; i < this.identitys.length; i++) { |
|||
if (this.identitys[i].value === evt.target.value) { |
|||
this.current = i; |
|||
break; |
|||
} |
|||
} |
|||
}, |
|||
|
|||
changeIntentions(data) { |
|||
this.agree = data; |
|||
}, |
|||
|
|||
/** |
|||
* 提交基本信息 |
|||
*/ |
|||
async handleSubmitUserInfo() { |
|||
try { |
|||
if (!this.checkRules()) return; |
|||
|
|||
const { name, idCard, phone, studentID, current } = this; |
|||
const params = { |
|||
param: { |
|||
idCard, |
|||
name, |
|||
no: studentID, |
|||
phone, |
|||
post: current, |
|||
}, |
|||
}; |
|||
|
|||
const res = await this.$http.post(SUBMIT_USER_INFO, params); |
|||
const { success, code, msg, data } = res.data; |
|||
if (success && code === 200) { |
|||
this.success = true; |
|||
this.setUserInfo(data); |
|||
this.openPage(pagePath); |
|||
} else { |
|||
uni.showToast({ |
|||
title: msg || '提交基本信息成功', |
|||
icon: 'none', |
|||
}); |
|||
} |
|||
} catch (error) { |
|||
console.log('error: ', error); |
|||
if (error.msg) { |
|||
uni.showToast({ |
|||
title: error.msg || '提交基本信息失败', |
|||
icon: 'none', |
|||
}); |
|||
} |
|||
} |
|||
}, |
|||
|
|||
// 验证信息 |
|||
checkRules() { |
|||
const { name, idCard, phone, identitys, studentID, agree } = this; |
|||
if (!name) { |
|||
showToast('请输入姓名'); |
|||
return; |
|||
} |
|||
if (!this.verifyIdCard(idCard)) { |
|||
showToast('请输入正确的身份证号'); |
|||
return; |
|||
} |
|||
if (!this.verifyPhone(phone)) { |
|||
showToast('请输入正确的手机号'); |
|||
return false; |
|||
} |
|||
if (!identitys) { |
|||
showToast('请选择身份'); |
|||
return; |
|||
} |
|||
if (!studentID) { |
|||
showToast('请输入学号'); |
|||
return; |
|||
} |
|||
if (!agree) { |
|||
showToast('请选择是否同意《用户服务协议》和《隐私政策》'); |
|||
return; |
|||
} |
|||
return true; |
|||
}, |
|||
|
|||
/** |
|||
* 验证手机号格式 |
|||
* @param {string} phone 手机号 |
|||
*/ |
|||
verifyPhone(phone) { |
|||
const phoneExg = /^1\d{10}$/; |
|||
return phoneExg.test(phone); |
|||
}, |
|||
|
|||
/** |
|||
* 验证身份证号格式 |
|||
* @param {string} idCard 身份证号 |
|||
*/ |
|||
verifyIdCard(idCard) { |
|||
const idCardExg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/; |
|||
return idCardExg.test(idCard); |
|||
}, |
|||
}, |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.primary-btn { |
|||
border-radius: 15rpx; |
|||
} |
|||
.primary-btn { |
|||
border-radius: 15rpx; |
|||
} |
|||
</style> |
|||
|
|||
Loading…
Reference in new issue