diff --git a/src/directives/auth.js b/src/directives/auth.js
new file mode 100644
index 0000000..00bc62a
--- /dev/null
+++ b/src/directives/auth.js
@@ -0,0 +1,53 @@
+import { ElMessage } from 'element-plus'
+
+// 角色权限映射
+const roleMap = {
+ 0: '普通员工',
+ 1: '部门主管',
+ 2: '综合部',
+ 3: '财务部'
+}
+
+// 权限配置
+const authConfig = {
+ // 工资条管理
+ 'payroll:view': [0, 1, 2, 3], // 查看工资条
+ 'payroll:edit': [1, 2, 3], // 编辑工资条
+ 'payroll:delete': [2, 3], // 删除工资条
+ 'payroll:show': [1, 2, 3], // 展示给员工
+
+ // 组别管理
+ 'group:view': [0, 1, 2, 3], // 查看组别
+ 'group:add': [2], // 添加组别
+ 'group:edit': [2], // 编辑组别
+ 'group:delete': [2], // 删除组别
+
+ // 成员管理
+ 'member:view': [0, 1, 2, 3], // 查看成员
+ 'member:add': [2], // 添加成员
+ 'member:edit': [2], // 编辑成员
+ 'member:delete': [2], // 删除成员
+ 'member:role': [2], // 修改成员角色
+ 'member:salary': [2], // 修改成员工资
+}
+
+export default {
+ mounted(el, binding) {
+ const { value } = binding
+ const userInfo = JSON.parse(sessionStorage.getItem('userInfo') || '{}')
+ const userRole = userInfo.role || 0
+
+ // 如果没有权限配置，默认显示
+ if (!value) {
+ return
+ }
+
+ // 检查权限
+ const hasAuth = authConfig[value]?.includes(userRole)
+
+ if (!hasAuth) {
+ // 移除元素
+ el.parentNode?.removeChild(el)
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/main.js b/src/main.js
index 1aff514..c6fb2a1 100644
--- a/src/main.js
+++ b/src/main.js
@@ -15,6 +15,7 @@ import vuepressTheme from "@kangc/v-md-editor/lib/theme/vuepress.js";
import "@kangc/v-md-editor/lib/style/base-editor.css";
import "@kangc/v-md-editor/lib/theme/style/vuepress.css";
import VConsole from "vconsole";
+import authDirective from './directives/auth'
// 或者使用配置参数来初始化，详情见文档
const vConsole = new VConsole({ theme: "dark" });
VMdEditor.use(vuepressTheme);
@@ -30,4 +31,7 @@ app.use(router).use(store).use(directives).use(VMdEditor).use(ElementPlus, {
locale: zhCn,
});
+// 注册自定义指令
+app.directive('auth', authDirective)
+
app.mount("#app");
diff --git a/src/router/originalRoutingTable.js b/src/router/originalRoutingTable.js
index 3b04bba..2255a99 100644
--- a/src/router/originalRoutingTable.js
+++ b/src/router/originalRoutingTable.js
@@ -37,6 +37,7 @@ const routerList = [
requiresAuth: true, //有一些页面是否登录才能进去
name: "组别管理",
icon: "Notebook",
+ roles: [2, 3]
},
children: [
{
@@ -47,6 +48,7 @@ const routerList = [
requiresAuth: true,
name: "组别管理",
icon: "Notebook",
+ roles: [2, 3]
},
},
],
diff --git a/src/views/groupManagement/index.vue b/src/views/groupManagement/index.vue
index a31b072..cac0a08 100644
--- a/src/views/groupManagement/index.vue
+++ b/src/views/groupManagement/index.vue
@@ -15,7 +15,7 @@
- 添加组别
+ 添加组别
@@ -28,10 +28,12 @@
{{ scope.row.createTime || "暂无" }}
-
+
- 编辑
- 删除
+ 编辑
+ 删除
@@ -53,7 +55,7 @@
- 添加成员
+ 添加成员
@@ -70,19 +72,28 @@
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+ {{ getRoleName(scope.row.role) }}
+
+
-
+
- 查看工资配置
- 移除
+ 查看工资配置
+ 移除
@@ -281,6 +292,9 @@ const groupRules = {
const router = useRouter();
+const userInfo = JSON.parse(sessionStorage.getItem('userInfo') || '{}')
+const userRole = userInfo.role || 0
+
// 获取组别列表
const fetchGroupList = async () => {
try {
@@ -578,6 +592,28 @@ const handleSearch = () => {
);
};
+// 获取角色名称
+const getRoleName = (role) => {
+ const roleMap = {
+ 0: '普通员工',
+ 1: '部门主管',
+ 2: '综合部',
+ 3: '财务部'
+ }
+ return roleMap[role] || '未知角色'
+}
+
+// 获取角色标签类型
+const getRoleTagType = (role) => {
+ const typeMap = {
+ 0: 'info',
+ 1: 'success',
+ 2: 'warning',
+ 3: 'danger'
+ }
+ return typeMap[role] || 'info'
+}
+
// 页面加载时获取组别列表
onMounted(() => {
fetchGroupList();