mirror of
https://gitee.com/lab1024/smart-admin.git
synced 2025-10-02 02:06:38 +08:00
79 lines
1.7 KiB
Vue
79 lines
1.7 KiB
Vue
<template>
|
|
<div class="ts-crumbs rc-max-width--xl rc-padding-y--md" v-if="showTab" :style="crumbStyle">
|
|
<el-breadcrumb separator-class="el-icon-arrow-right">
|
|
<el-breadcrumb-item to="/" >{{ this.homepageName }}</el-breadcrumb-item>
|
|
|
|
<el-breadcrumb-item :to=item.path v-for="(item, index) in displayData"
|
|
:key="index">{{ item.title }}</el-breadcrumb-item>
|
|
</el-breadcrumb>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { mapState, mapMutations } from "vuex";
|
|
import tabs from "~/components/tabs.vue";
|
|
export default {
|
|
props:["crumbs","crumbStyle"],
|
|
name:"crumbs",
|
|
data() {
|
|
return {
|
|
displayData:[],
|
|
homepageName:'定制营养方案',
|
|
nameMapping:{
|
|
'/productdetails/productlist':'产品分类',
|
|
'/usersearch/search':'产品搜索',
|
|
'/personal/mypersonal':'个人中心',
|
|
'/personal/usermember/':'会员权益',
|
|
'/personal/integral/':'积分明细'
|
|
},
|
|
};
|
|
},
|
|
created(){
|
|
if(this.showTab != false)
|
|
this.showTab=true;
|
|
this.build();
|
|
},
|
|
watch: {
|
|
crumbs(val) {
|
|
this.crumbs = val;
|
|
this.build();
|
|
}
|
|
},
|
|
mounted() {
|
|
},
|
|
|
|
methods: {
|
|
...mapMutations(["changemessage",'selectMenu']),
|
|
build() {
|
|
let _self = this;
|
|
this.displayData=[];
|
|
this.crumbs.forEach(function(ele,index){
|
|
let displayObj= {path:'',title:''};
|
|
if(ele.path) {
|
|
displayObj.path = ele.path;
|
|
for(let path in _self.nameMapping) {
|
|
if(ele.path.indexOf(path)>-1) {
|
|
displayObj.path = path;
|
|
displayObj.title = _self.nameMapping[path];
|
|
}
|
|
}
|
|
}
|
|
if(ele.title) {
|
|
displayObj.title = ele.title;
|
|
}
|
|
_self.displayData.push(displayObj);
|
|
});
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style lang="less" scoped>
|
|
/deep/.el-breadcrumb__inner.is-link:hover {
|
|
color:#E2001A;
|
|
}
|
|
.ts-crumbs{
|
|
padding-left:1.25rem;
|
|
}
|
|
</style>
|