diff --git a/dbm-ui/frontend/package.json b/dbm-ui/frontend/package.json
index 6fc3c4b0a5..4ee8daefec 100644
--- a/dbm-ui/frontend/package.json
+++ b/dbm-ui/frontend/package.json
@@ -20,7 +20,7 @@
     "@blueking/bk-weweb": "0.0.24",
     "@blueking/bkflow.js": "0.1.10",
     "@blueking/date-picker": "0.0.72",
-    "@blueking/ip-selector": "0.0.1-beta.138",
+    "@blueking/ip-selector": "0.3.0-beta.23",
     "@blueking/notice-component": "2.0.4",
     "@blueking/sub-saas": "^0.0.0-beta.6",
     "@icon-cool/bk-icon-bk-biz-components": "0.0.4",
diff --git a/dbm-ui/frontend/src/components/instance-selector/Index.vue b/dbm-ui/frontend/src/components/instance-selector/Index.vue
index c38951dae4..a36911bd4e 100644
--- a/dbm-ui/frontend/src/components/instance-selector/Index.vue
+++ b/dbm-ui/frontend/src/components/instance-selector/Index.vue
@@ -98,18 +98,21 @@
 
   export interface IValue {
     [key: string]: any;
-    bk_host_id: number;
     bk_cloud_id: number;
     bk_cloud_name: string;
+    bk_host_id: number;
+    cluster_id: number;
+    cluster_name: string;
+    cluster_type: string;
+    db_module_id: number;
+    db_module_name: string;
+    id: number;
     ip: string;
     port: number;
     instance_address: string;
-    cluster_id: number;
-    cluster_type: string;
     status?: string;
     host_info?: any;
-    id?: number;
-    master_domain?: string;
+    master_domain: string;
     related_instances?: {
       instance: string;
       status: string;
@@ -254,7 +257,7 @@
   }
 
   interface Emits {
-    (e: 'change', value: Props['selected']): void;
+    (e: 'change', value: NonNullable<Props['selected']>): void;
   }
 
   const props = withDefaults(defineProps<Props>(), {
diff --git a/dbm-ui/frontend/src/components/instance-selector/components/RenderManualHost.vue b/dbm-ui/frontend/src/components/instance-selector/components/RenderManualHost.vue
index d5a0d61c2f..b354bfbef8 100644
--- a/dbm-ui/frontend/src/components/instance-selector/components/RenderManualHost.vue
+++ b/dbm-ui/frontend/src/components/instance-selector/components/RenderManualHost.vue
@@ -73,6 +73,8 @@
     bk_cloud_id: data.host_info.cloud_id,
     port: data.port,
     ip: data.ip,
+    db_module_id: data.db_module_id,
+    db_module_name: data.db_module_name,
   });
 
   const search = ref('');
diff --git a/dbm-ui/frontend/src/components/instance-selector/components/RenderTopoHost.vue b/dbm-ui/frontend/src/components/instance-selector/components/RenderTopoHost.vue
index 3a94832c53..a51a64c766 100644
--- a/dbm-ui/frontend/src/components/instance-selector/components/RenderTopoHost.vue
+++ b/dbm-ui/frontend/src/components/instance-selector/components/RenderTopoHost.vue
@@ -94,6 +94,8 @@
     ip: data.ip || '',
     port: data.port,
     cluster_type: data.cluster_type as MySQLClusterTypes,
+    db_module_id: data.db_module_id,
+    db_module_name: data.db_module_name,
   });
 
   const { t } = useI18n();
diff --git a/dbm-ui/frontend/src/components/instance-selector/components/common/manual-content-host/table/Index.vue b/dbm-ui/frontend/src/components/instance-selector/components/common/manual-content-host/table/Index.vue
index cc5282f2cf..f18be4fdee 100644
--- a/dbm-ui/frontend/src/components/instance-selector/components/common/manual-content-host/table/Index.vue
+++ b/dbm-ui/frontend/src/components/instance-selector/components/common/manual-content-host/table/Index.vue
@@ -107,7 +107,9 @@
     related_instances: (data.related_instances || []).map(instanceItem => ({
       instance: instanceItem.instance,
       status: instanceItem.status
-    }))
+    })),
+    db_module_id: data.db_module_id,
+    db_module_name: data.db_module_name,
   });
 
   const { t } = useI18n();
diff --git a/dbm-ui/frontend/src/components/instance-selector/components/common/manual-content/table/Index.vue b/dbm-ui/frontend/src/components/instance-selector/components/common/manual-content/table/Index.vue
index 0927ea9ea3..5e1f38a9aa 100644
--- a/dbm-ui/frontend/src/components/instance-selector/components/common/manual-content/table/Index.vue
+++ b/dbm-ui/frontend/src/components/instance-selector/components/common/manual-content/table/Index.vue
@@ -82,6 +82,8 @@
     ip: data.ip || '',
     port: data.port,
     cluster_type: data.cluster_type,
+    db_module_id: data.db_module_id,
+    db_module_name: data.db_module_name,
   });
 
   const { t } = useI18n();
@@ -286,7 +288,6 @@
     checkedMap.value = lastCheckMap;
     triggerChange();
   };
-
 </script>
 
 <style lang="less">
diff --git a/dbm-ui/frontend/src/components/instance-selector/components/mysql/table/Index.vue b/dbm-ui/frontend/src/components/instance-selector/components/mysql/table/Index.vue
index 942da82ffe..25c4fb1980 100644
--- a/dbm-ui/frontend/src/components/instance-selector/components/mysql/table/Index.vue
+++ b/dbm-ui/frontend/src/components/instance-selector/components/mysql/table/Index.vue
@@ -105,6 +105,8 @@
     ip: data.ip || '',
     port: data.port,
     cluster_type: data.cluster_type,
+    db_module_id: data.db_module_id,
+    db_module_name: data.db_module_name,
   });
 
   const { t } = useI18n();
@@ -340,7 +342,6 @@
     checkedMap.value = lastCheckMap;
     triggerChange();
   };
-
 </script>
 
 <style lang="less">
diff --git a/dbm-ui/frontend/src/components/instance-selector/components/redis-host/table/Index.vue b/dbm-ui/frontend/src/components/instance-selector/components/redis-host/table/Index.vue
index bf9125688c..171b9406ef 100644
--- a/dbm-ui/frontend/src/components/instance-selector/components/redis-host/table/Index.vue
+++ b/dbm-ui/frontend/src/components/instance-selector/components/redis-host/table/Index.vue
@@ -107,7 +107,9 @@
       instance: instanceItem.instance,
       status: instanceItem.status
     })),
-    spec_config: data.spec_config
+    spec_config: data.spec_config,
+    db_module_id: data.db_module_id,
+    db_module_name: data.db_module_name,
   });
 
   const { t } = useI18n();
diff --git a/dbm-ui/frontend/src/components/instance-selector/components/redis/table/Index.vue b/dbm-ui/frontend/src/components/instance-selector/components/redis/table/Index.vue
index 190e46dfd0..9dfdb9aec9 100644
--- a/dbm-ui/frontend/src/components/instance-selector/components/redis/table/Index.vue
+++ b/dbm-ui/frontend/src/components/instance-selector/components/redis/table/Index.vue
@@ -104,6 +104,8 @@
     ip: data.ip || '',
     port: data.port,
     cluster_type: data.cluster_type,
+    db_module_id: data.db_module_id,
+    db_module_name: data.db_module_name,
   });
 
   const { t } = useI18n();
@@ -335,17 +337,16 @@
     checkedMap.value = lastCheckMap;
     triggerChange();
   };
-
 </script>
 
 <style lang="less">
-.instance-selector-render-topo-host {
-  padding: 0 24px;
+  .instance-selector-render-topo-host {
+    padding: 0 24px;
 
-  .bk-table-body {
-    tr {
-      cursor: pointer;
+    .bk-table-body {
+      tr {
+        cursor: pointer;
+      }
     }
   }
-}
 </style>
diff --git a/dbm-ui/frontend/src/components/instance-selector/components/tendb-cluster-host/table/Index.vue b/dbm-ui/frontend/src/components/instance-selector/components/tendb-cluster-host/table/Index.vue
index bd5f8d45dc..d7078e4832 100644
--- a/dbm-ui/frontend/src/components/instance-selector/components/tendb-cluster-host/table/Index.vue
+++ b/dbm-ui/frontend/src/components/instance-selector/components/tendb-cluster-host/table/Index.vue
@@ -101,7 +101,9 @@
       instance: instanceItem.instance,
       status: instanceItem.status
     })),
-    spec_config: data.spec_config
+    spec_config: data.spec_config,
+    db_module_id: data.db_module_id,
+    db_module_name: data.db_module_name,
   });
 
   const { t } = useI18n();
diff --git a/dbm-ui/frontend/src/components/instance-selector/components/tendb-cluster/table/Index.vue b/dbm-ui/frontend/src/components/instance-selector/components/tendb-cluster/table/Index.vue
index 88a505a843..b989be306f 100644
--- a/dbm-ui/frontend/src/components/instance-selector/components/tendb-cluster/table/Index.vue
+++ b/dbm-ui/frontend/src/components/instance-selector/components/tendb-cluster/table/Index.vue
@@ -29,7 +29,7 @@
         :pagination="pagination.count < 10 ? false : pagination"
         :remote-pagination="isRemotePagination"
         :settings="tableSetting"
