<template>
	<view>
		<customNav :shownav="false" title="" titledetl=""></customNav>
		<view class="contentV">
			<view class="nodetail"  @click="userIconsel">
				<view class="viewinrow">
					<netImage class="userIcon" width="120" height="120" bradius="60" :mysrc="avatar" mymode="scaleToFill"></netImage>
					<!-- <myImage class="userIcon" :isIcon="true" :mysrc="avatar" mymode="heightFix"></myImage> -->
					<view class="">
						<view class="viewinrow">
							<image class="vipicon" src="/static/images/VIP@3x.png" mode="widthFix"></image>
							<view class="userName">{{phone}}</view>
						</view>
						<text class="usernont">{{nickName}}</text>
					</view>
				</view>
				<image class="fanhuiimg" src="/static/images/fanhui@3x.png" mode="widthFix"></image>
			</view>
		</view>
		<view class="">
			<view style="width: 100%;height: 50rpx;background-color: #40AE36;"></view>
			<view class="actBTVn" style="margin-top: -50rpx;">
				<view class="actbt"  @click="gouwuche">
					<view class="ddbticon">
						<image class="bticonb" src="/static/images/gouwuch@3x.png" mode="widthFix"></image>
					</view>
					<view class="acttextw textfontB5">
						<text >{{$t('gouwu.gouwuche')}}</text>
					</view>
				</view>
				<view class="actbt" @click="wodeshoucang">
					<view class="ddbticon">
						<image class="bticonb" src="/static/images/shoucangh@3x.png" mode="widthFix"></image>
					</view>
					<view class="acttextw textfontB5">
						<text >{{$t('index.shouchang')}}</text>
					</view>
				</view>
				<view class="actbt"  @click="wodezhuji">
					<view class="ddbticon">
						<image class="bticonb" src="/static/images/zhujih@3x.png" mode="widthFix"></image>
					</view>
					<view class="acttextw textfontB5">
						<text >{{$t('index.zhuji')}}</text>
					</view>
				</view>
				<!-- <view class="actbt"  @click="hongbaokq">
					<view class="ddbticon">
						<image class="bticonb" src="/static/images/hongbkqh@3x.png" mode="widthFix"></image>
					</view>
					<view class="acttextw textfontB5">
						<text >{{$t('index.hongbaokq')}}</text>
					</view>
				</view> -->
			</view>
		</view>
		<scroll-view :style="'height:'+scrollHeight+'rpx;'" scroll-y="true">
			<uni-list class="listcontent">
			    <uni-list-item :show-extra-icon="true" showArrow thumb="/static/images/dizhi@3x.png" thumb-size="sm" :title="$t('index.shouhuodz')" @click="listClick(1)" link/>
				<uni-list-item :show-extra-icon="true" showArrow thumb="/static/images/yuyan@3x.png" thumb-size="sm" title="Ngôn ngữ/语言" @click="listClick(4)" link/>
				<uni-list-item :show-extra-icon="true" showArrow thumb="/static/images/zhoubianfw.png" thumb-size="sm" :title="$t('index.zhoubianfw')" @click="listClick(5)" link/>
				<!-- <uni-list-item :show-extra-icon="true" showArrow thumb="/static/images/gengduozx.png" thumb-size="sm" :title="$t('user.baomizc')" @click="openWebView(1)" link/> -->
				<!-- <uni-list-item :show-extra-icon="true" showArrow thumb="/static/images/gengduozx.png" thumb-size="sm" :title="$t('user.fuwutiaok')" @click="openWebView(2)" link/>
				<uni-list-item :show-extra-icon="true" showArrow thumb="/static/images/gengduozx.png" thumb-size="sm" :title="$t('user.caozuogz')" @click="openWebView(3)" link/>
				<uni-list-item :show-extra-icon="true" showArrow thumb="/static/images/gengduozx.png" thumb-size="sm" :title="$t('user.zengyihts')" @click="openWebView(4)" link/> -->
				<uni-list-item :show-extra-icon="true" showArrow thumb="/static/images/tuichu.png" thumb-size="sm" :title="$t('user.tuichudl')" @click="tuichudengl" link/>
				<uni-list-item :show-extra-icon="true" showArrow thumb="/static/images/sanchuzh.png" thumb-size="sm" :title="$t('user.zhuxiaozhh')" @click="zhuxiaozhangh" link/>
				<uni-list-item :show-extra-icon="true" showArrow thumb="/static/images/yinszct.png" thumb-size="sm" :title="$t('user.yinsizhc')" @click="yinsizhc" link/>
				<!-- <uni-list-item :show-extra-icon="true" showArrow thumb="/static/images/guanyu.png" thumb-size="sm" :title="$t('user.guanyuwm')" @click="openWebView(5)" link/> -->
				<!-- <uni-list-item :show-extra-icon="true" showArrow thumb="/static/images/shezhi@3x.png" thumb-size="sm" :title="$t('index.setting')" @click="listClick(7)" link/> -->
			</uni-list>
			<view class="contentInRowC" style="margin-top: 80rpx;">
				<text class="dangqbb">{{$t('user.dangqianbb')}}: v{{appversionN}}</text>
			</view>
			<view style="height: 80rpx;"></view>
		</scroll-view>
		
		
		<popViewGG :tips="$t('index.zhoubianfw')" :show="showpop" :acttips="$t('order.queding')" :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>
	</view>
	
