摸鱼低代码 mfish-nocode

切换深浅模式

当前页

权限 ​

权限分为菜单权限，按钮权限两类。

  1. 菜单权限后端返回时已根据当前用户进行过滤
  2. 按钮权限需要前端通过函数进行判断是否显示

菜单权限控制 ​

菜单权限后端角色菜单权限控制，当用户登录时候后台会根据当前用户所在角色拥有的菜单权限自动过滤菜单

按钮权限控制 ​

指令方式

直接使用v-auth指令标签

vue
<template #toolbar>
  <a-button type="primary" @click="handleCreate" v-auth="'sys:job:insert'">新增策略</a-button>
</template>

函数方式

UsePermission 还提供了按钮级别的权限控制。

vue
<template>
  <a-button v-if="hasPermission('sys:role:insert')" color="error" class="mx-4">
    拥有sys:role:insert角色权限可见
  </a-button>
  <a-button v-if="hasPermission(['sys:role:insert','sys:role:update'])" color="error" class="mx-4">
    拥有[sys:role:insert,sys:role:update]角色其中一个权限可见
  </a-button>
</template>
<script lang="ts">
  import { usePermission } from "/@/hooks/web/UsePermission";
  import { RoleEnum } from '/@/enums/roleEnum';

  export default defineComponent({
    setup() {
      const { hasPermission } = usePermission();
      return { hasPermission };
    },
  });
</script>