meishidaQS/pages/user/Usermanager.vue

<template>
	<view>
		<customNav :shownav="true" :title="$t('user.gerenxinxi')"  tinColor="#40AE36" jiantou="0"></customNav>
		
		<view class="contentColumnC" style="margin-top: 30rpx;">
			<yhdslCropper ref="yhdslCropper" :quality="1" mode="scale"  @uploadImg="uploadImg" :scale="scale"></yhdslCropper>
			<myImage class="iconImg" :isIcon="true" :mysrc="userInfo.avatar" mymode="scaleToFill" v-on:Emyimageclick="userIconkl"></myImage>
		</view>
		<view style="width: 92%;margin-left: 4%;margin-top: 20rpx;">
			<view class="contentInRowS Itemcontent" @click="userNamekl">
				<text class="titleText">{{$t('user.nicheng')}}</text>
				<view class="contentInRowC titleText">
					<text class="">{{userInfo.nickName}}</text>
					<image class="jiantouImg" src="/static/imags/youjian@3x.png" mode="scaleToFill"></image>
				</view>
			</view>
			<view class="contentInRowS Itemcontent" @click="shimingrenzh">
				<text class="titleText">{{$t('user.shimingwsmrz')}}</text>
				<view class="contentInRowC">
					<text class="titleText">{{audTitle}}</text>
					<image class="jiantouImg" src="/static/imags/youjian@3x.png" mode="scaleToFill"></image>
				</view>
			</view>
			<view class="contentInRowS Itemcontent" @click="shezhixiugai(0)">
				<text class="titleText">{{$t('user.bangdingsj')}}</text>
				<view class="contentInRowC titleText">
					<text v-if="telPhone" class="">{{telPhone}}</text>
					<image class="jiantouImg" src="/static/imags/youjian@3x.png" mode="scaleToFill"></image>
				</view>
			</view>
			<view class="contentInRowS Itemcontent" @click="cheshourenzheng">
				<text class="titleText">{{$t('user.cheshourenzh')}}</text>
				<view class="contentInRowC">
					<!-- <text class="detealText">{{userInfo.licensePlate}}</text> -->
					<image class="jiantouImg" src="/static/imags/youjian@3x.png" mode="scaleToFill"></image>
				</view>
			</view>
			<view class="contentInRowS Itemcontent" @click="shezhixiugai(4)">
				<text class="titleText">{{$t('index.zhoubianfw')}}</text>
				<view class="contentInRowC">
					<text class="detealText">{{juli}}Km</text>
					<image class="jiantouImg" src="/static/imags/youjian@3x.png" mode="scaleToFill"></image>
				</view>
			</view>
			<view class="contentInRowS Itemcontent" @click="shezhixiugai(5)">
				<text class="titleText">{{$t('user.navType')}}</text>
				<view class="contentInRowC">
					<text class="detealText">{{navType}}</text>
					<image class="jiantouImg" src="/static/imags/youjian@3x.png" mode="scaleToFill"></image>
				</view>
			</view>
			<view class="contentInRowS Itemcontent" @click="shezhixiugai(1)">
				<text class="titleText">{{$t('user.denglumima')}}</text>
				<view class="contentInRowC">
					<text class="detealText">{{$t('user.xiugai')}}</text>
					<image class="jiantouImg" src="/static/imags/youjian@3x.png" mode="scaleToFill"></image>
				</view>
			</view>
			<!-- <view class="contentInRowS Itemcontent" @click="shezhixiugai(2)">
				<text class="titleText">{{$t('user.zhifumima')}}</text>
				<view class="contentInRowC">
					<text class="detealText">{{$t('user.weishezhi')}}</text>
					<image class="jiantouImg" src="/static/imags/youjian@3x.png" mode="scaleToFill"></image>
				</view>
			</view> -->
			<!-- <view class="contentInRowS Itemcontent" @click="zhuxiaozh">
				<text class="titleText">{{$t('user.zhuxiaozh')}}</text>
				<view class="contentInRowR">
					<image class="jiantouImg" src="/static/imags/youjian@3x.png" mode="scaleToFill"></image>
				</view>
			</view>
			<view class="contentInRowS Itemcontent" @click="tuichudengl">
				<text class="titleText">{{$t('user.tuichudengl')}}</text>
				<view class="contentInRowR">
					<image class="jiantouImg" src="/static/imags/youjian@3x.png" mode="scaleToFill"></image>
				</view>
			</view> -->
			<view class="contentInRowS Itemcontent" @click="yueduyszc">
				<text class="titleText">{{$t('index.yinsizc')}}</text>
				<view class="contentInRowR">
					<image class="jiantouImg" src="/static/imags/youjian@3x.png" mode="scaleToFill"></image>
				</view>
			</view>
			
			<!-- <view class="contentInRowS Itemcontent" @click="openwebV(1)">
				<text class="titleText">{{$t('user.baomizc')}}</text>
				<view class="contentInRowR">
					<image class="jiantouImg" src="/static/imags/youjian@3x.png" mode="scaleToFill"></image>
				</view>
			</view> -->
			<!-- <view class="contentInRowS Itemcontent" @click="openwebV(2)">
				<text class="titleText">{{$t('user.fuwutiaok')}}</text>
				<view class="contentInRowR">
					<image class="jiantouImg" src="/static/imags/youjian@3x.png" mode="scaleToFill"></image>
				</view>
			</view> -->
			<!-- <view class="contentInRowS Itemcontent" @click="openwebV(3)">
				<text class="titleText">{{$t('user.caozuogz')}}</text>
				<view class="contentInRowR">
					<image class="jiantouImg" src="/static/imags/youjian@3x.png" mode="scaleToFill"></image>
				</view>
			</view> -->
			<!-- <view class="contentInRowS Itemcontent" @click="openwebV(4)">
				<text class="titleText">{{$t('user.zengyihts')}}</text>
				<view class="contentInRowR">
					<image class="jiantouImg" src="/static/imags/youjian@3x.png" mode="scaleToFill"></image>
				</view>
			</view> -->
			<view class="contentInRowS Itemcontent" @click="openwebV(5)">
				<text class="titleText">{{$t('user.guanyuwm')}}</text>
				<view class="contentInRowR">
					<image class="jiantouImg" src="/static/imags/youjian@3x.png" mode="scaleToFill"></image>
				</view>
			</view>
			
		</view>
		
		<view class="contentInRowC" style="margin-top: 80rpx;width: 80%;margin-left: 10%;">
			<text class="zhuceBt" @click="tuichudengl">{{$t('user.tuichudengl')}}</text>
		</view>
		
		<view class="contentInRowC" style="margin-top: 40rpx;">
			<text class="sanchuzh" @click="zhuxiaozh">{{$t('user.zhuxiaozh')}}</text>
		</view>
		
		<view style="height: 140rpx;"></view>
		<view class="versionV">
			<view class="versionitem">
				<!-- <text class="appname"></text> -->
				<text class="dangqbb">{{$t('user.dangqianbb')}}: v({{appVersionCode}})</text>
			</view>
			<view style="height: 50rpx;"></view>
		</view>
		<popViewGG :tips="$t('order.qingxuanz')" :show="showpop" :acttips="$t('index.queren')" :maskClosable="true" :isCancel="true" @chooseCancel="chooseCancel">
			<picker-view :indicator-style="indicatorStyle" :value="pvalue" @change="bindChange" class="picker-view">
			    <picker-view-column>
			        <view class="item" v-for="(item,index) in range" :key="index">{{item}}</view>
			    </picker-view-column>
			</picker-view>
		</popViewGG>
		<!-- 提示窗示例 -->
		<uni-popup ref="TCalertDialog" type="dialog">
			<uni-popup-dialog type="NOMLE" :cancelText="$t('index.quxiao')" :confirmText="$t('index.queren')" :title="titleT" :content="noteT" @confirm="TCdialogConfirm"
				@close="TCdialogClose"></uni-popup-dialog>
		</uni-popup>
		
		<uni-popup ref="alertDialog" type="dialog">
			<uni-popup-dialog ref="inputClose"  mode="input" :title="inputTitle" value="" :placeholder="inputNote" :confirmText="$t('index.queren')" :cancelText="$t('index.quxiao')" @confirm="dialogConfirm"></uni-popup-dialog>
		</uni-popup>
	</view>
