1.22
This commit is contained in:
zoujiandong
@@ -0,0 +1,281 @@
|
||||
// pages/personCenter/personCenter.js
|
||||
const app = getApp()
|
||||
import {
|
||||
getInfo,
|
||||
editAvatar,
|
||||
editName,
|
||||
loginout,
|
||||
getConfig,
|
||||
editConfig
|
||||
} from "../../../api/personCenter"
|
||||
import {
|
||||
getSign
|
||||
} from "../../../api/common"
|
||||
import {throttle} from "../../../utils/util"
|
||||
Page({
|
||||
|
||||
/**
|
||||
* 页面的初始数据
|
||||
*/
|
||||
data: {
|
||||
user_info: null,
|
||||
showCrop:false,
|
||||
fileList: [],
|
||||
isLock:false,
|
||||
src: '',
|
||||
img_host:'https://oss.prod.applets.igandanyiyuan.com/applet/patient/static',
|
||||
width: 250, //宽度
|
||||
height: 250, //高度
|
||||
max_width: 300,
|
||||
max_height: 300,
|
||||
disable_rotate: true, //是否禁用旋转
|
||||
disable_ratio: false, //锁定比例
|
||||
limit_move: true, //是否限制移动
|
||||
},
|
||||
goBack(){
|
||||
wx.navigateBack({
|
||||
delta: 1,
|
||||
})
|
||||
},
|
||||
upload(file){
|
||||
let THIS = this;
|
||||
wx.showToast({
|
||||
icon: "loading",
|
||||
title: '头像上传中'
|
||||
})
|
||||
getSign({
|
||||
user_type: 1,
|
||||
scene: 1
|
||||
}).then((resdata) => {
|
||||
let {
|
||||
accessid,
|
||||
dir,
|
||||
policy,
|
||||
signature,
|
||||
host
|
||||
} = resdata;
|
||||
let imgUrl = file.url;
|
||||
let index = imgUrl.lastIndexOf("/");
|
||||
let filename = imgUrl.substring(index + 1, imgUrl.length);
|
||||
wx.uploadFile({
|
||||
url: host, // 仅为示例，非真实的接口地址
|
||||
filePath: file.url,
|
||||
name: 'file',
|
||||
formData: {
|
||||
OSSAccessKeyId: accessid,
|
||||
policy,
|
||||
key: dir + filename,
|
||||
signature
|
||||
},
|
||||
success(res) {
|
||||
if (res.statusCode === 204) {
|
||||
let url = host + '/' + dir + filename;
|
||||
// 上传完成需要更新 fileList
|
||||
// const { fileList} = THIS.data;
|
||||
// fileList.push({ ...file, url: url });
|
||||
editAvatar({
|
||||
avatar: url
|
||||
}).then(res => {
|
||||
wx.showToast({
|
||||
icon: "none",
|
||||
title: '头像保存成功'
|
||||
})
|
||||
|
||||
THIS.setData({
|
||||
'user_info.avatar': url
|
||||
});
|
||||
})
|
||||
|
||||
}
|
||||
},
|
||||
fail: err => {
|
||||
console.log(err);
|
||||
}
|
||||
});
|
||||
|
||||
})
|
||||
},
|
||||
afterRead(event) {
|
||||
const {
|
||||
file
|
||||
} = event.detail;
|
||||
this.setData({
|
||||
showCrop:true,
|
||||
src:file.url
|
||||
})
|
||||
|
||||
|
||||
},
|
||||
editNameModal() {
|
||||
let THIS = this;
|
||||
wx.showModal({
|
||||
title: '请输入姓名',
|
||||
editable: true,
|
||||
confirmColor: "#3CC7C0",
|
||||
success(res) {
|
||||
if (res.confirm) {
|
||||
if (!/^[\u4E00-\u9FA5A-Za-z0-9_]{2,10}$/.test(res.content)) {
|
||||
wx.showToast({
|
||||
title: `姓名要求在2-10个字符`,
|
||||
icon: 'none',
|
||||
});
|
||||
return false;
|
||||
};
|
||||
THIS.editNameHandle(res.content);
|
||||
|
||||
} else if (res.cancel) {
|
||||
console.log('用户点击取消')
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
handleThrottle:throttle(function(){
|
||||
this.handleLogout()
|
||||
}),
|
||||
goNotify:throttle(function(){
|
||||
app.method.navigateTo({
|
||||
url: '/patient/pages/notify/notify',
|
||||
})
|
||||
}),
|
||||
handleLogout() {
|
||||
if(!this.data.isLock){
|
||||
if(wx.$TUIKit){
|
||||
wx.$TUIKit.destroy()
|
||||
};
|
||||
this.setData({
|
||||
isLock:true
|
||||
})
|
||||
loginout().then(data => {
|
||||
this.setData({
|
||||
isLock:false
|
||||
})
|
||||
wx.showToast({
|
||||
title: `退出成功`,
|
||||
icon: 'none',
|
||||
});
|
||||
app.globalData.totalUnread=0;
|
||||
app.globalData.conversationList=[];
|
||||
wx.clearStorageSync();
|
||||
wx.setStorageSync('hasEntry', true);
|
||||
wx.reLaunch({
|
||||
url: '/patient/pages/login/login'
|
||||
})
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
editNameHandle(user_name) {
|
||||
editName({
|
||||
user_name
|
||||
}).then(data => {
|
||||
this.setData({
|
||||
'user_info.user_name': user_name
|
||||
})
|
||||
wx.showToast({
|
||||
title: `姓名修改成功`,
|
||||
icon: 'none',
|
||||
});
|
||||
})
|
||||
},
|
||||
getInfoDetail() {
|
||||
getInfo().then((data) => {
|
||||
this.setData({
|
||||
user_info: data
|
||||
})
|
||||
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad(options) {
|
||||
this.getInfoDetail();
|
||||
this.initCrop(options);
|
||||
},
|
||||
closeCrop(){
|
||||
this.setData({
|
||||
showCrop:false
|
||||
})
|
||||
},
|
||||
submit() {
|
||||
this.setData({
|
||||
showCrop:false
|
||||
})
|
||||
this.cropper.getImg((obj) => {
|
||||
this.upload(obj)
|
||||
});
|
||||
},
|
||||
cropperload(e) {
|
||||
console.log('cropper加载完成');
|
||||
},
|
||||
initCrop(options){
|
||||
|
||||
this.cropper = this.selectComponent("#image-cropper");
|
||||
|
||||
|
||||
|
||||
if(options.imgSrc){
|
||||
this.setData({
|
||||
src: options.imgSrc
|
||||
});
|
||||
}
|
||||
|
||||
// if(!options.imgSrc){
|
||||
// this.cropper.upload(); //上传图片
|
||||
// }
|
||||
},
|
||||
loadimage(e) {
|
||||
|
||||
this.cropper.imgReset();
|
||||
},
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow() {
|
||||
this.setData({
|
||||
img_host:app.hostConfig().imghost
|
||||
})
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom() {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
|
||||
})
|
||||
@@ -0,0 +1,10 @@
|
||||
{
|
||||
"usingComponents": {
|
||||
"van-uploader": "@vant/weapp/uploader/index",
|
||||
"nav":"../../../components/nav/nav",
|
||||
"image-cropper": "../../../components/image-cropper/image-cropper",
|
||||
"van-overlay": "@vant/weapp/overlay/index"
|
||||
},
|
||||
"navigationStyle":"custom",
|
||||
"navigationBarTitleText": "肝胆相照互联网医院"
|
||||
}
|
||||
@@ -0,0 +1,53 @@
|
||||
<!--pages/personCenter/personCenter.wxml-->
|
||||
<nav navName="个人中心"></nav>
|
||||
<view class="page">
|
||||
<view class="cellbox">
|
||||
<view class="cell">
|
||||
<view class="left">头像</view>
|
||||
<view class="right" style="flex:1;">
|
||||
<view class="box">
|
||||
<van-uploader file-list="{{ fileList }}" bind:after-read="afterRead" class="upload" max-count="1" preview-image="false"></van-uploader>
|
||||
<view class="imgview">
|
||||
<image src="{{user_info.avatar}}" class="headicon" wx:if="{{user_info.avatar}}"></image>
|
||||
<image src="{{img_host+'/patient_avatar.png'}}" class="headicon" wx:else></image>
|
||||
</view>
|
||||
<image src="{{img_host+'/righticon.png'}}" class="righticon"></image>
|
||||
</view>
|
||||
|
||||
|
||||
</view>
|
||||
</view>
|
||||
<view class="cell">
|
||||
<view class="left">用户名</view>
|
||||
<view class="right" bindtap="editNameModal">
|
||||
<view class="imgview">
|
||||
{{user_info.user_name}}
|
||||
</view>
|
||||
<image src="{{img_host+'/edit.png'}}" class="edit"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="cell">
|
||||
<view class="left">消息通知</view>
|
||||
<view class="right" bindtap="goNotify">
|
||||
<image src="{{img_host+'/righticon.png'}}" class="righticon"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="cell">
|
||||
<view class="left">绑定手机号</view>
|
||||
<view class="right">
|
||||
{{user_info.mobile}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="logout" bindtap="handleThrottle">
|
||||
退出当前账号
|
||||
</view>
|
||||
</view>
|
||||
<van-overlay show="{{showCrop}}" >
|
||||
<image-cropper id="image-cropper" bindload="cropperload" bindimageload="loadimage" bindtapcut="clickcut" limit_move="{{limit_move}}" disable_rotate="{{disable_rotate}}" width="{{width}}" height="{{height}}" imgSrc="{{src}}" angle="{{angle}}" disable_width="{{disable_width}}" max_width="{{max_width}}" max_height="{{max_height}}" disable_height="{{disable_height}}" disable_ratio="{{disable_ratio}}"></image-cropper>
|
||||
<view class="buttonbox">
|
||||
<button bindtap='closeCrop' type="default" class="button" size="mini">返回</button>
|
||||
<button bindtap='submit' type="primary" class="button" size="mini">确定</button>
|
||||
</view>
|
||||
</van-overlay>
|
||||
@@ -0,0 +1,103 @@
|
||||
/* pages/personCenter/personCenter.wxss */
|
||||
.page{
|
||||
position: relative;
|
||||
width: 100vw;
|
||||
height:100vh;
|
||||
overflow: scroll;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
background: #F2F2F2;
|
||||
}
|
||||
.cellbox{
|
||||
margin-top: 172rpx;
|
||||
}
|
||||
.buttonbox{
|
||||
position: absolute;
|
||||
z-index:99;
|
||||
display: flex;
|
||||
width:600rpx;
|
||||
left:50%;
|
||||
transform: translateX(-50%);
|
||||
justify-content: space-between;
|
||||
bottom:50rpx;
|
||||
}
|
||||
|
||||
.cell{
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
width:100%;
|
||||
background-color: #fff;
|
||||
height: 112rpx;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
border-bottom: 1rpx solid#F2F2F2;
|
||||
}
|
||||
.righticon {
|
||||
width: 24rpx;
|
||||
height: 48rpx;
|
||||
|
||||
}
|
||||
.left{
|
||||
margin-left: 32rpx;
|
||||
}
|
||||
.imgview{
|
||||
margin-right: 20rpx;
|
||||
color: #666666;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
.headicon{
|
||||
width:80rpx;
|
||||
height:80rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.edit{
|
||||
width:28rpx;
|
||||
height:28rpx;
|
||||
}
|
||||
.right{
|
||||
position: relative;
|
||||
flex:1;
|
||||
font-size: 28rpx;
|
||||
margin-right: 32rpx;
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
color: #666666;
|
||||
align-items: center;
|
||||
}
|
||||
.logout{
|
||||
bottom:20rpx;
|
||||
position: absolute;
|
||||
left:32rpx;
|
||||
right:32rpx;
|
||||
height: 94rpx;
|
||||
background: #3CC7C0;
|
||||
border-radius: 47rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 36rpx;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
.box{
|
||||
width:100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
.upload{
|
||||
opacity: 0;
|
||||
width:100%;
|
||||
right:0;
|
||||
position: absolute;
|
||||
|
||||
}
|
||||
.van-uploader__wrapper{
|
||||
width:100%!important;
|
||||
flex:1;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
.van-uploader__upload{
|
||||
width:100%!important;
|
||||
}
|
||||
.van-uploader{
|
||||
width:100%;
|
||||
}
|
||||
Reference in New Issue
Block a user