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.
316 lines
9.0 KiB
316 lines
9.0 KiB
<template>
|
|
<view class="navTab">
|
|
<u-form v-if="wxUserInfo" :model="infornobj" ref="infornobj" label-position='left' label-width='130' border-bottom='false' >
|
|
<u-form-item label="头像:" prop="avatar" border-bottom='false' required='true' >
|
|
<u-upload ref="upload" width='100px' height='100px'
|
|
:action="action"
|
|
:header="headers"
|
|
:auto-upload="true"
|
|
:show-progress="false"
|
|
max-count="1"
|
|
:deletable="true"
|
|
:file-list="infornobj.avatar"
|
|
@on-success="(data,index,lists) => {fielUploadSuc(data,index,lists) }"
|
|
@on-remove="(index, lists, name)=>{deleteUpfile(index)}"
|
|
@on-error="(data,index, lists)=>{errorUpfile(data,index, lists)}"
|
|
>
|
|
<view slot="addBtn" class="slot-btn" >
|
|
<img v-if="infornobj.avatar" :src="infornobj.avatar" mode="aspectFill" style="width: 100px;height: 100px;">
|
|
<div v-else class="upliacla">
|
|
<p style="font-size: 18px;">+</p>
|
|
<p>选择图片</p>
|
|
<!-- <u-icon name="arrow-upward" color="#606266" size="38"></u-icon> -->
|
|
</div>
|
|
</view>
|
|
</u-upload>
|
|
</u-form-item>
|
|
<u-form-item label="昵称:" prop="nickName" border-bottom='false' required='true'>
|
|
<view class="sinput">
|
|
<u-input style="width:100%;" :disabled='istest' v-model="infornobj.nickName" placeholder='输入昵称'/>
|
|
</view>
|
|
</u-form-item>
|
|
<u-form-item label="性别:" prop="sex" border-bottom='false' required='true'>
|
|
<view class="sinput">
|
|
<u-input style="width:100%;" v-model="infornobj.sex" type="select" @click="sexshow = true" placeholder='请选择' />
|
|
<u-select v-model="sexshow" :list="sexList" @confirm="sexchange"></u-select>
|
|
</view>
|
|
</u-form-item>
|
|
<u-form-item label="邮箱:" prop="email" border-bottom='false' required='true'>
|
|
<view class="sinput">
|
|
<!-- <input type="text" style="width:100%;" v-model="infornobj.email"/> @input='xgemial'-->
|
|
<u-input style="width:100%;" :disabled='istest' v-model="infornobj.email" placeholder='输入邮箱'/>
|
|
</view>
|
|
</u-form-item>
|
|
<u-form-item label="手机号:" prop="phonenumber" border-bottom='false' required='true'>
|
|
<view class="sinput">
|
|
<u-input style="width:100%;" disabled v-model="infornobj.phonenumber" placeholder='输入手机号'/>
|
|
</view>
|
|
</u-form-item>
|
|
</u-form>
|
|
<view class="button-g" @click="resource">保存</view>
|
|
<u-toast ref="uToast" />
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
sexshow:false,
|
|
wxUserInfo:null,
|
|
isPopupShow:false,
|
|
istest:false,
|
|
infornobj:{avatar:'',nickName:'',phonenumber:'',email:'',sex:''},
|
|
sexList:[{value:'0',label:'男'},{value:'1',label:'女'},],
|
|
// action: 'https://www.keyitest.cn/prod-api/upload',
|
|
action: this.http.baseUrl + '/upload',
|
|
headers:{
|
|
// 'TENANT-ID': 3, 'accept': '*/*',
|
|
// 'Connection': 'keep-alive','Content-Type': 'multipart/form-data; boundary=----WebKitFormBoundaryDX4wOxgD9mzUzAIF',
|
|
// 'Origin': 'https://www.keyitest.cn', 'Accept-Encoding': 'gzip, deflate, br',
|
|
// 'Accept-Language': 'zh,zh-CN;q=0.9', 'Host': 'https://www.keyitest.cn',
|
|
// 'Referer':'https://www.keyitest.cn',
|
|
Authorization:'Bearer '+uni.getStorageSync('accessToken'),
|
|
|
|
},
|
|
Rules: {
|
|
nickName: [{ required: true, message: '请输入姓名', trigger: 'change',}],
|
|
email: [{ required: true, message: '请输入邮箱', trigger: 'change',},
|
|
{
|
|
pattern:
|
|
/^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/,
|
|
message: "邮箱格式不对",
|
|
trigger: "blur",
|
|
},],
|
|
//
|
|
sex: [{ required: true, message: '请选择性别', trigger: 'change',}],
|
|
},
|
|
}
|
|
},
|
|
onReady(){
|
|
this.$refs.infornobj.setRules(this.Rules);
|
|
},
|
|
onShow() {
|
|
|
|
},
|
|
mounted() {
|
|
this.infornobj.avatar=this.wxUserInfo.avatar
|
|
},
|
|
onLoad() {
|
|
this.wxUserInfo=uni.getStorageSync('wxUserInfo');
|
|
let avatar=uni.getStorageSync('avatar');
|
|
let email=uni.getStorageSync('email');
|
|
let nickName=uni.getStorageSync('nickName');
|
|
let sex=uni.getStorageSync('sex');
|
|
console.log('wxUserInfo',this.wxUserInfo,)
|
|
let {phonenumber}=this.wxUserInfo;
|
|
let setavatar='',sexdata='';
|
|
if(avatar){
|
|
// if(avatar.indexOf('http')==0){
|
|
// setavatar = avatar
|
|
// }else{
|
|
// setavatar=this.http.baseUrl+avatar
|
|
// }
|
|
setavatar = this.http.baseUrl + avatar
|
|
}else{
|
|
setavatar=''
|
|
}
|
|
if(sex){
|
|
sexdata=this.sexList.filter(item=>item.value==sex)[0].label;
|
|
}
|
|
console.log('sex--',this.infornobj.sex)
|
|
console.log('头像',setavatar,this.wxUserInfo)
|
|
this.$nextTick(()=>{
|
|
let setphone=phonenumber.slice(0,3)+'****'+phonenumber.slice(7,11)
|
|
this.infornobj={nickName,sex:sexdata,phonenumber:setphone,avatar:setavatar,email:email?email:''}
|
|
console.log('avatar',this.wxUserInfo,this.infornobj)
|
|
})
|
|
},
|
|
methods: {
|
|
sexchange(e){
|
|
this.infornobj.sex=e[0].label
|
|
},
|
|
//文件上传成功回调
|
|
fielUploadSuc(data,index,lists) {
|
|
console.log('-',data,'*',index,lists)
|
|
if (data.code === 200) {
|
|
this.infornobj.avatar=data.filePath
|
|
// console.log('头像',this.infornobj.avatar)
|
|
}
|
|
},
|
|
//移除
|
|
deleteUpfile(index,lists){
|
|
console.log('del头像',this.infornobj.avatar)
|
|
this.infornobj.avatar=''
|
|
// if(this.credentialImgList.length>0){
|
|
// let id=this.credentialImgList[0].id;
|
|
// this.http.quickDelete(`/equestrianinfo/file/${id}`).then(()=>{})
|
|
// }
|
|
},
|
|
errorUpfile(data,index){
|
|
// console.log('上传失败-',data,'*',index)
|
|
// this.$refs.uToast.show({
|
|
// title: '上传失败,请您重新上传',
|
|
// type: 'error',
|
|
// })
|
|
},
|
|
open() {
|
|
// console.log('open');
|
|
},
|
|
close() {
|
|
this.isPopupShow = false
|
|
},
|
|
editinform(){
|
|
this.isPopupShow = true
|
|
},
|
|
xgemial(e){
|
|
console.log('xgemial===',e,'===xgemial',this.infornobj.avatar);
|
|
this.infornobj.avatar=this.infornobj.avatar.slice(0,1)
|
|
},
|
|
resource(){
|
|
console.log('this.infornobj---',this.infornobj)
|
|
this.$refs.infornobj.validate(valid => {
|
|
if (valid) {
|
|
if(!this.infornobj.avatar){
|
|
this.$refs.uToast.show({
|
|
title: '请上传头像',
|
|
type: 'warning',
|
|
})
|
|
return;
|
|
}
|
|
let avatar='',avtimg=this.infornobj.avatar;
|
|
if(avtimg&&avtimg.indexOf('h')==0){
|
|
avatar=avtimg
|
|
}else{
|
|
avatar=this.http.baseUrl+avtimg
|
|
}
|
|
let sexindex=this.sexList.filter(item=>item.label==this.infornobj.sex)[0].value;
|
|
|
|
let data={
|
|
userId:this.wxUserInfo.userId,
|
|
nickName:this.infornobj.nickName,
|
|
email:this.infornobj.email,
|
|
sex:sexindex,
|
|
avatar,
|
|
}
|
|
console.log('data---',data)
|
|
// return;
|
|
this.http.quickPut(`/system/user/profile`,data,true).then(res=>{
|
|
if(res.data.code==200){
|
|
uni.setStorageSync('avatar', data.avatar)
|
|
uni.setStorageSync('email', data.email)
|
|
uni.setStorageSync('nickName', data.nickName)
|
|
uni.setStorageSync('sex', data.sex)
|
|
this.$refs.uToast.show({
|
|
title: '信息修改成功',
|
|
type: 'success',
|
|
isTab:true,
|
|
url:'pages/personal/personal'
|
|
})
|
|
} else {
|
|
this.$refs.uToast.show({
|
|
title: res.data.msg,
|
|
type: 'eroor',
|
|
})
|
|
}
|
|
// console.log('res---',res)
|
|
})
|
|
}else{
|
|
console.log('验证失败',this.infornobj)
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
.navTab{
|
|
background-color: #ffffff;
|
|
/* height: 96vh; */
|
|
width: 96vw;
|
|
margin: 2vh auto;
|
|
padding: 10px 15px 30px 25px;
|
|
border-radius: 5px;
|
|
}
|
|
.sinput{
|
|
display: flex;
|
|
align-items: center;
|
|
/* height: 50px; */
|
|
}
|
|
.u-form-left__content__label{
|
|
color:#808080!important;
|
|
}
|
|
.sinput .u-input{
|
|
height:35px;
|
|
border-bottom: 1px solid #EBEBEB!important;
|
|
}
|
|
.slot-btn{
|
|
width:200rpx;
|
|
height:0rpx;
|
|
zIndex:99;
|
|
/* display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
background: rgb(244, 245, 246);
|
|
border-radius: 10rpx; */
|
|
}
|
|
|
|
.slot-btn__hover {
|
|
background-color: rgb(235, 236, 238);
|
|
}
|
|
.infoencls{
|
|
display: flex;
|
|
justify-content: space-between;
|
|
font-size: 15px;
|
|
border-bottom: 1px solid #EBEBEB;
|
|
height:43px;
|
|
align-items: center;
|
|
}
|
|
.peodi{
|
|
margin:-5px auto 15px;
|
|
width: 260px;
|
|
text-align: center;
|
|
color: #1A1A1A;
|
|
font-size:36rpx;
|
|
font-weight: bold;
|
|
}
|
|
.button-g{
|
|
/* width:90vw; */
|
|
background:#1578ED;
|
|
border: 1px solid #1578ED;
|
|
color: #FFFFFF;
|
|
height: 80rpx;
|
|
border-radius:15rpx;
|
|
text-align: center;
|
|
line-height:80rpx;
|
|
font-size: 35rpx;
|
|
margin-top: 30px;
|
|
/* position: fixed; */
|
|
/* bottom:25px; */
|
|
}
|
|
.picput{
|
|
margin:50px auto;
|
|
width:65vw;
|
|
text-align: center;
|
|
}
|
|
.u-list-item{
|
|
margin: 0 !important;
|
|
background: transparent!important;
|
|
color:transparent!important;
|
|
}
|
|
|
|
.upliacla{
|
|
width: 100px;
|
|
height: 100px;
|
|
/* line-height:100px; */
|
|
border-radius: 4px;
|
|
background: #f4f5f6;
|
|
color:#606266;
|
|
display:flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
|
|
}
|
|
</style>
|
|
|