<template>
	<view class="page">
		<u-navbar title="工作台" :border-bottom="false" :background="bgc" back-icon-color="#262B37" title-color='#262B37'
			title-size='36' height='40' id="navbar" :custom-back="btns">
		</u-navbar>
		<image src="https://api.ccttiot.com/smartmeter/img/static/uAtuf76AiYArdJHLSjhO" class="imgbj" mode=""></image>
		<view class="listbox">
			<!-- <view class="gongxiang">
				<view class="top">
					共享设备与订单
				</view>
				<view class="listul">
					<view class="listul_item" @click="btnsb">
						<image src="https://api.ccttiot.com/smartmeter/img/static/uETwVx6uVaE9ro1nvcqm" mode=""></image>
						<view class="wz">设备管理</view>
					</view>
					<view class="listul_item" @click="btndp">
						<image src="https://api.ccttiot.com/smartmeter/img/static/u6oI46MALr6AhaQJx5gK" mode=""></image>
						<view class="wz">门店管理</view>
					</view>
					<view class="listul_item" @click="btnpage(3)">
						<image src="https://api.ccttiot.com/smartmeter/img/static/ur2eP5H3JCfOK6mLfloG" mode=""></image>
						<view class="wz">订单管理</view>
					</view>
					<view class="listul_item" @click="btnpage(4)">
						<image src="https://api.ccttiot.com/smartmeter/img/static/uuZkDhgdQoAOwLOAIeBS" mode=""></image>
						<view class="wz">退款审批</view>
					</view>
					<view class="listul_item">
						<image src="https://api.ccttiot.com/smartmeter/img/static/uIP0yWqUvEhRulj8pnWF" mode=""></image>
						<view class="wz">充值优惠</view>
					</view>
					<view class="listul_item" @click="btnpage(6)">
						<image src="https://api.ccttiot.com/smartmeter/img/static/uVlTMg8p52AQC38bGYR1" mode=""></image>
						<view class="wz">充值记录</view>
					</view>
					<view class="listul_item" @click="btnprice">
						<image src="https://api.ccttiot.com/smartmeter/img/static/uSg4eShAn6NjT0b3bbgK" mode=""></image>
						<view class="wz">收费模版</view>
					</view>
				</view>
			</view>
			<view class="gongxiang">
				<view class="top">
					货柜商品管理
				</view>
				<view class="listul" @click="btnwei">
					<view class="listul_item">
						<image src="https://api.ccttiot.com/smartmeter/img/static/u3WvXWhreMnYuHWBYanZ" mode=""></image>
						<view class="wz">货柜管理</view>
					</view>
					<view class="listul_item">
						<image src="https://api.ccttiot.com/smartmeter/img/static/uLEHydVzr5dckJUDPpFp" mode=""></image>
						<view class="wz">商品管理</view>
					</view>
					<view class="listul_item">
						<image src="https://api.ccttiot.com/smartmeter/img/static/uBHlYM37Nq7kqVxBLDPd" mode=""></image>
						<view class="wz">商品订单</view>
					</view>
					<view class="listul_item">
						<image src="https://api.ccttiot.com/smartmeter/img/static/u2vSFMVhYFT383G8g3hP" mode=""></image>
						<view class="wz">临期商品</view>
					</view>
					<view class="listul_item">
						<image src="https://api.ccttiot.com/smartmeter/img/static/u2Fw75BrIRB4g2dvXjh0" mode=""></image>
						<view class="wz">缺货设备</view>
					</view>
					<view class="listul_item">
						<image src="https://api.ccttiot.com/smartmeter/img/static/uMiIyAnGe2bgJ6OngG9C" mode=""></image>
						<view class="wz">销售统计</view>
					</view>
				</view>
			</view> -->
			<!-- <view class="gongxiang">
				<view class="top">
					其他
				</view>
				<view class="listul">
					<view class="listul_item" @click="btnpage(8)">
						<image src="https://api.ccttiot.com/smartmeter/img/static/uhOXbEruUPi4LwobH5j2" mode=""></image>
						<view class="wz">对账单</view>
					</view>
					<view class="listul_item" @click="btnwei">
						<image src="https://api.ccttiot.com/smartmeter/img/static/uUG8zQFENJMs5azjCMuQ" mode=""></image>
						<view class="wz">杆柜管理</view>
					</view>
					<view class="listul_item" @click="btnwei">
						<image src="https://api.ccttiot.com/smartmeter/img/static/uYxzaUTodBMnHowtv7bl" mode=""></image>
						<view class="wz">杆柜订单</view>
					</view>
					<view class="listul_item" @click="btnpage(7)">
						<image src="https://api.ccttiot.com/smartmeter/img/static/uPEgwjhXLbUeBWASW6Ws" mode=""></image>
						<view class="wz">保洁订单</view>
					</view>
					<view class="listul_item" @click="btnpage(2)">
						<image src="https://api.ccttiot.com/smartmeter/img/static/ubfpq3LLHb1eXehq8IuD" mode=""></image>
						<view class="wz">保洁管理</view>
					</view>
					<view class="listul_item" @click="btnpage(1)">
						<image src="https://api.ccttiot.com/smartmeter/img/static/u9ssRAyWpKMNA89117NB" mode=""></image>
						<view class="wz">合伙人管理</view>
					</view>
					<view class="listul_item" @click="btnpage(5)">
						<image src="https://api.ccttiot.com/smartmeter/img/static/uHQtbhwpFAMPjWkn0kw5" mode=""></image>
						<view class="wz">基础设置</view>
					</view>
					<view class="listul_item" @click="btnpage(9)">
						<image src="https://api.ccttiot.com/smartmeter/img/static/uRVPQmCpO1AxdDfDFKda" mode=""></image>
						<view class="wz">WIFI配置</view>
					</view>
					<view class="listul_item" @click="btnluru">
						<image src="https://api.ccttiot.com/smartmeter/img/static/uHQtbhwpFAMPjWkn0kw5" mode=""></image>
						<view class="wz">设备录入</view>
					</view>
				</view>
			</view>	 -->
			<view class="gongxiang" v-for="(item,index) in list" :key="index">
				<view class="top">
					{{item.menuName}}
				</view>
				<view class="listul">
					<view class="listul_item" v-for="(val,indexs) in item.children" :key="indexs" @click="btnurl(val.url)">
						<image :src="val.icon" mode=""></image>
						<view class="wz">{{val.menuName}}</view>
					</view>
				</view>
			</view>	
		</view>
         <tab-bars :indexs='0' style=""></tab-bars>
	</view>
