370 lines
		
	
	
		
			9.3 KiB
		
	
	
	
		
			Vue
		
	
	
	
			
		
		
	
	
			370 lines
		
	
	
		
			9.3 KiB
		
	
	
	
		
			Vue
		
	
	
	
| <template>
 | |
|   <view class="main">
 | |
|     <view class="content">
 | |
|       <view class="index-view tops" @click="updateImg">
 | |
|         <view class="user-name">{{ '头像' }}</view>
 | |
|         <view
 | |
|           class="user-right rights"
 | |
|           style="display: flex; align-items: center"
 | |
|         >
 | |
|           <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.pkGradeVal }}
 | |
|         </view>
 | |
|       </view>
 | |
|       <view class="index-view">
 | |
|         <view class="user-name">荣誉奖衔</view>
 | |
|         <view class="user-right">
 | |
|           {{ userInfo.pkMaxAwardsVal || userInfo.pkAwardsVal }}
 | |
|         </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.pkAwardsVal }}
 | |
|         </view>
 | |
|       </view>
 | |
|       <view class="index-view none">
 | |
|         <view class="user-name">{{ '创建日期' }}</view>
 | |
|         <view class="user-right">
 | |
|           {{ userInfo.creationTime }}
 | |
|         </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
 | |
|         .getInfo()
 | |
|         .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;
 | |
|   display: flex;
 | |
|   align-items: center;
 | |
|   justify-content: center;
 | |
|   image {
 | |
|     width: 89rpx;
 | |
|     height: 89rpx;
 | |
|     border-radius: 50%;
 | |
|   }
 | |
| }
 | |
| .btn {
 | |
|   background-color: #005bac;
 | |
|   border: none;
 | |
|   height: 92rpx;
 | |
|   line-height: 92rpx;
 | |
|   font-size: 30rpx;
 | |
|   margin: 40rpx auto;
 | |
|   width: 690rpx;
 | |
| }
 | |
| </style>
 |