<template>
	<view class="titles">个人中心</view>
	<image class="usebg" src="/static/userbg.png"></image>
	<view class="userviews" @click="gologin" v-if="!(users?.user_id)">
		<image src="/static/userimg.png"></image>
		<view>
			<view>未登录</view>
		</view>
	</view>
	<view class="userviews" v-if="users?.user_id">
		<image src="/static/userimg.png"></image>
		<view>
			<view>{{users.real_name}}</view>
			<view>
				<view>
					<!-- {{warehouseName.departmentName}} -->
				</view>
				<view @click="showwhselist">
					<view>{{users.role_name}}-{{warehouseName.name}}</view>
					<image src="/static/rigthviewb.png"></image>
				</view>
			</view>
		</view>
	</view>
	<view class="btsview">
		<view v-for="item in butlist" @click="checkitem(item)">
			<view>
				<image :src="item.icon"></image>
				<view>
					{{item.name}}
				</view>
			</view>
			<view>
				<image src="/static/rigthview.png"></image>
			</view>
		</view>
	</view>
	<view class="butout" @click="removeall">
		退出登录
	</view>
	<view class="bgmabx" v-if="showck" @click="showck=false">
		<view class="changkus" @click.stop.prevent>
			<view class="tis">
				<image class="bgimgs" src="/static/tpbg.png"></image>
				<image class="ckbgcc" src="/static/changku.png"></image>
				<view class="titlck">选择仓库</view>
				<scroll-view scroll-y="true" class="scvuew">
					<view class="maboxs">
						<view @click="ckeckitemck(item)" :class="item.name==checkitems.name?'items xzck':'items'"
							v-for="item in warehouseList">
							{{item.name}}
						</view>
					</view>
				</scroll-view>
				<view class="submitcheck" @click="sbckck">确认选择</view>
			</view>
		</view>
	</view>
	<view class="zhanwei"></view>
	<tiplist ref="tiplists"></tiplist>
	<tips ref="tip"></tips>
</template>

