feat(frontend): 资源规格支持doris及机型规格交互调整 TencentBlueKing#8051

hLinx · Nov 20, 2024 · 853ed42 · 853ed42
1 parent f916c73
commit 853ed42
Show file tree

Hide file tree

Showing 11 changed files with 102 additions and 118 deletions.
diff --git a/dbm-ui/frontend/src/common/const/dbTypeInfos.ts b/dbm-ui/frontend/src/common/const/dbTypeInfos.ts
@@ -217,7 +217,20 @@ const bigdata: InfoType = {
     id: DBTypes.DORIS,
     name: 'Doris',
     moduleId: 'bigdata',
-    machineList: [],
+    machineList: [
+      {
+        label: t('Follower节点'),
+        value: MachineTypes.DORIS_FOLLOWER,
+      },
+      {
+        label: t('Observer节点'),
+        value: MachineTypes.DORIS_OBSERVER,
+      },
+      {
+        label: t('冷/热节点'),
+        value: MachineTypes.DORIS_BACKEND,
+      },
+    ],
   },
 };
 export const DBTypeInfos = {

diff --git a/dbm-ui/frontend/src/common/const/machineTypes.ts b/dbm-ui/frontend/src/common/const/machineTypes.ts
@@ -68,7 +68,7 @@ export enum MachineTypes {
 }
 // doris
 export enum MachineTypes {
-  DORIS_FOLLOWER = 'doris_follower',
-  DORIS_OBSERVER = 'doris_observer',
-  DORIS_BACKEND = 'doris_backend',
+  DORIS_FOLLOWER = 'doris_follower', // Follower节点
+  DORIS_OBSERVER = 'doris_observer', // Observer节点
+  DORIS_BACKEND = 'doris_backend', // 冷/热节点
 }
diff --git a/dbm-ui/frontend/src/services/source/dbresourceResource.ts b/dbm-ui/frontend/src/services/source/dbresourceResource.ts
@@ -32,28 +32,15 @@ export function removeResource(params: { bk_host_ids: number[] }) {
 /**
  * 获取机型列表
  */
-export function fetchDeviceClass(params: { offset?: number; limit?: number; name?: string }) {
-  return http.post<
+export function fetchDeviceClass(params: { offset?: number; limit?: number; device_type?: string }) {
+  return http.get<
     ListBase<
       {
-        capacity_flag: number; // 容量标志
-        comment: string; // 评论
-        cpu: number; // CPU 核心数
-        disk: number; // 磁盘大小 (GB)
-        enable_apply: boolean; // 是否启用申请
-        enable_capacity: boolean; // 是否启用容量
-        id: number; // 设备唯一标识
-        label: {
-          device_group: string; // 设备组
-          device_size: string; // 设备大小
-        };
-        mem: number; // 内存大小 (GB)
-        region: string; // 区域
-        require_type: number; // 需求类型
-        remark: string; // 备注
-        score: number; // 评分
-        zone: string; // 可用区
-        device_type: string; // 设备类型
+        cpu: number;
+        device_type: string;
+        disk: number;
+        id: number;
+        mem: number;
       }[]
     >
   >(`${path}/get_device_class/`, params);
@@ -188,9 +175,9 @@ export function getSpecResourceCount(params: {
  */
 export function updateResource(params: {
   bk_host_ids: number[];
-  for_biz: number;
+  for_biz?: number;
   rack_id: string;
-  resource_type: string;
+  resource_type?: string;
   storage_device: Record<string, { size: number; disk_type: string }>;
 }) {
   return http.post(`${path}/update/`, params);

diff --git a/dbm-ui/frontend/src/views/db-manage/common/apply-items/SpecSelector.vue b/dbm-ui/frontend/src/views/db-manage/common/apply-items/SpecSelector.vue
@@ -33,7 +33,15 @@
                 <span class="info-title">{{ t('可用主机数') }}：</span>
                 <span class="info-value">{{ item.count ?? 0 }}</span>
               </div>
-              <template v-if="!item.device_class.length && item.cpu.max">
+              <div
+                v-if="item.device_class.length"
+                class="info">
+                <span class="info-title">{{ t('机型') }}：</span>
+                <span class="info-value">
+                  {{ item.device_class.join('，') }}
+                </span>
+              </div>
+              <template v-else>
                 <div class="info">
                   <span class="info-title">CPU：</span>
                   <span class="info-value">({{ item.cpu.min }} ~ {{ item.cpu.max }}) {{ t('核') }}</span>
@@ -43,14 +51,7 @@
                   <span class="info-value">({{ item.mem.min }} ~ {{ item.mem.max }}) G</span>
                 </div>
               </template>
-              <div
-                v-else
-                class="info">
-                <span class="info-title">{{ t('机型') }}：</span>
-                <span class="info-value">
-                  {{ item.device_class.length > 0 ? item.device_class.join('，') : t('无限制') }}
-                </span>
-              </div>
+
               <div
                 class="info"
                 style="align-items: start">

diff --git a/dbm-ui/frontend/src/views/resource-manage/pool/host-list/components/batch-setting/Index.vue b/dbm-ui/frontend/src/views/resource-manage/pool/host-list/components/batch-setting/Index.vue
@@ -19,8 +19,7 @@
           :model="formData">
           <DbFormItem
             :label="t('所属业务')"
-            property="for_biz"
-            required>
+            property="for_biz">
             <div class="com-input">
               <BkSelect
                 v-model="formData.for_biz"
@@ -35,8 +34,7 @@
           </DbFormItem>
           <DbFormItem
             :label="t('所属DB类型')"
-            property="resource_type"
-            required>
+            property="resource_type">
             <div class="com-input">
               <BkSelect
                 v-model="formData.resource_type"
@@ -167,13 +165,18 @@
           }),
           {} as Record<string, { size: number; disk_type: string }>,
         );
-        return updateResource({
+        const params = {
           bk_host_ids: props.data.map((item) => ~~item),
-          for_biz: Number(formData.for_biz),
           rack_id: formData.rack_id,
-          resource_type: formData.resource_type,
           storage_device: storageDevice,
-        }).then(() => {
+        };
+        if (formData.for_biz !== '') {
+          Object.assign(params, { for_biz: Number(formData.for_biz) });
+        }
+        if (formData.resource_type !== '') {
+          Object.assign(params, { resource_type: formData.resource_type });
+        }
+        return updateResource(params).then(() => {
           window.changeConfirm = false;
           emits('change');
           handleCancel();

diff --git a/...ge/pool/host-list/components/search-box/components/com-factory/components/DeviceClass.vue b/...ge/pool/host-list/components/search-box/components/com-factory/components/DeviceClass.vue
@@ -62,7 +62,7 @@
   const searchParams = {
     offset: 0,
     limit: 12,
-    name: '',
+    device_type: '',
   };
 
   let isAppend = false;
@@ -89,7 +89,7 @@
 
   const remoteMethod = (value: string) => {
     isAppend = false;
-    searchParams.name = value;
+    searchParams.device_type = value;
     searchParams.offset = 0;
     getDeviceClassList(searchParams);
   };

diff --git a/dbm-ui/frontend/src/views/resource-manage/spec/components/SpecCreate.vue b/dbm-ui/frontend/src/views/resource-manage/spec/components/SpecCreate.vue
@@ -179,9 +179,6 @@
   const initFormdata = () => {
     if (props.data) {
       const data = _.cloneDeep(props.data);
-      if (data.device_class.length === 0 && !props.data.mem.max) {
-        data.device_class = ['-1'];
-      }
       return data;
     }
 
@@ -338,16 +335,8 @@
       });
       const type = specDeviceOrCpuMemRef.value!.getCurrentType();
       if (type === 'device_class') {
-        Object.assign(params, {
-          cpu: {
-            min: 0,
-            max: 0,
-          },
-          mem: {
-            min: 0,
-            max: 0,
-          },
-        });
+        const deviceClassCpuMem = specDeviceOrCpuMemRef.value!.getDeviceClassCpuMem();
+        Object.assign(params, deviceClassCpuMem);
       } else {
         params.device_class = [];
       }

diff --git a/dbm-ui/frontend/src/views/resource-manage/spec/components/SpecList.vue b/dbm-ui/frontend/src/views/resource-manage/spec/components/SpecList.vue
@@ -210,7 +210,7 @@
             {{
               default: () => (
                 <div class="machine-info text-overflow">
-                  {data.device_class.length === 0 && data.cpu.min > 0 && <>
+                  {data.cpu.min > 0 && data.device_class.length === 0 && <>
                     <bk-tag class="machine-info-cpu">
                       CPU = {`${data.cpu.min} ~ ${data.cpu.max}`} {t('核')}
                     </bk-tag>
@@ -224,9 +224,9 @@
                       AND
                     </bk-tag>
                   </>}
-                  {((data.device_class.length === 0 && data.cpu.min === 0) || data.device_class.length > 0) && <>
+                  {data.device_class.length > 0 && <>
                     <bk-tag class="machine-info-device">
-                      {t('机型')} = {data.device_class.join(',') || t('无限制')}
+                      {t('机型')} = {data.device_class.join(',')}
                     </bk-tag>
                     <bk-tag class="machine-info-condition" theme="info">
                       AND
@@ -243,7 +243,7 @@
               ),
               content: () => (
                 <div class="resource-machine-info-tips">
-                  {data.device_class.length === 0 && data.cpu.min > 0 && <>
+                  {data.cpu.min > 0 && data.device_class.length === 0 && <>
                     <strong>CPU: </strong>
                     <div class="resource-machine-info__values mb-10">
                       <bk-tag>{`${data.cpu.min} ~ ${data.cpu.max}`} {t('核')}</bk-tag>
@@ -253,13 +253,11 @@
                       <bk-tag>{`${data.mem.min} ~ ${data.mem.max}`} G</bk-tag>
                     </div>
                   </>}
-                  {((data.device_class.length === 0 && data.cpu.min === 0) || data.device_class.length > 0) && <>
+                  {data.device_class.length > 0 && <>
                     <strong>{t('机型')}: </strong>
                     <div class="resource-machine-info__values mb-10">
                       {
-                        data.device_class.length
-                          ? data.device_class.map(item => <bk-tag>{item}</bk-tag>)
-                          : <bk-tag>{t('无限制')}</bk-tag>
+                        data.device_class.map(item => <bk-tag>{item}</bk-tag>)
                       }
                     </div>
                   </>}

diff --git a/dbm-ui/frontend/src/views/resource-manage/spec/components/spec-form-item/SpecDevice.vue b/dbm-ui/frontend/src/views/resource-manage/spec/components/spec-form-item/SpecDevice.vue
@@ -35,10 +35,6 @@
           :scroll-loading="scrollLoading"
           @change="handleSelectChange"
           @scroll-end="handleScrollEnd">
-          <BkOption
-            key="all"
-            :label="t('无限制')"
-            value="-1" />
           <BkOption
             v-for="item in deviceClassList"
             :key="item.value"
@@ -73,7 +69,7 @@
   const searchParams = {
     offset: 0,
     limit: 12,
-    name: '',
+    device_type: '',
   };
 
   const rules = [
@@ -112,26 +108,12 @@
 
   const remoteMethod = (value: string) => {
     isAppend = false;
-    searchParams.name = value;
+    searchParams.device_type = value;
     searchParams.offset = 0;
     getDeviceClassList(searchParams);
   };
 
   const handleSelectChange = (list: string[]) => {
-    if (list.length > 1) {
-      if (list[0] === '-1') {
-        // 先选的无限制，后续加选要去除无限制
-        modelValue.value = list.slice(1);
-        return;
-      }
-
-      if (list[list.length - 1] === '-1') {
-        // 最后选的无限制，前面选过的都要去除
-        modelValue.value = '-1';
-        return;
-      }
-    }
-
     modelValue.value = list;
   };
 </script>

diff --git a/...src/views/resource-manage/spec/components/spec-form-item/spec-device-or-cpu-mem/Index.vue b/...src/views/resource-manage/spec/components/spec-form-item/spec-device-or-cpu-mem/Index.vue
@@ -52,6 +52,7 @@
     </div>
     <SpecDevice
       v-if="currentType === 'device_class'"
+      ref="specDeviceRef"
       v-model="deviceClassModelValue"
       :is-edit="isEdit" />
     <div
@@ -71,7 +72,7 @@
   import { useI18n } from 'vue-i18n';
 
   import SpecCPU from './components/SpecCPU.vue';
-  import SpecDevice from './components/SpecDevice.vue';
+  import SpecDevice, { type DeviceClassCpuMemType } from './components/SpecDevice.vue';
   import SpecMem from './components/SpecMem.vue';
 
   interface Props {
@@ -80,6 +81,7 @@
 
   interface Exposes {
     getCurrentType: () => string;
+    getDeviceClassCpuMem: () => DeviceClassCpuMemType;
   }
 
   withDefaults(defineProps<Props>(), {
@@ -113,6 +115,7 @@
 
   const isRotate = ref(false);
   const currentType = ref(titleList[0].value);
+  const specDeviceRef = ref<typeof SpecDevice>();
 
   const currentTitle = computed(() => (currentType.value === 'device_class' ? titleList[0].title : titleList[1].title));
 
@@ -155,6 +158,9 @@
     getCurrentType() {
       return currentType.value;
     },
+    getDeviceClassCpuMem() {
+      return specDeviceRef.value?.getDeviceClassCpuMem();
+    },
   });
 </script>