<template>
	<view class="personal">
		<view class="txbox">
			<image src="/static/avatar.png" class="tx"></image>
			<!-- 	<view class="text">admin</view> -->
		</view>
		<view class="">
			<u-cell-group >
				<u-cell-item  icon="account-fill" title="姓名" :arrow="false">{{userName}}</u-cell-item>
				<u-cell-item v-if="userInfo!=null" icon="file-text" title="部门" :arrow="false">{{userInfo.dept.name}}</u-cell-item>
				<u-cell-item v-if="userInfo!=null" icon="photo" title="岗位" :arrow="false">{{(userInfo.posts || []).map(post => post.name).join(',')}}</u-cell-item>
				<u-cell-item icon="level" v-if="userInfo!=null" title="角色" :arrow="false">{{(userInfo.roles || []).map(role => role.name).join(',')}}</u-cell-item>
				<u-cell-item icon="trash" title="清除缓存" @click="clear()" ></u-cell-item>
				<u-cell-item icon="edit-pen" title="修改密码" @click="modifiedPassWord()" ></u-cell-item>
				<u-cell-item icon="order" title="版本号" :arrow="false" @click="test111"  >{{version}}</u-cell-item>
				<!-- #ifdef APP -->
				<u-cell-item icon="reload" title="检查更新" @click="update">{{version}}</u-cell-item>
				<!-- #endif -->
				
			</u-cell-group>
		</view>
		
		<view>
			<button  type="primary" style="margin:40rpx;"  @click="handlerlogout">退出登录</button>
		</view>

	</view>
</template>

<script setup>
	import {
		logout,
		getUserProfile
	} from '@/api/request2.js';
	import store from '@/store'
	import {
		clearCacheData
	} from '@/common/directory.js';
	import {
		removeToken
	} from '@/common/utils/auth'
	
	// #ifdef APP-PLUS
	import {
		appUpdate
	} from "@/common/appUpdate.js"
	// #endif
	import {
		ref,
		reactive,
		nextTick,
		createApp
	} from "vue";
	import {
		onLoad
	} from "@dcloudio/uni-app";
	const app = createApp({});
	// app.component({
	// });
	const userName = ref(store.state.user.id);
	let test = ref("123");
	let version = ref();
	let userInfo = ref(null);
	onLoad(() => {
		getAppVersion()
		getUserProfile().then(res => {
			userInfo.value = res.data
			// nextTick(()=>{
			// 	const userInfo = res.data.nickname
			// 	 console.log("打印",userInfo)
			// 	})

		})
		uni.$on('getName', function(data) {
				console.log('我在B页面选择了:', data);
				uni.$off('getName'); //关闭监听
			})
	});


	function handlerlogout() {
		clearStorage();
		// #ifdef H5
		uni.reLaunch({
			url: '../login/index'
		})
		// #endif
		
		// #ifdef APP
		 plus.runtime.quit()
		// #endif
		
		
	};

	function clearStorage() {
		uni.clearStorageSync()
		removeToken();

	};
	
	function test111(){
		uni.navigateTo({
			url:"./test"
		})
	}

	function clear() {
		clearCacheData()
		uni.showToast({
			title: "清理缓存成功"
		})
	}

	function getAppVersion() {
		const systemInfo = uni.getSystemInfoSync();
		// #ifdef H5
		version.value = systemInfo.appVersion;
		console.log(systemInfo.appVersion, '版本号');
		// #endif

		// #ifdef APP
		version.value = systemInfo.appWgtVersion;
		// #endif

	}

	function update() {
		console.log("update");
		appUpdate()
	}
	function modifiedPassWord() {
		uni.navigateTo({
			url:"./passwordpage"
		})
	}

</script>

<style>
	.txbox {
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.tx {
		width: 200rpx;
		height: 200rpx;
		margin: 30rpx 0 30rpx;
		border-radius: 150upx;
	}

	.text {
		font-size: 20upx;
		text-align: center;
	}

	.footbox {
		display: flex;
		align-items: center;

	}

	.footbtn {
		margin-top: 120rpx;
		width: 300rpx;
		border-radius: 50rpx;
		background-color: #fff;
		font-size: .825rem;
		color: #333;
		line-height: 90rpx;
	}
</style>