<script lang="ts" setup>
	import { reactive, ref, toRefs } from "vue";
	import { getMyWarehouseList, preserveCurrentWarehouse, AppPdaversiondetail } from '@/api/user.js'
	import {
		onShow,
		onLoad,
		onHide,
		onPullDownRefresh
	} from '@dcloudio/uni-app'
	import utils from '@/utils/utils.js'
	let users = ref<any>(null)
	const tiplists = ref(null)
	const tip = ref(null)
	let warehouseName = ref(null)
	let butlist = ref([
		{ icon: '/static/usericon1.png', name: '通讯录', type: 1 },
		{ icon: '/static/usericon2.png', name: '计件工资', type: 2 },
		{ icon: '/static/usericon3.png', name: '系统设置', type: 3 },
		{ icon: '/static/usericon4.png', name: '安全设置', type: 4 },
		{ icon: '/static/usericon5.png', name: '关于我们', type: 5 },
		{ icon: '/static/usericon6.png', name: '检测更新', type: 6 },
		{ icon: '/static/usericon7.png', name: '分享', type: 7 },
		{ icon: '/static/usericon8.png', name: '切换账号', type: 8 },
	])
	let details = reactive({
		showck: false,
		warehouseList: [],
		checkitems: {} as any
	})
	onShow(() => {
		users.value = uni.getStorageSync('userinfo')
		warehouseName.value = uni.getStorageSync('checkname')
	})

	// 下拉刷新
	onPullDownRefresh(() => {
		setTimeout(() => {

			// 关闭刷新动画
			uni.stopPullDownRefresh()
		}, 1000)
	})

	function ckeckitem(item) {
		details.showck = item
	}
	function ckeckitemck(item) {
		details.checkitems = item
	}

	async function sbckck() {
		if (!details.checkitems.id) {
			uni.showToast({
				title: '没有选择仓库，请先选择仓库',
				icon: 'none'
			})
			utils.ttsspke('没有选择仓库，请先选择仓库')
			return
		}

		let resdata = await preserveCurrentWarehouse(details.checkitems)
		uni.setStorageSync('checkname', details.checkitems)
		details.showck = false
		uni.showToast({
			title: '切换成功',
			icon: 'none'
		})
		utils.ttsspke('切换成功')
	}
	function gologin() {
		uni.navigateTo({
			url: '/pages/login/login'
		})
	}
	async function showwhselist() {
		let res = await getMyWarehouseList({})
		console.log(res.data);
		details.warehouseList = res.data

		details.showck = true
	}
	function checkitem(item) {
		if (item.type == 1) {

		} else if (item.type == 5) {
			uni.navigateTo({
				url: '/pagesUser/pages/about/about'
			})
		} else if (item.type == 6) {
			updateApp()
		} else if (item.type == 8) {
			gologin()
		}
	}
	function removeall() {
		const res = uni.getStorageInfoSync();
		res.keys.map(item => {
			if (item == 'loginuser' || item == 'HistoryDate' || item == 'setip' || item == 'checkname' || item.indexOf('IMAGE_CACHE_INFO') != -1) {
				return
			}
			uni.removeStorageSync(item)
		})
		uni.reLaunch({
			url: '/pages/login/login'
		})
		console.log(res.currentSize);
		console.log(String(res.limitSize));
	}
	async function updateApp() {
		// 获取版本信息
		// let version = await utils.getversion()
		let version = {
			version: '1.0.9',
			pkName: 'com.hwy.pda'
		}
		console.log("version 版本>>>>", version)
		let data = {
			betenantCode: uni.getStorageSync('userinfo').tenant_id,
			versionCode: version.version.split('.').join(''),
			versionType: version.pkName.indexOf('test') != -1 ? '1' : version.pkName.indexOf('bate') != -1 ? '2' : '3',
		}
		console.log('data>>>>', data);
		let response = await AppPdaversiondetail(data)
		if (response.code == 200 && Object.keys(response.data).length !== 0) {
			console.log("res.data", response.data);
			console.log('有可更新包');
			// 是否开启无感更新
			if (response.data.noSensation == '2' && response.data.link.indexOf('wgt') != -1) {
				utils.updatefile1(response.data.link)
			} else {
				tip.value.setdetails({
					title: '提示',
					content: '检测到有新版本，请问是否更新？',
					confirmTxt: '更新',
					isshow: true,
					isshowcancel: true,
					success: async () => {
						// 下载更新包
						utils.updatefile(response.data.link)
						tip.value.setisshow(false)
					},
					cancel: () => {
						tip.value.setisshow(false)
						if (response.data.isUpdates == '2') {
							plus.runtime.quit();
						}
					},
					close: () => {
						tip.value.setisshow(false)
						if (response.data.isUpdates == '2') {
							plus.runtime.quit();
						}
					}
				})
			}
		} else {
			uni.showToast({
				title: '已是最新版本',
				icon: 'none'
			})
		}
	}
	const {
		showck,
		warehouseList,
		checkitems
	} = toRefs(details)
</script>

