428 lines
		
	
	
		
			11 KiB
		
	
	
	
		
			Vue
		
	
	
	
			
		
		
	
	
			428 lines
		
	
	
		
			11 KiB
		
	
	
	
		
			Vue
		
	
	
	
| <template>
 | |
| 	<view class="pb60">
 | |
| 		<view class="set-group" style="padding-top: 18rpx;">
 | |
| 			<view class="d-b-c set-group-item " @click="changeAvatarUrl">
 | |
| 				<view>{{$t('MY_ORD_78')}}</view>
 | |
| 				<view class="d-e-c">
 | |
| 					<view class="info-image">
 | |
| 						<image :src="userInfo.headPath || userInfo.countryCircularIcon" mode=""></image>
 | |
| 					</view>
 | |
| 					<text class="icon iconfont icon-jiantou"></text>
 | |
| 				</view>
 | |
| 			</view>
 | |
| 			<view class="d-b-c set-group-item">
 | |
| 				<view>{{$t('PER_DA_2')}}</view>
 | |
| 				<view class="d-e-c gray9" @click="changeName('nickName')">
 | |
| 					<text class="">{{ userData.nickName }}</text>
 | |
| 					<text class="icon iconfont icon-jiantou"></text>
 | |
| 				</view>
 | |
| 			</view>
 | |
| 		</view>
 | |
| 		<view class="set-group" style="padding-top: 10rpx;">
 | |
| 			<view class="d-b-c set-group-item ">
 | |
| 				<view>{{$t('MY_WAL_33')}}</view>
 | |
| 				<view class="d-e-c gray9">
 | |
| 					<text class="">{{ userData.memberName }}</text>
 | |
| 					<text class="icon iconfont icon-jiantou hide"></text>
 | |
| 				</view>
 | |
| 			</view>
 | |
| 			<view class="d-b-c set-group-item">
 | |
| 				<view>{{$t('MN_T_1')}}</view>
 | |
| 				<view class="d-e-c gray9">
 | |
| 					<text class="">{{ userData.memberCode }}</text>
 | |
| 					<text class="icon iconfont icon-jiantou hide"></text>
 | |
| 				</view>
 | |
| 			</view>
 | |
| 			<view class="d-b-c set-group-item">
 | |
| 				<view>{{$t('w_0052')}}</view>
 | |
| 				<view class="d-e-c gray9">
 | |
| 					<text class="">{{ userData.phone }}</text>
 | |
| 					<text class="icon iconfont icon-jiantou hide"></text>
 | |
| 				</view>
 | |
| 			</view>
 | |
| 			<view class="d-b-c set-group-item">
 | |
| 				<view>{{$t('MY_WAL_36')}}</view>
 | |
| 				<view class="d-e-c gray9">
 | |
| 					<text class="">{{ userData.idCardAuth || '--' }}</text>
 | |
| 					<text class="icon iconfont icon-jiantou hide"></text>
 | |
| 				</view>
 | |
| 			</view>
 | |
| 		</view>
 | |
| 		<view class="set-group" style="padding-top: 10rpx;margin-bottom: 40rpx;">
 | |
| 			<view class="d-b-c set-group-item ">
 | |
| 				<view>{{$t('PER_DA_3')}}</view>
 | |
| 				<view class="d-e-c gray9">
 | |
| 					<text class="">{{ userData.countryName }}</text>
 | |
| 					<text class="icon iconfont icon-jiantou hide"></text>
 | |
| 				</view>
 | |
| 			</view>
 | |
| 			<view class="d-b-c set-group-item">
 | |
| 				<view>{{$t('PER_DA_4')}}</view>
 | |
| 				<view class="d-e-c gray9">
 | |
| 					<text class="">{{ userData.settleCountryName }}</text>
 | |
| 					<text class="icon iconfont icon-jiantou hide"></text>
 | |
| 				</view>
 | |
| 			</view>
 | |