</template>

<script>
	export default {
		data() {
			return {
                bgc: {
                	backgroundColor: "",
                },
				userobj:[],
				menuobj:[],
				yiyouobj:[],
				list:[]
			}
		},
		onLoad() {
            this.getinfo()
		},
		methods: {
			// 点击进行页面跳转
			btnurl(url){
				console.log(url);
				if(url == null){
					uni.showToast({
						title: '此功能暂未开放',
						icon: 'none',
						duration:2000
					})
				}else{
					uni.navigateTo({
						url:url
					})
				}
			},
			
			// 查询菜单列表
			getmenu(){
				this.$u.get('/app/appMenu/allList').then(res => {
				    if (res.code === 200) {
				        this.menuobj = res.data
				        let topLevelMenus = this.menuobj.filter(item => item.parentId == 0)
				        let menuMap = new Map(topLevelMenus.map(item => [item.menuId, { ...item, children: [] }]))
				        this.yiyouobj = this.menuobj.filter(item =>
				            this.userobj.appMenus.includes(item.menuId)
				        )
				        this.yiyouobj.forEach(item => {
				            if (menuMap.has(item.parentId)) {
				                menuMap.get(item.parentId).children.push(item)
				            }
				        })
				        this.list = Array.from(menuMap.values())
				    }
				})
			},
			// 查询个人信息
			getinfo(){
				this.$u.get(`/getAppInfo`).then(res => {
					if (res.code == 200) {
						this.userobj = res.user
						this.getmenu()
					}else if(res.code == 401){
						uni.reLaunch({
							url:'/pages/login/index'
						})
					}
				})
			},
			// 点击这些提示未开放
			btnwei(){
				uni.showToast({
					title: '此功能暂未开放',
					icon: 'none',
					duration:2000
				})
			},
			// 点击进行设备录入
			btnluru(){
				uni.navigateTo({
					url:'/page_user/luru'
				})
			},
			// 统一跳转
			btnpage(num){
				if(num == 3){  //跳转到订单详情
					uni.navigateTo({
						url:'/page_moban/orderlist'
					})
				}else if(num == 4){ //跳转到退款审核
					uni.navigateTo({ 
						url:'/page_moban/tuikuan'
					})
				}else if(num == 6){ //跳转到充值记录
					uni.navigateTo({
						url:'/page_moban/chongzhi'
					})
				}else if(num == 1){ //跳转到合伙人管理
					uni.navigateTo({
						url:'/page_moban/hehuoren' 
					})
				}else if(num == 2){ //跳转到保洁管理
					uni.navigateTo({
						url:'/page_moban/baojie'
					})
				}else if(num == 5){ //跳转到基础设置
					uni.navigateTo({
						url:'/page_moban/jichu'
					})
				}else if(num ==  7){ //跳转到保洁订单
					uni.navigateTo({
						url:'/page_moban/baojieorder'
					})
				}else if(num == 8){ //跳转到对账单页面
				uni.showToast({
					title: '此功能暂未开放',
					icon: 'none',
					duration:2000
				})
					// uni.navigateTo({
					// 	url:'/page_fenbaotwo/duizhangdan'
					// })
				}else if(num == 9){ //跳转到配置WIFI页面
					uni.navigateTo({
						url:'/page_fenbaotwo/wifipz'
					})
				}
			},
			// 跳转到收费模版
			btnprice(){
				uni.navigateTo({
					url:'/page_shanghu/pricemoben'
				})
			},
			// 自定义返回回到首页
			btns(){
				uni.reLaunch({
					url:'/pages/nearbystores/index'
				})
			},
			// 跳转到设备管理
			btnsb(){
				uni.navigateTo({
					url:'/page_shanghu/shebei'
				})
			},
			// 跳转到门店管理
			btndp(){
				uni.navigateTo({
					url:'/page_shanghu/dianpu'
				})
			},
			// 跳转到订单管理
			btndd(){
				uni.navigateTo({
					url:'/page_shanghu/dingdan'
				})
			},
			
		}
	}
