refactor(project): simplified part of the package, code optimization

This commit is contained in:
vben
2024-07-13 16:35:47 +08:00
parent 5784d718c0
commit daa31f7156
92 changed files with 318 additions and 546 deletions

View File

@@ -96,7 +96,7 @@ export class MenuController {
path: 'access',
meta: {
icon: 'mdi:cloud-key-outline',
title: 'page.demos.access.backendControl',
title: 'page.demos.access.backendPermissions',
},
redirect: '/demos/access/page-control',
children: [

View File

@@ -1,7 +1,9 @@
import type { GeneratorMenuAndRoutesOptions } from '@vben/access';
import type { ComponentRecordType } from '@vben/types';
import type {
ComponentRecordType,
GenerateMenuAndRoutesOptions,
} from '@vben/types';
import { generateMenusAndRoutes } from '@vben/access';
import { generateAccessible } from '@vben/access';
import { preferences } from '@vben-core/preferences';
import { message } from 'ant-design-vue';
@@ -13,7 +15,7 @@ import { $t } from '#/locales';
const forbiddenComponent = () =>
import('#/views/_essential/fallback/forbidden.vue');
async function generateAccess(options: GeneratorMenuAndRoutesOptions) {
async function generateAccess(options: GenerateMenuAndRoutesOptions) {
const pageMap: ComponentRecordType = import.meta.glob('../views/**/*.vue');
const layoutMap: ComponentRecordType = {
@@ -21,7 +23,7 @@ async function generateAccess(options: GeneratorMenuAndRoutesOptions) {
IFrameView,
};
return await generateMenusAndRoutes(preferences.app.accessMode, {
return await generateAccessible(preferences.app.accessMode, {
...options,
fetchMenuListAsync: async () => {
message.loading({

View File

@@ -3,8 +3,8 @@
"demos": {
"title": "Demos",
"access": {
"frontendControl": "Frontend Control",
"backendControl": "Backend Control",
"frontendPermissions": "Frontend Permissions",
"backendPermissions": "Backend Permissions",
"pageAccess": "Page Access",
"buttonControl": "Button Control",
"menuVisible403": "Menu Visible(403)",

View File

@@ -3,8 +3,8 @@
"demos": {
"title": "演示",
"access": {
"frontendControl": "前端控制",
"backendControl": "后端控制",
"frontendPermissions": "前端权限",
"backendPermissions": "后端权限",
"pageAccess": "页面访问",
"buttonControl": "按钮控制",
"menuVisible403": "菜单可见(403)",

View File

@@ -19,7 +19,7 @@ const routes: RouteRecordRaw[] = [
{
meta: {
icon: 'mdi:shield-key-outline',
title: $t('page.demos.access.frontendControl'),
title: $t('page.demos.access.frontendPermissions'),
},
name: 'Access',
path: 'access',

View File

@@ -1,5 +1,5 @@
<script lang="ts" setup>
import type { TabsItem } from '@vben/types';
import type { TabsOption } from '@vben/types';
import type { AnalysisOverviewItem } from '@vben/universal-ui';
import {
@@ -53,7 +53,7 @@ const overviewItems: AnalysisOverviewItem[] = [
},
];
const chartTabs: TabsItem[] = [
const chartTabs: TabsOption[] = [
{
label: '流量趋势',
value: 'trends',

View File

@@ -3,7 +3,7 @@ import type { LoginAndRegisterParams } from '@vben/universal-ui';
import { useRouter } from 'vue-router';
import { CodeAccess, useAccess } from '@vben/access';
import { AccessControl, useAccess } from '@vben/access';
import { Button } from 'ant-design-vue';
@@ -59,9 +59,9 @@ async function changeAccount(role: string) {
<div class="card-box mt-5 p-5 font-semibold">
<div class="mb-3">
<span class="text-lg">当前账号:</span>
<span class="text-primary mx-4">
{{ accessStore.userRoles }}
<span class="text-lg">当前角色:</span>
<span class="text-primary mx-4 text-lg">
{{ accessStore.userRoles?.[0] }}
</span>
</div>
@@ -82,21 +82,40 @@ async function changeAccount(role: string) {
</div>
<div class="card-box mt-5 p-5 font-semibold">
<div class="mb-3 text-lg">组件形式控制</div>
<CodeAccess :value="['AC_100100']">
<div class="mb-3 text-lg">组件形式控制 - 权限码方式</div>
<AccessControl :value="['AC_100100']" type="code">
<Button class="mr-4"> Super 账号可见 ["AC_1000001"] </Button>
</CodeAccess>
<CodeAccess :value="['AC_100030']">
</AccessControl>
<AccessControl :value="['AC_100030']" type="code">
<Button class="mr-4"> Admin 账号可见 ["AC_100010"] </Button>
</CodeAccess>
<CodeAccess :value="['AC_1000001']">
</AccessControl>
<AccessControl :value="['AC_1000001']" type="code">
<Button class="mr-4"> User 账号可见 ["AC_1000001"] </Button>
</CodeAccess>
<CodeAccess :value="['AC_100100', 'AC_100010']">
</AccessControl>
<AccessControl :value="['AC_100100', 'AC_100010']" type="code">
<Button class="mr-4">
Super & Admin 账号可见 ["AC_100100","AC_1000001"]
</Button>
</CodeAccess>
</AccessControl>
</div>
<div
v-if="accessMode === 'frontend'"
class="card-box mt-5 p-5 font-semibold"
>
<div class="mb-3 text-lg">组件形式控制 - 用户角色方式</div>
<AccessControl :value="['super']">
<Button class="mr-4"> Super 角色可见 </Button>
</AccessControl>
<AccessControl :value="['admin']">
<Button class="mr-4"> Admin 角色可见 </Button>
</AccessControl>
<AccessControl :value="['user']">
<Button class="mr-4"> User 角色可见 </Button>
</AccessControl>
<AccessControl :value="['super', 'admin']">
<Button class="mr-4"> Super & Admin 角色可见 </Button>
</AccessControl>
</div>
<div class="card-box mt-5 p-5 font-semibold">

View File

@@ -69,7 +69,9 @@ async function handleToggleAccessMode() {
<div class="card-box mt-5 p-5 font-semibold">
<span class="text-lg">当前权限模式:</span>
<span class="text-primary mx-4">{{ accessMode }}</span>
<span class="text-primary mx-4">{{
accessMode === 'frontend' ? '前端权限控制' : '后端权限控制'
}}</span>
<Button type="primary" @click="handleToggleAccessMode">
切换为{{ accessMode === 'frontend' ? '后端' : '前端' }}权限模式
</Button>
@@ -77,8 +79,8 @@ async function handleToggleAccessMode() {
<div class="card-box mt-5 p-5 font-semibold">
<div class="mb-3">
<span class="text-lg">当前账号:</span>
<span class="text-primary mx-4">
{{ accessStore.userRoles }}
<span class="text-primary mx-4 text-lg">
{{ accessStore.userRoles?.[0] }}
</span>
</div>

View File

@@ -1,5 +1,5 @@
<script lang="ts" setup>
import type { LoginExpiredModeType } from '@vben-core/preferences';
import type { LoginExpiredModeType } from '@vben/types';
import { preferences, updatePreferences } from '@vben-core/preferences';