<template>
	<view class="user">
		<!-- 头部 -->
		<!-- <view class="user-wrap">
			<view class="info">
				<image class="avatar" mode="aspectFill" :src="userInfo.wxProfile"></image>
				<view class="nickname">{{ userInfo.realName }}</view>
			</view>
		</view> -->

		<view class="com-item">
			<view class="com-wrap">
				<view class="cell" @click="goUserDetail()">
					<view class="cell-left">
						<image class="cell-icon" src="/static/images/user/yhxx.png" mode="aspectFill"></image>
						<view class="cell-text">用户信息</view>
					</view>
					<view class="iconfont iconmore1"></view>
				</view>
				<!-- <view class="cell"  @click="goEditPw()">
					<view class="cell-left">
						<image class="cell-icon" src="/static/images/user/xgmm.png" mode="aspectFill"></image>
						<view class="cell-text">修改密码</view>
					</view>
					<view class="iconfont iconmore1"></view>
				</view> -->
				<view class="cell"  @click="goUrlPath('/pages/tecSupport/tecSupport')">
					<view class="cell-left">
						<image class="cell-icon" src="/static/images/user/fwzc.png" mode="aspectFill"></image>
						<view class="cell-text">服务支撑</view>
					</view>
					<view class="iconfont iconmore1"></view>
				</view>
				<view class="cell"  @click="circulation()">
					<view class="cell-left">
						<image class="cell-icon" src="/static/images/user/wtfk.png" mode="aspectFill"></image>
						<view class="cell-text">意见建议</view>
					</view>
					<view class="iconfont iconmore1"></view>
				</view>
				<!-- <view class="cell"  >
					<view class="cell-left">
						<image class="cell-icon" src="/static/images/user/wtfk.png" mode="aspectFill"></image>
						<view class="cell-text">设置</view>
					</view>
					<view class="iconfont iconmore1"></view>
				</view> -->
			</view>
		</view>
		
		
		<!-- <view class="com-item">
			<view class="com-wrap">
				<view  @click="toLogOut()" style="text-align: center;border: none;border-radius: 12px;background: white;padding:30upx;font-size: 30upx;color: #4db4ea;">
						退出登录
				</view>
			</view>
		</view> -->
		<!-- <view class="com-item">
			<view class="com-wrap">
				<view class="cell"  >
					<view class="cell-left">
						<image class="cell-icon" src="/static/images/user/icon-help.png" mode="aspectFill"></image>
						<view class="cell-text">帮助中心</view>
					</view>
					<view class="iconfont iconmore1"></view>
				</view>
				<view class="cell"  >
					<view class="cell-left">
						<image class="cell-icon" src="/static/images/user/icon-about.png" mode="aspectFill"></image>
						<view class="cell-text">版本</view>
					</view>
					<view class="iconfont iconmore1"></view>
				</view>
			</view>
		</view> -->
		<uni-popup ref="popup" type="center" style="">
			<view style="background: white;width: 80%;height: 520upx;width: 600upx;position: relative;border-radius: 10upx;padding: 14upx;">
				<view style="color: #333;font-size: 30upx;font-weight: bold;padding: 10upx 0px;">
					<text>意见建议：</text>
				</view>
				<view style="width: 100%;border: 1px solid #E5E5E5;margin-top: 20upx;padding: 20upx;height: 300upx;color: #666;border-radius: 10upx;">
					<textarea style="width: 100%;height: 100%;" v-model="content"  placeholder="请输入意见建议"/>
				</view>
				<!-- <view style="color: #333;font-size: 30upx;font-weight: bold;padding: 10upx 0px;">
					<text>图片：</text>
				</view>
				<view class="pic">
					<view class="img-box">
						<view class="img-item" v-for="(item, index) in imgs" :key="index">
							<image class="remove-btn" @click="removeImg(index)" src="/static/icons/delete-icon.png" mode=""></image>
							<image class="img" :src="item" mode=""></image>
						</view>
						<view class="img-item upload-btn" @click="chooseImg()" v-if="imgs.length < 2"><image class="img" src="/static/imgs/tianjia-img.png" mode=""></image></view>
					</view>
				</view> -->
				<view class="footer-btn footer-btn-two" style="position: absolute;margin-bottom: 20upx;">
					<view class="btn btn-col" style="width:40%;margin-left:7%;margin-right: 6%;border-radius: 10upx;" @click="closeCirculation()">取消</view>
					<view class="btn btn-col1" style="width:40%;border-radius: 10upx" @click="submitProblem()">提交</view>
				</view>
			</view>
		</uni-popup>

	</view>
</template>

