优化权限

src/components/leftMenu.vue

@@ -1,32 +1,29 @@
 <template>
     <div class="left_menu_wrap">
-        <div class="item first" :class="{ online: socketStore.online }" @click="connectWsHandle">
-            <el-icon class="icon">
-                <Monitor />
-            </el-icon>
-            <el-text :type="socketStore.online ? 'success' : 'danger'">
-                <template v-if="socketStore.online">
-                    在线
-                </template>
-                <template v-else>
-                    离线
-                </template>
-            </el-text>
+        <div class="top_item_wra">
+            <div class="item first" :class="{ online: socketStore.online }" @click="connectWsHandle">
+                <el-icon class="icon">
+                    <Monitor />
+                </el-icon>
+                <el-text :type="socketStore.online ? 'success' : 'danger'">
+                    {{ socketStore.online ? '在线' : '离线' }}
+                </el-text>
+            </div>
+            <router-link class="item" :class="{ active: route.path == item.path }" v-for="item in store.menus"
+                :key="item.path" :to="item.path">
+                <el-icon class="icon">
+                    <component :is="item.icon" />
+                </el-icon>
+                <el-text class="text">{{ item.label }}</el-text>
+            </router-link>
+            <div class="item" @click="workRef.show()">
+                <el-icon class="icon">
+                    <component is="SwitchButton" />
+                </el-icon>
+                <el-text class="text">交班</el-text>
+            </div>
         </div>
-        <router-link class="item" :class="{ active: route.path == item.path }" v-for="item in menus" :key="item.path"
-            :to="item.path">
-            <el-icon class="icon">
-                <component :is="item.icon" />
-            </el-icon>
-            <el-text class="text">{{ item.label }}</el-text>
-        </router-link>
-        <div class="item" @click="workRef.show()">
-            <el-icon class="icon">
-                <component is="SwitchButton" />
-            </el-icon>
-            <el-text class="text">交班</el-text>
-        </div>
-        <div class="item more" @click="moreref.show()">
+        <div class="item" @click="moreref.show()">
             <el-icon class="icon">
                 <Operation />
             </el-icon>
@@ -42,62 +39,20 @@
 </template>
 
 <script setup>
-import { ref } from 'vue'
+import { ref, } from 'vue'
 import { useRoute } from 'vue-router'
 import { useSocket } from '@/store/socket.js'
+import { useUser } from '@/store/user.js'
 import more from '@/components/more.vue'
 import callNumber from './callNumber.vue'
 import work from '@/views/work/index.vue'
 
 const socketStore = useSocket()
-
 const route = useRoute()
 const moreref = ref(null)
 const callNumberRef = ref(null)
 const workRef = ref(null)
-
-const menus = ref([
-    {
-        label: '收银',
-        path: '/',
-        icon: 'ShoppingCartFull'
-    },
-    {
-        label: '台桌',
-        path: '/table',
-        icon: 'Reading'
-    },
-    {
-        label: '团购',
-        path: '/group_buy',
-        icon: 'Handbag'
-    },
-    {
-        label: '订单',
-        path: '/order',
-        icon: 'Tickets'
-    },
-    // {
-    //     label: '网络',
-    //     path: '/internat',
-    //     icon: 'Paperclip'
-    // },
-    {
-        label: '会员',
-        path: '/member',
-        icon: 'User'
-    },
-    {
-        label: '排队',
-        path: '/queue',
-        icon: 'Timer'
-    },
-    // {
-    //     label: '交班',
-    //     path: '/work',
-    //     icon: 'SwitchButton'
-    // }
-])
+const store = useUser()
 
 // 更新叫号记录
 function updateCallNumber() {
@@ -110,7 +65,6 @@ function openCall() {
 
 // 手动重新连接ws
 function connectWsHandle() {
-    // if (socketStore.online) return
     location.reload()
 }
 
@@ -203,9 +157,16 @@ defineExpose({
     background-color: #555;
     display: flex;
     flex-direction: column;
+    justify-content: space-between;
+
+    .top_item_wra {
+        display: flex;
+        flex-direction: column;
+    }
 
     .item {
-        flex: 1;
+        width: 100%;
+        height: 70px;
         display: flex;
         flex-direction: column;
         justify-content: center;
@@ -237,10 +198,6 @@ defineExpose({
             }
         }
 
-        &.more {
-            margin-top: 90px;
-        }
-
         .icon {
             color: #999;
             font-size: 22px;