提交 652341a2 编写于 作者: tony001's avatar tony001

全局导航路由模式调整

上级 7bfe3bd0
...@@ -2,8 +2,8 @@ ...@@ -2,8 +2,8 @@
<el-breadcrumb class="app-breadcrumb" separator="/"> <el-breadcrumb class="app-breadcrumb" separator="/">
<transition-group name="breadcrumb"> <transition-group name="breadcrumb">
<el-breadcrumb-item v-for="(item, index) in breadcrumbs" :key="item.id"> <el-breadcrumb-item v-for="(item, index) in breadcrumbs" :key="item.id">
<span v-if="index === breadcrumbs.length-1" class="no-redirect">{{ $t(item.title) }}</span> <span v-if="index === breadcrumbs.length-1" class="no-redirect">{{ item.title }}</span>
<a v-else @click.prevent="handleLink(item)">{{ $t(item.title) }}</a> <a v-else @click.prevent="handleLink(item)">{{ item.title }}</a>
</el-breadcrumb-item> </el-breadcrumb-item>
</transition-group> </transition-group>
</el-breadcrumb> </el-breadcrumb>
...@@ -13,6 +13,7 @@ ...@@ -13,6 +13,7 @@
import { Component, Vue, Watch, Prop } from 'vue-property-decorator' import { Component, Vue, Watch, Prop } from 'vue-property-decorator'
import { RouteRecord, Route } from 'vue-router' import { RouteRecord, Route } from 'vue-router'
import NavDataService from '@/service/app/navdata-service'; import NavDataService from '@/service/app/navdata-service';
import {Subscription } from 'rxjs';
@Component({ @Component({
}) })
...@@ -24,6 +25,13 @@ export default class Breadcrumb extends Vue { ...@@ -24,6 +25,13 @@ export default class Breadcrumb extends Vue {
* @memberof Breadcrumb * @memberof Breadcrumb
*/ */
private breadcrumbs: Array<any> = []; private breadcrumbs: Array<any> = [];
/**
* 导航服务
*
* @memberof Breadcrumb
*/
private navDataService = NavDataService.getInstance();
/** /**
* 默认视图标识 * 默认视图标识
...@@ -40,14 +48,13 @@ export default class Breadcrumb extends Vue { ...@@ -40,14 +48,13 @@ export default class Breadcrumb extends Vue {
@Prop() public indexViewPath!: string; @Prop() public indexViewPath!: string;
/** /**
* 监听路由 * 导航服务事件
* *
* @memberof Breadcrumb * @public
*/ * @type {(Subscription | undefined)}
@Watch('$route') * @memberof Dev
private onRouteChange(route: Route) { */
this.getBreadcrumb() public serviceStateEvent: Subscription | undefined;
}
/** /**
* vue 生命周期 * vue 生命周期
...@@ -55,7 +62,12 @@ export default class Breadcrumb extends Vue { ...@@ -55,7 +62,12 @@ export default class Breadcrumb extends Vue {
* @memberof Breadcrumb * @memberof Breadcrumb
*/ */
created() { created() {
this.getBreadcrumb() this.getBreadcrumb();
this.serviceStateEvent = this.navDataService.serviceState.subscribe(({ action, data }) => {
if (Object.is(action, 'refresh')) {
this.getBreadcrumb();
}
});
} }
/** /**
...@@ -64,8 +76,8 @@ export default class Breadcrumb extends Vue { ...@@ -64,8 +76,8 @@ export default class Breadcrumb extends Vue {
* @memberof Breadcrumb * @memberof Breadcrumb
*/ */
private getBreadcrumb() { private getBreadcrumb() {
let navDataService = NavDataService.getInstance(); this.breadcrumbs = this.navDataService.getNavData();
this.breadcrumbs = navDataService.getNavData(); this.$forceUpdate();
} }
/** /**
...@@ -85,9 +97,20 @@ export default class Breadcrumb extends Vue { ...@@ -85,9 +97,20 @@ export default class Breadcrumb extends Vue {
console.warn(err); console.warn(err);
}); });
} }
let navDataService = NavDataService.getInstance(); this.navDataService.removeNavData(item.id);
navDataService.removeNavData(item.id);
} }
/**
* 组件销毁
*
* @memberof Breadcrumb
*/
public destroyed() {
if (this.viewStateEvent) {
this.viewStateEvent.unsubscribe();
}
}
} }
</script> </script>
......
...@@ -247,12 +247,15 @@ export default class EditViewEngine extends ViewEngine { ...@@ -247,12 +247,15 @@ export default class EditViewEngine extends ViewEngine {
*/ */
public setTabCaption(info: string): void { public setTabCaption(info: string): void {
let viewdata: any = this.view.model; let viewdata: any = this.view.model;
if (viewdata && info && !Object.is(info, '') && this.view.$tabPageExp && (viewdata.srfTitle.indexOf(" - ") === -1)) { if (viewdata && info && !Object.is(info, '') && (viewdata.srfTitle.indexOf("-") === -1)) {
this.view.$tabPageExp.setCurPageCaption(viewdata.srfTitle, viewdata.srfTitle, info); if(this.view.$tabPageExp){
this.view.$tabPageExp.setCurPageCaption(viewdata.srfTitle, viewdata.srfTitle, info);
}
if(this.view.$route){ if(this.view.$route){
this.view.$route.meta.info = info; this.view.$route.meta.info = info;
} }
this.view.model.srfTitle = `${this.view.$t(viewdata.srfTitle)} - ${viewdata.dataInfo}`; this.view.model.srfTitle = `${this.view.$t(viewdata.srfTitle)}-${viewdata.dataInfo}`;
this.view.initNavData();
} }
} }
......
...@@ -44,6 +44,25 @@ export interface NavDataElement { ...@@ -44,6 +44,25 @@ export interface NavDataElement {
} }
export interface ServiceState {
/**
* 行为
*
* @memberof ServiceState
*/
action: string;
/**
* 数据
*
* @memberof ServiceState
*/
data: any;
}
import { Subject } from 'rxjs';
/** /**
* 导航数据服务 * 导航数据服务
* *
...@@ -62,6 +81,13 @@ export default class NavDataService { ...@@ -62,6 +81,13 @@ export default class NavDataService {
*/ */
private static navDataService: NavDataService; private static navDataService: NavDataService;
/**
* 服务状态
*
* @memberof NavDataService
*/
public serviceState: Subject<ServiceState> = new Subject();
/** /**
* 导航数据栈 * 导航数据栈
* *
...@@ -133,6 +159,7 @@ export default class NavDataService { ...@@ -133,6 +159,7 @@ export default class NavDataService {
this.sessionStore.setItem('srfnavdata',JSON.stringify(this.navDataStack)); this.sessionStore.setItem('srfnavdata',JSON.stringify(this.navDataStack));
return curNavData; return curNavData;
} }
this.serviceState.next({action:'refresh', data:this.navDataStack});
} }
/** /**
......
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册