feat(frontend): mysql和tendbcluster 备份单据优化 TencentBlueKing#6731

JustaCattt · Dec 4, 2024 · d794cbe · d794cbe
1 parent 335d530
commit d794cbe
Show file tree

Hide file tree

Showing 5 changed files with 54 additions and 9 deletions.
diff --git a/dbm-ui/frontend/src/hooks/useTicketCloneInfo/generateCloneData/mysql/haDbTableBackup.ts b/dbm-ui/frontend/src/hooks/useTicketCloneInfo/generateCloneData/mysql/haDbTableBackup.ts
@@ -13,6 +13,8 @@
 import type { MySQLTableBackupDetails } from '@services/model/ticket/details/mysql';
 import TicketModel from '@services/model/ticket/ticket';
 
+import { ClusterTypes } from '@common/const';
+
 import { random } from '@utils';
 
 // Mysql 库表备份
@@ -24,7 +26,7 @@ export function generateMysqlDbTableBackupCloneData(ticketData: TicketModel<MySQ
       id: item.cluster_id,
       domain: clusters[item.cluster_id].immute_domain,
     },
-    backupLocal: 'Slave',
+    backupLocal: item.backup_on || clusters[item.cluster_id].cluster_type === ClusterTypes.TENDBHA ? 'Slave' : 'Master',
     dbPatterns: item.db_patterns,
     tablePatterns: item.table_patterns,
     ignoreDbs: item.ignore_dbs,

diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/db-table-backup/pages/page1/Index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/db-table-backup/pages/page1/Index.vue
@@ -36,6 +36,7 @@
           :removeable="tableData.length < 2"
           @add="(payload: Array<IDataRow>) => handleAppend(index, payload)"
           @clone="(payload: IDataRow) => handleClone(index, payload)"
+          @id-change="(clusterId: number) => handleChangeCluster(index, clusterId)"
           @remove="handleRemove(index)" />
       </RenderData>
       <TicketRemark v-model="remark" />
@@ -76,6 +77,7 @@
 
   import TendbhaModel from '@services/model/mysql/tendbha';
   import TendbsingleModel from '@services/model/mysql/tendbsingle';
+  import { filterClusters } from '@services/source/dbbase';
   import { createTicket } from '@services/source/ticket';
 
   import { useTicketCloneInfo } from '@hooks';
@@ -167,6 +169,7 @@
               id: clusterData.id,
               domain: clusterData.master_domain,
             },
+            backupLocal: clusterData.cluster_type === ClusterTypes.TENDBHA ? 'Slave' : 'Master',
           });
           results.push(row);
           domainMemo[domain] = true;
@@ -184,6 +187,33 @@
     window.changeConfirm = true;
   };
 
