后台系统点击登录按钮直接跳转到目标路由下,而不是首页
1.登录跳转页面限制,login.vue,注释掉跳转首页的逻辑,直接改为跳转到目标页的逻辑
handleLogin() {this.$refs.loginForm.validate(valid => {if (valid) {this.loading = trueif (this.loginForm.rememberMe) {Cookies.set("username", this.loginForm.username, { expires: 30 })Cookies.set("password", encrypt(this.loginForm.password), { expires: 30 })Cookies.set('rememberMe', this.loginForm.rememberMe, { expires: 30 })} else {Cookies.remove("username")Cookies.remove("password")Cookies.remove('rememberMe')}this.$store.dispatch("Login", this.loginForm).then(() => {// this.$router.push({ path: this.redirect || "/" }).catch(()=>{})this.$router.push({ path:"/attractingInvestmen/EnterpriseWarehouse" }).catch(()=>{})}).catch(() => {this.loading = falseif (this.captchaEnabled) {this.getCode()}})}})}2.修改首页路由为隐藏,router/index.js中,并改重定向路由

3.面包屑不再展示首页,Breadcrubm/index.vue,注释掉跳转首页的逻辑

4.面包屑下方的路由首页展示,layout/TagsView/index.vue,将代码修改为以下形式
<template><div id="tags-view-container" class="tags-view-container"><scroll-paneref="scrollPane"class="tags-view-wrapper"@scroll="handleScroll"><router-linkv-for="tag in filteredViews"ref="tag":key="tag.path":class="{ active: isActive(tag), 'has-icon': tagsIcon }":to="{ path: tag.path, query: tag.query, fullPath: tag.fullPath }"tag="span"class="tags-view-item":style="activeStyle(tag)"@click.middle.native="!isAffix(tag) ? closeSelectedTag(tag) : ''"@contextmenu.prevent.native="openMenu(tag, $event)"><svg-iconv-if="tagsIcon && tag.meta && tag.meta.icon && tag.meta.icon !== '#'":icon-class="tag.meta.icon"/>{{ tag.title }}<spanv-if="!isAffix(tag)"class="el-icon-close"@click.prevent.stop="closeSelectedTag(tag)"/></router-link></scroll-pane><ulv-show="visible":style="{ left: left + 'px', top: top + 'px' }"class="contextmenu"><li @click="refreshSelectedTag(selectedTag)"><i class="el-icon-refresh-right"></i> 刷新页面</li><li v-if="!isAffix(selectedTag)" @click="closeSelectedTag(selectedTag)"><i class="el-icon-close"></i> 关闭当前</li><li @click="closeOthersTags"><i class="el-icon-circle-close"></i> 关闭其他</li><li v-if="!isFirstView()" @click="closeLeftTags"><i class="el-icon-back"></i> 关闭左侧</li><li v-if="!isLastView()" @click="closeRightTags"><i class="el-icon-right"></i> 关闭右侧</li><li @click="closeAllTags(selectedTag)"><i class="el-icon-circle-close"></i> 全部关闭</li></ul></div>
</template><script>
import ScrollPane from "./ScrollPane";
import path from "path";export default {components: { ScrollPane },data() {return {visible: false,top: 0,left: 0,selectedTag: {},affixTags: [],};},computed: {// visitedViews() {// return this.$store.state.tagsView.visitedViews;// },visitedViews() {return this.$store.state.tagsView.visitedViews;},filteredViews() {return this.visitedViews.filter((view) => view.path !== "/index");},routes() {return this.$store.state.permission.routes;},theme() {return this.$store.state.settings.theme;},tagsIcon() {return this.$store.state.settings.tagsIcon;},},watch: {$route() {this.addTags();this.moveToCurrentTag();},visible(value) {if (value) {document.body.addEventListener("click", this.closeMenu);} else {document.body.removeEventListener("click", this.closeMenu);}},},mounted() {this.initTags();this.addTags();},methods: {isActive(route) {return route.path === this.$route.path;},activeStyle(tag) {if (!this.isActive(tag)) return {};return {"background-color": this.theme,"border-color": this.theme,};},isAffix(tag) {return tag.meta && tag.meta.affix;},// isFirstView() {// console.log('isFirstView',this.visitedViews);// try {// return (// this.selectedTag.fullPath === "/index" ||// this.selectedTag.fullPath === this.visitedViews[1].fullPath// );// } catch (err) {// return false;// }// },// isFirstView() {// console.log("isFirstView", this.visitedViews);// try {// // 过滤掉首页后,判断当前标签是否是第一个// const filteredViews = this.visitedViews.filter(// (view) => view.path !== "/index"// );// console.log("filteredViews", filteredViews);// return this.selectedTag.fullPath === filteredViews[0].fullPath;// } catch (err) {// return false;// }// },// isLastView() {// console.log("isLastView", this.visitedViews);// try {// return (// this.selectedTag.fullPath ===// this.visitedViews[this.visitedViews.length - 1].fullPath// );// } catch (err) {// return false;// }// },isFirstView() {// console.log("isFirstView", this.filteredViews);try {return this.selectedTag.fullPath === this.filteredViews[0].fullPath;} catch (err) {return false;}},isLastView() {// console.log("isLastView", this.filteredViews);try {return (this.selectedTag.fullPath ===this.filteredViews[this.filteredViews.length - 1].fullPath);} catch (err) {return false;}},filterAffixTags(routes, basePath = "/") {let tags = [];routes.forEach((route) => {// 添加条件判断,过滤掉首页if (route.meta && route.meta.affix && route.path !== "/index") {const tagPath = path.resolve(basePath, route.path);tags.push({fullPath: tagPath,path: tagPath,name: route.name,meta: { ...route.meta },});}if (route.children) {const tempTags = this.filterAffixTags(route.children, route.path);if (tempTags.length >= 1) {tags = [...tags, ...tempTags];}}});return tags;},// filterAffixTags(routes, basePath = '/') {// let tags = []// routes.forEach(route => {// if (route.meta && route.meta.affix) {// const tagPath = path.resolve(basePath, route.path)// tags.push({// fullPath: tagPath,// path: tagPath,// name: route.name,// meta: { ...route.meta }// })// }// if (route.children) {// const tempTags = this.filterAffixTags(route.children, route.path)// if (tempTags.length >= 1) {// tags = [...tags, ...tempTags]// }// }// })// return tags// },initTags() {const affixTags = (this.affixTags = this.filterAffixTags(this.routes));for (const tag of affixTags) {// Must have tag nameif (tag.name) {this.$store.dispatch("tagsView/addVisitedView", tag);}}},// addTags() {// const { name } = this.$route;// if (name) {// this.$store.dispatch("tagsView/addView", this.$route);// }// },addTags() {const { name, path } = this.$route;// 添加路径不等于/index的条件if (name && path !== "/index") {this.$store.dispatch("tagsView/addView", this.$route);}},moveToCurrentTag() {const tags = this.$refs.tag;this.$nextTick(() => {for (const tag of tags) {if (tag.to.path === this.$route.path) {this.$refs.scrollPane.moveToTarget(tag);// when query is different then updateif (tag.to.fullPath !== this.$route.fullPath) {this.$store.dispatch("tagsView/updateVisitedView", this.$route);}break;}}});},refreshSelectedTag(view) {this.$tab.refreshPage(view);if (this.$route.meta.link) {this.$store.dispatch("tagsView/delIframeView", this.$route);}},closeSelectedTag(view) {this.$tab.closePage(view).then(({ visitedViews }) => {if (this.isActive(view)) {this.toLastView(visitedViews, view);}});},closeRightTags() {this.$tab.closeRightPage(this.selectedTag).then((visitedViews) => {if (!visitedViews.find((i) => i.fullPath === this.$route.fullPath)) {this.toLastView(visitedViews);}});},closeLeftTags() {this.$tab.closeLeftPage(this.selectedTag).then((visitedViews) => {if (!visitedViews.find((i) => i.fullPath === this.$route.fullPath)) {this.toLastView(visitedViews);}});},closeOthersTags() {this.$router.push(this.selectedTag.fullPath).catch(() => {});this.$tab.closeOtherPage(this.selectedTag).then(() => {this.moveToCurrentTag();});},closeAllTags(view) {this.$tab.closeAllPage().then(({ visitedViews }) => {if (this.affixTags.some((tag) => tag.path === this.$route.path)) {return;}this.toLastView(visitedViews, view);});},toLastView(visitedViews, view) {const latestView = visitedViews.slice(-1)[0];if (latestView) {this.$router.push(latestView.fullPath);} else {// now the default is to redirect to the home page if there is no tags-view,// you can adjust it according to your needs.if (view.name === "Dashboard") {// to reload home pagethis.$router.replace({ path: "/redirect" + view.fullPath });} else {this.$router.push("/");}}},openMenu(tag, e) {const menuMinWidth = 105;const offsetLeft = this.$el.getBoundingClientRect().left; // container margin leftconst offsetWidth = this.$el.offsetWidth; // container widthconst maxLeft = offsetWidth - menuMinWidth; // left boundaryconst left = e.clientX - offsetLeft + 15; // 15: margin rightif (left > maxLeft) {this.left = maxLeft;} else {this.left = left;}this.top = e.clientY;this.visible = true;this.selectedTag = tag;},closeMenu() {this.visible = false;},handleScroll() {this.closeMenu();},},
};
</script><style lang="scss" scoped>
.tags-view-container {height: 34px;width: 100%;background: #fff;border-bottom: 1px solid #d8dce5;box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 0 3px 0 rgba(0, 0, 0, 0.04);.tags-view-wrapper {.tags-view-item {display: inline-block;position: relative;cursor: pointer;height: 26px;line-height: 26px;border: 1px solid #d8dce5;color: #495060;background: #fff;padding: 0 8px;font-size: 12px;margin-left: 5px;margin-top: 4px;&:first-of-type {margin-left: 15px;}&:last-of-type {margin-right: 15px;}&.active {background-color: #42b983;color: #fff;border-color: #42b983;&::before {content: "";background: #fff;display: inline-block;width: 8px;height: 8px;border-radius: 50%;position: relative;margin-right: 2px;}}}}.tags-view-item.active.has-icon::before {content: none !important;}.contextmenu {margin: 0;background: #fff;z-index: 3000;position: absolute;list-style-type: none;padding: 5px 0;border-radius: 4px;font-size: 12px;font-weight: 400;color: #333;box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.3);li {margin: 0;padding: 7px 16px;cursor: pointer;&:hover {background: #eee;}}}
}
</style><style lang="scss">
//reset element css of el-icon-close
.tags-view-wrapper {.tags-view-item {.el-icon-close {width: 16px;height: 16px;vertical-align: 2px;border-radius: 50%;text-align: center;transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);transform-origin: 100% 50%;&:before {transform: scale(0.6);display: inline-block;vertical-align: -3px;}&:hover {background-color: #b4bccc;color: #fff;}}}
}
</style>
5.点击logo和图标要改为跳转的目标页,而不是首页

