356 lines
		
	
	
		
			8.7 KiB
		
	
	
	
		
			Vue
		
	
	
	
			
		
		
	
	
			356 lines
		
	
	
		
			8.7 KiB
		
	
	
	
		
			Vue
		
	
	
	
| <!--
 | |
|  * @Descripttion: 
 | |
|  * @version: 
 | |
|  * @Author: 王三华
 | |
|  * @Date: 2023-05-18 14:42:53
 | |
| -->
 | |
| <template>
 | |
|   <view class="main">
 | |
| 	  <view class="content">
 | |
| 		  <view class="index-view tops" @click="updateImg">
 | |
| 			  <view class="user-name">{{'头像'}}</view>
 | |
| 			   <view class="user-right rights">
 | |
| 					<view class="avatar">
 | |
| 						<image :src="userInfo.headPath"/>
 | |
| 					</view>
 | |
| 					<view class="right-icon">
 | |
| 						<image src="../../static/images/right.png"/>
 | |
| 					</view>
 | |
| 			   </view>
 | |
| 		  </view>
 | |
| 		  <view class="index-view">
 | |
| 				  <view class="user-name">{{'昵称'}}</view>
 | |
| 				   <view class="user-right rights" @click="downShow=true">
 | |
|             <!-- {{ userInfo.nickName1 }} -->
 | |
| 						<!-- <view >
 | |
| 							 <u-input class="border-s"  :maxlength="40" v-model="userInfo.nickName" />
 | |
| 						</view> -->
 | |
|             <view class="nana">{{ userInfo.nickName }}</view>
 | |
| 						<view class="right-icon">
 | |
| 							<image src="../../static/images/right.png"/>
 | |
| 						</view>
 | |
| 				   </view>
 | |
| 		  </view>
 | |
| 	  </view>
 | |
| 	  <view class="content">
 | |
| 				<view class="index-view tops">
 | |
| 					<view class="user-name">{{'真实姓名'}}</view>
 | |
| 						<view class="user-right">
 | |
| 							{{userInfo.memberName}}
 | |
| 						</view>
 | |
| 				</view>
 | |
| 				<view class="index-view">
 | |
| 						<view class="user-name">{{'会员编号'}}</view>
 | |
| 							<view class="user-right">
 | |
| 								{{userInfo.memberCode}}
 | |
| 							</view>
 | |
| 				</view>
 | |
| 			  <view class="index-view">
 | |
| 				  <view class="user-name">
 | |
|             {{'联系方式'}}</view>
 | |
| 				   <view class="user-right">
 | |
| 							{{userInfo.phone}}
 | |
| 				   </view>
 | |
| 			  </view>
 | |
| 			  <view class="index-view">
 | |
| 				  <view class="user-name">{{'证件号码'}}</view>
 | |
| 				   <view class="user-right">
 | |
| 							{{userInfo.idCardAuth}}
 | |
| 				   </view>
 | |
| 			  </view>
 | |
| 	  </view>
 | |
| 	  <view class="content" style="border-bottom: none;">
 | |
| 				<!-- <view class="index-view tops">
 | |
| 					<view class="user-name">{{'自然国家'}}</view>
 | |
| 						<view class="user-right">
 | |
| 							{{userInfo.countryName}}
 | |
| 						</view>
 | |
| 				</view>
 | |
| 				<view class="index-view">
 | |
| 						<view class="user-name">{{'结算国家'}}</view>
 | |
| 							<view class="user-right">
 | |
| 								{{userInfo.settleCountryName}}
 | |
| 							</view>
 | |
| 				</view> -->
 | |
| 			  <view class="index-view">
 | |
| 				  <view class="user-name">{{'注册等级'}}</view>
 | |
| 				   <view class="user-right">
 | |
| 							{{userInfo.registerGradeVal}}
 | |
| 				   </view>
 | |
| 			  </view>
 | |
| 			  <view class="index-view">
 | |
| 				  <view class="user-name">{{'结算等级'}}</view>
 | |
| 				   <view class="user-right">
 | |
| 							{{userInfo.settleGradeVal}}
 | |
| 				   </view>
 | |
| 			  </view>
 | |
| 			  <!-- <view class="index-view">
 | |
| 					  <view class="user-name">{{'代理等级'}}</view>
 | |
| 					   <view class="user-right">
 | |
| 								{{userInfo.agentGrade}}
 | |
| 					   </view>
 | |
| 			  </view> -->
 | |
| 			  <view class="index-view">
 | |
| 					<view class="user-name">{{'真实奖衔'}}</view>
 | |
| 						<view class="user-right">
 | |
| 							{{userInfo.awardsVal}}
 | |
| 						</view>
 | |
| 			  	</view>
 | |
| 			  <view class="index-view">
 | |
| 					  <view class="user-name">荣誉奖衔</view>
 | |
| 					   <view class="user-right">
 | |
| 								{{userInfo.maxAwardsVal}}
 | |
| 					   </view>
 | |
| 			  </view>
 | |
| 			  <view class="index-view none">
 | |