-        style="margin-top: 12px;"
+        style="margin-top: 12px"
         @clear-search="clearSearchValue"
         @column-filter="columnFilterChange"
         @page-limit-change="handeChangeLimit"
@@ -106,7 +106,9 @@
     cluster_type: data.cluster_type,
     id: data.id,
     master_domain: data.master_domain,
-    bk_cloud_name: data.bk_cloud_name
+    bk_cloud_name: data.bk_cloud_name,
+    db_module_id: data.db_module_id,
+    db_module_name: data.db_module_name,
   });
 
   const { t } = useI18n();
@@ -342,7 +344,6 @@
     checkedMap.value = lastCheckMap;
     triggerChange();
   };
-
 </script>
 
 <style lang="less">
diff --git a/dbm-ui/frontend/src/components/ip-selector/IpSelector.vue b/dbm-ui/frontend/src/components/ip-selector/IpSelector.vue
index 40d1ef5e72..37bad781c4 100644
--- a/dbm-ui/frontend/src/components/ip-selector/IpSelector.vue
+++ b/dbm-ui/frontend/src/components/ip-selector/IpSelector.vue
@@ -186,7 +186,6 @@
 
   const showDialog = defineModel<boolean>('showDialog', {
     default: false,
-    local: true,
   });
 
   const copy = useCopy();
diff --git a/dbm-ui/frontend/src/components/vue2/ip-selector/index.js b/dbm-ui/frontend/src/components/vue2/ip-selector/index.js
index c5b329a17b..3fe9763b79 100644
--- a/dbm-ui/frontend/src/components/vue2/ip-selector/index.js
+++ b/dbm-ui/frontend/src/components/vue2/ip-selector/index.js
@@ -15,6 +15,8 @@ import { h, onBeforeUnmount, onMounted, ref, watch } from 'vue';
 
 import { Component, merge, Vue2 } from '@blueking/ip-selector/dist/vue2.6.x.esm';
 
+Component.props.mode.default = 'section';
+
 export default function (options) {
   merge(options);
 
@@ -25,7 +27,13 @@ export default function (options) {
     setup(props, context) {
       const rootRef = ref();
 
-      let app = new Vue2(Component);
+      let app = new Vue2({
+        render: (h) =>
+          h(Component, {
+            ref: 'componentRef',
+            props,
+          }),
+      });
 
       const syncProps = () => {
         Object.keys(props).forEach((propName) => {
@@ -39,13 +47,13 @@ export default function (options) {
               {},
             );
             // eslint-disable-next-line no-underscore-dangle
-            app._props[propName] = Object.freeze(v);
+            app.$refs.componentRef._props[propName] = Object.freeze(v);
           } else if (Object.prototype.toString.call(newValue) === '[object Array]') {
             // eslint-disable-next-line no-underscore-dangle
-            app._props[propName] = [...newValue];
+            app.$refs.componentRef._props[propName] = [...newValue];
           } else {
             // eslint-disable-next-line no-underscore-dangle
-            app._props[propName] = newValue;
+            app.$refs.componentRef._props[propName] = newValue;
           }
         });
       };
@@ -57,22 +65,17 @@ export default function (options) {
           () => {
             syncProps();
           },
-          {
-            immediate: true,
-          },
         );
         propWatchStack.push(unwatch);
       });
 
-      Component.emits.forEach((eventName) => {
-        app.$on(eventName, (...agrs) => {
-          context.emit(eventName, ...agrs);
-        });
-      });
-      syncProps();
-
       onMounted(() => {
         app.$mount();
+        Component.emits.forEach((eventName) => {
+          app.$refs.componentRef.$on(eventName, (...agrs) => {
+            context.emit(eventName, ...agrs);
+          });
+        });
         rootRef.value.appendChild(app.$el);
       });
 
