修改角色为多角色

This commit is contained in:
1147680382@qq.com
2025-06-05 17:23:38 +08:00
parent dd56481b52
commit b57cdf35a2
10 changed files with 153 additions and 203 deletions
+6 -5
View File
@@ -49,12 +49,13 @@ export function getNonGroupUsers() {
});
}
// 添加/修改组内人员角色
export function updateGroupUserRole(groupId, userid, role) {
// 更新组内用户角色
export const updateGroupUserRole = (data) => {
return service({
url: `/group/${groupId}/user/${userid}/role/${role}`,
method: "post",
});
url: '/group/user',
method: 'post',
data
})
}
// 获取组内人员列表
+1 -1
View File
@@ -35,7 +35,7 @@ export default {
mounted(el, binding) {
const { value } = binding
const userInfo = JSON.parse(sessionStorage.getItem('userInfo') || '{}')
const userRole = userInfo.role || 0
const userRole = userInfo.roles || 0
// 如果没有权限配置,默认显示
if (!value) {
+1 -1
View File
@@ -44,7 +44,7 @@ const themeConfig = store.getters.themeConfig;
onMounted(() => {
// 权限检查
const userInfo = JSON.parse(sessionStorage.getItem("userInfo") || "{}");
const menuTable = generateMenu(routerList, userInfo.role)
const menuTable = generateMenu(routerList, userInfo.roles)
// 获取本地菜单表渲染
menuList.value = menuTable;
});
+12 -5
View File
@@ -1,5 +1,5 @@
// 递归处理路由列表生成菜单数据
export const generateMenu = (routes, userRole) => {
export const generateMenu = (routes, userRoles) => {
const menuList = [];
// 递归处理路由
@@ -7,9 +7,16 @@ export const generateMenu = (routes, userRole) => {
// 检查路由是否需要权限验证
if (route.meta && route.meta.requiresAuth) {
// 检查用户角色是否有权限访问
if (route.meta.roles && !route.meta.roles.includes(userRole)) {
return null;
if (route.meta.roles) {
const hasPermission = userRoles.some(role =>
route.meta.roles.includes(Number(role))
);
if (!hasPermission) {
return null
}
}
const menuItem = {
title: route.meta.name,
@@ -61,7 +68,7 @@ export const generateMenu = (routes, userRole) => {
// 使用示例
/*
const userRole = 2; // 用户角色
const menuList = generateMenu(routerList, userRole);
const userRoles = [2]; // 用户角色
const menuList = generateMenu(routerList, userRoles);
console.log(menuList);
*/
+74 -42
View File
@@ -15,7 +15,7 @@
</el-icon>
</template>
</el-input>
<el-button type="primary" size="small" @click="handleAdd" v-auth="'group:add'">添加组别</el-button>
<el-button type="primary" size="small" @click="handleAdd" v-if="canAdd">添加组别</el-button>
</div>
</div>
</template>
@@ -28,12 +28,12 @@
{{ scope.row.createTime || "暂无" }}
</template>
</el-table-column>
<el-table-column label="操作" width="180" fixed="right" align="center" v-if="userRole === 2">
<el-table-column label="操作" width="180" fixed="right" align="center" v-if="canEdit || canDelete">
<template #default="scope">
<el-button type="primary" link size="small" @click.stop="handleEdit(scope.row)"
v-auth="'group:edit'">编辑</el-button>
v-if="canEdit">编辑</el-button>
<el-button type="danger" link size="small" @click.stop="handleDelete(scope.row)"
v-auth="'group:delete'">删除</el-button>
v-if="canDelete">删除</el-button>
</template>
</el-table-column>
</el-table>
@@ -55,7 +55,7 @@
</el-icon>
</template>
</el-input>
<el-button type="primary" size="small" @click="handleAddUser" v-auth="'member:add'">添加成员</el-button>
<el-button type="primary" size="small" @click="handleAddUser" v-if="canAddMember">添加成员</el-button>
</div>
</div>
</template>
@@ -72,31 +72,37 @@
<el-table-column prop="name" label="姓名" show-overflow-tooltip />
<el-table-column label="角色" align="center">
<template #default="scope">
<template v-if="userRole === 2">
<el-select v-model="scope.row.role" placeholder="选择角色" size="small"
<template v-if="canManageRole">
<el-select v-model="scope.row.roles" placeholder="选择角色" size="small" multiple
@change="(value) => handleRoleChange(scope.row, value)">
<el-option label="普通员工" :value="0" />
<el-option label="部门主管" :value="1" />
<el-option label="综合部" :value="2" />
<el-option label="财务部" :value="3" />
<el-option label="普通员工" value="0" />
<el-option label="部门主管" value="1" />
<el-option label="综合部" value="2" />
<el-option label="财务部" value="3" />
</el-select>
</template>
<template v-else>
<el-tag :type="getRoleTagType(scope.row.role)">
{{ getRoleName(scope.row.role) }}
<div class="role-tags">
<el-tag v-for="role in scope.row.roles" :key="role" :type="getRoleTagType(role)"
class="role-tag">
{{ getRoleName(role) }}
</el-tag>
</div>
</template>
</template>
</el-table-column>
<el-table-column label="操作" width="220" fixed="right" align="center"
v-if="userRole === 2 || userRole === 3">
v-if="canViewSalary || canRemoveUser">
<template #default="scope">
<template v-if="userRole === 3">
<el-button type="primary" link size="small" @click="handleViewSalary(scope.row)"
v-auth="'member:salary'">查看工资配置</el-button>
<template v-if="canViewSalary">
<el-button type="primary" link size="small" @click="handleViewSalary(scope.row)">
查看工资配置
</el-button>
</template>
<el-button type="danger" link size="small" @click="handleRemoveUser(scope.row)"
v-auth="'member:delete'">移除</el-button>
v-if="canRemoveUser">
移除
</el-button>
</template>
</el-table-column>
</el-table>
@@ -203,7 +209,7 @@
</template>
<script setup>
import { ref, onMounted } from "vue";
import { ref, onMounted, computed } from "vue";
import { ElMessage, ElMessageBox } from "element-plus";
import {
getGroupList,
@@ -296,7 +302,21 @@ const groupRules = {
const router = useRouter();
const userInfo = JSON.parse(sessionStorage.getItem('userInfo') || '{}')
const userRole = userInfo.role || 0
const userRoles = userInfo.roles || []
// 检查是否有权限
const hasPermission = (requiredRoles) => {
return userRoles.some(role => requiredRoles.includes(Number(role)))
}
// 按钮权限判断
const canAdd = computed(() => hasPermission([2])) // 角色1和2可以添加
const canEdit = computed(() => hasPermission([2])) // 角色1和2可以编辑
const canDelete = computed(() => hasPermission([2])) // 只有角色1可以删除
const canManageRole = computed(() => hasPermission([2])) // 只有角色2可以管理角色
const canViewSalary = computed(() => hasPermission([3])) // 只有角色3可以查看工资
const canRemoveUser = computed(() => hasPermission([2])) // 只有角色2可以删除成员
const canAddMember = computed(() => hasPermission([2])) // 只有角色2可以添加成员
// 获取组别列表
const fetchGroupList = async () => {
@@ -355,14 +375,14 @@ const handleMemberSearch = () => {
);
};
// 修改成员角色
const handleRoleChange = async (user, role) => {
// 修改角色变更处理函数
const handleRoleChange = async (user, roles) => {
try {
const res = await updateGroupUserRole(
currentGroup.value.groupId,
user.userid,
role
);
const res = await updateGroupUserRole({
groupId: currentGroup.value.groupId,
userid: user.userid,
roles: roles
});
if (res.errcode === 0) {
ElMessage.success("修改成功");
const userInfo = JSON.parse(sessionStorage.getItem("userInfo")) || {}
@@ -376,11 +396,6 @@ const handleRoleChange = async (user, role) => {
ElMessage.error("修改失败");
}
};
const gotoLogin = () => {
sessionStorage.removeItem("token");
sessionStorage.removeItem("userInfo");
router.push("/login");
};
// 移除成员
const handleRemoveUser = async (user) => {
@@ -554,10 +569,10 @@ const fetchNonGroupUsers = async () => {
}
};
// 添加用户到组
// 修改添加用户到组的函数
const handleAddToGroup = async (user) => {
try {
const res = await addUserToGroup(currentGroup.value.groupId, user.userid, 0); // 默认角色为普通员工
const res = await addUserToGroup(currentGroup.value.groupId, user.userid, ["0"]); // 默认角色为普通员工
if (res.errcode === 0) {
ElMessage.success("添加成功");
addUserDialogVisible.value = false;
@@ -598,10 +613,10 @@ const handleSearch = () => {
// 获取角色名称
const getRoleName = (role) => {
const roleMap = {
0: '普通员工',
1: '部门主管',
2: '综合部',
3: '财务部'
"0": '普通员工',
"1": '部门主管',
"2": '综合部',
"3": '财务部'
}
return roleMap[role] || '未知角色'
}
@@ -609,10 +624,10 @@ const getRoleName = (role) => {
// 获取角色标签类型
const getRoleTagType = (role) => {
const typeMap = {
0: 'info',
1: 'success',
2: 'warning',
3: 'danger'
"0": 'info',
"1": 'success',
"2": 'warning',
"3": 'danger'
}
return typeMap[role] || 'info'
}
@@ -621,6 +636,12 @@ const getRoleTagType = (role) => {
onMounted(() => {
fetchGroupList();
});
const gotoLogin = () => {
sessionStorage.removeItem("token");
sessionStorage.removeItem("userInfo");
router.push("/login");
};
</script>
<style lang="scss" scoped>
@@ -909,4 +930,15 @@ onMounted(() => {
border-top: 1px solid var(--el-border-color-light);
background-color: var(--el-bg-color);
}
.role-tags {
display: flex;
gap: 4px;
justify-content: center;
flex-wrap: wrap;
.role-tag {
margin: 2px;
}
}
</style>
+46 -123
View File
@@ -5,24 +5,14 @@
<div class="card-header">
<span class="title">工资条列表</span>
<div class="header-right">
<el-date-picker
v-model="dateRange"
type="month"
placeholder="选择月份"
:default-time="defaultTime"
:shortcuts="dateShortcuts"
@change="handleDateChange"
style="width: 200px; margin-right: 8px;"
/>
<el-input
v-model="searchKeyword"
placeholder="请输入姓名搜索"
clearable
@input="handleSearch"
style="width: 200px; margin-right: 8px;"
>
<el-date-picker v-model="dateRange" type="month" placeholder="选择月份" :default-time="defaultTime"
:shortcuts="dateShortcuts" @change="handleDateChange" style="width: 200px; margin-right: 8px;" />
<el-input v-model="searchKeyword" placeholder="请输入姓名搜索" clearable @input="handleSearch"
style="width: 200px; margin-right: 8px;">
<template #prefix>
<el-icon><Search /></el-icon>
<el-icon>
<Search />
</el-icon>
</template>
</el-input>
<el-button type="success" @click="handleBatchShowToEmployee">批量展示给员工</el-button>
@@ -30,24 +20,15 @@
</div>
</template>
<el-table
:data="payrollList"
style="width: 100%"
height="calc(100vh - 280px)"
border
stripe
:header-cell-style="{
<el-table :data="payrollList" style="width: 100%" height="calc(100vh - 280px)" border stripe :header-cell-style="{
background: '#f5f7fa',
color: '#606266',
fontWeight: 'bold',
textAlign: 'center',
padding: '12px 0'
}"
:cell-style="{
}" :cell-style="{
padding: '8px 0'
}"
@selection-change="handleSelectionChange"
>
}" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" />
<el-table-column label="头像" width="80" align="center" fixed="left">
<template #default="scope">
@@ -105,12 +86,14 @@
{{ formatMoney(scope.row.grossPaySummary) }}
</template>
</el-table-column>
<el-table-column prop="annualPerformanceDeduction" label="年度绩效扣款" width="120" align="right" show-overflow-tooltip>
<el-table-column prop="annualPerformanceDeduction" label="年度绩效扣款" width="120" align="right"
show-overflow-tooltip>
<template #default="scope">
{{ formatMoney(scope.row.annualPerformanceDeduction) }}
</template>
</el-table-column>
<el-table-column prop="monthlyPerformanceDeduction" label="月度绩效扣款" width="120" align="right" show-overflow-tooltip>
<el-table-column prop="monthlyPerformanceDeduction" label="月度绩效扣款" width="120" align="right"
show-overflow-tooltip>
<template #default="scope">
{{ formatMoney(scope.row.monthlyPerformanceDeduction) }}
</template>
@@ -130,7 +113,8 @@
{{ formatMoney(scope.row.lateEarlyDeduction) }}
</template>
</el-table-column>
<el-table-column prop="missedCheckInOutDeduction" label="签到签退扣款" width="120" align="right" show-overflow-tooltip>
<el-table-column prop="missedCheckInOutDeduction" label="签到签退扣款" width="120" align="right"
show-overflow-tooltip>
<template #default="scope">
{{ formatMoney(scope.row.missedCheckInOutDeduction) }}
</template>
@@ -155,7 +139,8 @@
{{ formatMoney(scope.row.basicPensionDeduction) }}
</template>
</el-table-column>
<el-table-column prop="unemploymentInsuranceDeduction" label="失业保险" width="120" align="right" show-overflow-tooltip>
<el-table-column prop="unemploymentInsuranceDeduction" label="失业保险" width="120" align="right"
show-overflow-tooltip>
<template #default="scope">
{{ formatMoney(scope.row.unemploymentInsuranceDeduction) }}
</template>
@@ -197,20 +182,10 @@
</el-table-column>
<el-table-column label="操作" width="180" fixed="right" align="center">
<template #default="scope">
<el-button
type="primary"
link
size="small"
@click="handleEdit(scope.row)"
>
<el-button type="primary" link size="small" @click="handleEdit(scope.row)">
修改
</el-button>
<el-button
type="success"
link
size="small"
@click="handleShowToEmployee(scope.row)"
>
<el-button type="success" link size="small" @click="handleShowToEmployee(scope.row)">
展示给员工
</el-button>
</template>
@@ -218,44 +193,24 @@
</el-table>
<div class="pagination-container">
<el-pagination
v-model:current-page="currentPage"
v-model:page-size="pageSize"
:page-sizes="[10, 20, 50, 100]"
:total="total"
layout="total, sizes, prev, pager, next, jumper"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
/>
<el-pagination v-model:current-page="currentPage" v-model:page-size="pageSize" :page-sizes="[10, 20, 50, 100]"
:total="total" layout="total, sizes, prev, pager, next, jumper" @size-change="handleSizeChange"
@current-change="handleCurrentChange" />
</div>
</el-card>
<!-- 修改工资条对话框 -->
<div class="edit-payroll-dialog">
<el-dialog
v-model="editDialogVisible"
title="修改工资条"
width="900px"
>
<el-dialog v-model="editDialogVisible" title="修改工资条" width="900px">
<div class="edit-form">
<el-form
ref="editFormRef"
:model="editForm"
:rules="editRules"
label-width="140px"
>
<el-form ref="editFormRef" :model="editForm" :rules="editRules" label-width="140px">
<!-- 仅保留可编辑字段 -->
<div class="form-section">
<div class="section-title">违纪扣款</div>
<div class="form-grid">
<el-form-item label="违纪扣款" prop="violationDeduction">
<el-input-number
v-model="editForm.violationDeduction"
:precision="2"
:step="100"
:min="0"
controls-position="right"
/>
<el-input-number v-model="editForm.violationDeduction" :precision="2" :step="100" :min="0"
controls-position="right" />
</el-form-item>
</div>
</div>
@@ -263,49 +218,24 @@
<div class="section-title">社保公积金</div>
<div class="form-grid">
<el-form-item label="基本养老保险" prop="basicPensionDeduction">
<el-input-number
v-model="editForm.basicPensionDeduction"
:precision="2"
:step="100"
:min="0"
controls-position="right"
/>
<el-input-number v-model="editForm.basicPensionDeduction" :precision="2" :step="100" :min="0"
controls-position="right" />
</el-form-item>
<el-form-item label="失业保险" prop="unemploymentInsuranceDeduction">
<el-input-number
v-model="editForm.unemploymentInsuranceDeduction"
:precision="2"
:step="100"
:min="0"
controls-position="right"
/>
<el-input-number v-model="editForm.unemploymentInsuranceDeduction" :precision="2" :step="100" :min="0"
controls-position="right" />
</el-form-item>
<el-form-item label="基本医疗保险" prop="basicMedicalDeduction">
<el-input-number
v-model="editForm.basicMedicalDeduction"
:precision="2"
:step="100"
:min="0"
controls-position="right"
/>
<el-input-number v-model="editForm.basicMedicalDeduction" :precision="2" :step="100" :min="0"
controls-position="right" />
</el-form-item>
<el-form-item label="补充医疗保险" prop="medicalDeductionAmount">
<el-input-number
v-model="editForm.medicalDeductionAmount"
:precision="2"
:step="100"
:min="0"
controls-position="right"
/>
<el-input-number v-model="editForm.medicalDeductionAmount" :precision="2" :step="100" :min="0"
controls-position="right" />
</el-form-item>
<el-form-item label="住房公积金" prop="housingFundDeduction">
<el-input-number
v-model="editForm.housingFundDeduction"
:precision="2"
:step="100"
:min="0"
controls-position="right"
/>
<el-input-number v-model="editForm.housingFundDeduction" :precision="2" :step="100" :min="0"
controls-position="right" />
</el-form-item>
</div>
</div>
@@ -313,22 +243,12 @@
<div class="section-title">其他扣款</div>
<div class="form-grid">
<el-form-item label="个人所得税" prop="individualTaxDeduction">
<el-input-number
v-model="editForm.individualTaxDeduction"
:precision="2"
:step="100"
:min="0"
controls-position="right"
/>
<el-input-number v-model="editForm.individualTaxDeduction" :precision="2" :step="100" :min="0"
controls-position="right" />
</el-form-item>
<el-form-item label="其他扣款" prop="otherDeduction">
<el-input-number
v-model="editForm.otherDeduction"
:precision="2"
:step="100"
:min="0"
controls-position="right"
/>
<el-input-number v-model="editForm.otherDeduction" :precision="2" :step="100" :min="0"
controls-position="right" />
</el-form-item>
</div>
</div>
@@ -358,7 +278,7 @@ import {
// 权限检查
const userInfo = JSON.parse(sessionStorage.getItem("userInfo") || "{}");
// if (userInfo.role !== 3) {
// if (userInfo.roles !== 3) {
// ElMessage.error("您没有权限访问此页面");
// window.history.back();
// }
@@ -854,7 +774,7 @@ onMounted(() => {
background-color: #f8fafd;
border-radius: 8px;
padding: 20px 24px 8px 24px;
box-shadow: 0 2px 8px rgba(0,0,0,0.03);
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
&:last-child {
margin-bottom: 0;
@@ -879,14 +799,17 @@ onMounted(() => {
:deep(.el-form-item) {
margin-bottom: 0;
.el-form-item__label {
font-weight: 500;
color: #333;
font-size: 15px;
}
.el-input-number {
width: 100%;
min-width: 120px;
.el-input__wrapper {
padding-right: 40px;
}
@@ -226,10 +226,6 @@ const formatMoney = (value) => {
// 权限检查
const userInfo = JSON.parse(sessionStorage.getItem("userInfo") || "{}");
// if (userInfo.role !== 3) {
// ElMessage.error("您没有权限访问此页面");
// window.history.back();
// }
// 列表数据
const attendanceList = ref([]);
@@ -278,10 +278,7 @@ import {
// 权限检查
const userInfo = JSON.parse(sessionStorage.getItem("userInfo") || "{}");
// if (userInfo.role !== 2) {
// ElMessage.error("您没有权限访问此页面");
// window.history.back();
// }
// 列表数据
const attendanceList = ref([]);
@@ -165,10 +165,7 @@ import {
// 权限检查
const userInfo = JSON.parse(sessionStorage.getItem("userInfo") || "{}");
// if (userInfo.role !== 2) {
// ElMessage.error("您没有权限访问此页面");
// window.history.back();
// }
// 列表数据
const attendanceList = ref([]);
@@ -164,10 +164,7 @@ import {
// 权限检查
const userInfo = JSON.parse(sessionStorage.getItem("userInfo") || "{}");
// if (userInfo.role !== 2) {
// ElMessage.error("您没有权限访问此页面");
// window.history.back();
// }
// 列表数据
const attendanceList = ref([]);