<template>
	<view class="container">
		<view class="WechatUserInfo">
			<view class="left">
				<image class="avatarurl" :src="WechatUserInfo.avatarurl" mode="aspectFit"></image>
			</view>
			<view class="right">
				<view class="nickname">昵称：{{WechatUserInfo.nickname}}</view>
			</view>
			<van-cell-group class="cell-group">
				<van-cell label="点击可复制" center title="openid" @click="CellGroup(WechatUserInfo.openid)"
					:clickable="true" :value="WechatUserInfo.openid" />
				<van-cell label="点击可复制" center title="appid" @click="CellGroup(WechatUserInfo.appid)" :clickable="true"
					:value="WechatUserInfo.appid" />
				<van-cell label="点击可复制" center title="unionid" @click="CellGroup(WechatUserInfo.unionid)"
					:clickable="true" :value="WechatUserInfo.unionid" />
				<van-cell label="点击可复制" center title="用户渠道来源" @click="CellGroup(WechatUserInfo.subscribe)"
					:clickable="true" :value="WechatUserInfo.subscribe" />
				<van-cell label="点击可复制" center title="国家" @click="CellGroup(WechatUserInfo.country)" :clickable="true"
					:value="WechatUserInfo.country" />
				<van-cell label="点击可复制" center title="省份" @click="CellGroup(WechatUserInfo.province)" :clickable="true"
					:value="WechatUserInfo.province" />
				<van-cell label="点击可复制" center title="城市" @click="CellGroup(WechatUserInfo.city)" :clickable="true"
					:value="WechatUserInfo.city" />
				<!-- //性别 0：未知、1：男、2：女 -->
				<van-cell label="点击可复制" center title="性别" @click="CellGroup(WechatUserInfo.gender)" :clickable="true"
					:value="['未知','男','女'][WechatUserInfo.gender]" />
				<van-cell label="点击可复制" center title="语言" @click="CellGroup(WechatUserInfo.language)" :clickable="true"
					:value="WechatUserInfo.language" />
			</van-cell-group>
		</view>
	</view>
</template>

<script>
	import {
		Dialog
	} from 'vant';
	//公共参数
	var gHost = "https://" + window.location.host;
	if (window.location.protocol != "https:") {
		gHost = "http://" + window.location.host;
	}
	export default {
		name: "QueryMyWechat",
		data() {
			return {
				WechatUserInfo: {
					appid: "",
					avatarurl: "",
					city: "",
					country: "",
					gender: 1,
					id: 6496,
					language: "",
					nickname: "",
					openid: "",
					province: "",
					subscribe: "",
					unionid: ""
				}
			}
		},
		onLoad: function(options) {
			console.log(options)
			let ua = navigator.userAgent.toLowerCase();
			if (ua.indexOf('micromessenger') == -1) {
				Dialog({
					title: '系统提示',
					message: '请通过微信浏览器打开！'
				});
				return;
			}
			let {
				code,
				state
			} = options
			this.QueryMyWechatInfo({
				code,
				state
			})
		},
		mounted: function() {

		},
		methods: {
			async QueryMyWechatInfo(params) {
				try {
					let sessionid = await new Promise((resolve, reject) => {
						$.ajax({
							url: gHost + '/mp_wechat/x/access_token',
							type: "POST",
							dataType: "json",
							contentType: "application/x-www-form-urlencoded",
							async: false,
							data: params,
							success: function(resp1) {
								if (resp1.code != "10000") {
									reject(resp1)
								} else {
									resolve(resp1.results)
								}
							},
							error: function(err) {
								reject(err)
							}
						});
					})
					let results = await new Promise((resolve, reject) => {
						//查询微信信息
						$.ajax({
							url: gHost + '/mp_wechat/svmpwechat/QueryMyWechatInfo',
							type: "POST",
							dataType: "json",
							contentType: "application/x-www-form-urlencoded",
							async: false,
							data: {
								"mp_session_id": sessionid
							},
							success: function(resp2) {
								console.log(resp2)
								if (resp2.code != "10000") {
									weui.alert(resp2.message, function() {
										console.log('ok');
									}, {
										title: '提示'
									});
									reject(resp2.message)
								} else {
									resolve(resp2.results)
								}
							},
							error: function(err2) {
								weui.alert(err2.toString(), function() {
									console.log('ok');
								}, {
									title: 'ERROR'
								});
							}
						});
					})
					this.WechatUserInfo = results
				} catch (e) {
					//TODO handle the exception
					console.log(e);
					Dialog({
						title: '系统提示',
						message: '发生错误！'
					});
				}
			},
			CellGroup(value) {
				console.log(value);
				Dialog({
					title: '系统提示',
					message: '复制成功！'
				});
				this.$nextTick(function() {
					let clipboard = new ClipboardJS('.van-cell', {
						text: function() {
							return value
						}
					})
				})
			}
		}
	}
</script>

<style scoped>
	page {
		background-color: #f7f8fa;
	}

	.container {
		width: 700rpx;
		margin: 0 auto;
		background-color: #FFFFFF;
	}

	.WechatUserInfo {
		margin-top: 30rpx;
	}

	.WechatUserInfo .left {
		text-align: center;
		height: 250rpx;
		line-height: 250rpx;
	}

	.WechatUserInfo .right {
		text-align: center;
		height: 100rpx;
		line-height: 100rpx;
		font-size: 40rpx;
		font-weight: bold;
	}

	.WechatUserInfo .avatarurl {
		width: 200rpx;
		height: 200rpx;
		border-radius: 10rpx;
		position: relative;
		top: 30rpx;
	}

	.cell-group {
		margin-bottom: 100rpx;
	}
</style>
