Browse Source

修正菜单显示bug

孙旺 1 year ago
parent
commit
4fcdf76a5d
1 changed files with 104 additions and 114 deletions
  1. 104 114
      src/pages/globalPages/home.vue

+ 104 - 114
src/pages/globalPages/home.vue

@@ -1,133 +1,123 @@
 <template>
-  <view class="container">
-    <view class="pages">
-      <Home ref="homeRef"
-            @play='play'
-            v-if="current==0" />
-      <Equipment ref="equipmentRef"
-                 v-if="current==1" />
-      <Commodity ref="commodityRef"
-                 v-if="current==2" />
-      <Account ref="accountRef"
-               v-if="current==3" />
-    </view>
+	<view class="container">
+		<view class="pages">
+			<Home ref="homeRef" @play='play' v-if="tabName=='平台运维'" />
+			<Equipment ref="equipmentRef" v-if="tabName=='质检&出厂'" />
+			<Commodity ref="commodityRef" v-if="tabName=='数据中心'" />
+			<Account ref="accountRef" v-if="tabName=='商户运营'" />
+		</view>
 
-    <u-tabbar v-if="list&&list.length>0"
-              :value="current"
-              @change="tabChange"
-              :fixed="true"
-              :safeAreaInsetBottom="true">
-      <u-tabbar-item v-for="item in list"
-                     :key="item.id"
-                     :text="item.name"
-                     @click="tabClick(item)">
-        <template #active-icon>
-          <image class="u-page__item__slot-icon"
-                 :src="tabIcon[item.name][1]"></image>
-        </template>
-        <template #inactive-icon>
-          <image class="u-page__item__slot-icon"
-                 :src="tabIcon[item.name][0]"></image>
-        </template>
-      </u-tabbar-item>
-    </u-tabbar>
-  </view>
+		<u-tabbar v-if="list&&list.length>0" :value="current" @change="tabChange" :fixed="true"
+			:safeAreaInsetBottom="true">
+			<u-tabbar-item v-for="item in list" :key="item.id" :text="item.name" @click="tabClick(item)">
+				<template #active-icon>
+					<image class="u-page__item__slot-icon" :src="tabIcon[item.name][1]"></image>
+				</template>
+				<template #inactive-icon>
+					<image class="u-page__item__slot-icon" :src="tabIcon[item.name][0]"></image>
+				</template>
+			</u-tabbar-item>
+		</u-tabbar>
+	</view>
 </template>
 
 <script setup>
-import Home from './components/home.vue'
-import Equipment from './components/equipment.vue'
-import Commodity from './components/commodity.vue'
-import Account from './components/account.vue'
-import {
-  watch,
-  computed,
-  onBeforeMount,
-  onMounted,
-  reactive,
-  toRefs,
-  ref
-} from "vue";
-import {
-  onShow,
-  onLoad
-} from '@dcloudio/uni-app'
+	import Home from './components/home.vue'
+	import Equipment from './components/equipment.vue'
+	import Commodity from './components/commodity.vue'
+	import Account from './components/account.vue'
+	import {
+		watch,
+		computed,
+		onBeforeMount,
+		onMounted,
+		reactive,
+		toRefs,
+		ref
+	} from "vue";
+	import {
+		onShow,
+		onLoad
+	} from '@dcloudio/uni-app'
 
-import usePermissionStore from '@/stores/permission.js'
+	import usePermissionStore from '@/stores/permission.js'
 
