<template>
	<view class="message">
		<!-- 有数据的 -->
		<view class="login-container" @click="loginContainer">
			<!-- 登录用户的信息 -->
			<!-- <button class="buttonchoose" type="balanced" open-type="chooseAvatar" @chooseavatar="onchooseavatar" > -->
			<view class="contact">
				<!-- <image :src="avatarUrl" mode="scaleToFill" class="image" />				 -->
				<image src="@/static/login/avatar1.png" mode="scaleToFill" class="image" />
			</view>
			<!-- </button> -->
			<view class="tips-text">
				<view style="font-size: 15px;">{{ userInfo.name ? userInfo.name : '未登录' }}</view>
				<view style="font-size: 12px;">
					<text style="margin-right: 5px">
						{{ userInfo.personType ? (userInfo.personType == 'policeman' ? '' : userInfo.personType == 'school.manager' ? '教育部门' :userInfo.personType == 'police.manager' ? '公安部门':userInfo.personType == 'guarder' ? '保安人员': '志愿者') : 'ID:' }}
					</text>
					<text>{{ userInfo.title ? userInfo.title : '未知' }}</text>---<text>{{ userInfo.station ? userInfo.station : '未选择学校' }}</text>
				</view>
			</view>
		</view>
		<!-- 用户信息 -->
		<view class="userIdexn">
			<view class="exit" @click="addExit(item.value)" v-for="(item, index) in datalist" :key="item.value">
				<view class="exitItem">
					<view class="exitItemindex">
						<image :src="item.url" mode="scaleToFill" class="image" />
					</view>
					<text style="margin-left: 30rpx;font-size: 12px;">{{ item.name }}</text>
				</view>
				<view style="margin-right: 40rpx">
					<text class="iconoscope"></text>
				</view>
			</view>
		</view>
		<view>
			<u-modal @cancel="show = false" zoom @confirm="confirm" :show="show" :asyncClose="true"
				:showCancelButton="true" width="500rpx" content='是否确认退出登录?'></u-modal>
		</view>

		<!-- <u-modal @confirm="confirmPrivacy" :show="showPrivacy" :title="title" width="300px">
			<view>在使用芙蓉安校服务之前,请仔细阅读<text style="color: skyblue;"
					@click="OpenPrivacyContract">{{ContractName}}</text>如果同意该指引,请点击同意开始使用本小程序
			</view>
		</u-modal> -->




	</view>
</template>