<script>
import {mapMutations} from 'vuex';
import comNav from './components/com-nav.vue'
import { iOpenidGetUserInfo, getBacklogInfo, getUserPers ,getShopMallToken,submitProblem} from '@/common/api.js';
import { callbackRequest, setStorage, getStorage, sureAlterTip, devEnv, alertTip } from '@/common/util.js';
import UniPopup from '@/components/uni-popup/uni-popup2.vue';
export default {
	components: {
		comNav,
		UniPopup
	},
	data() {
		return {
			userInfo: getStorage("userInfo"),
			currentIndex: 0,
			imgs: [],
			content:"",
			
		};
	},
	onLoad() {
	},
	onShow() {
		this.userInfo = getStorage("userInfo");
	},
	methods:{
		...mapMutations(['logout']),
		uploadFile(){
			const dyChooseFile = uni.requireNativePlugin('K-ChooseFilesModule');
			//let filters = ['txt', 'doc'];//筛选文件类型，不传此参数，默认全部
			dyChooseFile.chooseFileAction({}, result => {
			                console.log(JSON.stringify(result));
			            });
		},
		
		circulation(){
			this.$refs.popup.open();
			//this.closeButPopup();
		},
		closeCirculation(){
			this.$refs.popup.close()
		},
		goUserDetail(){
			uni.navigateTo({
				url: `/pages/user/c-userinfo`
			});
		},
		goEditPw(){
			uni.navigateTo({
				url: `/pages/user/edit-pw`
			});
		},
		goUrlPath(url){
			uni.navigateTo({
				url
			});
		},
		goShopMall(){
			let params = {
				method:getShopMallToken,
				data: {
					mobile:this.userInfo.mobile,
					realName:this.userInfo.realName,
					id:this.userInfo.id,
					deptName:this.userInfo.departmentName
				}
			}
			callbackRequest(params).then(res => {
				res = res.data;
				if (res.returnCode == 1) {
					// this.$api.msg(res.returnMsg);
					var token = res.returnData;
					uni.navigateTo({
						url: `/pages/shopmall/shopmall?token=`+token
					});
				} else {
					this.$api.msg(res.returnMsg);
				
				}
			});
		},
		submitProblem(){
			let params = {
				method:submitProblem,
				data: {
					createBy:this.userInfo.id,
					content:this.content
				}
			}
			callbackRequest(params).then(res => {
				res = res.data;
				if (res.returnCode == 1) {
					this.closeCirculation();
					alertTip(res.returnMsg);
				} else {
					this.$api.msg(res.returnMsg);
				
				}
			});
		},
		toLogOut(){
			uni.showModal({
				title: '确认',
				content: '是否确认退出登录。',
				showCancel: true,
				cancelText: '取消',
				confirmText: '确认',
				success: res => {
					if (res.confirm) {
						this.logout();
						uni.redirectTo({
							url: '/pages/login/login'
						});
					} else if (res.cancel) {
					}
				}
			});
		}
	}
};
</script>

<style lang="scss">
	@import '@/static/css/common.scss';
page {
	background: #f2f2f2;
}
.img-box {
		overflow: hidden;
		padding-top: 20rpx;
		padding-bottom: 10rpx;
	
		.img-item {
			float: left;
			width: 200upx;
			height: 200upx;
			border: 1px solid #ddd;
			margin: 0 22rpx 20upx 0upx;
			position: relative;
			box-sizing: border-box;
	
			.img {
				display: block;
				width: 100%;
				height: 100%;
			}
	
			.remove-btn {
				position: absolute;
				top: -18upx;
				right: -18upx;
				width: 44upx;
				height: 44upx;
				z-index: 2;
			}
		}
	
		.upload-btn {
			.img {
				width: 60upx;
				height: 60upx;
				margin: 70upx auto 0;
			}
		}
	}
	
.btn-hover {
	background: #f2f2f2 !important;
}
.user {
	.user-wrap {
		display: flex;
		justify-content: center;
		align-items: center;
		height: 50vw;
		padding: 30rpx;
		z-index: 9;
		border-radius: 0 0 20% 20%;
		//background: url('https://handsel.oss-cn-shenzhen.aliyuncs.com/1588938371592.jpg') no-repeat;
		background-image: linear-gradient(#4db4ea, #9198e5);
		background-size: cover;
		.setting {
			color: #fff;
			position: absolute;
			top: 60rpx;
			left: 60rpx;
			font-size: 50rpx;
		}
		.info {
			position: absolute;
			text-align: center;
			.avatar {
				width: 150rpx;
				height: 150rpx;
				border-radius: 20upx;
			}
			.nickname {
				color: #fff;
				font-size: 28rpx;
			}
		}
	}
	.order-status {
		padding: 0 20rpx;
		margin-top: -10vw;
		.status-wrap {
			border-radius: 25rpx;
			overflow: hidden;
			.status-list {
				display: flex;
				justify-content: space-evenly;
				align-items: center;
				background: #fff;
				padding-top: 30rpx;
				padding-bottom: 30rpx;
				.status-item {
					flex: 1;
					display: flex;
					flex-direction: column;
					justify-content: center;
					align-items: center;
					.item-icon {
						line-height: 1;
						font-size: 65rpx;
						color: #bbb;
					}
					.item-text {
						font-size: 28rpx;
						color: #666;
						margin-top: 5rpx;
					}
				}
			}
		}
	}
	.com-item {
		padding-left: 20rpx;
		padding-right: 20rpx;
		margin-top: 20rpx;
		.com-wrap {
			border-radius: 25rpx;
			overflow: hidden;
		}
	}
	.cell {
		height: 80rpx;
		padding-left: 20rpx;
		padding-right: 20rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		background: #fff;
		border-bottom: 1px solid #f8f8f8;
		&:active {
			background: #f2f2f2;
		}
		&:last-child {
			border-bottom: none !important;
		}
		.cell-left {
			display: flex;
			align-items: center;
			.cell-icon {
				width: 50rpx;
				height: 50rpx;
			}
			.cell-text {
				color: #666;
				font-size: 28rpx;
				margin-left: 20rpx;
			}
		}
		.iconfont {
			font-size: 40rpx;
			color: #999;
		}
	}
}
</style>