-const current = ref(0)
-const client = ref(null)
-const tabName = ref(null)
-const tabIcon = ref({
-  '平台运维': ['../../static/images/tabbar/home.png', '../../static/images/tabbar/home_.png'],
-  '质检&出厂': ['../../static/images/tabbar/equipment.png', '../../static/images/tabbar/equipment_.png'],
-  '数据中心': ['../../static/images/tabbar/commodity.png', '../../static/images/tabbar/commodity_.png'],
-  '商户运营': ['../../static/images/tabbar/mine.png', '../../static/images/tabbar/mine_.png'],
-  // '商管端': ['../../static/images/tabbar/equipment.png', '../../static/images/tabbar/equipment_.png'],
-})
+	const current = ref(0)
+	const client = ref(null)
+	const tabName = ref(null)
+	const tabIcon = ref({
+		'平台运维': ['../../static/images/tabbar/home.png', '../../static/images/tabbar/home_.png'],
+		'质检&出厂': ['../../static/images/tabbar/equipment.png', '../../static/images/tabbar/equipment_.png'],
+		'数据中心': ['../../static/images/tabbar/commodity.png', '../../static/images/tabbar/commodity_.png'],
+		'商户运营': ['../../static/images/tabbar/mine.png', '../../static/images/tabbar/mine_.png'],
+		// '商管端': ['../../static/images/tabbar/equipment.png', '../../static/images/tabbar/equipment_.png'],
+	})
 
-// 菜单逻辑
-const menu = ref(usePermissionStore().permissions_menu)
-const list = computed(() => {
-  let list = []
-  menu.value.forEach(i => {
-    list.push({
-      name: i.meta.title,
-      id: i.id
-    })
-  })
-  return list
-})
+	// 菜单逻辑
+	const menu = ref(usePermissionStore().permissions_menu)
 
-onShow(() => {
-  // 版本自动更新代码
-  const updateManager = wx.getUpdateManager()
-  updateManager.onUpdateReady(function () {
-    wx.showModal({
-      title: '更新检测',
-      content: '检测到新版本,是否重启小程序?',
-      success: function (res) {
-        if (res.confirm) {
-          // 新的版本已经下载好,调用 applyUpdate 应用新版本并重启
-          updateManager.applyUpdate()
-        }
-      }
-    })
-  })
-  updateManager.onUpdateFailed(function () {
-    // 新的版本下载失败
-    wx.showModal({
-      title: '已有新版本咯',
-      content: '请您删除当前小程序,重新打开呦~',
-      showCancel: false
-    })
-  })
-})
+	const list = computed(() => {
+		let list = []
+		menu.value.forEach(i => {
+			list.push({
+				name: i.meta.title,
+				id: i.id
+			})
+		})
+		return list
+	})
 
-onLoad((o) => {
-  console.log('onLoad', o)
-})
+	tabName.value = list.value[0].name
 
+	onShow(() => {
+		// 版本自动更新代码
+		const updateManager = wx.getUpdateManager()
+		updateManager.onUpdateReady(function() {
+			wx.showModal({
+				title: '更新检测',
+				content: '检测到新版本,是否重启小程序?',
+				success: function(res) {
+					if (res.confirm) {
+						// 新的版本已经下载好,调用 applyUpdate 应用新版本并重启
+						updateManager.applyUpdate()
+					}
+				}
+			})
+		})
+		updateManager.onUpdateFailed(function() {
+			// 新的版本下载失败
+			wx.showModal({
+				title: '已有新版本咯',
+				content: '请您删除当前小程序,重新打开呦~',
+				showCancel: false
+			})
+		})
+	})
 
+	onLoad((o) => {
+		console.log('onLoad', o)
+	})
 
-function tabChange (e) {
-  current.value = e
-}
 
-function tabClick (e) {
-  tabName.value = e.name
-}
+
+	function tabChange(e) {
+		current.value = e
+	}
+
+	function tabClick(e) {
+		tabName.value = e.name
+	}
 </script>
 
 <style lang="scss">
-.container {
-  .pages {
-    height: 100%;
-  }
+	.container {
+		.pages {
+			height: 100%;
+		}
 
-  .u-page__item__slot-icon {
-    width: 44rpx;
-    height: 44rpx;
-  }
-}
+		.u-page__item__slot-icon {
+			width: 44rpx;
+			height: 44rpx;
+		}
+	}
 </style>