| 			<view class="d-b-c set-group-item">
 | |
| 				<view>{{$t('PER_DA_5')}}</view>
 | |
| 				<view class="d-e-c gray9">
 | |
| 					<text class="">{{ userData.registerGradeVal }}</text>
 | |
| 					<text class="icon iconfont icon-jiantou hide"></text>
 | |
| 				</view>
 | |
| 			</view>
 | |
| 			<view class="d-b-c set-group-item">
 | |
| 				<view>{{$t('CK_KS_15')}}</view>
 | |
| 				<view class="d-e-c gray9">
 | |
| 					<text class="">{{ userData.settleGradeVal }}</text>
 | |
| 					<text class="icon iconfont icon-jiantou hide"></text>
 | |
| 				</view>
 | |
| 			</view>
 | |
| 			<view class="d-b-c set-group-item">
 | |
| 				<view>{{$t('PER_DA_7')}}</view>
 | |
| 				<view class="d-e-c gray9">
 | |
| 					<text class="">{{ userData.agentGradeVal || '--' }}</text>
 | |
| 					<text class="icon iconfont icon-jiantou hide"></text>
 | |
| 				</view>
 | |
| 			</view>
 | |
| 			<view class="d-b-c set-group-item">
 | |
| 				<view>{{$t('CK_KS_16')}}</view>
 | |
| 				<view class="d-e-c gray9">
 | |
| 					<text class="">{{ userData.awardsVal }}</text>
 | |
| 					<text class="icon iconfont icon-jiantou hide"></text>
 | |
| 				</view>
 | |
| 			</view>
 | |
| 			<view class="d-b-c set-group-item">
 | |
| 				<view>{{$t('PER_DA_9')}}</view>
 | |
| 				<view class="d-e-c gray9">
 | |
| 					<text class="">{{ userInfo.registerTime }}</text>
 | |
| 					<text class="icon iconfont icon-jiantou hide"></text>
 | |
| 				</view>
 | |
| 			</view>
 | |
| 			<view class="d-b-c set-group-item">
 | |
| 				<view>{{$t('MY_ORD_3')}}</view>
 | |
| 				<view class="d-e-c gray9">
 | |
| 					<text class="">{{ userData.payTime }}</text>
 | |
| 					<text class="icon iconfont icon-jiantou hide"></text>
 | |
| 				</view>
 | |
| 			</view>
 | |
| 			<view class="d-b-c set-group-item">
 | |
| 				<view>{{$t('PER_DA_11')}}</view>
 | |
| 				<view class="d-e-c gray9">
 | |
| 					<text class="">{{ userData.registerAuthorityVal || '' }}</text>
 | |
| 					<text class="icon iconfont icon-jiantou hide"></text>
 | |
| 				</view>
 | |
| 			</view>
 | |
| 			<view class="d-b-c set-group-item">
 | |
| 				<view>{{$t('PER_DA_10')}}</view>
 | |
| 				<view class="d-e-c gray9">
 | |
| 					<text class="">{{ formatNum(userData.consumeAchieve) }}</text>
 | |
| 					<text class="icon iconfont icon-jiantou hide"></text>
 | |
| 				</view>
 | |
| 			</view>
 | |
| 			<!-- #ifdef APP-PLUS -->
 | |
| 			<view class="d-b-c set-group-item" @click="deleteAccount()">
 | |
| 				<view>{{$t('w_0415')}}</view>
 | |
| 				<view class="d-e-c gray9">
 | |
| 					<text class="icon iconfont icon-jiantou"></text>
 | |
| 				</view>
 | |
| 			</view>
 | |
| 			<!-- #endif -->
 | |
| 		</view>
 | |
| 		<Popup :show="isPopup" type="bottom" :width="750" :padding="0" @hidePopup="hidePopupFunc">
 | |
| 			<form @submit="subName">
 | |
| 				<view class="d-s-s d-c p20 mpservice-wrap">
 | |
