@@ -9,7 +9,7 @@ import { Button } from 'ant-design-vue';
99
1010import { useAccessStore , useAppStore } from ' #/store' ;
1111
12- defineOptions ({ name: ' AccessBackend ' });
12+ defineOptions ({ name: ' AccessButtonControl ' });
1313
1414const 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 >
0 commit comments