</template>

<script>
	import uniList from '@/uni_modules/uni-list/uni-list.vue';
	import uniListItem from '@/uni_modules/uni-list-item/uni-list-item.vue';
	import uniAd from '@/uni_modules/uni-list-ad/uni-list-ad.vue';
	import uniChat from '@/uni_modules/uni-list-chat/uni-list-chat.vue';

 import api from "@/pages/api/api.js"
	
		export default {
			components:{
				uniList,uniListItem,uniAd,uniChat
			},
		data() {
			return {
				range: ["3Km","5Km","10Km","15Km","20Km"],
				showpop:false,
				indicatorStyle: 'height: 50px;',
				pvalue: [0],
				juli:3,
				goods:[],
				token:'',
				login:false,
				userInfo:[],
				phone:'',
				userType:'',
				nickName:this.$t('index.dengluzhuce'),
				avatar:'',
				isShangjia:false,
				appversionN:'',
				scrollHeight:0
			}
		},
		onLoad() {
			var info = uni.getSystemInfoSync();
			this.appversionN=info.appVersion;
			this.scrollHeight=info.windowHeight*(750/info.windowWidth)-440-info.statusBarHeight*(750/info.windowWidth);
		},
		onShow() {
			var that =this;
			try {//读取
				that.token = uni.getStorageSync("token");
				//console.log('2222',that.token)
				if(that.token == '' || that.token == undefined || that.token == null){
					that.login=false;
					that.phone='';
					that.nickName=that.$t('index.dengluzhuce');
					that.avatar='';
					return;
				}
				else{
					that.login=true;
					that.getUserMsg(that.token);
					return;
				}
			} catch(e){//错误
				return;
			}
		},
		
		methods: {
			gouwuche(){
				console.log("gouwuche-----");
				uni.switchTab({
					url:'/pages/OrderList/buy/gouwuche'
				})
			},
			wodeshoucang(){
				if(this.login){
					uni.navigateTo({
						url:'/pages/OrderList/buy/wodezhuji?listType=1'
					})
				}else{
					uni.navigateTo({
						url:'/pages/UserCenter/LoginView'
					})
				}
			},
			wodezhuji(){
				if(this.login){
					uni.navigateTo({
						url:'/pages/OrderList/buy/wodezhuji?listType=2'
					})
				}else{
					uni.navigateTo({
						url:'/pages/UserCenter/LoginView'
					})
				}
			},
			hongbaokq(){
				uni.navigateTo({
					url:'/pages/OrderList/buy/hongbaokq'
				})
			},
			listClick(e){
				
				switch(e){
					case 1:
					if(this.login){
						uni.navigateTo({
							url:'/pages/UserCenter/dizhi/dizhilist'
						})
					}else{
						uni.navigateTo({
							url:'/pages/UserCenter/LoginView'
						})
					}
					break;
					case 2:
					uni.navigateTo({
						url:'/pages/UserCenter/huiyuan/huiyuan'
					})
					break;
					case 3:
					uni.navigateTo({
						url:'/pages/kefuzhongxin/fuwuleixing'
					})
					break;
					case 4://语言
					uni.navigateTo({
						url:'/pages/UserCenter/yonghushezhi/duoyuyan'
					})
					break;
					case 5://选择服务距离
					this.showpop=true;
					break;
					case 6://外送员
					
					break;
					case 7:
					if(this.login){
						uni.navigateTo({
							url:'/pages/UserCenter/yonghushezhi/shezhi'
						})
					}else{
						uni.navigateTo({
							url:'/pages/UserCenter/LoginView'
						})
					}
					break;
					case 8:
					uni.navigateTo({
						url:'/pages/UserCenter/yonghushezhi/bangzhu'
					})
					break;
				}
			},
			userIconsel(){
				if(this.login){
					//用户信息编辑页
					uni.navigateTo({
						url:'/pages/UserCenter/userMsgMenager'
					})
				}else{
					uni.navigateTo({
						url:'/pages/UserCenter/LoginView'
					})
				}
			},
			getUserMsg(token){
				//console.log('getUserMsg')
				api('getUserMsg',{
				},res=>{
					//console.log(res.data)
					if(res.data.code==200){
						this.userInfo=res.data.data;
						this.phone=res.data.data.phone;
						this.nickName=res.data.data.nickName;
						this.avatar=res.data.data.avatar;
						//console.log('this.avatar',this.avatar)
						uni.setStorageSync('userInfo',res.data.data);
						if(res.data.data.userType==1){
							this.isShangjia=true;
						}
					}
				},failc=>{
					//console.log('getadvertis----',failc)
				})
			},
			bindChange (e) {
				var val = e.detail.value[0];
				console.log(val)
				if(val==0){
					this.juli=3;
				}
				else{
					this.juli=5*val;
				}
			},
			chooseCancel(){
				this.showpop=false;
				// this.juli=3000
				uni.setStorageSync('FuWujuli',this.juli);
				console.log(this.juli);
			},
			tuichudengl(){
				var that = this;
				uni.showModal({
				    title: that.$t('api.message'),
				    content: that.$t('user.querentcdq'),
					cancelText:that.$t('order.quxiao'),
					confirmText:that.$t('comp.queren'),
				    success: function (res) {
						if (res.confirm) { //这里是点击了确定以后
							uni.setStorageSync('userInfo','');
							uni.setStorageSync('token','');
							getApp().globalData.token='';
							that.disconectGoeasy();
							uni.navigateTo({
								url:'/pages/UserCenter/LoginView'
							})
						} else { //这里是点击了取消以后
							console.log('用户点击取消')
						}
				    }
				})
			},
			zhuxiaozhangh(){
				var that = this;
				uni.showModal({
				    title: that.$t('user.zhuxiaozhh'),
				    content: that.$t('user.zhuxiaodqzh'),
					cancelText:that.$t('order.quxiao'),
					confirmText:that.$t('comp.queren'),
				    success: function (res) {
						if (res.confirm) { //这里是点击了确定以后
							this.updatazuxiao();
						} else { //这里是点击了取消以后
						  console.log('用户点击取消')
						}
						
				    }
				})
			},
			updatazuxiao(){
				var that = this;
				api('deleuser',{
				},res=>{
					console.log(res)
					uni.setStorageSync('userInfo','');
					uni.setStorageSync('token','');
					that.disconectGoeasy();
					uni.navigateTo({
						url:'/pages/UserCenter/LoginView'
					})
				},failc=>{
					//console.log('getadvertis----',failc)
				})
			},
			disconectGoeasy(){
				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);
				    }
				});
			},
			yinsizhc(){
				uni.navigateTo({
					url:'/pages/index/mindex/yinszhengc'
				})
			},
			openWebView(index){
				var url=''
				if(index==1){
					url='https://cityexpress168.com.vn/bao-mat-thong-tin'
				}
				if(index==2){
					url='https://cityexpress168.com.vn/dieu-khoan-su-dung'
				}
				if(index==3){
					url='https://cityexpress168.com.vn/quy-che-hoat-dong'
				}
				if(index==4){
					url='https://cityexpress168.com.vn/quy-trinh-giai-quyet-tranh-chap-khieu-nai'
				}
				if(index==5){
					url='https://cityexpress168.com.vn/dia-chi-cong-ty'
				}
				uni.navigateTo({
					url:'/pages/UserCenter/OpenWebview?url='+url
				})
			},
		}
	}