| 					<view class="tc f32 fb ww100">{{$t('ENU_CONTROL_TYPE_2')}}</view>
 | |
| 					<template
 | |
| 						v-if="type == 'mobile' || type == 'nickName' || type == 'user_name' || type == 'email' || type == 'idcard'">
 | |
| 						<view class="pop-input d-b-c">
 | |
| 							<!-- #ifdef MP-WEIXIN -->
 | |
| 							<input name="newName" :type="type == 'nickName' ? 'nickname' : 'text'" class="flex-1"
 | |
| 								:placeholder="$t('S_C_70')" :value="newName" @input="changeinput" />
 | |
| 							<!-- #endif -->
 | |
| 							<!-- #ifndef MP-WEIXIN -->
 | |
| 							<input :type="type == 'text'" name="newName" class="flex-1" :placeholder="$t('S_C_70')"
 | |
| 								:value="newName" @input="changeinput" />
 | |
| 							<!-- #endif -->
 | |
| 							<view class="icon-guanbi icon iconfont" @click="clearName"></view>
 | |
| 						</view>
 | |
| 					</template>
 | |
| 					<view class="d-a-c ww100">
 | |
| 						<button class="btn-gray-border" @click="hidePopupFunc">{{$t('ENU_P_TYPE0')}}</button>
 | |
| 						<button class="theme-btn" form-type="submit">{{$t('ENU_P_TYPE4')}}</button>
 | |
| 					</view>
 | |
| 				</view>
 | |
| 			</form>
 | |
| 		</Popup>
 | |
| 		<!-- <view class="normal-sub-btn ">保存</view> -->
 | |
| 		<!-- 上传头像 -->
 | |
| 		<Upload v-if="isUpload" :num="1" @getImgs="getImgsFunc"></Upload>
 | |
| 	</view>
 | |
| </template>
 | |
| 
 | |
| <script>
 | |
| 	import Upload from '@/components/upload/uploadOne.vue';
 | |
| 	import Popup from '@/components/uni-popup.vue';
 | |
