feat: new interface pendant can be configured to display hidden

2024-07-10 21:20:11 +08:00
parent db76325d68
commit a765d3bbc0
36 changed files with 256 additions and 612 deletions
--- a/apps/backend-mock/README.md
+++ b/apps/backend-mock/README.md
@@ -2,7 +2,7 @@

 ## Description

-Vben Admin Pro 数据mock服务
+Vben Admin Pro 数据 mock 服务，没有对接任何的数据库，所有数据都是模拟的，用于前端开发时提供数据支持。由于 sqlite 安装需要在本地进行编译，所以这里接口是直接返回的。线上环境不再提供mock集成，可自行部署服务或者对接真实数据，同步 mock.js等工具有一些限制，比如上传文件不行、无法模拟复杂的逻辑等，所以这里使用了 真是的后端服务来实现。唯一麻烦的是本地需要同时启动后端服务和前端服务，但是这样可以更好的模拟真实环境。

 ## Running the app

--- a/apps/web-antd/index.html
+++ b/apps/web-antd/index.html
@@ -11,7 +11,7 @@
      name="viewport"
      content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=0"
    />
-    <!-- 由 vite 注入 VITE_GLOB_APP_TITLE 变量，在 . env 内配置 -->
+    <!-- 由 vite 注入 VITE_GLOB_APP_TITLE 变量，在 .env 文件内配置 -->
    <title><%= VITE_GLOB_APP_TITLE %></title>
    <link rel="icon" href="/favicon.ico" />
  </head>
--- a/apps/web-antd/src/forward/access.ts
+++ b/apps/web-antd/src/forward/access.ts
@@ -10,7 +10,8 @@ import { getAllMenus } from '#/apis';
 import { BasicLayout, IFrameView } from '#/layouts';
 import { $t } from '#/locales';

