feat(frontend): 工具箱支持资源池协议变更_editable_table TencentBlueKing#8076

hLinx · Dec 15, 2024 · ca6d36e · ca6d36e
1 parent 211e532
commit ca6d36e
Show file tree

Hide file tree

Showing 2 changed files with 56 additions and 52 deletions.
diff --git a/dbm-ui/frontend/src/components/editable-table/Index.vue b/dbm-ui/frontend/src/components/editable-table/Index.vue
@@ -188,57 +188,65 @@
   }, 30);
 
   const validate = () =>
-    Promise.all(_.flatten(rowList.value).map((column) => column.validate())).then(
-      () => true,
-      () => false,
+    Promise.resolve().then(() =>
+      Promise.all(_.flatten(rowList.value).map((column) => column.validate())).then(
+        () => true,
+        () => false,
+      ),
     );
-  const validateByRowIndex = (rowIndex: number | number[]) => {
-    const rowIndexList = Array.isArray(rowIndex) ? rowIndex : [rowIndex];
 
-    const columnList = rowIndexList.reduce<IColumnContext[]>((result, index) => {
-      result.push(...rowList.value[index]);
-      return result;
-    }, []);
+  const validateByRowIndex = (rowIndex: number | number[]) =>
+    Promise.resolve().then(() => {
+      const rowIndexList = Array.isArray(rowIndex) ? rowIndex : [rowIndex];
 
-    return Promise.all(columnList.map((column) => column.validate())).then(
-      () => true,
-      () => false,
-    );
-  };
-  const validateByColumnIndex = (columnIndex: number | number[]) => {
-    const columnIndexList = Array.isArray(columnIndex) ? columnIndex : [columnIndex];
+      const columnList = rowIndexList.reduce<IColumnContext[]>((result, index) => {
+        result.push(...rowList.value[index]);
+        return result;
+      }, []);
 
-    const columnList = rowList.value.reduce((result, rowItem) => {
-      columnIndexList.forEach((index) => {
-        result.push(rowItem[index]);
-      });
-      return result;
-    }, []);
+      return Promise.all(columnList.map((column) => column.validate())).then(
+        () => true,
+        () => false,
+      );
+    });
 
-    return Promise.all(columnList.map((column) => column.validate())).then(
-      () => true,
-      () => false,
-    );
-  };
-  const validateByField = (field: string | string[]) => {
-    const fieldList = Array.isArray(field) ? field : [field];
-
-    const columnList = rowList.value.reduce((result, rowItem) => {
-      fieldList.forEach((field) => {
-        rowItem.forEach((column) => {
-          if (column.props.field && column.props.field === field) {
-            result.push(column);
-          }
-        });
-      });
-      return result;
-    }, []);
+  const validateByColumnIndex = (columnIndex: number | number[]) =>
+    Promise.resolve().then(() => {
+      const columnIndexList = Array.isArray(columnIndex) ? columnIndex : [columnIndex];
 
-    return Promise.all(columnList.map((column) => column.validate())).then(
-      () => true,
-      () => false,
-    );
-  };
+      const columnList = rowList.value.reduce((result, rowItem) => {
+        columnIndexList.forEach((index) => {
+          result.push(rowItem[index]);
+        });
+        return result;
+      }, []);
+
+      return Promise.all(columnList.map((column) => column.validate())).then(
+        () => true,
+        () => false,
+      );
+    });
+
+  const validateByField = (field: string | string[]) =>
+    Promise.resolve().then(() => {
+      const fieldList = Array.isArray(field) ? field : [field];
+
+      const columnList = rowList.value.reduce((result, rowItem) => {
+        fieldList.forEach((field) => {
+          rowItem.forEach((column) => {
+            if (column.props.field && column.props.field === field) {
+              result.push(column);
+            }
+          });
+        });
+        return result;
+      }, []);
+
+      return Promise.all(columnList.map((column) => column.validate())).then(
+        () => true,
+        () => false,
+      );
+    });
 
   provide(tableInjectKey, {
     props,

diff --git a/dbm-ui/frontend/src/views/db-manage/common/toolbox-field/operation-column/Index.vue b/dbm-ui/frontend/src/views/db-manage/common/toolbox-field/operation-column/Index.vue
@@ -44,7 +44,7 @@
 </template>
 <script setup lang="ts" generic="T extends Record<string, any>">
   import _ from 'lodash';
-  import { nextTick, useTemplateRef } from 'vue';
+  import { useTemplateRef } from 'vue';
   import { useI18n } from 'vue-i18n';
 
   import { Column, useTable } from '@components/editable-table/Index.vue';
@@ -70,9 +70,7 @@
 
     if (newRowIndex > 0) {
       tableData.value.splice(newRowIndex, 0, props.createRowMethod!());
-      nextTick(() => {
-        editTableContext!.validateByRowIndex(newRowIndex);
-      });
+      editTableContext!.validateByRowIndex(newRowIndex);
     }
   };
 
@@ -93,9 +91,7 @@
 
     if (rowIndex > 0) {
       tableData.value.splice(newRowIndex, 0, _.cloneDeep(tableData.value[rowIndex]));
-      nextTick(() => {
-        editTableContext!.validateByRowIndex(newRowIndex);
-      });
+      editTableContext!.validateByRowIndex(newRowIndex);
     }
   };
 </script>