| 	export default {
 | |
| 		components: {
 | |
| 			Upload,
 | |
| 			Popup
 | |
| 		},
 | |
| 		data() {
 | |
| 			return {
 | |
| 				userInfo: {},
 | |
| 				userData: {},
 | |
| 				isUpload: false,
 | |
| 				isPopup: false,
 | |
| 				newName: '',
 | |
| 				type: '',
 | |
| 			};
 | |
| 		},
 | |
| 		onShow() {
 | |
| 			/*获取个人中心数据*/
 | |
| 			this.getUserInfoData();
 | |
| 			this.getUserData();
 | |
| 		},
 | |
| 		methods: {
 | |
| 			/*获取数据*/
 | |
| 			// 获取用户信息
 | |
| 			getUserInfoData() {
 | |
| 				let self = this;
 | |
| 				self.loadding = true;
 | |
| 				self._get('member/api/member/get-info', {}, function(res) {
 | |
| 					if (res.code == 200) {
 | |
| 						self.userInfo = res.data;
 | |
| 					}
 | |
| 					self.loadding = false;
 | |
| 					uni.hideLoading();
 | |
| 				});
 | |
| 			},
 | |
| 			// 获取用户信息
 | |
| 			getUserData() {
 | |
| 				let self = this;
 | |
| 				self.loadding = true;
 | |
| 				self._get('member/api/member/get-data', {}, function(res) {
 | |
| 					if (res.code == 200) {
 | |
| 						self.userData = res.data;
 | |
| 					}
 | |
| 					self.loadding = false;
 | |
| 					uni.hideLoading();
 | |
| 				});
 | |
| 			},
 | |
| 			gotoBind() {
 | |
| 				this.gotoPage('/pages/user/index/index');
 | |
| 			},
 | |
| 			logout() {
 | |
| 				uni.removeStorageSync('token');
 | |
| 				uni.removeStorageSync('user_id');
 | |
| 				this.gotoPage('/pages/user/index/index');
 | |
| 			},
 | |
| 			changeName(type) {
 | |
| 				let self = this;
 | |
| 				self.type = type;
 | |
| 				self.newName = self.userData[type];
 | |
| 				self.isPopup = true;
 | |
| 			},
 | |
| 			hidePopupFunc() {
 | |
| 				this.newName = '';
 | |
| 				this.isPopup = false;
 | |
| 			},
 | |
| 			changeinput(e) {
 | |
| 				this.newName = e.target.value;
 | |
| 			},
 | |
| 			changeGender(e) {
 | |
| 				this.newName = e.detail.value;
 | |
| 			},
 | |
| 			fbindDateChange(e) {
 | |
| 				this.newName = e.detail.value;
 | |
| 			},
 | |
| 			clearName() {
 | |
| 				this.newName = '';
 | |
| 			},
 | |
| 			subName() {
 | |
| 				let self = this;
 | |
| 				if (self.loading) {
 | |
| 					return;
 | |
| 				}
 | |
| 				self.userData[self.type] = this.newName;
 | |
| 				self.update();
 | |
| 			},
 | |
| 			/* 修改头像 */
 | |
| 			changeAvatarUrl() {
 | |
| 				let self = this;
 | |
| 				self.isUpload = true;
 | |
| 			},
 | |
| 			/*获取上传的图片*/
 | |
| 			getImgsFunc(e) {
 | |
| 				let self = this;
 | |
| 				console.log(e);
 | |
| 				self.isUpload = false;
 | |
| 				if (e && typeof e != 'undefined') {
 | |
| 					let self = this;
 | |
| 					self.userInfo.headPath = e[0].url;
 | |
| 					// self.getUserInfoData();
 | |
| 				}
 | |
| 			},
 | |
| 			deleteAccount() {
 | |
| 				let self = this;
 | |
| 				uni.showModal({
 | |
| 					title: self.$t('w_0034'),
 | |
| 					content: self.$t('w_0416'),
 | |
| 					success: function(res) {
 | |
| 						if (res.confirm) {
 | |
| 							uni.showLoading({
 | |
| 								title: 'Loading...'
 | |
| 							})
 | |
| 							setTimeout(function() {
 | |
| 								uni.hideLoading();
 | |
| 								self.showSuccess('删除成功', () => {
 | |
| 									uni.removeStorageSync('expires_in');
 | |
| 									uni.removeStorageSync('Admin-Token');
 | |
| 									uni.removeStorageSync('userCode');
 | |
| 									self.gotoPage('/pages/index/index');
 | |
| 								});
 | |
| 							}, 400);
 | |
| 						}
 | |
| 					}
 | |
| 				})
 | |
| 			},
 | |
| 			update() {
 | |
| 				let self = this;
 | |
| 				if (self.loading) {
 | |
| 					return;
 | |
| 				}
 | |
| 				uni.showLoading({
 | |
| 					title: self.$t('MN_F_6')
 | |
| 				});
 | |
| 				self.loading = true;
 | |
| 				self._putjson('member/api/member/update-data', {
 | |
| 					nickName: self.userData.nickName
 | |
| 				}, function(res) {
 | |
| 					self.showSuccess(
 | |
| 						'修改成功',
 | |
| 						function() {
 | |
| 							self.loading = false;
 | |
| 							self.isPopup = false;
 | |
| 							uni.hideLoading();
 | |
| 							self.getData();
 | |
| 						},
 | |
| 						function(err) {
 | |
| 							uni.hideLoading();
 | |
| 							self.loading = false;
 | |
| 							self.isPopup = false;
 | |
| 						}
 | |
| 					);
 | |
| 				});
 | |
| 			}
 | |
| 		}
 | |
| 	};
 | |
| </script>
 | |
| 
 | |
| <style lang="scss">
 | |
