fec2cdcb by 任超
2 parents 526dd3b0 d47dfe39
1 <template>
2 <div class="breadcrumb">
3 <el-breadcrumb class="app-breadcrumb" separator-class="el-icon-arrow-right">
4 <transition-group name="breadcrumb">
5 <el-breadcrumb-item v-for="(item, index) in levelList" :key="item.path">
6 <span
7 v-if="
8 item.redirect === 'noRedirect' || index == levelList.length - 1
9 "
10 class="no-redirect"
11 >{{ item.meta.title }}</span
12 >
13 <a v-else @click.prevent="handleLink(item)">{{ item.meta.title }}</a>
14 </el-breadcrumb-item>
15 </transition-group>
16 </el-breadcrumb>
17 </div>
18 </template>
19
20 <script>
21 import pathToRegexp from "path-to-regexp";
22
23 export default {
24 data() {
25 return {
26 levelList: null,
27 };
28 },
29 watch: {
30 $route() {
31 this.getBreadcrumb();
32 },
33 },
34 created() {
35 this.getBreadcrumb();
36 },
37 methods: {
38 getBreadcrumb() {
39 // only show routes with meta.title
40 let matched = this.$route.matched.filter(
41 (item) => item.meta && item.meta.title
42 );
43 this.levelList = matched.filter(
44 (item) => item.meta && item.meta.title
45 );
46 },
47 isDashboard(route) {
48 const name = route && route.name;
49 if (!name) {
50 return false;
51 }
52 return (
53 name.trim().toLocaleLowerCase() === "Dashboard".toLocaleLowerCase()
54 );
55 },
56 pathCompile(path) {
57 const { params } = this.$route;
58 var toPath = pathToRegexp.compile(path);
59 return toPath(params);
60 },
61 handleLink(item) {
62 // const { redirect, path } = item;
63 // if (redirect) {
64 // this.$router.push(redirect);
65 // return;
66 // }
67 // this.$router.push(path);
68 },
69 },
70 };
71 </script>
72
73 <style lang="scss" scoped>
74 .breadcrumb {
75 margin: 15px auto 0;
76 box-sizing: border-box;
77 text-indent: 16px;
78 }
79 .breadcrumb1366 {
80 padding: 10px 0 !important;
81 }
82 .isFullScreen{
83 width: calc(100% - 20px);
84 margin: 0 auto;
85 padding: 10px!important;
86 }
87 .cur-location {
88 font-size: 16px;
89 color: white;
90 line-height: 40px;
91 float: left;
92 img {
93 position: relative;
94 top: 3px;
95 margin-right: 4px;
96 }
97 }
98 .app-breadcrumb.el-breadcrumb {
99 display: inline-block;
100 font-size: 14px;
101 // line-height: 40px;
102 .no-redirect {
103 color: white;
104 cursor: text;
105 }
106 }
107 .el-breadcrumb__inner a,
108 .el-breadcrumb__inner.is-link {
109 color: white;
110 cursor: text;
111 font-weight: normal;
112 }
113 // .el-breadcrumb__inner a:hover,
114 // .el-breadcrumb__inner.is-link:hover {
115 // text-decoration: underline;
116 // }
117 </style>
1 <template> 1 <template>
2 <section class="app-main"> 2 <section class="app-main">
3 <!-- <Breadcrumb v-if="judgeRoute()" /> -->
3 <transition name="fade-transform" mode="out-in"> 4 <transition name="fade-transform" mode="out-in">
4 <router-view /> 5 <router-view />
5 </transition> 6 </transition>
6 </section> 7 </section>
7 </template> 8 </template>
8 <script> 9 <script>
10 import Breadcrumb from "@/components/Breadcrumb/index";
9 export default { 11 export default {
10 name: 'AppMain', 12 name: 'AppMain',
13 components: {
14 Breadcrumb
15 },
16 methods: {
17 judgeRoute(){
18 if (this.$route.path == '/home' || this.$route.path.indexOf('jsbwcx') > -1) {
19 return false
20 }else{
21 return true
22 }
23 }
24 },
11 computed: { 25 computed: {
12 key () { 26 key () {
13 return this.$route.path 27 return this.$route.path
......
...@@ -92,6 +92,7 @@ export const asyncRoutes = [ ...@@ -92,6 +92,7 @@ export const asyncRoutes = [
92 { 92 {
93 path: '/jktj', 93 path: '/jktj',
94 component: Layout, 94 component: Layout,
95 meta: { title: '统计监控', icon: 'sqcx'},
95 children: [ 96 children: [
96 { 97 {
97 path: 'ywltj', 98 path: 'ywltj',
...@@ -176,7 +177,7 @@ export const asyncRoutes = [ ...@@ -176,7 +177,7 @@ export const asyncRoutes = [
176 { 177 {
177 path: '/busineInfo', 178 path: '/busineInfo',
178 component: Layout, 179 component: Layout,
179 meta: { title: '接入业务信息', icon: 'sqcx', breadcrumb: false }, 180 meta: { title: '不动产数据', icon: 'sqcx'},
180 redirect: '/busineInfo/landOwnership', 181 redirect: '/busineInfo/landOwnership',
181 alwaysShow: true, 182 alwaysShow: true,
182 name: 'busineInfo', 183 name: 'busineInfo',
...@@ -277,7 +278,7 @@ export const asyncRoutes = [ ...@@ -277,7 +278,7 @@ export const asyncRoutes = [
277 { 278 {
278 path: '/system', 279 path: '/system',
279 component: Layout, 280 component: Layout,
280 meta: { title: '系统管理', icon: 'sqcx', breadcrumb: false }, 281 meta: { title: '运维中心', icon: 'sqcx', breadcrumb: false },
281 redirect: '/system/dictionaries', 282 redirect: '/system/dictionaries',
282 alwaysShow: true, 283 alwaysShow: true,
283 name: 'system', 284 name: 'system',
......