-const forbiddenPage = () => import('#/views/_essential/fallback/forbidden.vue');
+const forbiddenComponent = () =>
+  import('#/views/_essential/fallback/forbidden.vue');

 async function generateAccess(options: GeneratorMenuAndRoutesOptions) {
  const pageMap: ComponentRecordType = import.meta.glob('../views/**/*.vue');
@@ -30,7 +31,7 @@ async function generateAccess(options: GeneratorMenuAndRoutesOptions) {
      return await getAllMenus();
    },
    // 可以指定没有权限跳转403页面
-    forbiddenComponent: forbiddenPage,
+    forbiddenComponent,
    // 如果 route.meta.menuVisibleWithForbidden = true
    layoutMap,
    pageMap,
--- a/apps/web-antd/src/locales/index.ts
+++ b/apps/web-antd/src/locales/index.ts
@@ -10,7 +10,7 @@ import dayjs from 'dayjs';

 const antdLocale = ref<Locale>(defaultLocale);

-const modules = import.meta.glob('./langs/*.y(a)?ml');
+const modules = import.meta.glob('./langs/*.json');

 const localesMap = loadLocalesMap(modules);

--- a/apps/web-antd/src/locales/langs/en-US.json
+++ b/apps/web-antd/src/locales/langs/en-US.json
@@ -0,0 +1,34 @@
+{
+  "page": {
+    "demos": {
+      "title": "Demos",
+      "access": {
+        "title": "Access Control",
+        "frontend-control": "Front-end Control",
+        "backend-control": "Backend Control",
+        "page": "Page visit",
+        "button": "Button control",
+        "loading-menu": "In the loading menu",
+        "access-test-1": "Super visit",
+        "access-test-2": "Admin visit",
+        "access-test-3": "User visit"
+      },
+      "nested": {
+        "title": "Nested Menu",
+        "menu1": "Menu 1",
+        "menu2": "Menu 2",
+        "menu21": "Menu 2-1",
+        "menu3": "Menu 3",
+        "menu31": "Menu 3-1",
+        "menu32": "Menu 3-2",
+        "menu321": "Menu 3-2-1"
+      },
+      "outside": {
+        "title": "External Page",
+        "embedded": "embedded Page",
+        "external-link": "External Link"
+      },
+      "fallback": { "title": "Fallback Page" }
+    }
+  }
+}
--- a/apps/web-antd/src/locales/langs/en-US.yaml
+++ b/apps/web-antd/src/locales/langs/en-US.yaml
@@ -1,28 +0,0 @@
-page:
-  demos:
-    title: Demos
-    access:
-      title: Access Control
-      frontend-control: Front-end Control
-      backend-control: Backend Control
-      page: Page visit
-      button: Button control
-      loading-menu: In the loading menu
-      access-test-1: Super visit
-      access-test-2: Admin visit
-      access-test-3: User visit
-    nested:
-      title: Nested Menu
-      menu1: Menu 1
-      menu2: Menu 2
-      menu21: Menu 2-1
-      menu3: Menu 3
-      menu31: Menu 3-1
-      menu32: Menu 3-2
-      menu321: Menu 3-2-1
-    outside:
-      title: External Page
-      embedded: embedded Page
-      external-link: External Link
-    fallback:
-      title: Fallback Page
--- a/apps/web-antd/src/locales/langs/zh-CN.json
+++ b/apps/web-antd/src/locales/langs/zh-CN.json
@@ -0,0 +1,35 @@
+{
+  "page": {
+    "demos": {
+      "title": "演示",
+      "access": {
+        "title": "访问控制",
+        "frontend-control": "前端控制",
+        "backend-control": "后端控制",
+        "page": "页面访问",
+        "button": "按钮控制",
+        "access-test-1": "Super 可见",
+        "access-test-2": "Admin 可见",
+        "access-test-3": "User 可见"
+      },
+      "nested": {
+        "title": "嵌套菜单",
+        "menu1": "菜单 1",
+        "menu2": "菜单 2",
+        "menu21": "菜单 2-1",
+        "menu3": "菜单 3",
+        "menu31": "菜单 3-1",
+        "menu32": "菜单 3-2",
+        "menu321": "菜单 3-2-1"
+      },
+      "outside": {
+        "title": "外部页面",
+        "embedded": "内嵌",
+        "external-link": "外链"
+      },
+      "fallback": {
+        "title": "缺省页"
+      }
+    }
+  }
+}
--- a/apps/web-antd/src/locales/langs/zh-CN.yaml
+++ b/apps/web-antd/src/locales/langs/zh-CN.yaml
@@ -1,27 +0,0 @@
-page:
-  demos:
-    title: 演示
-    access:
-      title: 访问控制
-      frontend-control: 前端控制
-      backend-control: 后端控制
-      page: 页面访问
-      button: 按钮控制
-      access-test-1: Super 可见
-      access-test-2: Admin 可见
-      access-test-3: User 可见
-    nested:
-      title: 嵌套菜单
-      menu1: 菜单 1
-      menu2: 菜单 2
-      menu21: 菜单 2-1
-      menu3: 菜单 3
-      menu31: 菜单 3-1
-      menu32: 菜单 3-2
-      menu321: 菜单 3-2-1
-    outside:
-      title: 外部页面
-      embedded: 内嵌
-      external-link: 外链
-    fallback:
-      title: 缺省页
--- a/apps/web-antd/src/preferences.ts
+++ b/apps/web-antd/src/preferences.ts
@@ -1,8 +1,9 @@
-import type { DeepPartial } from '@vben/types';
-import type { Preferences } from '@vben-core/preferences';
+import { defineOverridesPreferences } from '@vben-core/preferences';

 /**
 * @description 项目配置文件
 * 只需要覆盖项目中的一部分配置，不需要的配置不用覆盖，会自动使用默认配置
 */
-export const overridesPreferences: DeepPartial<Preferences> = {};
+export const overridesPreferences = defineOverridesPreferences({
+  // overrides
+});
--- a/apps/web-antd/src/views/demos/access/backend/button-control.vue
+++ b/apps/web-antd/src/views/demos/access/backend/button-control.vue
@@ -3,7 +3,7 @@ import type { LoginAndRegisterParams } from '@vben/universal-ui';

 import { useRouter } from 'vue-router';

-import { CodeAuthority, useAccess } from '@vben/access';
+import { CodeAccess, useAccess } from '@vben/access';

 import { Button } from 'ant-design-vue';

@@ -82,20 +82,20 @@ async function changeAccount(role: string) {

      <div class="card-box mt-5 p-5 font-semibold">
        <div class="mb-3 text-lg">组件形式控制</div>
-        <CodeAuthority :value="['AC_100100']">
+        <CodeAccess :value="['AC_100100']">
          <Button class="mr-4"> Super 账号可见 ["AC_1000001"] </Button>
-        </CodeAuthority>
-        <CodeAuthority :value="['AC_100030']">
+        </CodeAccess>
+        <CodeAccess :value="['AC_100030']">
          <Button class="mr-4"> Admin 账号可见 ["AC_100010"] </Button>
-        </CodeAuthority>
-        <CodeAuthority :value="['AC_1000001']">
+        </CodeAccess>
+        <CodeAccess :value="['AC_1000001']">
          <Button class="mr-4"> User 账号可见 ["AC_1000001"] </Button>
-        </CodeAuthority>
-        <CodeAuthority :value="['AC_100100', 'AC_100010']">
+        </CodeAccess>
+        <CodeAccess :value="['AC_100100', 'AC_100010']">
          <Button class="mr-4">
            Super & Admin 账号可见 ["AC_100100","AC_1000001"]
          </Button>
-        </CodeAuthority>
+        </CodeAccess>
      </div>

      <div class="card-box mt-5 p-5 font-semibold">
--- a/apps/web-antd/src/views/demos/access/frontend/button-control.vue
+++ b/apps/web-antd/src/views/demos/access/frontend/button-control.vue
@@ -3,7 +3,7 @@ import type { LoginAndRegisterParams } from '@vben/universal-ui';

 import { useRouter } from 'vue-router';

-import { CodeAuthority, RoleAuthority, useAccess } from '@vben/access';
+import { CodeAccess, RoleAccess, useAccess } from '@vben/access';

 import { Button } from 'ant-design-vue';

@@ -81,18 +81,18 @@ async function changeAccount(role: string) {
      </div>
      <div class="card-box mt-5 p-5 font-semibold">
        <div class="mb-3 text-lg">角色 - 组件形式控制</div>
-        <RoleAuthority :value="['super']">
+        <RoleAccess :value="['super']">
          <Button class="mr-4"> Super 角色可见 </Button>
-        </RoleAuthority>
-        <RoleAuthority :value="['admin']">
+        </RoleAccess>
+        <RoleAccess :value="['admin']">
          <Button class="mr-4"> Admin 角色可见 </Button>
-        </RoleAuthority>
-        <RoleAuthority :value="['user']">
+        </RoleAccess>
+        <RoleAccess :value="['user']">
          <Button class="mr-4"> User 角色可见 </Button>
-        </RoleAuthority>
-        <RoleAuthority :value="['super', 'admin']">
+        </RoleAccess>
+        <RoleAccess :value="['super', 'admin']">
          <Button class="mr-4"> Super & Admin 角色都可见 </Button>
-        </RoleAuthority>
+        </RoleAccess>
      </div>

      <div class="card-box mt-5 p-5 font-semibold">
@@ -113,20 +113,20 @@ async function changeAccount(role: string) {

      <div class="card-box mt-5 p-5 font-semibold">
        <div class="mb-3 text-lg">权限码 - 组件形式控制</div>
-        <CodeAuthority :value="['AC_100100']">
+        <CodeAccess :value="['AC_100100']">
          <Button class="mr-4"> Super 账号可见 ["AC_1000001"] </Button>
-        </CodeAuthority>
-        <CodeAuthority :value="['AC_100030']">
+        </CodeAccess>
+        <CodeAccess :value="['AC_100030']">
          <Button class="mr-4"> Admin 账号可见 ["AC_100010"] </Button>
-        </CodeAuthority>
-        <CodeAuthority :value="['AC_1000001']">
+        </CodeAccess>
+        <CodeAccess :value="['AC_1000001']">
          <Button class="mr-4"> User 账号可见 ["AC_1000001"] </Button>
-        </CodeAuthority>
-        <CodeAuthority :value="['AC_100100', 'AC_100010']">
+        </CodeAccess>
+        <CodeAccess :value="['AC_100100', 'AC_100010']">
          <Button class="mr-4">
            Super & Admin 账号可见 ["AC_100100","AC_1000001"]
          </Button>
-        </CodeAuthority>
+        </CodeAccess>
      </div>

      <div class="card-box mt-5 p-5 font-semibold">