index.ts
1.13 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
import type { App } from 'vue'
import { useUserStore } from '@/store'
/**
* 权限指令
*
* 用法:
* <el-button v-hasPermi="'park:park-lot:create'">新增</el-button>
* <el-button v-hasPermi="['park:park-lot:create', 'park:park-lot:update']">保存</el-button> // 任一命中即可
* <el-button v-hasRole="'super_admin'">超级操作</el-button>
*
* 权限标识命名规范:模块:资源:动作(与后端 @PreAuthorize("@ss.hasPermission('...')") 完全一致)。
* 指令只是「隐藏入口」,真正的鉴权在后端——前端隐藏不作为安全边界。
*/
function checkAndRemove(el: HTMLElement, allowed: boolean) {
if (!allowed) {
el.parentNode?.removeChild(el)
}
}
export function setupDirectives(app: App) {
app.directive('hasPermi', {
mounted(el: HTMLElement, binding) {
const userStore = useUserStore()
checkAndRemove(el, userStore.hasPermission(binding.value))
}
})
app.directive('hasRole', {
mounted(el: HTMLElement, binding) {
const userStore = useUserStore()
checkAndRemove(el, userStore.hasRole(binding.value))
}
})
}
export default setupDirectives