Skip to content

bdc / bdcjg-web

Go to a project
Toggle navigation
Toggle navigation pinning
238f0a96 by 任超
Options

style:面包屑

1 parent 24811f05
Inline Side-by-side
Showing 1 changed file with 18 additions and 12 deletions
1 <template> 1 <template>
2 <el-breadcrumb class="breadcrumb" separator-class="el-icon-arrow-right"> 2 <div class="breadcrumb-con">
3 <span class="fl">当前页面：</span> 3 <el-breadcrumb class="breadcrumb" separator-class="el-icon-arrow-right">
4 <transition-group name="breadcrumb"> 4 <span class="fl">当前页面：</span>
5 <el-breadcrumb-item v-for="(item, index) in levelList" :key="item.path"> 5 <transition-group name="breadcrumb">
6 <span @click.prevent="handleLink(item)">{{ item.meta.title }}</span> 6 <el-breadcrumb-item v-for="(item, index) in levelList" :key="item.path">
7 </el-breadcrumb-item> 7 <span @click.prevent="handleLink(item)">{{ item.meta.title }}</span>
8 </transition-group> 8 </el-breadcrumb-item>
9 </el-breadcrumb> 9 </transition-group>
10 </el-breadcrumb>
11 </div>
10 </template> 12 </template>
11 13
12 <script> 14 <script>
...@@ -55,13 +57,17 @@ export default { ...@@ -55,13 +57,17 @@ export default {
55 </script> 57 </script>
56 58
57 <style lang="scss" scoped> 59 <style lang="scss" scoped>
60 .breadcrumb-con {
61 padding-bottom: 5px;
62 border-bottom: 1px solid #458ACF;
63 margin: 8px 0;
64 }
65
58 .breadcrumb { 66 .breadcrumb {
59 box-sizing: border-box;
60 text-indent: 10px; 67 text-indent: 10px;
61 background: linear-gradient(90deg, #0047B8 0%, rgba(0, 26, 95, 0.1) 100%); 68 background: linear-gradient(90deg, #0047B8 0%, rgba(0, 26, 95, 0.1) 100%);
62 line-height: 32px; 69 line-height: 32px;
63 color: #FFFFFF; 70 color: #02D9FD;
64 margin-bottom: 8px;
65 } 71 }
66 72
67 /deep/.el-icon-arrow-right { 73 /deep/.el-icon-arrow-right {
...@@ -73,7 +79,7 @@ export default { ...@@ -73,7 +79,7 @@ export default {
73 } 79 }
74 80
75 /deep/.el-breadcrumb__inner { 81 /deep/.el-breadcrumb__inner {
76 color: #FFFFFF !important; 82 color: #02D9FD !important;
77 } 83 }
78 84
79 .breadcrumb1366 { 85 .breadcrumb1366 {
......