<script>
	import {
		mapGetters,
		mapMutations
	} from 'vuex';
	import quit from '../../static/login/quit.png';
	import uploading from '../../static/login/uploading.png';
	import opinions from '../../static/login/opinions.png';
	import {
		timestampFormatTime
	} from '@/utils/index.js';
	export default {
		data() {
			return {
				avatarUrl: '',
				datalist: [
					// {
					//   value: 1,
					//   name: '小程序简介',
					//   url: uploading
					// },
					{
						value: 0,
						name: '退出登录',
						url: quit
					},
					{
						value: 2,
						name: '修改用户信息',
						url: uploading
					},
					{
						value: 3,
						name: '意见收集',
						url: opinions
					},

				],
				baseURl: 'https://www.lonsungsh.com:8083',
				remark: '',
				show: false,
				showLogin: true,
				showPrivacy: false,
				title: '用户隐私保护提示',
				ContractName: '',




			};
		},
		computed: {
			// 拿取vuex数据
			...mapGetters({
				userInfo: 'users/getLoginInfo',
			})
		},
		onLoad() {},
		created() {
			this.showLogin = true

		},
		mounted() {},
		onShow() {
			if (this.userInfo.name) {
				uni.authorize({
					scope: "scope.userLocation",
					success: (res) => {
						wx.getPrivacySetting({
							success: (res) => {
								console.log(res);
								if (res.needAuthorization) {
									this.ContractName = res.privacyContractName
									setTimeout(() => {
										this.showPrivacy = true
									}, 100)

								}
								// this.ContractName = res.privacyContractName
							},
						})

					}
				})
			}
		},
		methods: {
			...mapMutations({
				clearuserInforma: 'users/clearuserInforma'
			}),
			// 获取用户的基本信息 授权之后
			// 点击退出跳转到登录页
			addExit(val) {
				switch (val) {
					case 0:
						if (this.userInfo.name) {
							this.show = true
						} else {
							uni.showToast({
								title: '无权限'
							});
						}
						break;
					case 1:
						uni.showToast({
							title: '还在编写中'
						});
						break;
					case 2:
						if (this.userInfo.name) {
							uni.navigateTo({
								url: `/pagesD/edituserinfo/edituserinfo`
							});
						} else {
							uni.showToast({
								title: '无权限'
							});
						}
						break;
					case 3:
						if (this.userInfo.name) {
							console.log(1111);
							uni.navigateTo({
								url: `/pagesD/collection/collection`
							});
						} else {
							uni.showToast({
								title: '无权限'
							});
						}
						break;


				}
			},
			confirm() {
				setTimeout(() => {
					// 2秒后自动关闭
					this.show = false;
					uni.navigateTo({
						url: '/pages/login/index'
					});
					this.clearuserInforma()
					uni.removeStorage({
						key: 'starLevel'
					})
				}, 1000)
			},
			loginContainer() {
				if (!this.userInfo.name) {
					uni.navigateTo({
						url: `/pages/login/index`
					});
				}
			},
			close() {
				this.showLogin = false;
			},

			OpenPrivacyContract() {
				// 打开隐私协议页面
				wx.openPrivacyContract({
					success: (res) => {
						console.log(res);
					}, // 打开成功
					fail: () => {}, // 打开失败
					complete: () => {}
				})
			},
			confirmPrivacy() {
				console.log(123123);
			},
			onchooseavatar(e) {
				var that = this;
				const picUploadData = {
					creator: that.userInfo.name,
					business: 'school.revise',
					type: 'image',
					deviceid: that.userInfo.id,
					createtime: timestampFormatTime(),
					description: '',
					comment: ''
				};
				return new Promise((resolve, reject) => {
					let a = uni.uploadFile({
						url: that.baseURl + '/mdev/picture/upload',
						filePath: e.detail.avatarUrl,
						name: 'file',
						header: {
							'Content-Type': 'multipart/form-data;charset=utf-8'
						},
						formData: {
							jsondata: JSON.stringify(picUploadData),
						},
						success: (res) => {
							setTimeout(() => {
								const resImage = JSON.parse(res.data)?.data.uri;
								that.avatarUrl = that.baseURl + resImage
								console.log(that.avatarUrl);
								// if (!that.imageUrlsDate.includes(resImage.uri)) {
								// 	that.imageUrlsDate.push(resImage.uri);
								// }
								resolve(that.avatarUrl)
							}, 1000)

						}
					});
				})
			},


		}
	};
</script>

<style scoped lang="scss">
	.message {
		// padding: 20rpx;
		height: 100vh;
		background-color: #fff;
	}

	.login-container {
		height: 280rpx;
		display: flex;
		align-items: center;
		background-image: url('../../static/login/banner.png');
		background-repeat: no-repeat;
		background-position: right;
		overflow: hidden;
		padding: 45rpx;
		box-sizing: border-box;

		.buttonchoose {
			margin: 0;
			border: none;
			background: transparent;
			outline: none;
			padding: 0;
		}

		.contact {
			height: 75rpx;
			width: 75rpx;
			border-radius: 50%;
			border: solid 1px gray;

			.image {
				width: 100%;
				height: 100%;
			}
		}

		.tips-text {
			display: flex;
			font-size: 28rpx;
			color: #fff;
			line-height: 50rpx;
			margin-left: 20rpx;
			flex-direction: column;
			justify-content: space-evenly;
		}
	}

	.userIdexn {
		// background-color: #fff;
		// height: 700rpx;
	}

	.exit {
		height: 100rpx;
		line-height: 40px;
		border-bottom: solid 0.5px #ebebf7;
		box-sizing: border-box;
		display: flex;
		justify-content: space-between;
		align-items: center;
		// margin-bottom: 30rpx;
		color: #7d7d7d;

		.exitItem {
			display: flex;
			align-items: center;
			margin-left: 30rpx;
		}

		.exitItemindex {
			height: 40rpx;
			width: 40rpx;
			border-radius: 50%;
			// border: solid 1px gray;
			display: block;
			line-height: 48rpx;

			image {
				width: 100%;
				height: 100%;
			}
		}

		.iconoscope {
			width: 8px;
			height: 8px;
			display: inline-block;
			border: solid 2px #ccc;
			/* margin-left: 10px; */
			-webkit-transform: rotate(45deg);
			transform: rotate(45deg);
			border-bottom: white;
			border-left: white;
		}
	}

	.clickLogin {
		height: 200rpx;
		text-align: center;
		overflow: hidden;
		display: flex;
		justify-content: center;
		align-items: center;

		.clickLoginIndex {
			width: 80%;
		}
	}

	.showPrivacy {
		width: 80%;
		height: 200px;
		border: 1px solid skyblue;
	}
</style>