liangbin
/
JSDW
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

refactor(用户管理): 优化用户管理和审核功能 

- 在用户管理模块中移除未使用的导入并优化用户对话框逻辑
- 在用户审核模块中重构查询表单和状态显示，添加重置功能
- 完善用户对话框的编辑功能，包括树形选择器高亮和表单验证
This commit is contained in:
liangbin 2026-01-30 10:04:32 +08:00
parent f56c7923df
commit 37747116ed
3 changed files with 131 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

80
src/views/Logistics/UserManagement/UserDialog.vue
View File

@ -18,7 +18,8 @@
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="初始密码">
<el-input v-model="formData.password" type="password" placeholder="请输入密码" show-password />
<el-input v-model="formData.password" type="password" placeholder="请输入密码" show-password
:disabled="!!props.userId" />
</el-form-item>
</el-col>
<el-col :span="12">
@ -35,10 +36,10 @@
<el-form-item label="所属单位">
<div class="TreeBox">
<el-tree :data="unitTreeData" :props="treeProps" show-line highlight-current default-expand-all
<el-tree ref="treeRef" :current-node-key="formData.deptId" :data="unitTreeData"
:props="treeProps" node-key="id" show-line highlight-current default-expand-all
@current-change="handleUnitChange" :expand-on-click-node="false" class="unit-tree" />
</div>
</el-form-item>
<el-form-item label="角色">
@ -63,11 +64,11 @@
</template>
<script setup>
import { getUser, deptTreeSelect, addUser } from '@/api/system/user.js'
import { getUser, deptTreeSelect, addUser, updateUser } from '@/api/system/user.js'
import { listRole } from '@/api/system/role.js'
import { ElMessage } from 'element-plus'
import { ref, onBeforeMount } from 'vue'
import { ref, onBeforeMount, onMounted, watch, nextTick } from 'vue'
const props = defineProps({
userId: {
type: Number || String,
@ -103,6 +104,9 @@ const roleList = ref([])
// 所属单位树形数据
const unitTreeData = ref([])
// 树组件引用
const treeRef = ref(null)
// 树形结构配置
const treeProps = {
children: 'children',
@ -113,6 +117,12 @@ onBeforeMount(() => {
getUnitTree()
})
onMounted(() => {
if (props.userId) {
getUserDetail()
}
})
// 查询角色
const getRoleList = async () => {
let res = await listRole()
@ -133,14 +143,33 @@ const getUnitTree = async () => {
// 查询用户详情
const getUserDetail = async () => {
let res = await getUser({
account: formData.value.account
})
let res = await getUser(props.userId)
if (res.code === 200) {
formData.value = res.data
console.log('用户详情:', res.data)
formData.value.userName = res.data.userName // 账户名
formData.value.nickName = res.data.nickName // 姓名
formData.value.password = res.data.password // 初始密码
formData.value.phonenumber = res.data.phonenumber // 联系电话
formData.value.email = res.data.email // 邮箱
// 角色
formData.value.roleId = res.data.roleId
formData.value.roleName = res.data.roleName
// 选中所属单位
formData.value.deptId = res.data.dept.deptId
formData.value.deptName = res.data.dept.deptName
}
}
// 监听 deptId 变化，手动设置树节点高亮
watch(() => formData.value.deptId, (newVal) => {
if (newVal && treeRef.value) {
nextTick(() => {
treeRef.value.setCurrentKey(newVal)
})
}
}, { immediate: true })
// 角色选择事件
const handleRoleChange = (roleId) => {
console.log('Selected roleId:', roleId)
@ -164,13 +193,17 @@ const handleClose = () => {
}
// 提交表单
const handleSubmit = () => {
const handleSubmit = async () => {
console.log('提交数据:', formData.value)
// 校验表单
if (!formData.value.roleId) {
ElMessage.warning('请选择角色')
return
}
if (!formData.value.password && !props.userId) {
ElMessage.warning('请输入初始密码')
return
}
if (!formData.value.deptId) {
ElMessage.warning('请选择所属单位')
return
@ -188,16 +221,33 @@ const handleSubmit = () => {
return
}
const isEditMode = !!props.userId
const fetchFunc = isEditMode ? updateUser : addUser
const successMsg = isEditMode ? '更新成功' : '添加成功'
const errorMsg = isEditMode ? '更新失败' : '添加失败'
addUser(formData.value).then(res => {
const params = {
...formData.value,
userId: props.userId
}
if (isEditMode) {
delete params.password
}
try {
const res = await fetchFunc(params)
if (res.code === 200) {
ElMessage.success('添加成功')
ElMessage.success(successMsg)
props.CloseDialog()
} else {
ElMessage.error(res.msg || '添加失败')
ElMessage.error(res.msg || errorMsg)
}
})
} catch (error) {
ElMessage.error(errorMsg)
}
// 提交逻辑
// props.CloseDialog()

2
src/views/Logistics/UserManagement/index.vue
View File

@ -117,7 +117,7 @@
</div>
</template>
<script setup>
import { ref, onMounted, getCurrentInstance, reactive, toRefs, nextTick } from 'vue'
import { ref, onMounted, getCurrentInstance, reactive } from 'vue'
import { listDept } from '@/api/treeRatingManagement'
import { listUser, delUser } from '@/api/system/user.js'
import UserDialog from "./UserDialog.vue";

79
src/views/Logistics/UserReview/index.vue
View File

@ -2,18 +2,18 @@
<template>
<div class="MainBox">
<div class="FormBox card-box">
<el-form :model="formData" inline ref="formRef">
<el-form :model="queryData" inline ref="formRef">
<el-form-item label="用户名" prop="username">
<el-input v-model="formData.username" placeholder="请输入用户名"></el-input>
<el-input v-model="queryData.username" placeholder="请输入用户名"></el-input>
</el-form-item>
<el-form-item label="时间范围" prop="timeRange">
<el-date-picker v-model="formData.timeRange" type="daterange" value-format="yyyy-MM-dd"
<el-date-picker v-model="queryData.timeRange" type="daterange" value-format="yyyy-MM-dd"
range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" />
</el-form-item>
</el-form>
<div class="ButtonBox">
<el-button type="primary" @click="handleSearch">查询</el-button>
<el-button type="primary" @click="handleSearch">重置</el-button>
<el-button type="primary" @click="handleReset">重置</el-button>
</div>
</div>
<div class="card-box">
@ -28,11 +28,17 @@
</el-table-column>
<el-table-column prop="phonenumber" label="联系电话" />
<el-table-column prop="remark" label="角色" />
<el-table-column prop="status" label="状态" />
<el-table-column prop="status" label="状态">
<template #default="{ row }">
<el-tag type="primary">
{{ statusMap[row.status] || '-' }}
</el-tag>
</template>
</el-table-column>
<el-table-column prop="operation" label="操作" width="100">
<template #default="scope">
<div class="FlexBox">
<el-button type="text" size="mini" @click="handleApprove(scope.row)">审批</el-button>
<el-button type="text" size="mini" @click="handleApprove(scope.row)">审批</el-button>
</div>
</template>
</el-table-column>
@ -44,17 +50,21 @@
@current-change="handleCurrentChange" />
</div>
</div>
</div>
</template>
<script setup>
import dayjs from "dayjs";
import { ref, onBeforeMount } from "vue";
import { listUser } from "@/api/system/user";
import { listUser, FetchUserReview } from "@/api/system/user";
// 状态映射
const statusMap = {
'0': '已生效',
'1': '已停用',
'2': '待审核',
}
// 查询表单
const formData = ref({
const queryData = ref({
username: "",
timeRange: [],
});
@ -72,19 +82,44 @@ const pageInfo = ref({
// 表格数据
const tableData = ref([]);
// 当前审批的用户
const currentUser = ref();
// 分页切换
const handleCurrentChange = (val) => {
pageInfo.value.pageNum = val;
getinit();
}
onBeforeMount(() => {
getinit();
});
// 查询用户列表
const handleSearch = () => {
pageInfo.value.pageNum = 1;
getinit();
}
// 重置查询表单
const handleReset = () => {
queryData.value = {
username: "",
timeRange: [],
};
pageInfo.value.pageNum = 1;
getinit();
}
// 初始化查询用户列表
const getinit = async () => {
let query = {
username: formData.value.username,
startTime: formData.value.timeRange[0] ? dayjs(formData.value.timeRange[0]).format('YYYY-MM-DD') : '',
endTime: formData.value.timeRange[1] ? dayjs(formData.value.timeRange[1]).format('YYYY-MM-DD') : '',
username: queryData.value.username,
startTime: queryData.value.timeRange[0] ? dayjs(queryData.value.timeRange[0]).format('YYYY-MM-DD') : '',
endTime: queryData.value.timeRange[1] ? dayjs(queryData.value.timeRange[1]).format('YYYY-MM-DD') : '',
pageNum: pageInfo.value.pageNum,
pageSize: pageInfo.value.pageSize,
pageSize: pageInfo.value.pageSize,
status: 2
};
loading.value = true;
let res = await listUser(query);
@ -95,6 +130,22 @@ const getinit = async () => {
}
};
// 审批用户
const handleApprove = async (row) => {
let params = {
userId: row.userId,
status: row.status === 2 ? 0 : 2,
};
let res = await FetchUserReview(params);
if (res.code === 200) {
ElMessage.success('操作成功');
getinit();
} else {
ElMessage.error(res.msg || '操作失败');
}
}
</script>
<style scoped lang="scss">
.MainBox {