feat: add mainout page demo

CHANGELOG.zh_CN.md

@@ -5,6 +5,7 @@
 - 新增 `v-ripple`水波纹指令
 - 新增左侧菜单混合模式
 - 新增 markdown 嵌入表单内示例
+- 新增主框架外页面示例
 
 ### 🐛 Bug Fixes
 

src/components/Upload/src/UploadModal.vue

@@ -125,7 +125,7 @@
 
         // 设置类型,则判断
         if (accept.length > 0 && !checkFileType(file, accept)) {
-          createMessage.error!(t('acomponent.upload.cceptUpload', [accept.join(',')]));
+          createMessage.error!(t('component.upload.acceptUpload', [accept.join(',')]));
           return false;
         }
         const commonItem = {

src/router/helper/menuHelper.ts

@@ -23,7 +23,7 @@ function joinParentPath(list: any, node: any) {
       parentPath += /^\//.test(p) ? p : `/${p}`;
     });
   }
-  node.path = `${parentPath}${/^\//.test(node.path) ? node.path : `/${node.path}`}`.replace(
+  node.path = `${/^\//.test(node.path) ? node.path : `${parentPath}/${node.path}`}`.replace(
     /\/\//g,
     '/'
   );

src/router/menus/modules/dashboard.ts

@@ -8,11 +8,11 @@ const menu: MenuModule = {
     path: '/dashboard',
     children: [
       {
-        path: '/workbench',
+        path: 'workbench',
         name: t('routes.dashboard.workbench'),
       },
       {
-        path: '/analysis',
+        path: 'analysis',
         name: t('routes.dashboard.analysis'),
       },
     ],

src/router/menus/modules/demo/feat.ts

@@ -62,6 +62,7 @@ const menu: MenuModule = {
         path: 'error-log',
         name: t('routes.demo.feat.errorLog'),
       },
+
       {
         name: t('routes.demo.excel.excel'),
         path: 'excel',

src/router/routes/index.ts

@@ -3,6 +3,7 @@ import type { AppRouteRecordRaw, AppRouteModule } from '/@/router/types';
 import { PAGE_NOT_FOUND_ROUTE, REDIRECT_ROUTE } from '../constant';
 
 import modules from 'globby!/@/router/routes/modules/**/*.@(ts)';
+import { mainOutRoutes } from './mainOut';
 import { PageEnum } from '/@/enums/pageEnum';
 
 import { t } from '/@/hooks/web/useI18n';
@@ -35,4 +36,4 @@ export const LoginRoute: AppRouteRecordRaw = {
 };
 
 // 基础路由 不用权限
-export const basicRoutes = [LoginRoute, RootRoute, REDIRECT_ROUTE];
+export const basicRoutes = [LoginRoute, RootRoute, ...mainOutRoutes, REDIRECT_ROUTE];

src/router/routes/mainOut.ts

+import type { AppRouteModule } from '/@/router/types';
+
+// test
+// http:ip:port/main-out
+export const mainOutRoutes: AppRouteModule[] = [
+  {
+    path: '/main-out',
+    name: 'MainOut',
+    component: () => import('/@/views/demo/main-out/index.vue'),
+    meta: {
+      title: 'MainOut',
+      ignoreAuth: true,
+    },
+  },
+];
+
+export const mainOutRouteNames = mainOutRoutes.map((item) => item.name);

src/views/demo/main-out/index.vue

+<template>
+  <div class="test"> 位于主框架外的页面 </div>
+</template>
+<script lang="ts">
+  import { defineComponent } from 'vue';
+
+  export default defineComponent({});
+</script>
+
+<style scoped>
+  .test {
+    position: fixed;
+    display: flex;
+    width: 100%;
+    height: 100%;
+    justify-content: center;
+    align-items: center;
+    font-size: 50px;
+  }
+</style>