59 lines
1.4 KiB
Vue
59 lines
1.4 KiB
Vue
<template>
|
|
<el-breadcrumb separator="/">
|
|
<el-breadcrumb-item v-for="(item,index) in breadcrumbList" :key="index">
|
|
<!-- <span class="redirect" v-if="item.name=='详情'||item.name=='商品管理'" @click="handleRedirectBack(item.name)">返回上一级</span>-->
|
|
<span class="no-redirect" v-if="index==breadcrumbList.length-1" >{{ item.name }}</span>
|
|
<span class="redirect" v-else @click="handleRedirect(item.path)">{{ item.name }}</span>
|
|
<!-- <span class="redirect" v-else @click="handleRedirectBack">返回上一级</span>-->
|
|
|
|
</el-breadcrumb-item>
|
|
</el-breadcrumb>
|
|
|
|
</template>
|
|
<script setup>
|
|
import {ref, watch} from 'vue'
|
|
import {useRoute, useRouter} from 'vue-router'
|
|
|
|
const route = useRoute();
|
|
const router = useRouter();
|
|
|
|
const breadcrumbList = ref([]);
|
|
|
|
const handleRedirectBack=(name)=>{
|
|
if (name=='详情')
|
|
{
|
|
router.push('/employee')
|
|
}else{
|
|
router.push('/business')
|
|
}
|
|
|
|
|
|
}
|
|
const handleRedirect = (path) => {
|
|
router.push('/home')
|
|
}
|
|
|
|
const initBreadcrumbList = () => {
|
|
breadcrumbList.value = route.matched;
|
|
}
|
|
watch(route, () => {
|
|
initBreadcrumbList();
|
|
console.log(route.matched)
|
|
//console.log("breadcrumbList"+JSON.stringify(breadcrumbList))
|
|
}, {deep: true, immediate: true})
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
.no-redirect {
|
|
cursor: text;
|
|
}
|
|
|
|
.redirect {
|
|
color: #666;
|
|
font-weight: 600;
|
|
cursor: pointer;
|
|
|
|
&:hover {
|
|
color: #304156
|
|
}
|
|
}
|
|
</style> |