OMC/fe.ems.vue3
1
0
Fork 0
Code Issues Releases 3 Activity

fix: 用户管理页面

Browse Source
This commit is contained in:
TsMask
2023-09-05 17:11:22 +08:00
parent 0beb0c278e
commit 1ab5c4f3c6
3 changed files with 71 additions and 180 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/api/system/user.ts
View File

@@ -47,7 +47,7 @@ export function exportUser(query: Record<string, any>) {
*/
export function listUser(query: Record<string, any>) {
return request({
url: '/system/user/list',
url: '/userManage/v1/users',
method: 'get',
params: query,
});
@@ -60,7 +60,7 @@ export function listUser(query: Record<string, any>) {
*/
export function getUser(userId: string | number = '0') {
return request({
url: `/system/user/${userId}`,
url: `/userManage/v1/user/${userId}`,
method: 'get',
});
}
@@ -72,7 +72,7 @@ export function getUser(userId: string | number = '0') {
*/
export function addUser(data: Record<string, any>) {
return request({
url: '/system/user',
url: '/userManage/v1/user',
method: 'post',
data: data,
});
@@ -85,7 +85,7 @@ export function addUser(data: Record<string, any>) {
*/
export function updateUser(data: Record<string, any>) {
return request({
url: '/system/user',
url: '/userManage/v1/user',
method: 'put',
data: data,
});
@@ -98,7 +98,7 @@ export function updateUser(data: Record<string, any>) {
*/
export function delUser(userId: string | number) {
return request({
url: `/system/user/${userId}`,
url: `/userManage/v1/user/${userId}`,
method: 'delete',
});
}
@@ -111,7 +111,7 @@ export function delUser(userId: string | number) {
*/
export function resetUserPwd(userId: string | number, password: string) {
return request({
url: '/system/user/resetPwd',
url: '/userManage/v1/user/resetPwd',
method: 'put',
data: {
userId,
@@ -131,7 +131,7 @@ export function changeUserStatus(
status: string | number
) {
return request({
url: '/system/user/changeStatus',
url: '/userManage/v1/user/changeStatus',
method: 'put',
data: {
userId,

18
src/store/modules/user.ts
View File

@@ -107,7 +107,7 @@ const useUserStore = defineStore('user', {
// 登录
async fnLogin(loginBody: Record<string, string>) {
const res = await login(loginBody);
if (res.code === 200 && res.data) {
if (res.code === 1 && res.data) {
const token = res.data[TOKEN_RESPONSE_FIELD];
setToken(token);
this.token = token;
@@ -117,17 +117,17 @@ const useUserStore = defineStore('user', {
// 获取用户信息
async fnGetInfo() {
const res = await getInfo();
if (res.code === 200 && res.data) {
if (res.code === 1 && res.data) {
const { user, roles, permissions } = res.data;
// 登录账号
this.userName = user.userName;
this.userName = user.accountId;
// 用户头像
this.avatar = user.avatar;
// 基础信息
this.nickName = user.nickName;
this.phonenumber = user.phonenumber;
this.nickName = user.name;
this.phonenumber = user.phone;
this.email = user.email;
this.sex = user.sex;
this.sex = user.gender;
// 验证返回的roles是否是一个非空数组
if (Array.isArray(roles) && roles.length > 0) {
@@ -139,14 +139,14 @@ const useUserStore = defineStore('user', {
}
// 水印文字信息=用户昵称 手机号
let waterMarkContent = this.nickName;
let waterMarkContent = this.userName;
if (this.phonenumber) {
waterMarkContent = `${this.nickName} ${this.phonenumber}`;
waterMarkContent = `${this.userName} ${this.phonenumber}`;
}
useLayoutStore().changeWaterMark(waterMarkContent);
}
// 网络错误时退出登录状态
if (res.code === 500) {
if (res.code === 0) {
removeToken();
window.location.reload();
}

217
src/views/system/user/index.vue
View File

@@ -59,8 +59,6 @@ let queryParams = reactive({
userName: '',
/**手机号 */
phonenumber: '',
/**部门ID */
deptId: '',
/**用户状态 */
status: undefined,
/**记录开始时间 */
@@ -78,7 +76,6 @@ function fnQueryReset() {
queryParams = Object.assign(queryParams, {
userName: '',
phonenumber: '',
deptId: '',
status: undefined,
beginTime: '',
endTime: '',
@@ -121,43 +118,37 @@ let tableState: TabeStateType = reactive({
let tableColumns: ColumnsType = [
{
title: '用户编号',
dataIndex: 'userId',
dataIndex: 'id',
align: 'center',
},
{
title: '登录账号',
dataIndex: 'userName',
dataIndex: 'accountId',
align: 'center',
},
{
title: '用户昵称',
dataIndex: 'nickName',
title: '用户名',
dataIndex: 'name',
align: 'center',
},
{
title: '手机号码',
dataIndex: 'phonenumber',
dataIndex: 'phone',
align: 'center',
},
{
title: '部门名称',
dataIndex: 'deptId',
key: 'deptId',
title: '用户类型',
dataIndex: 'groupName',
key: 'groupName',
align: 'center',
},
{
title: '登录地址',
dataIndex: 'loginIp',
key: 'loginIp',
align: 'center',
},
{
title: '登录时间',
dataIndex: 'loginDate',
title: '创建时间',
dataIndex: 'createTime',
align: 'center',
customRender(opt) {
if (+opt.value <= 0) return '';
return parseDateToStr(+opt.value);
if (!opt.value) return '';
return parseDateToStr(opt.value);
},
},
{
@@ -168,7 +159,7 @@ let tableColumns: ColumnsType = [
},
{
title: '操作',
key: 'userId',
key: 'id',
align: 'center',
},
];
@@ -217,15 +208,12 @@ function fnTableSelectedRowKeys(keys: (string | number)[]) {
}
type OptionsType = {
/**岗位选择列表 */
posts: Record<string, any>[];
/**角色选择列表 */
roles: Record<string, any>[];
};
/**初始用户选择列表 */
let options: OptionsType = {
posts: [],
roles: [],
};
@@ -272,7 +260,6 @@ let modalState: ModalStateType = reactive({
},
confirmLoading: false,
options: {
posts: [],
roles: [],
},
});
@@ -334,19 +321,13 @@ function fnModalVisibleByVive(userId: string | number) {
getUser(userId).then(res => {
modalState.confirmLoading = false;
hide();
if (res.code === 200 && res.data) {
if (res.code === 1 && res.data) {
const roles = res.data.roles.map((m: Record<string, any>) => {
const disabled = m.status === '0';
Reflect.set(m, 'disabled', disabled);
return m;
});
const posts = res.data.posts.map((m: Record<string, any>) => {
const disabled = m.status === '0';
Reflect.set(m, 'disabled', disabled);
return m;
});
modalState.options.roles = roles;
modalState.options.posts = posts;
const { user, roleIds, postIds } = res.data;
modalState.from = Object.assign(modalState.from, user);
modalState.from.roleIds = roleIds;
@@ -370,7 +351,6 @@ function fnModalVisibleByEdit(userId?: string | number) {
modalStateFrom.resetFields();
if (options.roles.length > 0) {
modalState.options.roles = options.roles;
modalState.options.posts = options.posts;
modalState.title = '添加用户信息';
modalState.visibleByEdit = true;
} else {
@@ -381,21 +361,14 @@ function fnModalVisibleByEdit(userId?: string | number) {
getUser().then(res => {
modalState.confirmLoading = false;
hide();
if (res.code === 200 && res.data) {
if (res.code === 1 && res.data) {
const roles = res.data.roles.map((m: Record<string, any>) => {
const disabled = m.status === '0';
Reflect.set(m, 'disabled', disabled);
return m;
});
const posts = res.data.posts.map((m: Record<string, any>) => {
const disabled = m.status === '0';
Reflect.set(m, 'disabled', disabled);
return m;
});
options.roles = roles;
options.posts = posts;
modalState.options.roles = roles;
modalState.options.posts = posts;
const { user, roleIds, postIds } = res.data;
modalState.from = Object.assign(modalState.from, user);
modalState.from.roleIds = roleIds;
@@ -414,19 +387,13 @@ function fnModalVisibleByEdit(userId?: string | number) {
getUser(userId).then(res => {
modalState.confirmLoading = false;
hide();
if (res.code === 200 && res.data) {
if (res.code === 1 && res.data) {
const roles = res.data.roles.map((m: Record<string, any>) => {
const disabled = m.status === '0';
Reflect.set(m, 'disabled', disabled);
return m;
});
const posts = res.data.posts.map((m: Record<string, any>) => {
const disabled = m.status === '0';
Reflect.set(m, 'disabled', disabled);
return m;
});
modalState.options.roles = roles;
modalState.options.posts = posts;
const { user, roleIds, postIds } = res.data;
modalState.from = Object.assign(modalState.from, user);
modalState.from.roleIds = roleIds;
@@ -459,7 +426,7 @@ function fnModalOk() {
message.loading({ content: '请稍等...', key });
user
.then(res => {
if (res.code === 200) {
if (res.code === 1) {
message.success({
content: `${modalState.title}成功`,
key,
@@ -495,7 +462,6 @@ function fnModalCancel() {
modalState.visibleByResetPwd = false;
modalStateFrom.resetFields();
modalState.options.roles = [];
modalState.options.posts = [];
}
/**
@@ -511,7 +477,7 @@ function fnModalOkResetPwd() {
message.loading({ content: '请稍等...', key });
resetUserPwd(modalState.from.userId, modalState.from.password)
.then(res => {
if (res.code === 200) {
if (res.code === 1) {
message.success({
content: `${modalState.title}成功`,
key,
@@ -561,7 +527,7 @@ function fnRecordStatus(row: Record<string, string>) {
const key = 'changeUserStatus';
message.loading({ content: '请稍等...', key });
changeUserStatus(row.userId, row.status).then(res => {
if (res.code === 200) {
if (res.code === 1) {
message.success({
content: `${row.userName} ${text}成功`,
key: key,
@@ -598,7 +564,7 @@ function fnRecordDelete(userId: string = '0') {
const key = 'delUser';
message.loading({ content: '请稍等...', key });
delUser(userId).then(res => {
if (res.code === 200) {
if (res.code === 1) {
message.success({
content: `删除成功`,
key,
@@ -626,7 +592,7 @@ function fnExportList() {
const key = 'exportUser';
message.loading({ content: '请稍等...', key });
exportUser(toRaw(queryParams)).then(res => {
if (res.code === 200) {
if (res.code === 1) {
message.success({
content: `已完成导出`,
key,
@@ -684,7 +650,7 @@ function fnModalUploadXlsxImportExportTemplate() {
const hide = message.loading('正在下载...', 0);
importTemplate()
.then(res => {
if (res.code === 200) {
if (res.code === 1) {
message.success({
content: `成功读取并下载导入模板`,
duration: 2,
@@ -710,7 +676,7 @@ function fnGetList() {
queryParams.beginTime = queryRangePicker.value[0];
queryParams.endTime = queryRangePicker.value[1];
listUser(toRaw(queryParams)).then(res => {
if (res.code === 200 && Array.isArray(res.rows)) {
if (res.code === 1 && Array.isArray(res.rows)) {
// 取消勾选
if (tableState.selectedRowKeys.length > 0) {
tableState.selectedRowKeys = [];
@@ -729,7 +695,7 @@ let deptTreeData = ref<DataNode[]>([]);
function fnGetDeptTree() {
if (deptTreeData.value.length > 0) return;
deptTreeSelect().then(res => {
if (res.code === 200 && Array.isArray(res.data)) {
if (res.code === 1 && Array.isArray(res.data)) {
deptTreeData.value = res.data;
}
});
@@ -768,43 +734,6 @@ onMounted(() => {
>
<!-- 表格搜索栏 -->
<a-form :model="queryParams" name="queryParams" layout="horizontal">
<a-row :gutter="16">
<a-col :lg="18" :md="12" :xs="24">
<a-form-item label="部门名称" name="deptId">
<a-tree-select
v-model:value="queryParams.deptId"
placeholder="部门名称"
show-search
tree-default-expand-all
:tree-data="deptTreeData"
:field-names="{
children: 'children',
label: 'label',
value: 'id',
}"
tree-node-label-prop="label"
tree-node-filter-prop="label"
style="width: 100%"
:dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
>
</a-tree-select>
</a-form-item>
</a-col>
<a-col :lg="6" :md="12" :xs="24">
<a-form-item>
<a-space :size="8">
<a-button type="primary" @click.prevent="fnGetList">
<template #icon><SearchOutlined /></template>
搜索
</a-button>
<a-button type="default" @click.prevent="fnQueryReset">
<template #icon><ClearOutlined /></template>
重置
</a-button>
</a-space>
</a-form-item>
</a-col>
</a-row>
<a-row :gutter="16">
<a-col :lg="6" :md="12" :xs="24">
<a-form-item label="登录账号" name="userName">
@@ -816,16 +745,6 @@ onMounted(() => {
></a-input>
</a-form-item>
</a-col>
<a-col :lg="6" :md="12" :xs="24">
<a-form-item label="手机号码" name="phonenumber">
<a-input
v-model:value="queryParams.phonenumber"
allow-clear
:maxlength="11"
placeholder="请输入手机号码"
></a-input>
</a-form-item>
</a-col>
<a-col :lg="4" :md="12" :xs="24">
<a-form-item label="用户状态" name="status">
<a-select
@@ -837,16 +756,18 @@ onMounted(() => {
</a-select>
</a-form-item>
</a-col>
<a-col :lg="8" :md="12" :xs="24">
<a-form-item label="登录时间" name="queryRangePicker">
<a-range-picker
v-model:value="queryRangePicker"
allow-clear
bordered
value-format="YYYY-MM-DD"
:placeholder="['登录开始', '登录结束']"
style="width: 100%"
></a-range-picker>
<a-col :lg="6" :md="12" :xs="24">
<a-form-item>
<a-space :size="8">
<a-button type="primary" @click.prevent="fnGetList">
<template #icon><SearchOutlined /></template>
搜索
</a-button>
<a-button type="default" @click.prevent="fnQueryReset">
<template #icon><ClearOutlined /></template>
重置
</a-button>
</a-space>
</a-form-item>
</a-col>
</a-row>
@@ -875,7 +796,7 @@ onMounted(() => {
<template #icon><DeleteOutlined /></template>
删除
</a-button>
<a-button
<!-- <a-button
type="dashed"
@click.prevent="fnModalUploadXlsxImportOpen()"
v-perms:has="['system:user:import']"
@@ -890,7 +811,7 @@ onMounted(() => {
>
<template #icon><ExportOutlined /></template>
导出
</a-button>
</a-button> -->
</a-space>
</template>
@@ -945,7 +866,7 @@ onMounted(() => {
<!-- 表格列表 -->
<a-table
class="table"
row-key="userId"
row-key="id"
:columns="tableColumns"
:loading="tableState.loading"
:data-source="tableState.data"
@@ -959,10 +880,10 @@ onMounted(() => {
}"
>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'deptId'">
<!-- <template v-if="column.key === 'deptId'">
{{ record.dept?.deptName }}
</template>
<template v-if="column.key === 'status'">
</template> -->
<!-- <template v-if="column.key === 'status'">
<a-switch
v-if="record.userId !== '1'"
v-perms:has="['system:user:edit']"
@@ -979,14 +900,14 @@ onMounted(() => {
:options="dict.sysNormalDisable"
:value="record.status"
/>
</template>
<template v-if="column.key === 'userId'">
<a-space :size="8" align="center" v-if="record.userId !== '1'">
</template> -->
<template v-if="column.key === 'id'">
<a-space :size="8" align="center" v-if="record.id !== '1'">
<a-tooltip>
<template #title>查看详情</template>
<a-button
type="link"
@click.prevent="fnModalVisibleByVive(record.userId)"
@click.prevent="fnModalVisibleByVive(record.id)"
v-perms:has="['system:user:query']"
>
<template #icon><ProfileOutlined /></template>
@@ -996,7 +917,7 @@ onMounted(() => {
<template #title>编辑</template>
<a-button
type="link"
@click.prevent="fnModalVisibleByEdit(record.userId)"
@click.prevent="fnModalVisibleByEdit(record.id)"
v-perms:has="['system:user:edit']"
>
<template #icon><FormOutlined /></template>
@@ -1006,13 +927,13 @@ onMounted(() => {
<template #title>删除</template>
<a-button
type="link"
@click.prevent="fnRecordDelete(record.userId)"
@click.prevent="fnRecordDelete(record.id)"
v-perms:has="['system:user:remove']"
>
<template #icon><DeleteOutlined /></template>
</a-button>
</a-tooltip>
<a-tooltip>
<!-- <a-tooltip>
<template #title>重置密码</template>
<a-button
type="link"
@@ -1021,7 +942,7 @@ onMounted(() => {
>
<template #icon><SecurityScanOutlined /></template>
</a-button>
</a-tooltip>
</a-tooltip> -->
</a-space>
</template>
</template>
@@ -1138,21 +1059,7 @@ onMounted(() => {
</a-form-item>
<a-row :gutter="16">
<a-col :lg="12" :md="12" :xs="24">
<a-form-item label="用户岗位" name="postIds">
<a-select
:value="modalState.from.postIds"
disabled
mode="multiple"
placeholder="请选择用户岗位"
option-label-prop="postName"
:options="modalState.options.posts"
:field-names="{ label: 'postName', value: 'postId' }"
>
</a-select>
</a-form-item>
</a-col>
<a-col :lg="12" :md="12" :xs="24">
<a-col :lg="24" :md="24" :xs="24">
<a-form-item label="用户角色" name="roleIds">
<a-select
:value="modalState.from.roleIds"
@@ -1318,23 +1225,7 @@ onMounted(() => {
</a-form-item>
<a-row :gutter="16">
<a-col :lg="12" :md="12" :xs="24">
<a-form-item label="用户岗位" name="postIds">
<a-select
v-model:value="modalState.from.postIds"
allow-clear
mode="multiple"
placeholder="请选择用户岗位"
show-search
option-filter-prop="postName"
option-label-prop="postName"
:options="modalState.options.posts"
:field-names="{ label: 'postName', value: 'postId' }"
>
</a-select>
</a-form-item>
</a-col>
<a-col :lg="12" :md="12" :xs="24">
<a-col :lg="24" :md="24" :xs="24">
<a-form-item label="用户角色" name="roleIds">
<a-select
v-model:value="modalState.from.roleIds"
@@ -1411,14 +1302,14 @@ onMounted(() => {
</a-modal>
<!-- 上传导入表格数据文件框 -->
<UploadXlsxImport
<!-- <UploadXlsxImport
:title="modalUploadXlsxImportState.title"
v-model:visible="modalUploadXlsxImportState.visible"
:show-update-support="true"
:upload-file-method="importData"
:download-template-method="fnModalUploadXlsxImportExportTemplate"
@close="fnModalUploadXlsxImportClose"
/>
/> -->
</PageContainer>
</template>