</template>

<script>
	import {
		getUserMsg,
		updataUserMsg,
		deleuser
	} from '@/pages/api/login';
	
	import {
		UploadImage
	} from '@/pages/api/basic.js';
	import yhdslCropper from '@/components/yhdsl-cropper/yhdsl-cropper.vue';
	
	export default {
		components: {
		        yhdslCropper
		},
		data() {
			return {
				range: ["3Km","5Km","10Km","15Km","20Km","25Km","30Km"],
				rangeMark:1,
				showpop:false,
				indicatorStyle: 'height: 50px;',
				pvalue: [0],
				juli:10,
				userInfo:'',
				userIcon:'',
				scale:1,
				avatar:'',
				telPhone:'',
				nikename:'',
				auditStatus:0,
				audTitle:this.$t('user.weirenzheng'),
				versionMSG:[],
				appversionN:'',
				appVersionCode:0,
				isnewV:true,
				doSate:0,
				titleT:'',
				noteT:'',
				navType:'',
				inputTitle:'',
				inputNote:'',
				inputState:0
			}
		},
		onLoad() {
			this.userInfo = uni.getStorageSync('userInfo');
			this.avatar = this.userInfo.avatar;
			this.telPhone = this.userInfo.telPhone;
			this.nikename = this.userInfo.nikename;
			this.auditStatus = this.userInfo.auditStatus;
			var tempaut = uni.getStorageSync('auditStatus');
			if(this.auditStatus==0){
				this.audTitle=this.$t('user.weirenzheng')
				if(tempaut==9){
					this.audTitle=this.$t('user.shenhezhong')
				}
			}
			else if(this.auditStatus==1){
				this.audTitle=this.$t('user.yirenzheng')
			}
		},
		onShow() {
			this.getUserMsg();
			var tempjuli=uni.getStorageSync('FuWujuli');
			if(''==tempjuli||null==tempjuli||undefined==tempjuli){
				this.juli=10;
			}
			else{
				this.juli=tempjuli;
			}
			
			this.navType=uni.getStorageSync('navType');
			if(''==this.navType||null==this.navType||undefined==this.navType){
				this.navType=this.$t('user.navTypeby');
				uni.setStorageSync('navType','cycling');
			}
			else{
				if(this.navType=='cycling'){
					this.navType=this.$t('user.navTypeby');
				}
				else{
					this.navType=this.$t('user.navTypedr');
				}
			}
			
			
			var info = uni.getSystemInfoSync();
			//console.log(info);
			this.appVersionCode=info.appVersionCode;
			this.appversionN=info.appVersion;
		},
		methods: {
			userIconkl(){
				console.log('userIconkl');
				this.$refs.yhdslCropper.chooseImage();
			},
			userNamekl(){
				this.inputTitle=this.$t('user.shezhinc');
				this.inputNote=this.$t('user.qingshurnc');
				this.inputState=1;
				this.$refs.alertDialog.open('center');
			},
			
			cheshourenzheng(){
				uni.navigateTo({
					url:'/pages/user/Cheshourenzheng'
				})
			},
			
			chepaihao(){
				this.inputTitle=this.$t('user.chepaihao');
				this.inputNote=this.$t('user.qsrchepaihao');
				this.inputState=2;
				this.$refs.alertDialog.open('center');
			},
			shimingrenzh(){
				uni.navigateTo({
					url:'/pages/user/zhanghu/Shimingrenzheng'
				})
				return;
				if(this.auditStatus!=0){
					uni.navigateTo({
						url:'/pages/user/zhanghu/Shimingrenzheng'
					})
				}
			},
			dialogConfirm(name) {
				console.log('点击确认')
				if(this.inputState==1){
					var usdata = {
							"nickName": name};
					this.updataUserMsg(usdata);
				}
				else if(this.inputState==2){
					var usdata = {
							"licensePlate": name};
					this.updataUserMsg(usdata);
				}
			},
			dialogClose() {
				console.log('点击关闭')
			},
			shezhixiugai(index){
				if(index==4){
					this.range=["3Km","5Km","10Km","15Km","20Km","25Km","30Km"];
					this.rangeMark=1;
					this.showpop = true;
					return;
				}
				if(index==5){
					this.range=[this.$t('user.navTypedr'),this.$t('user.navTypeby')];
					this.rangeMark=2;
					this.showpop = true;
					return;
				}
				uni.navigateTo({
					url:'/pages/user/Shezhixiugai?state='+index
				})
			},
			zhuxiaozh(){
				this.titleT=this.$t('user.zhuxiaozh');
				this.noteT=this.$t('user.zhuxiaodqzh');
				this.doSate=2;
				this.$refs.TCalertDialog.open('center');
			},
			
			tuichudengl(){
				this.titleT=this.$t('user.tuichudengl');
				this.noteT=this.$t('user.querentcdq');
				this.doSate=1;
				this.$refs.TCalertDialog.open('center');
			},
			TCdialogConfirm(name) {
				console.log('点击确认')
				if(this.doSate==1){
					uni.setStorageSync('userInfo','');
					uni.setStorageSync('token','');
					getApp().globalData.token='';
					this.goeasydisconnect();
					setTimeout(function() {
					  uni.reLaunch({
					  	url:'/pages/index/index'
					  })
					}, 1000);
				}
				else if(this.doSate==2){//注销账号
					this.updatazuxiao();
				}
				
			},
			updatazuxiao(){
				this.$http.get(`${deleuser}`,{},true)
				.then(r => {
					console.log('deleuser',r)
					getApp().globalData.token='';
					uni.setStorageSync('userInfo','');
					uni.setStorageSync('token','');
					this.goeasydisconnect();
					setTimeout(function() {
					  uni.reLaunch({
					  	url:'/pages/index/index'
					  })
					}, 1000);
				})
				.catch(err => {
					console.log(err)
				})
			},
			TCdialogClose() {
				console.log('点击关闭')
			},
			uploadImg(e) {
				//console.log('------------uploadImg:',e)
				this.spImage = e;
				var that = this;
				uni.uploadFile({
					url: this.$baseurl+UploadImage, //上传图片api
					filePath: e,
					name: 'file',
					header:{
						//"Authorization": userinfo.token
					},
					success: (res) => {
						let group =  JSON.parse(res.data);
						that.userIcon=group.data;
						var usdata = {
								"avatar": that.userIcon};
						that.updataUserMsg(usdata);
					}
				});
			},
			
			async updataUserMsg(data){
				var that = this;
				await this.$http.post(`${updataUserMsg}`,data,true)
				.then(async r => {
					console.log('updataUserMsg',r)
					that.getUserMsg();
				})
				.catch(err => {
					console.log(err)
				})
			},
			async getUserMsg(){
				console.log('getUserMsg')
				await this.$http.get(`${getUserMsg}`, {
				},true)
				.then(async r => {
					console.log(r.data)
					this.userInfo=r.data.data;
					this.telPhone=r.data.data.telPhone;
					this.nickName=r.data.data.nickName;
					this.avatar=r.data.data.avatar;
					//console.log('this.avatar',this.avatar)
					uni.setStorageSync('userInfo',r.data.data);
					if(r.data.data.userType==1){
						this.isShangjia=true;
					}
				})
				.catch(err => {
					console.log(err)
				})
			},
			bindChange (e) {
				if(this.rangeMark==1){
					var val = e.detail.value[0];
					console.log(val)
					if(val==0){
						this.juli=3;
					}
					else{
						this.juli=5*val;
					}
					uni.setStorageSync('FuWujuli',this.juli);
				}
				else if(this.rangeMark==2){
					var val = e.detail.value[0];
					console.log(val)
					if(val==0){
						uni.setStorageSync('navType','driving-traffic');
						this.navType=this.$t('user.navTypedr');
					}
					else if(val==1){
						uni.setStorageSync('navType','cycling');
						this.navType=this.$t('user.navTypeby');
					}
				}
			},
			chooseCancel(){
				this.showpop=false;
				console.log(this.juli);
			},
			checkgengxin(){
			},
			yueduyszc(){
				uni.navigateTo({
					url:'/pages/index/yinszhengc'
				})
			},
			openwebV(index){
				var url=''
				if(index==1){
					url='https://fooder.tw/bao-mat-thong-tin'
				}
				if(index==2){
					url='https://fooder.tw/dieu-khoan-su-dung'
				}
				if(index==3){
					url='https://fooder.tw/quy-che-hoat-dong'
				}
				if(index==4){
					url='https://fooder.tw/quy-trinh-giai-quyet-tranh-chap-khieu-nai'
				}
				if(index==5){
					url='https://www.awayqtw.com'
				}
				uni.navigateTo({
					url:'/pages/index/Openwebview?url='+url
				})
			},
			//断开连接
			goeasydisconnect(){
				this.goEasy.disconnect({
				    onSuccess: function(){
				        console.log("GoEasy disconnect successfully.")
						getApp().globalData.goEasycnt=false;
				    },
				    onFailed: function(error){
				        console.log("Failed to disconnect GoEasy, code:"+error.code+ ",error:"+error.content);
				    }
				});
			},
		},
	}