| 					  <view class="user-name">{{'创建日期'}}</view>
 | |
| 					   <view class="user-right">
 | |
| 								{{userInfo.payTime}}
 | |
| 					   </view>
 | |
| 			  </view>
 | |
| 			  <view class="index-view none">
 | |
| 				  <view class="user-name">{{'注册业绩'}}</view>
 | |
| 				   <view class="user-right">
 | |
| 							{{userInfo.consumeAchieve|toThousandthAndKeepDecimal}}
 | |
| 				   </view>
 | |
| 			  </view>
 | |
| 				  <view class="index-view none">
 | |
| 				  <view class="user-name">{{'会员权益'}}</view>
 | |
| 				   <view class="user-right">
 | |
| 							{{userInfo.registerAuthorityVal}}
 | |
| 				   </view>
 | |
| 			</view>
 | |
| 			  <view class="index-view none">
 | |
| 				  <view class="user-name">{{'支付时间'}}</view>
 | |
| 				   <view class="user-right">
 | |
| 							{{userInfo.payTime}}
 | |
| 				   </view>
 | |
| 			  </view>
 | |
| 			  <view class="index-view none" v-if="userInfo.pkCountry == 1&&userData.expireDate">
 | |
| 				  <view class="user-name">有效期</view>
 | |
| 				   <view class="user-right">
 | |
| 							{{userData.expireDate}}
 | |
| 				   </view>
 | |
| 			  </view>
 | |
| 			  <view class="index-view none" v-if="userInfo.serviceCode">
 | |
| 				  <view class="user-name">{{'服务编号'}}</view>
 | |
| 				   <view class="user-right">
 | |
| 							{{userData.serviceCode}}
 | |
| 				   </view>
 | |
| 			  </view>
 | |
| 	  </view>
 | |
| 	  <!-- <u-button type="success"
 | |
| 	            shape="circle"
 | |
| 	            class="btn"
 | |
| 				@click="submit"
 | |
| 	        >{{'保存'}}</u-button>
 | |
| 			<view style="height: 20rpx;"></view> -->
 | |
|       <u-popup 
 | |
| 				:show="downShow"
 | |
| 				mode="bottom"
 | |
| 				closeOnClickOverlay
 | |
| 				closeable
 | |
| 				round="10"
 | |
| 				@close="close"
 | |
| 			>
 | |
| 				<view class="title">修改昵称</view>
 | |
| 				<view class="kung">
 | |
| 					<u--input
 | |
| 						:maxlength="40"
 | |
| 						placeholder="请输入昵称"
 | |
| 						v-model="userInfo.nickName"
 | |
| 					>
 | |
| 					</u--input>
 | |
| 				</view>
 | |
| 				<u-button :disabled="!userInfo.nickName" class="btn" @click="submit" type="error" text="确 定"></u-button>
 | |
|     </u-popup>
 | |
|   </view>
 | |
| </template>
 | |
| 
 | |
| <script>
 | |
| import * as api from '@/config/login.js'
 | |
| import { getToken, removeToken } from '@/config/auth.js'
 | |
| import { setToken } from '@/config/auth.js'
 | |
| import store from '@/store'
 | |