diff --git a/dbm-ui/frontend/src/services/model/mysql/tendbha-instance.ts b/dbm-ui/frontend/src/services/model/mysql/tendbha-instance.ts
index 8b778e6413..2f0f864631 100644
--- a/dbm-ui/frontend/src/services/model/mysql/tendbha-instance.ts
+++ b/dbm-ui/frontend/src/services/model/mysql/tendbha-instance.ts
@@ -22,6 +22,7 @@ export default class tendbhaInstance {
   cluster_type: string;
   create_at: string;
   db_module_id: number;
+  db_module_name: string;
   host_info: {
     alive: number;
     biz: {
@@ -94,6 +95,7 @@ export default class tendbhaInstance {
     this.cluster_type = payload.cluster_type || '';
     this.create_at = payload.create_at || '';
     this.db_module_id = payload.db_module_id || 0;
+    this.db_module_name = payload.db_module_name || '';
     this.host_info = payload.host_info || {};
     this.id = payload.id || 0;
     this.instance_address = payload.instance_address || '';
diff --git a/dbm-ui/frontend/src/services/model/redis/redis.ts b/dbm-ui/frontend/src/services/model/redis/redis.ts
index f35fe25e22..1b88f76062 100644
--- a/dbm-ui/frontend/src/services/model/redis/redis.ts
+++ b/dbm-ui/frontend/src/services/model/redis/redis.ts
@@ -144,15 +144,18 @@ export default class Redis {
     title: string;
   }[];
   permission: {
+    access_entry_edit: boolean;
     redis_access_entry_view: boolean;
     redis_backup: boolean;
     redis_destroy: boolean;
     redis_keys_delete: boolean;
     redis_keys_extract: boolean;
     redis_open_close: boolean;
+    redis_plugin_create_clb: boolean;
+    redis_plugin_create_polaris: boolean;
+    redis_plugin_dns_bind_clb: boolean;
     redis_purge: boolean;
     redis_view: boolean;
-    access_entry_edit: boolean;
   };
   phase: string;
   proxy: Node[];
diff --git a/dbm-ui/frontend/src/services/source/dbbase.ts b/dbm-ui/frontend/src/services/source/dbbase.ts
index 8d58f90311..bc2cf1af10 100644
--- a/dbm-ui/frontend/src/services/source/dbbase.ts
+++ b/dbm-ui/frontend/src/services/source/dbbase.ts
@@ -11,9 +11,6 @@
  * the specific language governing permissions and limitations under the License.
  */
 
-import SqlServerHaClusterModel from '@services/model/sqlserver/sqlserver-ha-cluster';
-import SqlServerSingleClusterModel from '@services/model/sqlserver/sqlserver-single-cluster';
-
 import { ClusterTypes } from '@common/const';
 
 import http from '../http';
@@ -31,13 +28,35 @@ export function verifyDuplicatedClusterName(params: { cluster_type: string; name
  * 根据过滤条件查询集群详细信息
  */
 export function filterClusters(params: { bk_biz_id: number; exact_domain: string }) {
-  return http.get<any[]>(`${path}/filter_clusters/`, params).then((data: { cluster_type: string }[]) => {
-    const ModelMap: Record<string, any> = {
-      [ClusterTypes.SQLSERVER_SINGLE]: SqlServerSingleClusterModel,
-      [ClusterTypes.SQLSERVER_HA]: SqlServerHaClusterModel,
-    };
-    return data.map((item) => new ModelMap[data[0].cluster_type](item));
-  });
+  return http.get<
+    {
+      bk_biz_id: number;
+      bk_biz_name: string;
+      bk_cloud_id: number;
+      bk_cloud_name: string;
+      cluster_capacity: number;
+      cluster_shard_num: number;
+      cluster_spec: {
+        cpu: {
+          max: number;
+          min: number;
+        };
+        mem: {
+          max: number;
+          min: number;
+        };
+        qps: {
+          max: number;
+          min: number;
+        };
+        spec_name: string;
+      };
+      db_module_id: number;
+      id: number;
+      machine_pair_cnt: number;
+      master_domain: string;
+    }[]
+  >(`${path}/filter_clusters/`, params);
 }
 
 /*
diff --git a/dbm-ui/frontend/src/services/source/mysqlCluster.ts b/dbm-ui/frontend/src/services/source/mysqlCluster.ts
index cf82020b39..ec819af0d1 100644
--- a/dbm-ui/frontend/src/services/source/mysqlCluster.ts
+++ b/dbm-ui/frontend/src/services/source/mysqlCluster.ts
@@ -160,6 +160,8 @@ export function queryClusters(params: {
 /**
  * 通过集群域名获取集群详情
  */
-export function getClusterInfoByDomains(params: Record<'cluster_filters', Array<{ immute_domain: string }>> & { bizId: number }) {
+export function getClusterInfoByDomains(
+  params: Record<'cluster_filters', Array<{ immute_domain: string }>> & { bizId: number },
+) {
   return http.post<TendbhaModel[]>(`${path}/query_clusters/`, params);
 }
diff --git a/dbm-ui/frontend/src/services/types/clusters.ts b/dbm-ui/frontend/src/services/types/clusters.ts
index 567a3eeef7..99bf1ef074 100644
--- a/dbm-ui/frontend/src/services/types/clusters.ts
+++ b/dbm-ui/frontend/src/services/types/clusters.ts
@@ -322,6 +322,8 @@ export interface InstanceInfos {
   cluster_type: string;
   cluster_domain: string;
   create_at: string;
+  db_module_id: number;
+  db_module_name: string;
   host_info: HostDetails;
   instance_address: string;
   ip: string;
diff --git a/dbm-ui/frontend/src/services/types/resourceInstance.ts b/dbm-ui/frontend/src/services/types/resourceInstance.ts
index 22147784cb..789d6430b7 100644
--- a/dbm-ui/frontend/src/services/types/resourceInstance.ts
+++ b/dbm-ui/frontend/src/services/types/resourceInstance.ts
@@ -25,6 +25,7 @@ export interface ResourceInstance {
   cluster_type: string;
   create_at: string;
   db_module_id: number;
+  db_module_name: string;
   host_info: HostDetails;
   id: number;
   instance_address: string;
diff --git a/dbm-ui/frontend/src/views/redis/list/components/list/Index.vue b/dbm-ui/frontend/src/views/redis/list/components/list/Index.vue
index eedf643214..f5345352dd 100644
--- a/dbm-ui/frontend/src/views/redis/list/components/list/Index.vue
+++ b/dbm-ui/frontend/src/views/redis/list/components/list/Index.vue
@@ -45,7 +45,7 @@
             <BkDropdownMenu>
               <BkDropdownItem
                 v-db-console="'redis.clusterManage.extractKey'"
-                @click="handleShowExtract(state.selected)" >
+                @click="handleShowExtract(state.selected)">
                 {{ t('提取Key') }}
               </BkDropdownItem>
               <BkDropdownItem
@@ -791,7 +791,7 @@
         ]
         const isShowDropdown = dropdownDbConsoleValueList.every(value => !funControllerData[value as ExtractedControllerDataKeys]) ||
           dropdownDbConsoleValueList.some(value => funControllerData[value as ExtractedControllerDataKeys].is_enabled)
-        
+
         return (
             <div class="operations">
               {getOperations()}
@@ -824,39 +824,48 @@
                           <OperationBtnStatusTips
                             data={data}
                             disabled={!data.isOffline}>
-                            <bk-button
+                            <auth-button
+                              action-id="redis_plugin_create_clb"
+                              permission={data.permission.redis_plugin_create_clb}
+                              resource={data.id}
                               style="width: 100%;height: 32px;"
                               disabled={data.isOffline}
                               text
                               onClick={() => handleSwitchCLB(data)}>
                               { data.isOnlineCLB ? t('禁用CLB') : t('启用CLB') }
-                            </bk-button>
+                            </auth-button>
                           </OperationBtnStatusTips>
                         </bk-dropdown-item>
                         <bk-dropdown-item v-db-console="redis.clusterManage.DNSDomainToCLB">
                           <OperationBtnStatusTips
                             data={data}
                             disabled={!data.isOffline}>
-                            <bk-button
+                            <auth-button
+                              action-id="redis_plugin_dns_bind_clb"
+                              permission={data.permission.redis_plugin_dns_bind_clb}
+                              resource={data.id}
                               style="width: 100%;height: 32px;"
                               disabled={data.isOffline}
                               text
                               onClick={() => handleSwitchDNSBindCLB(data)}>
                               { data.dns_to_clb ? t('恢复DNS域名指向') : t('DNS域名指向CLB') }
-                            </bk-button>
+                            </auth-button>
                           </OperationBtnStatusTips>
                         </bk-dropdown-item>
                         <bk-dropdown-item v-db-console="redis.clusterManage.enablePolaris">
                           <OperationBtnStatusTips
                             data={data}
                             disabled={!data.isOffline}>
-                            <bk-button
+                            <auth-button
+                              action-id="redis_plugin_create_polaris"
+                              permission={data.permission.redis_plugin_create_polaris}
+                              resource={data.id}
                               style="width: 100%;height: 32px;"
                               disabled={data.isOffline}
                               text
                               onClick={() => handleSwitchPolaris(data)}>
                               { data.isOnlinePolaris ? t('禁用北极星') : t('启用北极星') }
-                            </bk-button>
+                            </auth-button>
                           </OperationBtnStatusTips>
                         </bk-dropdown-item>
                       </fun-controller>
diff --git a/dbm-ui/frontend/src/views/spider-manage/add-mnt/pages/page1/Index.vue b/dbm-ui/frontend/src/views/spider-manage/add-mnt/pages/page1/Index.vue
index fc592ddb6c..8e6e31834e 100644
--- a/dbm-ui/frontend/src/views/spider-manage/add-mnt/pages/page1/Index.vue
+++ b/dbm-ui/frontend/src/views/spider-manage/add-mnt/pages/page1/Index.vue
@@ -62,7 +62,7 @@
   import { useI18n } from 'vue-i18n';
   import { useRouter } from 'vue-router';
 
-  import SpiderModel from '@services/model/spider/spider';
+  import TendbClusterModel from '@services/model/spider/tendbCluster';
   import { createTicket } from '@services/source/ticket';
 
   import { useGlobalBizs } from '@stores';
@@ -82,7 +82,7 @@
   const isShowBatchSelector = ref(false);
   const isSubmitting = ref(false);
 
-  const selectedClusters = shallowRef<{ [key: string]: Array<SpiderModel> }>({ [ClusterTypes.TENDBCLUSTER]: [] });
+  const selectedClusters = shallowRef<{ [key: string]: Array<TendbClusterModel> }>({ [ClusterTypes.TENDBCLUSTER]: [] });
   const tableData = shallowRef<Array<IDataRow>>([createRowData({})]);
 
   // 集群域名是否已存在表格的映射表
@@ -103,7 +103,7 @@
   };
 
   // 批量选择
-  const handelClusterChange = (selected: { [key: string]: Array<SpiderModel> }) => {
+  const handelClusterChange = (selected: { [key: string]: Array<TendbClusterModel> }) => {
     selectedClusters.value = selected;
     const list = selected[ClusterTypes.TENDBCLUSTER];
     const newList = list.reduce((result, item) => {
@@ -113,6 +113,8 @@
           clusterData: {
             id: item.id,
             domain: item.master_domain,
+            bkCloudId: item.bk_cloud_id,
+            bkCloudName: item.bk_cloud_name,
           },
         });
         result.push(row);
diff --git a/dbm-ui/frontend/src/views/spider-manage/add-mnt/pages/page1/components/RenderData/RenderCluster.vue b/dbm-ui/frontend/src/views/spider-manage/add-mnt/pages/page1/components/RenderData/RenderCluster.vue
index 7b5a00406f..d434bfb874 100644
--- a/dbm-ui/frontend/src/views/spider-manage/add-mnt/pages/page1/components/RenderData/RenderCluster.vue
+++ b/dbm-ui/frontend/src/views/spider-manage/add-mnt/pages/page1/components/RenderData/RenderCluster.vue
@@ -14,11 +14,9 @@
 <template>
   <TableEditInput
     ref="editRef"
-    v-model="localDomain"
-    multi-input
-    :placeholder="t('请输入集群_使用换行分割一次可输入多个')"
-    :rules="rules"
-    @multi-input="handleMultiInput" />
+    :model-value="modelValue?.domain"
+    :placeholder="t('请输入集群')"
+    :rules="rules" />
 </template>
 <script lang="ts">
   const clusterIdMemo: { [key: string]: Record<string, boolean> } = {};
@@ -31,7 +29,7 @@
   } from 'vue';
   import { useI18n } from 'vue-i18n';
 
-  import { queryClusters } from '@services/source/mysqlCluster';
+  import {filterClusters} from '@services/source/dbbase'
 
   import { useGlobalBizs } from '@stores';
 
@@ -41,21 +39,11 @@
 
   import type { IDataRow } from './Row.vue';
 
-  interface Props {
-    modelValue?: IDataRow['clusterData'],
-  }
-
-  interface Emits {
-    (e: 'inputCreate', value: Array<string>): void,
-    (e: 'idChange', value: number): void,
-  }
-
   interface Exposes {
     getValue: () => Array<number>
   }
 
-  const props = defineProps<Props>();
-  const emits = defineEmits<Emits>();
+  const modelValue = defineModel<IDataRow['clusterData']>()
 
   const instanceKey = `render_cluster_${random()}`;
   clusterIdMemo[instanceKey] = {};
@@ -65,32 +53,30 @@
 
   const editRef = ref();
 
-  const localClusterId = ref(0);
-  const localDomain = ref('');
-  const isShowEdit = ref(true);
-
   const rules = [
     {
       validator: (value: string) => {
         if (value) {
           return true;
         }
-        emits('idChange', 0);
+        modelValue.value = undefined
         return false;
       },
       message: t('目标集群不能为空'),
     },
     {
-      validator: (value: string) => queryClusters({
-        cluster_filters: [
-          {
-            immute_domain: value,
-          },
-        ],
+      validator: (value: string) => filterClusters({
+        exact_domain: value,
         bk_biz_id: currentBizId,
       }).then((data) => {
         if (data.length > 0) {
-          localClusterId.value = data[0].id;
+          const [clusterData] = data;
+          modelValue.value = {
+            id: clusterData.id,
+            domain: clusterData.master_domain,
+            bkCloudId: clusterData.bk_cloud_id,
+            bkCloudName: clusterData.bk_cloud_name,
+          }
           return true;
         }
         return false;
@@ -114,7 +100,6 @@
             return false;
           }
         }
-        emits('idChange', localClusterId.value);
         return true;
       },
       message: t('目标集群重复'),
@@ -122,32 +107,14 @@
   ];
 
   // 同步外部值
-  watch(() => props.modelValue, () => {
-    if (props.modelValue) {
-      localClusterId.value = props.modelValue.id;
-      localDomain.value = props.modelValue.domain;
-      isShowEdit.value = false;
-    } else {
-      isShowEdit.value = true;
+  watch(modelValue, () => {
+    if (modelValue.value) {
+      clusterIdMemo[instanceKey][modelValue.value.id] = true;
     }
   }, {
     immediate: true,
   });
 
-  // 获取关联集群
-  watch(localClusterId, () => {
-    if (!localClusterId.value) {
-      return;
-    }
-    clusterIdMemo[instanceKey][localClusterId.value] = true;
-  }, {
-    immediate: true,
-  });
-
-  const handleMultiInput = (list: Array<string>) => {
-    emits('inputCreate', list);
-  };
-
 
   onBeforeUnmount(() => {
     delete clusterIdMemo[instanceKey];
@@ -158,7 +125,7 @@
       return editRef.value
         .getValue()
         .then(() => ({
-          cluster_id: localClusterId.value,
+          cluster_id: modelValue.value!.id,
         }));
     },
   });
diff --git a/dbm-ui/frontend/src/views/spider-manage/add-mnt/pages/page1/components/RenderData/RenderHost.vue b/dbm-ui/frontend/src/views/spider-manage/add-mnt/pages/page1/components/RenderData/RenderHost.vue
index 6de1df9536..18cd532116 100644
--- a/dbm-ui/frontend/src/views/spider-manage/add-mnt/pages/page1/components/RenderData/RenderHost.vue
+++ b/dbm-ui/frontend/src/views/spider-manage/add-mnt/pages/page1/components/RenderData/RenderHost.vue
@@ -71,7 +71,7 @@
   <IpSelector
     v-if="clusterData"
     v-model:show-dialog="isShowIpSelector"
-    :biz-id="clusterData.bk_biz_id"
+    :biz-id="bizId"
     button-text=""
     :cloud-info="{
       id: clusterData.bk_cloud_id,
@@ -85,7 +85,7 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import type SpiderModel from '@services/model/spider/spider';
+  import TendbClusterModel from '@services/model/spider/tendbCluster';
   import type { HostDetails } from '@services/types';
 
   import IpSelector from '@components/ip-selector/IpSelector.vue';
@@ -93,7 +93,7 @@
   import useValidtor from './useValidtor';
 
   interface Props {
-    clusterData?: SpiderModel;
+    clusterData?: TendbClusterModel;
   }
 
   interface Exposes {
@@ -109,6 +109,9 @@
   defineProps<Props>();
 
   const { t } = useI18n();
+
+  const bizId = window.PROJECT_CONFIG.BIZ_ID;
+
   const contentRef = ref();
   const isShowIpSelector = ref(false);
   const showEditIcon = ref(false);
diff --git a/dbm-ui/frontend/src/views/spider-manage/add-mnt/pages/page1/components/RenderData/RenderNet.vue b/dbm-ui/frontend/src/views/spider-manage/add-mnt/pages/page1/components/RenderData/RenderNet.vue
index 5e83806967..4252fd666e 100644
--- a/dbm-ui/frontend/src/views/spider-manage/add-mnt/pages/page1/components/RenderData/RenderNet.vue
+++ b/dbm-ui/frontend/src/views/spider-manage/add-mnt/pages/page1/components/RenderData/RenderNet.vue
@@ -14,29 +14,20 @@
 <template>
   <RenderText
     ref="editRef"
-    :data="localValue"
-    :is-loading="isLoading || isClusterDataLoading"
+    :data="clusterData?.bkCloudName"
     :placeholder="t('请先输入集群')"
     :rules="rules" />
 </template>
 <script setup lang="ts">
-  import _ from 'lodash';
-  import { computed, ref, shallowRef, watch } from 'vue';
+  import { ref } from 'vue';
   import { useI18n } from 'vue-i18n';
-  import { useRequest } from 'vue-request';
-
-  import type SpiderModel from '@services/model/spider/spider';
-  import { getCloudList } from '@services/source/ipchooser';
-  import { getSpiderDetail } from '@services/source/spider';
 
   import RenderText from '@components/render-table/columns/text-plain/index.vue';
 
-  interface Props {
-    clusterId: number;
-  }
+  import type { IDataRow } from './Row.vue';
 
-  interface Emits {
-    (e: 'clusterChange', value: SpiderModel): void;
+  interface Props {
+    clusterData: IDataRow['clusterData'];
   }
 
   interface Exposes {
@@ -44,62 +35,22 @@
   }
 
   const props = defineProps<Props>();
-  const emits = defineEmits<Emits>();
 
   const { t } = useI18n();
 
   const editRef = ref();
-  const bkNetList = shallowRef<{ bk_cloud_id: number; bk_cloud_name: string }[]>([]);
-  const localBkNetId = ref<number>();
-
-  const localValue = computed(() => {
-    const target = _.find(bkNetList.value, (item) => item.bk_cloud_id === localBkNetId.value);
-    if (target) {
-      return target.bk_cloud_name;
-    }
-    return '';
-  });
 
   const rules = [
     {
-      validator: () => Number(localBkNetId.value) > -1,
+      validator: (value: string) => Boolean(value),
       message: t('管控区域不能为空'),
     },
   ];
 
-  const { loading: isLoading } = useRequest(getCloudList, {
-    initialData: [],
-    onSuccess(data) {
-      bkNetList.value = data;
-    },
-  });
-
-  const { loading: isClusterDataLoading, run: fetchClusetrData } = useRequest(getSpiderDetail, {
-    manual: true,
-    onSuccess(data) {
-      localBkNetId.value = data.bk_cloud_id;
-      emits('clusterChange', data);
-    },
-  });
-
-  watch(
-    () => props.clusterId,
-    () => {
-      if (props.clusterId) {
-        fetchClusetrData({
-          id: props.clusterId,
-        });
-      }
-    },
-    {
-      immediate: true,
-    },
-  );
-
   defineExpose<Exposes>({
     getValue() {
       return editRef.value.getValue().then(() => ({
-        bk_cloud_id: localBkNetId.value,
+        bk_cloud_id: props.clusterData!.bkCloudId,
       }));
     },
   });
diff --git a/dbm-ui/frontend/src/views/spider-manage/add-mnt/pages/page1/components/RenderData/Row.vue b/dbm-ui/frontend/src/views/spider-manage/add-mnt/pages/page1/components/RenderData/Row.vue
index 4a1d56471f..db4513158c 100644
--- a/dbm-ui/frontend/src/views/spider-manage/add-mnt/pages/page1/components/RenderData/Row.vue
+++ b/dbm-ui/frontend/src/views/spider-manage/add-mnt/pages/page1/components/RenderData/Row.vue
@@ -17,15 +17,13 @@
       <td style="padding: 0">
         <RenderCluster
           ref="clusterRef"
-          :model-value="data.clusterData"
-          @id-change="handleClusterIdChange"
-          @input-create="handleCreate" />
+          v-model="localClusterData"
+          @id-change="handleClusterIdChange" />
       </td>
       <td style="padding: 0">
         <RenderNet
           ref="netRef"
-          :cluster-id="localClusterId"
-          @cluster-change="handleClusterDataChange" />
+          :cluster-data="localClusterData" />
       </td>
       <td style="padding: 0">
         <RenderHost
@@ -56,6 +54,8 @@
     clusterData?: {
       id: number;
       domain: string;
+      bkCloudId: number;
+      bkCloudName: string;
     };
     bkCloudId?: number;
     spiderIpList?: {
@@ -74,8 +74,6 @@
   });
 </script>
 <script setup lang="ts">
-  import type SpiderModel from '@services/model/spider/spider';
-
   import RenderCluster from './RenderCluster.vue';
   import RenderHost from './RenderHost.vue';
   import RenderNet from './RenderNet.vue';
@@ -103,14 +101,12 @@
   const proxyRef = ref();
 
   const localClusterId = ref(0);
-  const localClusterData = ref<SpiderModel>();
+  const localClusterData = ref<IDataRow['clusterData']>();
 
   watch(
     () => props.data,
     () => {
-      if (props.data.clusterData) {
-        localClusterId.value = props.data.clusterData.id;
-      }
+      localClusterData.value = props.data.clusterData;
     },
     {
       immediate: true,
@@ -119,22 +115,6 @@
   const handleClusterIdChange = (id: number) => {
     localClusterId.value = id;
   };
-  const handleClusterDataChange = (data: SpiderModel) => {
-    localClusterData.value = data;
-  };
-  const handleCreate = (list: Array<string>) => {
-    emits(
-      'add',
-      list.map((domain) =>
-        createRowData({
-          clusterData: {
-            id: 0,
-            domain,
-          },
-        }),
-      ),
-    );
-  };
 
   const handleAppend = () => {
     emits('add', [createRowData()]);
diff --git a/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/Index.vue b/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/Index.vue
index 52a2cff551..a4b72c0e4e 100644
--- a/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/Index.vue
+++ b/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/Index.vue
@@ -155,8 +155,14 @@
       if (!domainMemo[domain]) {
         const row = createRowData({
           clusterData: {
+            bkCloudId: item.bk_cloud_id,
+            clusterCapacity: item.cluster_capacity,
+            clusterShardNum: item.cluster_shard_num,
+            clusterSpec: item.cluster_spec,
+            dbModuleId: item.db_module_id,
             id: item.id,
-            domain: item.master_domain,
+            machinePairCnt: item.machine_pair_cnt,
+            masterDomain: item.master_domain,
           },
         });
         result.push(row);
@@ -181,13 +187,15 @@
   // 删除一个集群
   const handleRemove = (index: number) => {
     const dataList = [...tableData.value];
-    const domain = dataList[index].clusterData?.domain;
+    const masterDomain = dataList[index].clusterData?.masterDomain;
     dataList.splice(index, 1);
     tableData.value = dataList;
-    if (domain) {
-      delete domainMemo[domain];
+    if (masterDomain) {
+      delete domainMemo[masterDomain];
       const clustersArr = selectedClusters.value[ClusterTypes.TENDBCLUSTER];
-      selectedClusters.value[ClusterTypes.TENDBCLUSTER] = clustersArr.filter((item) => item.master_domain !== domain);
+      selectedClusters.value[ClusterTypes.TENDBCLUSTER] = clustersArr.filter(
+        (item) => item.master_domain !== masterDomain,
+      );
     }
   };
 
diff --git a/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/components/RenderData/RenderCapacity.vue b/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/components/RenderData/RenderCapacity.vue
index c59f81337b..9b36ff6588 100644
--- a/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/components/RenderData/RenderCapacity.vue
+++ b/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/components/RenderData/RenderCapacity.vue
@@ -14,32 +14,36 @@
 <template>
   <TableEditInput
     ref="inputRef"
-    :model-value="clusterData ? `${clusterData.cluster_capacity} G` : ''"
+    :model-value="clusterData ? `${clusterData.clusterCapacity} G` : ''"
     :placeholder="t('输入集群后自动生成')"
     readonly
     textarea />
 </template>
 <script setup lang="ts">
+  import { ref } from 'vue';
   import { useI18n } from 'vue-i18n';
 
-  import type SpiderModel from '@services/model/spider/spider';
-
   import TableEditInput from '@views/spider-manage/common/edit/Input.vue';
 
+  import type { IDataRow } from './Row.vue';
+
   interface Props {
-    clusterData?: SpiderModel;
+    clusterData: IDataRow['clusterData'];
   }
+
   interface Exposes {
-    getValue: () => Promise<any>;
+    getValue: () => Promise<string>;
   }
 
   defineProps<Props>();
 
   const { t } = useI18n();
 
+  const inputRef = ref<InstanceType<typeof TableEditInput>>();
+
   defineExpose<Exposes>({
     getValue() {
-      return Promise.resolve({});
+      return inputRef.value!.getValue();
     },
   });
 </script>
diff --git a/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/components/RenderData/RenderCluster.vue b/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/components/RenderData/RenderCluster.vue
index 2f8d039390..01fddc51d0 100644
--- a/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/components/RenderData/RenderCluster.vue
+++ b/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/components/RenderData/RenderCluster.vue
@@ -15,7 +15,7 @@
   <div class="render-cluster-box">
     <TableEditInput
       ref="editRef"
-      v-model="localDomain"
+      :model-value="modelValue?.masterDomain"
       :placeholder="t('请输入或选择集群')"
       :rules="rules" />
   </div>
@@ -31,7 +31,7 @@
   } from 'vue';
   import { useI18n } from 'vue-i18n';
 
-  import { queryClusters } from '@services/source/mysqlCluster';
+  import { filterClusters } from '@services/source/dbbase'
 
   import { useGlobalBizs } from '@stores';
 
@@ -41,22 +41,15 @@
 
   import type { IDataRow } from './Row.vue';
 
-  interface Props {
-    modelValue?: IDataRow['clusterData'],
-  }
-
-  interface Emits {
-    (e: 'inputCreate', value: Array<string>): void,
-    (e: 'idChange', value: number): void,
-  }
-
   interface Exposes {
-    getValue: () => Array<number>
+    getValue: () => Promise<{
+      cluster_id: number;
+      bk_cloud_id: number;
+      cluster_shard_num: number;
+      db_module_id: number;
+    }>
   }
 
-  const props = defineProps<Props>();
-  const emits = defineEmits<Emits>();
-
   const { t } = useI18n();
 
   const instanceKey = `render_cluster_${random()}`;
@@ -64,36 +57,35 @@
 
   const { currentBizId } = useGlobalBizs();
 
-  const editRef = ref();
+  const modelValue = defineModel<IDataRow['clusterData']>()
 
-  const localClusterId = ref(0);
-  const localDomain = ref('');
-  const isShowEdit = ref(true);
+  const editRef = ref<InstanceType<typeof TableEditInput>>();
 
   const rules = [
     {
-      validator: (value: string) => {
-        if (value) {
-          return true;
-        }
-        emits('idChange', 0);
-        return false;
-      },
+      validator: (value: string) => Boolean(value),
       message: t('目标集群不能为空'),
     },
     {
-      validator: (value: string) => queryClusters({
-        cluster_filters: [
-          {
-            immute_domain: value,
-          },
-        ],
+      validator: (value: string) => filterClusters({
+        exact_domain: value,
         bk_biz_id: currentBizId,
       }).then((data) => {
         if (data.length > 0) {
-          localClusterId.value = data[0].id;
+          const [clusterData] = data;
+          modelValue.value = {
+            bkCloudId: clusterData.bk_cloud_id,
+            clusterCapacity: clusterData.cluster_capacity,
+            clusterShardNum: clusterData.cluster_shard_num,
+            clusterSpec: clusterData.cluster_spec,
+            dbModuleId: clusterData.db_module_id,
+            id: clusterData.id,
+            machinePairCnt: clusterData.machine_pair_cnt,
+            masterDomain: clusterData.master_domain,
+          }
           return true;
         }
+        modelValue.value = undefined
         return false;
       }),
       message: t('目标集群不存在'),
@@ -115,7 +107,6 @@
             return false;
           }
         }
-        emits('idChange', localClusterId.value);
         return true;
       },
       message: t('目标集群重复'),
@@ -123,39 +114,28 @@
   ];
 
   // 同步外部值
-  watch(() => props.modelValue, () => {
-    if (props.modelValue) {
-      localClusterId.value = props.modelValue.id;
-      localDomain.value = props.modelValue.domain;
-      isShowEdit.value = false;
+  watch(() => modelValue, () => {
+    if (modelValue.value) {
+      clusterIdMemo[instanceKey][modelValue.value.id] = true;
     } else {
-      isShowEdit.value = true;
-    }
-  }, {
-    immediate: true,
-  });
-
-  // 获取关联集群
-  watch(localClusterId, () => {
-    if (!localClusterId.value) {
-      return;
+      delete clusterIdMemo[instanceKey];
     }
-    clusterIdMemo[instanceKey][localClusterId.value] = true;
   }, {
     immediate: true,
   });
 
-
   onBeforeUnmount(() => {
     delete clusterIdMemo[instanceKey];
   });
 
   defineExpose<Exposes>({
     getValue() {
-      return editRef.value
-        .getValue()
+      return editRef.value!.getValue()
         .then(() => ({
-          cluster_id: localClusterId.value,
+          cluster_id: modelValue.value!.id,
+          bk_cloud_id: modelValue.value!.bkCloudId,
+          cluster_shard_num: modelValue.value!.clusterShardNum,
+          db_module_id: modelValue.value!.dbModuleId,
         }));
     },
   });
diff --git a/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/components/RenderData/RenderMachinePairCnt.vue b/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/components/RenderData/RenderMachinePairCnt.vue
index 463ab75d12..5e339eb208 100644
--- a/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/components/RenderData/RenderMachinePairCnt.vue
+++ b/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/components/RenderData/RenderMachinePairCnt.vue
@@ -14,32 +14,36 @@
 <template>
   <TableEditInput
     ref="inputRef"
-    :model-value="`${clusterData ? clusterData.machine_pair_cnt : ''}`"
+    :model-value="`${clusterData ? clusterData.machinePairCnt : ''}`"
     :placeholder="t('输入集群后自动生成')"
     readonly
     textarea />
 </template>
 <script setup lang="ts">
+  import { ref } from 'vue';
   import { useI18n } from 'vue-i18n';
 
-  import type SpiderModel from '@services/model/spider/spider';
-
   import TableEditInput from '@views/spider-manage/common/edit/Input.vue';
 
+  import type { IDataRow } from './Row.vue';
+
   interface Props {
-    clusterData?: SpiderModel;
+    clusterData: IDataRow['clusterData'];
   }
+
   interface Exposes {
-    getValue: () => Promise<any>;
+    getValue: () => Promise<string>;
   }
 
   defineProps<Props>();
 
   const { t } = useI18n();
 
+  const inputRef = ref<InstanceType<typeof TableEditInput>>();
+
   defineExpose<Exposes>({
     getValue() {
-      return Promise.resolve({});
+      return inputRef.value!.getValue();
     },
   });
 </script>
diff --git a/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/components/RenderData/RenderResourceSpec.vue b/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/components/RenderData/RenderResourceSpec.vue
index 71252ef314..44e5033b1e 100644
--- a/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/components/RenderData/RenderResourceSpec.vue
+++ b/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/components/RenderData/RenderResourceSpec.vue
@@ -12,82 +12,37 @@
 -->
 
 <template>
-  <BkLoading :loading="isLoading">
-    <TableEditInput
-      ref="inputRef"
-      :model-value="`${localClusterData ? localClusterData.cluster_spec.spec_name : ''}`"
-      :placeholder="$t('输入集群后自动生成')"
-      readonly
-      textarea />
-  </BkLoading>
+  <TableEditInput
+    ref="inputRef"
+    :model-value="`${clusterData ? clusterData.clusterShardNum : ''}`"
+    :placeholder="t('输入集群后自动生成')"
+    readonly
+    textarea />
 </template>
 <script setup lang="ts">
-  import { useRequest } from 'vue-request';
-
-  import type SpiderModel from '@services/model/spider/spider';
-  import { getSpiderDetail } from '@services/source/spider';
+  import { useI18n } from 'vue-i18n';
 
   import TableEditInput from '@views/spider-manage/common/edit/Input.vue';
 
+  import type { IDataRow } from './Row.vue';
+
   interface Props {
-    clusterId: number;
-  }
-  interface Emits {
-    (e: 'cluster-change', value: SpiderModel): void;
+    clusterData: IDataRow['clusterData'];
   }
+
   interface Exposes {
-    getValue: () => Promise<{
-      bk_cloud_id: number;
-      cluster_shard_num: number;
-      db_module_id: number;
-    }>;
+    getValue: () => Promise<string>;
   }
 
-  const props = defineProps<Props>();
-  const emits = defineEmits<Emits>();
+  defineProps<Props>();
 
-  const inputRef = ref();
-  const masterInstance = ref('');
-  const localClusterData = ref<SpiderModel>();
+  const { t } = useI18n();
 
-  const { loading: isLoading, run: fetchClusetrData } = useRequest(getSpiderDetail, {
-    manual: true,
-    onSuccess(data) {
-      [masterInstance.value] = data.spider_master[0].instance;
-      localClusterData.value = data;
-      emits('cluster-change', data);
-    },
-  });
-
-  watch(
-    () => props.clusterId,
-    () => {
-      if (props.clusterId) {
-        fetchClusetrData({
-          id: props.clusterId,
-        });
-      } else {
-        localClusterData.value = undefined;
-      }
-    },
-    {
-      immediate: true,
-    },
-  );
+  const inputRef = ref<InstanceType<typeof TableEditInput>>();
 
   defineExpose<Exposes>({
     getValue() {
-      return inputRef.value.getValue().then(() => {
-        if (!localClusterData.value) {
-          return Promise.reject();
-        }
-        const clusterData = localClusterData.value;
-        return {
-          bk_cloud_id: clusterData.bk_cloud_id,
-          cluster_shard_num: clusterData.cluster_shard_num,
-          db_module_id: clusterData.db_module_id,
-        };
-      });
+      return inputRef.value!.getValue();
     },
   });
 </script>
diff --git a/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/components/RenderData/RenderShardNum.vue b/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/components/RenderData/RenderShardNum.vue
index cd2bf3712d..e405acd6b3 100644
--- a/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/components/RenderData/RenderShardNum.vue
+++ b/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/components/RenderData/RenderShardNum.vue
@@ -14,32 +14,36 @@
 <template>
   <TableEditInput
     ref="inputRef"
-    :model-value="`${clusterData ? clusterData.cluster_shard_num : ''}`"
+    :model-value="`${clusterData ? clusterData.clusterShardNum : ''}`"
     :placeholder="t('输入集群后自动生成')"
     readonly
     textarea />
 </template>
 <script setup lang="ts">
+  import { ref } from 'vue';
   import { useI18n } from 'vue-i18n';
 
-  import type SpiderModel from '@services/model/spider/spider';
-
   import TableEditInput from '@views/spider-manage/common/edit/Input.vue';
 
+  import type { IDataRow } from './Row.vue';
+
   interface Props {
-    clusterData?: SpiderModel;
+    clusterData: IDataRow['clusterData'];
   }
+
   interface Exposes {
-    getValue: () => Promise<any>;
+    getValue: () => Promise<string>;
   }
 
   defineProps<Props>();
 
   const { t } = useI18n();
 
+  const inputRef = ref<InstanceType<typeof TableEditInput>>();
+
   defineExpose<Exposes>({
     getValue() {
-      return Promise.resolve({});
+      return inputRef.value!.getValue();
     },
   });
 </script>
diff --git a/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/components/RenderData/RenderTargetResourceSpec.vue b/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/components/RenderData/RenderTargetResourceSpec.vue
index aff95722e9..c92cfb092d 100644
--- a/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/components/RenderData/RenderTargetResourceSpec.vue
+++ b/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/components/RenderData/RenderTargetResourceSpec.vue
@@ -31,7 +31,7 @@
     @closed="handleClose">
     <template #header>
       <span>
-        {{ t('选择集群目标方案_n', { n: clusterData?.master_domain }) }}
+        {{ t('选择集群目标方案_n', { n: clusterData?.masterDomain }) }}
         <BkTag theme="info">
           {{ t('存储层 RemoteDB/DR 同时变更') }}
         </BkTag>
@@ -43,12 +43,12 @@
       <div class="spec-box mb-24">
         <table>
           <tr>
-            <td>{{ t('当前规格') }}： {{ clusterData.cluster_spec.spec_name }}</td>
+            <td>{{ t('当前规格') }}： {{ clusterData.clusterSpec.spec_name }}</td>
             <td>{{ t('变更后规格') }}： {{ futureSpec.name }}</td>
           </tr>
           <tr>
             <td>
-              {{ t('当前容量') }}： <span class="text-bold">{{ clusterData.cluster_capacity }} G</span>
+              {{ t('当前容量') }}： <span class="text-bold">{{ clusterData.clusterCapacity }} G</span>
             </td>
             <td>
               {{ t('变更后容量') }}： <span class="text-bold">{{ futureSpec.futureCapacity }} G</span>
@@ -58,10 +58,10 @@
       </div>
       <BkForm form-type="vertical">
         <ClusterSpecPlanSelector
-          :cloud-id="clusterData.bk_cloud_id"
+          :cloud-id="clusterData.bkCloudId"
           cluster-type="tendbcluster"
           machine-type="remote"
-          :shard-num="clusterData.cluster_shard_num"
+          :shard-num="clusterData.clusterShardNum"
           @change="handlePlanChange" />
       </BkForm>
     </div>
@@ -82,15 +82,15 @@
   import { ref, shallowRef, watch } from 'vue';
   import { useI18n } from 'vue-i18n';
 
-  import type SpiderModel from '@services/model/spider/spider';
-
   import { useBeforeClose } from '@hooks';
 
   import ClusterSpecPlanSelector, { type IRowData } from '@components/cluster-spec-plan-selector/Index.vue';
   import DisableSelect from '@components/render-table/columns/select-disable/index.vue';
 
+  import type { IDataRow } from './Row.vue';
+
   interface Props {
-    clusterData?: SpiderModel;
+    clusterData?: IDataRow['clusterData'];
   }
   interface Exposes {
     getValue: () => Promise<any>;
@@ -175,7 +175,7 @@
           return Promise.reject();
         }
         return {
-          remote_shard_num: Math.ceil(props.clusterData.cluster_shard_num / localSpec.value.machine_pair),
+          remote_shard_num: Math.ceil(props.clusterData.clusterShardNum / localSpec.value.machine_pair),
           resource_spec: {
             backend_group: {
               spec_id: localSpec.value.spec_id,
diff --git a/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/components/RenderData/Row.vue b/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/components/RenderData/Row.vue
index 2945680d67..3dcdfd350a 100644
--- a/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/components/RenderData/Row.vue
+++ b/dbm-ui/frontend/src/views/spider-manage/capacity-change/pages/page1/components/RenderData/Row.vue
@@ -17,23 +17,27 @@
       <td style="padding: 0">
         <RenderCluster
           ref="clusterRef"
-          :model-value="data.clusterData"
-          @id-change="handleClusterIdChange" />
+          v-model="localClusterData" />
       </td>
       <td style="padding: 0">
         <RenderResourceSpec
           ref="resourceSpecRef"
-          :cluster-id="localClusterId"
-          @cluster-change="handleClusterDataChange" />
+          :cluster-data="localClusterData" />
       </td>
       <td style="padding: 0">
-        <RenderShardNum :cluster-data="localClusterData" />
+        <RenderShardNum
+          ref="shardNumRef"
+          :cluster-data="localClusterData" />
       </td>
       <td style="padding: 0">
-        <RenderMachinePairCnt :cluster-data="localClusterData" />
+        <RenderMachinePairCnt
+          ref="machinePairCntRef"
+          :cluster-data="localClusterData" />
       </td>
       <td style="padding: 0">
-        <RenderCapacity :cluster-data="localClusterData" />
+        <RenderCapacity
+          ref="capacityRef"
+          :cluster-data="localClusterData" />
       </td>
       <td style="padding: 0">
         <RenderTargetResourceSpec
@@ -48,8 +52,6 @@
   </tbody>
 </template>
 <script lang="ts">
-  import SpiderModel from '@services/model/spider/spider';
-
   import OperateColumn from '@components/render-table/columns/operate-column/index.vue';
 
   import { random } from '@utils';
@@ -57,16 +59,21 @@
   export interface IDataRow {
     rowKey: string;
     clusterData?: {
+      bkCloudId: number;
+      clusterCapacity: number;
+      clusterShardNum: number;
+      clusterSpec: {
+        spec_name: string;
+      };
+      dbModuleId: number;
       id: number;
-      domain: string;
+      machinePairCnt: number;
+      masterDomain: string;
     };
     resourceSpec?: {
       id: number;
       name: string;
     };
-    clusterShardNum?: number;
-    clusterCapacity?: string;
-    machinePairCnt?: number;
     resource_spec?: {
       backend_group: {
         spec_id: number;
@@ -81,9 +88,6 @@
     rowKey: random(),
     clusterData: data.clusterData,
     resourceSpec: data.resourceSpec,
-    clusterShardNum: data.clusterShardNum,
-    clusterCapacity: data.clusterCapacity,
-    machinePairCnt: data.machinePairCnt,
     resource_spec: data.resource_spec,
   });
 </script>
@@ -114,18 +118,20 @@
 
   const emits = defineEmits<Emits>();
 
-  const clusterRef = ref();
-  const resourceSpecRef = ref();
-  const targetResourceSpecRef = ref();
+  const clusterRef = ref<InstanceType<typeof RenderCluster>>();
+  const shardNumRef = ref<InstanceType<typeof RenderShardNum>>();
+  const machinePairCntRef = ref<InstanceType<typeof RenderMachinePairCnt>>();
+  const capacityRef = ref<InstanceType<typeof RenderCapacity>>();
+  const resourceSpecRef = ref<InstanceType<typeof RenderResourceSpec>>();
+  const targetResourceSpecRef = ref<InstanceType<typeof RenderTargetResourceSpec>>();
 
-  const localClusterId = ref(0);
-  const localClusterData = ref<SpiderModel>();
+  const localClusterData = ref<IDataRow['clusterData']>();
 
   watch(
     () => props.data,
     () => {
       if (props.data.clusterData) {
-        localClusterId.value = props.data.clusterData.id;
+        localClusterData.value = props.data.clusterData;
       }
     },
     {
@@ -133,13 +139,6 @@
     },
   );
 
-  const handleClusterIdChange = (clusterId: number) => {
-    localClusterId.value = clusterId;
-  };
-  const handleClusterDataChange = (clusterData: SpiderModel) => {
-    localClusterData.value = clusterData;
-  };
-
   const handleAppend = () => {
     emits('add', [createRowData()]);
   };
@@ -154,12 +153,14 @@
   defineExpose<Exposes>({
     getValue() {
       return Promise.all([
-        clusterRef.value.getValue(),
-        resourceSpecRef.value.getValue(),
-        targetResourceSpecRef.value.getValue(),
-      ]).then(([clusterData, resourceSpecData, targetResourceSpecData]) => ({
+        clusterRef.value!.getValue(),
+        targetResourceSpecRef.value!.getValue(),
+        shardNumRef.value!.getValue(),
+        machinePairCntRef.value!.getValue(),
+        capacityRef.value!.getValue(),
+        resourceSpecRef.value!.getValue(),
+      ]).then(([clusterData, targetResourceSpecData]) => ({
         ...clusterData,
-        ...resourceSpecData,
         ...targetResourceSpecData,
       }));
     },
diff --git a/dbm-ui/frontend/src/views/spider-manage/privilege-clone-inst/pages/page1/Index.vue b/dbm-ui/frontend/src/views/spider-manage/privilege-clone-inst/pages/page1/Index.vue
index 629507313e..c0da8acbf2 100644
--- a/dbm-ui/frontend/src/views/spider-manage/privilege-clone-inst/pages/page1/Index.vue
+++ b/dbm-ui/frontend/src/views/spider-manage/privilege-clone-inst/pages/page1/Index.vue
@@ -114,12 +114,20 @@
   };
   // 批量选择
   const handelInstanceSelectorChange = (data: InstanceSelectorValues<IValue>) => {
+    console.log('asdasd = ', data);
     selectedIps.value = data;
     const newList = data.tendbcluster.reduce((result, item) => {
       const { instance_address: ip } = item;
       if (!ipMemo[ip]) {
         const row = createRowData({
-          source: item,
+          source: {
+            clusterId: item.cluster_id,
+            masterDomain: item.master_domain,
+            dbModuleId: item.db_module_id,
+            dbModuleName: item.db_module_name,
+            instanceAddress: item.instance_address,
+            bkCloudId: item.bk_cloud_id,
+          },
         });
         result.push(row);
         ipMemo[ip] = true;
@@ -144,7 +152,7 @@
   // 删除一个集群
   const handleRemove = (index: number) => {
     const dataList = [...tableData.value];
-    const ip = dataList[index].source?.instance_address;
+    const ip = dataList[index].source?.instanceAddress;
     dataList.splice(index, 1);
     tableData.value = dataList;
     if (ip) {
diff --git a/dbm-ui/frontend/src/views/spider-manage/privilege-clone-inst/pages/page1/components/RenderData/RenderCluster.vue b/dbm-ui/frontend/src/views/spider-manage/privilege-clone-inst/pages/page1/components/RenderData/RenderCluster.vue
index 2df13fffca..6bd0bbd31a 100644
--- a/dbm-ui/frontend/src/views/spider-manage/privilege-clone-inst/pages/page1/components/RenderData/RenderCluster.vue
+++ b/dbm-ui/frontend/src/views/spider-manage/privilege-clone-inst/pages/page1/components/RenderData/RenderCluster.vue
@@ -12,25 +12,21 @@
 -->
 
 <template>
-  <BkLoading :loading="isLoading">
-    <TableEditInput
-      ref="inputRef"
-      :model-value="clusterData?.cluster_name"
-      :placeholder="t('输入集群后自动生成')"
-      readonly />
-  </BkLoading>
+  <TableEditInput
+    ref="inputRef"
+    :model-value="source?.masterDomain"
+    :placeholder="t('输入集群后自动生成')"
+    readonly />
 </template>
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
-  import { useRequest } from 'vue-request';
-
-  import type SpiderModel from '@services/model/spider/spider';
-  import { getSpiderDetail } from '@services/source/spider';
 
   import TableEditInput from '@views/spider-manage/common/edit/Input.vue';
 
+  import type { IDataRow } from './Row.vue';
+
   interface Props {
-    clusterId: number;
+    source: IDataRow['source'];
   }
 
   interface Exposes {
@@ -43,42 +39,12 @@
 
   const inputRef = ref();
 
-  const clusterData = defineModel<SpiderModel>('clusterData');
-
-  const { loading: isLoading, run: fetchClusetrData } = useRequest(getSpiderDetail, {
-    manual: true,
-    onSuccess(data) {
-      clusterData.value = data;
-    },
-  });
-
-  watch(
-    () => props.clusterId,
-    () => {
-      if (props.clusterId) {
-        fetchClusetrData({
-          id: props.clusterId,
-        });
-      } else {
-        clusterData.value = undefined;
-      }
-    },
-    {
-      immediate: true,
-    },
-  );
-
   defineExpose<Exposes>({
     getValue() {
-      return inputRef.value.getValue().then(() => {
-        if (!clusterData.value) {
-          return Promise.reject();
-        }
-        return {
-          cluster_domain: clusterData.value.master_domain,
-          bk_cloud_id: clusterData.value.bk_cloud_id,
-        };
-      });
+      return inputRef.value.getValue().then(() => ({
+        cluster_domain: props.source!.masterDomain,
+        bk_cloud_id: props.source!.bkCloudId,
+      }));
     },
   });
 </script>
diff --git a/dbm-ui/frontend/src/views/spider-manage/privilege-clone-inst/pages/page1/components/RenderData/RenderModule.vue b/dbm-ui/frontend/src/views/spider-manage/privilege-clone-inst/pages/page1/components/RenderData/RenderModule.vue
index 87434c773f..53350b8706 100644
--- a/dbm-ui/frontend/src/views/spider-manage/privilege-clone-inst/pages/page1/components/RenderData/RenderModule.vue
+++ b/dbm-ui/frontend/src/views/spider-manage/privilege-clone-inst/pages/page1/components/RenderData/RenderModule.vue
@@ -14,7 +14,7 @@
 <template>
   <TableEditInput
     ref="inputRef"
-    :model-value="clusterData?.db_module_name"
+    :model-value="source?.dbModuleName"
     :placeholder="t('输入集群后自动生成')"
     readonly
     :rules="rules" />
@@ -22,16 +22,16 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import type SpiderModel from '@services/model/spider/spider';
-
   import TableEditInput from '@views/spider-manage/common/edit/Input.vue';
 
+  import type { IDataRow } from './Row.vue';
+
   interface Props {
-    clusterData?: SpiderModel;
+    source: IDataRow['source'];
   }
 
   interface Exposes {
-    getValue: () => Promise<Record<string, string>>;
+    getValue: () => Promise<Record<'module', number>>;
   }
 
   const props = defineProps<Props>();
@@ -49,14 +49,9 @@
 
   defineExpose<Exposes>({
     getValue() {
-      return inputRef.value.getValue().then(() => {
-        if (!props.clusterData) {
-          return Promise.reject();
-        }
-        return {
-          module: props.clusterData.db_module_name,
-        };
-      });
+      return inputRef.value.getValue().then(() => ({
+        module: props.source!.dbModuleId,
+      }));
     },
   });
 </script>
diff --git a/dbm-ui/frontend/src/views/spider-manage/privilege-clone-inst/pages/page1/components/RenderData/RenderSource.vue b/dbm-ui/frontend/src/views/spider-manage/privilege-clone-inst/pages/page1/components/RenderData/RenderSource.vue
index 6a73145063..46e229a5f9 100644
--- a/dbm-ui/frontend/src/views/spider-manage/privilege-clone-inst/pages/page1/components/RenderData/RenderSource.vue
+++ b/dbm-ui/frontend/src/views/spider-manage/privilege-clone-inst/pages/page1/components/RenderData/RenderSource.vue
@@ -15,8 +15,7 @@
   <TableEditInput
     ref="editRef"
     v-model="localInstanceAddress"
-    multi-input
-    :placeholder="$t('请输入IP_Port_使用换行分割一次可输入多个')"
+    :placeholder="t('请输入IP_Port')"
     :rules="rules" />
 </template>
 <script lang="ts">
@@ -26,7 +25,8 @@
   import {
     onBeforeUnmount,
     ref,
-    watch  } from 'vue';
+    watch
+  } from 'vue';
   import { useI18n } from 'vue-i18n';
 
   import { checkMysqlInstances } from '@services/source/instances';
@@ -37,30 +37,19 @@
 
   import { random } from '@utils';
 
-  import type { IProxyData } from './Row.vue';
-
-  interface Props {
-    modelValue?: IProxyData,
-  }
-
-  interface Emits {
-    (e:'update:cluserId', value: number): void,
-    (e:'update:cloudId', value: number): void,
-  }
+  import type { IDataRow } from './Row.vue';
 
   interface Exposes {
     getValue: () => Array<number>
   }
 
-  const props = defineProps<Props>();
-  const emits = defineEmits<Emits>();
-
   const instanceKey = `render_source_${random()}`;
   instanceAddreddMemo[instanceKey] = {};
 
   const { currentBizId } = useGlobalBizs();
   const { t } = useI18n();
 
+  const modelValue = defineModel<IDataRow['source']>();
   const editRef = ref();
 
   const localInstanceAddress = ref('');
@@ -82,8 +71,14 @@
 
         const [currentInstanceData] = data;
 
-        emits('update:cluserId', currentInstanceData.cluster_id);
-        emits('update:cloudId', currentInstanceData.bk_cloud_id);
+        modelValue.value = {
+          bkCloudId: currentInstanceData.bk_cloud_id,
+          clusterId: currentInstanceData.cluster_id,
+          dbModuleId: currentInstanceData.db_module_id,
+          dbModuleName: currentInstanceData.db_module_name,
+          instanceAddress: currentInstanceData.instance_address,
+          masterDomain: currentInstanceData.master_domain
+        };
         return true;
       }),
       message: t('源实例不存在'),
@@ -112,9 +107,9 @@
   ];
 
   // 同步外部值
-  watch(() => props.modelValue, () => {
-    if (props.modelValue) {
-      localInstanceAddress.value = props.modelValue.instance_address;
+  watch(modelValue, () => {
+    if (modelValue.value) {
+      localInstanceAddress.value = modelValue.value.instanceAddress;
 
       instanceAddreddMemo[instanceKey][localInstanceAddress.value] = true;
     }
diff --git a/dbm-ui/frontend/src/views/spider-manage/privilege-clone-inst/pages/page1/components/RenderData/RenderTarget.vue b/dbm-ui/frontend/src/views/spider-manage/privilege-clone-inst/pages/page1/components/RenderData/RenderTarget.vue
index 88fb883d24..39e28dd01a 100644
--- a/dbm-ui/frontend/src/views/spider-manage/privilege-clone-inst/pages/page1/components/RenderData/RenderTarget.vue
+++ b/dbm-ui/frontend/src/views/spider-manage/privilege-clone-inst/pages/page1/components/RenderData/RenderTarget.vue
@@ -29,7 +29,6 @@
   } from 'vue';
   import { useI18n } from 'vue-i18n';
 
-  import type SpiderModel from '@services/model/spider/spider';
   import { checkMysqlInstances } from '@services/source/instances';
   import type { InstanceInfos } from '@services/types/clusters';
 
@@ -39,11 +38,11 @@
 
   import { random } from '@utils';
 
-  import type { IProxyData } from './Row.vue';
+  import type { IDataRow, IProxyData  } from './Row.vue';
 
   interface Props {
     modelValue?: IProxyData,
-    clusterData?:SpiderModel
+    source: IDataRow['source'],
   }
 
   interface Exposes {
@@ -84,7 +83,7 @@
       message: t('新实例不存在'),
     },
     {
-      validator: () => !!props.clusterData && localInstanceData.bk_cloud_id === props.clusterData.bk_cloud_id,
+      validator: () => !!props.source && props.source.bkCloudId === localInstanceData.bk_cloud_id,
       message: t('新实例和源实例的管控区域不一致'),
     },
     {
diff --git a/dbm-ui/frontend/src/views/spider-manage/privilege-clone-inst/pages/page1/components/RenderData/Row.vue b/dbm-ui/frontend/src/views/spider-manage/privilege-clone-inst/pages/page1/components/RenderData/Row.vue
index 0cda401a34..68b62050bf 100644
--- a/dbm-ui/frontend/src/views/spider-manage/privilege-clone-inst/pages/page1/components/RenderData/Row.vue
+++ b/dbm-ui/frontend/src/views/spider-manage/privilege-clone-inst/pages/page1/components/RenderData/Row.vue
@@ -17,26 +17,23 @@
       <td style="padding: 0">
         <RenderSource
           ref="sourceRef"
-          v-model:cluser-id="localClusterId"
           :model-value="data.source" />
       </td>
       <td style="padding: 0">
         <RenderCluster
           ref="clusterRef"
-          v-model:clusterData="localClusterData"
-          :cluster-id="localClusterId" />
+          :source="localSource" />
       </td>
       <td style="padding: 0">
         <RenderModule
           ref="moduleRef"
-          :cluster-data="localClusterData" />
+          :source="localSource" />
       </td>
       <td style="padding: 0">
         <RenderTarget
           ref="targetRef"
-          :cloud-id="localClusterId"
-          :cluster-data="localClusterData"
-          :model-value="data.target" />
+          :model-value="data.target"
+          :source="localSource" />
       </td>
       <OperateColumn
         :removeable="removeable"
@@ -61,7 +58,14 @@
 
   export interface IDataRow {
     rowKey: string;
-    source?: IProxyData;
+    source?: {
+      bkCloudId: number;
+      clusterId: number;
+      dbModuleId: number;
+      dbModuleName: string;
+      instanceAddress: string;
+      masterDomain: string;
+    };
     target?: IProxyData;
   }
 
@@ -102,6 +106,7 @@
   const moduleRef = ref();
   const targetRef = ref();
 
+  const localSource = ref<IDataRow['source']>();
   const localClusterId = ref(0);
   const localClusterData = ref<SpiderModel>();
 
@@ -109,7 +114,7 @@
     () => props.data,
     () => {
       if (props.data.source) {
-        localClusterId.value = props.data.source.cluster_id;
+        localSource.value = props.data.source;
       }
     },
     {