manager/orion-visor
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

⚡ 优化用户状态交互逻辑.

Browse Source
This commit is contained in:
lijiahang
2024-04-16 12:01:44 +08:00
parent e3fd75e570
commit a3e354cea9
19 changed files with 78 additions and 133 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
orion-ops-ui/src/api/interceptor.ts
View File

@@ -46,7 +46,7 @@ axios.interceptors.response.use(
return res;
}
// 异常判断
if ([401, 700, 701, 702, 703].includes(code)) {
if ([401, 700, 701, 702].includes(code)) {
// 提示
Message.error({
content: res.msg || 'Error',

64
orion-ops-ui/src/views/user/role/components/role-table.vue
View File

@@ -68,27 +68,27 @@
</template>
<!-- 状态 -->
<template #status="{ record }">
<span class="circle" :style="{
background: getDictValue(roleStatusKey, record.status, 'color')
}" />
{{ getDictValue(roleStatusKey, record.status) }}
<!-- 有修改权限 -->
<a-switch v-if="hasPermission('infra:system-role:update-status')"
type="round"
v-model="record.status"
:disabled="record.code === AdminRoleCode"
:checked-text="getDictValue(roleStatusKey, RoleStatus.ENABLED)"
:unchecked-text="getDictValue(roleStatusKey, RoleStatus.DISABLED)"
:checked-value="RoleStatus.ENABLED"
:unchecked-value="RoleStatus.DISABLED"
:before-change="(s) => updateStatus(record.id, s as number)" />
<!-- 无修改权限 -->
<span v-else>
<span class="circle" :style="{
background: getDictValue(roleStatusKey, record.status, 'color')
}" />
{{ getDictValue(roleStatusKey, record.status) }}
</span>
</template>
<!-- 操作 -->
<template #handle="{ record }">
<div class="table-handle-wrapper">
<!-- 修改状态 -->
<a-popconfirm :content="`确定要${toggleDictValue(roleStatusKey, record.status, 'label')}当前角色吗?`"
position="left"
type="warning"
@ok="toggleRoleStatus(record)">
<a-button v-permission="['infra:system-role:delete']"
:disabled="record.code === AdminRoleCode"
:status="toggleDictValue(roleStatusKey, record.status, 'status')"
type="text"
size="mini">
{{ toggleDictValue(roleStatusKey, record.status, 'label') }}
</a-button>
</a-popconfirm>
<!-- 分配菜单 -->
<a-button v-permission="['infra:system-role:grant-menu']"
:disabled="record.code === AdminRoleCode"
@@ -136,8 +136,9 @@
import { Message } from '@arco-design/web-vue';
import useLoading from '@/hooks/loading';
import columns from '../types/table.columns';
import { roleStatusKey } from '../types/const';
import { RoleStatus, roleStatusKey } from '../types/const';
import { usePagination } from '@/types/table';
import usePermission from '@/hooks/permission';
import { useDictStore } from '@/store';
import { AdminRoleCode } from '@/types/const';
@@ -146,8 +147,9 @@
const tableRenderData = ref<RoleQueryResponse[]>([]);
const pagination = usePagination();
const { hasPermission } = usePermission();
const { loading, setLoading } = useLoading();
const { toOptions, getDictValue, toggleDictValue, toggleDict } = useDictStore();
const { toOptions, getDictValue } = useDictStore();
const formModel = reactive<RoleQueryRequest>({
id: undefined,
@@ -156,23 +158,13 @@
status: undefined,
});
// 修改状态
const toggleRoleStatus = async (record: any) => {
try {
setLoading(true);
const toggleStatus = toggleDict(roleStatusKey, record.status);
// 调用修改接口
await updateRoleStatus({
id: record.id,
status: toggleStatus.value as number
});
Message.success(`${toggleStatus.label}成功`);
// 修改行状态
record.status = toggleStatus.value;
} catch (e) {
} finally {
setLoading(false);
}
// 更新状态
const updateStatus = (id: number, status: number) => {
return updateRoleStatus({
id, status
}).then(() => {
Message.success('已' + getDictValue(roleStatusKey, status, 'label'));
});
};
// 删除当前行

6
orion-ops-ui/src/views/user/role/types/table.columns.ts
View File

@@ -18,11 +18,11 @@ const columns = [
dataIndex: 'code',
slotName: 'code',
}, {
title: '状态',
title: '角色状态',
dataIndex: 'status',
slotName: 'status',
align: 'center',
width: 84,
width: 128,
}, {
title: '创建时间',
dataIndex: 'createTime',
@@ -35,7 +35,7 @@ const columns = [
}, {
title: '操作',
slotName: 'handle',
width: 240,
width: 198,
align: 'center',
fixed: 'right',
},

72
orion-ops-ui/src/views/user/user/components/user-table.vue
View File

@@ -77,37 +77,32 @@
<template #username="{ record }">
<span class="span-blue text-copy"
@click="copy(record.username)">
{{ record.username }}`
{{ record.username }}
</span>
</template>
<!-- 状态 -->
<template #status="{ record }">
<span class="circle" :style="{
background: getDictValue(userStatusKey, record.status, 'color')
}" />
{{ getDictValue(userStatusKey, record.status) }}
<!-- 有修改权限 -->
<a-switch v-if="hasPermission('infra:system-user:update-status')"
type="round"
v-model="record.status"
:disabled="record.id === userStore.id"
:checked-text="getDictValue(userStatusKey, UserStatus.ENABLED)"
:unchecked-text="getDictValue(userStatusKey, UserStatus.DISABLED)"
:checked-value="UserStatus.ENABLED"
:unchecked-value="UserStatus.DISABLED"
:before-change="(s) => updateStatus(record.id, s as number)" />
<!-- 无修改权限 -->
<span v-else>
<span class="circle" :style="{
background: getDictValue(userStatusKey, record.status, 'color')
}" />
{{ getDictValue(userStatusKey, record.status) }}
</span>
</template>
<!-- 操作 -->
<template #handle="{ record }">
<div class="table-handle-wrapper">
<!-- 启用/停用 -->
<a-popconfirm :content="`确定要${UserStatus.ENABLED === record.status
? getDictValue(userStatusKey, UserStatus.DISABLED)
: getDictValue(userStatusKey, UserStatus.ENABLED)}当前用户?`"
position="left"
type="warning"
@ok="updateStatus(record)">
<a-button v-permission="['infra:system-user:update-status']"
type="text"
size="mini"
:disabled="record.id === userStore.id">
{{
UserStatus.ENABLED === record.status
? getDictValue(userStatusKey, UserStatus.DISABLED)
: getDictValue(userStatusKey, UserStatus.ENABLED)
}}
</a-button>
</a-popconfirm>
<!-- 修改 -->
<a-button type="text"
size="mini"
@@ -167,12 +162,13 @@
import { reactive, ref, onMounted } from 'vue';
import { deleteUser, getUserPage, updateUserStatus } from '@/api/user/user';
import { Message } from '@arco-design/web-vue';
import useLoading from '@/hooks/loading';
import columns from '../types/table.columns';
import { userStatusKey, UserStatus } from '../types/const';
import useLoading from '@/hooks/loading';
import { usePagination } from '@/types/table';
import { useDictStore, useUserStore } from '@/store';
import usePermission from '@/hooks/permission';
import { useRouter } from 'vue-router';
import { useDictStore, useUserStore } from '@/store';
import { copy } from '@/hooks/copy';
const emits = defineEmits(['openAdd', 'openUpdate', 'openResetPassword', 'openGrantRole']);
@@ -180,8 +176,9 @@
const tableRenderData = ref<UserQueryResponse[]>([]);
const pagination = usePagination();
const { hasPermission } = usePermission();
const { loading, setLoading } = useLoading();
const { toOptions, getDictValue, getDict } = useDictStore();
const { toOptions, getDictValue } = useDictStore();
const formModel = reactive<UserQueryRequest>({
id: undefined,
@@ -216,23 +213,12 @@
};
// 更新状态
const updateStatus = async (record: any) => {
try {
setLoading(true);
// 更新状态
const newStatus = UserStatus.ENABLED === record.status
? getDict(userStatusKey, UserStatus.DISABLED)
: getDict(userStatusKey, UserStatus.ENABLED);
await updateUserStatus({
id: record.id,
status: newStatus.value as number
});
Message.success(`${newStatus.label}成功`);
record.status = newStatus.value;
} catch (e) {
} finally {
setLoading(false);
}
const updateStatus = (id: number, status: number) => {
return updateUserStatus({
id, status
}).then(() => {
Message.success('已' + getDictValue(userStatusKey, status, 'label'));
});
};
// 打开详情

2
orion-ops-ui/src/views/user/user/types/const.ts
View File

@@ -4,8 +4,6 @@ export const UserStatus = {
DISABLED: 0,
// 启用
ENABLED: 1,
// 锁定
LOCKED: 2,
};
// 菜单配置值类型 字典项

6
orion-ops-ui/src/views/user/user/types/table.columns.ts
View File

@@ -34,11 +34,11 @@ const columns = [
ellipsis: true,
tooltip: true,
}, {
title: '状态',
title: '用户状态',
dataIndex: 'status',
slotName: 'status',
align: 'center',
width: 84
width: 128,
}, {
title: '最后登录时间',
dataIndex: 'lastLoginTime',
@@ -51,7 +51,7 @@ const columns = [
}, {
title: '操作',
slotName: 'handle',
width: 340,
width: 298,
align: 'center',
fixed: 'right',
},