diff --git a/src/web-app/components/modal-router-shell/modal-router-shell.tsx b/src/web-app/components/modal-router-shell/modal-router-shell.tsx index 5cc7b3b4338f6aa3881b440f59d4f6105fc765f9..03595a41545d5704f1fe8dc51fde6ffc25c4e1b7 100644 --- a/src/web-app/components/modal-router-shell/modal-router-shell.tsx +++ b/src/web-app/components/modal-router-shell/modal-router-shell.tsx @@ -5,7 +5,12 @@ import { parseRouteViewData, routerCallback, } from '@ibiz-template/vue3-util'; -import { useRoute, useRouter } from 'vue-router'; +import { + useRoute, + useRouter, + onBeforeRouteUpdate, + RouteLocationNormalized, +} from 'vue-router'; import { IBizContext } from '@ibiz-template/core'; import { IModal, @@ -41,6 +46,8 @@ export const ModalRouterShell = defineComponent({ let overlay: IOverlayContainer | null = null; + const historyMap: Map = new Map(); + // 销毁视图上下文 onUnmounted(() => { isDestroyed.value = true; @@ -49,19 +56,25 @@ export const ModalRouterShell = defineComponent({ overlay = null; } destroyContext(); + historyMap.clear(); }); - const openView = async (): Promise => { - viewData.value = await parseRouteViewData(route, routeDepth, true); + const openView = async ( + to: RouteLocationNormalized = route, + ): Promise => { + viewData.value = await parseRouteViewData(to, routeDepth, true); + if (isDestroyed.value) { + return; + } if (!(viewData.value.context instanceof IBizContext)) { viewData.value.context = IBizContext.create(viewData.value.context); } // 当前模态打开的视图名称 - const appViewId = route.params.modalView as string; + const appViewId = to.params.modalView as string; // 路由参数 - const paramsStr = route.params.modalParams as string; + const paramsStr = to.params.modalParams as string; if (paramsStr) { const params = qs.parse(paramsStr, { strictNullHandling: true, @@ -117,6 +130,7 @@ export const ModalRouterShell = defineComponent({ footerHide: true, isRouteModal: true, }; + historyMap.set(router.currentRoute.value.fullPath, overlay!); overlay = ibiz.overlay.createModal(component, undefined, opts); overlay.present(); const result = await overlay.onWillDismiss(); @@ -125,7 +139,7 @@ export const ModalRouterShell = defineComponent({ if (window.history.state?.back) { router.back(); } else { - const path = route.path; + const path = to.path; const index = path.indexOf(`/${RouteConst.ROUTE_MODAL_TAG}/`); router.replace(path.substring(0, index)); } @@ -133,9 +147,26 @@ export const ModalRouterShell = defineComponent({ router.currentRoute.value.fullPath, result || { ok: false }, ); + if (historyMap.has(router.currentRoute.value.fullPath)) { + historyMap.delete(router.currentRoute.value.fullPath); + } } }; openView(); + + onBeforeRouteUpdate( + (to: RouteLocationNormalized, from: RouteLocationNormalized) => { + if (!historyMap.has(to.fullPath)) { + openView(to); + } + if (historyMap.has(from.fullPath)) { + const fromOverlay = historyMap.get(from.fullPath); + if (fromOverlay) { + fromOverlay.dismiss(); + } + } + }, + ); return {}; }, render() {