Parcourir la source

菜单显示调整

lxf il y a 1 an
Parent
commit
a66ff29d86
1 fichiers modifiés avec 15 ajouts et 58 suppressions
  1. 15 58
      src/components/headerBar/header-bar.vue

+ 15 - 58
src/components/headerBar/header-bar.vue

@@ -4,8 +4,6 @@
       <ul class="nav">
         <div class="logo" style="display: flex; align-items: center; justify-content: center">
           <img :src="'/img/img_logo.png'" style="height: 46px" alt="" />
-          <!-- <img v-if="!logoUrl" :src="'/img/logo2.png'" />
-          <el-image v-else style="width: 120px; height: 30px" :src="logoUrl" fit="scale-down" /> -->
         </div>
         <li class="header-bar-hover-warp nav-li" :class="isChildMenu ? 'active' : ''">
           <div @click.stop="isChildMenu = !isChildMenu" class="menu-modal">
@@ -53,17 +51,19 @@
               </div>
               <div class="menu-warp" v-show="leftBanerType == 1">
                 <div class="first-order-title">{{ menuName }}</div>
-                <ul class="second-level">
-                  <div v-for="(i, index) in activeLeftData" :key="index">
-                    <li v-if="i.isNone" class="menu-ul" style="cursor: auto"></li>
-                    <li class="menu-title" v-else-if="i.isTitle">
-                      <a v-if="i.icon && i.icon !== '#'" :class="'iconfont icon-' + i.icon" style="margin-right: 4px"></a><span>{{ i.menuName }}</span>
+                <el-row>
+                  <el-col :span="3" v-for="(item, index) in activeLeftData" :key="index">
+                    <li class="menu-title">
+                      <a v-if="item.icon && item.icon !== '#'" :class="'iconfont icon-' + item.icon" style="margin-right: 4px"></a>
+                      <span>{{ item.menuName }}</span>
                     </li>
-                    <li v-else class="menu-ul" @click="commonsBannerToRouter(i)" style="cursor: pointer">
-                      <span>{{ i.menuName }}</span>
-                    </li>
-                  </div>
-                </ul>
+                    <div v-for="(itemChild, key) in item.children" :key="key">
+                      <li class="menu-ul" @click="commonsBannerToRouter(itemChild)" style="cursor: pointer">
+                        <span>{{ itemChild.menuName }}</span>
+                      </li>
+                    </div>
+                  </el-col>
+                </el-row>
               </div>
               <div class="menu-warp" v-show="leftBanerType == 2">
                 <div class="first-order-title">{{ $t("header.commonFunctions") }}</div>
@@ -115,12 +115,6 @@
         </div>
       </ul>
       <div class="fr">
-        <!-- <el-badge style="cursor: pointer" class="badge" @click="noticeTableModal = true">
-          <el-icon :size="20">
-            <BellFilled />
-          </el-icon>
-        </el-badge>
-        <notice v-model="noticeTableModal"></notice> -->
         <el-dropdown @command="handleCommand" class="right-menu-item hover-effect" trigger="click">
           <div class="dropdown-box">
             {{ userStore.user.nickName }}
@@ -148,7 +142,7 @@
 import { ElMessageBox, ElMessage } from "element-plus";
 import useUserStore from "/src/store/modules/user";
 import "@/components/headerBar/header.scss";
-import notice from "/src/components/notice/index";
+import { useRouter } from "vue-router";
 
 const router = useRouter();
 const userStore = useUserStore();
@@ -158,14 +152,12 @@ const isChildMenu = ref(false);
 const autoListChidrenNum = ref(0);
 const isEidtType = ref(false);
 const leftBanerType = ref(2);
-const noticeTableModal = ref(false);
 const commonsRouterList = ref([]);
 const activeLeftData = ref({});
-const openLeftBaner = (i, index) => {
+const openLeftBaner = (i) => {
   leftBanerType.value = 1;
-  activeLeftData.value = i;
   menuName.value = i.menuName;
-  routerInit(i);
+  activeLeftData.value = i.children;
 };
 let menuName = ref("");
 const userMenuEdit = () => {
@@ -206,41 +198,6 @@ const addCommonsRouter = (index, jindex, nindex, n) => {
   commonsRouterList.value.push(n);
   sidebarRoutersCopy.value[index].children[jindex].children[nindex].isCommonsBanner = true;
 };
-const routerInit = (item) => {
-  //二维转一维
-  const arr = [];
-  for (let i = 0; i < item.children.length; i++) {
-    const element = item.children[i];
-    if (element.type === 1) {
-      element.isTitle = true;
-      arr.push(element);
-    }
-    if (element.children && element.children.length > 0) {
-      for (let j = 0; j < element.children.length; j++) {
-        const jelement = element.children[j];
-        jelement.isTitle = false;
-        if (jelement.type === 1) {
-          arr.push({ ...jelement, fatherPath: element.path });
-        }
-      }
-    }
-  }
-  //添加剩余子元素,补齐一列
-  for (let i = 0; i < arr.length; i++) {
-    const element = arr[i];
-    if (element.isTitle) {
-      //判断余数加上子项列会不会爆掉
-      if (element.children && element.children.length > 0 && (i % 11) + element.children.length + 1 > 11 && element.children.length < 11) {
-        let num = 11 - (i % 11);
-        for (let j = 0; j < num; j++) {
-          arr.splice(i, 0, { ...element, isNone: true });
-          i++;
-        }
-      }
-    }
-  }
-  activeLeftData.value = arr;
-};
 function handleCommand(command) {
   switch (command) {
     case "setLayout":