lostecho/vue-element-plus-admin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

perf: 完善demo

Browse Source
This commit is contained in:
kailong321200875
2023-10-14 10:43:04 +08:00
parent be73f4da3e
commit 2c4ff7d190
11 changed files with 383 additions and 68 deletions
Download Patch File Download Diff File Expand all files Collapse all files

70
src/views/Function/Test.vue Normal file
View File

@@ -0,0 +1,70 @@
<script setup lang="tsx">
import { ContentWrap } from '@/components/ContentWrap'
import { ref, unref } from 'vue'
import { ElButton, ElDivider, ElRow, ElCol } from 'element-plus'
import { hasPermi } from '@/components/Permission'
const permission = ref('add')
setTimeout(() => {
permission.value = 'view'
}, 3000)
</script>
<template>
<ContentWrap>
<ElDivider>组件方式判断（已经全局注册，支持动态修改）</ElDivider>
<ElRow :gutter="20">
<ElCol :span="8">
新增权限：
<Permission permission="add">
<ElButton type="primary"> Add </ElButton>
</Permission>
</ElCol>
<ElCol :span="8">
删除权限：
<Permission permission="delete">
<ElButton type="danger"> Delete </ElButton>
</Permission>
</ElCol>
<ElCol :span="8">
3秒后切换查看权限：
<Permission :permission="permission">
<ElButton type="primary"> View </ElButton>
</Permission>
</ElCol>
</ElRow>
<ElDivider>指令方式判断（已经全局注册，不支持动态修改）</ElDivider>
<ElRow :gutter="20">
<ElCol :span="8">
新增权限：
<ElButton v-hasPermi="'add'" type="primary"> Add </ElButton>
</ElCol>
<ElCol :span="8">
删除权限：
<ElButton v-hasPermi="'delete'" type="danger"> Delete </ElButton>
</ElCol>
<ElCol :span="8">
3秒后切换查看权限（无法动态修改）：
<ElButton v-hasPermi="permission" type="primary"> View </ElButton>
</ElCol>
</ElRow>
<ElDivider>函数方式判断</ElDivider>
<ElRow :gutter="20">
<ElCol :span="8">
新增权限：
<ElButton v-if="hasPermi('add')" type="primary"> Add </ElButton>
</ElCol>
<ElCol :span="8">
删除权限：
<ElButton v-if="hasPermi('delete')" type="danger"> Delete </ElButton>
</ElCol>
<ElCol :span="8">
3秒后切换查看权限：
<ElButton v-if="hasPermi(unref(permission))" type="primary"> View </ElButton>
</ElCol>
</ElRow>
</ContentWrap>
</template>