| 	.address-form .key-name {
 | |
| 		width: 200rpx;
 | |
| 	}
 | |
| 
 | |
| 	.address-form .btn-red {
 | |
| 		height: 88rpx;
 | |
| 		line-height: 88rpx;
 | |
| 		border-radius: 44rpx;
 | |
| 		box-shadow: 0 8rpx 16rpx 0 rgba(226, 35, 26, 0.6);
 | |
| 	}
 | |
| 
 | |
| 	.setup-btn {
 | |
| 		position: fixed;
 | |
| 		bottom: 20rpx;
 | |
| 		left: 5%;
 | |
| 		width: 90%;
 | |
| 		height: 80rpx;
 | |
| 		line-height: 80rpx;
 | |
| 		border-radius: 80rpx;
 | |
| 		background-color: #fd3826;
 | |
| 		color: #fff;
 | |
| 		font-size: 30rpx;
 | |
| 		display: flex;
 | |
| 		justify-content: center;
 | |
| 		margin: 0 auto;
 | |
| 	}
 | |
| 
 | |
| 	.info-item.avatar {
 | |
| 		height: 162rpx;
 | |
| 	}
 | |
| 
 | |
| 	.info-image {
 | |
| 		width: 89rpx;
 | |
| 		height: 89rpx;
 | |
| 		border-radius: 45rpx;
 | |
| 
 | |
| 		image {
 | |
| 			width: 89rpx;
 | |
| 			height: 89rpx;
 | |
| 			border-radius: 45rpx;
 | |
| 		}
 | |
| 	}
 | |
| 
 | |
| 	.make-item {
 | |
| 		height: 60rpx;
 | |
| 	}
 | |
| 
 | |
| 	.btn-red.code-btn {
 | |
| 		height: 54rpx;
 | |
| 		line-height: 54rpx;
 | |
| 	}
 | |
| 
 | |
| 	.btn-red.code-btn.issend {
 | |
| 		background: #666666;
 | |
| 		border: none;
 | |
| 		color: #ffffff;
 | |
| 		box-shadow: none;
 | |
| 	}
 | |
| 
 | |
| 	.pop-input {
 | |
| 		width: 100%;
 | |
| 		margin: 26rpx 0;
 | |
| 		box-sizing: border-box;
 | |
| 		border-bottom: 2rpx solid #d9d9d9;
 | |
| 	}
 | |
| 
 | |
| 	.pop-input input {
 | |
| 		width: 100%;
 | |
| 		padding-left: 15rpx;
 | |
| 
 | |
| 		font-size: 26rpx;
 | |
| 		color: #333333;
 | |
| 		margin: 16rpx 0;
 | |
| 		text-align: left;
 | |
| 		height: 60rpx;
 | |
| 		line-height: 60rpx;
 | |
| 	}
 | |
| 
 | |
| 	.pop-input .icon.icon-guanbi {
 | |
| 		width: 38rpx;
 | |
| 		height: 38rpx;
 | |
| 		background-color: #999999;
 | |
| 		color: #ffffff;
 | |
| 		font-size: 22rpx;
 | |
| 		display: flex;
 | |
| 		justify-content: center;
 | |
| 		align-items: center;
 | |
| 		border-radius: 50%;
 | |
| 		opacity: 0.8;
 | |
| 	}
 | |
| 
 | |
| 	.sub-box {
 | |
| 		padding: 40rpx 0;
 | |
| 
 | |
| 		.setup-btn {
 | |
| 			width: 686rpx;
 | |
| 			height: 84rpx;
 | |
| 			background: #e03325;
 | |
| 			border-radius: 6rpx;
 | |
| 			line-height: 84rpx;
 | |
| 			color: #fff;
 | |
| 			font-size: 30rpx;
 | |
| 			display: flex;
 | |
| 			justify-content: center;
 | |
| 			margin: 0 auto;
 | |
| 		}
 | |
| 	}
 | |
| </style> |