+  // 输入集群后查询集群信息并填充到table
+  const handleChangeCluster = async (index: number, clusterId: number) => {
+    if (tableData.value[index].clusterData?.id === clusterId) {
+      return;
+    }
+
+    const resultList = await filterClusters<TendbhaModel | TendbsingleModel>({
+      bk_biz_id: window.PROJECT_CONFIG.BIZ_ID,
+      cluster_ids: String(clusterId),
+    });
+    if (resultList.length < 1) {
+      return;
+    }
+    const item = resultList[0];
+    const domain = item.master_domain;
+    const row = createRowData({
+      clusterData: {
+        id: item.id,
+        domain,
+      },
+      backupLocal: item.cluster_type === ClusterTypes.TENDBHA ? 'Slave' : 'Master',
+    });
+    tableData.value[index] = row;
+    domainMemo[domain] = true;
+    selectedClusters.value[item.cluster_type].push(item);
+  };
+
   const handleBatchEditColumn = (value: string | string[], filed: IDataRowBatchKey) => {
     if (!value || checkListEmpty(tableData.value)) {
       return;

diff --git a/...views/db-manage/mysql/db-table-backup/pages/page1/components/RenderData/RenderCluster.vue b/...views/db-manage/mysql/db-table-backup/pages/page1/components/RenderData/RenderCluster.vue
@@ -17,7 +17,8 @@
       ref="editRef"
       v-model="localDomain"
       :placeholder="t('请输入集群域名或从表头批量选择')"
-      :rules="rules" />
+      :rules="rules"
+      @focus="handleFocus" />
   </div>
 </template>
 <!-- <script lang="ts">
@@ -57,6 +58,8 @@
 
   const { currentBizId } = useGlobalBizs();
 
+  let isSkipInputFinish = false;
+
   const editRef = ref();
 
   const localClusterId = ref(0);
@@ -86,7 +89,9 @@
         }).then((data) => {
           if (data.length > 0) {
             localClusterId.value = data[0].id;
-            emits('idChange', localClusterId.value);
+            if (!isSkipInputFinish) {
+              emits('idChange', data[0].id);
+            }
             return true;
           }
           return false;
@@ -152,12 +157,17 @@
   //   },
   // );
 
+  const handleFocus = () => {
+    isSkipInputFinish = false;
+  };
+
   // onBeforeUnmount(() => {
   //   delete clusterIdMemo[instanceKey];
   // });
 
   defineExpose<Exposes>({
-    getValue() {
+    getValue(isSubmit = false) {
+      isSkipInputFinish = isSubmit;
       return editRef.value
         .getValue()
         .then(() => ({

diff --git a/...ntend/src/views/db-manage/mysql/db-table-backup/pages/page1/components/RenderData/Row.vue b/...ntend/src/views/db-manage/mysql/db-table-backup/pages/page1/components/RenderData/Row.vue
@@ -80,7 +80,7 @@
       domain: string;
     };
     // backupOn: string,
-    backupLocal: string;
+    backupLocal?: string;
     dbPatterns?: string[];
     tablePatterns?: string[];
     ignoreDbs?: string[];
@@ -94,7 +94,7 @@
     rowKey: random(),
     clusterData: data.clusterData,
     // backupOn: data.backupOn || '',
-    backupLocal: data.backupLocal || 'Slave',
+    backupLocal: data.backupLocal,
     dbPatterns: data.dbPatterns,
     tablePatterns: data.tablePatterns,
     ignoreDbs: data.ignoreDbs,
@@ -116,6 +116,7 @@
     (e: 'add', params: Array<IDataRow>): void;
     (e: 'remove'): void;
     (e: 'clone', value: IDataRow): void;
+    (e: 'idChange', value: number): void;
   }
 
   interface Exposes {
@@ -150,7 +151,7 @@
   );
 
   const handleClusterIdChange = (clusterId: number) => {
-    localClusterId.value = clusterId;
+    emits('idChange', clusterId);
   };
 
   const handleAppend = () => {
@@ -165,7 +166,7 @@
   };
 
   const getRowData = () => [
-    clusterRef.value.getValue(),
+    clusterRef.value.getValue(true),
     // backupSourceRef.value.getValue('backup_on'),
     dbPatternsRef.value.getValue('db_patterns'),
     tablePatternsRef.value.getValue('table_patterns'),

diff --git a/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/mysql/TableBackup.vue b/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/mysql/TableBackup.vue
@@ -23,6 +23,8 @@
   import type { MySQLTableBackupDetails } from '@services/model/ticket/details/mysql';
   import TicketModel from '@services/model/ticket/ticket';
 
+  import { ClusterTypes } from '@common/const';
+
   interface Props {
     ticketDetails: TicketModel<MySQLTableBackupDetails>
   }
@@ -131,7 +133,7 @@
       const clusterData = clusterIds[item.cluster_id];
       list.push(Object.assign({
         cluster_id: item.cluster_id,
-        backup_on: item.backup_on || 'Slave',
+        backup_on: item.backup_on || clusterData.cluster_type === ClusterTypes.TENDBHA ? 'Slave' : 'Master',
         db_patterns: item.db_patterns,
         ignore_dbs: item.ignore_dbs,
         ignore_tables: item.ignore_tables,