From 5336902335fa0c5c006af7b3cdd8b8bcd96e15e5 Mon Sep 17 00:00:00 2001 From: jojo Date: Tue, 8 Oct 2024 15:03:43 +0800 Subject: [PATCH] =?UTF-8?q?feat(frontend):=20=E6=94=AF=E6=8C=81=E6=95=85?= =?UTF-8?q?=E9=9A=9C=E6=B1=A0=E3=80=81=E5=BE=85=E5=9B=9E=E6=94=B6=E6=B1=A0?= =?UTF-8?q?=20#7881=20#=20Reviewed,=20transaction=20id:=2026293?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/layout/components/ResourceManage.vue | 26 +- dbm-ui/frontend/src/locales/zh-cn.json | 17 +- .../frontend/src/services/source/dbdirty.ts | 8 +- .../src/services/source/dbresourceResource.ts | 13 +- dbm-ui/frontend/src/services/source/tag.ts | 1 + .../resource-manage/pool/business/Index.vue | 26 +- .../fault-or-recycle-list/Index.vue | 3 +- .../pool/components/host-list/Index.vue | 311 +++++++++++------- .../host-list/components/HostOperationTip.vue | 9 +- .../host-list/components/ImportHostBtn.vue | 5 +- .../components/batch-add-tags/Index.vue | 144 ++++++++ .../batch-add-tags/components/FormPanel.vue | 144 ++++++++ .../batch-add-tags/components/ListPanel.vue | 266 +++++++++++++++ .../batch-assign/components/FormPanel.vue | 25 +- .../batch-convert-to-business/Index.vue | 2 +- .../batch-covert-to-public/Index.vue | 2 +- .../components/batch-setting/Index.vue | 154 +++++---- .../import-host/components/FormPanel.vue | 9 +- .../components/select-host-panel/Index.vue | 61 +++- .../components/HostEmpty.vue | 13 +- .../com-factory/components/Label.vue | 32 +- .../components/field-input/Index.vue | 4 +- .../tag-research/selector/Index.vue | 3 +- .../components/tag-selector/Index.vue | 273 +++++++++++++++ .../components/update-assign/Index.vue | 11 +- .../components/DimensionSelect.vue | 21 ++ .../summary-view/components/List.vue | 13 +- .../pool/components/tag-selector/Index.vue | 18 +- .../resource-manage/pool/global/Index.vue | 23 +- .../spec/components/SpecList.vue | 17 + .../components/BusinessSelector.vue | 28 +- 31 files changed, 1409 insertions(+), 273 deletions(-) create mode 100644 dbm-ui/frontend/src/views/resource-manage/pool/components/host-list/components/batch-add-tags/Index.vue create mode 100644 dbm-ui/frontend/src/views/resource-manage/pool/components/host-list/components/batch-add-tags/components/FormPanel.vue create mode 100644 dbm-ui/frontend/src/views/resource-manage/pool/components/host-list/components/batch-add-tags/components/ListPanel.vue create mode 100644 dbm-ui/frontend/src/views/resource-manage/pool/components/host-list/components/tag-selector/Index.vue diff --git a/dbm-ui/frontend/src/layout/components/ResourceManage.vue b/dbm-ui/frontend/src/layout/components/ResourceManage.vue index e5fbc94aa3..589d528d2e 100644 --- a/dbm-ui/frontend/src/layout/components/ResourceManage.vue +++ b/dbm-ui/frontend/src/layout/components/ResourceManage.vue @@ -5,18 +5,6 @@ :opened-keys="[parentKey]" @click="handleMenuChange"> - - - - {{ t('资源规格管理') }} - - @@ -26,7 +14,7 @@ - {{ t('DB 资源池管理') }} + {{ t('资源池') }} + key="resourceSpec" + v-db-console="'resourceManage.resourceSpec'"> - {{ t('污点主机处理') }} + {{ t('资源规格管理') }} + + @@ -106,5 +96,5 @@ parentKey, key: currentActiveKey, routeLocation: handleMenuChange, - } = useActiveKey(menuRef as Ref>, 'resourceSpec'); + } = useActiveKey(menuRef as Ref>, 'resourcePool'); diff --git a/dbm-ui/frontend/src/locales/zh-cn.json b/dbm-ui/frontend/src/locales/zh-cn.json index 576eab8562..546cbcbc9a 100644 --- a/dbm-ui/frontend/src/locales/zh-cn.json +++ b/dbm-ui/frontend/src/locales/zh-cn.json @@ -3685,8 +3685,8 @@ "撤销导入": "撤销导入", "确认后，主机将从资源池移回原有模块": "确认后，主机将从资源池移回原有模块", "所属DB": "所属DB", - "移入故障池": "移入故障池", - "移入待回收池": "移入待回收池", + "转入故障池": "转入故障池", + "转入待回收池": "转入待回收池", "资源归属": "资源归属", "确认批量将 {n} 台主机转入回收池？": "确认批量将 {n} 台主机转入回收池？", "确认批量将 {n} 台主机转入故障池?": "确认批量将 {n} 台主机转入故障池？", @@ -3695,7 +3695,7 @@ "资源标签": "资源标签", "标签": "标签", "仅支持同业务的主机": "仅支持同业务的主机", - "设置属性": "设置属性", + "设置主机属性": "设置主机属性", "添加资源归属": "添加资源归属", "转为公共资源": "转为公共资源", "共n台": "共{0}台", @@ -3739,5 +3739,16 @@ "已选 IP": "已选 IP", "业务资源池": "业务资源池", "冷/热节点": "冷/热节点", + "退回公共资源池": "退回公共资源池", + "确认转入业务资源池？": "确认转入业务资源池？", + "转入业务资源池": "转入业务资源池", + "从 CMDB 的 n 业务空闲机导入": "从 CMDB 的 {0} 业务空闲机导入", + "重新设置资源归属": "重新设置资源归属", + "暂无主机，你通过以下方法获取主机至n->空闲机池->空闲机模块": "暂无主机，你通过以下方法获取主机至 “ {0} -> 空闲机池 -> 空闲机模块 “", + "确认退回公共资源池？": "确认退回公共资源池？", + "确认后，主机不再归属当前业务": "确认后，主机不再归属当前业务", + "从n业务CMDB空闲机模块导入": "从「{0}」业务 CMDB 空闲机模块导入", + "清空主机现有的所属 DB 和标签，重新进行设置": "清空主机现有的所属 DB 和标签，重新进行设置", + "清空主机现有的所属业务、所属 DB 、标签，重新进行设置": "清空主机现有的所属业务、所属 DB 、标签，重新进行设置", "这行勿动！新增翻译请在上一行添加！": "" } diff --git a/dbm-ui/frontend/src/services/source/dbdirty.ts b/dbm-ui/frontend/src/services/source/dbdirty.ts index 1d8fdf07f0..366cc13391 100644 --- a/dbm-ui/frontend/src/services/source/dbdirty.ts +++ b/dbm-ui/frontend/src/services/source/dbdirty.ts @@ -57,7 +57,13 @@ export function deleteDirtyRecords(params: { bk_host_ids: number[] }) { /** * 故障池、待回收池列表 */ -export function getMachinePool(params: { limit?: number; offset?: number; ips?: string; pool: 'fault' | 'recycle' }) { +export function getMachinePool(params: { + limit?: number; + offset?: number; + ips?: string; + pool: 'fault' | 'recycle'; + bk_biz_id?: number; +}) { return http.get>(`${path}/query_machine_pool/`, params).then((res) => ({ ...res, results: res.results.map((item: FaultOrRecycleMachineModel) => new FaultOrRecycleMachineModel(item)), diff --git a/dbm-ui/frontend/src/services/source/dbresourceResource.ts b/dbm-ui/frontend/src/services/source/dbresourceResource.ts index 11b87b633c..c4f03f0836 100644 --- a/dbm-ui/frontend/src/services/source/dbresourceResource.ts +++ b/dbm-ui/frontend/src/services/source/dbresourceResource.ts @@ -96,7 +96,7 @@ export function fetchList(params: Record, payload = {} as IRequestP /** * 获取DBA业务下的主机信息 */ -export function fetchListDbaHost(params: { limit: number; offset: number; search_content: string }) { +export function fetchListDbaHost(params: { limit: number; offset: number; search_content: string; bk_biz_id: number }) { return http .get<{ total: number; @@ -105,6 +105,7 @@ export function fetchListDbaHost(params: { limit: number; offset: number; search search_content: params.search_content, start: params.offset, page_size: params.limit, + bk_biz_id: params.bk_biz_id, }) .then((data) => ({ count: data.total, @@ -177,7 +178,7 @@ export function getSpecResourceCount(params: { export function updateResource(params: { bk_host_ids: number[]; labels?: number[]; - for_biz: number; + for_biz?: number; rack_id: string; resource_type?: string; storage_device?: Record; @@ -212,6 +213,7 @@ export function getSummaryList(params: { machine_type?: string; cluster_type?: string; spec_id_list?: number[]; + enable_spec?: boolean; }; }) { return http.get(`${path}/resource_summary/`, params).then((data) => ({ @@ -219,3 +221,10 @@ export function getSummaryList(params: { results: data.map((item) => new SummaryModel(item)), })); } + +/** + * 追加主机标签 + */ +export function appendHostLabel(params: { bk_host_ids: number[]; labels: number[] }) { + return http.post(`${path}/append_labels/`, params); +} diff --git a/dbm-ui/frontend/src/services/source/tag.ts b/dbm-ui/frontend/src/services/source/tag.ts index 649ace1376..3517e6ccd9 100644 --- a/dbm-ui/frontend/src/services/source/tag.ts +++ b/dbm-ui/frontend/src/services/source/tag.ts @@ -16,6 +16,7 @@ export function listTag(params: { limit?: number; offset?: number; ordering?: string; + ids?: string; }) { return http.get>(`${path}`, params).then((res) => ({ ...res, diff --git a/dbm-ui/frontend/src/views/resource-manage/pool/business/Index.vue b/dbm-ui/frontend/src/views/resource-manage/pool/business/Index.vue index 8ad233dfd5..3695ccb586 100644 --- a/dbm-ui/frontend/src/views/resource-manage/pool/business/Index.vue +++ b/dbm-ui/frontend/src/views/resource-manage/pool/business/Index.vue @@ -14,18 +14,13 @@
{{ t('业务') }} - - - {{ t('导入主机') }} - +
+ @@ -52,6 +48,8 @@ import { useDebouncedRef } from '@hooks'; + import ImportHost from '../components/host-list/components/import-host/Index.vue'; + import ImportHostBtn from '../components/host-list/components/ImportHostBtn.vue'; import HostList from '../components/host-list/Index.vue'; import { ResourcePool } from '../type'; @@ -61,6 +59,8 @@ const activeTab = useDebouncedRef(route.params.page as ResourcePool); const listRef = useTemplateRef('listRef'); + const isShowImportHost = ref(false); + const panels = [ { name: 'business', @@ -80,11 +80,9 @@ }); }; - const linkToBusiness = () => { - activeTab.value = ResourcePool.business; - setTimeout(() => { - listRef.value?.handleImportHost(); - }, 1000); + // 导入主机 + const handleImportHost = () => { + isShowImportHost.value = true; }; diff --git a/dbm-ui/frontend/src/views/resource-manage/pool/components/fault-or-recycle-list/Index.vue b/dbm-ui/frontend/src/views/resource-manage/pool/components/fault-or-recycle-list/Index.vue index 61a43cc329..db72c2cf0e 100644 --- a/dbm-ui/frontend/src/views/resource-manage/pool/components/fault-or-recycle-list/Index.vue +++ b/dbm-ui/frontend/src/views/resource-manage/pool/components/fault-or-recycle-list/Index.vue @@ -114,7 +114,8 @@ const dataSource = (params: FaultOrRecycleMachineModel) => getMachinePool({ ...params, - pool: isFaultPool.value ? 'fault' : 'recycle' + pool: isFaultPool.value ? 'fault' : 'recycle', + bk_biz_id: undefined, }); const tableColumn = [ { diff --git a/dbm-ui/frontend/src/views/resource-manage/pool/components/host-list/Index.vue b/dbm-ui/frontend/src/views/resource-manage/pool/components/host-list/Index.vue index 7bc58fbd30..3ccb77392e 100644 --- a/dbm-ui/frontend/src/views/resource-manage/pool/components/host-list/Index.vue +++ b/dbm-ui/frontend/src/views/resource-manage/pool/components/host-list/Index.vue @@ -27,10 +27,7 @@ @@ -32,6 +39,7 @@ interface Emits { (e: 'change', value: string): void; + (e: 'changeSpecEnable', value: boolean): void; } const emits = defineEmits(); @@ -56,6 +64,7 @@ const selectTriggerRef = ref(); const selectWrapperRef = ref(); const showSelectWrapper = ref(false); + const isSpecEnable = ref(true); const renderLabel = computed(() => dimensions.find((item) => item.value === modelValue.value)?.label as string); @@ -63,6 +72,10 @@ showSelectWrapper.value = false; emits('change', value); }; + + const changeSpecEnable = (value: boolean) => { + emits('changeSpecEnable', value); + };