</script>

<style lang="scss">
	page {
		background: #fff;
	}
	.listbox{
		.gongxiang{
			.top{
				padding: 40rpx 50rpx;
				box-sizing: border-box;
				font-size: 32rpx;
				color: #3D3D3D;
				font-weight: 600;
				padding-bottom: 0;
			}
			.listul{
				display: flex;
				flex-wrap: wrap;
				padding: 0 40rpx;
				box-sizing: border-box;
				.listul_item{
				    margin-top: 38rpx;
					width: 25%;
					text-align: center;
					image{
						width: 80rpx;
						height: 80rpx;
					}
					.wz{
						font-size: 28rpx;
						color: #3D3D3D;
					}
				}
			}
		}
		width: 680rpx;
		max-height: 1260rpx;
		background: #FFFFFF;
		box-shadow: 0rpx 8rpx 40rpx 0rpx rgba(72,137,59,0.1);
		border-radius: 24rpx 24rpx 24rpx 24rpx;
		margin: auto;
		overflow: scroll;
		margin-top: 38rpx;
		padding-bottom: 30rpx;
		box-sizing: border-box;
	}
    .imgbj{
    	width: 750rpx;
    	height: 100vh;
    	position: fixed;
    	top: 0;
    	left: 0;
    	z-index: -1;
    }

</style>