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
2023-10-27 14:48:50 +08:00
parent d32f21dc91
commit 706492f54a
48 changed files with 395 additions and 360 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -18,7 +18,7 @@
<a-form-item field="status" label="角色状态" label-col-flex="50px">
<a-select v-model="formModel.status"
placeholder="请选择角色状态"
:options="toOptions(RoleStatusEnum)"
:options="toOptions(roleStatusKey)"
allow-clear />
</a-form-item>
</a-query-header>
@@ -67,24 +67,24 @@
<!-- 状态 -->
<template #status="{ record }">
<span class="circle" :style="{
background: getEnumValue(record.status, RoleStatusEnum, 'color')
background: getDictValue(roleStatusKey, record.status, 'color')
}" />
{{ getEnumValue(record.status, RoleStatusEnum) }}
{{ getDictValue(roleStatusKey, record.status) }}
</template>
<!-- 操作 -->
<template #handle="{ record }">
<div class="table-handle-wrapper">
<!-- 修改状态 -->
<a-popconfirm :content="`确定要${toggleEnumValue(record.status, RoleStatusEnum, 'label')}当前角色吗?`"
<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 === 'admin'"
:status="toggleEnumValue(record.status, RoleStatusEnum, 'status')"
:status="toggleDictValue(roleStatusKey, record.status, 'status')"
type="text"
size="mini">
{{ toggleEnumValue(record.status, RoleStatusEnum, 'label') }}
{{ toggleDictValue(roleStatusKey, record.status, 'label') }}
</a-button>
</a-popconfirm>
<!-- 分配菜单 -->
@@ -129,20 +129,22 @@
<script lang="ts" setup>
import type { RoleQueryRequest, RoleQueryResponse } from '@/api/user/role';
import { reactive, ref } from 'vue';
import { reactive, ref, onMounted } from 'vue';
import { deleteRole, getRolePage, updateRoleStatus } from '@/api/user/role';
import { Message } from '@arco-design/web-vue';
import useLoading from '@/hooks/loading';
import columns from '../types/table.columns';
import { RoleStatusEnum } from '../types/enum.types';
import { toOptions, getEnumValue, toggleEnumValue, toggleEnum } from '@/utils/enum';
import { roleStatusKey } from '../types/const';
import { usePagination } from '@/types/table';
import { useDictStore } from '@/store';
const tableRenderData = ref<RoleQueryResponse[]>([]);
const { loading, setLoading } = useLoading();
const emits = defineEmits(['openAdd', 'openUpdate', 'openGrant']);
const tableRenderData = ref<RoleQueryResponse[]>([]);
const pagination = usePagination();
const { loading, setLoading } = useLoading();
const { toOptions, getDictValue, toggleDictValue, toggleDict } = useDictStore();
const formModel = reactive<RoleQueryRequest>({
id: undefined,
@@ -155,9 +157,12 @@
const toggleRoleStatus = async (record: any) => {
try {
setLoading(true);
const toggleStatus = toggleEnum(record.status, RoleStatusEnum);
const toggleStatus = toggleDict(roleStatusKey, record.status);
// 调用修改接口
await updateRoleStatus({ id: record.id, status: toggleStatus.value });
await updateRoleStatus({
id: record.id,
status: toggleStatus.value as number
});
Message.success(`${toggleStatus.label}成功`);
// 修改行状态
record.status = toggleStatus.value;
@@ -177,7 +182,7 @@
await deleteRole(id);
Message.success('删除成功');
// 重新加载数据
await fetchTableData();
fetchTableData();
} catch (e) {
} finally {
setLoading(false);
@@ -217,7 +222,10 @@
const fetchTableData = (page = 1, limit = pagination.pageSize, form = formModel) => {
doFetchTableData({ page, limit, ...form });
};
fetchTableData();
onMounted(() => {
fetchTableData();
});
</script>

18
orion-ops-ui/src/views/user/role/index.vue
View File

@@ -1,5 +1,5 @@
<template>
<div class="layout-container">
<div class="layout-container" v-if="render">
<!-- 表格 -->
<role-table ref="table"
@openAdd="() => modal.openAdd()"
@@ -24,17 +24,25 @@
import RoleTable from './components/role-table.vue';
import RoleFormModal from './components/role-form-modal.vue';
import RoleMenuGrantModal from '@/views/user/role/components/role-menu-grant-modal.vue';
import { onUnmounted, ref } from 'vue';
import { useCacheStore } from '@/store';
import { ref, onBeforeMount, onUnmounted } from 'vue';
import { useCacheStore, useDictStore } from '@/store';
import { dictKeys } from './types/const';
const render = ref();
const table = ref();
const modal = ref();
const grantModal = ref();
// 卸载时清除 menu cache
onBeforeMount(async () => {
const dictStore = useDictStore();
await dictStore.loadKeys(dictKeys);
render.value = true;
});
// 卸载时清除 cache
onUnmounted(() => {
const cacheStore = useCacheStore();
cacheStore.set('menus', []);
cacheStore.reset('menus');
});
</script>

13
orion-ops-ui/src/views/user/role/types/const.ts Normal file
View File

@@ -0,0 +1,13 @@
// 角色状态
export const RoleStatus = {
// 停用
DISABLED: 0,
// 启用
ENABLED: 1,
};
// 角色状态 字典项
export const roleStatusKey = 'systemRoleStatus';
// 加载的字典值
export const dictKeys = [roleStatusKey];

18
orion-ops-ui/src/views/user/role/types/enum.types.ts
View File

@@ -1,18 +0,0 @@
/**
* 角色状态
*/
export const RoleStatusEnum = {
DISABLED: {
value: 0,
label: '停用',
color: 'orange',
status: 'danger',
},
ENABLED: {
value: 1,
label: '启用',
color: 'blue',
status: 'default',
},
};

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

@@ -24,7 +24,7 @@
<!-- 用户状态 -->
<a-form-item field="status" label="用户状态" label-col-flex="50px">
<a-select v-model="formModel.status"
:options="toOptions(UserStatusEnum)"
:options="toOptions(userStatusKey)"
placeholder="请选择用户状态"
allow-clear />
</a-form-item>
@@ -78,17 +78,17 @@
<!-- 状态 -->
<template #status="{ record }">
<span class="circle" :style="{
background: getEnumValue(record.status, UserStatusEnum, 'color')
background: getDictValue(userStatusKey, record.status, 'color')
}" />
{{ getEnumValue(record.status, UserStatusEnum) }}
{{ getDictValue(userStatusKey, record.status) }}
</template>
<!-- 操作 -->
<template #handle="{ record }">
<div class="table-handle-wrapper">
<!-- 启用/停用 -->
<a-popconfirm :content="`确定要${UserStatusEnum.ENABLED.value === record.status
? UserStatusEnum.DISABLED.label
: UserStatusEnum.ENABLED.label}当前用户?`"
<a-popconfirm :content="`确定要${UserStatus.ENABLED === record.status
? getDictValue(userStatusKey, UserStatus.DISABLED)
: getDictValue(userStatusKey, UserStatus.ENABLED)}当前用户?`"
position="left"
type="warning"
@ok="updateStatus(record)">
@@ -97,9 +97,9 @@
:disabled="record.id === userStore.id"
v-permission="['infra:system-user:update-status']">
{{
UserStatusEnum.ENABLED.value === record.status
? UserStatusEnum.DISABLED.label
: UserStatusEnum.ENABLED.label
UserStatus.ENABLED === record.status
? getDictValue(userStatusKey, UserStatus.DISABLED)
: getDictValue(userStatusKey, UserStatus.ENABLED)
}}
</a-button>
</a-popconfirm>
@@ -151,21 +151,22 @@
<script lang="ts" setup>
import type { UserQueryRequest, UserQueryResponse } from '@/api/user/user';
import { reactive, ref } from 'vue';
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 { UserStatusEnum } from '../types/enum.types';
import { userStatusKey, UserStatus } from '../types/const';
import { usePagination } from '@/types/table';
import { toOptions, getEnumValue } from '@/utils/enum';
import { useUserStore } from '@/store';
import { useDictStore, useUserStore } from '@/store';
const tableRenderData = ref<UserQueryResponse[]>([]);
const { loading, setLoading } = useLoading();
const emits = defineEmits(['openAdd', 'openUpdate', 'openResetPassword', 'openGrantRole']);
const tableRenderData = ref<UserQueryResponse[]>([]);
const pagination = usePagination();
const { loading, setLoading } = useLoading();
const { toOptions, getDictValue, getDict } = useDictStore();
const formModel = reactive<UserQueryRequest>({
id: undefined,
@@ -191,7 +192,7 @@
await deleteUser(id);
Message.success('删除成功');
// 重新加载数据
await fetchTableData();
fetchTableData();
} catch (e) {
} finally {
setLoading(false);
@@ -203,12 +204,12 @@
try {
setLoading(true);
// 更新状态
const newStatus = UserStatusEnum.ENABLED.value === record.status
? UserStatusEnum.DISABLED
: UserStatusEnum.ENABLED;
const newStatus = UserStatus.ENABLED === record.status
? getDict(userStatusKey, UserStatus.DISABLED)
: getDict(userStatusKey, UserStatus.ENABLED);
await updateUserStatus({
id: record.id,
status: newStatus.value
status: newStatus.value as number
});
Message.success(`${newStatus.label}成功`);
record.status = newStatus.value;
@@ -251,7 +252,10 @@
const fetchTableData = (page = 1, limit = pagination.pageSize, form = formModel) => {
doFetchTableData({ page, limit, ...form });
};
fetchTableData();
onMounted(() => {
fetchTableData();
});
</script>

18
orion-ops-ui/src/views/user/user/index.vue
View File

@@ -1,5 +1,5 @@
<template>
<div class="layout-container">
<div class="layout-container" v-if="render">
<!-- 表格 -->
<user-table ref="table"
@openAdd="() => modal.openAdd()"
@@ -28,18 +28,26 @@
import UserFormModal from './components/user-form-modal.vue';
import UserResetPasswordFormModal from './components/user-reset-password-form-modal.vue';
import UserGrantRolesFormModal from './components/user-grant-roles-form-modal.vue';
import { ref, onUnmounted } from 'vue';
import { useCacheStore } from '@/store';
import { ref, onBeforeMount, onUnmounted } from 'vue';
import { useCacheStore, useDictStore } from '@/store';
import { dictKeys } from './types/const';
const render = ref(false);
const table = ref();
const modal = ref();
const resetModal = ref();
const grantRoleModal = ref();
// 卸载时清除 role cache
onBeforeMount(async () => {
const dictStore = useDictStore();
await dictStore.loadKeys(dictKeys);
render.value = true;
});
// 卸载时清除 cache
onUnmounted(() => {
const cacheStore = useCacheStore();
cacheStore.set('roles', []);
cacheStore.reset('roles');
});
</script>

15
orion-ops-ui/src/views/user/user/types/const.ts Normal file
View File

@@ -0,0 +1,15 @@
// 用户状态
export const UserStatus = {
// 禁用
DISABLED: 0,
// 启用
ENABLED: 1,
// 锁定
LOCKED: 2,
};
// 菜单配置值类型 字典项
export const userStatusKey = 'systemUserStatus';
// 加载的字典值
export const dictKeys = [userStatusKey];

21
orion-ops-ui/src/views/user/user/types/enum.types.ts
View File

@@ -1,21 +0,0 @@
/**
*用户状态
*/
export const UserStatusEnum = {
DISABLED: {
value: 0,
label: '停用',
color: 'orange',
},
ENABLED: {
value: 1,
label: '启用',
color: 'blue',
},
LOCKED: {
value: 2,
label: '锁定',
color: 'orange',
},
};