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

17
orion-ops-launch/src/main/resources/templates/orion-vue-views-components-card-list.vue.vm
View File

@@ -108,7 +108,7 @@
<script lang="ts" setup>
import type { ${vue.featureEntity}QueryRequest, ${vue.featureEntity}QueryResponse } from '@/api/${vue.module}/${vue.feature}';
import { usePagination, useColLayout } from '@/types/card';
import { computed, reactive, ref } from 'vue';
import { computed, reactive, ref, onMounted } from 'vue';
import useLoading from '@/hooks/loading';
import { objectTruthKeyCount, resetObject } from '@/utils';
import fieldConfig from '../types/card.fields';
@@ -122,11 +122,13 @@
#end
import { toOptions, getEnumValue } from '@/utils/enum';
const { loading, setLoading } = useLoading();
const emits = defineEmits(['openAdd', 'openUpdate']);
const list = ref<${vue.featureEntity}QueryResponse[]>([]);
const cardColLayout = useColLayout();
const pagination = usePagination();
const list = ref<${vue.featureEntity}QueryResponse[]>([]);
const emits = defineEmits(['openAdd', 'openUpdate']);
const { loading, setLoading } = useLoading();
const formRef = ref();
const formModel = reactive<${vue.featureEntity}QueryRequest>({
@@ -155,7 +157,7 @@
await delete${vue.featureEntity}(id);
Message.success('删除成功');
// 重新加载数据
await fetchCardData();
fetchCardData();
} catch (e) {
} finally {
setLoading(false);
@@ -203,7 +205,10 @@
const fetchCardData = (page = 1, limit = pagination.pageSize, form = formModel) => {
doFetchCardData({ page, limit, ...form });
};
fetchCardData();
onMounted(() => {
fetchCardData();
});
</script>

20
orion-ops-launch/src/main/resources/templates/orion-vue-views-components-table.vue.vm
View File

@@ -136,7 +136,7 @@
<script lang="ts" setup>
import type { ${vue.featureEntity}QueryRequest, ${vue.featureEntity}QueryResponse } from '@/api/${vue.module}/${vue.feature}';
import { reactive, ref } from 'vue';
import { reactive, ref, onMounted } from 'vue';
import { batchDelete${vue.featureEntity}, delete${vue.featureEntity}, get${vue.featureEntity}Page } from '@/api/${vue.module}/${vue.feature}';
import { Message } from '@arco-design/web-vue';
import useLoading from '@/hooks/loading';
@@ -154,15 +154,18 @@
#end
import { toOptions, getEnumValue } from '@/utils/enum';
const tableRenderData = ref<${vue.featureEntity}QueryResponse[]>([]);
const { loading, setLoading } = useLoading();
const emits = defineEmits(['openAdd', 'openUpdate']);
#if($vue.enableRowSelection)
const selectedKeys = ref<number[]>([]);
#end
const tableRenderData = ref<${vue.featureEntity}QueryResponse[]>([]);
const pagination = usePagination();
#if($vue.enableRowSelection)
const selectedKeys = ref<number[]>([]);
const rowSelection = useRowSelection();
#end
const { loading, setLoading } = useLoading();
const formModel = reactive<${vue.featureEntity}QueryRequest>({
#foreach($field in ${table.fields})
@@ -180,7 +183,7 @@
Message.success(`成功删除${selectedKeys.value.length}条数据`);
selectedKeys.value = [];
// 重新加载数据
await fetchTableData();
fetchTableData();
} catch (e) {
} finally {
setLoading(false);
@@ -198,7 +201,7 @@
await delete${vue.featureEntity}(id);
Message.success('删除成功');
// 重新加载数据
await fetchTableData();
fetchTableData();
} catch (e) {
} finally {
setLoading(false);
@@ -241,7 +244,10 @@
const fetchTableData = (page = 1, limit = pagination.pageSize, form = formModel) => {
doFetchTableData({ page, limit, ...form });
};
fetchTableData();
onMounted(() => {
fetchTableData();
});
</script>

9
orion-ops-launch/src/main/resources/templates/orion-vue-views-index.vue.vm
View File

@@ -1,5 +1,5 @@
<template>
<div class="layout-container">
<div class="layout-container" v-if="render">
#if($vue.enableCardView)
<!-- 列表-表格 -->
<${vue.feature}-table v-if="renderTable"
@@ -49,12 +49,13 @@
#end
#if($vue.enableCardView)
import { computed, ref } from 'vue';
import { computed, ref, onBeforeMount } from 'vue';
import { useAppStore } from '@/store';
#else
import { ref } from 'vue';
#end
const render = ref(false);
const table = ref();
#if($vue.enableCardView)
const card = ref();
@@ -97,6 +98,10 @@
#end
};
onBeforeMount(async () => {
render.value = true;
});
</script>
<style lang="less" scoped>

4
orion-ops-ui/src/api/system/dict-value.ts
View File

@@ -66,10 +66,6 @@ export interface DictValueQueryResponse extends TableData {
* 字典配置值选项查询响应
*/
export interface DictValueOptionsQueryResponse extends Options {
label: string;
value: string | number | boolean;
[key: string]: unknown;
}
/**

17
orion-ops-ui/src/components/meta/tag/tag-multi-selector.vue
View File

@@ -4,7 +4,7 @@
:options="optionData"
:limit="limit as number"
:allow-create="allowCreate"
@exceed-limit="onLimited"
@exceed-limit="() => { emits('onLimited', limit, `最多选择${limit}个tag`) }"
multiple
allow-clear>
</a-select>
@@ -20,7 +20,7 @@
import type { PropType } from 'vue';
import type { SelectOptionData } from '@arco-design/web-vue';
import type { TagCreateRequest } from '@/api/meta/tag';
import { ref, computed } from 'vue';
import { ref, computed, onMounted } from 'vue';
import { useCacheStore } from '@/store';
import { Message } from '@arco-design/web-vue';
import { createTag } from '@/api/meta/tag';
@@ -34,7 +34,7 @@
tagType: String,
});
const emits = defineEmits(['update:modelValue']);
const emits = defineEmits(['update:modelValue', 'onLimited']);
const value = computed<Array<number>>({
get() {
@@ -58,10 +58,14 @@
};
}) as SelectOptionData[];
};
initOptionData();
defineExpose({ initOptionData });
onMounted(() => {
initOptionData();
});
// 检查是否可以创建tag
const checkCreateTag = async (tags: Array<any>) => {
if (!tags.length) {
@@ -107,11 +111,6 @@
return id;
};
// 超出限制
const onLimited = () => {
Message.warning(`最多选择${props.limit}个tag`);
};
</script>
<style lang="less" scoped>

4
orion-ops-ui/src/components/user/role/user-role-selector.vue
View File

@@ -20,7 +20,7 @@
import type { SelectOptionData } from '@arco-design/web-vue';
import { computed } from 'vue';
import { useCacheStore } from '@/store';
import { RoleStatusEnum } from '@/views/user/role/types/enum.types';
import { RoleStatus } from '@/views/user/role/types/const';
const props = defineProps({
modelValue: [Number, Array] as PropType<number | Array<number>>,
@@ -45,7 +45,7 @@
return cacheStore.roles.map(s => {
return {
label: `${s.name} (${s.code})`,
disabled: s.status === RoleStatusEnum.DISABLED.value,
disabled: s.status === RoleStatus.DISABLED,
value: s.id,
};
});

7
orion-ops-ui/src/store/modules/cache/index.ts vendored
View File

@@ -19,6 +19,13 @@ export default defineStore('cache', {
// 设置
set(name: CacheType, value: any) {
this[name] = value;
},
// 清空
reset(...names: CacheType[]) {
for (let name of names) {
this[name] = [];
}
}
},
});

25
orion-ops-ui/src/store/modules/dict/index.ts
View File

@@ -1,4 +1,5 @@
import type { DictState } from './types';
import type { Options } from '@/types/global';
import { defineStore } from 'pinia';
import { getDictValueList } from '@/api/system/dict-value';
@@ -8,7 +9,6 @@ export default defineStore('dict', {
actions: {
// 加载字典值
async loadKeys(keys: string[]) {
console.log('loadKeys', keys);
// 检查是否存在
const unloadKeys = keys.filter(key => !this.$state.hasOwnProperty(key));
if (!unloadKeys.length) {
@@ -20,7 +20,6 @@ export default defineStore('dict', {
this.$patch(data as object);
} catch (e) {
} finally {
console.log('final');
}
},
@@ -29,22 +28,32 @@ export default defineStore('dict', {
return this.$state[key];
},
// 获取选择值
// 获取字典值
getDictValue(dict: string,
value: any,
key = 'label',
defaultValue = value) {
for (let dictValue of this.$state[dict] || []) {
if (dictValue.value === value) {
console.log(dictValue[key]);
return dictValue[key];
}
}
console.log('default', dict);
return defaultValue;
},
// 切换字典值对象
// 获取字典值对象
getDict(dict: string, value: any): Options {
for (let dictValue of this.$state[dict] || []) {
if (dictValue.value === value) {
return dictValue;
}
}
return {
value
} as Options;
},
// 切换字典值
toggleDictValue(dict: string,
value: any,
key = 'value',
@@ -58,13 +67,13 @@ export default defineStore('dict', {
},
// 切换字典值对象
toggleDict(dict: string, value: any) {
toggleDict(dict: string, value: any): Options {
for (let dictValue of this.$state[dict] || []) {
if (dictValue.value !== value) {
return dictValue;
}
}
return {};
return {} as Options;
}
},

4
orion-ops-ui/src/store/modules/dict/types.ts
View File

@@ -1,5 +1,5 @@
import { DictValueOptionsQueryResponse } from '@/api/system/dict-value';
import type { Options } from '@/types/global';
export interface DictState {
[key: string]: Array<DictValueOptionsQueryResponse>;
[key: string]: Array<Options>;
}

4
orion-ops-ui/src/types/global.ts
View File

@@ -3,8 +3,10 @@ export interface AnyObject {
}
export interface Options {
value: unknown;
label: string;
value: string | number | boolean;
[key: string]: unknown;
}
export interface NodeOptions extends Options {

64
orion-ops-ui/src/utils/enum.ts
View File

@@ -1,64 +0,0 @@
/**
* 转为 select options
*/
export const toOptions = (enums: any) => {
const arr = [];
for (let k in enums) {
arr.push(enums[k]);
}
return arr;
};
/**
* 切换枚举值
*/
export const toggleEnumValue = (value: any,
enums: any,
key = 'value',
defaultValue = value) => {
for (let k in enums) {
if (enums[k].value !== value) {
return enums[k][key];
}
}
return defaultValue;
};
/**
* 切换枚举对象
*/
export const toggleEnum = (value: any, enums: any) => {
for (let k in enums) {
if (enums[k].value !== value) {
return enums[k];
}
}
return {};
};
/**
* 获取枚举值
*/
export const getEnumValue = (value: any,
enums: any,
key = 'label',
defaultValue = value) => {
for (let k in enums) {
if (enums[k].value === value) {
return enums[k][key];
}
}
return defaultValue;
};
/**
* 获取枚举对象
*/
export const getEnum = (value: any, enums: any) => {
for (let k in enums) {
if (enums[k].value === value) {
return enums[k];
}
}
return {};
};

20
orion-ops-ui/src/views/asset/host-identity/components/host-identity-card-list.vue
View File

@@ -127,7 +127,7 @@
<script lang="ts" setup>
import type { HostIdentityQueryRequest, HostIdentityQueryResponse } from '@/api/asset/host-identity';
import { usePagination, useColLayout } from '@/types/card';
import { computed, reactive, ref } from 'vue';
import { computed, reactive, ref, onMounted } from 'vue';
import useLoading from '@/hooks/loading';
import { objectTruthKeyCount, resetObject } from '@/utils';
import fieldConfig from '../types/card.fields';
@@ -137,14 +137,15 @@
import useCopy from '@/hooks/copy';
import HostKeySelector from '@/components/asset/host-key/host-key-selector.vue';
const { copy } = useCopy();
const { hasAnyPermission } = usePermission();
const { loading, setLoading } = useLoading();
const emits = defineEmits(['openAdd', 'openUpdate', 'openKeyView']);
const list = ref<HostIdentityQueryResponse[]>([]);
const { copy } = useCopy();
const cardColLayout = useColLayout();
const pagination = usePagination();
const list = ref<HostIdentityQueryResponse[]>([]);
const emits = defineEmits(['openAdd', 'openUpdate', 'openKeyView']);
const { loading, setLoading } = useLoading();
const { hasAnyPermission } = usePermission();
const formRef = ref();
const formModel = reactive<HostIdentityQueryRequest>({
@@ -174,7 +175,7 @@
await deleteHostIdentity(id);
Message.success('删除成功');
// 重新加载数据
await fetchCardData();
fetchCardData();
} catch (e) {
} finally {
setLoading(false);
@@ -222,7 +223,10 @@
const fetchCardData = (page = 1, limit = pagination.pageSize, form = formModel) => {
doFetchCardData({ page, limit, ...form });
};
fetchCardData();
onMounted(() => {
fetchCardData();
});
</script>

7
orion-ops-ui/src/views/asset/host-identity/components/host-identity-form-modal.vue
View File

@@ -141,7 +141,12 @@
}
if (isAddHandle.value) {
if (!formModel.value.password && !formModel.value.keyId) {
Message.error('创建时密码和秘钥不能同时为空');
formRef.value.setFields({
password: {
status: 'error',
message: '创建时密码和秘钥不能同时为空'
}
});
return false;
}
// 新增

19
orion-ops-ui/src/views/asset/host-identity/components/host-identity-table.vue
View File

@@ -126,7 +126,7 @@
<script lang="ts" setup>
import type { HostIdentityQueryRequest, HostIdentityQueryResponse } from '@/api/asset/host-identity';
import { reactive, ref } from 'vue';
import { reactive, ref, onMounted } from 'vue';
import { deleteHostIdentity, getHostIdentityPage } from '@/api/asset/host-identity';
import { Message } from '@arco-design/web-vue';
import useLoading from '@/hooks/loading';
@@ -136,14 +136,14 @@
import useCopy from '@/hooks/copy';
import usePermission from '@/hooks/permission';
const { copy } = useCopy();
const { hasAnyPermission } = usePermission();
const tableRenderData = ref<HostIdentityQueryResponse[]>([]);
const { loading, setLoading } = useLoading();
const emits = defineEmits(['openAdd', 'openUpdate', 'openKeyView']);
const tableRenderData = ref<HostIdentityQueryResponse[]>([]);
const { copy } = useCopy();
const pagination = usePagination();
const { loading, setLoading } = useLoading();
const { hasAnyPermission } = usePermission();
const formModel = reactive<HostIdentityQueryRequest>({
id: undefined,
@@ -162,7 +162,7 @@
await deleteHostIdentity(id);
Message.success('删除成功');
// 重新加载数据
await fetchTableData();
fetchTableData();
} catch (e) {
} finally {
setLoading(false);
@@ -202,7 +202,10 @@
const fetchTableData = (page = 1, limit = pagination.pageSize, form = formModel) => {
doFetchTableData({ page, limit, ...form });
};
fetchTableData();
onMounted(() => {
fetchTableData();
});
</script>

20
orion-ops-ui/src/views/asset/host-identity/index.vue
View File

@@ -1,5 +1,5 @@
<template>
<div class="layout-container">
<div class="layout-container" v-if="render">
<!-- 列表-表格 -->
<host-identity-table v-if="renderTable"
ref="table"
@@ -15,7 +15,7 @@
<!-- 添加修改模态框 -->
<host-identity-form-modal ref="modal"
@added="modalAddCallback"
@updated="modalAddCallback" />
@updated="modalUpdateCallback" />
<!-- 添加修改模态框 -->
<host-key-form-drawer ref="keyDrawer" />
</div>
@@ -34,9 +34,11 @@
import HostKeyFormDrawer from '../host-key/components/host-key-form-drawer.vue';
import { getHostKeyList } from '@/api/asset/host-key';
import { onUnmounted, ref, computed } from 'vue';
import { ref, computed, onBeforeMount, onUnmounted } from 'vue';
import { useAppStore, useCacheStore } from '@/store';
import { Message } from '@arco-design/web-vue';
const render = ref(false);
const table = ref();
const card = ref();
const modal = ref();
@@ -70,14 +72,20 @@
const { data } = await getHostKeyList();
cacheStore.set('hostKeys', data);
} catch (e) {
Message.error('主机秘钥加载失败');
}
};
fetchHostKeyList();
// 卸载时清除 tags cache
onBeforeMount(async () => {
// 加载主机秘钥
await fetchHostKeyList();
render.value = true;
});
// 卸载时清除 cache
onUnmounted(() => {
const cacheStore = useCacheStore();
cacheStore.set('hostKeys', []);
cacheStore.reset('hostKeys');
});
</script>

0
orion-ops-ui/src/views/asset/host-identity/types/enum.types.ts
View File

17
orion-ops-ui/src/views/asset/host-key/components/host-key-card-list.vue
View File

@@ -81,18 +81,20 @@
<script lang="ts" setup>
import type { HostKeyQueryRequest, HostKeyQueryResponse } from '@/api/asset/host-key';
import { usePagination, useColLayout } from '@/types/card';
import { reactive, ref } from 'vue';
import { reactive, ref, onMounted } from 'vue';
import useLoading from '@/hooks/loading';
import { resetObject } from '@/utils';
import fieldConfig from '../types/card.fields';
import { deleteHostKey, getHostKeyPage } from '@/api/asset/host-key';
import { Message, Modal } from '@arco-design/web-vue';
const { loading, setLoading } = useLoading();
const emits = defineEmits(['openAdd', 'openUpdate', 'openView']);
const list = ref<HostKeyQueryResponse[]>([]);
const cardColLayout = useColLayout();
const pagination = usePagination();
const list = ref<HostKeyQueryResponse[]>([]);
const emits = defineEmits(['openAdd', 'openUpdate', 'openView']);
const { loading, setLoading } = useLoading();
const formModel = reactive<HostKeyQueryRequest>({
searchValue: undefined,
@@ -112,7 +114,7 @@
await deleteHostKey(id);
Message.success('删除成功');
// 重新加载数据
await fetchCardData();
fetchCardData();
} catch (e) {
} finally {
setLoading(false);
@@ -160,7 +162,10 @@
const fetchCardData = (page = 1, limit = pagination.pageSize, form = formModel) => {
doFetchCardData({ page, limit, ...form });
};
fetchCardData();
onMounted(() => {
fetchCardData();
});
</script>

14
orion-ops-ui/src/views/asset/host-key/components/host-key-table.vue
View File

@@ -99,18 +99,19 @@
<script lang="ts" setup>
import type { HostKeyQueryRequest, HostKeyQueryResponse } from '@/api/asset/host-key';
import { reactive, ref } from 'vue';
import { reactive, ref, onMounted } from 'vue';
import { deleteHostKey, getHostKeyPage } from '@/api/asset/host-key';
import { Message } from '@arco-design/web-vue';
import useLoading from '@/hooks/loading';
import columns from '../types/table.columns';
import { usePagination } from '@/types/table';
const tableRenderData = ref<HostKeyQueryResponse[]>([]);
const { loading, setLoading } = useLoading();
const emits = defineEmits(['openAdd', 'openUpdate', 'openView']);
const tableRenderData = ref<HostKeyQueryResponse[]>([]);
const pagination = usePagination();
const { loading, setLoading } = useLoading();
const formModel = reactive<HostKeyQueryRequest>({
id: undefined,
@@ -129,7 +130,7 @@
await deleteHostKey(id);
Message.success('删除成功');
// 重新加载数据
await fetchTableData();
fetchTableData();
} catch (e) {
} finally {
setLoading(false);
@@ -169,7 +170,10 @@
const fetchTableData = (page = 1, limit = pagination.pageSize, form = formModel) => {
doFetchTableData({ page, limit, ...form });
};
fetchTableData();
onMounted(() => {
fetchTableData();
});
</script>

9
orion-ops-ui/src/views/asset/host-key/index.vue
View File

@@ -1,5 +1,5 @@
<template>
<div class="layout-container">
<div class="layout-container" v-if="render">
<!-- 列表-表格 -->
<host-key-table v-if="renderTable"
ref="table"
@@ -30,9 +30,10 @@
import HostKeyTable from './components/host-key-table.vue';
import HostKeyFormDrawer from './components/host-key-form-drawer.vue';
import { computed, ref } from 'vue';
import { computed, ref, onBeforeMount } from 'vue';
import { useAppStore } from '@/store';
const render = ref(false);
const table = ref();
const card = ref();
const drawer = ref();
@@ -58,6 +59,10 @@
}
};
onBeforeMount(async () => {
render.value = true;
});
</script>
<style lang="less" scoped>

0
orion-ops-ui/src/views/asset/host-key/types/enum.types.ts
View File

19
orion-ops-ui/src/views/asset/host/components/host-card-list.vue
View File

@@ -144,7 +144,7 @@
<script lang="ts" setup>
import type { HostQueryRequest, HostQueryResponse } from '@/api/asset/host';
import { usePagination, useColLayout } from '@/types/card';
import { computed, reactive, ref } from 'vue';
import { computed, reactive, ref, onMounted } from 'vue';
import useLoading from '@/hooks/loading';
import { dataColor, objectTruthKeyCount, resetObject } from '@/utils';
import fieldConfig from '../types/host.card.fields';
@@ -154,12 +154,14 @@
import TagMultiSelector from '@/components/meta/tag/tag-multi-selector.vue';
import useCopy from '@/hooks/copy';
const { copy } = useCopy();
const { loading, setLoading } = useLoading();
const emits = defineEmits(['openAdd', 'openUpdate', 'openUpdateConfig']);
const list = ref<HostQueryResponse[]>([]);
const cardColLayout = useColLayout();
const pagination = usePagination();
const list = ref<HostQueryResponse[]>([]);
const emits = defineEmits(['openAdd', 'openUpdate', 'openUpdateConfig']);
const { copy } = useCopy();
const { loading, setLoading } = useLoading();
const formRef = ref();
const formModel = reactive<HostQueryRequest>({
@@ -192,7 +194,7 @@
await deleteHost(id);
Message.success('删除成功');
// 重新加载数据
await fetchCardData();
fetchCardData();
} catch (e) {
} finally {
setLoading(false);
@@ -240,7 +242,10 @@
const fetchCardData = (page = 1, limit = pagination.pageSize, form = formModel) => {
doFetchCardData({ page, limit, ...form });
};
fetchCardData();
onMounted(() => {
fetchCardData();
});
</script>

11
orion-ops-ui/src/views/asset/host/components/host-config-drawer.vue
View File

@@ -29,7 +29,7 @@
</script>
<script lang="ts" setup>
import { ref } from 'vue';
import { ref, onBeforeMount } from 'vue';
import useVisible from '@/hooks/visible';
import useLoading from '@/hooks/loading';
import { Message } from '@arco-design/web-vue';
@@ -84,7 +84,6 @@
} catch (e) {
}
};
fetchHostKeys();
// 加载主机身份
const fetchHostIdentities = async () => {
@@ -94,7 +93,13 @@
} catch (e) {
}
};
fetchHostIdentities();
onBeforeMount(async () => {
// 加载主机秘钥
await fetchHostKeys();
// 加载主机身份
await fetchHostIdentities();
});
</script>

25
orion-ops-ui/src/views/asset/host/components/host-config-ssh-form.vue
View File

@@ -26,9 +26,9 @@
label="用户名"
:rules="usernameRules"
label-col-flex="60px"
:help="AuthTypeEnum.IDENTITY.value === formModel.authType ? '将使用主机身份的用户名' : undefined">
:help="AuthType.IDENTITY === formModel.authType ? '将使用主机身份的用户名' : undefined">
<a-input v-model="formModel.username"
:disabled="AuthTypeEnum.IDENTITY.value === formModel.authType"
:disabled="AuthType.IDENTITY === formModel.authType"
placeholder="请输入用户名" />
</a-form-item>
<!-- SSH 端口 -->
@@ -48,10 +48,10 @@
<a-radio-group type="button"
class="auth-type-group"
v-model="formModel.authType"
:options="toOptions(AuthTypeEnum)" />
:options="toOptions(authTypeKey)" />
</a-form-item>
<!-- 主机密码 -->
<a-form-item v-if="AuthTypeEnum.PASSWORD.value === formModel.authType"
<a-form-item v-if="AuthType.PASSWORD === formModel.authType"
field="password"
label="主机密码"
:rules="passwordRules"
@@ -68,7 +68,7 @@
unchecked-text="使用原密码" />
</a-form-item>
<!-- 主机秘钥 -->
<a-form-item v-if="AuthTypeEnum.KEY.value === formModel.authType"
<a-form-item v-if="AuthType.KEY === formModel.authType"
field="keyId"
label="主机秘钥"
:hide-asterisk="true"
@@ -76,7 +76,7 @@
<host-key-selector v-model="formModel.keyId" />
</a-form-item>
<!-- 主机身份 -->
<a-form-item v-if="AuthTypeEnum.IDENTITY.value === formModel.authType"
<a-form-item v-if="AuthType.IDENTITY === formModel.authType"
field="identityId"
label="主机身份"
:hide-asterisk="true"
@@ -139,18 +139,19 @@
<script lang="ts" setup>
import type { FieldRule } from '@arco-design/web-vue';
import type { HostSshConfig } from '@/views/asset/host/types/host-config.types';
import type { HostSshConfig } from '../types/host-config.types';
import { ref, watch } from 'vue';
import { updateHostConfigStatus, updateHostConfig } from '@/api/asset/host';
import { AuthTypeEnum } from '@/views/asset/host/types/host-config.types';
import { sshRules } from '@/views/asset/host/types/host-config.form.rules';
import { authTypeKey, AuthType } from '../types/const';
import { sshRules } from '../types/host-config.form.rules';
import HostKeySelector from '@/components/asset/host-key/host-key-selector.vue';
import HostIdentitySelector from '@/components/asset/host-identity/host-identity-selector.vue';
import { toOptions } from '@/utils/enum';
import { Message } from '@arco-design/web-vue';
import useLoading from '@/hooks/loading';
import { useDictStore } from '@/store';
const { loading, setLoading } = useLoading();
const { toOptions } = useDictStore();
const props = defineProps({
content: Object
@@ -168,7 +169,7 @@
username: undefined,
port: undefined,
password: undefined,
authType: AuthTypeEnum.PASSWORD.value,
authType: AuthType.PASSWORD,
keyId: undefined,
identityId: undefined,
connectTimeout: undefined,
@@ -193,7 +194,7 @@
cb('用户名长度不能大于128位');
return;
}
if (formModel.value.authType !== AuthTypeEnum.IDENTITY.value && !value) {
if (formModel.value.authType !== AuthType.IDENTITY && !value) {
cb('请输入用户名');
return;
}

13
orion-ops-ui/src/views/asset/host/components/host-form-modal.vue
View File

@@ -39,7 +39,8 @@
:limit="5"
type="HOST"
tag-type="hostTags"
placeholder="请选择主机标签" />
placeholder="请选择主机标签"
@onLimited="onLimitedTag" />
</a-form-item>
</a-form>
</a-spin>
@@ -107,6 +108,16 @@
defineExpose({ openAdd, openUpdate });
// tag 超出所选限制
const onLimitedTag = (count: number, message: string) => {
formRef.value.setFields({
tags: {
status: 'error',
message
}
});
};
// 确定
const handlerOk = async () => {
setLoading(true);

9
orion-ops-ui/src/views/asset/host/components/host-table.vue
View File

@@ -163,7 +163,7 @@
<script lang="ts" setup>
import type { HostQueryRequest, HostQueryResponse } from '@/api/asset/host';
import { reactive, ref } from 'vue';
import { reactive, ref, onMounted } from 'vue';
import { deleteHost, getHostPage } from '@/api/asset/host';
import { Message } from '@arco-design/web-vue';
import useLoading from '@/hooks/loading';
@@ -205,7 +205,7 @@
await deleteHost(id);
Message.success('删除成功');
// 重新加载数据
await fetchTableData();
fetchTableData();
} catch (e) {
} finally {
setLoading(false);
@@ -245,7 +245,10 @@
const fetchTableData = (page = 1, limit = pagination.pageSize, form = formModel) => {
doFetchTableData({ page, limit, ...form });
};
fetchTableData();
onMounted(() => {
fetchTableData();
});
</script>

24
orion-ops-ui/src/views/asset/host/index.vue
View File

@@ -1,5 +1,5 @@
<template>
<div class="layout-container">
<div class="layout-container" v-if="render">
<!-- 列表-表格 -->
<host-table v-if="renderTable"
ref="table"
@@ -33,11 +33,13 @@
import HostFormModal from './components/host-form-modal.vue';
import HostConfigDrawer from '@/views/asset/host/components/host-config-drawer.vue';
import { getTagList } from '@/api/meta/tag';
import { dictKeys } from './types/const';
import { Message } from '@arco-design/web-vue';
import { computed, onUnmounted, ref } from 'vue';
import { useAppStore, useCacheStore } from '@/store';
import { computed, ref, onBeforeMount, onUnmounted } from 'vue';
import { useAppStore, useCacheStore, useDictStore } from '@/store';
const render = ref(false);
const table = ref();
const card = ref();
const modal = ref();
@@ -75,13 +77,19 @@
Message.error('tag加载失败');
}
};
loadTags();
// 卸载时清除 tags cache
onBeforeMount(async () => {
// 加载 tags
await loadTags();
// 加载字典值
const dictStore = useDictStore();
await dictStore.loadKeys(dictKeys);
render.value = true;
});
// 卸载时清除 cache
onUnmounted(() => {
cacheStore.set('hostTags', []);
cacheStore.set('hostKeys', []);
cacheStore.set('hostIdentities', []);
cacheStore.reset('hostTags', 'hostKeys', 'hostIdentities');
});
</script>

20
orion-ops-ui/src/views/asset/host/types/const.ts
View File

@@ -1,6 +1,4 @@
/**
* tag 颜色
*/
// tag 颜色
export const tagColor = [
'arcoblue',
'green',
@@ -8,3 +6,19 @@ export const tagColor = [
'pinkpurple',
'magenta'
];
// 主机验证方式
export const AuthType = {
// 密码验证
PASSWORD: 'PASSWORD',
// 秘钥验证
KEY: 'KEY',
// 身份验证
IDENTITY: 'IDENTITY'
};
// 主机验证方式 字典项
export const authTypeKey = 'hostAuthTypeType';
// 加载的字典值
export const dictKeys = [authTypeKey];

0
orion-ops-ui/src/views/asset/host/types/enum.types.ts
View File

18
orion-ops-ui/src/views/asset/host/types/host-config.types.ts
View File

@@ -1,21 +1,3 @@
/**
* 验证方式
*/
export const AuthTypeEnum = {
PASSWORD: {
value: 'PASSWORD',
label: '密码验证',
},
KEY: {
value: 'KEY',
label: '秘钥验证',
},
IDENTITY: {
value: 'IDENTITY',
label: '身份验证',
},
};
/**
* 主机所有配置
*/

14
orion-ops-ui/src/views/system/dict-key/components/dict-key-form-modal.vue
View File

@@ -27,7 +27,7 @@
<!-- 配置值类型 -->
<a-form-item field="valueType" label="配置值类型">
<a-select v-model="formModel.valueType"
:options="toOptions(ValueTypeEnum)"
:options="toOptions(dictValueTypeKey)"
placeholder="请选择配置值类型" />
</a-form-item>
<!-- 配置描述 -->
@@ -43,7 +43,7 @@
<a-input-group>
<!-- 参数类型 -->
<a-select v-model="schema.type"
:options="toOptions(ValueTypeEnum)"
:options="toOptions(dictValueTypeKey)"
placeholder="类型"
:style="{ width: '110px' }" />
<!-- 参数值 -->
@@ -100,12 +100,12 @@
import formRules from '../types/form.rules';
import { Message } from '@arco-design/web-vue';
import { createDictKey, updateDictKey } from '@/api/system/dict-key';
import { definedExtraKeys, innerKeys } from '../types/const';
import { ValueTypeEnum } from '../types/enum.types';
import { toOptions } from '@/utils/enum';
import { definedExtraKeys, innerKeys, dictValueTypeKey, ValueType } from '../types/const';
import { useDictStore } from '@/store';
const { visible, setVisible } = useVisible();
const { loading, setLoading } = useLoading();
const { toOptions } = useDictStore();
const title = ref<string>();
const isAddHandle = ref<boolean>(true);
@@ -114,7 +114,7 @@
return {
id: undefined,
keyName: undefined,
valueType: ValueTypeEnum.INTEGER.value,
valueType: ValueType.INTEGER,
extraSchema: undefined,
description: undefined,
};
@@ -161,7 +161,7 @@
}
extraSchemaArr.value.push({
name: name,
type: type || ValueTypeEnum.STRING.value
type: type || ValueType.STRING
});
};

25
orion-ops-ui/src/views/system/dict-key/components/dict-key-table.vue
View File

@@ -62,8 +62,8 @@
</template>
<!-- 配置值类型 -->
<template #valueType="{ record }">
<a-tag :color="getEnumValue(record.valueType, ValueTypeEnum, 'color')">
{{ getEnumValue(record.valueType, ValueTypeEnum) }}
<a-tag :color="getDictValue(dictValueTypeKey, record.valueType, 'color')">
{{ getDictValue(dictValueTypeKey, record.valueType) }}
</a-tag>
</template>
<!-- 额外参数 -->
@@ -71,7 +71,7 @@
<template v-if="record.extraSchema">
<a-space>
<template v-for="item in JSON.parse(record.extraSchema)" :key="item.name">
<a-tag :color="getEnumValue(item.type, ValueTypeEnum, 'color')">
<a-tag :color="getDictValue(dictValueTypeKey, item.type, 'color')">
{{ item.name }}
</a-tag>
</template>
@@ -123,23 +123,23 @@
<script lang="ts" setup>
import type { DictKeyQueryRequest, DictKeyQueryResponse } from '@/api/system/dict-key';
import { reactive, ref } from 'vue';
import { reactive, ref, onMounted } from 'vue';
import { batchDeleteDictKey, deleteDictKey, getDictKeyPage } from '@/api/system/dict-key';
import { Message } from '@arco-design/web-vue';
import useLoading from '@/hooks/loading';
import columns from '../types/table.columns';
import { usePagination } from '@/types/table';
import {} from '../types/const';
import { ValueTypeEnum } from '../types/enum.types';
import { getEnumValue } from '@/utils/enum';
import { dictValueTypeKey } from '../types/const';
import useCopy from '@/hooks/copy';
import { useDictStore } from '@/store';
const tableRenderData = ref<DictKeyQueryResponse[]>([]);
const { loading, setLoading } = useLoading();
const emits = defineEmits(['openAdd', 'openUpdate', 'openView']);
const { copy } = useCopy();
const pagination = usePagination();
const { copy } = useCopy();
const { loading, setLoading } = useLoading();
const { toOptions, getDictValue } = useDictStore();
const formModel = reactive<DictKeyQueryRequest>({
id: undefined,
@@ -157,7 +157,7 @@
await deleteDictKey(id);
Message.success('删除成功');
// 重新加载数据
await fetchTableData();
fetchTableData();
} catch (e) {
} finally {
setLoading(false);
@@ -197,7 +197,10 @@
const fetchTableData = (page = 1, limit = pagination.pageSize, form = formModel) => {
doFetchTableData({ page, limit, ...form });
};
fetchTableData();
onMounted(() => {
fetchTableData();
});
</script>

13
orion-ops-ui/src/views/system/dict-key/index.vue
View File

@@ -1,5 +1,5 @@
<template>
<div class="layout-container">
<div class="layout-container" v-if="render">
<!-- 列表-表格 -->
<dict-key-table ref="table"
@openAdd="() => modal.openAdd()"
@@ -21,19 +21,18 @@
</script>
<script lang="ts" setup>
import { ref } from 'vue';
import { ref, onBeforeMount } from 'vue';
import DictKeyTable from './components/dict-key-table.vue';
import DictKeyFormModal from './components/dict-key-form-modal.vue';
import DictKeyViewModal from './components/dict-key-view-modal.vue';
import { useDictStore } from '@/store';
import { dictKeys } from './types/const';
const render = ref(false);
const table = ref();
const modal = ref();
const view = ref();
useDictStore().loadKeys(dictKeys);
// 添加回调
const modalAddCallback = () => {
table.value.addedCallback();
@@ -44,6 +43,12 @@
table.value.updatedCallback();
};
onBeforeMount(async () => {
const dictStore = useDictStore();
await dictStore.loadKeys(dictKeys);
render.value = true;
});
</script>
<style lang="less" scoped>

5
orion-ops-ui/src/views/system/dict-key/types/const.ts
View File

@@ -1,9 +1,14 @@
// 配置值类型定义
export const ValueType = {
// 字符串
STRING: 'STRING',
// 整数
INTEGER: 'INTEGER',
// 小数
DECIMAL: 'DECIMAL',
// 布尔值
BOOLEAN: 'BOOLEAN',
// 颜色
COLOR: 'COLOR',
};

31
orion-ops-ui/src/views/system/dict-key/types/enum.types.ts
View File

@@ -1,31 +0,0 @@
/**
* 配置值定义
*/
export const ValueTypeEnum = {
STRING: {
label: '字符串',
value: 'STRING',
color: 'blue',
},
INTEGER: {
label: '整数',
value: 'INTEGER',
color: 'arcoblue',
},
DECIMAL: {
label: '小数',
value: 'DECIMAL',
color: 'purple',
},
BOOLEAN: {
label: '布尔值',
value: 'BOOLEAN',
color: 'pinkpurple',
},
COLOR: {
label: '颜色',
value: 'COLOR',
color: 'magenta',
},
};

16
orion-ops-ui/src/views/system/dict-value/components/dict-value-form-modal.vue
View File

@@ -44,24 +44,25 @@
:field="name as string"
:label="name">
<!-- 字符串 -->
<a-input v-if="ValueTypeEnum.STRING.value === type"
<a-input v-if="ValueType.STRING === type"
v-model="extraValue[name]"
:placeholder="`请输入 ${name}`"
allow-clear />
<!-- 数字 -->
<a-input-number v-else-if="ValueTypeEnum.INTEGER.value === type || ValueTypeEnum.DECIMAL.value === type"
<a-input-number v-else-if="ValueType.INTEGER === type || ValueType.DECIMAL === type"
v-model="extraValue[name]"
:placeholder="`请输入 ${name}`"
:precision="ValueType.INTEGER === type ? 0 : 4"
allow-clear
hide-button />
<!-- 布尔值 -->
<a-switch v-else-if="ValueTypeEnum.BOOLEAN.value === type"
<a-switch v-else-if="ValueType.BOOLEAN === type"
type="round"
v-model="extraValue[name]"
checked-text="TRUE"
unchecked-text="FALSE" />
<!-- 颜色 -->
<template v-else-if="ValueTypeEnum.COLOR.value === type">
<template v-else-if="ValueType.COLOR === type">
<a-input v-model="extraValue[name]"
:placeholder="`请输入 ${name}`"
allow-clear
@@ -84,15 +85,14 @@
<script lang="ts" setup>
import type { DictValueUpdateRequest } from '@/api/system/dict-value';
import type { ExtraParamType } from '../../dict-key/types/const';
import { ref } from 'vue';
import useLoading from '@/hooks/loading';
import useVisible from '@/hooks/visible';
import formRules from '../types/form.rules';
import { createDictValue, updateDictValue } from '@/api/system/dict-value';
import { Message } from '@arco-design/web-vue';
import { ExtraParamType, innerKeys } from '../../dict-key/types/const';
import { ValueTypeEnum } from '../../dict-key/types/enum.types';
import {} from '@/utils/enum';
import { ValueType } from '../../dict-key/types/const';
import DictKeySelector from '@/components/system/dict-key/dict-key-selector.vue';
import { DictKeyQueryResponse } from '@/api/system/dict-key';
import { useCacheStore } from '@/store';
@@ -170,7 +170,7 @@
const nameKey = name as string;
const value = extraValue.value[nameKey];
if (value === undefined) {
if (type === ValueTypeEnum.BOOLEAN.value) {
if (type === ValueType.BOOLEAN) {
extraValue.value[nameKey] = false;
continue;
}

20
orion-ops-ui/src/views/system/dict-value/components/dict-value-table.vue
View File

@@ -128,7 +128,7 @@
<script lang="ts" setup>
import type { DictValueQueryRequest, DictValueQueryResponse } from '@/api/system/dict-value';
import { reactive, ref } from 'vue';
import { reactive, ref, onMounted } from 'vue';
import { batchDeleteDictValue, deleteDictValue, getDictValuePage } from '@/api/system/dict-value';
import { Message } from '@arco-design/web-vue';
import useLoading from '@/hooks/loading';
@@ -137,14 +137,15 @@
import useCopy from '@/hooks/copy';
import DictKeySelector from '@/components/system/dict-key/dict-key-selector.vue';
const { copy } = useCopy();
const tableRenderData = ref<DictValueQueryResponse[]>([]);
const { loading, setLoading } = useLoading();
const emits = defineEmits(['openAdd', 'openUpdate', 'openHistory']);
const pagination = usePagination();
const selectedKeys = ref<number[]>([]);
const tableRenderData = ref<DictValueQueryResponse[]>([]);
const { copy } = useCopy();
const pagination = usePagination();
const rowSelection = useRowSelection();
const { loading, setLoading } = useLoading();
const formModel = reactive<DictValueQueryRequest>({
id: undefined,
@@ -165,7 +166,7 @@
Message.success(`成功删除${selectedKeys.value.length}条数据`);
selectedKeys.value = [];
// 重新加载数据
await fetchTableData();
fetchTableData();
} catch (e) {
} finally {
setLoading(false);
@@ -182,7 +183,7 @@
await deleteDictValue(id);
Message.success('删除成功');
// 重新加载数据
await fetchTableData();
fetchTableData();
} catch (e) {
} finally {
setLoading(false);
@@ -238,7 +239,10 @@
const fetchTableData = (page = 1, limit = pagination.pageSize, form = formModel) => {
doFetchTableData({ page, limit, ...form });
};
fetchTableData();
onMounted(() => {
fetchTableData();
});
</script>

14
orion-ops-ui/src/views/system/dict-value/index.vue
View File

@@ -1,5 +1,5 @@
<template>
<div class="layout-container">
<div class="layout-container" v-if="render">
<!-- 列表-表格 -->
<dict-value-table ref="table"
@openAdd="() => modal.openAdd()"
@@ -21,11 +21,12 @@
import DictValueTable from './components/dict-value-table.vue';
import DictValueFormModal from './components/dict-value-form-modal.vue';
import { onUnmounted, ref } from 'vue';
import { ref, onBeforeMount, onUnmounted } from 'vue';
import { useCacheStore } from '@/store';
import { getDictKeyList } from '@/api/system/dict-key';
import { Message } from '@arco-design/web-vue';
const render = ref(false);
const table = ref();
const modal = ref();
const cacheStore = useCacheStore();
@@ -50,11 +51,16 @@
Message.error('配置项加载失败');
}
};
loadDictKeys();
onBeforeMount(async () => {
// 加载字典值
await loadDictKeys();
render.value = true;
});
// 卸载时清除 cache
onUnmounted(() => {
cacheStore.set('dictKeys', []);
cacheStore.reset('dictKeys');
});
</script>

0
orion-ops-ui/src/views/system/dict-value/types/enum.types.ts
View File

2
orion-ops-ui/src/views/system/menu/components/menu-table.vue
View File

@@ -182,7 +182,7 @@
<script lang="ts" setup>
import type { MenuQueryRequest, MenuQueryResponse } from '@/api/system/menu';
import { onMounted, reactive, ref } from 'vue';
import { reactive, ref, onMounted } from 'vue';
import useLoading from '@/hooks/loading';
import { getMenuList, deleteMenu, updateMenuStatus, initCache } from '@/api/system/menu';
import { menuStatusKey, menuVisibleKey, menuTypeKey, MenuType } from '../types/const';

8
orion-ops-ui/src/views/system/menu/index.vue
View File

@@ -20,16 +20,14 @@
<script lang="ts" setup>
import MenuTable from '@/views/system/menu/components/menu-table.vue';
import MenuFormModal from '@/views/system/menu/components/menu-form-modal.vue';
import { onBeforeMount, onUnmounted, ref } from 'vue';
import { ref, onBeforeMount, onUnmounted } from 'vue';
import { useCacheStore, useDictStore } from '@/store';
import { dictKeys } from './types/const';
const table = ref();
const modal = ref();
// FIXME
const render = ref(false);
// FIXME
// 加载字典项
onBeforeMount(async () => {
const dictStore = useDictStore();
@@ -37,10 +35,10 @@
render.value = true;
});
// 卸载时清除 menu cache
// 卸载时清除 cache
onUnmounted(() => {
const cacheStore = useCacheStore();
cacheStore.set('menus', []);
cacheStore.reset('menus');
});
</script>

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',
},
};