面包屑修改

1 week ago · b9d95fc394
parent 0012583bc0
commit b9d95fc394
3 changed files with 146 additions and 48 deletions
--- a/src/components/Breadcrumb/index.vue
+++ b/src/components/Breadcrumb/index.vue
@ -2,7 +2,11 @@
  <el-breadcrumb class="app-breadcrumb" separator="/">
    <transition-group name="breadcrumb">
      <el-breadcrumb-item v-for="(item, index) in levelList" :key="item.path">
-        <span v-if="item.redirect === 'noRedirect' || index == levelList.length - 1" class="no-redirect">{{ item.meta.title }}</span>
+        <span
+          v-if="item.redirect === 'noRedirect' || index == levelList.length - 1"
+          class="no-redirect"
+          >{{ item.meta.title }}</span
+        >
        <a v-else @click.prevent="handleLink(item)">{{ item.meta.title }}</a>
      </el-breadcrumb-item>
    </transition-group>
@ -10,80 +14,173 @@
 </template>

 <script setup>
-import usePermissionStore from '@/store/modules/permission'
+import usePermissionStore from "@/store/modules/permission";

-const route = useRoute()
-const router = useRouter()
-const permissionStore = usePermissionStore()
-const levelList = ref([])
+const route = useRoute();
+const router = useRouter();
+const permissionStore = usePermissionStore();
+const levelList = ref([]);

 function getBreadcrumb() {
  // only show routes with meta.title
-  let matched = []
-  const pathNum = findPathNum(route.path)
-  // multi-level menu
-  if (pathNum > 2) {
-    const reg = /\/\w+/gi
-    const pathList = route.path.match(reg).map((item, index) => {
-      if (index !== 0) item = item.slice(1)
-      return item
-    })
-    getMatched(pathList, permissionStore.defaultRoutes, matched)
+  // 当前全部侧边栏
+  let sidebarRouters = permissionStore.sidebarRouters;
+  let matched = route.matched.filter((item) => item.meta && item.meta.title);
+  if (matched[0].path == "/assetsAuth") {
+    // 管理端--资产管理--新增资产
+    const activeRoute = sidebarRouters.filter(
+      (item) => item.path == "/assetsManage"
+    );
+    const childrenRoute = activeRoute[0].children;
+    levelList.value = [
+      activeRoute[0],
+      childrenRoute[Number(matched[0].meta.type)],
+      matched[0],
+    ];
+  } else if (
+    matched[0].path == "/taskInfo" ||
+    matched[0].path == "/taskAudit"
+  ) {
+    // 管理端--任务管理--任务审核/任务详情
+    const activeRoute = sidebarRouters.filter(
+      (item) => item.path == "/" && item.children[0].path == "task"
+    );
+    levelList.value = [activeRoute[0].children[0], matched[0]];
+  } else if (
+    matched[0].path == "/mytaskInfo" ||
+    matched[0].path == "/mytaskAudit"
+  ) {
+    // 单位端--我的任务--资产核查/任务详情
+    const activeRoute = sidebarRouters.filter(
+      (item) => item.path == "/" && item.children[0].path == "myTask"
+    );
+    levelList.value = [activeRoute[0].children[0], matched[0]];
+  } else if (matched[0].path == "/myAssetsAuth") {
+    // 单位端--我的资产--资产详情
+    const activeRoute = sidebarRouters.filter(
+      (item) => item.path == "/myAssets"
+    );
+    const childrenRoute = activeRoute[0].children;
+    levelList.value = [
+      activeRoute[0],
+      childrenRoute[Number(matched[0].meta.type)],
+      matched[0],
+    ];
+  } else if (matched[0].path == "/taskAuditInfo") {
+    // 管理端--任务管理--任务审核--资产审核
+    const activeRoute = sidebarRouters.filter(
+      (item) => item.path == "/" && item.children[0].path == "task"
+    );
+    const route = sidebarRouters.filter((item) => item.path == "");
+    const twoActiveRoute = route[0].children.filter(
+      (item) => item.path == "taskInfo"
+    );
+    levelList.value = [
+      activeRoute[0].children[0],
+      twoActiveRoute[0],
+      matched[0],
+    ];
+  } else if (matched[0].path == "/taskAuditInfolishichakan") {
+    // 管理端--任务管理--任务审核--任务管理历史详情
+    const activeRoute = sidebarRouters.filter(
+      (item) => item.path == "/" && item.children[0].path == "task"
+    );
+    const route = sidebarRouters.filter((item) => item.path == "");
+    const twoActiveRoute = route[0].children.filter(
+      (item) => item.path == "taskInfo"
+    );
+    levelList.value = [
+      activeRoute[0].children[0],
+      twoActiveRoute[0],
+      matched[0],
+    ];
+  } else if (matched[0].path == "/mytaskAuditInfo") {
+    // 单位端--我的任务--资产核查--资产审核详情
+    const activeRoute = sidebarRouters.filter(
+      (item) => item.path == "/" && item.children[0].path == "myTask"
+    );
+    const route = sidebarRouters.filter((item) => item.path == "");
+    const twoActiveRoute = route[0].children.filter(
+      (item) => item.path == "mytaskInfo"
+    );
+    levelList.value = [
+      activeRoute[0].children[0],
+      twoActiveRoute[0],
+      matched[0],
+    ];
+  } else if (matched[0].path == "/unitAuth") {
+    // 管理端--单位管理--新增单位/修改单位/查看单位
+    const activeRoute = sidebarRouters.filter(
+      (item) => item.path == "/" && item.children[0].path == "unit"
+    );
+    levelList.value = [activeRoute[0].children[0], matched[0]];
+  } else if (matched[0].path == "/assetsAuthRecord") {
+    // 单位端--资产填报记录--查看详情/修改资产
+    const activeRoute = sidebarRouters.filter(
+      (item) => item.path == "/" && item.children[0].path == "assetRecord"
+    );
+    levelList.value = [activeRoute[0].children[0], matched[0]];
+  } else if (matched[0].path == "/unitAssetsAuth") {
+    // 管理端--单位自主填报--查看详情/审核资产
+    const activeRoute = sidebarRouters.filter(
+      (item) => item.path == "/" && item.children[0].path == "unitFill"
+    );
+    levelList.value = [activeRoute[0].children[0], matched[0]];
  } else {
-    matched = route.matched.filter((item) => item.meta && item.meta.title)
+    levelList.value = matched.filter(
+      (item) => item.meta && item.meta.title && item.meta.breadcrumb !== false
+    );
  }
-  // 判断是否为首页
-  if (!isDashboard(matched[0])) {
-    matched = [{ path: "/index", meta: { title: "首页" } }].concat(matched)
-  }
-  levelList.value = matched.filter(item => item.meta && item.meta.title && item.meta.breadcrumb !== false)
-}
+};
 function findPathNum(str, char = "/") {
-  let index = str.indexOf(char)
-  let num = 0
+  let index = str.indexOf(char);
+  let num = 0;
  while (index !== -1) {
-    num++
-    index = str.indexOf(char, index + 1)
+    num++;
+    index = str.indexOf(char, index + 1);
  }
-  return num
+  return num;
 }
 function getMatched(pathList, routeList, matched) {
-  let data = routeList.find(item => item.path == pathList[0] || (item.name += '').toLowerCase() == pathList[0])
+  let data = routeList.find(
+    (item) =>
+      item.path == pathList[0] || (item.name += "").toLowerCase() == pathList[0]
+  );
  if (data) {
-    matched.push(data)
+    matched.push(data);
    if (data.children && pathList.length) {
-      pathList.shift()
-      getMatched(pathList, data.children, matched)
+      pathList.shift();
+      getMatched(pathList, data.children, matched);
    }
  }
 }
 function isDashboard(route) {
-  const name = route && route.name
+  const name = route && route.name;
  if (!name) {
-    return false
+    return false;
  }
-  return name.trim() === 'Index'
+  return name.trim() === "Index";
 }
 function handleLink(item) {
-  const { redirect, path } = item
+  const { redirect, path } = item;
  if (redirect) {
-    router.push(redirect)
-    return
+    router.push(redirect);
+    return;
  }
-  router.push(path)
+  router.push(path);
 }

 watchEffect(() => {
  // if you go to the redirect page, do not update the breadcrumbs
-  if (route.path.startsWith('/redirect/')) {
-    return
+  if (route.path.startsWith("/redirect/")) {
+    return;
  }
-  getBreadcrumb()
-})
-getBreadcrumb()
+  getBreadcrumb();
+});
+getBreadcrumb();
 </script>

-<style lang='scss' scoped>
+<style lang="scss" scoped>
 .app-breadcrumb.el-breadcrumb {
  display: inline-block;
  font-size: 14px;
--- a/src/layout/index.vue
+++ b/src/layout/index.vue
@ -5,7 +5,7 @@
    <div :class="{ hasTagsView: needTagsView, sidebarHide: sidebar.hide }" class="main-container">
      <div :class="{ 'fixed-header': fixedHeader }">
        <navbar @setLayout="setLayout" />
-        <tags-view v-if="needTagsView" />
+        <!-- <tags-view v-if="needTagsView" /> -->
      </div>
      <app-main />
      <settings ref="settingRef" />
--- a/src/router/index.js
+++ b/src/router/index.js
@ -61,12 +61,13 @@ export const constantRoutes = [
    path: '',
    component: Layout,
    redirect: '/index',
+    hidden: true,
    children: [
      {
        path: '/index',
        component: () => import('@/views/index'),
        name: 'Index',
-        meta: { title: '首页', icon: 'dashboard', affix: true }
+        meta: { title: '首页', icon: 'dashboard', affix: true, breadcrumb: false }
      }
    ]
  },