From 0abbfa5d0ca1481d76f40b4922db18b65a381a65 Mon Sep 17 00:00:00 2001
From: Soybean <soybeanjs@outlook.com>
Date: Fri, 22 Mar 2024 01:31:38 +0800
Subject: [PATCH] perf(projects): manage menu: add transform to component

---
 .../menu/modules/menu-operate-drawer.vue      |  5 ++++-
 src/views/manage/menu/modules/shared.ts       | 22 +++++++++++++++++--
 2 files changed, 24 insertions(+), 3 deletions(-)

diff --git a/src/views/manage/menu/modules/menu-operate-drawer.vue b/src/views/manage/menu/modules/menu-operate-drawer.vue
index 2df70c74..5ff870d2 100644
--- a/src/views/manage/menu/modules/menu-operate-drawer.vue
+++ b/src/views/manage/menu/modules/menu-operate-drawer.vue
@@ -6,7 +6,7 @@ import { $t } from '@/locales';
 import { enableStatusOptions, menuIconTypeOptions, menuTypeOptions } from '@/constants/business';
 import SvgIcon from '@/components/custom/svg-icon.vue';
 import { getLocalIcons } from '@/utils/icon';
-import { getLayoutAndPage } from './shared';
+import { getLayoutAndPage, transformLayoutAndPageToComponent } from './shared';
 
 defineOptions({
   name: 'MenuOperateDrawer'
@@ -162,6 +162,9 @@ function closeDrawer() {
 
 async function handleSubmit() {
   await validate();
+
+  model.component = transformLayoutAndPageToComponent(model.layout, model.page);
+
   // request
   window.$message?.success($t('common.updateSuccess'));
   closeDrawer();
diff --git a/src/views/manage/menu/modules/shared.ts b/src/views/manage/menu/modules/shared.ts
index 99af8ca7..9e2b76c0 100644
--- a/src/views/manage/menu/modules/shared.ts
+++ b/src/views/manage/menu/modules/shared.ts
@@ -1,9 +1,8 @@
 const LAYOUT_PREFIX = 'layout.';
 const VIEW_PREFIX = 'view.';
+const FIRST_LEVEL_ROUTE_COMPONENT_SPLIT = '$';
 
 export function getLayoutAndPage(component?: string | null) {
-  const FIRST_LEVEL_ROUTE_COMPONENT_SPLIT = '$';
-
   let layout = '';
   let page = '';
 
@@ -22,3 +21,22 @@ function getLayout(layout: string) {
 function getPage(page: string) {
   return page.startsWith(VIEW_PREFIX) ? page.replace(VIEW_PREFIX, '') : '';
 }
+
+export function transformLayoutAndPageToComponent(layout: string, page: string) {
+  const hasLayout = Boolean(layout);
+  const hasPage = Boolean(page);
+
+  if (hasLayout && hasPage) {
+    return `${LAYOUT_PREFIX}${layout}${FIRST_LEVEL_ROUTE_COMPONENT_SPLIT}${VIEW_PREFIX}${page}`;
+  }
+
+  if (hasLayout) {
+    return `${LAYOUT_PREFIX}${layout}`;
+  }
+
+  if (hasPage) {
+    return `${VIEW_PREFIX}${page}`;
+  }
+
+  return '';
+}