【PT.SCC实名制管理系统】24.10.01 -30天,考勤打卡小程序
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

169 lines
3.5 KiB

<!-- 用户信息 -->
<template>
<view class="login">
<!-- logo -->
<div class="logo">
打卡系统
</div>
<!-- 标题 -->
<view class="login-title">工程项目打卡系统</view>
<view class="title">
申请获取你的头像昵称
</view>
<button class="chooseAvatar" open-type="chooseAvatar" @chooseavatar="onChooseAvatar">
<view class="line">
<view class="">
头像
</view>
<view class="">
<image
:src="userInfo.headImage ? userInfo.headImage : 'https://tennis-oss.xzaiyp.top/2024-10-22/29ce46a1-33f2-4fda-8203-aaf441c678aa.png'"
style="width: 70rpx;height: 70rpx;border-radius: 50%;" mode="widthFix"></image>
<!-- <image src="@/static/login/logo.png" v-else style="width: 70rpx;height: 70rpx;border-radius: 50%;" mode="widthFix"></image> -->
</view>
</view>
</button>
<view class="line">
<view class="">
昵称
</view>
<view class="">
<input type="nickname" placeholder="请输入昵称" style="text-align: right;" id="nickName"
v-model="userInfo.nickName" />
</view>
</view>
<view class="btn" @click="submit">
确认
</view>
</view>
</template>
<script>
export default {
data() {
return {
userInfo: {
headImage: '', //设置了一个本地默认头像
nickName: '',
name: ''
}
};
},
onShow() {},
computed: {},
methods: {
onChooseAvatar(res) {
let self = this
self.$Oss.ossUpload(res.target.avatarUrl)
.then(url => {
self.userInfo.headImage = url
})
},
submit() {
let self = this
uni.createSelectorQuery().in(this)
.select("#nickName")
.fields({
properties: ["value"],
})
.exec((res) => {
const nickName = res?.[0]?.value
self.userInfo.nickName = nickName
self.userInfo.name = nickName
if (self.$utils.verificationAll(self.userInfo, {
headImage: '请更换默认头像',
nickName: '请填写昵称',
})) {
return
}
// self.$api('updateInfo', self.userInfo, res => {
// if (res.code == 200) {
// this.replushUserInfo()
// uni.switchTab({
// url: '/pages/repair/repair'
// })
// }
// })
uni.reLaunch({
url: "/pages/subPack/team/team"
})
})
},
//刷新存放在vuex的用户信息
replushUserInfo() {
this.$api('getUserInfo', res => {
if (res.code == 200) {
this.$store.commit('setUserInfo', res.result)
}
})
}
}
}
</script>
<style lang="scss" scoped>
.login {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
height: 100vh;
// logo
.logo {
display: flex;
align-items: center;
justify-content: center;
padding: 20rpx 0rpx;
width: 40%;
color: white;
background: linear-gradient(180deg, #4C9EEA, #6DB9FF);
border-radius: 45rpx 13rpx 45rpx 13rpx;
font-size: 60rpx;
}
// 标题
.login-title {
font-size: 40rpx;
font-weight: bold;
margin: 20rpx 0rpx;
}
.line {
display: flex;
justify-content: space-between;
align-items: center;
width: 80%;
border-bottom: 1px solid #00000023;
padding: 30rpx 0;
margin: 0 auto;
}
.chooseAvatar {
width: 100%;
padding: 0;
margin: 0;
margin-top: 10vh;
border: none;
}
.btn {
// background: $uni-linear-gradient-btn-color;
background: $main-color;
color: #fff;
width: 80%;
padding: 30rpx 0;
border-radius: 100rpx;
text-align: center;
margin-top: 10vh;
}
}
</style>