</script>

<style lang="scss">
	@import '@/common/common.scss';
	page{
		background-color: whitesmoke;
	}
	.iconImg{
		margin-top: 20rpx;
		margin-bottom: 20rpx;
		width: 110rpx;
		height: 110rpx;
		border-radius: 55rpx;
		background-color: #1A1A1A;
	}
	.jiantouImg{
		width: 32rpx;
		height: 32rpx;
	}
	.nameText{
		padding-left: 20rpx;
		font-size: 32rpx;
		color: white;
	}
	.titleText{
		font-size: 30rpx;
		color: #1A1A1A;
	}
	.detealText{
		font-size: 28rpx;
		color:darkgray;
	}
	.Itemcontent{
		padding-top: 30rpx;
		padding-bottom: 30rpx;
		border: solid lavender;
		border-width: 0px 0px 1rpx 0px;
	}
	.picker-view {
		width: 750rpx;
		height: 300rpx;
		margin-top: 10rpx;
	}
	.item {
		line-height: 100rpx;
		text-align: center;
	}
	.versionV{
		position:fixed;
		bottom: 0rpx;
		width: 100%;
		background-color: whitesmoke;
	}
	.versionitem{
		display:flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		width: 90%;
	}
	.appname{
		font-size: 30rpx;
	}
	.zuixinbb{
		padding-top: 10rpx;
		font-size: 28rpx;
	}
	.dangqbb{
		padding-top: 10rpx;
		font-size: 28rpx;
	}
	.huoqubb{
		padding-top: 10rpx;
		font-size: 28rpx;
		color: blue;
		text-decoration:underline;
	}
	
	.zhuceBt{
		margin-top: 30rpx;
		width: 100%;
		height: 60rpx;
		line-height: 60rpx;
		padding: 10rpx;
		border-radius: 20rpx;
		border: solid #40AE36;
		border-width: 0px 0px 6rpx 0px;
		text-align: center;
		justify-content: center;
		background-color: #40AE36;
		color: white;
		box-shadow: 0rpx 0rpx 10rpx 0rpx #40AE36;
	}
	
	.sanchuzh{
		width:80%;
		text-align: center;
		font-size: 36rpx;
		height: 80rpx;
		line-height: 80rpx;
		color: white;
		background-color:crimson;
		border-radius: 10rpx;
	}
</style>