</script>

<style>
	page{
		background-color: #F2F3F7;
	}
	.contentV{
		width: 100%;
		background-color: #40AE36;
	}
	.viewinrow{
		display: flex;
		flex-direction: row;
		align-items: center;
	}
	.nodetail{
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		background-color: #40AE36;
		padding: 30rpx;
	}
	.userIcon{
		margin: 20rpx;
		width: 120rpx;
		height: 120rpx;
		border-radius: 60rpx;
		background-color: white;
	}
	.vipicon{
		width: 30rpx;
	}
	.userName{
		font-size: 30rpx;
		padding-left: 16rpx;
		color: white;
	}
	.usernont{
		font-size: 26rpx;
		color: white;
		padding-left: 16rpx;
	}

	.usernameCt{
		padding-left: 10rpx;
		text-align: left;
		font-size: 22rpx;
		line-height: 32rpx;
	}
	.fanhuiimg{
		width: 30rpx;
		height: 30rpx;
		margin-right: 50rpx;
		
	}
	.huiyuanxct{
		margin-top: 30rpx;
		width: 94%;
		margin-left: 3%;
	}
	
	.actBTVshang{
		width: 70%;
		padding-left: 15%;
		display: flex;
		flex-direction: row;
		justify-content:space-between;
		align-items: center;
		background-color: #40AE36;	
	}
	
	.actBTV{
		width: 100%;
		display: flex;
		flex-direction: row;
		justify-content:space-between;
		align-items: center;
		background-color: #40AE36;	
	}
	
	.actBTVn{
		margin-left: 3%;
		width: 94%;
		display: flex;
		flex-direction: row;
		justify-content:space-between;
		align-items: center;
		background-color: white;	
		border-radius: 10rpx;
		box-shadow: -2rpx 2rpx 5rpx lightgrey;
	}
	
	.actbt{
		width: 25%;
		height: 160rpx;
		margin-top: 10rpx;
		align-items: center;
		justify-content: center;
	}
	.bticon{
		width: 80rpx;
	}
	.bticonb{
		width: 70rpx;
	}
	.acttext{
		color: white;
		text-align: center;
	}
	.acttextw{
		color: black;
		text-align: center;
	}
	
	.dangdanrukouT{
		height: 62rpx;
		background-color: #40AE36;
	}
	.dingdantext{
		width: 100%;
		font-size: 30rpx;
		padding-left: 20rpx;
		padding-top: 20rpx;
		background-color: white;
	}
	.ddactbt{
		width: 20%;
		height: 120rpx;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	
	}
	.ddbticon{
		width: 100%;
		height: 80rpx;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.ddtext{
		text-align: center;
		font-size: 20rpx;
		color: black;
	}
	
	.listcontent{
		margin-left: 3%;
		width: 94%;
		display: flex;
		box-shadow: -4rpx 6rpx 2rpx lightgrey;
	}
	.picker-view {
		width: 750rpx;
		height: 300rpx;
		margin-top: 10rpx;
	}
	.item {
		line-height: 100rpx;
		text-align: center;
	}
	.dangqbb{
		padding-top: 10rpx;
		font-size: 28rpx;
	}

</style>

