Skip to content

Commit ba780a7

Browse files
committed
chore: update access demo
1 parent 7801a90 commit ba780a7

File tree

6 files changed

+72
-61
lines changed

6 files changed

+72
-61
lines changed

apps/backend-mock/src/modules/menu/menu.controller.ts

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -118,6 +118,17 @@ export class MenuController {
118118
title: 'page.demos.access.buttonControl',
119119
},
120120
},
121+
{
122+
name: 'AccessMenuVisible403',
123+
path: 'menu-visible-403',
124+
component: '/demos/access/menu-visible-403',
125+
meta: {
126+
authority: ['no-body'],
127+
icon: 'mdi:button-cursor',
128+
menuVisibleWithForbidden: true,
129+
title: 'page.demos.access.menuVisible403',
130+
},
131+
},
121132
roleWithMenus[role],
122133
],
123134
},

apps/web-antd/src/views/demos/access/admin-visible.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<script lang="ts" setup>
22
import { Fallback } from '@vben/universal-ui';
33
4-
defineOptions({ name: 'AccessFrontendAccessTest2' });
4+
defineOptions({ name: 'AccessAdminVisible' });
55
</script>
66

77
<template>

apps/web-antd/src/views/demos/access/button-control.vue

Lines changed: 57 additions & 57 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ import { Button } from 'ant-design-vue';
99
1010
import { useAccessStore, useAppStore } from '#/store';
1111
12-
defineOptions({ name: 'AccessBackend' });
12+
defineOptions({ name: 'AccessButtonControl' });
1313
1414
const accounts: Record<string, LoginAndRegisterParams> = {
1515
admin: {
@@ -41,7 +41,7 @@ async function changeAccount(role: string) {
4141
}
4242
4343
const account = accounts[role];
44-
await appStore.resetAppState();
44+
appStore.resetAppState();
4545
await accessStore.authLogin(account, async () => {
4646
router.go(0);
4747
});
@@ -51,68 +51,68 @@ async function changeAccount(role: string) {
5151
<template>
5252
<div class="p-5">
5353
<div class="card-box p-5">
54-
<h1 class="text-xl font-semibold">后端页面访问权限演示</h1>
54+
<h1 class="text-xl font-semibold">
55+
{{ accessMode === 'frontend' ? '前端' : '后端' }}页面访问权限演示
56+
</h1>
5557
<div class="text-foreground/80 mt-2">切换不同的账号,观察按钮变化。</div>
5658
</div>
5759

58-
<template v-if="accessMode === 'backend'">
59-
<div class="card-box mt-5 p-5 font-semibold">
60-
<div class="mb-3">
61-
<span class="text-lg">当前账号:</span>
62-
<span class="text-primary mx-4">
63-
{{ accessStore.userRoles }}
64-
</span>
65-
</div>
66-
67-
<Button :type="roleButtonType('super')" @click="changeAccount('super')">
68-
切换为 Super 账号
69-
</Button>
70-
71-
<Button
72-
:type="roleButtonType('admin')"
73-
class="mx-4"
74-
@click="changeAccount('admin')"
75-
>
76-
切换为 Admin 账号
77-
</Button>
78-
<Button :type="roleButtonType('user')" @click="changeAccount('user')">
79-
切换为 User 账号
80-
</Button>
60+
<div class="card-box mt-5 p-5 font-semibold">
61+
<div class="mb-3">
62+
<span class="text-lg">当前账号:</span>
63+
<span class="text-primary mx-4">
64+
{{ accessStore.userRoles }}
65+
</span>
8166
</div>
8267

83-
<div class="card-box mt-5 p-5 font-semibold">
84-
<div class="mb-3 text-lg">组件形式控制</div>
85-
<CodeAccess :value="['AC_100100']">
86-
<Button class="mr-4"> Super 账号可见 ["AC_1000001"] </Button>
87-
</CodeAccess>
88-
<CodeAccess :value="['AC_100030']">
89-
<Button class="mr-4"> Admin 账号可见 ["AC_100010"] </Button>
90-
</CodeAccess>
91-
<CodeAccess :value="['AC_1000001']">
92-
<Button class="mr-4"> User 账号可见 ["AC_1000001"] </Button>
93-
</CodeAccess>
94-
<CodeAccess :value="['AC_100100', 'AC_100010']">
95-
<Button class="mr-4">
96-
Super & Admin 账号可见 ["AC_100100","AC_1000001"]
97-
</Button>
98-
</CodeAccess>
99-
</div>
68+
<Button :type="roleButtonType('super')" @click="changeAccount('super')">
69+
切换为 Super 账号
70+
</Button>
71+
72+
<Button
73+
:type="roleButtonType('admin')"
74+
class="mx-4"
75+
@click="changeAccount('admin')"
76+
>
77+
切换为 Admin 账号
78+
</Button>
79+
<Button :type="roleButtonType('user')" @click="changeAccount('user')">
80+
切换为 User 账号
81+
</Button>
82+
</div>
10083

101-
<div class="card-box mt-5 p-5 font-semibold">
102-
<div class="mb-3 text-lg">函数形式控制</div>
103-
<Button v-if="hasAuthByCodes(['AC_100100'])" class="mr-4">
104-
Super 账号可见 ["AC_1000001"]
105-
</Button>
106-
<Button v-if="hasAuthByCodes(['AC_100030'])" class="mr-4">
107-
Admin 账号可见 ["AC_100010"]
108-
</Button>
109-
<Button v-if="hasAuthByCodes(['AC_1000001'])" class="mr-4">
110-
User 账号可见 ["AC_1000001"]
111-
</Button>
112-
<Button v-if="hasAuthByCodes(['AC_100100', 'AC_1000001'])" class="mr-4">
84+
<div class="card-box mt-5 p-5 font-semibold">
85+
<div class="mb-3 text-lg">组件形式控制</div>
86+
<CodeAccess :value="['AC_100100']">
87+
<Button class="mr-4"> Super 账号可见 ["AC_1000001"] </Button>
88+
</CodeAccess>
89+
<CodeAccess :value="['AC_100030']">
90+
<Button class="mr-4"> Admin 账号可见 ["AC_100010"] </Button>
91+
</CodeAccess>
92+
<CodeAccess :value="['AC_1000001']">
93+
<Button class="mr-4"> User 账号可见 ["AC_1000001"] </Button>
94+
</CodeAccess>
95+
<CodeAccess :value="['AC_100100', 'AC_100010']">
96+
<Button class="mr-4">
11397
Super & Admin 账号可见 ["AC_100100","AC_1000001"]
11498
</Button>
115-
</div>
116-
</template>
99+
</CodeAccess>
100+
</div>
101+
102+
<div class="card-box mt-5 p-5 font-semibold">
103+
<div class="mb-3 text-lg">函数形式控制</div>
104+
<Button v-if="hasAuthByCodes(['AC_100100'])" class="mr-4">
105+
Super 账号可见 ["AC_1000001"]
106+
</Button>
107+
<Button v-if="hasAuthByCodes(['AC_100030'])" class="mr-4">
108+
Admin 账号可见 ["AC_100010"]
109+
</Button>
110+
<Button v-if="hasAuthByCodes(['AC_1000001'])" class="mr-4">
111+
User 账号可见 ["AC_1000001"]
112+
</Button>
113+
<Button v-if="hasAuthByCodes(['AC_100100', 'AC_1000001'])" class="mr-4">
114+
Super & Admin 账号可见 ["AC_100100","AC_1000001"]
115+
</Button>
116+
</div>
117117
</div>
118118
</template>

apps/web-antd/src/views/demos/access/menu-visible-403.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<script lang="ts" setup>
22
import { Fallback } from '@vben/universal-ui';
33
4-
defineOptions({ name: 'AccessFrontendAccessTest2' });
4+
defineOptions({ name: 'AccessMenuVisible403' });
55
</script>
66

77
<template>

apps/web-antd/src/views/demos/access/super-visible.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<script lang="ts" setup>
22
import { Fallback } from '@vben/universal-ui';
33
4-
defineOptions({ name: 'AccessFrontendAccessTest1' });
4+
defineOptions({ name: 'AccessSuperVisible' });
55
</script>
66

77
<template>

apps/web-antd/src/views/demos/access/user-visible.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<script lang="ts" setup>
22
import { Fallback } from '@vben/universal-ui';
33
4-
defineOptions({ name: 'AccessFrontendAccessTest1' });
4+
defineOptions({ name: 'AccessUserVisible' });
55
</script>
66

77
<template>

0 commit comments

Comments
 (0)