| export default {
 | |
|   data() {
 | |
|     return {
 | |
|       downShow:false,
 | |
| 		userInfo:{},
 | |
|     userData:'',
 | |
| 		urls:'/member/api/maker-space/update-file',
 | |
|     }
 | |
|   },
 | |
|   onLoad() {
 | |
| 	 this.getInfo()
 | |
|    this.userData = uni.getStorageSync('User')
 | |
|   },
 | |
|   methods: {
 | |
|     close() {
 | |
|       this.downShow = false
 | |
|     },
 | |
| 	  		updateImg() {
 | |
| 				const http = uni.$u.http.config.baseURL
 | |
| 				let token = getToken();
 | |
| 	  			uni.chooseImage({
 | |
| 	  				sourceType: ['album'], //从相册选择
 | |
| 	  				success: chooseImageRes => {
 | |
| 	  					const tempFilePaths = chooseImageRes.tempFilePaths;
 | |
| 	  					uni.uploadFile({
 | |
| 	  						url: http+'/member/api/member/update-head', //仅为示例,非真实的接口地址
 | |
| 	  						filePath: tempFilePaths[0],
 | |
| 	  						name: 'file',
 | |
| 	  						header: {
 | |
| 	  							Authorization:token
 | |
| 	  						},
 | |
| 	  						success: res => {
 | |
| 								console.error(res)
 | |
| 	  							// 成功:获取到头像
 | |
| 	  							if (res.statusCode == 200) {
 | |
| 									let data = JSON.parse(res.data)
 | |
| 	  								this.userInfo.headPath = data.data.url
 | |
| 	  							}
 | |
| 	  						}
 | |
| 	  					});
 | |
| 	  				},
 | |
| 	  				fail: err => {
 | |
| 	  					uni.$u.toast('上传失败', 'none');
 | |
| 	  				}
 | |
| 	  			});
 | |
| 	  		},
 | |
| 	  submit() {
 | |
| 			api.updateData({
 | |
| 				nickName: this.userInfo.nickName,
 | |
| 			}).then((res)=>{
 | |
| 				uni.showToast({
 | |
| 					title: res.msg,
 | |
| 					icon:	 'none',
 | |
| 					duration: 1500,
 | |
| 				})
 | |
| 				this.getInfo()
 | |
| 				this.close()
 | |
| 			}) 
 | |
| 	  },
 | |
| 	  // upload() {
 | |
| 		 //  let that = this
 | |
| 			// 	uni.chooseImage({
 | |
| 			// 		count: 1, //默认9
 | |
| 			// 		sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有
 | |
| 			// 		sourceType: ['album'], //从相册选择
 | |
| 			// 		success: function (res) {
 | |
| 			// 			  let FormDatas = new FormData();
 | |
| 				
 | |
| 			// 			  FormDatas.append("file", res.tempFilePaths[0]);
 | |
| 			// 				api.updateFile(FormDatas).then((res)=>{
 | |
| 			// 					console.error(res)
 | |
| 			// 				})
 | |
| 			// 		}
 | |
| 			// 	});
 | |
| 	  // },
 | |
| 	  getInfo(){
 | |
| 		 api.getData().then(res => {
 | |
| 		        if (res) {
 | |
| 		         this.userInfo = res.data
 | |
|              if(this.userInfo.nickName.length > 20){
 | |
|               this.userInfo.nickName1 = this.userInfo.nickName.substring(0,20)+'...'
 | |
|             }
 | |
| 		        }
 | |
| 		      }).catch(error => {
 | |
| 		        reject(error)
 | |
| 		      })  
 | |
| 		  // api.getInfo().then(res => {
 | |
| 				//  if (res) {
 | |
| 				//   this.userInfo = res.data
 | |
| 				//  }
 | |
| 			 //   }).catch(error => {
 | |
| 				//  reject(error)
 | |
| 			 //   }) 
 | |
| 			 //   console.error(this.userInfo)
 | |
| 	  },
 | |
|   },
 | |
| }
 | |
| </script>
 | |
| 
 | |
| <style lang="scss" scoped>
 | |
| .kung{
 | |
|   padding: 20rpx 20rpx
 | |
| }
 | |
| .title {
 | |
|   font-size: 40rpx;
 | |
|   text-align: center;
 | |
|   margin: 20rpx auto;
 | |
|   color: #333;
 | |
|   font-weight: bold;
 | |
| }
 | |
| 	.border-s{
 | |
| 		border: none;
 | |
| 		position: absolute;
 | |
| 		right: 0;
 | |
| 		width: 120rpx;
 | |
| 		height: 85rpx;
 | |
| 		margin-right: 20rpx;
 | |
| 	}
 | |
| 	page{
 | |
| 		background-color: #F2F2F2;
 | |
| 	}
 | |
| 	.none{
 | |
| 		border-bottom: none;
 | |
| 	}
 | |
| 	.tops{
 | |
| 		border-top: 1rpx solid #eee;
 | |
| 	}
 | |
| 	.content{
 | |
| 		border-bottom: 20rpx solid #F2F2F2;
 | |
| 		background-color: #fff;
 | |
| 		
 | |
| 	}
 | |
| 	.index-view{
 | |
| 		height: 110rpx;
 | |
| 		margin: 0 30rpx 0 30rpx;
 | |
| 		padding: 0 10rpx;
 | |
| 		line-height: 110rpx;
 | |
| 		border-bottom: 1rpx solid #EEEEEE;
 | |
| 		display: flex;
 | |
| 		justify-content: space-between;
 | |
| 		position: relative;
 | |
| 		color: #333;
 | |
| 	}
 | |
| 	.user-right{
 | |
| 		color: #999;
 | |
| 		font-size: 28rpx;
 | |
| 		display: flex;
 | |
|     align-items: center;
 | |
| 	}
 | |
| 	.rights{
 | |
| 		margin-right: 45rpx;
 | |
| 	}
 | |
|   .nana{
 | |
|     flex: 1;
 | |
|   }
 | |
| 	.right-icon{
 | |
| 		position: absolute;
 | |
| 		top:12rpx;
 | |
| 		right: 0;
 | |
| 		image{
 | |
| 			width: 40rpx;
 | |
| 			height:40rpx;
 | |
| 		}
 | |
| 	}
 | |
| 	.avatar{
 | |
| 		margin-top: 10rpx;
 | |
| 		image{
 | |
| 			width: 89rpx;
 | |
| 			height: 89rpx;
 | |
| 			border-radius: 50%;
 | |
| 		}
 | |
| 	}
 | |
| 	.btn{
 | |
| 		background-color: #FB3024;
 | |
| 		border: none;
 | |
| 		height: 92rpx;
 | |
| 		line-height: 92rpx;
 | |
| 		font-size:30rpx;
 | |
| 		margin: 40rpx auto;
 | |
| 		width: 690rpx;
 | |
| 	}
 | |
| </style> |