<style lang="scss">
	.bgmabx {
		position: fixed;
		left: 0;
		top: 0;
		background-color: #00000050;
		width: 100vw;
		height: 100vh;
		z-index: 9999999999999;

		.changkus {
			width: 100vw;
			box-sizing: border-box;
			background-color: #FFFFFF;
			position: absolute;
			bottom: 0;
			left: 0;
			border-radius: 30upx 30upx 0 0;
			box-sizing: border-box;

			// padding: 30upx 0;
			.tis {
				position: relative;
				display: flex;
				align-items: center;
				flex-direction: column;
			}

			.bgimgs {
				position: absolute;
				left: 0;
				top: 0;
				width: 100vw;
				height: 100%;
			}

			.ckbgcc {
				position: absolute;
				top: -150upx;
				right: 20upx;
				width: 260upx;
				height: 260upx;
			}

			.titlck {
				width: 650upx;
				font-size: 34upx;
				font-weight: 500;
				color: #020B18;
				padding-top: 30upx;
			}

			.scvuew {
				width: 576upx;
				height: 470rpx;
				margin-top: 40upx;
				margin-bottom: 20upx;

				.maboxs {
					display: flex;
					flex-wrap: wrap;
					align-items: center;

					.xzck {
						background-color: #faf2e9 !important;
						border-color: #D3832A !important;
						color: #D3832A !important;
					}

					.items {
						&:nth-child(odd) {
							margin-right: 20upx;
						}

						width: 272upx;
						height: 72upx;
						background-color: #FFFFFF;
						border-radius: 8upx 8upx 8upx 8upx;
						opacity: 1;
						border: 2upx solid #EEEEEE;
						display: flex;
						align-items: center;
						justify-content: center;
						font-size: 32rpx;
						font-weight: 400;
						color: #90A0AF;
						margin-bottom: 20upx;
					}
				}
			}

			.submitcheck {
				width: 686upx;
				height: 100upx;
				background: #D3832A;
				border-radius: 16upx;
				display: flex;
				align-items: center;
				justify-content: center;
				font-size: 32upx;
				font-weight: 400;
				color: #FFFFFF;
				margin-bottom: 30upx;
				position: relative;
			}
		}
	}

	.titles {
		position: absolute;
		left: 50%;
		top: 70upx;
		transform: translate(-50%);
		font-size: 36upx;
		font-weight: 400;
		color: #FFFFFF;
		z-index: 5;
	}

	.butout {
		width: 400upx;
		height: 88upx;
		background: #edd9c3;
		border-radius: 8upx 8upx 8upx 8upx;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 32upx;
		font-weight: 500;
		color: #D3832A;
		margin: auto;
		margin-top: 60upx;
		box-sizing: border-box;
	}

	.zhanwei {
		width: 100%;
		height: 80upx;
	}

	.btsview {
		position: relative;
		display: flex;
		flex-direction: column;
		width: 100%;
		padding: 26upx;
		box-sizing: border-box;
		border-radius: 30upx 30upx 0 0;
		margin-top: 50upx;
		background-color: #ffffff;
		padding-bottom: 0upx;

		>view {
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 40upx;
			box-sizing: border-box;
			border-bottom: 2upx solid #EEEEEE;
			padding-right: 0;
			padding-left: 20upx;

			&:nth-last-child(1) {
				border-bottom: none;
			}

			>view {
				&:nth-of-type(1) {
					display: flex;
					align-items: center;
					justify-content: center;

					>image {
						width: 40upx;
						height: 40upx;
						margin-right: 20upx;
					}

					>view {
						font-size: 32upx;
						font-weight: 500;
						color: #3D3D3D;
					}
				}

				&:nth-of-type(2) {
					>image {
						width: 32upx;
						height: 32upx;
					}
				}
			}
		}
	}

	.userviews {
		display: flex;
		align-items: center;
		position: relative;
		width: 560upx;
		margin: auto;
		margin-top: 200upx;

		>image {
			width: 160upx;
			height: 160upx;
			box-sizing: border-box;
			margin-right: 24upx;
		}

		>view {
			width: 400upx;
			display: flex;
			flex-direction: column;
			align-items: flex-start;
			color: #ffffff;

			>view {
				display: flex;
				flex-direction: column;
				align-items: flex-start;

				&:nth-of-type(1) {
					font-size: 40upx;
					font-weight: 700;
					margin-bottom: 30upx;
				}

				>view {
					display: flex;
					align-items: center;

					&:nth-of-type(1) {
						font-size: 32upx;
						font-weight: 700;
						margin-bottom: 10upx;
					}

					&:nth-of-type(2) {
						font-size: 28upx;
					}

					>image {
						width: 32upx;
						height: 32upx;
					}
				}
			}
		}
	}

	.usebg {
		width: 100%;
		height: 476upx;
		position: absolute;
		left: 0;
		top: 0;
	}

	.login {
		width: 260upx;
		height: 90upx;
		display: flex;
		align-items: center;
		justify-content: center;
		background-color: #0073ff;
		color: #ffffff;
		border-radius: 90upx;
		margin: auto;
		margin-top: 180upx;
	}

	.contmabox {
		display: flex;
		flex-direction: column;
		width: 100%;
		height: 400upx;
		background-color: #FA8C16da;
	}
</style>