面包屑调整

src/components/app-breadcrumb/app-breadcrumb.vue

 <template>
-  <el-breadcrumb
-    class="app-breadcrumb"
-    separator="/"
-  >
+    <el-breadcrumb class="app-breadcrumb"  separator="/">
     <transition-group name="breadcrumb">
-      <el-breadcrumb-item
-        v-for="(item, index) in breadcrumbs"
-        :key="item.path"
-      >
-        <span
-          v-if="index === breadcrumbs.length-1"
-          class="no-redirect"
-        >{{  $t(item.meta.caption) }}</span>
-        <a
-          v-else
-          @click.prevent="handleLink(item)"
-        >{{  $t(item.meta.caption) }}</a>
+      <el-breadcrumb-item v-for="(item, index) in breadcrumbs"  :key="item.id">
+        <span v-if="index === breadcrumbs.length-1" class="no-redirect">{{  $t(item.title) }}</span>
+        <a v-else @click.prevent="handleLink(item)">{{  $t(item.title) }}</a>
       </el-breadcrumb-item>
     </transition-group>
   </el-breadcrumb>
@@ -24,14 +12,32 @@
 <script lang="ts">
 import { Component, Vue, Watch, Prop } from 'vue-property-decorator'
 import { RouteRecord, Route } from 'vue-router'
+import NavDataService from '@/service/app/navdata-service';
 
 @Component({
 })
 export default class Breadcrumb extends Vue {
 
-  private breadcrumbs: RouteRecord[] = [];  //面包屑列表
+  /**
+   * 面包屑列表
+   *
+   * @memberof Breadcrumb
+   */
+  private breadcrumbs: RouteRecord[] = [];
   
-  @Prop() public defPSAppView: any; //默认视图
+  /**
+   * 默认视图标识
+   *
+   * @memberof Breadcrumb
+   */
+  @Prop() public indexViewTag: string;
+
+  /**
+   * 首页路径
+   *
+   * @memberof Breadcrumb
+   */
+  @Prop() public indexViewPath: string;
 
   /**
    * 监听路由
@@ -58,23 +64,29 @@ export default class Breadcrumb extends Vue {
    * @memberof Breadcrumb
    */
   private getBreadcrumb() {
-    this.breadcrumbs = this.$route.matched.filter((item) => {
-        return item.meta && item.meta.caption
-      })
-    if(this.defPSAppView){
-      /**如果配置了默认视图,给面包屑第一级赋值默认视图为首页 */
-    }
+    let navDataService = NavDataService.getInstance();
+    this.breadcrumbs = navDataService.getNavData();
   }
 
   /**
-   * 单机面包屑
+   * 面包屑点击行为
    * 
    * @memberof Breadcrumb
    */
   private handleLink(item: any) {
-    this.$router.push(item).catch(err => {
-      console.warn(err);
-    });
+    // 首页
+    if(Object.is(item.id,this.indexViewTag)){
+      if(this.$route.matched && this.$route.matched.length >0){
+        this.$router.push(`/${this.indexViewPath}`);
+      }
+    }else{
+      // 非首页
+      this.$router.push(item.path).catch(err => {
+        console.warn(err);
+      });
+    }
+    let navDataService = NavDataService.getInstance();
+    navDataService.removeNavData(item.id);
   }
 }
 </script>