feat(frontend): 集群标准化 #4654

# Reviewed, transaction id: 24478

Author: JustaCattt

dbm-ui/frontend/src/views/cluster-standardize/components/cluster-selector/Index.vue

@@ -75,11 +75,11 @@
 
   interface SelectedMap {
     [DBTypes.MYSQL]: {
-      [ClusterTypes.TENDBHA]: ClusterInfo[];
-      [ClusterTypes.TENDBSINGLE]: ClusterInfo[];
+      [ClusterTypes.TENDBHA]?: ClusterInfo[];
+      [ClusterTypes.TENDBSINGLE]?: ClusterInfo[];
     };
     [DBTypes.TENDBCLUSTER]: {
-      [ClusterTypes.TENDBCLUSTER]: ClusterInfo[];
+      [ClusterTypes.TENDBCLUSTER]?: ClusterInfo[];
     };
   }
 </script>
@@ -97,7 +97,7 @@
   }
 
   interface Emits {
-    (e: 'change', value: ClusterInfo[]): void;
+    (e: 'change', value: Props['selected']): void;
   }
 
   const props = defineProps<Props>();
@@ -111,7 +111,7 @@
   const { t } = useI18n();
 
   const panelTabActive = ref();
-  const lastValues = reactive<Record<string, ClusterInfo[]>>({});
+  const lastValues = reactive<Props['selected']>({});
 
   // const renderCom = computed(
   //   () => {
@@ -145,15 +145,17 @@
   );
 
   watch(panelTabActive, (_, oldValue) => {
-    lastValues[oldValue] = [];
+    Object.assign(lastValues, {
+      [oldValue]: [],
+    });
   });
 
   const handleChange = (values: Record<string, ClusterInfo[]>) => {
     Object.assign(lastValues, values);
   };
 
   const handleSubmit = () => {
-    emits('change', Object.values(lastValues).flat());
+    emits('change', lastValues);
     handleClose();
   };
 

dbm-ui/frontend/src/views/cluster-standardize/components/mysql/Index.vue

@@ -122,7 +122,7 @@
   };
 
   // 从集群选择器选择确认后
-  const handelClusterChange = (data: ClusterInfo[]) => {
+  const handelClusterChange = (data: Record<string, ClusterInfo[]>) => {
     const newList = Object.values(data)
       .flat()
       .reduce<IDataRow[]>((result, item) => {

dbm-ui/frontend/src/views/cluster-standardize/components/tendbcluster/Index.vue

@@ -121,7 +121,7 @@
   };
 
   // 从集群选择器选择确认后
-  const handelClusterChange = (data: ClusterInfo[]) => {
+  const handelClusterChange = (data: Record<string, ClusterInfo[]>) => {
     const newList = Object.values(data)
       .flat()
       .reduce<IDataRow[]>((result, item) => {