绚火健康
This commit is contained in:
135
pages/user/setup/setup.js
Normal file
135
pages/user/setup/setup.js
Normal file
@@ -0,0 +1,135 @@
|
||||
// pages/user/setup/setup.js
|
||||
Page({
|
||||
|
||||
/**
|
||||
* 页面的初始数据
|
||||
*/
|
||||
data: {
|
||||
userData : '', // 基础信息
|
||||
avatar : '',
|
||||
nickName : '',
|
||||
nameState : false,
|
||||
disabled : false,
|
||||
reviseType: '', // 修改类型
|
||||
nameValue : '' // 限制5个字符
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad(options) {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow() {
|
||||
// 获取登录状态
|
||||
if(wx.getStorageSync("token") != ''){
|
||||
// 获取用户信息
|
||||
this.userInfo();
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 用户设置信息
|
||||
*/
|
||||
userInfo() {
|
||||
wx.$api.user.userSetup().then(res => {
|
||||
this.setData({
|
||||
userData : res.data,
|
||||
avatar : res.data.avatar,
|
||||
nickName : res.data.nickname
|
||||
})
|
||||
}).catch(err => {})
|
||||
},
|
||||
|
||||
/**
|
||||
* 头像上传
|
||||
*/
|
||||
updImg(e){
|
||||
let type = e.currentTarget.dataset.type
|
||||
this.setData({
|
||||
reviseType: e.currentTarget.dataset.type
|
||||
})
|
||||
if(type == 'avatar') {
|
||||
wx.chooseMedia({
|
||||
count : 1,
|
||||
mediaType: ['image'],
|
||||
success : path => {
|
||||
// 上传图片
|
||||
wx.$api.file.uploadImg(path.tempFiles[0].tempFilePath, {}).then(res=>{
|
||||
this.setData({
|
||||
avatar:res.url
|
||||
})
|
||||
this.settingInfo(type, res.path)
|
||||
})
|
||||
}
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
// 修改用户名
|
||||
this.setData({
|
||||
nameState: true
|
||||
})
|
||||
},
|
||||
|
||||
/*
|
||||
姓名截取
|
||||
*/
|
||||
bindinput(e) {
|
||||
this.setData({
|
||||
nameValue: e.detail.value.substr(0,5)
|
||||
})
|
||||
},
|
||||
|
||||
// 修改用户名
|
||||
freeform() {
|
||||
this.settingInfo(this.data.reviseType, this.data.nameValue)
|
||||
},
|
||||
|
||||
/**
|
||||
* 上传用户信息
|
||||
*/
|
||||
settingInfo(key, value) {
|
||||
wx.$api.user.setting(key, {
|
||||
value: value
|
||||
}).then(() => {
|
||||
this.setData({
|
||||
nameState: false,
|
||||
nameValue: ''
|
||||
})
|
||||
// 获取用户信息
|
||||
this.userInfo();
|
||||
}).catch(err => {})
|
||||
},
|
||||
|
||||
// 关闭弹框
|
||||
establish() {
|
||||
this.setData({
|
||||
nameState: false,
|
||||
nameValue: ''
|
||||
})
|
||||
},
|
||||
|
||||
|
||||
/**
|
||||
* 退出登录
|
||||
*/
|
||||
outLogin() {
|
||||
wx.showModal({
|
||||
title : '提示',
|
||||
content : '是否退出登录',
|
||||
success : res=> {
|
||||
if (res.confirm) {
|
||||
// 清理客户端登录缓存
|
||||
wx.removeStorageSync("token")
|
||||
|
||||
wx.switchTab({
|
||||
url: '/pages/user/index'
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
})
|
||||
4
pages/user/setup/setup.json
Normal file
4
pages/user/setup/setup.json
Normal file
@@ -0,0 +1,4 @@
|
||||
{
|
||||
"usingComponents": {},
|
||||
"navigationBarTitleText": "用户设置"
|
||||
}
|
||||
51
pages/user/setup/setup.wxml
Normal file
51
pages/user/setup/setup.wxml
Normal file
@@ -0,0 +1,51 @@
|
||||
<view class="setupItem">
|
||||
<view class="label" bindtap="updImg" data-type="avatar">
|
||||
<view class="label-name">
|
||||
<image class="label-name-img" src="https://cdn.shuiganying.com/images/2023/04/04/92bfc09706bc88dcb1dfe7de959dbb38.png" mode="aspectFill"></image>
|
||||
<view class="label-name-text">修改头像</view>
|
||||
</view>
|
||||
<view class="label-tips">
|
||||
<image class="label-name-head" src="{{avatar ? avatar : '/static/imgs/userHead.png'}}" mode="aspectFill"></image>
|
||||
<image class="label-name-arrow" src="/static/icons/arrow_more.png" mode="widthFix"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="label" bindtap="updImg" data-type="nickname">
|
||||
<view class="label-name">
|
||||
<image class="label-name-img" src="https://cdn.shuiganying.com/images/2023/04/04/3a96069a287b0de017a3c316b258ba98.png" mode="aspectFill"></image>
|
||||
<view class="label-name-text">用户昵称</view>
|
||||
</view>
|
||||
<view class="label-tips">
|
||||
<view class="label-name-nickName">{{nickName}}</view>
|
||||
<image class="label-name-arrow" src="/static/icons/arrow_more.png" mode="widthFix"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="setupItem">
|
||||
<view class="label" bindtap="outLogin">
|
||||
<view class="label-name">
|
||||
<image class="label-name-img" src="https://cdn.shuiganying.com/images/2023/04/11/43e0d6957a9ed4e82d40569cd46fbf42.png" mode="aspectFill"></image>
|
||||
<view class="label-name-text">退出登录</view>
|
||||
</view>
|
||||
<view class="label-tips">
|
||||
<image class="label-name-arrow" src="/static/icons/arrow_more.png" mode="widthFix"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 修改用户昵称 start -->
|
||||
<view class="publicBack" wx:if="{{nameState}}"></view>
|
||||
<view class="publicPop" wx:if="{{nameState}}">
|
||||
<view class="publicPop-cont">
|
||||
<view class="free-title">{{reviseType == 'nickname' ? '用户昵称' : '真实姓名'}}</view>
|
||||
<form bindsubmit="freeform" class="site-form">
|
||||
<view class="free-input">
|
||||
<input placeholder="限制5个字符" type="text" value="{{nameValue}}" bindinput="bindinput" name="name"></input>
|
||||
</view>
|
||||
<view class="publicPop-btn">
|
||||
<view class="publicPop-btn-go publicPop-btn-border" bindtap="establish">暂不修改</view>
|
||||
<button class="publicPop-btn-go" form-type="submit" disabled="{{disabled}}">确认提交</button>
|
||||
</view>
|
||||
</form>
|
||||
</view>
|
||||
</view>
|
||||
173
pages/user/setup/setup.wxss
Normal file
173
pages/user/setup/setup.wxss
Normal file
@@ -0,0 +1,173 @@
|
||||
page {
|
||||
background-color: #f8f8f8;
|
||||
}
|
||||
|
||||
.setupItem {
|
||||
margin-bottom: 30rpx;
|
||||
background-color: #ffffff;
|
||||
}
|
||||
|
||||
.label {
|
||||
line-height: 60rpx;
|
||||
display: flex;
|
||||
padding: 30rpx;
|
||||
box-sizing: border-box;
|
||||
border-bottom: 2rpx solid #f7f9fa;
|
||||
}
|
||||
|
||||
.label:last-child {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.label-name {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.label-name-img {
|
||||
width: 34rpx;
|
||||
height: 34rpx;
|
||||
margin-top: 14rpx;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.label-tips,
|
||||
.entry {
|
||||
display: flex;
|
||||
color: rgb(110, 110, 110);
|
||||
}
|
||||
|
||||
.label-name-head {
|
||||
width: 54rpx;
|
||||
height: 54rpx;
|
||||
border-radius: 50%;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.label-name-nickName {
|
||||
padding-right: 10rpx;
|
||||
color: rgb(110, 110, 110);
|
||||
font-size: 30rpx;
|
||||
}
|
||||
|
||||
.label-name-arrow {
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
margin-top: 18rpx;
|
||||
}
|
||||
|
||||
.label-name-number {
|
||||
display: inline-block;
|
||||
background-color: #f8f8f8;
|
||||
color: #ffffff;
|
||||
border-radius: 60rpx;
|
||||
height: 36rpx;
|
||||
line-height: 36rpx;
|
||||
padding: 0 20rpx;
|
||||
font-size: 28rpx;
|
||||
margin: 12rpx 20rpx 0 0;
|
||||
}
|
||||
|
||||
|
||||
/* 弹出层提示 */
|
||||
.publicBack {
|
||||
position: fixed;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
left: 0;
|
||||
top: 0;
|
||||
background-color: rgba(0, 0, 0, .5);
|
||||
z-index: 99;
|
||||
}
|
||||
|
||||
.publicPop {
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
width: 240px;
|
||||
margin-left: -120px;
|
||||
margin-top: -340rpx;
|
||||
position: fixed;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.publicPop-cont {
|
||||
width: 100%;
|
||||
background-color: #FFFFFF;
|
||||
border-radius: 30rpx;
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
padding: 50rpx 0 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.free-title {
|
||||
font-weight: 600;
|
||||
margin-bottom: 40rpx;
|
||||
font-size: 34rpx;
|
||||
}
|
||||
|
||||
.free-input {
|
||||
padding: 0 30rpx;
|
||||
box-sizing: border-box;
|
||||
height: 90rpx;
|
||||
line-height: 90rpx;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
|
||||
.free-input input {
|
||||
height: 90rpx;
|
||||
border-radius: 10rpx;
|
||||
background-color: #f8f8f8;
|
||||
}
|
||||
|
||||
.publicPop-text {
|
||||
color: #9d9d9d;
|
||||
font-size: 32rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.publicPop-text text {
|
||||
color: #000000;
|
||||
font-size: 40rpx;
|
||||
display: block;
|
||||
font-weight: 600;
|
||||
margin: 20rpx 0 10rpx;
|
||||
}
|
||||
|
||||
.publicPop-btn {
|
||||
line-height: 80rpx;
|
||||
margin-top: 70rpx;
|
||||
font-size: 32rpx;
|
||||
display: flex;
|
||||
border-top: 2rpx solid #f8f8f8;
|
||||
}
|
||||
|
||||
.publicPop-btn button {
|
||||
margin: 0 !important;
|
||||
padding: 0 !important;
|
||||
background-color: transparent;
|
||||
font-weight: normal !important;
|
||||
color: #6c78f8;
|
||||
}
|
||||
|
||||
.publicPop-btn-go {
|
||||
width: 50% !important;
|
||||
text-align: center;
|
||||
height: 90rpx !important;
|
||||
line-height: 90rpx !important;
|
||||
font-size: 30rpx !important;
|
||||
}
|
||||
|
||||
.publicPop-btn-border {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.publicPop-btn-border::after {
|
||||
position: absolute;
|
||||
content: '';
|
||||
right: 0;
|
||||
top: 0;
|
||||
width: 2rpx;
|
||||
height: 100rpx;
|
||||
background-color: #f8f8f8;
|
||||
}
|
||||
Reference in New Issue
Block a user