diff --git a/dbm-ui/frontend/.vscode/settings.json b/dbm-ui/frontend/.vscode/settings.json
index 283c4db563..1f2666a091 100644
--- a/dbm-ui/frontend/.vscode/settings.json
+++ b/dbm-ui/frontend/.vscode/settings.json
@@ -57,4 +57,4 @@
     "titleBar.inactiveForeground": "#15202b99"
   },
   "typescript.tsdk": "node_modules/typescript/lib"
-}
+}
\ No newline at end of file
diff --git a/dbm-ui/frontend/babel.config.js b/dbm-ui/frontend/babel.config.js
deleted file mode 100644
index e9cae0e843..0000000000
--- a/dbm-ui/frontend/babel.config.js
+++ /dev/null
@@ -1,27 +0,0 @@
-/*
- * TencentBlueKing is pleased to support the open source community by making 蓝鲸智云-DB管理系统(BlueKing-BK-DBM) available.
- *
- * Copyright (C) 2017-2023 THL A29 Limited, a Tencent company. All rights reserved.
- *
- * Licensed under the MIT License (the "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at https://opensource.org/licenses/MIT
- *
- * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed
- * on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for
- * the specific language governing permissions and limitations under the License.
-*/
-
-module.exports = {
-  plugins: [
-    [
-      'import',
-      {
-        libraryName: 'bkui-vue',
-        style: (name) => {
-          const index = name.lastIndexOf('/');
-          return `${name}${name.slice(index)}.css`;
-        },
-      },
-    ],
-  ],
-};
diff --git a/dbm-ui/frontend/bkuiVueResolver.ts b/dbm-ui/frontend/bkuiVueResolver.ts
deleted file mode 100644
index 279035bc33..0000000000
--- a/dbm-ui/frontend/bkuiVueResolver.ts
+++ /dev/null
@@ -1,72 +0,0 @@
-/*
- * TencentBlueKing is pleased to support the open source community by making 蓝鲸智云-DB管理系统(BlueKing-BK-DBM) available.
- *
- * Copyright (C) 2017-2023 THL A29 Limited, a Tencent company. All rights reserved.
- *
- * Licensed under the MIT License (the "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at https://opensource.org/licenses/MIT
- *
- * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed
- * on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for
- * the specific language governing permissions and limitations under the License.
-*/
-
-// import type { ComponentResolver, SideEffectsInfo } from '../../types'
-// import { kebabCase } from '../utils'
-// type ComponentResolver = {};
-// type SideEffectsInfo = {};
-export function kebabCase(key: string) {
-  const result = key.replace(/([A-Z])/g, ' $1').trim();
-  return result.split(' ').join('-')
-    .toLowerCase();
-}
-
-export interface BkuiVueResolverOptions {
-  /**
-   * import style along with components
-   * @default 'css'
-   */
-  importStyle?: boolean | 'css' | 'less'
-  /**
-   * resolve `bkui-vue' icons
-   * @default false
-   */
-  resolveIcons?: boolean
-}
-
-function getSideEffects(importName: string, options: BkuiVueResolverOptions): string | undefined {
-  const { importStyle = 'css' } = options;
-
-  if (!importStyle) return;
-
-  const compName = kebabCase(importName);
-  let fileName = kebabCase(importName);
-
-  if (['menu-item', 'menu-group'].includes(compName)) return;
-
-  if (compName === 'submenu') {
-    fileName = 'menu';
-  }
-
-  if (importStyle === 'less') {
-    return `bkui-vue/lib/${fileName}/${compName}.less`;
-  }
-
-  return `bkui-vue/lib/${fileName}/${compName}.css`;
-}
-
-export function BkuiVueResolver(options: BkuiVueResolverOptions = {}) {
-  return {
-    type: 'component',
-    resolve: (name: string) => {
-      if (name.match(/^Bk/)) {
-        const importName = name.slice(2);
-        return {
-          name: importName,
-          from: 'bkui-vue/lib',
-          sideEffects: getSideEffects(importName, options),
-        };
-      }
-    },
-  };
-}
diff --git a/dbm-ui/frontend/components.d.ts b/dbm-ui/frontend/components.d.ts
deleted file mode 100644
index e72d317e84..0000000000
--- a/dbm-ui/frontend/components.d.ts
+++ /dev/null
@@ -1,29 +0,0 @@
-/*
- * TencentBlueKing is pleased to support the open source community by making 蓝鲸智云-DB管理系统(BlueKing-BK-DBM) available.
- *
- * Copyright (C) 2017-2023 THL A29 Limited, a Tencent company. All rights reserved.
- *
- * Licensed under the MIT License (the "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at https://opensource.org/licenses/MIT
- *
- * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed
- * on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for
- * the specific language governing permissions and limitations under the License.
-*/
-
-// generated by unplugin-vue-components
-// We suggest you to commit this file into source control
-// Read more: https://github.com/vuejs/vue-next/pull/3399
-import '@vue/runtime-core';
-
-declare module '@vue/runtime-core' {
-  export interface GlobalComponents {
-    BkMenu: typeof import('bkui-vue/lib')['Menu']
-    BkMenuItem: typeof import('bkui-vue/lib')['MenuItem']
-    BkNavigation: typeof import('bkui-vue/lib')['Navigation']
-    RouterLink: typeof import('vue-router')['RouterLink']
-    RouterView: typeof import('vue-router')['RouterView']
-  }
-}
-
-export {};
diff --git a/dbm-ui/frontend/env.d.ts b/dbm-ui/frontend/env.d.ts
index dd46ec8c18..1abc28a478 100644
--- a/dbm-ui/frontend/env.d.ts
+++ b/dbm-ui/frontend/env.d.ts
@@ -36,21 +36,19 @@ declare module '*.css' {
   export default css;
 }
 
-declare interface Window {
-  changeConfirm: boolean | 'popover';
-  clipboardData: {
-    getData: (params: string) => string;
-  };
-  PROJECT_ENV: {
-    VITE_PUBLIC_PATH: string;
-    VITE_AJAX_URL_PREFIX: string;
-    VITE_ROUTER_PERFIX: string;
-  };
-  PROJECT_CONFIG: {
-    BIZ_ID: number;
-    TICKET_DETAIL_REQUEST_CONTROLLER: AbortController;
+declare module 'vite-plugin-monaco-editor' {
+  interface MonacoEditorOptions {
+    // 根据实际插件文档填写选项
+    language?: string;
+    theme?: string;
+    // 其他可能的选项...
+  }
+
+  const monacoEditorPlugin: (options: MonacoEditorOptions) => any;
+
+  export default {
+    default: monacoEditorPlugin,
   };
-  BKApp: App<Element>;
 }
 
 declare module 'js-cookie';
@@ -86,3 +84,20 @@ type KeyExpand<T> = {
 };
 
 type LeftIsExtendsRightReturnValue<L, R, V> = L extends R ? never : V;
+
+declare interface Window {
+  changeConfirm: boolean | 'popover';
+  clipboardData: {
+    getData: (params: string) => string;
+  };
+  PROJECT_ENV: {
+    VITE_PUBLIC_PATH: string;
+    VITE_AJAX_URL_PREFIX: string;
+    VITE_ROUTER_PERFIX: string;
+  };
+  PROJECT_CONFIG: {
+    BIZ_ID: number;
+    TICKET_DETAIL_REQUEST_CONTROLLER: AbortController;
+  };
+  BKApp: App<Element>;
+}
diff --git a/dbm-ui/frontend/src/components/cluster-common/RenderStatus.vue b/dbm-ui/frontend/src/components/cluster-status/Index.vue
similarity index 96%
rename from dbm-ui/frontend/src/components/cluster-common/RenderStatus.vue
rename to dbm-ui/frontend/src/components/cluster-status/Index.vue
index ee05a4ec2b..323334f88e 100644
--- a/dbm-ui/frontend/src/components/cluster-common/RenderStatus.vue
+++ b/dbm-ui/frontend/src/components/cluster-status/Index.vue
@@ -12,7 +12,7 @@
 -->
 
 <template>
-  <div class="render-cluster-status">
+  <div class="db-cluster-status">
     <DbIcon
       svg
       :type="statusIcon" />
@@ -50,7 +50,7 @@
   const statusText = computed(() => textMap[props.data.toLocaleLowerCase() as keyof typeof textMap]);
 </script>
 <style lang="less">
-  .render-cluster-status {
+  .db-cluster-status {
     display: flex;
     align-items: center;
   }
diff --git a/dbm-ui/frontend/src/components/cost-timer/CostTimer.vue b/dbm-ui/frontend/src/components/cost-timer/CostTimer.vue
index 44be60f42f..07571b21eb 100644
--- a/dbm-ui/frontend/src/components/cost-timer/CostTimer.vue
+++ b/dbm-ui/frontend/src/components/cost-timer/CostTimer.vue
@@ -21,27 +21,32 @@
   import { useIntervalFn } from '@vueuse/core';
 
   interface Props {
-    value: number,
-    isTiming: boolean,
-    startTime: number,
+    value: number;
+    isTiming: boolean;
+    startTime: number;
   }
 
   const props = defineProps<Props>();
 
   const costTime = ref(0);
   // 计时
-  const {
-    resume,
-    pause,
-  } = useIntervalFn(() => {
-    costTime.value = Math.floor(Date.now() / 1000) - props.startTime;
-  }, 1000, { immediate: false });
-
-  watch(() => props.value, (time) => {
-    if (!props.isTiming) {
-      costTime.value = time;
-    }
-  }, { immediate: true });
+  const { resume, pause } = useIntervalFn(
+    () => {
+      costTime.value = Math.floor(Date.now() / 1000) - props.startTime;
+    },
+    1000,
+    { immediate: false },
+  );
+
+  watch(
+    () => props.value,
+    (time) => {
+      if (!props.isTiming) {
+        costTime.value = time;
+      }
+    },
+    { immediate: true },
+  );
 
   watch(
     () => props.isTiming,
diff --git a/dbm-ui/frontend/src/components/db-form/index.vue b/dbm-ui/frontend/src/components/db-form/index.vue
index 208b39f130..f65ba1195e 100644
--- a/dbm-ui/frontend/src/components/db-form/index.vue
+++ b/dbm-ui/frontend/src/components/db-form/index.vue
@@ -25,8 +25,8 @@
   import { debounce } from 'lodash';
 
   interface Props {
-    model?: Record<string, any>,
-    autoLabelWidth?: boolean,
+    model?: Record<string, any>;
+    autoLabelWidth?: boolean;
   }
 
   const props = withDefaults(defineProps<Props>(), {
@@ -36,15 +36,19 @@
 
   const dbFormRef = ref();
 
-  watch(() => props.model, () => {
-    if (isUserChange.value) {
-      window.changeConfirm = true;
-    }
-  }, { deep: true });
+  watch(
+    () => props.model,
+    () => {
+      if (isUserChange.value) {
+        window.changeConfirm = true;
+      }
+    },
+    { deep: true },
+  );
 
   /** 用户主动操作变更表单 */
   const isUserChange = ref(false);
-  const handleUserChange = () => isUserChange.value = true;
+  const handleUserChange = () => (isUserChange.value = true);
 
   const getCssStyle = (el: HTMLElement, prop: string) => window.getComputedStyle(el, null).getPropertyValue(prop);
   const calcLableWidth = () => {
@@ -99,8 +103,8 @@
   });
 
   defineExpose({
-    validate: (fields?: string | Array<string>) => dbFormRef.value.validate(fields)
-      .catch((error: Error) => {
+    validate: (fields?: string | Array<string>) =>
+      dbFormRef.value.validate(fields).catch((error: Error) => {
         const errorItemEl = dbFormRef.value.$el.querySelector('.bk-form-item.is-error');
         if (errorItemEl) {
           errorItemEl.scrollIntoView();
diff --git a/dbm-ui/frontend/src/components/db-member-selector/index_bak.vue b/dbm-ui/frontend/src/components/db-member-selector/index_bak.vue
index c2f75c31b1..8ca7513450 100644
--- a/dbm-ui/frontend/src/components/db-member-selector/index_bak.vue
+++ b/dbm-ui/frontend/src/components/db-member-selector/index_bak.vue
@@ -11,11 +11,10 @@
  * the specific language governing permissions and limitations under the License.
 -->
 
-
 <template>
   <div
     class="db-member-selector-wrapper"
-    :class="{'is-focus': isFocous}">
+    :class="{ 'is-focus': isFocous }">
     <BkSelect
       class="db-member-selector"
       :clearable="false"
@@ -46,10 +45,10 @@
 
   import { useCopy } from '@hooks';
 
-  type GetUsesParams = ServiceParameters<typeof getUserList>
+  type GetUsesParams = ServiceParameters<typeof getUserList>;
 
   interface Props {
-    collapseTags?: boolean
+    collapseTags?: boolean;
   }
 
   withDefaults(defineProps<Props>(), {
@@ -62,7 +61,7 @@
   const copy = useCopy();
 
   const state = reactive({
-    list: [] as {username: string}[],
+    list: [] as { username: string }[],
   });
   const isFocous = ref(false);
 
@@ -72,7 +71,7 @@
   const fetchUseList = async (params: GetUsesParams = {}) => {
     await getUserList(params).then((res) => {
       // 过滤已经选中的用户
-      state.list = res.results.filter(item => !modelValue.value?.includes(item.username));
+      state.list = res.results.filter((item) => !modelValue.value?.includes(item.username));
     });
   };
   // 初始化加载
@@ -89,8 +88,8 @@
     modelValue.value = values;
   };
 
-  const handleFocus = () => isFocous.value = true;
-  const handleBlur = () => isFocous.value = false;
+  const handleFocus = () => (isFocous.value = true);
+  const handleBlur = () => (isFocous.value = false);
 
   const handleCopy = () => {
     copy(modelValue.value.join(';'));
@@ -98,35 +97,35 @@
 </script>
 
 <style lang="less" scoped>
-.db-member-selector-wrapper {
-  position: relative;
-
-  &:hover,
-  &.is-focus {
-    .db-member-selector-copy {
-      display: block;
+  .db-member-selector-wrapper {
+    position: relative;
+
+    &:hover,
+    &.is-focus {
+      .db-member-selector-copy {
+        display: block;
+      }
     }
   }
-}
-
-.db-member-selector-copy {
-  position: absolute;
-  top: 50%;
-  right: 2px;
-  z-index: 99;
-  display: none;
-  width: 20px;
-  height: 20px;
-  margin-top: -10px;
-  margin-right: 4px;
-  font-size: 16px;
-  line-height: 20px;
-  cursor: pointer;
-  background-color: white;
-
-  &:hover {
-    color: @primary-color;
-    background-color: #e1ecff;
+
+  .db-member-selector-copy {
+    position: absolute;
+    top: 50%;
+    right: 2px;
+    z-index: 99;
+    display: none;
+    width: 20px;
+    height: 20px;
+    margin-top: -10px;
+    margin-right: 4px;
+    font-size: 16px;
+    line-height: 20px;
+    cursor: pointer;
+    background-color: white;
+
+    &:hover {
+      color: @primary-color;
+      background-color: #e1ecff;
+    }
   }
-}
 </style>
diff --git a/dbm-ui/frontend/src/components/db-table/OriginalTable.vue b/dbm-ui/frontend/src/components/db-table/OriginalTable.vue
index 9f67cf7414..d8b2321882 100644
--- a/dbm-ui/frontend/src/components/db-table/OriginalTable.vue
+++ b/dbm-ui/frontend/src/components/db-table/OriginalTable.vue
@@ -41,9 +41,9 @@
     (e: 'clearSearch'): void;
   }
   interface Props {
-    columns: InstanceType<typeof Table>['$props']['columns'],
-    isAnomalies?: boolean,
-    isSearching?: boolean,
+    columns: InstanceType<typeof Table>['$props']['columns'];
+    isAnomalies?: boolean;
+    isSearching?: boolean;
   }
 
   const props = withDefaults(defineProps<Props>(), {
@@ -55,9 +55,12 @@
 
   const tableKey = ref(Date.now().toString());
 
-  watch(() => props.columns, () => {
-    tableKey.value = Date.now().toString();
-  });
+  watch(
+    () => props.columns,
+    () => {
+      tableKey.value = Date.now().toString();
+    },
+  );
 
   const handleRefresh = () => emits('refresh');
   const handleClearSearch = () => emits('clearSearch');
diff --git a/dbm-ui/frontend/src/components/db-table/index.vue b/dbm-ui/frontend/src/components/db-table/index.vue
index ac35730505..f93d11c627 100644
--- a/dbm-ui/frontend/src/components/db-table/index.vue
+++ b/dbm-ui/frontend/src/components/db-table/index.vue
@@ -67,19 +67,6 @@
     </BkLoading>
   </div>
 </template>
-<script lang="tsx">
-  export interface IPagination {
-    count: number;
-    current: number;
-    limit: number;
-    limitList: Array<number>;
-    align: string;
-    layout: Array<string>;
-  }
-  export interface IPaginationExtra {
-    small?: boolean;
-  }
-</script>
 <script setup lang="tsx">
   import type { Table } from 'bkui-vue';
   import _ from 'lodash';
@@ -108,7 +95,9 @@
     dataSource: (params: any, payload?: IRequestPayload)=> Promise<any>,
     fixedPagination?: boolean,
     clearSelection?: boolean,
-    paginationExtra?: IPaginationExtra,
+    paginationExtra?: {
+    small?: boolean;
+  },
     selectable?: boolean,
     disableSelectMethod?: (data: any) => boolean|string,
     // data 数据的主键
@@ -239,7 +228,14 @@
   const isAnomalies = ref(false);
   const rowSelectMemo = shallowRef<Record<string|number, Record<any, any>>>({});
   const isWholeChecked = ref(false);
-  const pagination = reactive<IPagination>({
+  const pagination = reactive<{
+    count: number;
+    current: number;
+    limit: number;
+    limitList: Array<number>;
+    align: string;
+    layout: Array<string>;
+  }>({
     count: 0,
     current: 1,
     limit: 10,
diff --git a/dbm-ui/frontend/src/components/editable-info/index.vue b/dbm-ui/frontend/src/components/editable-info/index.vue
index eee90a1d03..408a20cfc5 100644
--- a/dbm-ui/frontend/src/components/editable-info/index.vue
+++ b/dbm-ui/frontend/src/components/editable-info/index.vue
@@ -149,14 +149,14 @@
 
 <script setup lang="tsx">
   interface Props {
-    readonly?: boolean,
-    columns?: Array<Array<InfoColumn>>,
-    data?: Record<string, any>,
-    width?: string,
+    readonly?: boolean;
+    columns?: Array<Array<InfoColumn>>;
+    data?: Record<string, any>;
+    width?: string;
   }
 
   interface Emits {
-    (e: 'save', value: EditEmitData): void
+    (e: 'save', value: EditEmitData): void;
   }
 
   const props = withDefaults(defineProps<Props>(), {
@@ -172,9 +172,13 @@
   const loading = ref(false);
   const rules = [{ required: true, trigger: 'blur', message: t('必填项') }];
 
-  watch(() => props.columns, () => {
-    unique.value = generateId('EDITABLE_INFO_KEY_', 6);
-  }, { deep: true });
+  watch(
+    () => props.columns,
+    () => {
+      unique.value = generateId('EDITABLE_INFO_KEY_', 6);
+    },
+    { deep: true },
+  );
 
   /**
    * 编辑基本信息
@@ -205,13 +209,14 @@
       return;
     }
 
-    const validate = await editItemRef.value[0]?.validate()
+    const validate = await editItemRef.value[0]
+      ?.validate()
       .then(() => true)
       .catch(() => false);
     if (validate) {
       loading.value = true;
       let editResolve = (value: unknown = true) => value;
-      const promise = new Promise(resolve => editResolve = resolve);
+      const promise = new Promise((resolve) => (editResolve = resolve));
       emit('save', { ...editState, editResolve });
       const res = await promise;
       loading.value = false;
diff --git a/dbm-ui/frontend/src/components/function-controller/FunController.vue b/dbm-ui/frontend/src/components/function-controller/FunController.vue
index fc6aad98fb..41f9e1f4d7 100644
--- a/dbm-ui/frontend/src/components/function-controller/FunController.vue
+++ b/dbm-ui/frontend/src/components/function-controller/FunController.vue
@@ -14,8 +14,8 @@
   import { useFunController } from '@stores';
 
   interface Props {
-    moduleId: ExtractedControllerDataKeys,
-    controllerId?: T
+    moduleId: ExtractedControllerDataKeys;
+    controllerId?: T;
   }
 
   const props = defineProps<Props>();
diff --git a/dbm-ui/frontend/src/components/cluster-common/HostAgentStatus.vue b/dbm-ui/frontend/src/components/host-agent-status/Index.vue
similarity index 95%
rename from dbm-ui/frontend/src/components/cluster-common/HostAgentStatus.vue
rename to dbm-ui/frontend/src/components/host-agent-status/Index.vue
index f96b287ce2..43f1012d7d 100644
--- a/dbm-ui/frontend/src/components/cluster-common/HostAgentStatus.vue
+++ b/dbm-ui/frontend/src/components/host-agent-status/Index.vue
@@ -12,7 +12,7 @@
 -->
 
 <template>
-  <div class="host-agent-status">
+  <div class="db-host-agent-status">
     <DbIcon
       svg
       :type="statusIcon" />
@@ -45,7 +45,7 @@
   const statusText = computed(() => textMap[props.data as keyof typeof textMap]);
 </script>
 <style lang="less">
-  .host-agent-status {
+  .db-host-agent-status {
     display: flex;
     align-items: center;
   }
diff --git a/dbm-ui/frontend/src/components/host-preview/HostPreview.vue b/dbm-ui/frontend/src/components/host-preview/HostPreview.vue
index 45f779d5a6..875750f35a 100644
--- a/dbm-ui/frontend/src/components/host-preview/HostPreview.vue
+++ b/dbm-ui/frontend/src/components/host-preview/HostPreview.vue
@@ -69,8 +69,6 @@
 
   import DbStatus from '@components/db-status/index.vue';
 
-  import type { TableColumnRender } from '@/types/bkui-vue';
-
   interface Props {
     fetchParams: Record<string, any>,
     fetchNodes: (params: any) => Promise<HostNode[]>,
@@ -96,48 +94,48 @@
   }, {
     label: t('每台主机节点数'),
     field: 'instance_num',
-    render: ({ cell }: TableColumnRender) => <span>{cell || '--'}</span>,
+    render: ({ data }: {data: HostNode}) => data.instance_num || '--',
   }, {
     label: 'IPv6',
     field: 'bk_host_innerip_v6',
-    render: ({ cell }: TableColumnRender) => <span>{cell || '--'}</span>,
+    render: ({ data }: {data: HostNode}) => data.bk_host_innerip_v6 || '--',
   }, {
     label: t('管控区域'),
     field: 'bk_cloud_name',
-    render: ({ cell }: any) => <span>{cell?.name || '--'}</span>,
+    render: ({ data }: {data: HostNode}) => data.bk_cloud_name || '--',
   }, {
     label: t('Agent状态'),
     field: 'status',
-    render: ({ cell }: { cell: number }) => {
-      if (typeof cell !== 'number') return '--';
+    render: ({ data }: {data: HostNode}) => {
+      if (typeof data.status !== 'number') return '--';
 
       const text = [t('异常'), t('正常')];
-      return <DbStatus theme={cell === 1 ? 'success' : 'danger'}>{text[cell]}</DbStatus>;
+      return <DbStatus theme={data.status === 1 ? 'success' : 'danger'}>{text[data.status]}</DbStatus>;
     },
   }, {
     label: t('主机名称'),
     field: 'bk_host_name',
-    render: ({ cell }: TableColumnRender) => <span>{cell || '--'}</span>,
+    render: ({ data }: {data: HostNode}) => data.bk_host_name || '--',
   }, {
     label: t('OS名称'),
     field: 'bk_os_name',
-    render: ({ cell }: TableColumnRender) => <span>{cell || '--'}</span>,
+    render: ({ data }: {data: HostNode}) => data.bk_os_name || '--',
   }, {
     label: t('所属云厂商'),
     field: 'bk_cloud_vendor',
-    render: ({ cell }: TableColumnRender) => <span>{cell || '--'}</span>,
+    render: ({ data }: {data: HostNode}) => data.bk_cloud_vendor || '--',
   }, {
     label: t('OS类型'),
     field: 'bk_os_type',
-    render: ({ cell }: TableColumnRender) => <span>{cell || '--'}</span>,
+    render: ({ data }: {data: HostNode}) => data.bk_os_type || '--',
   }, {
     label: t('主机ID'),
     field: 'bk_host_id',
-    render: ({ cell }: TableColumnRender) => <span>{cell || '--'}</span>,
+    render: ({ data }: {data: HostNode}) => data.bk_host_id || '--',
   }, {
     label: 'Agent ID',
     field: 'bk_agent_id',
-    render: ({ cell }: TableColumnRender) => <span>{cell || '--'}</span>,
+    render: ({ data }: {data: HostNode}) => data.bk_agent_id || '--',
   }];
   const state = reactive({
     isLoading: false,
diff --git a/dbm-ui/frontend/src/components/instance-selector/components/common/manual-content-host/Index.vue b/dbm-ui/frontend/src/components/instance-selector/components/common/manual-content-host/Index.vue
index 8af7695dba..1834ea6c94 100644
--- a/dbm-ui/frontend/src/components/instance-selector/components/common/manual-content-host/Index.vue
+++ b/dbm-ui/frontend/src/components/instance-selector/components/common/manual-content-host/Index.vue
@@ -96,7 +96,7 @@
 <script setup lang="ts" generic="T extends IValue">
   import { useI18n } from 'vue-i18n';
 
-  import type { ListBase } from '@services/types'
+  import type { ListBase } from '@services/types';
 
   import { useGlobalBizs } from '@stores';
 
@@ -110,17 +110,17 @@
   type ManualConfigType = Required<PanelListType[number]>['manualConfig'];
 
   interface Props {
-    lastValues: InstanceSelectorValues<T>,
-    manualConfig: Required<ManualConfigType>,
+    lastValues: InstanceSelectorValues<T>;
+    manualConfig: Required<ManualConfigType>;
     // clusterId?: number,
-    tableSetting: TableSetting,
-    firsrColumn?: TableConfigType['firsrColumn'],
-    statusFilter?: TableConfigType['statusFilter'],
+    tableSetting: TableSetting;
+    firsrColumn?: TableConfigType['firsrColumn'];
+    statusFilter?: TableConfigType['statusFilter'];
     getTableList: NonNullable<TableConfigType['getTableList']>;
   }
 
   interface Emits {
-    (e: 'change', value: InstanceSelectorValues<T>): void
+    (e: 'change', value: InstanceSelectorValues<T>): void;
   }
   const props = withDefaults(defineProps<Props>(), {
     firsrColumn: undefined,
@@ -178,10 +178,11 @@
   /**
    * 处理分隔内容，过滤空内容
    */
-  const getValues = () => inputState.values
-    .replace(/\s+|[；，｜]/g, ' ') // 将空格 换行符 ；，｜符号统一为空格
-    .split(' ')
-    .filter(value => value);
+  const getValues = () =>
+    inputState.values
+      .replace(/\s+|[；，｜]/g, ' ') // 将空格 换行符 ；，｜符号统一为空格
+      .split(' ')
+      .filter((value) => value);
 
   /**
    * 解析输入内容
@@ -216,15 +217,13 @@
       //   });
       // }
       const res = await (props.manualConfig.checkInstances as (params: any) => Promise<ListBase<any[]>>)(params);
-      const hostList = res.results
+      const hostList = res.results;
       const legalInstances = [];
       for (let i = lines.length - 1; i >= 0; i--) {
         const item = lines[i];
         const infos = hostList[i];
         const remove = lines.splice(i, 1);
-        const isExisted = hostList.find(existItem => (
-          existItem[props.manualConfig.checkKey] === item
-        ));
+        const isExisted = hostList.find((existItem) => existItem[props.manualConfig.checkKey] === item);
         if (!isExisted) {
           newLines.push(...remove);
         } else {
@@ -245,7 +244,13 @@
           lastValues[type] = [];
         }
         const list = lastValues[type];
-        const isExisted = list.length > 0 && list.find(i => `${i[props.manualConfig.checkKey]}_${i.bk_cloud_id}` === `${item[props.manualConfig.checkKey]}_${item.bk_cloud_id}`);
+        const isExisted =
+          list.length > 0 &&
+          list.find(
+            (i) =>
+              `${i[props.manualConfig.checkKey]}_${i.bk_cloud_id}` ===
+              `${item[props.manualConfig.checkKey]}_${item.bk_cloud_id}`,
+          );
         if (!isExisted) {
           lastValues[type].push({
             bk_host_id: item.bk_host_id,
@@ -257,11 +262,11 @@
             cluster_type: '',
             master_domain: item.related_clusters[0].immute_domain,
             bk_cloud_name: item.bk_cloud_name,
-            related_instances: (item.related_instances || []).map(instanceItem => ({
+            related_instances: (item.related_instances || []).map((instanceItem) => ({
               instance: instanceItem.instance,
-              status: instanceItem.status
+              status: instanceItem.status,
             })),
-            spec_config: item.spec_config
+            spec_config: item.spec_config,
           } as T);
         }
       }
diff --git a/dbm-ui/frontend/src/components/instance-selector/components/common/manual-content/Index.vue b/dbm-ui/frontend/src/components/instance-selector/components/common/manual-content/Index.vue
index 9aada232cb..13bbc1d238 100644
--- a/dbm-ui/frontend/src/components/instance-selector/components/common/manual-content/Index.vue
+++ b/dbm-ui/frontend/src/components/instance-selector/components/common/manual-content/Index.vue
@@ -107,17 +107,16 @@
   type ManualConfigType = Required<PanelListType[number]>['manualConfig'];
 
   interface Props {
-    lastValues: InstanceSelectorValues<T>,
-    manualConfig: Required<ManualConfigType>,
+    lastValues: InstanceSelectorValues<T>;
+    manualConfig: Required<ManualConfigType>;
     // clusterId?: number,
-    tableSetting: TableSetting,
-    firsrColumn?: TableConfigType['firsrColumn'],
-    statusFilter?: TableConfigType['statusFilter'],
-
+    tableSetting: TableSetting;
+    firsrColumn?: TableConfigType['firsrColumn'];
+    statusFilter?: TableConfigType['statusFilter'];
   }
 
   interface Emits {
-    (e: 'change', value: Props['lastValues']): void
+    (e: 'change', value: Props['lastValues']): void;
   }
   const props = withDefaults(defineProps<Props>(), {
     firsrColumn: undefined,
@@ -175,10 +174,11 @@
   /**
    * 处理分隔内容，过滤空内容
    */
-  const getValues = () => inputState.values
-    .replace(/\s+|[；，｜]/g, ' ') // 将空格 换行符 ；，｜符号统一为空格
-    .split(' ')
-    .filter(value => value);
+  const getValues = () =>
+    inputState.values
+      .replace(/\s+|[；，｜]/g, ' ') // 将空格 换行符 ；，｜符号统一为空格
+      .split(' ')
+      .filter((value) => value);
 
   /**
    * 解析输入内容
@@ -227,9 +227,7 @@
         const item = lines[i];
         const infos = res[i];
         const remove = lines.splice(i, 1);
-        const isExisted = res.find(existItem => (
-          existItem[props.manualConfig.checkKey] === item
-        ));
+        const isExisted = res.find((existItem) => existItem[props.manualConfig.checkKey] === item);
         if (!isExisted) {
           newLines.push(...remove);
         } else {
@@ -250,7 +248,13 @@
           lastValues[type] = [];
         }
         const list = lastValues[type];
-        const isExisted = list.length > 0 && list.find(i => `${i[props.manualConfig.checkKey]}_${i.bk_cloud_id}` === `${item[props.manualConfig.checkKey]}_${item.bk_cloud_id}`);
+        const isExisted =
+          list.length > 0 &&
+          list.find(
+            (i) =>
+              `${i[props.manualConfig.checkKey]}_${i.bk_cloud_id}` ===
+              `${item[props.manualConfig.checkKey]}_${item.bk_cloud_id}`,
+          );
         if (!isExisted) {
           lastValues[type].push({
             bk_host_id: item.bk_host_id,
diff --git a/dbm-ui/frontend/src/components/instance-selector/components/common/preview-result/Index.vue b/dbm-ui/frontend/src/components/instance-selector/components/common/preview-result/Index.vue
index 6ef64d70cf..bf9b1ea1d7 100644
--- a/dbm-ui/frontend/src/components/instance-selector/components/common/preview-result/Index.vue
+++ b/dbm-ui/frontend/src/components/instance-selector/components/common/preview-result/Index.vue
@@ -77,11 +77,11 @@
   import CollapseMini from './CollapseMini.vue';
 
   interface Props {
-    lastValues: InstanceSelectorValues<T>,
-    titleMap: Record<string, string>,
-    showTitle?: boolean,
-    displayKey?: keyof IValue,
-    activePanelId?: string,
+    lastValues: InstanceSelectorValues<T>;
+    titleMap: Record<string, string>;
+    showTitle?: boolean;
+    displayKey?: keyof IValue;
+    activePanelId?: string;
   }
 
   type Keys = keyof Props['lastValues'];
@@ -102,7 +102,7 @@
   const copy = useCopy();
 
   const keys = computed(() => Object.keys(props.lastValues) as Keys[]);
-  const isEmpty = computed(() => keys.value.every(key => props.lastValues[key].length < 1));
+  const isEmpty = computed(() => keys.value.every((key) => props.lastValues[key].length < 1));
   const mainKey = computed(() => props.displayKey);
 
   const handleClear = () => {
diff --git a/dbm-ui/frontend/src/components/instance-selector/components/mongo/useTopoData.ts b/dbm-ui/frontend/src/components/instance-selector/components/mongo/useTopoData.ts
index b42bb373ad..9670feaf2f 100644
--- a/dbm-ui/frontend/src/components/instance-selector/components/mongo/useTopoData.ts
+++ b/dbm-ui/frontend/src/components/instance-selector/components/mongo/useTopoData.ts
@@ -9,7 +9,7 @@
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed
  * on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for
  * the specific language governing permissions and limitations under the License.
-*/
+ */
 import { type ComponentInternalInstance } from 'vue';
 
 import { useGlobalBizs } from '@stores';
@@ -17,8 +17,8 @@ import { useGlobalBizs } from '@stores';
 interface TopoTreeData {
   id: number;
   name: string;
-  obj: 'biz' | 'cluster',
-  count: number,
+  obj: 'biz' | 'cluster';
+  count: number;
   children: Array<TopoTreeData>;
 }
 
@@ -29,9 +29,9 @@ export function useTopoData<T extends Record<string, any>>(filterClusterId: Comp
   const { currentBizId, currentBizInfo } = useGlobalBizs();
   const currentInstance = getCurrentInstance() as ComponentInternalInstance & {
     proxy: {
-      getTopoList: (params: any) => Promise<any>,
-      countFunc?: (data: T) => number
-    },
+      getTopoList: (params: any) => Promise<any>;
+      countFunc?: (data: T) => number;
+    };
   };
 
   const isLoading = ref(false);
@@ -52,35 +52,39 @@ export function useTopoData<T extends Record<string, any>>(filterClusterId: Comp
     if (filterClusterId.value) {
       params.cluster_ids = filterClusterId.value;
     }
-    return currentInstance.proxy.getTopoList(params).then((data) => {
-      const countFn = currentInstance.proxy?.countFunc;
-      const formatData = data.map((item: T) => ({ ...item, count: countFn ? countFn(item) : item.remote_db.length }));
-      const children = formatData.map((item: T) => ({
-        id: item.id,
-        name: item.master_domain,
-        obj: 'cluster',
-        count: item.count,
-        children: [],
-      }));
-      treeData.value = filterClusterId.value ? children : [
-        {
-          name: currentBizInfo?.display_name || '--',
-          id: currentBizId,
-          obj: 'biz',
-          count: formatData.reduce((count: number, item: any) => count + item.count, 0),
-          children,
-        },
-      ];
-      setTimeout(() => {
-        if (data.length > 0) {
-          const [firstNode] = treeData.value;
-          selectClusterId.value = firstNode.id;
-          const [firstRawNode] = treeRef.value.getData().data;
-          treeRef.value.setOpen(firstRawNode);
-          treeRef.value.setSelect(firstRawNode);
-        }
-      });
-    })
+    return currentInstance.proxy
+      .getTopoList(params)
+      .then((data) => {
+        const countFn = currentInstance.proxy?.countFunc;
+        const formatData = data.map((item: T) => ({ ...item, count: countFn ? countFn(item) : item.remote_db.length }));
+        const children = formatData.map((item: T) => ({
+          id: item.id,
+          name: item.master_domain,
+          obj: 'cluster',
+          count: item.count,
+          children: [],
+        }));
+        treeData.value = filterClusterId.value
+          ? children
+          : [
+              {
+                name: currentBizInfo?.display_name || '--',
+                id: currentBizId,
+                obj: 'biz',
+                count: formatData.reduce((count: number, item: any) => count + item.count, 0),
+                children,
+              },
+            ];
+        setTimeout(() => {
+          if (data.length > 0) {
+            const [firstNode] = treeData.value;
+            selectClusterId.value = firstNode.id;
+            const [firstRawNode] = treeRef.value.getData().data;
+            treeRef.value.setOpen(firstRawNode);
+            treeRef.value.setSelect(firstRawNode);
+          }
+        });
+      })
       .finally(() => {
         isLoading.value = false;
       });
diff --git a/dbm-ui/frontend/src/components/ip-selector/IpSelector.vue b/dbm-ui/frontend/src/components/ip-selector/IpSelector.vue
index 48f36a3c9a..85d9244fc3 100644
--- a/dbm-ui/frontend/src/components/ip-selector/IpSelector.vue
+++ b/dbm-ui/frontend/src/components/ip-selector/IpSelector.vue
@@ -129,8 +129,6 @@
 
   import PreviewWhitelist from './components/PreviewWhitelist.vue';
 
-  import type { TableColumnRender } from '@/types/bkui-vue';
-
   /** IP 选择器返回结果 */
   export type IPSelectorResult = {
     dynamic_group_list: any[];
@@ -162,7 +160,7 @@
   }
 
   interface Emits {
-    (e: 'change', value: (typeof selectorState)['tableData']): void;
+    (e: 'change', value: any[]): void;
     (e: 'changeWhitelist', value: IPSelectorResult['dbm_whitelist']): void;
   }
 </script>
@@ -312,14 +310,12 @@
     fetchTopologyHostCount: (node: any) => getHostTopo({
       mode: props.serviceMode,
       all_scope: true,
-      // scope_list: !node ? [] : [node.meta],
       scope_list: [scope.value],
     }),
     fetchHostsDetails: (params: any) => {
       const firstHost = params.host_list[0];
       return getHostDetails({
         mode: props.serviceMode,
-        // scope_list: [firstHost.meta],
         scope_list: [scope.value],
         ...params,
       });
@@ -406,56 +402,56 @@
       {
         label: t('管控区域'),
         field: 'cloud_area',
-        render: ({ cell }: any) => <span>{cell?.name || '--'}</span>,
+        render: ({data}: {data: HostDetails}) => data.cloud_area || '--',
       },
       {
         label: t('Agent状态'),
         field: 'alive',
-        render: ({ cell }: { cell: number }) => {
-          const info = cell === 1 ? { theme: 'success', text: t('正常') } : { theme: 'danger', text: t('异常') };
+        render: ({data}: {data: HostDetails}) => {
+          const info = data.alive === 1 ? { theme: 'success', text: t('正常') } : { theme: 'danger', text: t('异常') };
           return <DbStatus theme={info.theme}>{info.text}</DbStatus>;
         },
       },
       {
         label: t('主机名称'),
         field: 'host_name',
-        render: ({ cell }: TableColumnRender) => <span>{cell || '--'}</span>,
+        render: ({data}: {data: HostDetails}) => data.host_name || '--',
       },
       {
         label: t('OS名称'),
         field: 'os_name',
-        render: ({ cell }: TableColumnRender) => <span>{cell || '--'}</span>,
+        render: ({data}: {data: HostDetails}) => data.os_name || '--',
       },
       {
         label: t('所属云厂商'),
         field: 'cloud_vendor',
-        render: ({ cell }: TableColumnRender) => <span>{cell || '--'}</span>,
+        render: ({data}: {data: HostDetails}) => data.cloud_vendor || '--',
       },
       {
         label: t('OS类型'),
         field: 'os_type',
-        render: ({ cell }: TableColumnRender) => <span>{cell || '--'}</span>,
+        render: ({data}: {data: HostDetails}) => data.os_type || '--',
       },
       {
         label: t('主机ID'),
         field: 'host_id',
-        render: ({ cell }: TableColumnRender) => <span>{cell || '--'}</span>,
+        render: ({data}: {data: HostDetails}) => data.host_id || '--',
       },
       {
         label: 'Agent ID',
         field: 'agent_id',
-        render: ({ cell }: TableColumnRender) => <span>{cell || '--'}</span>,
+        render: ({data}: {data: HostDetails}) => data.agent_id || '--',
       },
       {
         label: 'IPv6',
         field: 'ipv6',
-        render: ({ cell }: TableColumnRender) => <span>{cell || '--'}</span>,
+        render: ({data}: {data: HostDetails}) => data.ipv6 || '--',
       },
       {
         label: t('操作'),
         field: 'operation',
         width: 100,
-        render: ({ index }: TableColumnRender) => (
+        render: ({ index }: {index: number}) => (
           <bk-button
             text
             theme="primary"
@@ -527,7 +523,7 @@
         host_id: item.host_id,
         meta: {
           bk_biz_id: props.bizId as number,
-          scope_id: props.bizId as number,
+          scope_id: `${props.bizId}`,
           scope_type: 'biz',
         },
       })),
diff --git a/dbm-ui/frontend/src/components/mysql-toolbox/Success.vue b/dbm-ui/frontend/src/components/mysql-toolbox/Success.vue
deleted file mode 100644
index 316cc3e386..0000000000
--- a/dbm-ui/frontend/src/components/mysql-toolbox/Success.vue
+++ /dev/null
@@ -1,222 +0,0 @@
-<!--
- * TencentBlueKing is pleased to support the open source community by making 蓝鲸智云-DB管理系统(BlueKing-BK-DBM) available.
- *
- * Copyright (C) 2017-2023 THL A29 Limited, a Tencent company. All rights reserved.
- *
- * Licensed under the MIT License (the "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License athttps://opensource.org/licenses/MIT
- *
- * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed
- * on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for
- * the specific language governing permissions and limitations under the License.
--->
-
-<template>
-  <div class="success">
-    <DbIcon
-      class="success__icon"
-      type="check-line" />
-    <p class="success__title">
-      <slot>{{ title }}</slot>
-    </p>
-    <div class="success__desc">
-      <slot name="desc">
-        <I18nT
-          keypath="接下来您可以通过xx查看任务最新动态"
-          tag="span">
-          <a
-            href="javascript:"
-            @click="handleGoTicket">
-            {{ $t('单据') }}
-          </a>
-        </I18nT>
-      </slot>
-    </div>
-    <div class="success__steps">
-      <div
-        v-for="(step, index) in steps"
-        :key="index"
-        class="step-item">
-        <span
-          class="step-item__icon"
-          :class="`${step.status}`">
-          <span class="step-item__status" />
-        </span>
-        <p class="step-item__title">
-          {{ step.title }}
-        </p>
-      </div>
-    </div>
-    <div class="success__footers">
-      <BkButton
-        class="w-88 mr-8"
-        theme="primary"
-        @click="handleGoTicket">
-        {{ $t("去查看") }}
-      </BkButton>
-      <BkButton
-        class="w-88"
-        @click="handleGoBack">
-        {{ $t("继续提单") }}
-      </BkButton>
-    </div>
-  </div>
-</template>
-
-<script setup lang="ts">
-  interface Emits {
-    (e: 'close'): void;
-  }
-
-  interface Props {
-    title: string;
-    ticketId: number;
-    steps: Array<{ title: string; status?: string }>;
-  }
-
-  const props = defineProps<Props>();
-  const emits = defineEmits<Emits>();
-
-  const router = useRouter();
-
-  function handleGoTicket() {
-    const location = router.resolve({
-      name: 'bizTicketManage',
-      query: {
-        id: props.ticketId,
-      },
-    });
-    window.open(location.href, '_blank');
-  }
-
-  function handleGoBack() {
-    emits('close');
-  }
-</script>
-
-<style lang="less" scoped>
-.success {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  margin-top: 8%;
-
-  &__icon {
-    display: inline-block;
-    width: 64px;
-    height: 64px;
-    margin-bottom: 36px;
-    font-size: 42px;
-    line-height: 64px;
-    color: white;
-    text-align: center;
-    background-color: @bg-success;
-    border-radius: 50%;
-  }
-
-  &__title {
-    margin-bottom: 16px;
-    font-size: 24px;
-    color: @title-color;
-  }
-
-  &__desc {
-    font-size: @font-size-normal;
-  }
-
-  &__steps {
-    display: flex;
-    margin: 24px 0 32px;
-
-    .step-item {
-      position: relative;
-      width: 100px;
-      overflow: hidden;
-      text-align: center;
-
-      &::after {
-        position: absolute;
-        top: 7px;
-        left: 0;
-        width: 100%;
-        height: 1px;
-        background-color: #d8d8d8;
-        content: "";
-      }
-
-      &:first-child {
-        &::after {
-          position: absolute;
-          top: 7px;
-          left: 0;
-          width: 100%;
-          height: 1px;
-          background-color: #d8d8d8;
-          content: '';
-          right: 0;
-          left: unset;
-          width: 50%;
-        }
-      }
-
-      &:last-child {
-        &::after {
-          width: 50%;
-        }
-      }
-
-      &__icon {
-        position: relative;
-        z-index: 2;
-        display: inline-block;
-        padding: 0 4px;
-        font-size: 0;
-        background-color: white;
-
-        .step-item__status {
-          display: inline-block;
-          width: 10px;
-          height: 10px;
-          border: 2px solid #d8d8d8;
-          border-radius: 50%;
-        }
-
-        &.loading {
-          .step-item__status {
-            position: relative;
-            width: 14px;
-            height: 14px;
-            border-color: @border-primary;
-
-            &::after {
-              position: absolute;
-              top: 1px;
-              left: 1px;
-              width: 6px;
-              height: 6px;
-              border: 1px solid @border-primary;
-              border-top-color: white;
-              border-radius: 50%;
-              content: "";
-              animation: success-spin 1.5s linear infinite;
-            }
-          }
-        }
-      }
-
-      &__title {
-        padding-top: 16px;
-      }
-    }
-  }
-}
-
-@keyframes success-spin {
-  0% {
-    transform: rotate(0deg);
-  }
-  100% {
-    transform: rotate(360deg);
-  }
-}
-</style>
diff --git a/dbm-ui/frontend/src/components/mysql-toolbox/common/const.ts b/dbm-ui/frontend/src/components/mysql-toolbox/common/const.ts
deleted file mode 100644
index d671ba5564..0000000000
--- a/dbm-ui/frontend/src/components/mysql-toolbox/common/const.ts
+++ /dev/null
@@ -1,24 +0,0 @@
-/*
- * TencentBlueKing is pleased to support the open source community by making 蓝鲸智云-DB管理系统(BlueKing-BK-DBM) available.
- *
- * Copyright (C) 2017-2023 THL A29 Limited, a Tencent company. All rights reserved.
- *
- * Licensed under the MIT License (the "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at https://opensource.org/licenses/MIT
- *
- * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed
- * on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for
- * the specific language governing permissions and limitations under the License.
- */
-
-import { t } from '@locales/index';
-
-/**
- * 备份(源)列表
- */
-export const backupList = [
-  {
-    value: 'local',
-    label: t('本地备份'),
-  },
-];
diff --git a/dbm-ui/frontend/src/components/router-back/Index.vue b/dbm-ui/frontend/src/components/router-back/Index.vue
index b1fcad080c..a5d1552b0a 100644
--- a/dbm-ui/frontend/src/components/router-back/Index.vue
+++ b/dbm-ui/frontend/src/components/router-back/Index.vue
@@ -9,20 +9,15 @@
 </template>
 <script setup lang="ts">
   import _ from 'lodash';
-  import {
-    ref,
-    watch,
-  } from 'vue';
-  import {
-    useRoute,
-  } from 'vue-router';
+  import { ref, watch } from 'vue';
+  import { useRoute } from 'vue-router';
 
   const route = useRoute();
 
   const showRouterBackBtn = ref(false);
   let routerBack = () => {};
 
-  let timer = 0;
+  let timer: ReturnType<typeof setTimeout>;
 
   watch(route, () => {
     clearTimeout(timer);
@@ -31,7 +26,7 @@
     const last = _.last(route.matched);
     timer = setTimeout(() => {
       if (last && last.instances.default) {
-        const routerBackFn = (last.instances.default as {routerBack?: () => void}).routerBack;
+        const routerBackFn = (last.instances.default as { routerBack?: () => void }).routerBack;
         if (_.isFunction(routerBackFn)) {
           showRouterBackBtn.value = true;
           routerBack = routerBackFn;
diff --git a/dbm-ui/frontend/src/components/scroll-faker/hooks/use-box-state.ts b/dbm-ui/frontend/src/components/scroll-faker/hooks/use-box-state.ts
index 1fda6d49fa..5a69f2a790 100644
--- a/dbm-ui/frontend/src/components/scroll-faker/hooks/use-box-state.ts
+++ b/dbm-ui/frontend/src/components/scroll-faker/hooks/use-box-state.ts
@@ -9,18 +9,14 @@
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed
  * on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for
  * the specific language governing permissions and limitations under the License.
-*/
+ */
 
-import {
-  type ComponentInternalInstance,
-  getCurrentInstance,
-  reactive,
-} from 'vue';
+import { type ComponentInternalInstance, getCurrentInstance, reactive } from 'vue';
 
 import type { IContext } from '../index.vue';
 
 export default function () {
-  const { proxy } = getCurrentInstance() as ComponentInternalInstance & {proxy: IContext};
+  const { proxy } = getCurrentInstance() as ComponentInternalInstance & { proxy: IContext };
 
   const state = reactive({
     contentScrollHeight: 0,
@@ -33,21 +29,14 @@ export default function () {
     },
   });
 
-
   const initState = () => {
     if (proxy.$refs.scrollBox && proxy.$refs.scrollContent) {
-      const {
-        scrollHeight,
-        scrollWidth,
-      } = proxy.$refs.scrollContent as Element;
+      const { scrollHeight, scrollWidth } = proxy.$refs.scrollContent as Element;
       state.contentScrollHeight = scrollHeight;
       state.contentScrollWidth = scrollWidth;
 
-      const {
-        width: boxWidth,
-        height: boxHeight,
-      } = proxy.$refs.scrollBox.getBoundingClientRect();
-        // 内容区高度大于容器高度显示垂直滚动条
+      const { width: boxWidth, height: boxHeight } = proxy.$refs.scrollBox.getBoundingClientRect();
+      // 内容区高度大于容器高度显示垂直滚动条
       state.isRenderVerticalScroll = Math.ceil(state.contentScrollHeight) > Math.ceil(boxHeight);
       // 内容区宽度大于容器宽度显示水平滚动条
       state.isRenderHorizontalScrollbar = Math.ceil(state.contentScrollWidth) > Math.ceil(boxWidth);
@@ -57,7 +46,7 @@ export default function () {
         maxHeight: '',
         maxWidth: '',
       };
-        // 计算滚动容器的展示宽高
+      // 计算滚动容器的展示宽高
       const {
         height: scrollBoxStyleHeight,
         maxHeight: scrollBoxStyleMaxHeight,
diff --git a/dbm-ui/frontend/src/components/system-search/Index.vue b/dbm-ui/frontend/src/components/system-search/Index.vue
index 25859686cf..c31ad7afba 100644
--- a/dbm-ui/frontend/src/components/system-search/Index.vue
+++ b/dbm-ui/frontend/src/components/system-search/Index.vue
@@ -142,10 +142,7 @@
     const query = Object.keys(options).reduce((prevQuery, optionKey) => {
       const optionItem = options[optionKey];
 
-      if (
-        optionItem !== ''
-        && !(Array.isArray(optionItem) && optionItem.length === 0)
-      ) {
+      if (optionItem !== '' && !(Array.isArray(optionItem) && optionItem.length === 0)) {
         if (Array.isArray(optionItem)) {
           return {
             ...prevQuery,
diff --git a/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/ClusterDomain.vue b/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/ClusterDomain.vue
index e1a9c07997..c372fe63f3 100644
--- a/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/ClusterDomain.vue
+++ b/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/ClusterDomain.vue
@@ -9,9 +9,7 @@
         <HightLightText
           :key-word="formattedKeyword"
           :text="item.immute_domain" />
-        <div class="intro">
-          ({{ t('域名') }})
-        </div>
+        <div class="intro">({{ t('域名') }})</div>
       </div>
       <div class="biz-text">
         {{ bizIdNameMap[item.bk_biz_id] }}
@@ -46,15 +44,17 @@
   const { t } = useI18n();
   const handleRedirect = useRedirect();
 
-  const formattedKeyword = computed(() => props.keyWord
-    .split(batchSplitRegex)
-    .map((item) => {
-      if (item.includes(':')) {
-        return item.split(':')[0];
-      }
-      return item;
-    })
-    .join(' '));
+  const formattedKeyword = computed(() =>
+    props.keyWord
+      .split(batchSplitRegex)
+      .map((item) => {
+        if (item.includes(':')) {
+          return item.split(':')[0];
+        }
+        return item;
+      })
+      .join(' '),
+  );
 
   const handleGo = (data: Props['data'][number]) => {
     systemSearchCache.appendItem(data.immute_domain);
diff --git a/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/ClusterName.vue b/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/ClusterName.vue
index ad15ab32d8..cbb03cb1ad 100644
--- a/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/ClusterName.vue
+++ b/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/ClusterName.vue
@@ -9,9 +9,7 @@
         <HightLightText
           :key-word="keyWord"
           :text="item.name" />
-        <div class="intro">
-          ({{ t('集群名') }}, {{ item.immute_domain }})
-        </div>
+        <div class="intro">({{ t('集群名') }}, {{ item.immute_domain }})</div>
       </div>
       <div class="biz-text">
         {{ bizIdNameMap[item.bk_biz_id] }}
diff --git a/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/Index.vue b/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/Index.vue
index 1c3244dd07..11f9d392aa 100644
--- a/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/Index.vue
+++ b/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/Index.vue
@@ -14,8 +14,8 @@
   import RenderTask from './Task.vue';
   import RenderTicket from './Ticket.vue';
 
-  interface Props{
-    name: string
+  interface Props {
+    name: string;
   }
 
   const props = defineProps<Props>();
diff --git a/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/Instance.vue b/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/Instance.vue
index 1809fb5569..98750ceadc 100644
--- a/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/Instance.vue
+++ b/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/Instance.vue
@@ -10,7 +10,8 @@
           :key-word="keyWord"
           :text="getMatchText(item)" />
         <div class="intro">
-          ({{ t('实例') }}<span v-if="item.cluster_domain">, {{ item.cluster_domain }}</span>)
+          ({{ t('实例') }}<span v-if="item.cluster_domain">, {{ item.cluster_domain }}</span
+          >)
         </div>
       </div>
       <div class="biz-text">
diff --git a/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/Machine.vue b/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/Machine.vue
index 3602c90e90..a8c86e266e 100644
--- a/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/Machine.vue
+++ b/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/Machine.vue
@@ -9,9 +9,7 @@
         <HightLightText
           :key-word="keyWord"
           :text="item.ip" />
-        <div class="intro">
-          ({{ t('主机') }})
-        </div>
+        <div class="intro">({{ t('主机') }})</div>
       </div>
       <div class="biz-text">
         {{ bizIdNameMap[item.bk_biz_id] }}
@@ -31,12 +29,12 @@
   interface Props {
     keyWord: string;
     data: {
-      bk_biz_id: number,
-      ip: string,
-      cluster_type: string,
-      cluster_id: number
-    }[],
-    bizIdNameMap: Record<number, string>
+      bk_biz_id: number;
+      ip: string;
+      cluster_type: string;
+      cluster_id: number;
+    }[];
+    bizIdNameMap: Record<number, string>;
   }
 
   defineProps<Props>();
diff --git a/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/ResourcePool.vue b/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/ResourcePool.vue
index f851c09404..ea14e37ce7 100644
--- a/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/ResourcePool.vue
+++ b/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/ResourcePool.vue
@@ -9,9 +9,7 @@
         <HightLightText
           :key-word="keyWord"
           :text="item.ip" />
-        <div class="intro">
-          ({{ t('资源池主机') }})
-        </div>
+        <div class="intro">({{ t('资源池主机') }})</div>
       </div>
       <div class="biz-text">
         {{ t('资源池') }}
@@ -29,10 +27,10 @@
   import HightLightText from './components/HightLightText.vue';
 
   interface Props {
-    keyWord: string,
+    keyWord: string;
     data: {
-      ip: string,
-    }[],
+      ip: string;
+    }[];
   }
 
   defineProps<Props>();
diff --git a/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/Task.vue b/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/Task.vue
index add9e3804a..790a7fdd89 100644
--- a/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/Task.vue
+++ b/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/Task.vue
@@ -10,9 +10,7 @@
         <HightLightText
           :key-word="keyWord"
           :text="item.root_id" />
-        <div class="intro">
-          ({{ t('任务ID') }})
-        </div>
+        <div class="intro">({{ t('任务ID') }})</div>
       </div>
       <div class="biz-text">
         {{ bizIdNameMap[item.bk_biz_id] }}
diff --git a/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/Ticket.vue b/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/Ticket.vue
index b66a8cf507..a74de364e6 100644
--- a/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/Ticket.vue
+++ b/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/Ticket.vue
@@ -10,9 +10,7 @@
         <HightLightText
           :key-word="keyWord"
           :text="`${item.id}`" />
-        <div class="intro">
-          ({{ t('单据') }})
-        </div>
+        <div class="intro">({{ t('单据') }})</div>
       </div>
       <div class="biz-text">
         {{ bizIdNameMap[item.bk_biz_id] }}
diff --git a/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/components/HightLightText.vue b/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/components/HightLightText.vue
index 4cda72903e..259ebfdd96 100644
--- a/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/components/HightLightText.vue
+++ b/dbm-ui/frontend/src/components/system-search/components/search-result/render-result/components/HightLightText.vue
@@ -53,11 +53,11 @@
       if (props.text.includes(':')) {
         const substringList = keyWordItem.split(':');
         const regex = new RegExp(`(${keyWordItem.split(':').join('|')})`);
-        const matchResult = props.text.split(regex).map(part => ({
+        const matchResult = props.text.split(regex).map((part) => ({
           text: part,
           isHighlight: substringList.includes(part),
         }));
-        if (matchResult.some(matchItem => matchItem.isHighlight)) {
+        if (matchResult.some((matchItem) => matchItem.isHighlight)) {
           return matchResult;
         }
       }
diff --git a/dbm-ui/frontend/src/components/system-search/hooks/useKeyboard.ts b/dbm-ui/frontend/src/components/system-search/hooks/useKeyboard.ts
index 54bd6f5309..b5d98bc32b 100644
--- a/dbm-ui/frontend/src/components/system-search/hooks/useKeyboard.ts
+++ b/dbm-ui/frontend/src/components/system-search/hooks/useKeyboard.ts
@@ -1,7 +1,11 @@
 import _ from 'lodash';
 import { onBeforeUnmount, onMounted, type Ref, ref } from 'vue';
 
-export default (rootEle: Ref<HTMLElement|undefined>, panelEle: Ref<HTMLElement|undefined>, inputType: 'input'|'textarea' = 'input') => {
+export default (
+  rootEle: Ref<HTMLElement | undefined>,
+  panelEle: Ref<HTMLElement | undefined>,
+  inputType: 'input' | 'textarea' = 'input',
+) => {
   const activeIndex = ref(-1);
 
   const handleKeydown = _.throttle((event: KeyboardEvent) => {
@@ -14,7 +18,7 @@ export default (rootEle: Ref<HTMLElement|undefined>, panelEle: Ref<HTMLElement|u
       return;
     }
 
-    const index = _.findIndex(resultItemElList, el => el.classList.contains('active'));
+    const index = _.findIndex(resultItemElList, (el) => el.classList.contains('active'));
     if (event.code === 'Enter' && !event.shiftKey) {
       event.preventDefault();
       event.stopPropagation();
@@ -40,7 +44,7 @@ export default (rootEle: Ref<HTMLElement|undefined>, panelEle: Ref<HTMLElement|u
     }
 
     activeIndex.value = nextIndex;
-    resultItemElList.forEach(ele => ele.classList.remove('active'));
+    resultItemElList.forEach((ele) => ele.classList.remove('active'));
     if (nextIndex > -1) {
       resultItemElList[nextIndex].classList.add('active');
     }
@@ -52,10 +56,10 @@ export default (rootEle: Ref<HTMLElement|undefined>, panelEle: Ref<HTMLElement|u
       const activeOffsetTop = (panelEle.value!.querySelector('.active') as HTMLElement).offsetTop;
 
       if (activeOffsetTop + 32 > wraperHeight) {
-      // eslint-disable-next-line no-param-reassign
+        // eslint-disable-next-line no-param-reassign
         panelEle.value!.querySelector('.scroll-faker-content')!.scrollTop = activeOffsetTop - wraperHeight + 64;
       } else if (activeOffsetTop <= 42) {
-      // eslint-disable-next-line no-param-reassign
+        // eslint-disable-next-line no-param-reassign
         panelEle.value!.querySelector('.scroll-faker-content')!.scrollTop = 0;
       }
     });
@@ -65,9 +69,9 @@ export default (rootEle: Ref<HTMLElement|undefined>, panelEle: Ref<HTMLElement|u
     const target = event.target as HTMLElement;
     if (target.classList.contains('result-item')) {
       const resultItemElList = panelEle.value!.querySelectorAll('.result-item');
-      resultItemElList.forEach(ele => ele.classList.remove('active'));
+      resultItemElList.forEach((ele) => ele.classList.remove('active'));
       target.classList.add('active');
-      activeIndex.value = _.findIndex(resultItemElList, ele => ele === target);
+      activeIndex.value = _.findIndex(resultItemElList, (ele) => ele === target);
     }
   }, 100);
 
diff --git a/dbm-ui/frontend/src/components/tools-page-title/index.vue b/dbm-ui/frontend/src/components/tools-page-title/index.vue
deleted file mode 100644
index 30200f27e3..0000000000
--- a/dbm-ui/frontend/src/components/tools-page-title/index.vue
+++ /dev/null
@@ -1,72 +0,0 @@
-<!--
- * TencentBlueKing is pleased to support the open source community by making 蓝鲸智云-DB管理系统(BlueKing-BK-DBM) available.
- *
- * Copyright (C) 2017-2023 THL A29 Limited, a Tencent company. All rights reserved.
- *
- * Licensed under the MIT License (the "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License athttps://opensource.org/licenses/MIT
- *
- * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed
- * on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for
- * the specific language governing permissions and limitations under the License.
--->
-
-<template>
-  <div class="toolbox-title-box">
-    <span class="title">{{ toolboxTitle }}</span>
-    <slot />
-  </div>
-</template>
-
-<script setup lang="ts">
-  import type { RouteRecordRaw } from 'vue-router';
-
-  interface Props {
-    toolboxRoutes: RouteRecordRaw[];
-  }
-
-  const props = defineProps<Props>();
-
-  const route = useRoute();
-
-  const toolboxTitle = ref('');
-
-  const titleMap = computed(() =>
-    props.toolboxRoutes.reduce(
-      (results, item) => {
-        Object.assign(results, {
-          [item.name as string]: item.meta?.navName,
-        });
-        return results;
-      },
-      {} as Record<string, string>,
-    ),
-  );
-
-  watch(
-    () => route.name,
-    (name) => {
-      toolboxTitle.value = titleMap.value[name as string];
-    },
-    {
-      immediate: true,
-    },
-  );
-</script>
-
-<style lang="less" scoped>
-  .toolbox-title-box {
-    display: flex;
-    width: 100%;
-    height: 54px;
-    padding: 0 24px;
-    align-items: center;
-
-    .title {
-      margin-right: 8px;
-      font-size: 14px;
-      font-weight: 700;
-      color: #313238;
-    }
-  }
-</style>
diff --git a/dbm-ui/frontend/src/components/vue2/search-select/index.vue b/dbm-ui/frontend/src/components/vue2/search-select/index.vue
index 4dce963b81..410929a50d 100644
--- a/dbm-ui/frontend/src/components/vue2/search-select/index.vue
+++ b/dbm-ui/frontend/src/components/vue2/search-select/index.vue
@@ -41,26 +41,25 @@
 </script>
 
 <script setup lang="tsx">
-
   interface Props {
-    appKey?: string,
-    data?: SearchData[],
+    appKey?: string;
+    data?: SearchData[];
     // eslint-disable-next-line vue/no-unused-properties
-    placeholder?: string,
+    placeholder?: string;
     // eslint-disable-next-line vue/no-unused-properties
-    clearable?: boolean,
+    clearable?: boolean;
     // eslint-disable-next-line vue/no-unused-properties
-    showCondition?: boolean,
+    showCondition?: boolean;
     // ----- 自定义属性 -------
     // data 是否可重复选择
-    isRepeat?: boolean,
+    isRepeat?: boolean;
     // 是否允许自定义输入内容
-    isCustom?: boolean,
+    isCustom?: boolean;
   }
 
   interface Emits {
-    (e: 'change', value: SearchValue[]): void
-    (e: 'clear'): void
+    (e: 'change', value: SearchValue[]): void;
+    (e: 'clear'): void;
   }
 
   const props = withDefaults(defineProps<Props>(), {
@@ -90,48 +89,54 @@
       return props.data;
     }
 
-    const selected = modelValue.value.map(value => value.id);
-    return props.data.filter(item => !selected.includes(item.id));
+    const selected = modelValue.value.map((value) => value.id);
+    return props.data.filter((item) => !selected.includes(item.id));
   });
 
-  watch(modelValue, (values) => {
-    const len = values.length;
-    if (props.isCustom === false && len > 0) {
-      const last = values[len - 1];
-      const valueIds = values.map(item => item.id);
-      const conditionIds = props.data.map(item => item.id);
-      const [firstId] = conditionIds;
-      // 自定义输入内容默认替换成 props.data 第一个选项
-      if (!conditionIds.includes(last.id)) {
-        const cloneValues = _.cloneDeep(values);
-        const index = valueIds.findIndex(id => id === firstId);
-        const { id, name } = props.data[0];
-        const item = {
-          id,
-          name,
-          values: [{
-            id: last.id,
-            name: last.id,
-          }],
-        };
-        if (index > -1) {
-          cloneValues.splice(len - 1, 1);
-          cloneValues.splice(index, 1);
-          cloneValues.push(item);
-        } else {
-          cloneValues.splice(len - 1, 1, item);
+  watch(
+    modelValue,
+    (values) => {
+      const len = values.length;
+      if (props.isCustom === false && len > 0) {
+        const last = values[len - 1];
+        const valueIds = values.map((item) => item.id);
+        const conditionIds = props.data.map((item) => item.id);
+        const [firstId] = conditionIds;
+        // 自定义输入内容默认替换成 props.data 第一个选项
+        if (!conditionIds.includes(last.id)) {
+          const cloneValues = _.cloneDeep(values);
+          const index = valueIds.findIndex((id) => id === firstId);
+          const { id, name } = props.data[0];
+          const item = {
+            id,
+            name,
+            values: [
+              {
+                id: last.id,
+                name: last.id,
+              },
+            ],
+          };
+          if (index > -1) {
+            cloneValues.splice(len - 1, 1);
+            cloneValues.splice(index, 1);
+            cloneValues.push(item);
+          } else {
+            cloneValues.splice(len - 1, 1, item);
+          }
+          modelValue.value = cloneValues;
         }
-        modelValue.value = cloneValues;
       }
-    }
-    handleChangeVueData();
+      handleChangeVueData();
 
-    // 控制 search-select 显示 popover 内容
-    compInstance.value?.hidePopper();
-    nextTick(() => {
-      filterData.value.length > 0 && compInstance.value?.showMenu();
-    });
-  }, { deep: true });
+      // 控制 search-select 显示 popover 内容
+      compInstance.value?.hidePopper();
+      nextTick(() => {
+        filterData.value.length > 0 && compInstance.value?.showMenu();
+      });
+    },
+    { deep: true },
+  );
 
   /**
    * 修改 vue2 实例数据
@@ -143,7 +148,6 @@
     }
   };
 
-
   onMounted(async () => {
     const { VITE_PUBLIC_PATH } = window.PROJECT_ENV;
     await loadInstance({
diff --git a/dbm-ui/frontend/src/directives/dbConsole.ts b/dbm-ui/frontend/src/directives/dbConsole.ts
index b2d55cb295..1980cef102 100644
--- a/dbm-ui/frontend/src/directives/dbConsole.ts
+++ b/dbm-ui/frontend/src/directives/dbConsole.ts
@@ -23,20 +23,20 @@ import { checkDbConsole } from '@utils';
  */
 function init(el: HTMLElement, binding: DirectiveBinding<ExtractedControllerDataKeys>) {
   const { value } = binding;
-  
+
   if (!value || checkDbConsole(value)) {
     return;
   }
-  
+
   // 不在 function_controller 范围内，用空节点替换
-  const substitudeElement = document.createElement("span");
-  const tempParentNode = document.createElement('node')
+  const substitudeElement = document.createElement('span');
+  const tempParentNode = document.createElement('node');
   el.parentNode?.replaceChild(substitudeElement, el);
-  tempParentNode.appendChild(el)
+  tempParentNode.appendChild(el);
 }
 
 export default {
   mounted(el: HTMLElement, binding: DirectiveBinding) {
     init(el, binding);
-  }
+  },
 };
diff --git a/dbm-ui/frontend/src/directives/overflowTips.ts b/dbm-ui/frontend/src/directives/overflowTips.ts
index a90dcb68ef..8412730432 100644
--- a/dbm-ui/frontend/src/directives/overflowTips.ts
+++ b/dbm-ui/frontend/src/directives/overflowTips.ts
@@ -9,8 +9,7 @@
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed
  * on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for
  * the specific language governing permissions and limitations under the License.
-*/
-
+ */
 
 import type { Instance, Props } from 'tippy.js';
 import type { DirectiveBinding } from 'vue';
@@ -43,7 +42,9 @@ const placements = [
  * @returns
  */
 export function checkOverflow(el: Element) {
-  if (!el) return false;
+  if (!el) {
+    return false;
+  }
 
   const createDom = (el: Element, css: CSSStyleDeclaration) => {
     const dom = document.createElement('div');
@@ -79,7 +80,6 @@ export function checkOverflow(el: Element) {
   return isOverflow;
 }
 
-
 function beforeShow(instance: Instance) {
   const { reference } = instance;
   // eslint-disable-next-line no-underscore-dangle
@@ -101,10 +101,16 @@ function setupOnShow(props: TippyProps, customProps: TippyProps) {
   props.onShow = (instance) => {
     if (typeof customProps.onShow === 'function') {
       const result = customProps.onShow(instance);
-      if (!result) return false;
+
+      if (!result) {
+        return false;
+      }
     }
     const isShow = beforeShow(instance);
-    if (!isShow) return false;
+
+    if (!isShow) {
+      return false;
+    }
   };
 }
 
@@ -120,8 +126,11 @@ function setupTheme(props: TippyProps, customProps: TippyProps) {
 function formatModifiers(modifiers: Record<string, boolean>) {
   const keys = Object.entries(modifiers)
     // .filter(([key, value]) => value)
-    .map(item => item[0]);
-  if (keys.length === 0) return {};
+    .map((item) => item[0]);
+
+  if (keys.length === 0) {
+    return {};
+  }
 
   const props: Record<string, any> = {};
   // 设置 placement
@@ -174,5 +183,4 @@ const overflowTips = {
   },
 };
 
-
 export default overflowTips;
diff --git a/dbm-ui/frontend/src/hooks/useBeforeClose.ts b/dbm-ui/frontend/src/hooks/useBeforeClose.ts
index fe618afeca..b93aa98bed 100644
--- a/dbm-ui/frontend/src/hooks/useBeforeClose.ts
+++ b/dbm-ui/frontend/src/hooks/useBeforeClose.ts
@@ -22,7 +22,7 @@ export const useBeforeClose = () =>
   function sideSilderbeforeClose(flag?: boolean) {
     const closable = flag ?? window.changeConfirm;
     if (closable) {
-      return new Promise((resolve) => {
+      return new Promise<boolean>((resolve) => {
         InfoBox({
           title: t('确认离开当前页'),
           content: t('离开将会导致未保存信息丢失'),
diff --git a/dbm-ui/frontend/src/hooks/useCopyFromSelection.ts b/dbm-ui/frontend/src/hooks/useCopyFromSelection.ts
index 192c6dbd06..ca344afc75 100644
--- a/dbm-ui/frontend/src/hooks/useCopyFromSelection.ts
+++ b/dbm-ui/frontend/src/hooks/useCopyFromSelection.ts
@@ -14,7 +14,7 @@ import { useCopy } from '@hooks';
 
 export const useCopyFromSelection = () => {
   const copy = useCopy();
-  
+
   return () => {
     const selection = window.getSelection();
     if (selection) {
@@ -23,5 +23,5 @@ export const useCopyFromSelection = () => {
         copy(selectedText);
       }
     }
-  }
-}
+  };
+};
diff --git a/dbm-ui/frontend/src/hooks/useStickyFooter.ts b/dbm-ui/frontend/src/hooks/useStickyFooter.ts
index 212a329707..080347a178 100644
--- a/dbm-ui/frontend/src/hooks/useStickyFooter.ts
+++ b/dbm-ui/frontend/src/hooks/useStickyFooter.ts
@@ -9,20 +9,16 @@
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed
  * on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for
  * the specific language governing permissions and limitations under the License.
-*/
+ */
 
 import { getCurrentScope, onScopeDispose, type Ref } from 'vue';
 
-import {
-  type MaybeElementRef,
-  unrefElement,
-  useResizeObserver,
-} from '@vueuse/core';
+import { type MaybeElementRef, unrefElement, useResizeObserver } from '@vueuse/core';
 
 function getFooter(el: HTMLElement) {
   const nodes = Array.from(el.parentElement?.children || []) as Array<HTMLElement>;
 
-  return nodes.find(child => child.className.includes('bk-modal-footer'));
+  return nodes.find((child) => child.className.includes('bk-modal-footer'));
 }
 
 /**
@@ -33,27 +29,34 @@ export const useStickyFooter = (
   footerTarget?: MaybeElementRef,
   stickyClass = 'is-sticky-footer',
 ): {
-    isTriggered: Ref<boolean>,
-    stop: () => void,
-  } => {
+  isTriggered: Ref<boolean>;
+  stop: () => void;
+} => {
   const isTriggered = ref(false);
 
-  const stop = watch(() => unrefElement(target), (el) => {
-    const content = el?.closest?.('.bk-modal-content') as HTMLElement;
-    if (content) {
-      const footer = unrefElement(footerTarget) ?? getFooter(content);
-      if (footer === undefined) return;
+  const stop = watch(
+    () => unrefElement(target),
+    (el) => {
+      const content = el?.closest?.('.bk-modal-content') as HTMLElement;
+      if (content) {
+        const footer = unrefElement(footerTarget) ?? getFooter(content);
 
-      useResizeObserver(content, () => {
-        isTriggered.value = content.scrollHeight !== content.offsetHeight;
-        if (isTriggered.value) {
-          footer.classList.add(stickyClass);
-        } else {
-          footer.classList.remove(stickyClass);
+        if (footer === undefined) {
+          return;
         }
-      });
-    }
-  }, { immediate: true, flush: 'post' });
+
+        useResizeObserver(content, () => {
+          isTriggered.value = content.scrollHeight !== content.offsetHeight;
+          if (isTriggered.value) {
+            footer.classList.add(stickyClass);
+          } else {
+            footer.classList.remove(stickyClass);
+          }
+        });
+      }
+    },
+    { immediate: true, flush: 'post' },
+  );
 
   if (getCurrentScope()) {
     onScopeDispose(stop);
diff --git a/dbm-ui/frontend/src/hooks/useTableSettings.ts b/dbm-ui/frontend/src/hooks/useTableSettings.ts
index 2ea0c0f920..b89dff3700 100644
--- a/dbm-ui/frontend/src/hooks/useTableSettings.ts
+++ b/dbm-ui/frontend/src/hooks/useTableSettings.ts
@@ -9,7 +9,7 @@
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed
  * on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for
  * the specific language governing permissions and limitations under the License.
-*/
+ */
 
 import type { Settings } from 'bkui-vue/lib/table/props';
 import _ from 'lodash';
@@ -37,7 +37,7 @@ export const useTableSettings = (key: string, defaultSettings: Settings) => {
       // 获取后续新增字段
       const newFields = [];
       const defaultFields = defaultSettings.fields || [];
-      const updateFields = (updateSettings.fields || []).map(item => item.field);
+      const updateFields = (updateSettings.fields || []).map((item) => item.field);
       for (const item of defaultFields) {
         // 新增字段
         if (item.field && !updateFields.includes(item.field)) {
@@ -59,12 +59,12 @@ export const useTableSettings = (key: string, defaultSettings: Settings) => {
           const defaultChecked = defaultSettings.checked || [];
           // 必须勾选项
           const disabledFieldsChecked = (defaultSettings.fields || [])
-            .filter(item => item.field && item.disabled)
-            .map(item => item.field as string);
+            .filter((item) => item.field && item.disabled)
+            .map((item) => item.field as string);
           // 新增字段默认勾选项
           const newFieldsChecked = newFields
-            .filter(item => item.field && defaultChecked.includes(item.field))
-            .map(item => item.field as string);
+            .filter((item) => item.field && defaultChecked.includes(item.field))
+            .map((item) => item.field as string);
 
           Object.assign(values, {
             [settingKey]: _.uniq(checked.concat(disabledFieldsChecked, newFieldsChecked)),
@@ -93,16 +93,18 @@ export const useTableSettings = (key: string, defaultSettings: Settings) => {
    */
   function updateTableSettings(updateSettings: Settings) {
     const newSettings = getSettings(updateSettings);
-    newSettings.fields = newSettings.fields?.map(item => ({
+    newSettings.fields = newSettings.fields?.map((item) => ({
       field: item.field,
     }));
-    userProfileStore.updateProfile({
-      label: key,
-      values: newSettings,
-    }).then(() => {
-      newSettings.fields = defaultSettings.fields;
-      settings.value = newSettings;
-    });
+    userProfileStore
+      .updateProfile({
+        label: key,
+        values: newSettings,
+      })
+      .then(() => {
+        newSettings.fields = defaultSettings.fields;
+        settings.value = newSettings;
+      });
   }
 
   return {
diff --git a/dbm-ui/frontend/src/hooks/useTicketCloneInfo/generateCloneData/mysql/authorizeRule.ts b/dbm-ui/frontend/src/hooks/useTicketCloneInfo/generateCloneData/mysql/authorizeRule.ts
index acba417e67..388930ded0 100644
--- a/dbm-ui/frontend/src/hooks/useTicketCloneInfo/generateCloneData/mysql/authorizeRule.ts
+++ b/dbm-ui/frontend/src/hooks/useTicketCloneInfo/generateCloneData/mysql/authorizeRule.ts
@@ -21,46 +21,46 @@ import { ClusterTypes } from '@common/const';
 // Mysql 集群授权
 export async function generateMysqlAuthorizeRuleCloneData(ticketData: TicketModel<MysqlAuthorizationDetails>) {
   const { authorize_data: authorizeData } = ticketData.details;
-  const sourceIpList: ServiceReturnType<typeof checkHost> = []
+  const sourceIpList: ServiceReturnType<typeof checkHost> = [];
   if (authorizeData.source_ips && Array.isArray(authorizeData.source_ips)) {
     const checkIpInfo = await checkHost({
-      ip_list: ticketData.details.authorize_data.source_ips!.map(item => item.ip),
+      ip_list: ticketData.details.authorize_data.source_ips!.map((item) => item.ip),
       scope_list: [
         {
-          scope_type: "biz",
+          scope_type: 'biz',
           scope_id: ticketData.bk_biz_id,
-        }
-      ]
+        },
+      ],
     });
     sourceIpList.push(...checkIpInfo);
   }
 
   const clusterList: {
-    master_domain: string,
-    cluster_name: string,
+    master_domain: string;
+    cluster_name: string;
   }[] = [];
 
   if (authorizeData.cluster_type === ClusterTypes.TENDBHA) {
     const clustersResult = await getTendbhaList({
       cluster_ids: authorizeData.cluster_ids,
       limit: -1,
-      offset: 0
+      offset: 0,
     });
     clusterList.push(...clustersResult.results);
   } else if (authorizeData.cluster_type === ClusterTypes.TENDBSINGLE) {
     const clustersResult = await getTendbsingleList({
       cluster_ids: authorizeData.cluster_ids,
       limit: -1,
-      offset: 0
+      offset: 0,
     });
     clusterList.push(...clustersResult.results);
   }
 
-  return ({
+  return {
     clusterType: authorizeData.cluster_type as ClusterTypes,
     clusterList,
     dbs: authorizeData.access_dbs,
     sourceIpList,
     user: authorizeData.user,
-  });
+  };
 }
diff --git a/dbm-ui/frontend/src/layout/components/AppSelect.vue b/dbm-ui/frontend/src/layout/components/AppSelect.vue
index 68d1366075..2ad5ab866a 100644
--- a/dbm-ui/frontend/src/layout/components/AppSelect.vue
+++ b/dbm-ui/frontend/src/layout/components/AppSelect.vue
@@ -9,37 +9,26 @@
 </template>
 <script setup lang="ts">
   import _ from 'lodash';
-  import {
-    computed,
-  } from 'vue';
-  import {
-    useRoute,
-    useRouter,
-  } from 'vue-router';
+  import { computed } from 'vue';
+  import { useRoute, useRouter } from 'vue-router';
 
   import { getBizs } from '@services/source/cmdb';
 
-  import {
-    useGlobalBizs,
-  } from '@stores';
+  import { useGlobalBizs } from '@stores';
 
   import DbAppSelect from '@components/db-app-select/Index.vue';
 
-  type IAppItem = ServiceReturnType<typeof getBizs>[number]
+  type IAppItem = ServiceReturnType<typeof getBizs>[number];
 
   const route = useRoute();
   const router = useRouter();
 
-  const {
-    bizs: bizList,
-  } = useGlobalBizs();
+  const { bizs: bizList } = useGlobalBizs();
 
-  const currentBiz = computed(() => _.find(bizList, item => item.bk_biz_id === window.PROJECT_CONFIG.BIZ_ID));
+  const currentBiz = computed(() => _.find(bizList, (item) => item.bk_biz_id === window.PROJECT_CONFIG.BIZ_ID));
 
   const handleAppChange = (appInfo: IAppItem) => {
-    const {
-      bk_biz_id: bkBizId,
-    } = appInfo;
+    const { bk_biz_id: bkBizId } = appInfo;
 
     const pathRoot = `/${bkBizId}`;
     if (!window.PROJECT_CONFIG.BIZ_ID) {
@@ -75,10 +64,7 @@
     }
 
     // 路由有多层嵌套
-    const {
-      path,
-      redirect,
-    } = matched[1];
+    const { path, redirect } = matched[1];
     // 重定向到指定的路由path
     if (_.isString(redirect)) {
       reload(redirect);
@@ -86,7 +72,7 @@
     }
     // 重定向到指定的路由name
     if (redirect && _.isPlainObject(redirect)) {
-      const redirectName = (redirect as {name: string}).name;
+      const redirectName = (redirect as { name: string }).name;
       if (redirectName) {
         const route = router.resolve({
           name: redirectName,
diff --git a/dbm-ui/frontend/src/layout/components/ResourceManage.vue b/dbm-ui/frontend/src/layout/components/ResourceManage.vue
index f808baf14e..d187047bf5 100644
--- a/dbm-ui/frontend/src/layout/components/ResourceManage.vue
+++ b/dbm-ui/frontend/src/layout/components/ResourceManage.vue
@@ -29,7 +29,9 @@
           {{ t('DB 资源池管理') }}
         </span>
       </BkMenuItem>
-      <BkMenuItem key="resourcePoolDirtyMachines" v-db-console="'resourceManage.dirtyHostManage'">
+      <BkMenuItem
+        key="resourcePoolDirtyMachines"
+        v-db-console="'resourceManage.dirtyHostManage'">
         <template #icon>
           <DbIcon type="dirty-host" />
         </template>
@@ -39,7 +41,9 @@
           {{ t('污点主机处理') }}
         </span>
       </BkMenuItem>
-      <BkMenuItem key="resourcePoolOperationRecord" v-db-console="'resourceManage.resourceOperationRecord'">
+      <BkMenuItem
+        key="resourcePoolOperationRecord"
+        v-db-console="'resourceManage.resourceOperationRecord'">
         <template #icon>
           <DbIcon type="list" />
         </template>
diff --git a/dbm-ui/frontend/src/main.ts b/dbm-ui/frontend/src/main.ts
index df5a79e2b8..d621e8f7dc 100644
--- a/dbm-ui/frontend/src/main.ts
+++ b/dbm-ui/frontend/src/main.ts
@@ -80,9 +80,5 @@ window.addEventListener('beforeunload', (event) => {
   if (e) {
     e.returnValue = '离开将会导致未保存信息丢失';
   }
-  // 如果是通过登录触发提示，则关闭登录 dialog
-  if (window.login.isShow) {
-    window.login.hideLogin();
-  }
   return '离开将会导致未保存信息丢失';
 });
diff --git a/dbm-ui/frontend/src/services/http/lib/utils.ts b/dbm-ui/frontend/src/services/http/lib/utils.ts
index 8d27c2b20a..07dbbb71af 100644
--- a/dbm-ui/frontend/src/services/http/lib/utils.ts
+++ b/dbm-ui/frontend/src/services/http/lib/utils.ts
@@ -9,7 +9,7 @@
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed
  * on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for
  * the specific language governing permissions and limitations under the License.
-*/
+ */
 
 // utils is a library of generic helper functions non-specific to axios
 
@@ -53,7 +53,7 @@ function isDate(val: any): boolean {
  * @param {Object|Array} obj The object to iterate
  * @param {Function} fn The callback to invoke for each item
  */
-function forEach(obj: any, fn:any) {
+function forEach(obj: any, fn: any) {
   // Don't bother if no value provided
   if (obj === null || typeof obj === 'undefined') {
     return;
@@ -69,49 +69,49 @@ function forEach(obj: any, fn:any) {
     // Iterate over array values
     for (let i = 0, l = obj.length; i < l; i++) {
       /* eslint-disable */
-            fn.call(null, obj[i], i, obj)
-        }
-    } else {
+      fn.call(null, obj[i], i, obj);
+    }
+  } else {
     // Iterate over object keys
-        for (const key in obj) {
-            if (Object.prototype.hasOwnProperty.call(obj, key)) {
-                fn.call(null, obj[key], key, obj)
-            }
-        }
+    for (const key in obj) {
+      if (Object.prototype.hasOwnProperty.call(obj, key)) {
+        fn.call(null, obj[key], key, obj);
+      }
     }
+  }
 }
 
-function encode (val: string) {
-    return encodeURIComponent(val)
-        .replace(/%40/gi, '@')
-        .replace(/%3A/gi, ':')
-        .replace(/%24/g, '$')
-        .replace(/%2C/gi, ',')
-        .replace(/%20/g, '+')
+function encode(val: string) {
+  return encodeURIComponent(val)
+    .replace(/%40/gi, '@')
+    .replace(/%3A/gi, ':')
+    .replace(/%24/g, '$')
+    .replace(/%2C/gi, ',')
+    .replace(/%20/g, '+');
 }
 export const paramsSerializer = (params: any) => {
-    const parts: string[] = []
+  const parts: string[] = [];
 
-    forEach(params, function serialize (val:any, key:any) {
-        if (val === null || typeof val === 'undefined') {
-            return
-        }
+  forEach(params, function serialize(val: any, key: any) {
+    if (val === null || typeof val === 'undefined') {
+      return;
+    }
 
-        if (isArray(val)) {
-            key = key + '[]'
-        } else {
-            val = [val]
-        }
+    if (isArray(val)) {
+      key = key + '[]';
+    } else {
+      val = [val];
+    }
 
-        forEach(val, function parseValue (v:any) {
-            if (isDate(v)) {
-                v = v.toISOString()
-            } else if (isObject(v)) {
-                v = JSON.stringify(v)
-            }
-            parts.push(encode(key) + '=' + encode(v))
-        })
-    })
+    forEach(val, function parseValue(v: any) {
+      if (isDate(v)) {
+        v = v.toISOString();
+      } else if (isObject(v)) {
+        v = JSON.stringify(v);
+      }
+      parts.push(encode(key) + '=' + encode(v));
+    });
+  });
 
-    return parts.join('&')
-}
+  return parts.join('&');
+};
diff --git a/dbm-ui/frontend/src/services/model/es/es-node.ts b/dbm-ui/frontend/src/services/model/es/es-node.ts
index 5651601762..8327b55e4c 100644
--- a/dbm-ui/frontend/src/services/model/es/es-node.ts
+++ b/dbm-ui/frontend/src/services/model/es/es-node.ts
@@ -9,8 +9,9 @@
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed
  * on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for
  * the specific language governing permissions and limitations under the License.
-*/
+ */
 import { utcDisplayTime } from '@utils';
+
 export default class EsNode {
   static ROLE_MASTER = 'es_master';
   static ROLE_CLIENT = 'es_client';
diff --git a/dbm-ui/frontend/src/services/model/hdfs/hdfs-node.ts b/dbm-ui/frontend/src/services/model/hdfs/hdfs-node.ts
index e3b4e2852b..446f8d70c3 100644
--- a/dbm-ui/frontend/src/services/model/hdfs/hdfs-node.ts
+++ b/dbm-ui/frontend/src/services/model/hdfs/hdfs-node.ts
@@ -9,7 +9,7 @@
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed
  * on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for
  * the specific language governing permissions and limitations under the License.
-*/
+ */
 import { utcDisplayTime } from '@utils';
 
 export default class HdfsNode {
diff --git a/dbm-ui/frontend/src/services/model/kafka/kafka-node.ts b/dbm-ui/frontend/src/services/model/kafka/kafka-node.ts
index 67ad92363d..d76df788a3 100644
--- a/dbm-ui/frontend/src/services/model/kafka/kafka-node.ts
+++ b/dbm-ui/frontend/src/services/model/kafka/kafka-node.ts
@@ -9,7 +9,7 @@
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed
  * on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for
  * the specific language governing permissions and limitations under the License.
-*/
+ */
 import { utcDisplayTime } from '@utils';
 
 export default class KafkaNode {
diff --git a/dbm-ui/frontend/src/services/model/mongodb/mongodb-detail.ts b/dbm-ui/frontend/src/services/model/mongodb/mongodb-detail.ts
index e3912558b1..a0fe5bd058 100644
--- a/dbm-ui/frontend/src/services/model/mongodb/mongodb-detail.ts
+++ b/dbm-ui/frontend/src/services/model/mongodb/mongodb-detail.ts
@@ -9,7 +9,7 @@
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed
  * on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for
  * the specific language governing permissions and limitations under the License.
-*/
+ */
 
 import { TicketTypes } from '@common/const';
 
@@ -29,28 +29,28 @@ interface MongoInstance {
   port: number;
   role?: string;
   spec_config: {
-    id: number,
+    id: number;
     cpu: {
-      max: number,
-      min: number
-    },
+      max: number;
+      min: number;
+    };
     mem: {
-      max: number,
-      min: number
-    },
+      max: number;
+      min: number;
+    };
     qps: {
-      max: number,
-      min: number
-    },
-    name: string,
-    count: number,
-    device_class: string[],
+      max: number;
+      min: number;
+    };
+    name: string;
+    count: number;
+    device_class: string[];
     storage_spec: {
-      size: number,
-      type: string,
-      mount_point: string
-    }[]
-  }
+      size: number;
+      type: string;
+      mount_point: string;
+    }[];
+  };
   status: string;
 }
 
@@ -78,19 +78,19 @@ export default class MongodbDetail {
     role: string;
     entry: string;
     target_details: {
-      app: string,
-      bk_cloud_iduid: number,
-      dns_str: string,
-      domain_name: string,
-      domain_typeuid: number,
-      ip: string,
-      last_change_time: string,
-      manager: string,
-      port: number,
-      remark: string,
-      start_time: string,
-      status: string,
-      uid: number,
+      app: string;
+      bk_cloud_iduid: number;
+      dns_str: string;
+      domain_name: string;
+      domain_typeuid: number;
+      ip: string;
+      last_change_time: string;
+      manager: string;
+      port: number;
+      remark: string;
+      start_time: string;
+      status: string;
+      uid: number;
     }[];
   }[];
   cluster_id: number;
@@ -110,36 +110,36 @@ export default class MongodbDetail {
     cluster_type: string;
     create_at: string;
     host_info?: {
-      alive: number,
+      alive: number;
       biz: {
-        id: number,
-        name: string
-      },
+        id: number;
+        name: string;
+      };
       cloud_area: {
-        id: number,
-        name: string
-      },
-      cloud_id: number,
-      host_id: number,
-      host_name?: string,
-      ip: string,
-      ipv6: string,
+        id: number;
+        name: string;
+      };
+      cloud_id: number;
+      host_id: number;
+      host_name?: string;
+      ip: string;
+      ipv6: string;
       meta: {
-        bk_biz_id: number,
-        scope_id: number,
-        scope_type: string
-      },
-      scope_id: string,
-      scope_type: string,
-      os_name: string,
-      bk_cpu?: number,
-      bk_disk?: number,
-      bk_mem?: number,
-      os_type: string,
-      agent_id: number,
-      cpu: string,
-      cloud_vendor: string,
-      bk_idc_name?: string,
+        bk_biz_id: number;
+        scope_id: number;
+        scope_type: string;
+      };
+      scope_id: string;
+      scope_type: string;
+      os_name: string;
+      bk_cpu?: number;
+      bk_disk?: number;
+      bk_mem?: number;
+      os_type: string;
+      agent_id: number;
+      cpu: string;
+      cloud_vendor: string;
+      bk_idc_name?: string;
     };
     instance_address: string;
     ip: string;
@@ -173,12 +173,12 @@ export default class MongodbDetail {
   mongos: MongoInstance[];
   mongo_config: MongoInstance[];
   operations: {
-    cluster_id: number,
-    flow_id: number,
-    status: string,
-    ticket_id: number,
-    ticket_type: string,
-    title: string,
+    cluster_id: number;
+    flow_id: number;
+    status: string;
+    ticket_id: number;
+    ticket_type: string;
+    title: string;
   }[];
   phase: string;
   phase_name: string;
@@ -191,22 +191,22 @@ export default class MongodbDetail {
     cpu: {
       max: number;
       min: number;
-    },
+    };
     id: number;
     mem: {
       max: number;
       min: number;
-    },
+    };
     name: string;
     qps: {
       max: number;
       min: number;
-    },
+    };
     storage_spec: {
       mount_point: string;
       size: number;
       type: string;
-    }[],
+    }[];
   };
   status: string;
 
@@ -252,12 +252,12 @@ export default class MongodbDetail {
   }
 
   get isStarting() {
-    return Boolean(this.operations.find(item => item.ticket_type === TicketTypes.MONGODB_ENABLE));
+    return Boolean(this.operations.find((item) => item.ticket_type === TicketTypes.MONGODB_ENABLE));
   }
 
   get runningOperation() {
     const operateTicketTypes = Object.keys(MongodbDetail.operationTextMap);
-    return this.operations.find(item => operateTicketTypes.includes(item.ticket_type) && item.status === 'RUNNING');
+    return this.operations.find((item) => operateTicketTypes.includes(item.ticket_type) && item.status === 'RUNNING');
   }
 
   // 操作中的状态
@@ -318,10 +318,9 @@ export default class MongodbDetail {
   }
 
   get isOfflineOperationRunning() {
-    return ([
-      TicketTypes.MONGODB_ENABLE,
-      TicketTypes.MONGODB_DESTROY,
-    ] as string[]).includes(this.operationRunningStatus);
+    return ([TicketTypes.MONGODB_ENABLE, TicketTypes.MONGODB_DESTROY] as string[]).includes(
+      this.operationRunningStatus,
+    );
   }
 
   get isDisabled() {
@@ -329,7 +328,7 @@ export default class MongodbDetail {
   }
 
   get operationTagTips() {
-    return this.operations.map(item => ({
+    return this.operations.map((item) => ({
       icon: MongodbDetail.operationIconMap[item.ticket_type],
       tip: MongodbDetail.operationTextMap[item.ticket_type],
       ticketId: item.ticket_id,
diff --git a/dbm-ui/frontend/src/services/model/mongodb/mongodb-rollback-record.ts b/dbm-ui/frontend/src/services/model/mongodb/mongodb-rollback-record.ts
index 702662a6c5..3dd48e0403 100644
--- a/dbm-ui/frontend/src/services/model/mongodb/mongodb-rollback-record.ts
+++ b/dbm-ui/frontend/src/services/model/mongodb/mongodb-rollback-record.ts
@@ -9,7 +9,7 @@
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed
  * on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for
  * the specific language governing permissions and limitations under the License.
-*/
+ */
 import { utcDisplayTime } from '@utils';
 
 import { t } from '@locales/index';
@@ -41,7 +41,7 @@ export default class MongodbRollbackRecord {
   static MONGODB_TEMPORARY_DESTROY = 'MONGODB_TEMPORARY_DESTROY';
 
   static operationIconMap = {
-    [MongodbRollbackRecord.MONGODB_TEMPORARY_DESTROY]: t('销毁中'), 
+    [MongodbRollbackRecord.MONGODB_TEMPORARY_DESTROY]: t('销毁中'),
   };
 
   static operationTextMap = {
@@ -111,7 +111,7 @@ export default class MongodbRollbackRecord {
   }
 
   get runningOperation() {
-    return this.target_cluster.operations.find(item => item.ticket_type in MongodbRollbackRecord.operationTextMap);
+    return this.target_cluster.operations.find((item) => item.ticket_type in MongodbRollbackRecord.operationTextMap);
   }
 
   // 操作中的状态
@@ -157,7 +157,7 @@ export default class MongodbRollbackRecord {
   }
 
   get operationTagTips() {
-    return this.target_cluster.operations.map(item => ({
+    return this.target_cluster.operations.map((item) => ({
       icon: MongodbRollbackRecord.operationIconMap[item.ticket_type],
       tip: MongodbRollbackRecord.operationTextMap[item.ticket_type],
       ticketId: item.ticket_id,
diff --git a/dbm-ui/frontend/src/services/model/pulsar/pulsar-node.ts b/dbm-ui/frontend/src/services/model/pulsar/pulsar-node.ts
index e057623a63..fda485a465 100644
--- a/dbm-ui/frontend/src/services/model/pulsar/pulsar-node.ts
+++ b/dbm-ui/frontend/src/services/model/pulsar/pulsar-node.ts
@@ -9,7 +9,7 @@
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed
  * on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for
  * the specific language governing permissions and limitations under the License.
-*/
+ */
 import { isRecentDays, utcDisplayTime } from '@utils';
 
 export default class PulsarNode {
diff --git a/dbm-ui/frontend/src/services/model/spider/spiderMachine.ts b/dbm-ui/frontend/src/services/model/spider/spiderMachine.ts
index 5b72ac746d..31b3c7726a 100644
--- a/dbm-ui/frontend/src/services/model/spider/spiderMachine.ts
+++ b/dbm-ui/frontend/src/services/model/spider/spiderMachine.ts
@@ -18,38 +18,37 @@ export default class SpiderMachine {
   cluster_type: string;
   create_at: string;
   host_info: {
-    agent_id: number,
-    alive: number,
+    agent_id: number;
+    alive: number;
     biz: {
-      id: number,
-      name: string
-    },
-    bk_cpu: number,
-    bk_cpu_architecture: string,
-    bk_cpu_module:string
-    bk_disk: number,
-    bk_host_outerip: string,
-    bk_idc_id: string,
-    bk_idc_name: string,
-    bk_mem: number,
+      id: number;
+      name: string;
+    };
+    bk_cpu: number;
+    bk_cpu_architecture: string;
+    bk_cpu_module: string;
+    bk_disk: number;
+    bk_host_outerip: string;
+    bk_idc_id: string;
+    bk_idc_name: string;
+    bk_mem: number;
     cloud_area: {
-      id: number,
-      name: string
-    },
-    cloud_id: number,
-    cloud_vendor: string,
-    host_id: number,
-    host_name: string,
-    ip: string,
-    ipv6: string,
+      id: number;
+      name: string;
+    };
+    cloud_id: number;
+    cloud_vendor: string;
+    host_id: number;
+    host_name: string;
+    ip: string;
+    ipv6: string;
     meta: {
-      bk_biz_id: number
-      scope_id: number,
-      scope_type: string,
-    },
-    os_name: string,
-    os_type: number,
-
+      bk_biz_id: number;
+      scope_id: number;
+      scope_type: string;
+    };
+    os_name: string;
+    os_type: number;
   };
   instance_role: string;
   ip: string;
@@ -84,54 +83,54 @@ export default class SpiderMachine {
     bk_host_id: 247;
     bk_cloud_id: 0;
     spec_config: {
-      id: number,
+      id: number;
       cpu: {
-        max: number,
-        min: number
-      },
+        max: number;
+        min: number;
+      };
       mem: {
-        max: number,
-        min: number
-      },
+        max: number;
+        min: number;
+      };
       qps: {
-        max: number,
-        min: number
-      },
-      name: string,
-      count: number,
-      device_class: string[],
+        max: number;
+        min: number;
+      };
+      name: string;
+      count: number;
+      device_class: string[];
       storage_spec: {
-        size: number,
-        type: string,
-        mount_point: string
-      }[]
+        size: number;
+        type: string;
+        mount_point: string;
+      }[];
     };
     bk_biz_id: 3;
-    admin_port: 26000
+    admin_port: 26000;
   }[];
   spec_config: {
-    id: number,
+    id: number;
     cpu: {
-      max: number,
-      min: number
-    },
+      max: number;
+      min: number;
+    };
     mem: {
-      max: number,
-      min: number
-    },
+      max: number;
+      min: number;
+    };
     qps: {
-      max: number,
-      min: number
-    },
-    name: string,
-    count: number,
-    device_class: string[],
+      max: number;
+      min: number;
+    };
+    name: string;
+    count: number;
+    device_class: string[];
     storage_spec: {
-      size: number,
-      type: string,
-      mount_point: string
-    }[]
-  }
+      size: number;
+      type: string;
+      mount_point: string;
+    }[];
+  };
   spec_id: number;
 
   constructor(payload = {} as SpiderMachine) {
diff --git a/dbm-ui/frontend/src/services/model/ticket/ticket.ts b/dbm-ui/frontend/src/services/model/ticket/ticket.ts
index e45189756f..2d07927929 100644
--- a/dbm-ui/frontend/src/services/model/ticket/ticket.ts
+++ b/dbm-ui/frontend/src/services/model/ticket/ticket.ts
@@ -32,7 +32,7 @@ export default class Ticket<T extends unknown | DetailBase> {
     REVOKED: 'danger',
     TERMINATED: 'danger',
     ALL: undefined,
-  };
+  } as const;
   static statusTextMap = {
     ALL: t('全部'),
     PENDING: t('审批中'),
@@ -90,7 +90,7 @@ export default class Ticket<T extends unknown | DetailBase> {
 
   // 获取状态对应文案
   get tagTheme() {
-    return Ticket.themeMap[this.status] as BKTagTheme;
+    return Ticket.themeMap[this.status] as (typeof Ticket.themeMap)[keyof typeof Ticket.themeMap];
   }
 
   get statusText() {
diff --git a/dbm-ui/frontend/src/services/source/ipchooser.ts b/dbm-ui/frontend/src/services/source/ipchooser.ts
index d03977967c..ce760ed576 100644
--- a/dbm-ui/frontend/src/services/source/ipchooser.ts
+++ b/dbm-ui/frontend/src/services/source/ipchooser.ts
@@ -38,11 +38,17 @@ export function checkHost(params: {
  */
 export function getHostDetails(params: {
   mode?: string;
-  host_list: Array<Partial<HostDetails>>;
+  host_list: {
+    host_id: number;
+    meta?: {
+      bk_biz_id: number;
+      scope_id: string;
+      scope_type: string;
+    };
+  }[];
   scope_list: {
-    scope_id: number;
+    scope_id: string;
     scope_type: string;
-    bk_cloud_id?: number | string;
   }[];
 }) {
   return http.post<HostDetails[]>(`${path}/host/details/`, params);
diff --git a/dbm-ui/frontend/src/services/source/mongodbPermissionAuthorize.ts b/dbm-ui/frontend/src/services/source/mongodbPermissionAuthorize.ts
index 8ae7a53ec6..5761087e00 100644
--- a/dbm-ui/frontend/src/services/source/mongodbPermissionAuthorize.ts
+++ b/dbm-ui/frontend/src/services/source/mongodbPermissionAuthorize.ts
@@ -9,7 +9,7 @@
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed
  * on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for
  * the specific language governing permissions and limitations under the License.
-*/
+ */
 
 import { useGlobalBizs } from '@stores';
 
@@ -24,26 +24,26 @@ const path = `/apis/mongodb/bizs/${currentBizId}/permission/authorize`;
  */
 export function preCheckMongodbAuthorizeRules(params: {
   mongo_users: {
-    user: string,
-    access_dbs: string[]
-  }[],
-  target_instances: string[],
-  cluster_type: string,
-  cluster_ids?: number[],
+    user: string;
+    access_dbs: string[];
+  }[];
+  target_instances: string[];
+  cluster_type: string;
+  cluster_ids?: number[];
 }) {
   return http.post<{
     authorize_data: {
-      auth_db: string,
-      cluster_ids: number[],
-      password: string,
+      auth_db: string;
+      cluster_ids: number[];
+      password: string;
       rule_sets: {
-        db: string,
-        privileges: string[]
-      }[]
-      username: string
-    }[],
-    authorize_uid: string,
-    message: string,
-    pre_check: boolean
+        db: string;
+        privileges: string[];
+      }[];
+      username: string;
+    }[];
+    authorize_uid: string;
+    message: string;
+    pre_check: boolean;
   }>(`${path}/pre_check_rules/`, params);
 }
diff --git a/dbm-ui/frontend/src/services/source/sqlserverPermissionAccount.ts b/dbm-ui/frontend/src/services/source/sqlserverPermissionAccount.ts
index f088a92f2a..9dd92c3413 100644
--- a/dbm-ui/frontend/src/services/source/sqlserverPermissionAccount.ts
+++ b/dbm-ui/frontend/src/services/source/sqlserverPermissionAccount.ts
@@ -28,13 +28,13 @@ const path = `/apis/sqlserver/bizs/${currentBizId}/permission/account`;
  * 添加账号规则
  */
 export function addSqlserverAccountRule(params: {
-  account_id: number
+  account_id: number;
   access_db: string;
   privilege: {
-    sqlserver_dml?: string[],
-    sqlserver_owner?: string[]
-  },
-  account_type: AccountTypesValues
+    sqlserver_dml?: string[];
+    sqlserver_owner?: string[];
+  };
+  account_type: AccountTypesValues;
 }) {
   return http.post<null>(`${path}/add_account_rule/`, params);
 }
@@ -42,21 +42,14 @@ export function addSqlserverAccountRule(params: {
 /**
  * 创建账号
  */
-export function createSqlserverAccount(params: {
-  user: string;
-  password: string;
-  account_type?: AccountTypesValues
-}) {
+export function createSqlserverAccount(params: { user: string; password: string; account_type?: AccountTypesValues }) {
   return http.post<null>(`${path}/create_account/`, params);
 }
 
 /**
  * 删除账号
  */
-export function deleteSqlserverAccount(params: {
-  account_id: number;
-  account_type?: AccountTypesValues
-}) {
+export function deleteSqlserverAccount(params: { account_id: number; account_type?: AccountTypesValues }) {
   return http.delete<null>(`${path}/delete_account/`, params);
 }
 
diff --git a/dbm-ui/frontend/src/services/source/sqlserverPermissionAuthorize.ts b/dbm-ui/frontend/src/services/source/sqlserverPermissionAuthorize.ts
index e1310e443a..1f05c4b2ec 100644
--- a/dbm-ui/frontend/src/services/source/sqlserverPermissionAuthorize.ts
+++ b/dbm-ui/frontend/src/services/source/sqlserverPermissionAuthorize.ts
@@ -33,17 +33,17 @@ export function preCheckSqlserverAuthorizeRules(params: {
 }) {
   return http.post<{
     authorize_data: {
-      bk_biz_id: number,
-      operator: string,
-      user: string,
-      access_dbs: string[],
+      bk_biz_id: number;
+      operator: string;
+      user: string;
+      access_dbs: string[];
       account_rules: {
-          bk_biz_id: number,
-          dbname: string
-      }[],
-      source_ips: string[],
-      target_instances: string[],
-      cluster_type: string
+        bk_biz_id: number;
+        dbname: string;
+      }[];
+      source_ips: string[];
+      target_instances: string[];
+      cluster_type: string;
     }[];
     authorize_uid: string;
     message: string;
diff --git a/dbm-ui/frontend/src/services/source/ticket.tsx b/dbm-ui/frontend/src/services/source/ticket.tsx
index 8a03802626..0be0869f4c 100644
--- a/dbm-ui/frontend/src/services/source/ticket.tsx
+++ b/dbm-ui/frontend/src/services/source/ticket.tsx
@@ -70,7 +70,7 @@ export function createTicket(formData: Record<string, any>) {
             id,
           },
         });
-        return new Promise((resolve, reject) => {
+        return new Promise<{ id: number }>((resolve, reject) => {
           InfoBox({
             title: t('是否继续提交单据'),
             content: () => {
diff --git a/dbm-ui/frontend/src/services/types/hostDetails.ts b/dbm-ui/frontend/src/services/types/hostDetails.ts
index 629fec6c50..b3d36c7302 100644
--- a/dbm-ui/frontend/src/services/types/hostDetails.ts
+++ b/dbm-ui/frontend/src/services/types/hostDetails.ts
@@ -15,28 +15,32 @@
  * 主机详情
  */
 export interface HostDetails {
+  agent_id: number;
   alive: number;
-  biz: { id: number; name: string };
+  biz: {
+    id: number;
+    name: string;
+  };
+  bk_cpu?: number;
+  bk_cpu_architecture: string;
+  bk_cpu_module: string;
+  bk_disk: number;
+  bk_host_outerip: string;
+  bk_idc_id?: number;
+  bk_idc_name?: string;
+  bk_mem: number;
   cloud_area: { id: number; name: string };
   cloud_id: number;
+  cloud_vendor: string;
   host_id: number;
   host_name?: string;
   ip: string;
   ipv6: string;
   meta: {
     bk_biz_id: number;
-    scope_id: number;
+    scope_id: string;
     scope_type: string;
   };
-  scope_id: string;
-  scope_type: string;
   os_name: string;
-  bk_cpu?: number;
-  bk_disk?: number;
-  bk_mem?: number;
   os_type: string;
-  agent_id: number;
-  cpu: string;
-  cloud_vendor: string;
-  bk_idc_name?: string;
 }
diff --git a/dbm-ui/frontend/src/services/types/ticket.ts b/dbm-ui/frontend/src/services/types/ticket.ts
index 87ea1fdea6..4de585faa7 100644
--- a/dbm-ui/frontend/src/services/types/ticket.ts
+++ b/dbm-ui/frontend/src/services/types/ticket.ts
@@ -11,11 +11,10 @@
  * the specific language governing permissions and limitations under the License.
  */
 import type { MySQLImportSQLFileDetails } from '@services/model/ticket/details/mysql';
+import type { HostDetails } from '@services/types';
 
 import { TicketTypes } from '@common/const';
 
-import type { IHostTableData } from '@components/cluster-common/big-data-host-table/HdfsHostTable.vue';
-
 /**
  * 单据详情
  */
@@ -108,10 +107,10 @@ export interface TicketDetailsES {
   http_port: number;
   ip_source: string;
   nodes: {
-    client: IHostTableData[];
-    master: IHostTableData[];
-    hot: IHostTableData[];
-    cold: IHostTableData[];
+    client: HostDetails[];
+    master: HostDetails[];
+    hot: HostDetails[];
+    cold: HostDetails[];
   };
 }
 
@@ -126,9 +125,9 @@ export interface TicketDetailsHDFS {
   db_version: string;
   ip_source: string;
   nodes: {
-    datanode: IHostTableData[];
-    namenode: IHostTableData[];
-    zookeeper: IHostTableData[];
+    datanode: HostDetails[];
+    namenode: HostDetails[];
+    zookeeper: HostDetails[];
   };
 }
 
@@ -143,8 +142,8 @@ export interface TicketDetailsKafka {
   db_version: string;
   ip_source: string;
   nodes: {
-    broker: IHostTableData[];
-    zookeeper: IHostTableData[];
+    broker: HostDetails[];
+    zookeeper: HostDetails[];
   };
   partition_num: number;
   port: number;
@@ -156,16 +155,16 @@ export interface TicketDetailsKafka {
  * 节点类型
  */
 export interface NodesType {
-  datanode: IHostTableData[];
-  hot: IHostTableData[];
-  cold: IHostTableData[];
-  master: IHostTableData[];
-  client: IHostTableData[];
-  namenode: IHostTableData[];
-  zookeeper: IHostTableData[];
-  broker: IHostTableData[];
-  proxy: IHostTableData[];
-  slave: IHostTableData[];
+  datanode: HostDetails[];
+  hot: HostDetails[];
+  cold: HostDetails[];
+  master: HostDetails[];
+  client: HostDetails[];
+  namenode: HostDetails[];
+  zookeeper: HostDetails[];
+  broker: HostDetails[];
+  proxy: HostDetails[];
+  slave: HostDetails[];
 }
 
 /**
diff --git a/dbm-ui/frontend/src/stores/globalBizs.ts b/dbm-ui/frontend/src/stores/globalBizs.ts
index 9503d03bd3..90326f745e 100644
--- a/dbm-ui/frontend/src/stores/globalBizs.ts
+++ b/dbm-ui/frontend/src/stores/globalBizs.ts
@@ -9,7 +9,7 @@
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed
  * on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for
  * the specific language governing permissions and limitations under the License.
-*/
+ */
 
 import { defineStore } from 'pinia';
 
@@ -28,7 +28,7 @@ export const useGlobalBizs = defineStore('GlobalBizs', {
     isError: false,
   }),
   getters: {
-    currentBizInfo: (state): BizItem | undefined => state.bizs.find(item => item.bk_biz_id === state.currentBizId),
+    currentBizInfo: (state): BizItem | undefined => state.bizs.find((item) => item.bk_biz_id === state.currentBizId),
   },
   actions: {
     /**
@@ -37,7 +37,7 @@ export const useGlobalBizs = defineStore('GlobalBizs', {
      * @returns boolean | undefined
      */
     hasBizPermission(bizId: number) {
-      const targetBizItem = this.bizs.find(item => item.bk_biz_id === bizId);
+      const targetBizItem = this.bizs.find((item) => item.bk_biz_id === bizId);
       return targetBizItem && targetBizItem.permission.db_manage;
     },
     /**
@@ -98,12 +98,11 @@ export const useGlobalBizs = defineStore('GlobalBizs', {
           this.loading = false;
         });
     },
-    setBizs(payload: BizItem[]){
-      this.bizs = payload
+    setBizs(payload: BizItem[]) {
+      this.bizs = payload;
     },
     changeBizId(id: number) {
       this.currentBizId = id;
     },
   },
 });
-
diff --git a/dbm-ui/frontend/src/types/auto-import-global-component.d.ts b/dbm-ui/frontend/src/types/auto-import-global-component.d.ts
deleted file mode 100644
index f4f8de6cd7..0000000000
--- a/dbm-ui/frontend/src/types/auto-import-global-component.d.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-export {};
-declare global {
-  const AuthButton: typeof import('../components/auth-component/button.vue').default;
-  const AuthOption: typeof import('../components/auth-component/option.vue').default;
-  const AuthRouterLink: typeof import('../components/auth-component/router-link.vue').default;
-  const AuthSwitch: typeof import('../components/auth-component/switch.vue').default;
-}
diff --git a/dbm-ui/frontend/src/types/bkui-vue.ts b/dbm-ui/frontend/src/types/bkui-vue.ts
deleted file mode 100644
index 08d19160f8..0000000000
--- a/dbm-ui/frontend/src/types/bkui-vue.ts
+++ /dev/null
@@ -1,43 +0,0 @@
-/*
- * TencentBlueKing is pleased to support the open source community by making 蓝鲸智云-DB管理系统(BlueKing-BK-DBM) available.
- *
- * Copyright (C) 2017-2023 THL A29 Limited, a Tencent company. All rights reserved.
- *
- * Licensed under the MIT License (the "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at https://opensource.org/licenses/MIT
- *
- * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed
- * on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for
- * the specific language governing permissions and limitations under the License.
- */
-
-import type { DatePicker, Table } from 'bkui-vue';
-import type { ISearchItem, ISearchValue } from 'bkui-vue/lib/search-select/utils';
-
-export type { FormItemProps } from 'bkui-vue/lib/form/form-item';
-
-export type DatePickerValues = Array<InstanceType<typeof DatePicker>['$props']['modelValue']>;
-export type TableProps = InstanceType<typeof Table>['$props'];
-
-// search-select 组件 types
-export type SearchSelectValues = Array<ISearchValue>;
-export type SearchSelectValue = ISearchValue;
-export type SearchSelectData = Array<ISearchItem>;
-export type SearchSelectItem = ISearchItem;
-
-export interface TableColumnRender {
-  cell: string;
-  data: any;
-  row: any;
-  column: any;
-  index: number;
-  rows: any[];
-}
-
-export interface TableSelectionData<T> {
-  checked: boolean;
-  data: T[];
-  index: number;
-  isAll: boolean;
-  row: T;
-}
diff --git a/dbm-ui/frontend/src/types/global.d.ts b/dbm-ui/frontend/src/types/global.d.ts
deleted file mode 100644
index fea3b76011..0000000000
--- a/dbm-ui/frontend/src/types/global.d.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-export * from 'tippy.js';
-
-declare module 'tippy.js' {
-  export interface ReferenceElement {
-    _bk_overflow_tips_: any;
-  }
-}
diff --git a/dbm-ui/frontend/src/types/index.d.ts b/dbm-ui/frontend/src/types/index.d.ts
index 6f7becffba..a4bd2864d9 100644
--- a/dbm-ui/frontend/src/types/index.d.ts
+++ b/dbm-ui/frontend/src/types/index.d.ts
@@ -11,18 +11,9 @@
  * the specific language governing permissions and limitations under the License.
  */
 
-import type { TablePropTypes } from 'bkui-vue/lib/table/props';
 import type { Router } from 'vue-router';
 
 declare global {
-  interface Window {
-    changeConfirm: boolean | 'popover';
-    login: {
-      showLogin: ({ src, width, height }) => void;
-      hideLogin: () => void;
-      isShow: boolean;
-    };
-  }
   interface Element {
     _bk_overflow_tips_: any;
     _tippy: any;
@@ -40,12 +31,6 @@ declare global {
       innerText: string;
     } | null;
   }
-
-  type ClusterTableProps = {
-    -readonly [K in keyof TablePropTypes]: TablePropTypes[K];
-  };
-
-  type BKTagTheme = 'success' | 'info' | 'warning' | 'danger' | undefined;
 }
 
 declare module 'pinia' {
diff --git a/dbm-ui/frontend/src/types/vite-env.d.ts b/dbm-ui/frontend/src/types/vite-env.d.ts
deleted file mode 100644
index 3999e8b544..0000000000
--- a/dbm-ui/frontend/src/types/vite-env.d.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-/*
- * TencentBlueKing is pleased to support the open source community by making 蓝鲸智云-DB管理系统(BlueKing-BK-DBM) available.
- *
- * Copyright (C) 2017-2023 THL A29 Limited, a Tencent company. All rights reserved.
- *
- * Licensed under the MIT License (the "License"); you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at https://opensource.org/licenses/MIT
- *
- * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed
- * on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for
- * the specific language governing permissions and limitations under the License.
- */
-
-// / <reference types="vite/client" />
-
-/* eslint-disable-next-line */
diff --git a/dbm-ui/frontend/src/utils/dom.ts b/dbm-ui/frontend/src/utils/dom.ts
index 8d7f0a5caf..9ab2577b4e 100644
--- a/dbm-ui/frontend/src/utils/dom.ts
+++ b/dbm-ui/frontend/src/utils/dom.ts
@@ -9,7 +9,7 @@
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed
  * on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for
  * the specific language governing permissions and limitations under the License.
-*/
+ */
 
 /**
  * @desc DOM 元素 offset
@@ -36,11 +36,11 @@ export const getOffset = (target: HTMLElement) => {
 };
 
 /**
-* @desc DOM 节点的 scrollParent
-* @param { DomElement } node
-* @returns { DomElement }
-*/
-export const getScrollParent = (node: HTMLElement): HTMLElement|null => {
+ * @desc DOM 节点的 scrollParent
+ * @param { DomElement } node
+ * @returns { DomElement }
+ */
+export const getScrollParent = (node: HTMLElement): HTMLElement | null => {
   if (node === null) {
     return null;
   }
@@ -52,10 +52,10 @@ export const getScrollParent = (node: HTMLElement): HTMLElement|null => {
 };
 
 /**
-* @desc 滚动动画
-* @param { DomElement } target
-* @param { Number } destScrollTop
-*/
+ * @desc 滚动动画
+ * @param { DomElement } target
+ * @param { Number } destScrollTop
+ */
 export const scrollTopSmooth = function (target: HTMLElement, destScrollTop: number) {
   if (!window.requestAnimationFrame) {
     window.requestAnimationFrame = function (cb) {
@@ -77,7 +77,7 @@ export const scrollTopSmooth = function (target: HTMLElement, destScrollTop: num
 };
 
 export const getParentByClass = (node: Element, className: string) => {
-  let parentNode: Element|null = node;
+  let parentNode: Element | null = node;
   while (parentNode) {
     if (parentNode.classList && parentNode.classList.contains(className)) {
       return parentNode;
diff --git a/dbm-ui/frontend/src/utils/getMenuListSearch.ts b/dbm-ui/frontend/src/utils/getMenuListSearch.ts
index af5dc16ad0..74dcd1dd36 100644
--- a/dbm-ui/frontend/src/utils/getMenuListSearch.ts
+++ b/dbm-ui/frontend/src/utils/getMenuListSearch.ts
@@ -9,15 +9,11 @@
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed
  * on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for
  * the specific language governing permissions and limitations under the License.
-*/
+ */
 
-import { generateId } from './generateId';
+import type { ISearchItem, ISearchValue } from 'bkui-vue/lib/search-select/utils';
 
-import type {
-  SearchSelectData,
-  SearchSelectItem,
-  SearchSelectValues,
-} from '@/types/bkui-vue';
+import { generateId } from './generateId';
 
 /**
  * search-select 组件搜索功能函数
@@ -29,32 +25,34 @@ import type {
  * @returns menu list
  */
 export function getMenuListSearch(
-  searchItem: SearchSelectItem | undefined,
+  searchItem: ISearchItem | undefined,
   keyword: string,
-  data: SearchSelectData,
-  values: SearchSelectValues,
+  data: ISearchItem[],
+  values: ISearchValue[],
   uniqueSelect = true,
 ) {
   const lowerCaseKeyword = keyword.toLocaleLowerCase();
   if (searchItem) {
     const { children, multiple } = searchItem;
     if (multiple && children?.length) {
-      return children.filter(child => child.name.toLocaleLowerCase().includes(lowerCaseKeyword));
+      return children.filter((child) => child.name.toLocaleLowerCase().includes(lowerCaseKeyword));
     }
 
-    const resList = [{
-      ...searchItem,
-      realId: searchItem.id,
-      id: generateId('MISSION_SEARCH_ID_'),
-      value: {
-        id: keyword,
-        name: keyword,
+    const resList = [
+      {
+        ...searchItem,
+        realId: searchItem.id,
+        id: generateId('MISSION_SEARCH_ID_'),
+        value: {
+          id: keyword,
+          name: keyword,
+        },
       },
-    }];
+    ];
     if (children?.length) {
       const childList = children
-        .filter(child => child.name.toLocaleLowerCase().includes(lowerCaseKeyword))
-        .map(child => ({
+        .filter((child) => child.name.toLocaleLowerCase().includes(lowerCaseKeyword))
+        .map((child) => ({
           ...searchItem,
           realId: searchItem.id,
           id: generateId('MISSION_SEARCH_ID_'),
@@ -66,8 +64,8 @@ export function getMenuListSearch(
     return resList;
   }
 
-  const selected = (values || []).map(value => value.id);
-  const filterData = uniqueSelect ? data.filter(dataItem => !selected.includes(dataItem.id)) : data;
+  const selected = (values || []).map((value) => value.id);
+  const filterData = uniqueSelect ? data.filter((dataItem) => !selected.includes(dataItem.id)) : data;
   return filterData.reduce((list: any[], dataItem) => {
     dataItem.children?.forEach((child) => {
       if (child.name.toLocaleLowerCase().includes(lowerCaseKeyword)) {
diff --git a/dbm-ui/frontend/src/utils/getSearchSelectorParams.ts b/dbm-ui/frontend/src/utils/getSearchSelectorParams.ts
index 5311fae50e..2ecd141493 100644
--- a/dbm-ui/frontend/src/utils/getSearchSelectorParams.ts
+++ b/dbm-ui/frontend/src/utils/getSearchSelectorParams.ts
@@ -21,7 +21,7 @@ import type { ISearchValue } from 'bkui-vue/lib/search-select/utils';
 export function getSearchSelectorParams<T extends Record<string, any>>(data: ISearchValue[]): T {
   const params = {};
   data.forEach((value: ISearchValue) => {
-    Object.assign(params, { [value.id]: (value.values || []).map(item => `${item.id}`.trim()).join(',') });
+    Object.assign(params, { [value.id]: (value.values || []).map((item) => `${item.id}`.trim()).join(',') });
   });
   return params as T;
 }
diff --git a/dbm-ui/frontend/src/utils/vNodeToHtml.ts b/dbm-ui/frontend/src/utils/vNodeToHtml.ts
index 039d621704..7e5347629a 100644
--- a/dbm-ui/frontend/src/utils/vNodeToHtml.ts
+++ b/dbm-ui/frontend/src/utils/vNodeToHtml.ts
@@ -9,7 +9,7 @@
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed
  * on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for
  * the specific language governing permissions and limitations under the License.
-*/
+ */
 
 import type { VNode } from 'vue';
 
@@ -19,11 +19,11 @@ import type { VNode } from 'vue';
  * @returns html string | html element
  */
 export function vNodeToHtml(vNode: VNode | string): string | HTMLElement {
-  if  (typeof vNode === 'string') {
+  if (typeof vNode === 'string') {
     return vNode;
   }
 
-  const { type, children, props  } = vNode;
+  const { type, children, props } = vNode;
   if (typeof children === 'string') {
     return children;
   }
diff --git a/dbm-ui/frontend/src/views/BizPermission.vue b/dbm-ui/frontend/src/views/BizPermission.vue
index ba99a48368..9c5472d1db 100644
--- a/dbm-ui/frontend/src/views/BizPermission.vue
+++ b/dbm-ui/frontend/src/views/BizPermission.vue
@@ -17,19 +17,19 @@
     :title="$t('无业务权限')"
     type="403">
     <p class="mb-24">
-      {{ $t("你没有相应业务的访问权限_请前往申请相关业务权限或创建业务") }}
+      {{ $t('你没有相应业务的访问权限_请前往申请相关业务权限或创建业务') }}
     </p>
     <BkButton
       class="mr-8"
       :loading="isLoading"
       theme="primary"
       @click="fetchResourcePermission">
-      {{ $t("申请业务权限") }}
+      {{ $t('申请业务权限') }}
     </BkButton>
     <BkButton
       theme="primary"
       @click="handleToCreate">
-      {{ $t("创建业务") }}
+      {{ $t('创建业务') }}
     </BkButton>
   </BkException>
 </template>
@@ -57,10 +57,12 @@
     isLoading.value = true;
     getApplyDataLink({
       action_ids: ['DB_MANAGE'],
-      resources: [{
-        type: 'biz',
-        id: window.PROJECT_CONFIG.BIZ_ID,
-      }],
+      resources: [
+        {
+          type: 'biz',
+          id: window.PROJECT_CONFIG.BIZ_ID,
+        },
+      ],
     })
       .then((res) => {
         window.open(res.apply_url, '__blank');
diff --git a/dbm-ui/frontend/src/views/db-configure/business/Edit.vue b/dbm-ui/frontend/src/views/db-configure/business/Edit.vue
index b4749fdfae..2f0ab2d423 100644
--- a/dbm-ui/frontend/src/views/db-configure/business/Edit.vue
+++ b/dbm-ui/frontend/src/views/db-configure/business/Edit.vue
@@ -142,21 +142,16 @@
   import { Message } from 'bkui-vue';
   import { useI18n } from 'vue-i18n';
 
-  import {
-    getLevelConfig,
-    updateBusinessConfig,
-  } from '@services/source/configs';
+  import { getLevelConfig, updateBusinessConfig } from '@services/source/configs';
 
   import { useBeforeClose } from '@hooks';
 
   import { ConfLevels } from '@common/const';
 
-  import DiffCompare from '../components/DiffCompare.vue';
+  import { type DiffItem, useDiff } from '@views/db-configure/hooks/useDiff';
+
+  import DiffCompare from '../components/diff-compare/Index.vue';
   import BaseInfo from '../components/EditBase.vue';
-  import {
-    type DiffItem,
-    useDiff,
-  } from '../hooks/useDiff';
   import { useLevelParams } from '../hooks/useLevelParams';
 
   const { t } = useI18n();
@@ -165,9 +160,9 @@
   const handleBeforeClose = useBeforeClose();
 
   const { clusterType, confType, version } = route.params as {
-    clusterType: string,
-    confType: string,
-    version: string,
+    clusterType: string;
+    confType: string;
+    version: string;
   };
 
   // 获取业务层级相关参数
@@ -220,22 +215,25 @@
   /**
    * step info
    */
-  const steps = [{
-    title: t('基本信息'),
-    icon: '1',
-  }, {
-    title: t('差异对比'),
-    icon: '2',
-  }];
+  const steps = [
+    {
+      title: t('基本信息'),
+      icon: '1',
+    },
+    {
+      title: t('差异对比'),
+      icon: '2',
+    },
+  ];
   const curStep = ref(1);
 
   /**
    * (pre | next) control
    */
   const buttonInfo = computed<{
-    text: string,
-    theme?: 'primary' | 'success' | 'warning' | 'danger',
-    isNext: boolean
+    text: string;
+    theme?: 'primary' | 'success' | 'warning' | 'danger';
+    isNext: boolean;
   }>(() => {
     const isNext = curStep.value === 1;
     return {
@@ -262,7 +260,12 @@
   const handleChangeStep = async () => {
     if (buttonInfo.value.isNext) {
       const isPass = await validate();
-      if (!isPass) return;
+
+      if (!isPass) {
+        return;
+      }
+
+      // 获取 diff 数据
 
       // 获取 diff 数据
       if (contentRef.value.getData) {
@@ -286,17 +289,21 @@
   const handleSaveAndPublish = async () => {
     // 非集群类型需要校验发布备注
     if (!isCluster.value) {
-      const validate = await publishFormRef.value.validate()
+      const validate = await publishFormRef.value
+        .validate()
         .then(() => true)
         .catch(() => false);
-      if (validate === false) return;
+
+      if (validate === false) {
+        return;
+      }
     }
 
     // 获取 conf_items
     const { data } = useDiff(diffData.data.conf_items, diffData.origin);
     const confItems = data.map((item: DiffItem) => {
       const type = item.status === 'delete' ? 'remove' : 'update';
-      const data = item.status === 'delete' ?  item.before : item.after;
+      const data = item.status === 'delete' ? item.before : item.after;
       return Object.assign(data, { op_type: type });
     });
 
diff --git a/dbm-ui/frontend/src/views/db-configure/components/EditBase.vue b/dbm-ui/frontend/src/views/db-configure/components/EditBase.vue
index dab53dfab9..4280d657bf 100644
--- a/dbm-ui/frontend/src/views/db-configure/components/EditBase.vue
+++ b/dbm-ui/frontend/src/views/db-configure/components/EditBase.vue
@@ -55,29 +55,22 @@
 <script setup lang="ts">
   import _ from 'lodash';
 
-  import {
-    getConfigBaseDetails,
-    getConfigNames,
-    getLevelConfig,
-  } from '@services/source/configs';
+  import { getConfigBaseDetails, getConfigNames, getLevelConfig } from '@services/source/configs';
 
-  import {
-    ConfLevels,
-    type ConfLevelValues,
-  } from '@common/const';
+  import { ConfLevels, type ConfLevelValues } from '@common/const';
 
   import { useLevelParams } from '../hooks/useLevelParams';
 
   import ParameterTable from './ParameterTable.vue';
 
-  type ConfigBaseDetails = ServiceReturnType<typeof getLevelConfig>
+  type ConfigBaseDetails = ServiceReturnType<typeof getLevelConfig>;
 
   interface Props {
-    level?: ConfLevelValues
+    level?: ConfLevelValues;
   }
 
   interface Emits {
-    (e: 'change', value: { data: ConfigBaseDetails, changed: boolean }): void
+    (e: 'change', value: { data: ConfigBaseDetails; changed: boolean }): void;
   }
 
   const props = withDefaults(defineProps<Props>(), {
@@ -178,20 +171,25 @@
    * 校验参数配置
    */
   const parameterTableRef = ref();
-  const validate = async ()  => {
-    const parameterValidate = await parameterTableRef.value.validate()
+  const validate = async () => {
+    const parameterValidate = await parameterTableRef.value
+      .validate()
       .then(() => true)
       .catch(() => false);
     return parameterValidate;
   };
 
-  watch(() => state.data, (value) => {
-    const isChange = state.cloneDataStringify !== JSON.stringify(value);
-    emit('change', {
-      data: value,
-      changed: isChange,
-    });
-  }, { deep: true });
+  watch(
+    () => state.data,
+    (value) => {
+      const isChange = state.cloneDataStringify !== JSON.stringify(value);
+      emit('change', {
+        data: value,
+        changed: isChange,
+      });
+    },
+    { deep: true },
+  );
 
   /**
    * 返回 diff 数据参数
@@ -231,8 +229,8 @@
   };
 
   // 范围选择
-  const handleChangeRange = (index: number,  { max, min }: { max: number, min: number }) => {
-    state.data.conf_items[index].value_allowed = (min || max) ? `[${min || 0},${max || 0}]` : '';
+  const handleChangeRange = (index: number, { max, min }: { max: number; min: number }) => {
+    state.data.conf_items[index].value_allowed = min || max ? `[${min || 0},${max || 0}]` : '';
   };
 
   // multipleEnums 变更
diff --git a/dbm-ui/frontend/src/views/db-configure/components/PublishRecord.vue b/dbm-ui/frontend/src/views/db-configure/components/PublishRecord.vue
index 9a0bf00313..45ba9ed7cf 100644
--- a/dbm-ui/frontend/src/views/db-configure/components/PublishRecord.vue
+++ b/dbm-ui/frontend/src/views/db-configure/components/PublishRecord.vue
@@ -25,7 +25,7 @@
     </BkLoading>
 
     <BkSideslider
-      v-model:isShow="sideState.isShow"
+      v-model:is-show="sideState.isShow"
       quick-close
       render-directive="if"
       :width="960">
@@ -70,7 +70,6 @@
 </template>
 
 <script setup lang="tsx">
-  import type { Column } from 'bkui-vue/lib/table/props';
   import { useI18n } from 'vue-i18n';
 
   import {
@@ -86,8 +85,6 @@
 
   import ReadonlyTable from './ReadonlyTable.vue';
 
-  import type { TableColumnRender } from '@/types/bkui-vue';
-
   type ConfigVersionDetails = ServiceReturnType<typeof getConfigVersionDetails>
   type ConfigVersionListResult = ServiceReturnType<typeof getConfigVersionList>
 
@@ -111,11 +108,16 @@
   /**
    * table columns
    */
-  const columns: Column[] = [{
+  const columns = [{
     label: t('发布时间'),
     field: 'created_at',
-    render: ({ cell, data }: TableColumnRender) => (
-      <bk-button text theme="primary" onClick={handleToDetails.bind(this, data)}>{cell}</bk-button>
+    render: ({ data }: {data: ConfigVersionListResult['versions'][number]}) => (
+      <bk-button
+        text
+        theme="primary"
+        onClick={() => handleToDetails(data)}>
+        {data.created_at}
+      </bk-button>
     ),
   }, {
     label: t('发布人'),
diff --git a/dbm-ui/frontend/src/views/db-configure/components/RangeInput.vue b/dbm-ui/frontend/src/views/db-configure/components/RangeInput.vue
index 5b92d49768..0a55886efe 100644
--- a/dbm-ui/frontend/src/views/db-configure/components/RangeInput.vue
+++ b/dbm-ui/frontend/src/views/db-configure/components/RangeInput.vue
@@ -68,10 +68,13 @@
 
 <script setup lang="ts">
   interface Emits {
-    (e: 'change', value: {
-      min: number
-      max: number
-    }): void
+    (
+      e: 'change',
+      value: {
+        min: number;
+        max: number;
+      },
+    ): void;
   }
 
   const emits = defineEmits<Emits>();
@@ -105,7 +108,9 @@
    * emit value
    */
   const handleValueChange = (emitName: 'min' | 'max', value: number | string) => {
-    if (value === '') return;
+    if (value === '') {
+      return;
+    }
     if (emitName === 'min') {
       min.value = Number(value);
     } else {
@@ -133,14 +138,17 @@
   onMounted(() => {
     const targetParant = rangeInputRef.value?.closest?.('.bk-table-body');
     if (targetParant) {
-      const intersectionObserver = new IntersectionObserver(() => {
-        if (isShow.value) {
-          isShow.value = false;
-        }
-      }, {
-        root: targetParant,
-        threshold: 0,
-      });
+      const intersectionObserver = new IntersectionObserver(
+        () => {
+          if (isShow.value) {
+            isShow.value = false;
+          }
+        },
+        {
+          root: targetParant,
+          threshold: 0,
+        },
+      );
       rangeInputRef.value && intersectionObserver.observe(rangeInputRef.value);
     }
   });
diff --git a/dbm-ui/frontend/src/views/db-configure/components/ReadonlyTable.vue b/dbm-ui/frontend/src/views/db-configure/components/ReadonlyTable.vue
index 40bb87a132..5a7205f661 100644
--- a/dbm-ui/frontend/src/views/db-configure/components/ReadonlyTable.vue
+++ b/dbm-ui/frontend/src/views/db-configure/components/ReadonlyTable.vue
@@ -34,7 +34,6 @@
   </div>
 </template>
 <script setup lang="tsx">
-  import type { Column } from 'bkui-vue/lib/table/props';
   import { useI18n } from 'vue-i18n';
 
   import { getLevelConfig } from '@services/source/configs';
@@ -45,8 +44,6 @@
     type ConfLevelValues,
   } from '@common/const';
 
-  import type { TableColumnRender } from '@/types/bkui-vue';
-
   type ParameterConfigItem = ServiceReturnType<typeof getLevelConfig>['conf_items'][number]
 
   interface Props {
@@ -81,37 +78,43 @@
     return props.data.filter(item => item.conf_name.includes(search.value));
   });
 
-  const columns: Column[] = [
+  const columns = [
     {
       label: t('参数项'),
       field: 'conf_name',
-      render: ({ data }: TableColumnRender) => (
-          <>
-            <div
-              v-overflow-tips
-              class="text-overflow config-name-box">
-              {data.conf_name}
-            </div>
-            <db-icon
-              v-show={Boolean(data.description)}
-              v-bk-tooltips={data.description}
-              class="ml-4"
-              type="attention" />
-          </>
-        ),
+      render: ({ data }: {data: ParameterConfigItem}) => (
+        <>
+          <div
+            v-overflow-tips
+            class="text-overflow config-name-box">
+            {data.conf_name}
+          </div>
+          <db-icon
+            v-show={Boolean(data.description)}
+            v-bk-tooltips={data.description}
+            class="ml-4"
+            type="attention" />
+        </>
+      ),
     },
     {
       label: t('参数值'),
       field: isPlat.value && !props.isRecord ? 'value_default' : 'conf_value',
-      render: ({ cell }: TableColumnRender) => <div class="text-overflow" v-overflow-tips>{cell}</div>,
+      render: ({ data }: {data: ParameterConfigItem}) => (
+        <div
+          class="text-overflow"
+          v-overflow-tips>
+          {isPlat.value && !props.isRecord ? data.value_default : data.conf_value}
+        </div>
+      ),
     },
     {
       label: t('允许值设定'),
       field: 'value_allowed',
-      render: ({ cell, data }: TableColumnRender) => {
+      render: ({ data }: {data: ParameterConfigItem}) => {
         const enumType = ['ENUM', 'ENUMS'];
         // 将 | 转为逗号(,) 增加可读性
-        const displayValue = enumType.includes(data.value_type_sub as string) ? cell.replace(/\|/g, ', ') : cell;
+        const displayValue = enumType.includes(data.value_type_sub as string) ? data.value_allowed.replace(/\|/g, ', ') : data.value_allowed;
         return <div class="text-overflow" v-overflow-tips>{displayValue}</div>;
       },
     },
diff --git a/dbm-ui/frontend/src/views/db-configure/components/DiffCompare.vue b/dbm-ui/frontend/src/views/db-configure/components/diff-compare/Index.vue
similarity index 96%
rename from dbm-ui/frontend/src/views/db-configure/components/DiffCompare.vue
rename to dbm-ui/frontend/src/views/db-configure/components/diff-compare/Index.vue
index 4276954b4a..97589ab310 100644
--- a/dbm-ui/frontend/src/views/db-configure/components/DiffCompare.vue
+++ b/dbm-ui/frontend/src/views/db-configure/components/diff-compare/Index.vue
@@ -13,7 +13,7 @@
 
 <template>
   <div class="diff-compare">
-    <DbDIff
+    <ValueDiff
       :count="diff.count"
       :data="diff.data"
       :labels="labels" />
@@ -30,9 +30,9 @@
     type ConfLevelValues,
   } from '@common/const';
 
-  import DbDIff from '@components/db-diff/index.vue';
+  import { useDiff } from '@views/db-configure/hooks/useDiff';
 
-  import { useDiff } from '../hooks/useDiff';
+  import ValueDiff from './components/ValueDiff.vue';
 
   interface Props {
     data?: ServiceReturnType<typeof getLevelConfig>['conf_items']
diff --git a/dbm-ui/frontend/src/components/db-diff/index.vue b/dbm-ui/frontend/src/views/db-configure/components/diff-compare/components/ValueDiff.vue
similarity index 88%
rename from dbm-ui/frontend/src/components/db-diff/index.vue
rename to dbm-ui/frontend/src/views/db-configure/components/diff-compare/components/ValueDiff.vue
index 9695cf5f7c..23990b7c90 100644
--- a/dbm-ui/frontend/src/components/db-diff/index.vue
+++ b/dbm-ui/frontend/src/views/db-configure/components/diff-compare/components/ValueDiff.vue
@@ -42,13 +42,16 @@
 </template>
 
 <script setup lang="tsx">
-  import type { Column } from 'bkui-vue/lib/table/props';
   import { useI18n } from 'vue-i18n';
 
-  import type { TableColumnRender } from '@/types/bkui-vue';
+  import { getLevelConfig } from '@services/source/configs';
+
+  import { type DiffItem } from '@views/db-configure/hooks/useDiff';
+
+  type ParameterConfigItem = ServiceReturnType<typeof getLevelConfig>['conf_items'][number];
 
   interface Props {
-    data?: Record<string, any>[],
+    data?: DiffItem[],
     count?: {
       create: number,
       update: number,
@@ -71,20 +74,24 @@
 
   const { t } = useI18n();
 
-  const columns: Column[] = [{
+  const columns = [{
     label: t('参数名'),
     field: 'name',
-    render: ({ cell, data }: TableColumnRender) => (
-      <strong class={['bk-diff__parameter', `bk-diff__parameter--${data.status}`]} v-overflow-tips>{cell}</strong>
+    render: ({ data }: {data: DiffItem}) => (
+      <strong class={['bk-diff__parameter', `bk-diff__parameter--${data.status}`]} v-overflow-tips>{data.name}</strong>
     ),
   }, {
     label: t('更新前'),
     field: 'before',
-    render: ({ data }: TableColumnRender) => (
+    render: ({ data }: {data: DiffItem}) => (
       <>
         {props.labels.map((label) => {
+
       const itemData = data.before;
-      const displayValue = label.render ? label.render(data, 'before') : itemData[label.key];
+      if (!itemData){
+        return '--'
+      }
+      const displayValue = label.render ? label.render(data, 'before') : itemData[label.key as keyof ParameterConfigItem];
       return (
         <div class="bk-diff__item">
           <span class="bk-diff__item-label">{label.label}</span>
@@ -97,15 +104,17 @@
   }, {
     label: t('更新后'),
     field: 'after',
-    render: ({ data }: TableColumnRender) => (
+    render: ({ data }: {data: DiffItem}) => (
       <>
         {props.labels.map((label) => {
-        const itemData = data.after;
-        const displayValue = label.render ? label.render(data, 'after') : itemData[label.key];
+        if (!data.before || !data.after){
+          return '--'
+        }
+        const displayValue = label.render ? label.render(data, 'after') : data.after[label.key as keyof ParameterConfigItem];
 
         let { status } = data;
         if (status === 'update') {
-          status = data.after[label.key] === data.before[label.key] ? '' : 'update';
+          status = data.after[label.key as keyof ParameterConfigItem] === data.before[label.key as keyof ParameterConfigItem] ? '' : 'update';
         }
         const statusCls = status ? `bk-diff__item--${data.status}` : '';
 
diff --git a/dbm-ui/frontend/src/views/db-configure/hooks/useDiff.ts b/dbm-ui/frontend/src/views/db-configure/hooks/useDiff.ts
index 03bcc3f603..fa2ba81ef8 100644
--- a/dbm-ui/frontend/src/views/db-configure/hooks/useDiff.ts
+++ b/dbm-ui/frontend/src/views/db-configure/hooks/useDiff.ts
@@ -22,8 +22,8 @@ type DiffData = ComputedRef<ParameterConfigItem[]> | ParameterConfigItem[];
 export type DiffItem = {
   name: string;
   status: string;
-  before: ParameterConfigItem;
-  after: ParameterConfigItem;
+  before?: ParameterConfigItem;
+  after?: ParameterConfigItem;
 };
 
 export const useDiff = (data: DiffData, origin: DiffData) => {
@@ -33,7 +33,7 @@ export const useDiff = (data: DiffData, origin: DiffData) => {
       update: 0,
       delete: 0,
     },
-    data: [] as any,
+    data: [] as DiffItem[],
   });
 
   const diff = () => {
@@ -49,7 +49,7 @@ export const useDiff = (data: DiffData, origin: DiffData) => {
       state.data.push({
         name: item.conf_name,
         status: 'create',
-        before: {},
+        before: undefined,
         after: item,
       });
     }
@@ -62,7 +62,7 @@ export const useDiff = (data: DiffData, origin: DiffData) => {
         name: item.conf_name,
         status: 'delete',
         before: item,
-        after: {},
+        after: undefined,
       });
     }
 
diff --git a/dbm-ui/frontend/src/views/db-configure/platform/Edit.vue b/dbm-ui/frontend/src/views/db-configure/platform/Edit.vue
index f6a9aa1cf7..d145a43258 100644
--- a/dbm-ui/frontend/src/views/db-configure/platform/Edit.vue
+++ b/dbm-ui/frontend/src/views/db-configure/platform/Edit.vue
@@ -103,31 +103,23 @@
 <script setup lang="ts">
   import { Message } from 'bkui-vue';
   import { useI18n } from 'vue-i18n';
-  import {
-    useRoute,
-    useRouter,
-  } from 'vue-router';
+  import { useRoute, useRouter } from 'vue-router';
 
-  import {
-    getConfigBaseDetails,
-    updatePlatformConfig,
-  } from '@services/source/configs';
+  import { getConfigBaseDetails, updatePlatformConfig } from '@services/source/configs';
 
-  import DiffCompare from '../components/DiffCompare.vue';
+  import { type DiffItem, useDiff } from '@views/db-configure/hooks/useDiff';
+
+  import DiffCompare from '../components/diff-compare/Index.vue';
   import BaseInfo from '../components/EditBase.vue';
-  import {
-    type DiffItem,
-    useDiff,
-  } from '../hooks/useDiff';
 
   const { t } = useI18n();
   const router = useRouter();
   const route = useRoute();
 
   const { clusterType, confType, version } = route.params as {
-    clusterType: string,
-    confType: string,
-    version: string,
+    clusterType: string;
+    confType: string;
+    version: string;
   };
 
   const loading = ref(false);
@@ -165,13 +157,16 @@
   /**
    * step info
    */
-  const steps = [{
-    title: t('基本信息'),
-    icon: '1',
-  }, {
-    title: t('差异对比'),
-    icon: '2',
-  }];
+  const steps = [
+    {
+      title: t('基本信息'),
+      icon: '1',
+    },
+    {
+      title: t('差异对比'),
+      icon: '2',
+    },
+  ];
   const curStep = ref(1);
 
   /**
@@ -181,8 +176,7 @@
     text: string;
     theme: 'success' | 'warning' | 'danger' | 'primary' | undefined;
     isNext: boolean;
-  }
-  >(() => {
+  }>(() => {
     const isNext = curStep.value === 1;
     return {
       text: isNext ? t('下一步') : t('上一步'),
@@ -208,7 +202,12 @@
   const handleChangeStep = async () => {
     if (buttonInfo.value.isNext) {
       const isPass = await validate();
-      if (!isPass) return;
+
+      if (!isPass) {
+        return;
+      }
+
+      // 获取 diff 数据
 
       // 获取 diff 数据
       if (contentRef.value.getData) {
@@ -229,16 +228,22 @@
    */
   const publishFormRef = ref();
   const handleSaveAndPublish = async () => {
-    const validate = await publishFormRef.value.validate()
+    const validate = await publishFormRef.value
+      .validate()
       .then(() => true)
       .catch(() => false);
-    if (validate === false) return;
+
+    if (validate === false) {
+      return;
+    }
+
+    // 获取 conf_items
 
     // 获取 conf_items
     const { data } = useDiff(diffData.data.conf_items, diffData.origin);
     const confItems = data.map((item: DiffItem) => {
       const type = item.status === 'delete' ? 'remove' : 'update';
-      const data = item.status === 'delete' ?  item.before : item.after;
+      const data = item.status === 'delete' ? item.before : item.after;
       return Object.assign(data, { op_type: type });
     });
 
diff --git a/dbm-ui/frontend/src/views/db-manage/common/BatchEditKeys.vue b/dbm-ui/frontend/src/views/db-manage/common/BatchEditKeys.vue
new file mode 100644
index 0000000000..bbdf72bd8c
--- /dev/null
+++ b/dbm-ui/frontend/src/views/db-manage/common/BatchEditKeys.vue
@@ -0,0 +1,190 @@
+<!--
+ * TencentBlueKing is pleased to support the open source community by making 蓝鲸智云-DB管理系统(BlueKing-BK-DBM) available.
+ *
+ * Copyright (C) 2017-2023 THL A29 Limited, a Tencent company. All rights reserved.
+ *
+ * Licensed under the MIT License (the "License"); you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License athttps://opensource.org/licenses/MIT
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed
+ * on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for
+ * the specific language governing permissions and limitations under the License.
+-->
+
+<template>
+  <BkPopover
+    v-model:is-show="state.isShow"
+    :boundary="body"
+    class="batch-edit"
+    theme="light"
+    trigger="manual"
+    :width="540">
+    <i
+      class="db-icon-bulk-edit batch-edit__trigger"
+      @click="() => (state.isShow = true)" />
+    <template #content>
+      <div class="batch-edit__content">
+        <p class="batch-edit__header">
+          {{ title || $t('批量编辑') }}
+        </p>
+        <div class="batch-edit__value">
+          <DbTextarea
+            ref="textareaRef"
+            v-model="state.value"
+            :display-height="100"
+            :max-height="100"
+            :placeholder="$t('请输入正则表达式_多个换行分割')"
+            :teleport-to-body="false" />
+          <p
+            v-if="validateState.isShow"
+            class="batch-edit__value-error">
+            {{ validateState.errorTxt }}
+          </p>
+        </div>
+        <div class="batch-edit__footer">
+          <BkButton
+            class="mr-8"
+            size="small"
+            theme="primary"
+            @click="handleConfirm">
+            {{ $t('确定') }}
+          </BkButton>
+          <BkButton
+            size="small"
+            @click="handleCancel">
+            {{ $t('取消') }}
+          </BkButton>
+        </div>
+      </div>
+    </template>
+  </BkPopover>
+</template>
+
+<script setup lang="ts">
+  import { useI18n } from 'vue-i18n';
+
+  interface Props {
+    title?: string;
+  }
+
+  interface Emits {
+    (e: 'change', value: string): void;
+  }
+
+  withDefaults(defineProps<Props>(), {
+    title: '',
+  });
+  const emits = defineEmits<Emits>();
+
+  const { t } = useI18n();
+
+  const state = reactive({
+    isShow: false,
+    value: '',
+  });
+  const validateState = reactive({
+    isShow: false,
+    errorTxt: '',
+  });
+  const { body } = document;
+  const textareaRef = ref();
+
+  /**
+   * validate batch edit value
+   */
+  const handleValidate = () => {
+    const isEmpty = !state.value;
+    validateState.errorTxt = isEmpty ? t('请输入正则表达式') : '';
+    validateState.isShow = isEmpty;
+    return !isEmpty;
+  };
+
+  watch(
+    () => state.isShow,
+    (show) => {
+      if (show === false) {
+        state.value = '';
+        validateState.isShow = false;
+      } else {
+        nextTick(() => {
+          textareaRef.value?.focus?.();
+        });
+      }
+    },
+  );
+
+  watch(
+    () => state.value,
+    (value) => {
+      value && handleValidate();
+    },
+  );
+
+  /**
+   * confirm batch edit
+   */
+  const handleConfirm = () => {
+    handleValidate();
+    if (validateState.isShow === true) {
+      return;
+    }
+
+    emits('change', state.value);
+    handleCancel();
+  };
+
+  /**
+   * close popover
+   */
+  const handleCancel = () => {
+    state.isShow = false;
+  };
+</script>
+
+<style lang="less" scoped>
+  .batch-edit {
+    &__trigger {
+      margin-left: 5px;
+      color: @primary-color;
+      cursor: pointer;
+    }
+
+    &__content {
+      padding: 9px 2px;
+    }
+
+    &__header {
+      padding-bottom: 16px;
+      font-size: @font-size-large;
+      color: @title-color;
+
+      span {
+        font-size: @font-size-mini;
+        color: @default-color;
+      }
+    }
+
+    &__value {
+      position: relative;
+      color: @default-color;
+
+      &-error {
+        position: absolute;
+        bottom: -20px;
+        left: 0;
+        font-size: @font-size-mini;
+        color: @danger-color;
+      }
+    }
+
+    &__footer {
+      margin-top: 16px;
+      text-align: right;
+
+      .bk-button {
+        min-width: 60px;
+        font-size: 12px;
+      }
+    }
+  }
+</style>
diff --git a/dbm-ui/frontend/src/components/cluster-common/ExcelAuthorize.vue b/dbm-ui/frontend/src/views/db-manage/common/ExcelAuthorize.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-common/ExcelAuthorize.vue
rename to dbm-ui/frontend/src/views/db-manage/common/ExcelAuthorize.vue
diff --git a/dbm-ui/frontend/src/components/cluster-common/OperationBtnStatusTips.vue b/dbm-ui/frontend/src/views/db-manage/common/OperationBtnStatusTips.vue
similarity index 96%
rename from dbm-ui/frontend/src/components/cluster-common/OperationBtnStatusTips.vue
rename to dbm-ui/frontend/src/views/db-manage/common/OperationBtnStatusTips.vue
index 023c86ba5e..ec57b828b6 100644
--- a/dbm-ui/frontend/src/components/cluster-common/OperationBtnStatusTips.vue
+++ b/dbm-ui/frontend/src/views/db-manage/common/OperationBtnStatusTips.vue
@@ -121,11 +121,11 @@
   });
 </script>
 <style lang="less">
-.cluster-operation-status-tips {
-  display: inline-block;
+  .cluster-operation-status-tips {
+    display: inline-block;
 
-  & > * {
-    pointer-events: none;
+    & > * {
+      pointer-events: none;
+    }
   }
-}
 </style>
diff --git a/dbm-ui/frontend/src/components/cluster-common/RenderBaseInfo.vue b/dbm-ui/frontend/src/views/db-manage/common/RenderBaseInfo.vue
similarity index 96%
rename from dbm-ui/frontend/src/components/cluster-common/RenderBaseInfo.vue
rename to dbm-ui/frontend/src/views/db-manage/common/RenderBaseInfo.vue
index e4c58b5799..5018e374d1 100644
--- a/dbm-ui/frontend/src/components/cluster-common/RenderBaseInfo.vue
+++ b/dbm-ui/frontend/src/views/db-manage/common/RenderBaseInfo.vue
@@ -53,7 +53,7 @@
   </div>
 </template>
 <script setup lang="ts">
-  import RenderClusterStatus from '@components/cluster-common/RenderStatus.vue';
+  import RenderClusterStatus from '@components/cluster-status/Index.vue';
 
   interface Props {
     data: Record<any, any> & { id: number };
diff --git a/dbm-ui/frontend/src/components/cluster-common/RenderInstanceStatus.vue b/dbm-ui/frontend/src/views/db-manage/common/RenderInstanceStatus.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-common/RenderInstanceStatus.vue
rename to dbm-ui/frontend/src/views/db-manage/common/RenderInstanceStatus.vue
diff --git a/dbm-ui/frontend/src/components/cluster-common/RenderNodeInstance.vue b/dbm-ui/frontend/src/views/db-manage/common/RenderNodeInstance.vue
similarity index 97%
rename from dbm-ui/frontend/src/components/cluster-common/RenderNodeInstance.vue
rename to dbm-ui/frontend/src/views/db-manage/common/RenderNodeInstance.vue
index 8c4b66f2f9..04aec58734 100644
--- a/dbm-ui/frontend/src/components/cluster-common/RenderNodeInstance.vue
+++ b/dbm-ui/frontend/src/views/db-manage/common/RenderNodeInstance.vue
@@ -119,8 +119,8 @@
 
   import { useGlobalBizs } from '@stores';
 
-  import RenderInstanceStatus from '@components/cluster-common/RenderInstanceStatus.vue';
-  import RenderClusterRole from '@components/cluster-common/RenderRole.vue';
+  import RenderInstanceStatus from '@views/db-manage/common/RenderInstanceStatus.vue';
+  import RenderClusterRole from '@views/db-manage/common/RenderRole.vue';
 
   import { messageWarn } from '@utils';
 
diff --git a/dbm-ui/frontend/src/components/cluster-common/RenderOperationTag.vue b/dbm-ui/frontend/src/views/db-manage/common/RenderOperationTag.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-common/RenderOperationTag.vue
rename to dbm-ui/frontend/src/views/db-manage/common/RenderOperationTag.vue
diff --git a/dbm-ui/frontend/src/components/cluster-common/RenderOperationTagNew.vue b/dbm-ui/frontend/src/views/db-manage/common/RenderOperationTagNew.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-common/RenderOperationTagNew.vue
rename to dbm-ui/frontend/src/views/db-manage/common/RenderOperationTagNew.vue
diff --git a/dbm-ui/frontend/src/components/cluster-common/RenderPassword.vue b/dbm-ui/frontend/src/views/db-manage/common/RenderPassword.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-common/RenderPassword.vue
rename to dbm-ui/frontend/src/views/db-manage/common/RenderPassword.vue
diff --git a/dbm-ui/frontend/src/components/cluster-common/RenderRole.vue b/dbm-ui/frontend/src/views/db-manage/common/RenderRole.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-common/RenderRole.vue
rename to dbm-ui/frontend/src/views/db-manage/common/RenderRole.vue
diff --git a/dbm-ui/frontend/src/components/cluster-common/RenderSimpleClusterList.vue b/dbm-ui/frontend/src/views/db-manage/common/RenderSimpleClusterList.vue
similarity index 98%
rename from dbm-ui/frontend/src/components/cluster-common/RenderSimpleClusterList.vue
rename to dbm-ui/frontend/src/views/db-manage/common/RenderSimpleClusterList.vue
index b1562f0db9..7275c0f15b 100644
--- a/dbm-ui/frontend/src/components/cluster-common/RenderSimpleClusterList.vue
+++ b/dbm-ui/frontend/src/views/db-manage/common/RenderSimpleClusterList.vue
@@ -64,7 +64,7 @@
 
   import { useGlobalBizs } from '@stores';
 
-  import RenderClusterStatus from '@components/cluster-common/RenderStatus.vue';
+  import RenderClusterStatus from '@components/cluster-status/Index.vue';
   import EmptyStatus from '@components/empty-status/EmptyStatus.vue';
 
   interface Props {
diff --git a/dbm-ui/frontend/src/components/cluster-common/SpecDetailForPopover.vue b/dbm-ui/frontend/src/views/db-manage/common/SpecDetailForPopover.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-common/SpecDetailForPopover.vue
rename to dbm-ui/frontend/src/views/db-manage/common/SpecDetailForPopover.vue
diff --git a/dbm-ui/frontend/src/components/add-permission-rule-dialog/Index.vue b/dbm-ui/frontend/src/views/db-manage/common/add-permission-rule-dialog/Index.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/add-permission-rule-dialog/Index.vue
rename to dbm-ui/frontend/src/views/db-manage/common/add-permission-rule-dialog/Index.vue
diff --git a/dbm-ui/frontend/src/components/apply-items/AffinityItem.vue b/dbm-ui/frontend/src/views/db-manage/common/apply-items/AffinityItem.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/apply-items/AffinityItem.vue
rename to dbm-ui/frontend/src/views/db-manage/common/apply-items/AffinityItem.vue
diff --git a/dbm-ui/frontend/src/components/apply-items/BackendQPSSpec.vue b/dbm-ui/frontend/src/views/db-manage/common/apply-items/BackendQPSSpec.vue
similarity index 99%
rename from dbm-ui/frontend/src/components/apply-items/BackendQPSSpec.vue
rename to dbm-ui/frontend/src/views/db-manage/common/apply-items/BackendQPSSpec.vue
index a7b966e21e..b2a59862b6 100644
--- a/dbm-ui/frontend/src/components/apply-items/BackendQPSSpec.vue
+++ b/dbm-ui/frontend/src/views/db-manage/common/apply-items/BackendQPSSpec.vue
@@ -183,7 +183,7 @@
 
   import { ClusterTypes } from '@common/const';
 
-  import SpecSelector from '@components/apply-items/SpecSelector.vue';
+  import SpecSelector from '@views/db-manage/common/apply-items/SpecSelector.vue';
 
   interface ModelValue {
     spec_id: number | string,
diff --git a/dbm-ui/frontend/src/components/apply-items/BackendSpec.vue b/dbm-ui/frontend/src/views/db-manage/common/apply-items/BackendSpec.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/apply-items/BackendSpec.vue
rename to dbm-ui/frontend/src/views/db-manage/common/apply-items/BackendSpec.vue
diff --git a/dbm-ui/frontend/src/components/apply-items/BusinessItems.vue b/dbm-ui/frontend/src/views/db-manage/common/apply-items/BusinessItems.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/apply-items/BusinessItems.vue
rename to dbm-ui/frontend/src/views/db-manage/common/apply-items/BusinessItems.vue
diff --git a/dbm-ui/frontend/src/components/apply-items/CloudItem.vue b/dbm-ui/frontend/src/views/db-manage/common/apply-items/CloudItem.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/apply-items/CloudItem.vue
rename to dbm-ui/frontend/src/views/db-manage/common/apply-items/CloudItem.vue
diff --git a/dbm-ui/frontend/src/components/apply-items/ClusterAlias.vue b/dbm-ui/frontend/src/views/db-manage/common/apply-items/ClusterAlias.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/apply-items/ClusterAlias.vue
rename to dbm-ui/frontend/src/views/db-manage/common/apply-items/ClusterAlias.vue
diff --git a/dbm-ui/frontend/src/components/apply-items/ClusterName.vue b/dbm-ui/frontend/src/views/db-manage/common/apply-items/ClusterName.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/apply-items/ClusterName.vue
rename to dbm-ui/frontend/src/views/db-manage/common/apply-items/ClusterName.vue
diff --git a/dbm-ui/frontend/src/components/apply-items/DeployVersion.vue b/dbm-ui/frontend/src/views/db-manage/common/apply-items/DeployVersion.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/apply-items/DeployVersion.vue
rename to dbm-ui/frontend/src/views/db-manage/common/apply-items/DeployVersion.vue
diff --git a/dbm-ui/frontend/src/components/apply-items/RegionItem.vue b/dbm-ui/frontend/src/views/db-manage/common/apply-items/RegionItem.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/apply-items/RegionItem.vue
rename to dbm-ui/frontend/src/views/db-manage/common/apply-items/RegionItem.vue
diff --git a/dbm-ui/frontend/src/components/apply-items/SpecSelector.vue b/dbm-ui/frontend/src/views/db-manage/common/apply-items/SpecSelector.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/apply-items/SpecSelector.vue
rename to dbm-ui/frontend/src/views/db-manage/common/apply-items/SpecSelector.vue
diff --git a/dbm-ui/frontend/src/components/batch-edit-column/Index.vue b/dbm-ui/frontend/src/views/db-manage/common/batch-edit-column/Index.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/batch-edit-column/Index.vue
rename to dbm-ui/frontend/src/views/db-manage/common/batch-edit-column/Index.vue
diff --git a/dbm-ui/frontend/src/components/batch-operate-icon/Index.vue b/dbm-ui/frontend/src/views/db-manage/common/batch-operate-icon/Index.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/batch-operate-icon/Index.vue
rename to dbm-ui/frontend/src/views/db-manage/common/batch-operate-icon/Index.vue
diff --git a/dbm-ui/frontend/src/components/cluster-common/big-data-host-table/HdfsHostTable.vue b/dbm-ui/frontend/src/views/db-manage/common/big-data-host-table/HdfsHostTable.vue
similarity index 91%
rename from dbm-ui/frontend/src/components/cluster-common/big-data-host-table/HdfsHostTable.vue
rename to dbm-ui/frontend/src/views/db-manage/common/big-data-host-table/HdfsHostTable.vue
index e82120f90a..21c912c988 100644
--- a/dbm-ui/frontend/src/components/cluster-common/big-data-host-table/HdfsHostTable.vue
+++ b/dbm-ui/frontend/src/views/db-manage/common/big-data-host-table/HdfsHostTable.vue
@@ -75,13 +75,6 @@
     </div>
   </div>
 </template>
-<script lang="tsx">
-  import { useI18n } from 'vue-i18n';
-
-  import type { HostDetails } from '@services/types';
-
-  export type IHostTableData = HostDetails;
-</script>
 <script setup lang="tsx">
   import _ from 'lodash';
   import {
@@ -89,6 +82,9 @@
     ref,
     shallowRef,
   } from 'vue';
+  import { useI18n } from 'vue-i18n';
+
+  import type { HostDetails } from '@services/types';
 
   import { useCopy } from '@hooks';
 
@@ -97,15 +93,13 @@
   import tableSetting from './common/tableSetting';
   import useLocalPagination from './hook/useLocalPagination';
 
-  import type { TableColumnRender } from '@/types/bkui-vue';
-
   interface Props {
-    data: IHostTableData[],
+    data: HostDetails[],
   }
 
   interface Emits {
-    (e: 'update:data', value: Array<IHostTableData>): void,
-    (e: 'change', nameNode: Array<IHostTableData>, zookeeper: Array<IHostTableData>): void
+    (e: 'update:data', value: Array<HostDetails>): void,
+    (e: 'change', nameNode: Array<HostDetails>, zookeeper: Array<HostDetails>): void
   }
 
   const props = defineProps<Props>();
@@ -130,7 +124,7 @@
     {
       label: t('主机ID'),
       field: 'host_id',
-      render: ({ data }: TableColumnRender) => data.host_id || '--',
+      render: ({ data }: {data: HostDetails}) => data.host_id || '--',
     },
     {
       label: 'IP',
@@ -181,23 +175,23 @@
     },
     {
       label: t('机型'),
-      field: 'cpu',
-      render: ({ data }: TableColumnRender) => data.cpu || '--',
+      field: 'bk_cpu',
+      render: ({ data }: {data: HostDetails}) => data.bk_cpu || '--',
     },
     {
       label: t('机房'),
       field: 'bk_idc_name',
-      render: ({ data }: TableColumnRender) => data.bk_idc_name || '--',
+      render: ({ data }: {data: HostDetails}) => data.bk_idc_name || '--',
     },
     {
       label: t('主机名称'),
       field: 'host_name',
-      render: ({ data }: TableColumnRender) => data.host_name || '--',
+      render: ({ data }: {data: HostDetails}) => data.host_name || '--',
     },
     {
       label: t('Agent状态'),
       field: 'alive',
-      render: ({ data }: TableColumnRender) => {
+      render: ({ data }: {data: HostDetails}) => {
         const info = data.alive === 1 ? { theme: 'success', text: t('正常') } : { theme: 'danger', text: t('异常') };
         return <DbStatus theme={info.theme}>{info.text}</DbStatus>;
       },
@@ -205,28 +199,28 @@
     {
       label: t('管控区域'),
       field: 'cloud_area',
-      render: ({ data }: TableColumnRender) => data.cloud_area.name || '--',
+      render: ({ data }: {data: HostDetails}) => data.cloud_area.name || '--',
     },
     {
       label: t('OS名称'),
       field: 'os_name',
-      render: ({ data }: TableColumnRender) => data.os_name || '--',
+      render: ({ data }: {data: HostDetails}) => data.os_name || '--',
     },
     {
       label: t('OS类型'),
       field: 'os_type',
-      render: ({ data }: TableColumnRender) => data.os_type || '--',
+      render: ({ data }: {data: HostDetails}) => data.os_type || '--',
     },
     {
       label: 'Agent ID',
       field: 'agent_id',
-      render: ({ data }: TableColumnRender) => data.agent_id || '--',
+      render: ({ data }: {data: HostDetails}) => data.agent_id || '--',
     },
     {
       label: t('操作'),
       field: 'operation',
       width: 100,
-      render: ({ index }: TableColumnRender) => (
+      render: ({ index }: {index: number}) => (
         <bk-button
           text
           theme="primary"
diff --git a/dbm-ui/frontend/src/components/cluster-common/big-data-host-table/RenderHostTable.vue b/dbm-ui/frontend/src/views/db-manage/common/big-data-host-table/RenderHostTable.vue
similarity index 88%
rename from dbm-ui/frontend/src/components/cluster-common/big-data-host-table/RenderHostTable.vue
rename to dbm-ui/frontend/src/views/db-manage/common/big-data-host-table/RenderHostTable.vue
index a5b50908ec..10a0c769e7 100644
--- a/dbm-ui/frontend/src/components/cluster-common/big-data-host-table/RenderHostTable.vue
+++ b/dbm-ui/frontend/src/views/db-manage/common/big-data-host-table/RenderHostTable.vue
@@ -74,19 +74,15 @@
     </div>
   </div>
 </template>
-<script lang="tsx">
-  import { useI18n } from 'vue-i18n';
-
-  import type { HostDetails } from '@services/types';
-
-  export type IHostTableData = HostDetails;
-</script>
 <script setup lang="tsx">
   import {
     ref,
     shallowRef,
     watch,
   } from 'vue';
+  import { useI18n } from 'vue-i18n';
+
+  import type { HostDetails } from '@services/types';
 
   import { useCopy } from '@hooks';
 
@@ -95,14 +91,12 @@
   import tableSetting from './common/tableSetting';
   import useLocalPagination from './hook/useLocalPagination';
 
-  import type { TableColumnRender } from '@/types/bkui-vue';
-
   interface Props {
-    data: Array<IHostTableData>
+    data: Array<HostDetails>
   }
 
   interface Emits {
-    (e: 'update:data', value: Array<IHostTableData>): void
+    (e: 'update:data', value: Array<HostDetails>): void
   }
 
   const props = defineProps<Props>();
@@ -123,23 +117,23 @@
     },
     {
       label: t('机型'),
-      field: 'cpu',
-      render: ({ data }: TableColumnRender) => data.cpu || '--',
+      field: 'bk_cpu',
+      render: ({ data }: {data: HostDetails}) => data.bk_cpu || '--',
     },
     {
       label: t('机房'),
       field: 'bk_idc_name',
-      render: ({ data }: TableColumnRender) => data.bk_idc_name || '--',
+      render: ({ data }: {data: HostDetails}) => data.bk_idc_name || '--',
     },
     {
       label: t('主机名称'),
       field: 'host_name',
-      render: ({ data }: TableColumnRender) => data.host_name || '--',
+      render: ({ data }: {data: HostDetails}) => data.host_name || '--',
     },
     {
       label: t('Agent状态'),
       field: 'alive',
-      render: ({ data }: TableColumnRender) => {
+      render: ({ data }: {data: HostDetails}) => {
         const info = data.alive === 1 ? { theme: 'success', text: t('正常') } : { theme: 'danger', text: t('异常') };
         return <DbStatus theme={info.theme}>{info.text}</DbStatus>;
       },
@@ -147,33 +141,33 @@
     {
       label: t('管控区域'),
       field: 'cloud_area',
-      render: ({ data }: TableColumnRender) => data.cloud_area.name || '--',
+      render: ({ data }: {data: HostDetails}) => data.cloud_area.name || '--',
     },
     {
       label: t('OS名称'),
       field: 'os_name',
-      render: ({ data }: TableColumnRender) => data.os_name || '--',
+      render: ({ data }: {data: HostDetails}) => data.os_name || '--',
     },
     {
       label: t('OS类型'),
       field: 'os_type',
-      render: ({ data }: TableColumnRender) => data.os_type || '--',
+      render: ({ data }: {data: HostDetails}) => data.os_type || '--',
     },
     {
       label: t('主机ID'),
       field: 'host_id',
-      render: ({ data }: TableColumnRender) => data.host_id || '--',
+      render: ({ data }: {data: HostDetails}) => data.host_id || '--',
     },
     {
       label: 'Agent ID',
       field: 'agent_id',
-      render: ({ data }: TableColumnRender) => data.agent_id || '--',
+      render: ({ data }: {data: HostDetails}) => data.agent_id || '--',
     },
     {
       label: t('操作'),
       field: 'operation',
       width: 100,
-      render: ({ data }: TableColumnRender) => (
+      render: ({ data }: {data: HostDetails}) => (
         <bk-button
           text
           theme="primary"
@@ -205,13 +199,13 @@
   };
 
   // 移除指定主机节点数
-  const handleRemove = (data: IHostTableData) => {
+  const handleRemove = (data: HostDetails) => {
     const result = props.data.reduce((result, item) => {
       if (item.host_id !== data.host_id) {
         result.push(item);
       }
       return result;
-    }, [] as Array<IHostTableData>);
+    }, [] as Array<HostDetails>);
     emits('update:data', result);
   };
 
@@ -227,7 +221,7 @@
         result.push(hostData);
       }
       return result;
-    }, [] as Array<IHostTableData>);
+    }, [] as Array<HostDetails>);
     emits('update:data', result);
   };
 
@@ -248,7 +242,7 @@
         result.push(hostData);
       }
       return result;
-    }, [] as Array<IHostTableData>);
+    }, [] as Array<HostDetails>);
     emits('update:data', result);
   };
 
diff --git a/dbm-ui/frontend/src/components/cluster-common/big-data-host-table/common/tableSetting.ts b/dbm-ui/frontend/src/views/db-manage/common/big-data-host-table/common/tableSetting.ts
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-common/big-data-host-table/common/tableSetting.ts
rename to dbm-ui/frontend/src/views/db-manage/common/big-data-host-table/common/tableSetting.ts
diff --git a/dbm-ui/frontend/src/components/cluster-common/big-data-host-table/es-host-table/components/EditHostInstance.vue b/dbm-ui/frontend/src/views/db-manage/common/big-data-host-table/es-host-table/components/EditHostInstance.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-common/big-data-host-table/es-host-table/components/EditHostInstance.vue
rename to dbm-ui/frontend/src/views/db-manage/common/big-data-host-table/es-host-table/components/EditHostInstance.vue
diff --git a/dbm-ui/frontend/src/components/cluster-common/big-data-host-table/es-host-table/index.vue b/dbm-ui/frontend/src/views/db-manage/common/big-data-host-table/es-host-table/index.vue
similarity index 99%
rename from dbm-ui/frontend/src/components/cluster-common/big-data-host-table/es-host-table/index.vue
rename to dbm-ui/frontend/src/views/db-manage/common/big-data-host-table/es-host-table/index.vue
index 6f76bf88f9..3a692b6ef9 100644
--- a/dbm-ui/frontend/src/components/cluster-common/big-data-host-table/es-host-table/index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/common/big-data-host-table/es-host-table/index.vue
@@ -84,6 +84,15 @@
 
   import type { HostDetails } from '@services/types';
 
+  interface Props {
+    data: Array<IHostTableDataWithInstance>;
+    searchable?: boolean;
+  }
+
+  interface Emits {
+    (e: 'update:data', value: Array<IHostTableDataWithInstance>): void;
+  }
+
   export interface IHostTableDataWithInstance extends HostDetails {
     instance_num: number;
   }
@@ -106,14 +115,7 @@
 
   import EditHostInstance from './components/EditHostInstance.vue';
 
-  interface Props {
-    data: Array<IHostTableDataWithInstance>,
-    searchable?: boolean,
-  }
 
-  interface Emits {
-    (e: 'update:data', value: Array<IHostTableDataWithInstance>): void
-  }
 
   const props = withDefaults(defineProps<Props>(), {
     searchable: true,
@@ -152,8 +154,8 @@
     },
     {
       label: t('机型'),
-      field: 'cpu',
-      render: ({ data }: {data: IHostTableDataWithInstance}) => data.cpu || '--',
+      field: 'bk_cpu',
+      render: ({ data }: {data: IHostTableDataWithInstance}) => data.bk_cpu || '--',
     },
     {
       label: t('机房'),
diff --git a/dbm-ui/frontend/src/components/cluster-common/big-data-host-table/hook/useLocalPagination.ts b/dbm-ui/frontend/src/views/db-manage/common/big-data-host-table/hook/useLocalPagination.ts
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-common/big-data-host-table/hook/useLocalPagination.ts
rename to dbm-ui/frontend/src/views/db-manage/common/big-data-host-table/hook/useLocalPagination.ts
diff --git a/dbm-ui/frontend/src/components/cluster-authorize/ClusterAuthorize.vue b/dbm-ui/frontend/src/views/db-manage/common/cluster-authorize/ClusterAuthorize.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-authorize/ClusterAuthorize.vue
rename to dbm-ui/frontend/src/views/db-manage/common/cluster-authorize/ClusterAuthorize.vue
diff --git a/dbm-ui/frontend/src/components/cluster-authorize/accout-rules-preview-table/Index.vue b/dbm-ui/frontend/src/views/db-manage/common/cluster-authorize/accout-rules-preview-table/Index.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-authorize/accout-rules-preview-table/Index.vue
rename to dbm-ui/frontend/src/views/db-manage/common/cluster-authorize/accout-rules-preview-table/Index.vue
diff --git a/dbm-ui/frontend/src/components/cluster-authorize/accouter-rules-selector/Index.vue b/dbm-ui/frontend/src/views/db-manage/common/cluster-authorize/accouter-rules-selector/Index.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-authorize/accouter-rules-selector/Index.vue
rename to dbm-ui/frontend/src/views/db-manage/common/cluster-authorize/accouter-rules-selector/Index.vue
diff --git a/dbm-ui/frontend/src/components/cluster-authorize/accouter-rules-selector/components/AccountRulesTable.vue b/dbm-ui/frontend/src/views/db-manage/common/cluster-authorize/accouter-rules-selector/components/AccountRulesTable.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-authorize/accouter-rules-selector/components/AccountRulesTable.vue
rename to dbm-ui/frontend/src/views/db-manage/common/cluster-authorize/accouter-rules-selector/components/AccountRulesTable.vue
diff --git a/dbm-ui/frontend/src/components/cluster-capacity-usage-rate/Index.vue b/dbm-ui/frontend/src/views/db-manage/common/cluster-capacity-usage-rate/Index.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-capacity-usage-rate/Index.vue
rename to dbm-ui/frontend/src/views/db-manage/common/cluster-capacity-usage-rate/Index.vue
diff --git a/dbm-ui/frontend/src/components/cluster-details/AsideList.vue b/dbm-ui/frontend/src/views/db-manage/common/cluster-details/AsideList.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-details/AsideList.vue
rename to dbm-ui/frontend/src/views/db-manage/common/cluster-details/AsideList.vue
diff --git a/dbm-ui/frontend/src/components/cluster-details/ClusterTopo.vue b/dbm-ui/frontend/src/views/db-manage/common/cluster-details/ClusterTopo.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-details/ClusterTopo.vue
rename to dbm-ui/frontend/src/views/db-manage/common/cluster-details/ClusterTopo.vue
diff --git a/dbm-ui/frontend/src/components/cluster-details/common/graphData.ts b/dbm-ui/frontend/src/views/db-manage/common/cluster-details/common/graphData.ts
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-details/common/graphData.ts
rename to dbm-ui/frontend/src/views/db-manage/common/cluster-details/common/graphData.ts
diff --git a/dbm-ui/frontend/src/components/cluster-details/common/useRenderGraph.tsx b/dbm-ui/frontend/src/views/db-manage/common/cluster-details/common/useRenderGraph.tsx
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-details/common/useRenderGraph.tsx
rename to dbm-ui/frontend/src/views/db-manage/common/cluster-details/common/useRenderGraph.tsx
diff --git a/dbm-ui/frontend/src/components/cluster-entry-config/Index.vue b/dbm-ui/frontend/src/views/db-manage/common/cluster-entry-config/Index.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-entry-config/Index.vue
rename to dbm-ui/frontend/src/views/db-manage/common/cluster-entry-config/Index.vue
diff --git a/dbm-ui/frontend/src/views/db-manage/common/cluster-entry-config/MultipleInput.vue b/dbm-ui/frontend/src/views/db-manage/common/cluster-entry-config/MultipleInput.vue
new file mode 100644
index 0000000000..740f316609
--- /dev/null
+++ b/dbm-ui/frontend/src/views/db-manage/common/cluster-entry-config/MultipleInput.vue
@@ -0,0 +1,126 @@
+<template>
+  <div
+    class="entry-config-multi"
+    :class="{ 'is-error': isError }">
+    <BkInput
+      v-model="modelValue"
+      :disabled="disabled"
+      placeholder=" "
+      :rows="rows"
+      style="resize: none"
+      type="textarea"
+      @blur="handleBlur"
+      @input="handleInput" />
+    <div
+      v-show="isError"
+      class="error-box">
+      <div
+        v-for="(item, index) in errorList"
+        :key="index"
+        class="tip-box">
+        <DbIcon
+          v-if="!item.isChecked"
+          v-bk-tooltips="item.tip"
+          class="error-icon"
+          type="exclamation-fill" />
+      </div>
+    </div>
+  </div>
+</template>
+<script lang="ts">
+  import { ipv4 } from '@common/regex';
+
+  export const checkIp = (value: string) => ipv4.test(value);
+</script>
+<script setup lang="ts">
+  import { useI18n } from 'vue-i18n';
+
+  interface Props {
+    disabled?: boolean;
+  }
+
+  interface ErrorItem {
+    isChecked: boolean;
+    tip: string;
+  }
+
+  defineProps<Props>();
+
+  const modelValue = defineModel<string>({
+    default: '',
+  });
+
+  const { t } = useI18n();
+
+  const isError = ref(false);
+  const errorList = ref<ErrorItem[]>([]);
+
+  const rows = computed(() => modelValue.value.split('\n').length);
+
+  const handleBlur = () => {
+    const inputArr = modelValue.value.split('\n');
+    const resultArr: ErrorItem[] = [];
+    inputArr.forEach((item) => {
+      const isChecked = checkIp(item);
+      if (!isChecked) {
+        isError.value = true;
+      }
+      resultArr.push({
+        isChecked,
+        tip: !isChecked && item === '' ? t('IP 不能为空') : t('IP 输入有误'),
+      });
+    });
+    errorList.value = resultArr;
+  };
+
+  const handleInput = () => {
+    isError.value = false;
+  };
+</script>
+<style lang="less" scoped>
+  .entry-config-multi {
+    position: relative;
+
+    .bk-textarea {
+      border-color: transparent;
+      border-radius: 0;
+    }
+
+    .is-focused {
+      border-color: #3a84ff;
+    }
+
+    :deep(textarea) {
+      min-height: 42px !important;
+      padding: 12px 18px;
+      border-radius: 0;
+    }
+
+    .error-box {
+      position: absolute;
+      top: 0;
+      right: 0;
+      width: 25px;
+      height: 100%;
+      padding-top: 12px;
+
+      .tip-box {
+        display: flex;
+        height: 18px;
+        padding-top: 3.5px;
+        justify-content: center;
+
+        .error-icon {
+          font-size: 14px;
+          color: #ea3636;
+        }
+      }
+    }
+  }
+
+  .is-error {
+    :deep(textarea) {
+      background-color: #fff0f1;
+    }
+  }
+</style>
diff --git a/dbm-ui/frontend/src/components/cluster-entry-config/RenderBindIps.vue b/dbm-ui/frontend/src/views/db-manage/common/cluster-entry-config/RenderBindIps.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-entry-config/RenderBindIps.vue
rename to dbm-ui/frontend/src/views/db-manage/common/cluster-entry-config/RenderBindIps.vue
diff --git a/dbm-ui/frontend/src/components/cluster-event-change/EventChange.vue b/dbm-ui/frontend/src/views/db-manage/common/cluster-event-change/EventChange.vue
similarity index 80%
rename from dbm-ui/frontend/src/components/cluster-event-change/EventChange.vue
rename to dbm-ui/frontend/src/views/db-manage/common/cluster-event-change/EventChange.vue
index d6a9b8eea6..0248d4a5e8 100644
--- a/dbm-ui/frontend/src/components/cluster-event-change/EventChange.vue
+++ b/dbm-ui/frontend/src/views/db-manage/common/cluster-event-change/EventChange.vue
@@ -15,22 +15,20 @@
   <div class="event-change db-scroll-y">
     <div class="event-change__operations mb-16">
       <BkDatePicker
-        v-model="state.daterange"
+        v-model="daterange"
         append-to-body
         :placeholder="$t('请选择')"
         style="width: 410px"
         type="datetimerange"
         @change="fetchData" />
     </div>
-    <BkLoading :loading="state.isLoading">
-      <DbTable
-        ref="tableRef"
-        :columns="columns"
-        :data-source="dataSource"
-        fixed-pagination
-        releate-url-query
-        @clear-search="handleClearFilters" />
-    </BkLoading>
+    <DbTable
+      ref="tableRef"
+      :columns="columns"
+      :data-source="dataSource"
+      fixed-pagination
+      releate-url-query
+      @clear-search="handleClearFilters" />
   </div>
 </template>
 
@@ -43,23 +41,16 @@
     getClusterOperateRecords,
     getInstanceOperateRecords,
   } from '@services/source/ticket';
-  import type { ClusterOperateRecord } from '@services/types/ticket';
 
   import DbStatus from '@components/db-status/index.vue';
 
-  import type { TableProps } from '@/types/bkui-vue';
-
-  interface State {
-    daterange: [string | Date, string | Date],
-    data: ClusterOperateRecord[],
-    isLoading: boolean
-  }
-
   interface Props {
     id: number, // 集群 or 实例 id
     isFetchInstance?: boolean
   }
 
+  type IRowData = ServiceReturnType<typeof getInstanceOperateRecords>['results'][number]
+
   const props = withDefaults(defineProps<Props>(), {
     isFetchInstance: false,
   });
@@ -67,15 +58,12 @@
   const { t } = useI18n();
 
   const tableRef = ref();
-  const state = reactive<State>({
-    daterange: [subDays(new Date(), 6), new Date()],
-    isLoading: false,
-    data: [],
-  });
+
+  const daterange = ref<[string, string]|[Date, Date]>([subDays(new Date(), 6), new Date()])
 
   const dataSource = computed(() => (props.isFetchInstance ? getInstanceOperateRecords : getClusterOperateRecords));
 
-  const columns: TableProps['columns'] = [
+  const columns = [
     {
       label: t('时间'),
       field: 'create_at',
@@ -85,7 +73,7 @@
     }, {
       label: t('操作结果'),
       field: 'op_status',
-      render: ({ data }: {data: ClusterOperateRecord}) => {
+      render: ({ data }: {data: IRowData}) => {
         const errorStatus = { text: t('失败'), theme: 'danger' };
         const successStatus = { text: t('成功'), theme: 'success' };
         const loadingStatus = { text: t('执行中'), theme: 'loading' };
@@ -105,7 +93,7 @@
     }, {
       label: t('单据链接'),
       field: 'ticket_id',
-      render: ({ data }: {data: ClusterOperateRecord}) => (
+      render: ({ data }: {data: IRowData}) => (
         <router-link
           to={{
             name: 'bizTicketManage',
@@ -124,7 +112,7 @@
     nextTick(() => {
       if (!props.id) return;
 
-      const [start, end] = state.daterange;
+      const [start, end] = daterange.value;
       const dateParams = start && end ? {
         start_time: format(new Date(Number(start)), 'yyyy-MM-dd HH:mm:ss'),
         end_time: format(new Date(Number(end)), 'yyyy-MM-dd HH:mm:ss'),
@@ -148,10 +136,9 @@
   });
 
   function handleClearFilters() {
-    state.daterange = ['', ''];
+    daterange.value = ['', ''];
     fetchData();
   }
-
 </script>
 
 <style lang="less" scoped>
diff --git a/dbm-ui/frontend/src/components/cluster-export-data/Index.vue b/dbm-ui/frontend/src/views/db-manage/common/cluster-export-data/Index.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-export-data/Index.vue
rename to dbm-ui/frontend/src/views/db-manage/common/cluster-export-data/Index.vue
diff --git a/dbm-ui/frontend/src/components/cluster-export-data/component/Content.vue b/dbm-ui/frontend/src/views/db-manage/common/cluster-export-data/component/Content.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-export-data/component/Content.vue
rename to dbm-ui/frontend/src/views/db-manage/common/cluster-export-data/component/Content.vue
diff --git a/dbm-ui/frontend/src/components/cluster-export-data/component/TableNameFromItem.vue b/dbm-ui/frontend/src/views/db-manage/common/cluster-export-data/component/TableNameFromItem.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-export-data/component/TableNameFromItem.vue
rename to dbm-ui/frontend/src/views/db-manage/common/cluster-export-data/component/TableNameFromItem.vue
diff --git a/dbm-ui/frontend/src/components/cluster-monitor/MonitorDashboard.vue b/dbm-ui/frontend/src/views/db-manage/common/cluster-monitor/MonitorDashboard.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-monitor/MonitorDashboard.vue
rename to dbm-ui/frontend/src/views/db-manage/common/cluster-monitor/MonitorDashboard.vue
diff --git a/dbm-ui/frontend/src/components/cluster-spec-plan-selector/Index.vue b/dbm-ui/frontend/src/views/db-manage/common/cluster-spec-plan-selector/Index.vue
similarity index 99%
rename from dbm-ui/frontend/src/components/cluster-spec-plan-selector/Index.vue
rename to dbm-ui/frontend/src/views/db-manage/common/cluster-spec-plan-selector/Index.vue
index 004070e435..8e2d8981aa 100644
--- a/dbm-ui/frontend/src/components/cluster-spec-plan-selector/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/common/cluster-spec-plan-selector/Index.vue
@@ -166,7 +166,7 @@
 
   import { ClusterTypes } from '@common/const';
 
-  import SpecSelector from '@components/apply-items/SpecSelector.vue';
+  import SpecSelector from '@views/db-manage/common/apply-items/SpecSelector.vue';
 
   export type TicketSpecInfo = Pick<ClusterSpecModel, 'spec_id' | 'spec_name' | 'cluster_capacity' | 'machine_pair'>
 
diff --git a/dbm-ui/frontend/src/components/dropdown-export-excel/index.vue b/dbm-ui/frontend/src/views/db-manage/common/dropdown-export-excel/index.vue
similarity index 75%
rename from dbm-ui/frontend/src/components/dropdown-export-excel/index.vue
rename to dbm-ui/frontend/src/views/db-manage/common/dropdown-export-excel/index.vue
index 9c01481b78..5f0f758e5a 100644
--- a/dbm-ui/frontend/src/components/dropdown-export-excel/index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/common/dropdown-export-excel/index.vue
@@ -32,58 +32,38 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import {
-    exportEsClusterToExcel,
-    exportEsInstanceToExcel,
-  } from '@services/source/es';
-  import {
-    exportHdfsClusterToExcel,
-    exportHdfsInstanceToExcel,
-  } from '@services/source/hdfs';
-  import {
-    exportInfluxdbClusterToExcel,
-    exportInfluxdbInstanceToExcel,
-  } from '@services/source/influxdb';
-  import {
-    exportKafkaClusterToExcel,
-    exportKafkaInstanceToExcel,
-  } from '@services/source/kafka';
-  import {
-    exportMongodbClusterToExcel,
-    exportMongodbInstanceToExcel,
-  } from '@services/source/mongodb';
-  import {
-    exportPulsarClusterToExcel,
-    exportPulsarInstanceToExcel,
-  } from '@services/source/pulsar';
-  import {
-    exportRedisClusterToExcel,
-    exportRedisInstanceToExcel,
-  } from '@services/source/redis';
-  import {
-    exportRiakClusterToExcel,
-    exportRiakInstanceToExcel,
-  } from '@services/source/riak';
-  import {
-    exportSpiderClusterToExcel,
-    exportSpiderInstanceToExcel,
-  } from '@services/source/spider';
+  import { exportEsClusterToExcel, exportEsInstanceToExcel } from '@services/source/es';
+  import { exportHdfsClusterToExcel, exportHdfsInstanceToExcel } from '@services/source/hdfs';
+  import { exportInfluxdbClusterToExcel, exportInfluxdbInstanceToExcel } from '@services/source/influxdb';
+  import { exportKafkaClusterToExcel, exportKafkaInstanceToExcel } from '@services/source/kafka';
+  import { exportMongodbClusterToExcel, exportMongodbInstanceToExcel } from '@services/source/mongodb';
+  import { exportPulsarClusterToExcel, exportPulsarInstanceToExcel } from '@services/source/pulsar';
+  import { exportRedisClusterToExcel, exportRedisInstanceToExcel } from '@services/source/redis';
+  import { exportRiakClusterToExcel, exportRiakInstanceToExcel } from '@services/source/riak';
+  import { exportSpiderClusterToExcel, exportSpiderInstanceToExcel } from '@services/source/spider';
   import {
     exportSqlServerHaClusterToExcel,
     exportSqlServerHaInstanceToExcel,
   } from '@services/source/sqlserveHaCluster';
   import { exportSqlServerSingleClusterToExcel } from '@services/source/sqlserverSingleCluster';
-  import {
-    exportTendbhaClusterToExcel,
-    exportTendbhaInstanceToExcel,
-  } from '@services/source/tendbha';
-  import {
-    exportTendbsingleClusterToExcel,
-    exportTendbsingleInstanceToExcel,
-  } from '@services/source/tendbsingle';
+  import { exportTendbhaClusterToExcel, exportTendbhaInstanceToExcel } from '@services/source/tendbha';
+  import { exportTendbsingleClusterToExcel, exportTendbsingleInstanceToExcel } from '@services/source/tendbsingle';
 
   interface Props {
-    type: 'tendbsingle' | 'tendbha' | 'spider' | 'redis' | 'pulsar' | 'kafka' | 'influxdb' | 'hdfs' | 'es' | 'riak' | 'mongodb' | 'sqlserver_ha' | 'sqlserver_single';
+    type:
+      | 'tendbsingle'
+      | 'tendbha'
+      | 'spider'
+      | 'redis'
+      | 'pulsar'
+      | 'kafka'
+      | 'influxdb'
+      | 'hdfs'
+      | 'es'
+      | 'riak'
+      | 'mongodb'
+      | 'sqlserver_ha'
+      | 'sqlserver_single';
     ids?: number[];
     exportType?: 'cluster' | 'instance';
   }
diff --git a/dbm-ui/frontend/src/components/cluster-common/es-host-expansion/Index.vue b/dbm-ui/frontend/src/views/db-manage/common/es-host-expansion/Index.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-common/es-host-expansion/Index.vue
rename to dbm-ui/frontend/src/views/db-manage/common/es-host-expansion/Index.vue
diff --git a/dbm-ui/frontend/src/components/cluster-common/es-host-expansion/components/HostSelector.vue b/dbm-ui/frontend/src/views/db-manage/common/es-host-expansion/components/HostSelector.vue
similarity index 96%
rename from dbm-ui/frontend/src/components/cluster-common/es-host-expansion/components/HostSelector.vue
rename to dbm-ui/frontend/src/views/db-manage/common/es-host-expansion/components/HostSelector.vue
index 6b950a2b99..596917315b 100644
--- a/dbm-ui/frontend/src/components/cluster-common/es-host-expansion/components/HostSelector.vue
+++ b/dbm-ui/frontend/src/views/db-manage/common/es-host-expansion/components/HostSelector.vue
@@ -88,10 +88,11 @@
 
   import { OSTypes } from '@common/const';
 
-  import EditHostInstance from '@components/cluster-common/big-data-host-table/es-host-table/components/EditHostInstance.vue';
-  import HostAgentStatus from '@components/cluster-common/HostAgentStatus.vue';
+  import HostAgentStatus from '@components/host-agent-status/Index.vue';
   import IpSelector from '@components/ip-selector/IpSelector.vue';
 
+  import EditHostInstance from '@views/db-manage/common/big-data-host-table/es-host-table/components/EditHostInstance.vue';
+
   import type { TExpansionNode } from '../Index.vue';
 
   interface Props {
diff --git a/dbm-ui/frontend/src/components/cluster-common/es-host-expansion/components/ResourcePoolSelector.vue b/dbm-ui/frontend/src/views/db-manage/common/es-host-expansion/components/ResourcePoolSelector.vue
similarity index 98%
rename from dbm-ui/frontend/src/components/cluster-common/es-host-expansion/components/ResourcePoolSelector.vue
rename to dbm-ui/frontend/src/views/db-manage/common/es-host-expansion/components/ResourcePoolSelector.vue
index 9c7c06f109..03be7555a9 100644
--- a/dbm-ui/frontend/src/components/cluster-common/es-host-expansion/components/ResourcePoolSelector.vue
+++ b/dbm-ui/frontend/src/views/db-manage/common/es-host-expansion/components/ResourcePoolSelector.vue
@@ -78,7 +78,7 @@
   import { getSpecResourceCount } from '@services/source/dbresourceResource';
   import { fetchRecommendSpec, getResourceSpecList } from '@services/source/dbresourceSpec';
 
-  import SpecDetail from '@components/cluster-common/SpecDetailForPopover.vue';
+  import SpecDetail from '@views/db-manage/common/SpecDetailForPopover.vue';
 
   import type { TExpansionNode } from '../Index.vue';
 
diff --git a/dbm-ui/frontend/src/components/cluster-common/es-host-replace/Index.vue b/dbm-ui/frontend/src/views/db-manage/common/es-host-replace/Index.vue
similarity index 98%
rename from dbm-ui/frontend/src/components/cluster-common/es-host-replace/Index.vue
rename to dbm-ui/frontend/src/views/db-manage/common/es-host-replace/Index.vue
index 03231aa796..c3b755260c 100644
--- a/dbm-ui/frontend/src/components/cluster-common/es-host-replace/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/common/es-host-replace/Index.vue
@@ -123,7 +123,7 @@
   import type EsNodeModel from '@services/model/es/es-node';
   import { checkHost } from '@services/source/ipchooser';
 
-  import { type IHostTableDataWithInstance } from '@components/cluster-common/big-data-host-table/es-host-table/index.vue';
+  import { type IHostTableDataWithInstance } from '@views/db-manage/common/big-data-host-table/es-host-table/index.vue';
 
   import { random } from '@utils';
 
diff --git a/dbm-ui/frontend/src/components/cluster-common/es-host-replace/components/HostSelector.vue b/dbm-ui/frontend/src/views/db-manage/common/es-host-replace/components/HostSelector.vue
similarity index 97%
rename from dbm-ui/frontend/src/components/cluster-common/es-host-replace/components/HostSelector.vue
rename to dbm-ui/frontend/src/views/db-manage/common/es-host-replace/components/HostSelector.vue
index d6cb075470..3c928d55ba 100644
--- a/dbm-ui/frontend/src/components/cluster-common/es-host-replace/components/HostSelector.vue
+++ b/dbm-ui/frontend/src/views/db-manage/common/es-host-replace/components/HostSelector.vue
@@ -73,9 +73,10 @@
 
   import { OSTypes } from '@common/const';
 
-  import EditHostInstance from '@components/cluster-common/big-data-host-table/es-host-table/components/EditHostInstance.vue';
   import IpSelector from '@components/ip-selector/IpSelector.vue';
 
+  import EditHostInstance from '@views/db-manage/common/big-data-host-table/es-host-table/components/EditHostInstance.vue';
+
   import type { TReplaceNode } from '../Index.vue';
 
   interface Props {
diff --git a/dbm-ui/frontend/src/components/cluster-common/es-host-replace/components/ResourcePoolSelector.vue b/dbm-ui/frontend/src/views/db-manage/common/es-host-replace/components/ResourcePoolSelector.vue
similarity index 98%
rename from dbm-ui/frontend/src/components/cluster-common/es-host-replace/components/ResourcePoolSelector.vue
rename to dbm-ui/frontend/src/views/db-manage/common/es-host-replace/components/ResourcePoolSelector.vue
index 999f95fd6f..0c8336a6a6 100644
--- a/dbm-ui/frontend/src/components/cluster-common/es-host-replace/components/ResourcePoolSelector.vue
+++ b/dbm-ui/frontend/src/views/db-manage/common/es-host-replace/components/ResourcePoolSelector.vue
@@ -53,7 +53,7 @@
   import { getSpecResourceCount } from '@services/source/dbresourceResource';
   import { fetchRecommendSpec, getResourceSpecList } from '@services/source/dbresourceSpec';
 
-  import SpecDetail from '@components/cluster-common/SpecDetailForPopover.vue';
+  import SpecDetail from '@views/db-manage/common/SpecDetailForPopover.vue';
 
   import type { TReplaceNode } from '../Index.vue';
 
diff --git a/dbm-ui/frontend/src/components/cluster-common/host-expansion/Index.vue b/dbm-ui/frontend/src/views/db-manage/common/host-expansion/Index.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-common/host-expansion/Index.vue
rename to dbm-ui/frontend/src/views/db-manage/common/host-expansion/Index.vue
diff --git a/dbm-ui/frontend/src/components/cluster-common/host-expansion/NodeStatusList.vue b/dbm-ui/frontend/src/views/db-manage/common/host-expansion/NodeStatusList.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-common/host-expansion/NodeStatusList.vue
rename to dbm-ui/frontend/src/views/db-manage/common/host-expansion/NodeStatusList.vue
diff --git a/dbm-ui/frontend/src/components/cluster-common/host-expansion/components/HostSelector.vue b/dbm-ui/frontend/src/views/db-manage/common/host-expansion/components/HostSelector.vue
similarity index 98%
rename from dbm-ui/frontend/src/components/cluster-common/host-expansion/components/HostSelector.vue
rename to dbm-ui/frontend/src/views/db-manage/common/host-expansion/components/HostSelector.vue
index ac39a0341d..df49464726 100644
--- a/dbm-ui/frontend/src/components/cluster-common/host-expansion/components/HostSelector.vue
+++ b/dbm-ui/frontend/src/views/db-manage/common/host-expansion/components/HostSelector.vue
@@ -88,7 +88,7 @@
 
   import { OSTypes } from '@common/const';
 
-  import HostAgentStatus from '@components/cluster-common/HostAgentStatus.vue';
+  import HostAgentStatus from '@components/host-agent-status/Index.vue';
   import IpSelector from '@components/ip-selector/IpSelector.vue';
 
   import type { TExpansionNode } from '../Index.vue';
diff --git a/dbm-ui/frontend/src/components/cluster-common/host-expansion/components/ResourcePoolSelector.vue b/dbm-ui/frontend/src/views/db-manage/common/host-expansion/components/ResourcePoolSelector.vue
similarity index 98%
rename from dbm-ui/frontend/src/components/cluster-common/host-expansion/components/ResourcePoolSelector.vue
rename to dbm-ui/frontend/src/views/db-manage/common/host-expansion/components/ResourcePoolSelector.vue
index 6260cacef4..b638d64037 100644
--- a/dbm-ui/frontend/src/components/cluster-common/host-expansion/components/ResourcePoolSelector.vue
+++ b/dbm-ui/frontend/src/views/db-manage/common/host-expansion/components/ResourcePoolSelector.vue
@@ -80,7 +80,7 @@
   import { getSpecResourceCount } from '@services/source/dbresourceResource';
   import { fetchRecommendSpec, getResourceSpecList } from '@services/source/dbresourceSpec';
 
-  import SpecDetail from '@components/cluster-common/SpecDetailForPopover.vue';
+  import SpecDetail from '@views/db-manage/common/SpecDetailForPopover.vue';
 
   import type { TExpansionNode } from '../Index.vue';
 
diff --git a/dbm-ui/frontend/src/components/cluster-common/host-replace/Index.vue b/dbm-ui/frontend/src/views/db-manage/common/host-replace/Index.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-common/host-replace/Index.vue
rename to dbm-ui/frontend/src/views/db-manage/common/host-replace/Index.vue
diff --git a/dbm-ui/frontend/src/components/cluster-common/host-replace/components/HostSelector.vue b/dbm-ui/frontend/src/views/db-manage/common/host-replace/components/HostSelector.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-common/host-replace/components/HostSelector.vue
rename to dbm-ui/frontend/src/views/db-manage/common/host-replace/components/HostSelector.vue
diff --git a/dbm-ui/frontend/src/components/cluster-common/host-replace/components/ResourcePoolSelector.vue b/dbm-ui/frontend/src/views/db-manage/common/host-replace/components/ResourcePoolSelector.vue
similarity index 98%
rename from dbm-ui/frontend/src/components/cluster-common/host-replace/components/ResourcePoolSelector.vue
rename to dbm-ui/frontend/src/views/db-manage/common/host-replace/components/ResourcePoolSelector.vue
index 36cecd64cf..d08b17eb55 100644
--- a/dbm-ui/frontend/src/components/cluster-common/host-replace/components/ResourcePoolSelector.vue
+++ b/dbm-ui/frontend/src/views/db-manage/common/host-replace/components/ResourcePoolSelector.vue
@@ -61,7 +61,7 @@
   import { getSpecResourceCount } from '@services/source/dbresourceResource';
   import { fetchRecommendSpec, getResourceSpecList } from '@services/source/dbresourceSpec';
 
-  import SpecDetail from '@components/cluster-common/SpecDetailForPopover.vue';
+  import SpecDetail from '@views/db-manage/common/SpecDetailForPopover.vue';
 
   import type { TReplaceNode } from '../Index.vue';
 
diff --git a/dbm-ui/frontend/src/components/cluster-common/host-shrink/Index.vue b/dbm-ui/frontend/src/views/db-manage/common/host-shrink/Index.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-common/host-shrink/Index.vue
rename to dbm-ui/frontend/src/views/db-manage/common/host-shrink/Index.vue
diff --git a/dbm-ui/frontend/src/components/cluster-common/host-shrink/NodeStatusList.vue b/dbm-ui/frontend/src/views/db-manage/common/host-shrink/NodeStatusList.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/cluster-common/host-shrink/NodeStatusList.vue
rename to dbm-ui/frontend/src/views/db-manage/common/host-shrink/NodeStatusList.vue
diff --git a/dbm-ui/frontend/src/components/cluster-common/host-shrink/components/SelectOriginalHost.vue b/dbm-ui/frontend/src/views/db-manage/common/host-shrink/components/SelectOriginalHost.vue
similarity index 98%
rename from dbm-ui/frontend/src/components/cluster-common/host-shrink/components/SelectOriginalHost.vue
rename to dbm-ui/frontend/src/views/db-manage/common/host-shrink/components/SelectOriginalHost.vue
index 2392d0bfa2..40de240dee 100644
--- a/dbm-ui/frontend/src/components/cluster-common/host-shrink/components/SelectOriginalHost.vue
+++ b/dbm-ui/frontend/src/views/db-manage/common/host-shrink/components/SelectOriginalHost.vue
@@ -70,9 +70,10 @@
   import type KafkaNodeModel from '@services/model/kafka/kafka-node';
   import type PulsarNodeModel from '@services/model/pulsar/pulsar-node';
 
-  import RenderClusterRole from '@components/cluster-common/RenderRole.vue';
   import RenderHostStatus from '@components/render-host-status/Index.vue';
 
+  import RenderClusterRole from '@views/db-manage/common/RenderRole.vue';
+
   import type { TShrinkNode } from '../Index.vue';
 
   interface Props {
diff --git a/dbm-ui/frontend/src/components/render-instances/RenderInstances.vue b/dbm-ui/frontend/src/views/db-manage/common/render-instances/RenderInstances.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/render-instances/RenderInstances.vue
rename to dbm-ui/frontend/src/views/db-manage/common/render-instances/RenderInstances.vue
diff --git a/dbm-ui/frontend/src/views/db-manage/common/sql-execute/cluster-ids/Index.vue b/dbm-ui/frontend/src/views/db-manage/common/sql-execute/cluster-ids/Index.vue
index 9f38835bc5..5dc4926eff 100644
--- a/dbm-ui/frontend/src/views/db-manage/common/sql-execute/cluster-ids/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/common/sql-execute/cluster-ids/Index.vue
@@ -62,8 +62,8 @@
 
   import { ClusterTypes } from '@common/const';
 
-  import RenderClusterStatus from '@components/cluster-common/RenderStatus.vue';
   import ClusterSelector from '@components/cluster-selector/Index.vue';
+  import RenderClusterStatus from '@components/cluster-status/Index.vue';
 
   interface Props {
     clusterTypeList: ClusterTypes[]
diff --git a/dbm-ui/frontend/src/components/webconsole/Index.vue b/dbm-ui/frontend/src/views/db-manage/common/webconsole/Index.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/webconsole/Index.vue
rename to dbm-ui/frontend/src/views/db-manage/common/webconsole/Index.vue
diff --git a/dbm-ui/frontend/src/components/webconsole/components/ClearScreen.vue b/dbm-ui/frontend/src/views/db-manage/common/webconsole/components/ClearScreen.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/webconsole/components/ClearScreen.vue
rename to dbm-ui/frontend/src/views/db-manage/common/webconsole/components/ClearScreen.vue
diff --git a/dbm-ui/frontend/src/components/webconsole/components/ClusterTabs.vue b/dbm-ui/frontend/src/views/db-manage/common/webconsole/components/ClusterTabs.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/webconsole/components/ClusterTabs.vue
rename to dbm-ui/frontend/src/views/db-manage/common/webconsole/components/ClusterTabs.vue
diff --git a/dbm-ui/frontend/src/components/webconsole/components/ExportData.vue b/dbm-ui/frontend/src/views/db-manage/common/webconsole/components/ExportData.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/webconsole/components/ExportData.vue
rename to dbm-ui/frontend/src/views/db-manage/common/webconsole/components/ExportData.vue
diff --git a/dbm-ui/frontend/src/components/webconsole/components/FontSetting.vue b/dbm-ui/frontend/src/views/db-manage/common/webconsole/components/FontSetting.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/webconsole/components/FontSetting.vue
rename to dbm-ui/frontend/src/views/db-manage/common/webconsole/components/FontSetting.vue
diff --git a/dbm-ui/frontend/src/components/webconsole/components/FullScreen.vue b/dbm-ui/frontend/src/views/db-manage/common/webconsole/components/FullScreen.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/webconsole/components/FullScreen.vue
rename to dbm-ui/frontend/src/views/db-manage/common/webconsole/components/FullScreen.vue
diff --git a/dbm-ui/frontend/src/components/webconsole/components/RawSwitcher.vue b/dbm-ui/frontend/src/views/db-manage/common/webconsole/components/RawSwitcher.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/webconsole/components/RawSwitcher.vue
rename to dbm-ui/frontend/src/views/db-manage/common/webconsole/components/RawSwitcher.vue
diff --git a/dbm-ui/frontend/src/components/webconsole/components/console-panel/Index.vue b/dbm-ui/frontend/src/views/db-manage/common/webconsole/components/console-panel/Index.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/webconsole/components/console-panel/Index.vue
rename to dbm-ui/frontend/src/views/db-manage/common/webconsole/components/console-panel/Index.vue
diff --git a/dbm-ui/frontend/src/components/webconsole/components/console-panel/components/RenderMysqlMessage.vue b/dbm-ui/frontend/src/views/db-manage/common/webconsole/components/console-panel/components/RenderMysqlMessage.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/webconsole/components/console-panel/components/RenderMysqlMessage.vue
rename to dbm-ui/frontend/src/views/db-manage/common/webconsole/components/console-panel/components/RenderMysqlMessage.vue
diff --git a/dbm-ui/frontend/src/components/webconsole/components/console-panel/components/RenderRedisMessage.vue b/dbm-ui/frontend/src/views/db-manage/common/webconsole/components/console-panel/components/RenderRedisMessage.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/webconsole/components/console-panel/components/RenderRedisMessage.vue
rename to dbm-ui/frontend/src/views/db-manage/common/webconsole/components/console-panel/components/RenderRedisMessage.vue
diff --git a/dbm-ui/frontend/src/components/webconsole/components/usage-help/Index.vue b/dbm-ui/frontend/src/views/db-manage/common/webconsole/components/usage-help/Index.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/webconsole/components/usage-help/Index.vue
rename to dbm-ui/frontend/src/views/db-manage/common/webconsole/components/usage-help/Index.vue
diff --git a/dbm-ui/frontend/src/components/webconsole/components/usage-help/components/RenderMysqlContent.vue b/dbm-ui/frontend/src/views/db-manage/common/webconsole/components/usage-help/components/RenderMysqlContent.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/webconsole/components/usage-help/components/RenderMysqlContent.vue
rename to dbm-ui/frontend/src/views/db-manage/common/webconsole/components/usage-help/components/RenderMysqlContent.vue
diff --git a/dbm-ui/frontend/src/components/webconsole/components/usage-help/components/RenderRedisContent.vue b/dbm-ui/frontend/src/views/db-manage/common/webconsole/components/usage-help/components/RenderRedisContent.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/webconsole/components/usage-help/components/RenderRedisContent.vue
rename to dbm-ui/frontend/src/views/db-manage/common/webconsole/components/usage-help/components/RenderRedisContent.vue
diff --git a/dbm-ui/frontend/src/components/webconsole/components/usage-help/components/UsingHelpPanel.vue b/dbm-ui/frontend/src/views/db-manage/common/webconsole/components/usage-help/components/UsingHelpPanel.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/webconsole/components/usage-help/components/UsingHelpPanel.vue
rename to dbm-ui/frontend/src/views/db-manage/common/webconsole/components/usage-help/components/UsingHelpPanel.vue
diff --git a/dbm-ui/frontend/src/views/db-manage/elastic-search/apply/Index.vue b/dbm-ui/frontend/src/views/db-manage/elastic-search/apply/Index.vue
index 1749d81bf5..f1e03734ff 100644
--- a/dbm-ui/frontend/src/views/db-manage/elastic-search/apply/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/elastic-search/apply/Index.vue
@@ -343,21 +343,19 @@
 
   import { OSTypes } from '@common/const';
 
-  // import AffinityItem from '@components/apply-items/AffinityItem.vue';
-  import BusinessItems from '@components/apply-items/BusinessItems.vue';
-  import CloudItem from '@components/apply-items/CloudItem.vue';
-  import ClusterAlias from '@components/apply-items/ClusterAlias.vue';
-  import ClusterName from '@components/apply-items/ClusterName.vue';
-  import DeployVersion from '@components/apply-items/DeployVersion.vue';
-  import RegionItem from '@components/apply-items/RegionItem.vue';
-  import SpecSelector from '@components/apply-items/SpecSelector.vue';
+  import IpSelector from '@components/ip-selector/IpSelector.vue';
+
+  import BusinessItems from '@views/db-manage/common/apply-items/BusinessItems.vue';
+  import CloudItem from '@views/db-manage/common/apply-items/CloudItem.vue';
+  import ClusterAlias from '@views/db-manage/common/apply-items/ClusterAlias.vue';
+  import ClusterName from '@views/db-manage/common/apply-items/ClusterName.vue';
+  import DeployVersion from '@views/db-manage/common/apply-items/DeployVersion.vue';
+  import RegionItem from '@views/db-manage/common/apply-items/RegionItem.vue';
+  import SpecSelector from '@views/db-manage/common/apply-items/SpecSelector.vue';
   import WithInstanceHostTable, {
     type IHostTableDataWithInstance,
-  } from '@components/cluster-common/big-data-host-table/es-host-table/index.vue';
-  import RenderHostTable, {
-    type IHostTableData,
-  } from '@components/cluster-common/big-data-host-table/RenderHostTable.vue';
-  import IpSelector from '@components/ip-selector/IpSelector.vue';
+  } from '@views/db-manage/common/big-data-host-table/es-host-table/index.vue';
+  import RenderHostTable from '@views/db-manage/common/big-data-host-table/RenderHostTable.vue';
 
   const route = useRoute();
   const router = useRouter();
@@ -386,8 +384,8 @@
       ip_source: 'resource_pool',
       disaster_tolerance_level: 'NONE', // 同 affinity
       nodes: {
-        master: [] as Array<IHostTableData>,
-        client: [] as Array<IHostTableData>,
+        master: [] as Array<HostDetails>,
+        client: [] as Array<HostDetails>,
         hot: [] as Array<IHostTableDataWithInstance>,
         cold: [] as Array<IHostTableDataWithInstance>,
       },
@@ -635,7 +633,7 @@
       }
       baseState.isSubmitting = true;
 
-      const mapIpField = (ipList: Array<IHostTableData>) =>
+      const mapIpField = (ipList: Array<HostDetails>) =>
         ipList.map((item) => ({
           bk_host_id: item.host_id,
           ip: item.ip,
diff --git a/dbm-ui/frontend/src/views/db-manage/elastic-search/common/expansion/Index.vue b/dbm-ui/frontend/src/views/db-manage/elastic-search/common/expansion/Index.vue
index b6cd2cb235..a4ed685331 100644
--- a/dbm-ui/frontend/src/views/db-manage/elastic-search/common/expansion/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/elastic-search/common/expansion/Index.vue
@@ -40,10 +40,10 @@
         <HostExpansion
           v-if="!isLoading"
           :key="nodeType"
-          v-model:expansionDisk="nodeInfoMap[nodeType].expansionDisk"
-          v-model:hostList="nodeInfoMap[nodeType].hostList"
-          v-model:resourceSpec="nodeInfoMap[nodeType].resourceSpec"
-          v-model:targetDisk="nodeInfoMap[nodeType].targetDisk"
+          v-model:expansion-disk="nodeInfoMap[nodeType].expansionDisk"
+          v-model:host-list="nodeInfoMap[nodeType].hostList"
+          v-model:resource-spec="nodeInfoMap[nodeType].resourceSpec"
+          v-model:target-disk="nodeInfoMap[nodeType].targetDisk"
           :cloud-info="{
             id: data.bk_cloud_id,
             name: data.bk_cloud_name,
@@ -76,8 +76,8 @@
 
   import HostExpansion, {
     type TExpansionNode,
-  } from '@components/cluster-common/es-host-expansion/Index.vue';
-  import NodeStatusList from '@components/cluster-common/host-expansion/NodeStatusList.vue';
+  } from '@views/db-manage/common/es-host-expansion/Index.vue';
+  import NodeStatusList from '@views/db-manage/common/host-expansion/NodeStatusList.vue';
 
   import { messageError } from '@utils';
 
@@ -202,7 +202,7 @@
       host_id: item.bk_host_id,
       meta: {
         bk_biz_id: item.bk_biz_id,
-        scope_id: item.bk_biz_id,
+        scope_id: `${item.bk_biz_id}`,
         scope_type: 'biz',
       },
     }));
@@ -211,7 +211,7 @@
     getHostDetails({
       host_list: hostIdList,
       scope_list: [{
-        scope_id: bizId,
+        scope_id: `${bizId}`,
         scope_type: 'biz',
       }],
     }).then((data) => {
diff --git a/dbm-ui/frontend/src/views/db-manage/elastic-search/common/replace/Index.vue b/dbm-ui/frontend/src/views/db-manage/elastic-search/common/replace/Index.vue
index 2ae6b79a0f..4cfe087358 100644
--- a/dbm-ui/frontend/src/views/db-manage/elastic-search/common/replace/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/elastic-search/common/replace/Index.vue
@@ -32,9 +32,9 @@
         </div>
         <HostReplace
           ref="hotRef"
-          v-model:hostList="nodeInfoMap.hot.hostList"
-          v-model:nodeList="nodeInfoMap.hot.nodeList"
-          v-model:resourceSpec="nodeInfoMap.hot.resourceSpec"
+          v-model:host-list="nodeInfoMap.hot.hostList"
+          v-model:node-list="nodeInfoMap.hot.nodeList"
+          v-model:resource-spec="nodeInfoMap.hot.resourceSpec"
           :cloud-info="{
             id: data.bk_cloud_id,
             name: data.bk_cloud_name,
@@ -52,9 +52,9 @@
         </div>
         <HostReplace
           ref="coldRef"
-          v-model:hostList="nodeInfoMap.cold.hostList"
-          v-model:nodeList="nodeInfoMap.cold.nodeList"
-          v-model:resourceSpec="nodeInfoMap.cold.resourceSpec"
+          v-model:host-list="nodeInfoMap.cold.hostList"
+          v-model:node-list="nodeInfoMap.cold.nodeList"
+          v-model:resource-spec="nodeInfoMap.cold.resourceSpec"
           :cloud-info="{
             id: data.bk_cloud_id,
             name: data.bk_cloud_name,
@@ -72,9 +72,9 @@
         </div>
         <HostReplace
           ref="clientRef"
-          v-model:hostList="nodeInfoMap.client.hostList"
-          v-model:nodeList="nodeInfoMap.client.nodeList"
-          v-model:resourceSpec="nodeInfoMap.client.resourceSpec"
+          v-model:host-list="nodeInfoMap.client.hostList"
+          v-model:node-list="nodeInfoMap.client.nodeList"
+          v-model:resource-spec="nodeInfoMap.client.resourceSpec"
           :cloud-info="{
             id: data.bk_cloud_id,
             name: data.bk_cloud_name,
@@ -90,9 +90,9 @@
         <div class="item-label">Master</div>
         <HostReplace
           ref="masterRef"
-          v-model:hostList="nodeInfoMap.master.hostList"
-          v-model:nodeList="nodeInfoMap.master.nodeList"
-          v-model:resourceSpec="nodeInfoMap.master.resourceSpec"
+          v-model:host-list="nodeInfoMap.master.hostList"
+          v-model:node-list="nodeInfoMap.master.nodeList"
+          v-model:resource-spec="nodeInfoMap.master.resourceSpec"
           :cloud-info="{
             id: data.bk_cloud_id,
             name: data.bk_cloud_name,
@@ -130,7 +130,7 @@
 
   import { ClusterTypes } from '@common/const';
 
-  import HostReplace, { type TReplaceNode } from '@components/cluster-common/es-host-replace/Index.vue';
+  import HostReplace, { type TReplaceNode } from '@views/db-manage/common/es-host-replace/Index.vue';
 
   import { messageError } from '@utils';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/elastic-search/common/shrink/Index.vue b/dbm-ui/frontend/src/views/db-manage/elastic-search/common/shrink/Index.vue
index fa7207fa81..10bbc862d0 100644
--- a/dbm-ui/frontend/src/views/db-manage/elastic-search/common/shrink/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/elastic-search/common/shrink/Index.vue
@@ -56,8 +56,8 @@
 
   import HostShrink, {
     type TShrinkNode,
-  } from '@components/cluster-common/host-shrink/Index.vue';
-  import NodeStatusList from '@components/cluster-common/host-shrink/NodeStatusList.vue';
+  } from '@views/db-manage/common/host-shrink/Index.vue';
+  import NodeStatusList from '@views/db-manage/common/host-shrink/NodeStatusList.vue';
 
   import { messageError } from '@utils';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/elastic-search/list/components/detail/Index.vue b/dbm-ui/frontend/src/views/db-manage/elastic-search/list/components/detail/Index.vue
index 0b99c2ecd0..e4ed6e56ce 100644
--- a/dbm-ui/frontend/src/views/db-manage/elastic-search/list/components/detail/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/elastic-search/list/components/detail/Index.vue
@@ -74,9 +74,9 @@
 
   import { ClusterTypes } from '@common/const';
 
-  import ClusterTopo from '@components/cluster-details/ClusterTopo.vue';
-  import ClusterEventChange from '@components/cluster-event-change/EventChange.vue';
-  import MonitorDashboard from '@components/cluster-monitor/MonitorDashboard.vue';
+  import ClusterTopo from '@views/db-manage/common/cluster-details/ClusterTopo.vue';
+  import ClusterEventChange from '@views/db-manage/common/cluster-event-change/EventChange.vue';
+  import MonitorDashboard from '@views/db-manage/common/cluster-monitor/MonitorDashboard.vue';
 
   import { checkDbConsole } from '@utils';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/elastic-search/list/components/detail/components/BaseInfo.vue b/dbm-ui/frontend/src/views/db-manage/elastic-search/list/components/detail/components/BaseInfo.vue
index 598b2af629..033f492002 100644
--- a/dbm-ui/frontend/src/views/db-manage/elastic-search/list/components/detail/components/BaseInfo.vue
+++ b/dbm-ui/frontend/src/views/db-manage/elastic-search/list/components/detail/components/BaseInfo.vue
@@ -19,7 +19,7 @@
 <script setup lang="ts">
   import { getEsDetail } from '@services/source/es';
 
-  import RenderBaseInfo from '@components/cluster-common/RenderBaseInfo.vue';
+  import RenderBaseInfo from '@views/db-manage/common/RenderBaseInfo.vue';
 
   interface Props {
     data: ServiceReturnType<typeof getEsDetail>;
diff --git a/dbm-ui/frontend/src/views/db-manage/elastic-search/list/components/detail/components/node-list/Index.vue b/dbm-ui/frontend/src/views/db-manage/elastic-search/list/components/detail/components/node-list/Index.vue
index 9b3949a44c..cae5fcbfb4 100644
--- a/dbm-ui/frontend/src/views/db-manage/elastic-search/list/components/detail/components/node-list/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/elastic-search/list/components/detail/components/node-list/Index.vue
@@ -190,10 +190,10 @@
 
   import { ClusterTypes } from '@common/const';
 
-  import OperationBtnStatusTips from '@components/cluster-common/OperationBtnStatusTips.vue';
-  import RenderClusterRole from '@components/cluster-common/RenderRole.vue';
   import RenderHostStatus from '@components/render-host-status/Index.vue';
 
+  import OperationBtnStatusTips from '@views/db-manage/common/OperationBtnStatusTips.vue';
+  import RenderClusterRole from '@views/db-manage/common/RenderRole.vue';
   import ClusterExpansion from '@views/db-manage/elastic-search/common/expansion/Index.vue';
   import ClusterReplace from '@views/db-manage/elastic-search/common/replace/Index.vue';
   import ClusterShrink from '@views/db-manage/elastic-search/common/shrink/Index.vue';
diff --git a/dbm-ui/frontend/src/views/db-manage/elastic-search/list/components/detail/components/node-list/components/InstanceDetail.vue b/dbm-ui/frontend/src/views/db-manage/elastic-search/list/components/detail/components/node-list/components/InstanceDetail.vue
index b7dfa04d38..5e7e0d473d 100644
--- a/dbm-ui/frontend/src/views/db-manage/elastic-search/list/components/detail/components/node-list/components/InstanceDetail.vue
+++ b/dbm-ui/frontend/src/views/db-manage/elastic-search/list/components/detail/components/node-list/components/InstanceDetail.vue
@@ -51,9 +51,9 @@
 
   import { useGlobalBizs } from '@stores';
 
-  import OperationBtnStatusTips from '@components/cluster-common/OperationBtnStatusTips.vue';
-  import RenderInstanceStatus from '@components/cluster-common/RenderInstanceStatus.vue';
-  import RenderOperationTag from '@components/cluster-common/RenderOperationTag.vue';
+  import OperationBtnStatusTips from '@views/db-manage/common/OperationBtnStatusTips.vue';
+  import RenderInstanceStatus from '@views/db-manage/common/RenderInstanceStatus.vue';
+  import RenderOperationTag from '@views/db-manage/common/RenderOperationTag.vue';
 
   import { useTimeoutPoll } from '@vueuse/core';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/elastic-search/list/components/list/Index.vue b/dbm-ui/frontend/src/views/db-manage/elastic-search/list/components/list/Index.vue
index c008ac0335..b4f468d2d5 100644
--- a/dbm-ui/frontend/src/views/db-manage/elastic-search/list/components/list/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/elastic-search/list/components/list/Index.vue
@@ -100,6 +100,7 @@
 </template>
 <script setup lang="tsx">
   import { InfoBox, Message } from 'bkui-vue';
+  import type { ISearchItem } from 'bkui-vue/lib/search-select/utils';
   import { useI18n } from 'vue-i18n';
   import {
     useRoute,
@@ -133,20 +134,20 @@
     UserPersonalSettings,
   } from '@common/const';
 
-  import ClusterCapacityUsageRate from '@components/cluster-capacity-usage-rate/Index.vue'
-  import OperationBtnStatusTips from '@components/cluster-common/OperationBtnStatusTips.vue';
-  import RenderNodeInstance from '@components/cluster-common/RenderNodeInstance.vue';
-  import RenderOperationTag from '@components/cluster-common/RenderOperationTag.vue';
-  import RenderPassword from '@components/cluster-common/RenderPassword.vue';
-  import RenderClusterStatus from '@components/cluster-common/RenderStatus.vue';
-  import EditEntryConfig from '@components/cluster-entry-config/Index.vue';
+  import RenderClusterStatus from '@components/cluster-status/Index.vue';
   import DbTable from '@components/db-table/index.vue';
-  import DropdownExportExcel from '@components/dropdown-export-excel/index.vue';
   import TextOverflowLayout from '@components/text-overflow-layout/Index.vue';
 
+  import ClusterCapacityUsageRate from '@views/db-manage/common/cluster-capacity-usage-rate/Index.vue'
+  import EditEntryConfig from '@views/db-manage/common/cluster-entry-config/Index.vue';
   import ClusterIpCopy from '@views/db-manage/common/cluster-ip-copy/Index.vue';
+  import DropdownExportExcel from '@views/db-manage/common/dropdown-export-excel/index.vue';
+  import OperationBtnStatusTips from '@views/db-manage/common/OperationBtnStatusTips.vue';
   import RenderCellCopy from '@views/db-manage/common/render-cell-copy/Index.vue';
   import RenderHeadCopy from '@views/db-manage/common/render-head-copy/Index.vue';
+  import RenderNodeInstance from '@views/db-manage/common/RenderNodeInstance.vue';
+  import RenderOperationTag from '@views/db-manage/common/RenderOperationTag.vue';
+  import RenderPassword from '@views/db-manage/common/RenderPassword.vue';
   import ClusterExpansion from '@views/db-manage/elastic-search/common/expansion/Index.vue';
   import ClusterShrink from '@views/db-manage/elastic-search/common/shrink/Index.vue';
 
@@ -156,11 +157,6 @@
     isRecentDays,
   } from '@utils';
 
-  import type {
-    SearchSelectData,
-    SearchSelectItem,
-  } from '@/types/bkui-vue';
-
   const clusterId = defineModel<number>('clusterId');
 
   const route = useRoute();
@@ -264,7 +260,7 @@
       multiple: true,
       children: searchAttrs.value.time_zone,
     },
-  ] as SearchSelectData);
+  ]);
 
   const dataSource = getEsList;
   const tableRef = ref<InstanceType<typeof DbTable>>();
@@ -798,7 +794,7 @@
     updateTableSettings,
   } = useTableSettings(UserPersonalSettings.ES_TABLE_SETTINGS, defaultSettings);
 
-  const getMenuList = async (item: SearchSelectItem | undefined, keyword: string) => {
+  const getMenuList = async (item: ISearchItem | undefined, keyword: string) => {
     if (item?.id !== 'creator' && keyword) {
       return getMenuListSearch(item, keyword, serachData.value, searchValue.value);
     }
diff --git a/dbm-ui/frontend/src/views/db-manage/hdfs/apply/Index.vue b/dbm-ui/frontend/src/views/db-manage/hdfs/apply/Index.vue
index d9ccc430eb..3da120f91e 100644
--- a/dbm-ui/frontend/src/views/db-manage/hdfs/apply/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/hdfs/apply/Index.vue
@@ -348,18 +348,18 @@
 
   import { OSTypes } from '@common/const';
 
-  // import AffinityItem from '@components/apply-items/AffinityItem.vue';
-  import BusinessItems from '@components/apply-items/BusinessItems.vue';
-  import CloudItem from '@components/apply-items/CloudItem.vue';
-  import ClusterAlias from '@components/apply-items/ClusterAlias.vue';
-  import ClusterName from '@components/apply-items/ClusterName.vue';
-  import DeployVersion from '@components/apply-items/DeployVersion.vue';
-  import RegionItem from '@components/apply-items/RegionItem.vue';
-  import SpecSelector from '@components/apply-items/SpecSelector.vue';
-  import HdfsHostTable, { type IHostTableData } from '@components/cluster-common/big-data-host-table/HdfsHostTable.vue';
-  import RenderHostTable from '@components/cluster-common/big-data-host-table/RenderHostTable.vue';
   import IpSelector from '@components/ip-selector/IpSelector.vue';
 
+  import BusinessItems from '@views/db-manage/common/apply-items/BusinessItems.vue';
+  import CloudItem from '@views/db-manage/common/apply-items/CloudItem.vue';
+  import ClusterAlias from '@views/db-manage/common/apply-items/ClusterAlias.vue';
+  import ClusterName from '@views/db-manage/common/apply-items/ClusterName.vue';
+  import DeployVersion from '@views/db-manage/common/apply-items/DeployVersion.vue';
+  import RegionItem from '@views/db-manage/common/apply-items/RegionItem.vue';
+  import SpecSelector from '@views/db-manage/common/apply-items/SpecSelector.vue';
+  import HdfsHostTable from '@views/db-manage/common/big-data-host-table/HdfsHostTable.vue';
+  import RenderHostTable from '@views/db-manage/common/big-data-host-table/RenderHostTable.vue';
+
   const route = useRoute();
   const router = useRouter();
   const { t } = useI18n();
@@ -377,9 +377,9 @@
       ip_source: 'resource_pool',
       disaster_tolerance_level: 'NONE', // 同 affinity
       nodes: {
-        namenode: [] as Array<IHostTableData>,
-        zookeeper: [] as Array<IHostTableData>,
-        datanode: [] as Array<IHostTableData>,
+        namenode: [] as Array<HostDetails>,
+        zookeeper: [] as Array<HostDetails>,
+        datanode: [] as Array<HostDetails>,
       },
       resource_spec: {
         zookeeper: {
@@ -416,7 +416,7 @@
   });
   const formData = reactive(genDefaultFormData());
 
-  const nodeAndZookerperMergeList = shallowRef<Array<IHostTableData>>([]);
+  const nodeAndZookerperMergeList = shallowRef<Array<HostDetails>>([]);
 
   // const isDefaultCity = computed(() => formData.details.city_code === 'default');
 
@@ -512,7 +512,7 @@
     nodeAndZookerperMergeList.value = data;
   };
 
-  const handleNameAndZookeeperChange = (nameNode: Array<IHostTableData>, zookeeper: Array<IHostTableData>) => {
+  const handleNameAndZookeeperChange = (nameNode: Array<HostDetails>, zookeeper: Array<HostDetails>) => {
     formData.details.nodes.namenode = nameNode;
     formData.details.nodes.zookeeper = zookeeper;
   };
@@ -545,7 +545,7 @@
   const handleSubmit = () => {
     formRef.value.validate().then(() => {
       baseState.isSubmitting = true;
-      const mapIpField = (ipList: Array<IHostTableData>) =>
+      const mapIpField = (ipList: Array<HostDetails>) =>
         ipList.map((item) => ({
           bk_host_id: item.host_id,
           ip: item.ip,
diff --git a/dbm-ui/frontend/src/views/db-manage/hdfs/common/expansion/Index.vue b/dbm-ui/frontend/src/views/db-manage/hdfs/common/expansion/Index.vue
index d35e4b685e..0f3b52ee84 100644
--- a/dbm-ui/frontend/src/views/db-manage/hdfs/common/expansion/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/hdfs/common/expansion/Index.vue
@@ -37,10 +37,10 @@
         <HostExpansion
           v-if="!isLoading"
           :key="nodeType"
-          v-model:expansionDisk="nodeInfoMap[nodeType].expansionDisk"
-          v-model:hostList="nodeInfoMap[nodeType].hostList"
-          v-model:resourceSpec="nodeInfoMap[nodeType].resourceSpec"
-          v-model:targetDisk="nodeInfoMap[nodeType].targetDisk"
+          v-model:expansion-disk="nodeInfoMap[nodeType].expansionDisk"
+          v-model:host-list="nodeInfoMap[nodeType].hostList"
+          v-model:resource-spec="nodeInfoMap[nodeType].resourceSpec"
+          v-model:target-disk="nodeInfoMap[nodeType].targetDisk"
           :cloud-info="{
             id: data.bk_cloud_id,
             name: data.bk_cloud_name,
@@ -71,8 +71,8 @@
 
   import HostExpansion, {
     type TExpansionNode,
-  } from '@components/cluster-common/host-expansion/Index.vue';
-  import NodeStatusList from '@components/cluster-common/host-expansion/NodeStatusList.vue';
+  } from '@views/db-manage/common/host-expansion/Index.vue';
+  import NodeStatusList from '@views/db-manage/common/host-expansion/NodeStatusList.vue';
 
   import { messageError } from '@utils';
 
@@ -140,7 +140,7 @@
       host_id: item.bk_host_id,
       meta: {
         bk_biz_id: item.bk_biz_id,
-        scope_id: item.bk_biz_id,
+        scope_id: `${item.bk_biz_id}`,
         scope_type: 'biz',
       },
     }));
@@ -149,7 +149,7 @@
     getHostDetails({
       host_list: hostIdList,
       scope_list: [{
-        scope_id: bizId,
+        scope_id: `${bizId}`,
         scope_type: 'biz',
       }],
     }).then((data) => {
diff --git a/dbm-ui/frontend/src/views/db-manage/hdfs/common/replace/Index.vue b/dbm-ui/frontend/src/views/db-manage/hdfs/common/replace/Index.vue
index 8ec13e1c69..d2189180e4 100644
--- a/dbm-ui/frontend/src/views/db-manage/hdfs/common/replace/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/hdfs/common/replace/Index.vue
@@ -30,9 +30,9 @@
         <div class="item-label">DataNode</div>
         <HostReplace
           ref="datanodeRef"
-          v-model:hostList="nodeInfoMap.datanode.hostList"
-          v-model:nodeList="nodeInfoMap.datanode.nodeList"
-          v-model:resourceSpec="nodeInfoMap.datanode.resourceSpec"
+          v-model:host-list="nodeInfoMap.datanode.hostList"
+          v-model:node-list="nodeInfoMap.datanode.nodeList"
+          v-model:resource-spec="nodeInfoMap.datanode.resourceSpec"
           :cloud-info="{
             id: data.bk_cloud_id,
             name: data.bk_cloud_name,
@@ -69,7 +69,7 @@
 
   import { ClusterTypes } from '@common/const';
 
-  import HostReplace, { type TReplaceNode } from '@components/cluster-common/host-replace/Index.vue';
+  import HostReplace, { type TReplaceNode } from '@views/db-manage/common/host-replace/Index.vue';
 
   import { messageError } from '@utils';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/hdfs/common/shrink/Index.vue b/dbm-ui/frontend/src/views/db-manage/hdfs/common/shrink/Index.vue
index 986272188c..75f6af3295 100644
--- a/dbm-ui/frontend/src/views/db-manage/hdfs/common/shrink/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/hdfs/common/shrink/Index.vue
@@ -53,8 +53,8 @@
 
   import HostShrink, {
     type TShrinkNode,
-  } from '@components/cluster-common/host-shrink/Index.vue';
-  import NodeStatusList from '@components/cluster-common/host-shrink/NodeStatusList.vue';
+  } from '@views/db-manage/common/host-shrink/Index.vue';
+  import NodeStatusList from '@views/db-manage/common/host-shrink/NodeStatusList.vue';
 
   import { messageError } from '@utils';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/hdfs/list/components/detail/Index.vue b/dbm-ui/frontend/src/views/db-manage/hdfs/list/components/detail/Index.vue
index fe36b97ccd..1dd3e1f391 100644
--- a/dbm-ui/frontend/src/views/db-manage/hdfs/list/components/detail/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/hdfs/list/components/detail/Index.vue
@@ -74,9 +74,9 @@
 
   import { ClusterTypes } from '@common/const';
 
-  import ClusterTopo from '@components/cluster-details/ClusterTopo.vue';
-  import ClusterEventChange from '@components/cluster-event-change/EventChange.vue';
-  import MonitorDashboard from '@components/cluster-monitor/MonitorDashboard.vue';
+  import ClusterTopo from '@views/db-manage/common/cluster-details/ClusterTopo.vue';
+  import ClusterEventChange from '@views/db-manage/common/cluster-event-change/EventChange.vue';
+  import MonitorDashboard from '@views/db-manage/common/cluster-monitor/MonitorDashboard.vue';
 
   import { checkDbConsole } from '@utils';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/hdfs/list/components/detail/components/BaseInfo.vue b/dbm-ui/frontend/src/views/db-manage/hdfs/list/components/detail/components/BaseInfo.vue
index 6cee55c157..8273780e00 100644
--- a/dbm-ui/frontend/src/views/db-manage/hdfs/list/components/detail/components/BaseInfo.vue
+++ b/dbm-ui/frontend/src/views/db-manage/hdfs/list/components/detail/components/BaseInfo.vue
@@ -19,7 +19,7 @@
 <script setup lang="ts">
   import { getHdfsDetail } from '@services/source/hdfs';
 
-  import RenderBaseInfo from '@components/cluster-common/RenderBaseInfo.vue';
+  import RenderBaseInfo from '@views/db-manage/common/RenderBaseInfo.vue';
 
   interface Props {
     data: ServiceReturnType<typeof getHdfsDetail>;
diff --git a/dbm-ui/frontend/src/views/db-manage/hdfs/list/components/detail/components/node-list/Index.vue b/dbm-ui/frontend/src/views/db-manage/hdfs/list/components/detail/components/node-list/Index.vue
index 74ae1286fd..4d2f54b7c4 100644
--- a/dbm-ui/frontend/src/views/db-manage/hdfs/list/components/detail/components/node-list/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/hdfs/list/components/detail/components/node-list/Index.vue
@@ -183,10 +183,10 @@
 
   import { ClusterTypes } from '@common/const';
 
-  import OperationBtnStatusTips from '@components/cluster-common/OperationBtnStatusTips.vue';
-  import RenderClusterRole from '@components/cluster-common/RenderRole.vue';
   import RenderHostStatus from '@components/render-host-status/Index.vue';
 
+  import OperationBtnStatusTips from '@views/db-manage/common/OperationBtnStatusTips.vue';
+  import RenderClusterRole from '@views/db-manage/common/RenderRole.vue';
   import ClusterExpansion from '@views/db-manage/hdfs/common/expansion/Index.vue';
   import ClusterReplace from '@views/db-manage/hdfs/common/replace/Index.vue';
   import ClusterShrink from '@views/db-manage/hdfs/common/shrink/Index.vue';
diff --git a/dbm-ui/frontend/src/views/db-manage/hdfs/list/components/detail/components/node-list/components/InstanceDetail.vue b/dbm-ui/frontend/src/views/db-manage/hdfs/list/components/detail/components/node-list/components/InstanceDetail.vue
index 717133a580..da26a6ae81 100644
--- a/dbm-ui/frontend/src/views/db-manage/hdfs/list/components/detail/components/node-list/components/InstanceDetail.vue
+++ b/dbm-ui/frontend/src/views/db-manage/hdfs/list/components/detail/components/node-list/components/InstanceDetail.vue
@@ -49,9 +49,9 @@
 
   import { useGlobalBizs } from '@stores';
 
-  import OperationBtnStatusTips from '@components/cluster-common/OperationBtnStatusTips.vue';
-  import RenderInstanceStatus from '@components/cluster-common/RenderInstanceStatus.vue';
-  import RenderOperationTag from '@components/cluster-common/RenderOperationTag.vue';
+  import OperationBtnStatusTips from '@views/db-manage/common/OperationBtnStatusTips.vue';
+  import RenderInstanceStatus from '@views/db-manage/common/RenderInstanceStatus.vue';
+  import RenderOperationTag from '@views/db-manage/common/RenderOperationTag.vue';
 
   import { useTimeoutPoll } from '@vueuse/core';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/hdfs/list/components/list/Index.vue b/dbm-ui/frontend/src/views/db-manage/hdfs/list/components/list/Index.vue
index 002c224de6..6c0fe75d84 100644
--- a/dbm-ui/frontend/src/views/db-manage/hdfs/list/components/list/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/hdfs/list/components/list/Index.vue
@@ -111,6 +111,7 @@
 </template>
 <script setup lang="tsx">
   import { InfoBox, Message } from 'bkui-vue';
+  import type { ISearchItem } from 'bkui-vue/lib/search-select/utils';
   import { useI18n } from 'vue-i18n';
   import {
     useRoute,
@@ -142,20 +143,20 @@
     UserPersonalSettings,
   } from '@common/const';
 
-  import ClusterCapacityUsageRate from '@components/cluster-capacity-usage-rate/Index.vue'
-  import OperationBtnStatusTips from '@components/cluster-common/OperationBtnStatusTips.vue';
-  import RenderNodeInstance from '@components/cluster-common/RenderNodeInstance.vue';
-  import RenderOperationTag from '@components/cluster-common/RenderOperationTag.vue';
-  import RenderPassword from '@components/cluster-common/RenderPassword.vue';
-  import RenderClusterStatus from '@components/cluster-common/RenderStatus.vue';
-  import EditEntryConfig from '@components/cluster-entry-config/Index.vue';
+  import RenderClusterStatus from '@components/cluster-status/Index.vue';
   import DbTable from '@components/db-table/index.vue';
-  import DropdownExportExcel from '@components/dropdown-export-excel/index.vue';
   import TextOverflowLayout from '@components/text-overflow-layout/Index.vue';
 
+  import ClusterCapacityUsageRate from '@views/db-manage/common/cluster-capacity-usage-rate/Index.vue'
+  import EditEntryConfig from '@views/db-manage/common/cluster-entry-config/Index.vue';
   import ClusterIpCopy from '@views/db-manage/common/cluster-ip-copy/Index.vue';
+  import DropdownExportExcel from '@views/db-manage/common/dropdown-export-excel/index.vue';
+  import OperationBtnStatusTips from '@views/db-manage/common/OperationBtnStatusTips.vue';
   import RenderCellCopy from '@views/db-manage/common/render-cell-copy/Index.vue';
   import RenderHeadCopy from '@views/db-manage/common/render-head-copy/Index.vue';
+  import RenderNodeInstance from '@views/db-manage/common/RenderNodeInstance.vue';
+  import RenderOperationTag from '@views/db-manage/common/RenderOperationTag.vue';
+  import RenderPassword from '@views/db-manage/common/RenderPassword.vue';
   import ClusterExpansion from '@views/db-manage/hdfs/common/expansion/Index.vue';
   import ClusterShrink from '@views/db-manage/hdfs/common/shrink/Index.vue';
 
@@ -167,11 +168,6 @@
 
   import ClusterSettings from './components/ClusterSettings.vue';
 
-  import type {
-    SearchSelectData,
-    SearchSelectItem,
-  } from '@/types/bkui-vue';
-
   const clusterId = defineModel<number>('clusterId');
 
   const route = useRoute();
@@ -303,7 +299,7 @@
       multiple: true,
       children: searchAttrs.value.time_zone,
     },
-  ] as SearchSelectData);
+  ]);
 
   const getRowClass = (data: HdfsModel) => {
     const classList = [data.isOnline ? '' : 'is-offline'];
@@ -822,7 +818,7 @@
     updateTableSettings,
   } = useTableSettings(UserPersonalSettings.HDFS_TABLE_SETTINGS, defaultSettings);
 
-  const getMenuList = async (item: SearchSelectItem | undefined, keyword: string) => {
+  const getMenuList = async (item: ISearchItem | undefined, keyword: string) => {
     if (item?.id !== 'creator' && keyword) {
       return getMenuListSearch(item, keyword, serachData.value, searchValue.value);
     }
diff --git a/dbm-ui/frontend/src/views/db-manage/influxdb/apply/index.vue b/dbm-ui/frontend/src/views/db-manage/influxdb/apply/index.vue
index 4de2add52b..35d7366f29 100644
--- a/dbm-ui/frontend/src/views/db-manage/influxdb/apply/index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/influxdb/apply/index.vue
@@ -180,14 +180,15 @@
 
   import { OSTypes } from '@common/const';
 
-  // import AffinityItem from '@components/apply-items/AffinityItem.vue';
-  import BusinessItems from '@components/apply-items/BusinessItems.vue';
-  import CloudItem from '@components/apply-items/CloudItem.vue';
-  import DeployVersion from '@components/apply-items/DeployVersion.vue';
-  import RegionItem from '@components/apply-items/RegionItem.vue';
-  import SpecSelector from '@components/apply-items/SpecSelector.vue';
   import IpSelector from '@components/ip-selector/IpSelector.vue';
 
+  // import AffinityItem from '@views/db-manage/common/apply-items/AffinityItem.vue';
+  import BusinessItems from '@views/db-manage/common/apply-items/BusinessItems.vue';
+  import CloudItem from '@views/db-manage/common/apply-items/CloudItem.vue';
+  import DeployVersion from '@views/db-manage/common/apply-items/DeployVersion.vue';
+  import RegionItem from '@views/db-manage/common/apply-items/RegionItem.vue';
+  import SpecSelector from '@views/db-manage/common/apply-items/SpecSelector.vue';
+
   import { getInitFormdata } from './common/base';
   import GroupItem from './components/GroupItem.vue';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/influxdb/details/Details.vue b/dbm-ui/frontend/src/views/db-manage/influxdb/details/Details.vue
index 7f0bea7173..99550de870 100644
--- a/dbm-ui/frontend/src/views/db-manage/influxdb/details/Details.vue
+++ b/dbm-ui/frontend/src/views/db-manage/influxdb/details/Details.vue
@@ -84,10 +84,11 @@
 
   import { ClusterTypes } from '@common/const';
 
-  import EventChange from '@components/cluster-event-change/EventChange.vue';
-  import MonitorDashboard from '@components/cluster-monitor/MonitorDashboard.vue';
   import EditInfo from '@components/editable-info/index.vue';
 
+  import EventChange from '@views/db-manage/common/cluster-event-change/EventChange.vue';
+  import MonitorDashboard from '@views/db-manage/common/cluster-monitor/MonitorDashboard.vue';
+
   import AsideList from './AsideList.vue';
 
   interface PanelItem {
diff --git a/dbm-ui/frontend/src/views/db-manage/influxdb/instance-list/components/render-list/Index.vue b/dbm-ui/frontend/src/views/db-manage/influxdb/instance-list/components/render-list/Index.vue
index b1ff8d5294..b4757dce9b 100644
--- a/dbm-ui/frontend/src/views/db-manage/influxdb/instance-list/components/render-list/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/influxdb/instance-list/components/render-list/Index.vue
@@ -165,12 +165,13 @@
 
   import { ClusterTypes, UserPersonalSettings } from '@common/const';
 
-  import OperationBtnStatusTips from '@components/cluster-common/OperationBtnStatusTips.vue';
-  import RenderInstanceStatus from '@components/cluster-common/RenderInstanceStatus.vue';
-  import RenderOperationTag from '@components/cluster-common/RenderOperationTag.vue';
-  import DropdownExportExcel from '@components/dropdown-export-excel/index.vue';
   import TextOverflowLayout from '@components/text-overflow-layout/Index.vue';
 
+  import DropdownExportExcel from '@views/db-manage/common/dropdown-export-excel/index.vue';
+  import OperationBtnStatusTips from '@views/db-manage/common/OperationBtnStatusTips.vue';
+  import RenderInstanceStatus from '@views/db-manage/common/RenderInstanceStatus.vue';
+  import RenderOperationTag from '@views/db-manage/common/RenderOperationTag.vue';
+
   import {
     getMenuListSearch,
     getSearchSelectorParams,
diff --git a/dbm-ui/frontend/src/views/db-manage/influxdb/instance-list/components/render-list/components/Replace.vue b/dbm-ui/frontend/src/views/db-manage/influxdb/instance-list/components/render-list/components/Replace.vue
index 675ec31119..85df8786ba 100644
--- a/dbm-ui/frontend/src/views/db-manage/influxdb/instance-list/components/render-list/components/Replace.vue
+++ b/dbm-ui/frontend/src/views/db-manage/influxdb/instance-list/components/render-list/components/Replace.vue
@@ -29,9 +29,9 @@
         class="item">
         <HostReplace
           ref="influxdbRef"
-          v-model:hostList="nodeInfoMap.influxdb.hostList"
-          v-model:nodeList="nodeInfoMap.influxdb.nodeList"
-          v-model:resourceSpec="nodeInfoMap.influxdb.resourceSpec"
+          v-model:host-list="nodeInfoMap.influxdb.hostList"
+          v-model:node-list="nodeInfoMap.influxdb.nodeList"
+          v-model:resource-spec="nodeInfoMap.influxdb.resourceSpec"
           :data="nodeInfoMap.influxdb"
           :ip-source="ipSource"
           @remove-node="handleRemoveNode" />
@@ -63,7 +63,7 @@
 
   import { ClusterTypes } from '@common/const';
 
-  import HostReplace, { type TReplaceNode } from '@components/cluster-common/host-replace/Index.vue';
+  import HostReplace, { type TReplaceNode } from '@views/db-manage/common/host-replace/Index.vue';
 
   import { messageError } from '@utils';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/kafka/apply/Index.vue b/dbm-ui/frontend/src/views/db-manage/kafka/apply/Index.vue
index 7f99f88c99..ba5c80d2b4 100644
--- a/dbm-ui/frontend/src/views/db-manage/kafka/apply/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/kafka/apply/Index.vue
@@ -333,21 +333,19 @@
 
   import { useApplyBase } from '@hooks';
 
-  // import AffinityItem from '@components/apply-items/AffinityItem.vue';
   import { OSTypes } from '@common/const';
 
-  import BusinessItems from '@components/apply-items/BusinessItems.vue';
-  import CloudItem from '@components/apply-items/CloudItem.vue';
-  import ClusterAlias from '@components/apply-items/ClusterAlias.vue';
-  import ClusterName from '@components/apply-items/ClusterName.vue';
-  import DeployVersion from '@components/apply-items/DeployVersion.vue';
-  import RegionItem from '@components/apply-items/RegionItem.vue';
-  import SpecSelector from '@components/apply-items/SpecSelector.vue';
-  import RenderHostTable, {
-    type IHostTableData,
-  } from '@components/cluster-common/big-data-host-table/RenderHostTable.vue';
   import IpSelector from '@components/ip-selector/IpSelector.vue';
 
+  import BusinessItems from '@views/db-manage/common/apply-items/BusinessItems.vue';
+  import CloudItem from '@views/db-manage/common/apply-items/CloudItem.vue';
+  import ClusterAlias from '@views/db-manage/common/apply-items/ClusterAlias.vue';
+  import ClusterName from '@views/db-manage/common/apply-items/ClusterName.vue';
+  import DeployVersion from '@views/db-manage/common/apply-items/DeployVersion.vue';
+  import RegionItem from '@views/db-manage/common/apply-items/RegionItem.vue';
+  import SpecSelector from '@views/db-manage/common/apply-items/SpecSelector.vue';
+  import RenderHostTable from '@views/db-manage/common/big-data-host-table/RenderHostTable.vue';
+
   const route = useRoute();
   const router = useRouter();
   const { t } = useI18n();
@@ -372,8 +370,8 @@
       ip_source: 'resource_pool',
       disaster_tolerance_level: 'NONE', // 同 affinity
       nodes: {
-        zookeeper: [] as Array<IHostTableData>,
-        broker: [] as Array<IHostTableData>,
+        zookeeper: [] as Array<HostDetails>,
+        broker: [] as Array<HostDetails>,
       },
       resource_spec: {
         zookeeper: {
@@ -521,7 +519,7 @@
   const handleSubmit = () => {
     formRef.value.validate().then(() => {
       baseState.isSubmitting = true;
-      const mapIpField = (ipList: Array<IHostTableData>) =>
+      const mapIpField = (ipList: Array<HostDetails>) =>
         ipList.map((item) => ({
           bk_host_id: item.host_id,
           ip: item.ip,
diff --git a/dbm-ui/frontend/src/views/db-manage/kafka/common/expansion/Index.vue b/dbm-ui/frontend/src/views/db-manage/kafka/common/expansion/Index.vue
index 13fbe3e440..1534cc09e0 100644
--- a/dbm-ui/frontend/src/views/db-manage/kafka/common/expansion/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/kafka/common/expansion/Index.vue
@@ -37,10 +37,10 @@
         <HostExpansion
           v-if="!isLoading"
           :key="nodeType"
-          v-model:expansionDisk="nodeInfoMap[nodeType].expansionDisk"
-          v-model:hostList="nodeInfoMap[nodeType].hostList"
-          v-model:resourceSpec="nodeInfoMap[nodeType].resourceSpec"
-          v-model:targetDisk="nodeInfoMap[nodeType].targetDisk"
+          v-model:expansion-disk="nodeInfoMap[nodeType].expansionDisk"
+          v-model:host-list="nodeInfoMap[nodeType].hostList"
+          v-model:resource-spec="nodeInfoMap[nodeType].resourceSpec"
+          v-model:target-disk="nodeInfoMap[nodeType].targetDisk"
           :cloud-info="{
             id: data.bk_cloud_id,
             name: data.bk_cloud_name,
@@ -71,8 +71,8 @@
 
   import HostExpansion, {
     type TExpansionNode,
-  } from '@components/cluster-common/host-expansion/Index.vue';
-  import NodeStatusList from '@components/cluster-common/host-expansion/NodeStatusList.vue';
+  } from '@views/db-manage/common/host-expansion/Index.vue';
+  import NodeStatusList from '@views/db-manage/common/host-expansion/NodeStatusList.vue';
 
   import { messageError } from '@utils';
 
@@ -142,7 +142,7 @@
       host_id: item.bk_host_id,
       meta: {
         bk_biz_id: item.bk_biz_id,
-        scope_id: item.bk_biz_id,
+        scope_id: `${item.bk_biz_id}`,
         scope_type: 'biz',
       },
     }));
@@ -151,7 +151,7 @@
     getHostDetails({
       host_list: hostIdList,
       scope_list: [{
-        scope_id: bizId,
+        scope_id: `${bizId}`,
         scope_type: 'biz',
       }],
     }).then((data) => {
diff --git a/dbm-ui/frontend/src/views/db-manage/kafka/common/replace/Index.vue b/dbm-ui/frontend/src/views/db-manage/kafka/common/replace/Index.vue
index 535d528d2b..a86d9dd16b 100644
--- a/dbm-ui/frontend/src/views/db-manage/kafka/common/replace/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/kafka/common/replace/Index.vue
@@ -30,9 +30,9 @@
         <div class="item-label">Broker</div>
         <HostReplace
           ref="brokerRef"
-          v-model:hostList="nodeInfoMap.broker.hostList"
-          v-model:nodeList="nodeInfoMap.broker.nodeList"
-          v-model:resourceSpec="nodeInfoMap.broker.resourceSpec"
+          v-model:host-list="nodeInfoMap.broker.hostList"
+          v-model:node-list="nodeInfoMap.broker.nodeList"
+          v-model:resource-spec="nodeInfoMap.broker.resourceSpec"
           :cloud-info="{
             id: data.bk_cloud_id,
             name: data.bk_cloud_name,
@@ -48,9 +48,9 @@
         <div class="item-label">Zookeeper</div>
         <HostReplace
           ref="zookeeperRef"
-          v-model:hostList="nodeInfoMap.zookeeper.hostList"
-          v-model:nodeList="nodeInfoMap.zookeeper.nodeList"
-          v-model:resourceSpec="nodeInfoMap.zookeeper.resourceSpec"
+          v-model:host-list="nodeInfoMap.zookeeper.hostList"
+          v-model:node-list="nodeInfoMap.zookeeper.nodeList"
+          v-model:resource-spec="nodeInfoMap.zookeeper.resourceSpec"
           :cloud-info="{
             id: data.bk_cloud_id,
             name: data.bk_cloud_name,
@@ -88,7 +88,7 @@
 
   import { ClusterTypes } from '@common/const';
 
-  import HostReplace, { type TReplaceNode } from '@components/cluster-common/host-replace/Index.vue';
+  import HostReplace, { type TReplaceNode } from '@views/db-manage/common/host-replace/Index.vue';
 
   import { messageError } from '@utils';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/kafka/common/shrink/Index.vue b/dbm-ui/frontend/src/views/db-manage/kafka/common/shrink/Index.vue
index 362cb72b8b..5a22a1913e 100644
--- a/dbm-ui/frontend/src/views/db-manage/kafka/common/shrink/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/kafka/common/shrink/Index.vue
@@ -53,8 +53,8 @@
 
   import HostShrink, {
     type TShrinkNode,
-  } from '@components/cluster-common/host-shrink/Index.vue';
-  import NodeStatusList from '@components/cluster-common/host-shrink/NodeStatusList.vue';
+  } from '@views/db-manage/common/host-shrink/Index.vue';
+  import NodeStatusList from '@views/db-manage/common/host-shrink/NodeStatusList.vue';
 
   import { messageError } from '@utils';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/kafka/list/components/detail/Index.vue b/dbm-ui/frontend/src/views/db-manage/kafka/list/components/detail/Index.vue
index 0d26ea55c3..b4bc5fe1bd 100644
--- a/dbm-ui/frontend/src/views/db-manage/kafka/list/components/detail/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/kafka/list/components/detail/Index.vue
@@ -74,9 +74,9 @@
 
   import { ClusterTypes } from '@common/const';
 
-  import ClusterTopo from '@components/cluster-details/ClusterTopo.vue';
-  import ClusterEventChange from '@components/cluster-event-change/EventChange.vue';
-  import MonitorDashboard from '@components/cluster-monitor/MonitorDashboard.vue';
+  import ClusterTopo from '@views/db-manage/common/cluster-details/ClusterTopo.vue';
+  import ClusterEventChange from '@views/db-manage/common/cluster-event-change/EventChange.vue';
+  import MonitorDashboard from '@views/db-manage/common/cluster-monitor/MonitorDashboard.vue';
 
   import { checkDbConsole } from '@utils';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/kafka/list/components/detail/components/BaseInfo.vue b/dbm-ui/frontend/src/views/db-manage/kafka/list/components/detail/components/BaseInfo.vue
index b1899c6988..bfca0237a3 100644
--- a/dbm-ui/frontend/src/views/db-manage/kafka/list/components/detail/components/BaseInfo.vue
+++ b/dbm-ui/frontend/src/views/db-manage/kafka/list/components/detail/components/BaseInfo.vue
@@ -19,7 +19,7 @@
 <script setup lang="ts">
   import { getKafkaDetail } from '@services/source/kafka';
 
-  import RenderBaseInfo from '@components/cluster-common/RenderBaseInfo.vue';
+  import RenderBaseInfo from '@views/db-manage/common/RenderBaseInfo.vue';
 
   interface Props {
     data: ServiceReturnType<typeof getKafkaDetail>;
diff --git a/dbm-ui/frontend/src/views/db-manage/kafka/list/components/detail/components/node-list/Index.vue b/dbm-ui/frontend/src/views/db-manage/kafka/list/components/detail/components/node-list/Index.vue
index a67d761c87..8302d05ada 100644
--- a/dbm-ui/frontend/src/views/db-manage/kafka/list/components/detail/components/node-list/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/kafka/list/components/detail/components/node-list/Index.vue
@@ -191,10 +191,10 @@
 
   import { ClusterTypes } from '@common/const';
 
-  import OperationBtnStatusTips from '@components/cluster-common/OperationBtnStatusTips.vue';
-  import RenderClusterRole from '@components/cluster-common/RenderRole.vue';
   import RenderHostStatus from '@components/render-host-status/Index.vue';
 
+  import OperationBtnStatusTips from '@views/db-manage/common/OperationBtnStatusTips.vue';
+  import RenderClusterRole from '@views/db-manage/common/RenderRole.vue';
   import ClusterExpansion from '@views/db-manage/kafka/common/expansion/Index.vue';
   import ClusterReplace from '@views/db-manage/kafka/common/replace/Index.vue';
   import ClusterShrink from '@views/db-manage/kafka/common/shrink/Index.vue';
diff --git a/dbm-ui/frontend/src/views/db-manage/kafka/list/components/detail/components/node-list/components/InstanceDetail.vue b/dbm-ui/frontend/src/views/db-manage/kafka/list/components/detail/components/node-list/components/InstanceDetail.vue
index 0be05703fe..863ba54ca7 100644
--- a/dbm-ui/frontend/src/views/db-manage/kafka/list/components/detail/components/node-list/components/InstanceDetail.vue
+++ b/dbm-ui/frontend/src/views/db-manage/kafka/list/components/detail/components/node-list/components/InstanceDetail.vue
@@ -51,9 +51,9 @@
 
   import { useGlobalBizs } from '@stores';
 
-  import OperationBtnStatusTips from '@components/cluster-common/OperationBtnStatusTips.vue';
-  import RenderInstanceStatus from '@components/cluster-common/RenderInstanceStatus.vue';
-  import RenderOperationTag from '@components/cluster-common/RenderOperationTag.vue';
+  import OperationBtnStatusTips from '@views/db-manage/common/OperationBtnStatusTips.vue';
+  import RenderInstanceStatus from '@views/db-manage/common/RenderInstanceStatus.vue';
+  import RenderOperationTag from '@views/db-manage/common/RenderOperationTag.vue';
 
   import { useTimeoutPoll } from '@vueuse/core';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/kafka/list/components/list/Index.vue b/dbm-ui/frontend/src/views/db-manage/kafka/list/components/list/Index.vue
index db24730bc5..0d507e4185 100644
--- a/dbm-ui/frontend/src/views/db-manage/kafka/list/components/list/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/kafka/list/components/list/Index.vue
@@ -99,6 +99,7 @@
 </template>
 <script setup lang="tsx">
   import { InfoBox, Message } from 'bkui-vue';
+  import type { ISearchItem } from 'bkui-vue/lib/search-select/utils';
   import {
     onMounted,
     ref,
@@ -131,20 +132,20 @@
 
   import { ClusterTypes, DBTypes, UserPersonalSettings } from '@common/const';
 
-  import ClusterCapacityUsageRate from '@components/cluster-capacity-usage-rate/Index.vue'
-  import OperationBtnStatusTips from '@components/cluster-common/OperationBtnStatusTips.vue';
-  import RenderNodeInstance from '@components/cluster-common/RenderNodeInstance.vue';
-  import RenderOperationTag from '@components/cluster-common/RenderOperationTag.vue';
-  import RenderPassword from '@components/cluster-common/RenderPassword.vue';
-  import RenderClusterStatus from '@components/cluster-common/RenderStatus.vue';
-  import EditEntryConfig from '@components/cluster-entry-config/Index.vue';
+  import RenderClusterStatus from '@components/cluster-status/Index.vue';
   import DbTable from '@components/db-table/index.vue';
-  import DropdownExportExcel from '@components/dropdown-export-excel/index.vue';
   import TextOverflowLayout from '@components/text-overflow-layout/Index.vue';
 
+  import ClusterCapacityUsageRate from '@views/db-manage/common/cluster-capacity-usage-rate/Index.vue'
+  import EditEntryConfig from '@views/db-manage/common/cluster-entry-config/Index.vue';
   import ClusterIpCopy from '@views/db-manage/common/cluster-ip-copy/Index.vue';
+  import DropdownExportExcel from '@views/db-manage/common/dropdown-export-excel/index.vue';
+  import OperationBtnStatusTips from '@views/db-manage/common/OperationBtnStatusTips.vue';
   import RenderCellCopy from '@views/db-manage/common/render-cell-copy/Index.vue';
   import RenderHeadCopy from '@views/db-manage/common/render-head-copy/Index.vue';
+  import RenderNodeInstance from '@views/db-manage/common/RenderNodeInstance.vue';
+  import RenderOperationTag from '@views/db-manage/common/RenderOperationTag.vue';
+  import RenderPassword from '@views/db-manage/common/RenderPassword.vue';
   import ClusterExpansion from '@views/db-manage/kafka/common/expansion/Index.vue';
   import ClusterShrink from '@views/db-manage/kafka/common/shrink/Index.vue';
 
@@ -154,11 +155,6 @@
     isRecentDays,
   } from '@utils';
 
-  import type {
-    SearchSelectData,
-    SearchSelectItem,
-  } from '@/types/bkui-vue';
-
   const clusterId = defineModel<number>('clusterId');
 
   const route = useRoute();
@@ -298,7 +294,7 @@
       multiple: true,
       children: searchAttrs.value.time_zone,
     },
-  ] as SearchSelectData);
+  ]);
 
   const tableOperationWidth = computed(() => {
     if (!isStretchLayoutOpen.value) {
@@ -734,7 +730,7 @@
     updateTableSettings,
   } = useTableSettings(UserPersonalSettings.KAFKA_TABLE_SETTINGS, defaultSettings);
 
-  const getMenuList = async (item: SearchSelectItem | undefined, keyword: string) => {
+  const getMenuList = async (item: ISearchItem | undefined, keyword: string) => {
     if (item?.id !== 'creator' && keyword) {
       return getMenuListSearch(item, keyword, serachData.value, searchValue.value);
     }
diff --git a/dbm-ui/frontend/src/views/db-manage/mongodb/db-structure/pages/page1/components/RenderTargetSpec.vue b/dbm-ui/frontend/src/views/db-manage/mongodb/db-structure/pages/page1/components/RenderTargetSpec.vue
index 2afa9297e9..a494dff857 100644
--- a/dbm-ui/frontend/src/views/db-manage/mongodb/db-structure/pages/page1/components/RenderTargetSpec.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mongodb/db-structure/pages/page1/components/RenderTargetSpec.vue
@@ -36,7 +36,7 @@
 
   import { ClusterTypes } from '@common/const';
 
-  import RenderTargetSpec from '@components/apply-items/SpecSelector.vue';
+  import RenderTargetSpec from '@views/db-manage/common/apply-items/SpecSelector.vue';
 
   interface Props {
     data: MongoDBModel;
diff --git a/dbm-ui/frontend/src/views/db-manage/mongodb/mongodb-instance/list/index.vue b/dbm-ui/frontend/src/views/db-manage/mongodb/mongodb-instance/list/index.vue
index f8d1be8b24..22cb10e252 100644
--- a/dbm-ui/frontend/src/views/db-manage/mongodb/mongodb-instance/list/index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mongodb/mongodb-instance/list/index.vue
@@ -82,9 +82,10 @@
     UserPersonalSettings,
   } from '@common/const';
 
-  import OperationBtnStatusTips from '@components/cluster-common/OperationBtnStatusTips.vue';
   import DbStatus from '@components/db-status/index.vue';
-  import DropdownExportExcel from '@components/dropdown-export-excel/index.vue';
+
+  import DropdownExportExcel from '@views/db-manage/common/dropdown-export-excel/index.vue';
+  import OperationBtnStatusTips from '@views/db-manage/common/OperationBtnStatusTips.vue';
 
   import { getSearchSelectorParams } from '@utils';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/mongodb/permission/Index.vue b/dbm-ui/frontend/src/views/db-manage/mongodb/permission/Index.vue
index 2bafbf5f3b..7acb359ef5 100644
--- a/dbm-ui/frontend/src/views/db-manage/mongodb/permission/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mongodb/permission/Index.vue
@@ -68,10 +68,11 @@
     ClusterTypes,
   } from '@common/const';
 
-  import ClusterAuthorize from '@components/cluster-authorize/ClusterAuthorize.vue';
   import DbTable from '@components/db-table/index.vue';
   import TextOverflowLayout from '@components/text-overflow-layout/Index.vue';
 
+  import ClusterAuthorize from '@views/db-manage/common/cluster-authorize/ClusterAuthorize.vue';
+
   import { getSearchSelectorParams } from '@utils';
 
   import { dbOperations } from './common/consts';
diff --git a/dbm-ui/frontend/src/views/db-manage/mongodb/replica-set-apply/Index.vue b/dbm-ui/frontend/src/views/db-manage/mongodb/replica-set-apply/Index.vue
index 41b5f129eb..3df157fa71 100644
--- a/dbm-ui/frontend/src/views/db-manage/mongodb/replica-set-apply/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mongodb/replica-set-apply/Index.vue
@@ -211,13 +211,14 @@
 
   import { ClusterTypes, DBTypes, MachineTypes, TicketTypes } from '@common/const';
 
-  import AffinityItem from '@components/apply-items/AffinityItem.vue';
-  import BusinessItems from '@components/apply-items/BusinessItems.vue';
-  import CloudItem from '@components/apply-items/CloudItem.vue';
-  import RegionItem from '@components/apply-items/RegionItem.vue';
-  import SpecSelector from '@components/apply-items/SpecSelector.vue';
   import DbForm from '@components/db-form/index.vue';
 
+  import AffinityItem from '@views/db-manage/common/apply-items/AffinityItem.vue';
+  import BusinessItems from '@views/db-manage/common/apply-items/BusinessItems.vue';
+  import CloudItem from '@views/db-manage/common/apply-items/CloudItem.vue';
+  import RegionItem from '@views/db-manage/common/apply-items/RegionItem.vue';
+  import SpecSelector from '@views/db-manage/common/apply-items/SpecSelector.vue';
+
   import DomainTable from './components/DomainTable.vue';
 
   const initData = () => ({
diff --git a/dbm-ui/frontend/src/views/db-manage/mongodb/replica-set-list/components/detail/Index.vue b/dbm-ui/frontend/src/views/db-manage/mongodb/replica-set-list/components/detail/Index.vue
index 76e0393239..deb8ead8f3 100644
--- a/dbm-ui/frontend/src/views/db-manage/mongodb/replica-set-list/components/detail/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mongodb/replica-set-list/components/detail/Index.vue
@@ -105,10 +105,11 @@
 
   import { ClusterTypes, DBTypes } from '@common/const';
 
-  import RenderClusterStatus from '@components/cluster-common/RenderStatus.vue';
-  import ClusterTopo from '@components/cluster-details/ClusterTopo.vue';
-  import ClusterEventChange from '@components/cluster-event-change/EventChange.vue';
-  import MonitorDashboard from '@components/cluster-monitor/MonitorDashboard.vue';
+  import RenderClusterStatus from '@components/cluster-status/Index.vue';
+
+  import ClusterTopo from '@views/db-manage/common/cluster-details/ClusterTopo.vue';
+  import ClusterEventChange from '@views/db-manage/common/cluster-event-change/EventChange.vue';
+  import MonitorDashboard from '@views/db-manage/common/cluster-monitor/MonitorDashboard.vue';
 
   import { useDisableCluster } from '../../hooks/useDisableCluster';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/mongodb/replica-set-list/components/list/Index.vue b/dbm-ui/frontend/src/views/db-manage/mongodb/replica-set-list/components/list/Index.vue
index 93e9421a20..b0e38b08be 100644
--- a/dbm-ui/frontend/src/views/db-manage/mongodb/replica-set-list/components/list/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mongodb/replica-set-list/components/list/Index.vue
@@ -85,6 +85,7 @@
 
 <script setup lang="tsx">
   import { InfoBox, Message } from 'bkui-vue';
+  import type { ISearchItem } from 'bkui-vue/lib/search-select/utils';
   import { useI18n } from 'vue-i18n';
 
   import MongodbModel from '@services/model/mongodb/mongodb';
@@ -112,22 +113,22 @@
     UserPersonalSettings,
   } from '@common/const';
 
-  import ClusterAuthorize from '@components/cluster-authorize/ClusterAuthorize.vue';
-  import ClusterCapacityUsageRate from '@components/cluster-capacity-usage-rate/Index.vue'
-  import ExcelAuthorize from '@components/cluster-common/ExcelAuthorize.vue';
-  import OperationBtnStatusTips from '@components/cluster-common/OperationBtnStatusTips.vue';
-  import RenderOperationTag from '@components/cluster-common/RenderOperationTag.vue';
-  import RenderClusterStatus from '@components/cluster-common/RenderStatus.vue';
+  import RenderClusterStatus from '@components/cluster-status/Index.vue';
   import DbTable from '@components/db-table/index.vue';
-  import DropdownExportExcel from '@components/dropdown-export-excel/index.vue';
   import MiniTag from '@components/mini-tag/index.vue';
-  import RenderInstances from '@components/render-instances/RenderInstances.vue';
   import RenderTextEllipsisOneLine from '@components/text-ellipsis-one-line/index.vue';
   import TextOverflowLayout from '@components/text-overflow-layout/Index.vue';
 
+  import ClusterAuthorize from '@views/db-manage/common/cluster-authorize/ClusterAuthorize.vue';
+  import ClusterCapacityUsageRate from '@views/db-manage/common/cluster-capacity-usage-rate/Index.vue'
   import ClusterIpCopy from '@views/db-manage/common/cluster-ip-copy/Index.vue';
+  import DropdownExportExcel from '@views/db-manage/common/dropdown-export-excel/index.vue';
+  import ExcelAuthorize from '@views/db-manage/common/ExcelAuthorize.vue';
+  import OperationBtnStatusTips from '@views/db-manage/common/OperationBtnStatusTips.vue';
   import RenderCellCopy from '@views/db-manage/common/render-cell-copy/Index.vue';
   import RenderHeadCopy from '@views/db-manage/common/render-head-copy/Index.vue';
+  import RenderInstances from '@views/db-manage/common/render-instances/RenderInstances.vue';
+  import RenderOperationTag from '@views/db-manage/common/RenderOperationTag.vue';
 
   import {
     getMenuListSearch,
@@ -136,11 +137,6 @@
 
   import { useDisableCluster } from '../../hooks/useDisableCluster';
 
-  import type {
-    SearchSelectData,
-    SearchSelectItem,
-  } from '@/types/bkui-vue';
-
   const clusterId = defineModel<number>('clusterId');
 
   const { t } = useI18n();
@@ -244,7 +240,7 @@
       multiple: true,
       children: searchAttrs.value.time_zone,
     },
-  ] as SearchSelectData);
+  ]);
 
   const tableRef = ref<InstanceType<typeof DbTable>>();
   const clusterAuthorizeShow = ref(false);
@@ -614,7 +610,7 @@
     updateTableSettings,
   } = useTableSettings(UserPersonalSettings.MONGODB_REPLICA_SET_SETTINGS, defaultSettings);
 
-  const getMenuList = async (item: SearchSelectItem | undefined, keyword: string) => {
+  const getMenuList = async (item: ISearchItem | undefined, keyword: string) => {
     if (item?.id !== 'creator' && keyword) {
       return getMenuListSearch(item, keyword, searchSelectData.value, searchValue.value);
     }
diff --git a/dbm-ui/frontend/src/views/db-manage/mongodb/script-execute/steps/step1/components/TargetCluster.vue b/dbm-ui/frontend/src/views/db-manage/mongodb/script-execute/steps/step1/components/TargetCluster.vue
index 98e342bf0d..ad4cb5c5b4 100644
--- a/dbm-ui/frontend/src/views/db-manage/mongodb/script-execute/steps/step1/components/TargetCluster.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mongodb/script-execute/steps/step1/components/TargetCluster.vue
@@ -51,10 +51,10 @@
 
   import { ClusterTypes } from '@common/const';
 
-  import RenderClusterStatus from '@components/cluster-common/RenderStatus.vue';
   import ClusterSelector, {
     type TabItem,
   } from '@components/cluster-selector/Index.vue';
+  import RenderClusterStatus from '@components/cluster-status/Index.vue';
 
   const modelValue = defineModel<number[]>();
 
diff --git a/dbm-ui/frontend/src/views/db-manage/mongodb/shared-cluster-apply/Index.vue b/dbm-ui/frontend/src/views/db-manage/mongodb/shared-cluster-apply/Index.vue
index 5de9cf22da..a11e1858bf 100644
--- a/dbm-ui/frontend/src/views/db-manage/mongodb/shared-cluster-apply/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mongodb/shared-cluster-apply/Index.vue
@@ -211,15 +211,15 @@
   import { ClusterTypes, DBTypes, MachineTypes, TicketTypes } from '@common/const';
   import { nameRegx } from '@common/regex';
 
-  import AffinityItem from '@components/apply-items/AffinityItem.vue';
-  import BusinessItems from '@components/apply-items/BusinessItems.vue';
-  import CloudItem from '@components/apply-items/CloudItem.vue';
-  import ClusterAlias from '@components/apply-items/ClusterAlias.vue';
-  import ClusterName from '@components/apply-items/ClusterName.vue';
-  import RegionItem from '@components/apply-items/RegionItem.vue';
-  import SpecSelector from '@components/apply-items/SpecSelector.vue';
   import DbForm from '@components/db-form/index.vue';
 
+  import AffinityItem from '@views/db-manage/common/apply-items/AffinityItem.vue';
+  import BusinessItems from '@views/db-manage/common/apply-items/BusinessItems.vue';
+  import CloudItem from '@views/db-manage/common/apply-items/CloudItem.vue';
+  import ClusterAlias from '@views/db-manage/common/apply-items/ClusterAlias.vue';
+  import ClusterName from '@views/db-manage/common/apply-items/ClusterName.vue';
+  import RegionItem from '@views/db-manage/common/apply-items/RegionItem.vue';
+  import SpecSelector from '@views/db-manage/common/apply-items/SpecSelector.vue';
   import MongoConfigSpec from '@views/db-manage/mongodb/components/MongoConfigSpec.vue';
 
   const initData = () => ({
diff --git a/dbm-ui/frontend/src/views/db-manage/mongodb/shared-cluster-list/components/detail/Index.vue b/dbm-ui/frontend/src/views/db-manage/mongodb/shared-cluster-list/components/detail/Index.vue
index 612a92cd7f..b32144ebd4 100644
--- a/dbm-ui/frontend/src/views/db-manage/mongodb/shared-cluster-list/components/detail/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mongodb/shared-cluster-list/components/detail/Index.vue
@@ -128,10 +128,11 @@
 
   import { ClusterTypes, DBTypes } from '@common/const';
 
-  import RenderClusterStatus from '@components/cluster-common/RenderStatus.vue';
-  import ClusterTopo from '@components/cluster-details/ClusterTopo.vue';
-  import ClusterEventChange from '@components/cluster-event-change/EventChange.vue';
-  import MonitorDashboard from '@components/cluster-monitor/MonitorDashboard.vue';
+  import RenderClusterStatus from '@components/cluster-status/Index.vue';
+
+  import ClusterTopo from '@views/db-manage/common/cluster-details/ClusterTopo.vue';
+  import ClusterEventChange from '@views/db-manage/common/cluster-event-change/EventChange.vue';
+  import MonitorDashboard from '@views/db-manage/common/cluster-monitor/MonitorDashboard.vue';
 
   import { useDisableCluster } from '../../hooks/useDisableCluster';
   import CapacityChange from '../components/CapacityChange.vue';
diff --git a/dbm-ui/frontend/src/views/db-manage/mongodb/shared-cluster-list/components/list/Index.vue b/dbm-ui/frontend/src/views/db-manage/mongodb/shared-cluster-list/components/list/Index.vue
index 309ed8cf51..3ba7e6e37e 100644
--- a/dbm-ui/frontend/src/views/db-manage/mongodb/shared-cluster-list/components/list/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mongodb/shared-cluster-list/components/list/Index.vue
@@ -102,6 +102,7 @@
 
 <script setup lang="tsx">
   import { InfoBox, Message } from 'bkui-vue';
+  import type { ISearchItem } from 'bkui-vue/lib/search-select/utils';
   import { useI18n } from 'vue-i18n';
 
   import MongodbModel from '@services/model/mongodb/mongodb';
@@ -129,22 +130,22 @@
     UserPersonalSettings,
   } from '@common/const';
 
-  import ClusterAuthorize from '@components/cluster-authorize/ClusterAuthorize.vue';
-  import ClusterCapacityUsageRate from '@components/cluster-capacity-usage-rate/Index.vue'
-  import ExcelAuthorize from '@components/cluster-common/ExcelAuthorize.vue';
-  import OperationBtnStatusTips from '@components/cluster-common/OperationBtnStatusTips.vue';
-  import RenderOperationTag from '@components/cluster-common/RenderOperationTag.vue';
-  import RenderClusterStatus from '@components/cluster-common/RenderStatus.vue';
+  import RenderClusterStatus from '@components/cluster-status/Index.vue';
   import DbTable from '@components/db-table/index.vue';
-  import DropdownExportExcel from '@components/dropdown-export-excel/index.vue';
   import MiniTag from '@components/mini-tag/index.vue';
-  import RenderInstances from '@components/render-instances/RenderInstances.vue';
   import RenderTextEllipsisOneLine from '@components/text-ellipsis-one-line/index.vue';
   import TextOverflowLayout from '@components/text-overflow-layout/Index.vue';
 
+  import ClusterAuthorize from '@views/db-manage/common/cluster-authorize/ClusterAuthorize.vue';
+  import ClusterCapacityUsageRate from '@views/db-manage/common/cluster-capacity-usage-rate/Index.vue'
   import ClusterIpCopy from '@views/db-manage/common/cluster-ip-copy/Index.vue';
+  import DropdownExportExcel from '@views/db-manage/common/dropdown-export-excel/index.vue';
+  import ExcelAuthorize from '@views/db-manage/common/ExcelAuthorize.vue';
+  import OperationBtnStatusTips from '@views/db-manage/common/OperationBtnStatusTips.vue';
   import RenderCellCopy from '@views/db-manage/common/render-cell-copy/Index.vue';
   import RenderHeadCopy from '@views/db-manage/common/render-head-copy/Index.vue';
+  import RenderInstances from '@views/db-manage/common/render-instances/RenderInstances.vue';
+  import RenderOperationTag from '@views/db-manage/common/RenderOperationTag.vue';
 
   import {
     getMenuListSearch,
@@ -154,11 +155,6 @@
   import { useDisableCluster } from '../../hooks/useDisableCluster';
   import CapacityChange from '../components/CapacityChange.vue';
 
-  import type {
-    SearchSelectData,
-    SearchSelectItem,
-  } from '@/types/bkui-vue';
-
   const clusterId = defineModel<number>('clusterId');
 
   const { t } = useI18n();
@@ -262,7 +258,7 @@
       multiple: true,
       children: searchAttrs.value.time_zone,
     },
-  ] as SearchSelectData);
+  ]);
 
   const tableRef = ref<InstanceType<typeof DbTable>>();
   const capacityChangeShow = ref(false);
@@ -680,7 +676,7 @@
     updateTableSettings,
   } = useTableSettings(UserPersonalSettings.MONGODB_SHARED_CLUSTER_SETTINGS, defaultSettings);
 
-  const getMenuList = async (item: SearchSelectItem | undefined, keyword: string) => {
+  const getMenuList = async (item: ISearchItem | undefined, keyword: string) => {
     if (item?.id !== 'creator' && keyword) {
       return getMenuListSearch(item, keyword, searchSelectData.value, searchValue.value);
     }
diff --git a/dbm-ui/frontend/src/views/db-manage/mongodb/structure-instance/Index.vue b/dbm-ui/frontend/src/views/db-manage/mongodb/structure-instance/Index.vue
index de7610e817..0fda7a8502 100644
--- a/dbm-ui/frontend/src/views/db-manage/mongodb/structure-instance/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mongodb/structure-instance/Index.vue
@@ -68,11 +68,12 @@
 
   import { TicketTypes } from '@common/const';
 
-  import OperationBtnStatusTips from '@components/cluster-common/OperationBtnStatusTips.vue';
-  import RenderOperationTag from '@components/cluster-common/RenderOperationTagNew.vue';
   import RenderRow from '@components/render-row/index.vue';
   import TextOverflowLayout from '@components/text-overflow-layout/Index.vue';
 
+  import OperationBtnStatusTips from '@views/db-manage/common/OperationBtnStatusTips.vue';
+  import RenderOperationTag from '@views/db-manage/common/RenderOperationTagNew.vue';
+
   import { getSearchSelectorParams } from '@utils';
 
   interface SearchSelectItem {
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/apply/ApplyMySQL.vue b/dbm-ui/frontend/src/views/db-manage/mysql/apply/ApplyMySQL.vue
index 3e5dafea4a..f613adc226 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/apply/ApplyMySQL.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/apply/ApplyMySQL.vue
@@ -394,13 +394,14 @@
   import { OSTypes } from '@common/const';
   import { nameRegx } from '@common/regex';
 
-  import AffinityItem from '@components/apply-items/AffinityItem.vue';
-  import BusinessItems from '@components/apply-items/BusinessItems.vue';
-  import CloudItem from '@components/apply-items/CloudItem.vue';
-  import RegionItem from '@components/apply-items/RegionItem.vue';
-  import SpecSelector from '@components/apply-items/SpecSelector.vue';
   import IpSelector from '@components/ip-selector/IpSelector.vue';
 
+  import AffinityItem from '@views/db-manage/common/apply-items/AffinityItem.vue';
+  import BusinessItems from '@views/db-manage/common/apply-items/BusinessItems.vue';
+  import CloudItem from '@views/db-manage/common/apply-items/CloudItem.vue';
+  import RegionItem from '@views/db-manage/common/apply-items/RegionItem.vue';
+  import SpecSelector from '@views/db-manage/common/apply-items/SpecSelector.vue';
+
   import DomainTable from './components/MySQLDomainTable.vue';
   import PreviewTable from './components/PreviewTable.vue';
   import { useMysqlData } from './hooks/useMysqlData';
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/apply/components/PreviewTable.vue b/dbm-ui/frontend/src/views/db-manage/mysql/apply/components/PreviewTable.vue
index 5a2af05e4a..2adc012540 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/apply/components/PreviewTable.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/apply/components/PreviewTable.vue
@@ -22,9 +22,10 @@
 </template>
 
 <script setup lang="tsx">
+  import type { Table } from 'bkui-vue';
   import { useI18n } from 'vue-i18n';
 
-  import type { TableProps } from '@types/bkui-vue';
+  type TableProps = InstanceType<typeof Table>['$props'];
 
   interface HostInfo {
     ip: string,
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/checksum/pages/page1/components/RenderData/Index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/checksum/pages/page1/components/RenderData/Index.vue
index 5b5589639c..a6e68a4faf 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/checksum/pages/page1/components/RenderData/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/checksum/pages/page1/components/RenderData/Index.vue
@@ -123,11 +123,12 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
-  import BatchOperateIcon from '@components/batch-operate-icon/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
+  import BatchOperateIcon from '@views/db-manage/common/batch-operate-icon/Index.vue';
+
   import type { IDataRowBatchKey } from './Row.vue';
 
   interface Emits {
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/data-migrate/pages/page1/components/Index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/data-migrate/pages/page1/components/Index.vue
index fe93cf49f2..f42a203d73 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/data-migrate/pages/page1/components/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/data-migrate/pages/page1/components/Index.vue
@@ -67,10 +67,11 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchOperateIcon from '@components/batch-operate-icon/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchOperateIcon from '@views/db-manage/common/batch-operate-icon/Index.vue';
+
   interface Emits {
     (e: 'batchSelectCluster'): void;
   }
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/db-backup/pages/page1/components/RenderData/Index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/db-backup/pages/page1/components/RenderData/Index.vue
index eaa3e5efad..0e47e049bf 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/db-backup/pages/page1/components/RenderData/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/db-backup/pages/page1/components/RenderData/Index.vue
@@ -58,11 +58,12 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
-  import BatchOperateIcon from '@components/batch-operate-icon/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
+  import BatchOperateIcon from '@views/db-manage/common/batch-operate-icon/Index.vue';
+
   interface Emits {
     (e: 'batchSelectCluster'): void;
     (e: 'batchEditBackupLocal', value: string): void;
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/db-clear/pages/page1/components/RenderData/Index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/db-clear/pages/page1/components/RenderData/Index.vue
index 4008a95560..eabc2fbe75 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/db-clear/pages/page1/components/RenderData/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/db-clear/pages/page1/components/RenderData/Index.vue
@@ -128,11 +128,12 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
-  import BatchOperateIcon from '@components/batch-operate-icon/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
+  import BatchOperateIcon from '@views/db-manage/common/batch-operate-icon/Index.vue';
+
   import type { IDataRowBatchKey } from './Row.vue';
 
   interface Emits {
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/db-rename/pages/page1/components/RenderData/Index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/db-rename/pages/page1/components/RenderData/Index.vue
index f8bd585c24..8fd57b0a80 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/db-rename/pages/page1/components/RenderData/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/db-rename/pages/page1/components/RenderData/Index.vue
@@ -75,11 +75,12 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
-  import BatchOperateIcon from '@components/batch-operate-icon/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
+  import BatchOperateIcon from '@views/db-manage/common/batch-operate-icon/Index.vue';
+
   import type { IDataRowBatchKey } from './Row.vue';
 
   interface Emits {
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/db-table-backup/pages/page1/components/RenderData/Index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/db-table-backup/pages/page1/components/RenderData/Index.vue
index 4d56f1778f..83c8f4a81d 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/db-table-backup/pages/page1/components/RenderData/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/db-table-backup/pages/page1/components/RenderData/Index.vue
@@ -119,11 +119,12 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
-  import BatchOperateIcon from '@components/batch-operate-icon/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
+  import BatchOperateIcon from '@views/db-manage/common/batch-operate-icon/Index.vue';
+
   import type { IDataRowBatchKey } from './Row.vue';
 
   interface Emits {
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/dumper/components/render-list/components/instance-list/Index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/dumper/components/render-list/components/instance-list/Index.vue
index dd3e37e84a..717380c29a 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/dumper/components/render-list/components/instance-list/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/dumper/components/render-list/components/instance-list/Index.vue
@@ -158,10 +158,11 @@
     ipv4,
   } from '@common/regex';
 
-  import RenderOperationTagNew from '@components/cluster-common/RenderOperationTagNew.vue';
   import MiniTag from '@components/mini-tag/index.vue';
   import TextOverflowLayout from '@components/text-overflow-layout/Index.vue';
 
+  import RenderOperationTagNew from '@views/db-manage/common/RenderOperationTagNew.vue';
+
   import { getSearchSelectorParams } from '@utils';
 
   import AppendSubscribeSlider from '../append-subscribe/Index.vue';
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/flashback/pages/page1/components/RenderData/Index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/flashback/pages/page1/components/RenderData/Index.vue
index d8fd1c30fc..15a762e0ce 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/flashback/pages/page1/components/RenderData/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/flashback/pages/page1/components/RenderData/Index.vue
@@ -161,11 +161,12 @@
   import dayjs from 'dayjs';
   import { useI18n } from 'vue-i18n';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
-  import BatchOperateIcon from '@components/batch-operate-icon/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
+  import BatchOperateIcon from '@views/db-manage/common/batch-operate-icon/Index.vue';
+
   import type { IDataRowBatchKey } from './Row.vue';
 
   interface Emits {
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/ha-cluster-list/components/List.vue b/dbm-ui/frontend/src/views/db-manage/mysql/ha-cluster-list/components/List.vue
index ab5bd04c53..cfb29fa924 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/ha-cluster-list/components/List.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/ha-cluster-list/components/List.vue
@@ -148,23 +148,23 @@
     UserPersonalSettings,
   } from '@common/const';
 
-  import ClusterAuthorize from '@components/cluster-authorize/ClusterAuthorize.vue';
-  import ClusterCapacityUsageRate from '@components/cluster-capacity-usage-rate/Index.vue'
-  import ExcelAuthorize from '@components/cluster-common/ExcelAuthorize.vue';
-  import OperationBtnStatusTips from '@components/cluster-common/OperationBtnStatusTips.vue';
-  import RenderOperationTag from '@components/cluster-common/RenderOperationTagNew.vue';
-  import EditEntryConfig, { type RowData } from '@components/cluster-entry-config/Index.vue';
-  import ClusterExportData from '@components/cluster-export-data/Index.vue'
   import DbStatus from '@components/db-status/index.vue';
   import DbTable from '@components/db-table/index.vue';
-  import DropdownExportExcel from '@components/dropdown-export-excel/index.vue';
   import MoreActionExtend from '@components/more-action-extend/Index.vue';
-  import RenderInstances from '@components/render-instances/RenderInstances.vue';
   import TextOverflowLayout from '@components/text-overflow-layout/Index.vue';
 
+  import ClusterAuthorize from '@views/db-manage/common/cluster-authorize/ClusterAuthorize.vue';
+  import ClusterCapacityUsageRate from '@views/db-manage/common/cluster-capacity-usage-rate/Index.vue'
+  import EditEntryConfig, { type RowData } from '@views/db-manage/common/cluster-entry-config/Index.vue';
+  import ClusterExportData from '@views/db-manage/common/cluster-export-data/Index.vue'
   import ClusterIpCopy from '@views/db-manage/common/cluster-ip-copy/Index.vue';
+  import DropdownExportExcel from '@views/db-manage/common/dropdown-export-excel/index.vue';
+  import ExcelAuthorize from '@views/db-manage/common/ExcelAuthorize.vue';
+  import OperationBtnStatusTips from '@views/db-manage/common/OperationBtnStatusTips.vue';
   import RenderCellCopy from '@views/db-manage/common/render-cell-copy/Index.vue';
   import RenderHeadCopy from '@views/db-manage/common/render-head-copy/Index.vue';
+  import RenderInstances from '@views/db-manage/common/render-instances/RenderInstances.vue';
+  import RenderOperationTag from '@views/db-manage/common/RenderOperationTag.vue';
   import CreateSubscribeRuleSlider from '@views/db-manage/mysql/dumper/components/create-rule/Index.vue';
 
   import {
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/ha-cluster-list/components/detail/Index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/ha-cluster-list/components/detail/Index.vue
index 42679a1e9c..8a584d850f 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/ha-cluster-list/components/detail/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/ha-cluster-list/components/detail/Index.vue
@@ -67,9 +67,9 @@
 
   import { ClusterTypes, DBTypes } from '@common/const';
 
-  import ClusterTopo from '@components/cluster-details/ClusterTopo.vue';
-  import ClusterEventChange from '@components/cluster-event-change/EventChange.vue';
-  import MonitorDashboard from '@components/cluster-monitor/MonitorDashboard.vue';
+  import ClusterTopo from '@views/db-manage/common/cluster-details/ClusterTopo.vue';
+  import ClusterEventChange from '@views/db-manage/common/cluster-event-change/EventChange.vue';
+  import MonitorDashboard from '@views/db-manage/common/cluster-monitor/MonitorDashboard.vue';
 
   import { checkDbConsole } from '@utils';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/ha-instance-list/components/detail/components/Config.vue b/dbm-ui/frontend/src/views/db-manage/mysql/ha-instance-list/components/detail/components/Config.vue
index fed8ee0a2b..17894b0a87 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/ha-instance-list/components/detail/components/Config.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/ha-instance-list/components/detail/components/Config.vue
@@ -32,16 +32,16 @@
 
   import { ClusterTypes } from '@common/const';
 
-  import type { TableColumnRender } from '@types/bkui-vue';
-
   interface Props {
     queryInfos: {
-      dbModuleId: number,
-      version: string,
-      clusterId: number
-    }
+      dbModuleId: number;
+      version: string;
+      clusterId: number;
+    };
   }
 
+  type IRowData = ServiceReturnType<typeof getLevelConfig>['conf_items'][number];
+
   const props = defineProps<Props>();
 
   const { currentBizId } = useGlobalBizs();
@@ -54,34 +54,43 @@
     description: '',
     conf_items: [],
   } as ServiceReturnType<typeof getLevelConfig>);
-  const columns = [{
-    label: t('参数项'),
-    field: 'conf_name',
-    render: ({ cell }: TableColumnRender) => <div class="text-overflow" v-overflow-tips>{cell}</div>,
-  }, {
-    label: t('参数值'),
-    field: 'conf_value',
-    render: ({ cell }: TableColumnRender) => <div class="text-overflow" v-overflow-tips>{cell}</div>,
-  }, {
-    label: t('描述'),
-    field: 'description',
-    render: ({ cell }: TableColumnRender) => <div class="text-overflow" v-overflow-tips>{cell || '--'}</div>,
-  }, {
-    label: t('重启实例生效'),
-    field: 'need_restart',
-    width: 200,
-    render: ({ cell }: {cell: number}) => (cell === 1 ? t('是') : t('否')),
-  }];
+  const columns = [
+    {
+      label: t('参数项'),
+      field: 'conf_name',
+      render: ({ data }: { data: IRowData }) => data.conf_name,
+    },
+    {
+      label: t('参数值'),
+      field: 'conf_value',
+      render: ({ data }: { data: IRowData }) => data.conf_value,
+    },
+    {
+      label: t('描述'),
+      field: 'description',
+      render: ({ data }: { data: IRowData }) => data.description || '--',
+    },
+    {
+      label: t('重启实例生效'),
+      field: 'need_restart',
+      width: 200,
+      render: ({ cell }: { cell: number }) => (cell === 1 ? t('是') : t('否')),
+    },
+  ];
 
-  watch(() => props.queryInfos, (infos) => {
-    const { dbModuleId, version, clusterId } = infos;
-    if (dbModuleId && version && clusterId) {
-      fetchClusterConfig();
-    }
-  }, {
-    immediate: true,
-    deep: true,
-  });
+  watch(
+    () => props.queryInfos,
+    (infos) => {
+      const { dbModuleId, version, clusterId } = infos;
+      if (dbModuleId && version && clusterId) {
+        fetchClusterConfig();
+      }
+    },
+    {
+      immediate: true,
+      deep: true,
+    },
+  );
 
   /**
    * 获取集群配置
@@ -105,7 +114,7 @@
       .finally(() => {
         isLoading.value = false;
       });
-  }
+  };
 </script>
 
 <style lang="less" scoped>
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/master-failover/pages/page1/components/RenderData/Index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/master-failover/pages/page1/components/RenderData/Index.vue
index e5533ab27d..dc33afee14 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/master-failover/pages/page1/components/RenderData/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/master-failover/pages/page1/components/RenderData/Index.vue
@@ -48,10 +48,11 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchOperateIcon from '@components/batch-operate-icon/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchOperateIcon from '@views/db-manage/common/batch-operate-icon/Index.vue';
+
   interface Emits {
     (e: 'showMasterBatchSelector'): void;
     (e: 'showSlaveBatchSelector'): void;
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/master-slave-clone/pages/page1/components/RenderData/Index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/master-slave-clone/pages/page1/components/RenderData/Index.vue
index 2e1227330f..ecbf85eb54 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/master-slave-clone/pages/page1/components/RenderData/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/master-slave-clone/pages/page1/components/RenderData/Index.vue
@@ -43,10 +43,11 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchOperateIcon from '@components/batch-operate-icon/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchOperateIcon from '@views/db-manage/common/batch-operate-icon/Index.vue';
+
   interface Emits {
     (e: 'batchSelectCluster'): void;
   }
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/master-slave-swap/pages/page1/components/RenderData/Index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/master-slave-swap/pages/page1/components/RenderData/Index.vue
index c225f9caa5..f294126ea7 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/master-slave-swap/pages/page1/components/RenderData/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/master-slave-swap/pages/page1/components/RenderData/Index.vue
@@ -48,10 +48,11 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchOperateIcon from '@components/batch-operate-icon/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchOperateIcon from '@views/db-manage/common/batch-operate-icon/Index.vue';
+
   interface Emits {
     (e: 'showMasterBatchSelector'): void;
   }
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/openarea/create/components/target-cluster/components/RenderTable.vue b/dbm-ui/frontend/src/views/db-manage/mysql/openarea/create/components/target-cluster/components/RenderTable.vue
index db6a594585..26a8b19adc 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/openarea/create/components/target-cluster/components/RenderTable.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/openarea/create/components/target-cluster/components/RenderTable.vue
@@ -73,11 +73,12 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
-  import BatchOperateIcon from '@components/batch-operate-icon/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
+  import BatchOperateIcon from '@views/db-manage/common/batch-operate-icon/Index.vue';
+
   interface Props {
     variableList: string[];
     showIpCloumn: boolean;
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/openarea/template-create/Index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/openarea/template-create/Index.vue
index de7bc386e0..3ca7640e19 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/openarea/template-create/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/openarea/template-create/Index.vue
@@ -131,10 +131,11 @@
 
   import { ClusterTypes } from '@common/const';
 
-  import PermissionRule from '@components/add-permission-rule-dialog/Index.vue';
   import ClusterSelector, { type TabConfig } from '@components/cluster-selector/Index.vue';
   import TextOverflowLayout from '@components/text-overflow-layout/Index.vue';
 
+  import PermissionRule from '@views/db-manage/common/add-permission-rule-dialog/Index.vue';
+
   import { messageSuccess } from '@utils';
 
   import ConfigRule from './components/config-rule/Index.vue';
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/openarea/template-create/components/config-rule/components/RenderData/Index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/openarea/template-create/components/config-rule/components/RenderData/Index.vue
index a8f80cf9b1..557dbf8cee 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/openarea/template-create/components/config-rule/components/RenderData/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/openarea/template-create/components/config-rule/components/RenderData/Index.vue
@@ -73,10 +73,11 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
+
   interface Emits {
     (e: 'batchEdit', value: string[]): void;
   }
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/openarea/template-create/components/config-rule/components/RenderData/RenderPrivData.vue b/dbm-ui/frontend/src/views/db-manage/mysql/openarea/template-create/components/config-rule/components/RenderData/RenderPrivData.vue
index be60727ff6..d5a9d30b0b 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/openarea/template-create/components/config-rule/components/RenderData/RenderPrivData.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/openarea/template-create/components/config-rule/components/RenderData/RenderPrivData.vue
@@ -46,7 +46,7 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import PermissionRule from '@components/add-permission-rule-dialog/Index.vue';
+  import PermissionRule from '@views/db-manage/common/add-permission-rule-dialog/Index.vue';
 
   interface Props {
     clusterId: number;
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/permission-rule/index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/permission-rule/index.vue
index e4b3b4affb..84aca3bca5 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/permission-rule/index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/permission-rule/index.vue
@@ -132,10 +132,11 @@
   } from '@common/const';
 
   import PermissionCatch from '@components/apply-permission/Catch.vue'
-  import ClusterAuthorize from '@components/cluster-authorize/ClusterAuthorize.vue';
   import DbTable from '@components/db-table/index.vue';
   import TextOverflowLayout from '@components/text-overflow-layout/Index.vue';
 
+  import ClusterAuthorize from '@views/db-manage/common/cluster-authorize/ClusterAuthorize.vue';
+
   import { getSearchSelectorParams } from '@utils';
 
   import { dbOperations } from './common/const';
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/privilege-clone-client/pages/page1/components/RenderData/Index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/privilege-clone-client/pages/page1/components/RenderData/Index.vue
index e111bdf450..2a17adbf7e 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/privilege-clone-client/pages/page1/components/RenderData/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/privilege-clone-client/pages/page1/components/RenderData/Index.vue
@@ -51,10 +51,11 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchOperateIcon from '@components/batch-operate-icon/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchOperateIcon from '@views/db-manage/common/batch-operate-icon/Index.vue';
+
   interface Emits {
     (e: 'showIpSelector'): void;
   }
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/privilege-clone-inst/pages/page1/components/RenderData/Index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/privilege-clone-inst/pages/page1/components/RenderData/Index.vue
index e4fdb27489..04de16bb81 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/privilege-clone-inst/pages/page1/components/RenderData/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/privilege-clone-inst/pages/page1/components/RenderData/Index.vue
@@ -51,10 +51,11 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchOperateIcon from '@components/batch-operate-icon/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchOperateIcon from '@views/db-manage/common/batch-operate-icon/Index.vue';
+
   interface Emits {
     (e: 'batchSelectCluster'): void;
   }
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/proxy-add/pages/page1/components/RenderData/Index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/proxy-add/pages/page1/components/RenderData/Index.vue
index 87cfec4b23..11e805c618 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/proxy-add/pages/page1/components/RenderData/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/proxy-add/pages/page1/components/RenderData/Index.vue
@@ -43,10 +43,11 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchOperateIcon from '@components/batch-operate-icon/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchOperateIcon from '@views/db-manage/common/batch-operate-icon/Index.vue';
+
   interface Emits {
     (e: 'batchSelectCluster'): void;
     (e: 'batchSelectIp'): void;
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/proxy-replace/pages/page1/components/RenderData/Index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/proxy-replace/pages/page1/components/RenderData/Index.vue
index a50c15b934..56ddd30a25 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/proxy-replace/pages/page1/components/RenderData/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/proxy-replace/pages/page1/components/RenderData/Index.vue
@@ -43,10 +43,11 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchOperateIcon from '@components/batch-operate-icon/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchOperateIcon from '@views/db-manage/common/batch-operate-icon/Index.vue';
+
   interface Emits {
     (e: 'batchSelectCluster'): void;
   }
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/rollback/pages/page1/components/render-data/exist-cluster/Index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/rollback/pages/page1/components/render-data/exist-cluster/Index.vue
index 59da55f0a3..52d7688878 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/rollback/pages/page1/components/render-data/exist-cluster/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/rollback/pages/page1/components/render-data/exist-cluster/Index.vue
@@ -196,11 +196,12 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
-  import BatchOperateIcon from '@components/batch-operate-icon/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
+  import BatchOperateIcon from '@views/db-manage/common/batch-operate-icon/Index.vue';
+
   import { BackupTypes, selectList } from '../../common/const';
   import type { IDataRow } from '../Index.vue';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/rollback/pages/page1/components/render-data/new-cluster/Index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/rollback/pages/page1/components/render-data/new-cluster/Index.vue
index 131fea458c..b61d4afb7b 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/rollback/pages/page1/components/render-data/new-cluster/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/rollback/pages/page1/components/render-data/new-cluster/Index.vue
@@ -201,11 +201,12 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
-  import BatchOperateIcon from '@components/batch-operate-icon/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
+  import BatchOperateIcon from '@views/db-manage/common/batch-operate-icon/Index.vue';
+
   import { BackupTypes, selectList } from '../../common/const';
   import type { IDataRow } from '../Index.vue';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/rollback/pages/page1/components/render-data/origin-cluster/Index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/rollback/pages/page1/components/render-data/origin-cluster/Index.vue
index 27f16693e3..79ceb1e355 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/rollback/pages/page1/components/render-data/origin-cluster/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/rollback/pages/page1/components/render-data/origin-cluster/Index.vue
@@ -117,11 +117,12 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
-  import BatchOperateIcon from '@components/batch-operate-icon/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
+  import BatchOperateIcon from '@views/db-manage/common/batch-operate-icon/Index.vue';
+
   import { BackupTypes, selectList } from '../../common/const';
   import type { IDataRow } from '../Index.vue';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/single-cluster-list/components/List.vue b/dbm-ui/frontend/src/views/db-manage/mysql/single-cluster-list/components/List.vue
index e88f3070f3..85296676ec 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/single-cluster-list/components/List.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/single-cluster-list/components/List.vue
@@ -132,23 +132,23 @@
     UserPersonalSettings,
   } from '@common/const';
 
-  import ClusterAuthorize from '@components/cluster-authorize/ClusterAuthorize.vue';
-  import ClusterCapacityUsageRate from '@components/cluster-capacity-usage-rate/Index.vue'
-  import ExcelAuthorize from '@components/cluster-common/ExcelAuthorize.vue';
-  import OperationBtnStatusTips from '@components/cluster-common/OperationBtnStatusTips.vue';
-  import RenderOperationTag from '@components/cluster-common/RenderOperationTag.vue';
-  import EditEntryConfig from '@components/cluster-entry-config/Index.vue';
-  import ClusterExportData from '@components/cluster-export-data/Index.vue'
   import DbStatus from '@components/db-status/index.vue';
   import DbTable from '@components/db-table/index.vue';
-  import DropdownExportExcel from '@components/dropdown-export-excel/index.vue';
   import MoreActionExtend from '@components/more-action-extend/Index.vue';
-  import RenderInstances from '@components/render-instances/RenderInstances.vue';
   import TextOverflowLayout from '@components/text-overflow-layout/Index.vue';
 
+  import ClusterAuthorize from '@views/db-manage/common/cluster-authorize/ClusterAuthorize.vue';
+  import ClusterCapacityUsageRate from '@views/db-manage/common/cluster-capacity-usage-rate/Index.vue'
+  import EditEntryConfig from '@views/db-manage/common/cluster-entry-config/Index.vue';
+  import ClusterExportData from '@views/db-manage/common/cluster-export-data/Index.vue'
   import ClusterIpCopy from '@views/db-manage/common/cluster-ip-copy/Index.vue';
+  import DropdownExportExcel from '@views/db-manage/common/dropdown-export-excel/index.vue';
+  import ExcelAuthorize from '@views/db-manage/common/ExcelAuthorize.vue';
+  import OperationBtnStatusTips from '@views/db-manage/common/OperationBtnStatusTips.vue';
   import RenderCellCopy from '@views/db-manage/common/render-cell-copy/Index.vue';
   import RenderHeadCopy from '@views/db-manage/common/render-head-copy/Index.vue';
+  import RenderInstances from '@views/db-manage/common/render-instances/RenderInstances.vue';
+  import RenderOperationTag from '@views/db-manage/common/RenderOperationTag.vue';
 
   import {
     getMenuListSearch,
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/single-cluster-list/components/detail/Index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/single-cluster-list/components/detail/Index.vue
index cd3fe4a875..60563035b2 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/single-cluster-list/components/detail/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/single-cluster-list/components/detail/Index.vue
@@ -67,9 +67,9 @@
 
   import { ClusterTypes, DBTypes } from '@common/const';
 
-  import ClusterTopo from '@components/cluster-details/ClusterTopo.vue';
-  import ClusterEventChange from '@components/cluster-event-change/EventChange.vue';
-  import MonitorDashboard from '@components/cluster-monitor/MonitorDashboard.vue';
+  import ClusterTopo from '@views/db-manage/common/cluster-details/ClusterTopo.vue';
+  import ClusterEventChange from '@views/db-manage/common/cluster-event-change/EventChange.vue';
+  import MonitorDashboard from '@views/db-manage/common/cluster-monitor/MonitorDashboard.vue';
 
   import { checkDbConsole } from '@utils';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/slave-add/pages/page1/components/RenderData/Index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/slave-add/pages/page1/components/RenderData/Index.vue
index 53d4fa87b7..b8c4fd6e57 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/slave-add/pages/page1/components/RenderData/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/slave-add/pages/page1/components/RenderData/Index.vue
@@ -43,10 +43,11 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchOperateIcon from '@components/batch-operate-icon/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchOperateIcon from '@views/db-manage/common/batch-operate-icon/Index.vue';
+
   interface Emits {
     (e: 'batchSelectCluster'): void;
   }
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/slave-rebuild/pages/page1/components/new-host/components/RenderData/Index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/slave-rebuild/pages/page1/components/new-host/components/RenderData/Index.vue
index 3e44d046a2..53d2a7fc7c 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/slave-rebuild/pages/page1/components/new-host/components/RenderData/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/slave-rebuild/pages/page1/components/new-host/components/RenderData/Index.vue
@@ -50,10 +50,11 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchOperateIcon from '@components/batch-operate-icon/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchOperateIcon from '@views/db-manage/common/batch-operate-icon/Index.vue';
+
   interface Emits {
     (e: 'showIpSelector'): void;
   }
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/slave-rebuild/pages/page1/components/original-host/components/RenderData/Index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/slave-rebuild/pages/page1/components/original-host/components/RenderData/Index.vue
index ca49c6b7ba..75e7040b0f 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/slave-rebuild/pages/page1/components/original-host/components/RenderData/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/slave-rebuild/pages/page1/components/original-host/components/RenderData/Index.vue
@@ -45,10 +45,11 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchOperateIcon from '@components/batch-operate-icon/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchOperateIcon from '@views/db-manage/common/batch-operate-icon/Index.vue';
+
   interface Emits {
     (e: 'showIpSelector'): void;
   }
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/version-upgrade/pages/page1/components/ha-access-layer/Index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/version-upgrade/pages/page1/components/ha-access-layer/Index.vue
index 8702b68815..287281f442 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/version-upgrade/pages/page1/components/ha-access-layer/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/version-upgrade/pages/page1/components/ha-access-layer/Index.vue
@@ -95,12 +95,12 @@
 
   import { ClusterTypes, TicketTypes } from '@common/const';
 
-  import BatchOperateIcon from '@components/batch-operate-icon/Index.vue';
   import ClusterSelector from '@components/cluster-selector/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
   import TicketRemark from '@components/ticket-remark/Index.vue';
 
+  import BatchOperateIcon from '@views/db-manage/common/batch-operate-icon/Index.vue';
   import type { InfoItem } from '@views/db-manage/redis/db-data-copy/pages/page1/Index.vue';
 
   import RenderDataRow, { createRowData, type IDataRow } from './Row.vue';
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/version-upgrade/pages/page1/components/ha-storage-layer-local/Index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/version-upgrade/pages/page1/components/ha-storage-layer-local/Index.vue
index f1e2f52484..e7bd15ebbf 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/version-upgrade/pages/page1/components/ha-storage-layer-local/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/version-upgrade/pages/page1/components/ha-storage-layer-local/Index.vue
@@ -91,12 +91,12 @@
 
   import { ClusterTypes, TicketTypes } from '@common/const';
 
-  import BatchOperateIcon from '@components/batch-operate-icon/Index.vue';
   import ClusterSelector from '@components/cluster-selector/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
   import TicketRemark from '@components/ticket-remark/Index.vue';
 
+  import BatchOperateIcon from '@views/db-manage/common/batch-operate-icon/Index.vue';
   import type { InfoItem } from '@views/db-manage/redis/db-data-copy/pages/page1/Index.vue';
 
   import RenderDataRow, { createRowData, type IDataRow } from './Row.vue';
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/version-upgrade/pages/page1/components/ha-storage-layer-remote/Index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/version-upgrade/pages/page1/components/ha-storage-layer-remote/Index.vue
index f21a9ab826..0dadd42b37 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/version-upgrade/pages/page1/components/ha-storage-layer-remote/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/version-upgrade/pages/page1/components/ha-storage-layer-remote/Index.vue
@@ -112,12 +112,12 @@
 
   import { ClusterTypes, TicketTypes } from '@common/const';
 
-  import BatchOperateIcon from '@components/batch-operate-icon/Index.vue';
   import ClusterSelector from '@components/cluster-selector/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
   import TicketRemark from '@components/ticket-remark/Index.vue';
 
+  import BatchOperateIcon from '@views/db-manage/common/batch-operate-icon/Index.vue';
   import type { InfoItem } from '@views/db-manage/redis/db-data-copy/pages/page1/Index.vue';
 
   import RenderDataRow, { createRowData, type IDataRow } from './Row.vue';
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/version-upgrade/pages/page1/components/single-storage-layer/Index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/version-upgrade/pages/page1/components/single-storage-layer/Index.vue
index d1f99c2fa5..27419d5eec 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/version-upgrade/pages/page1/components/single-storage-layer/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/version-upgrade/pages/page1/components/single-storage-layer/Index.vue
@@ -91,12 +91,12 @@
 
   import { ClusterTypes, TicketTypes } from '@common/const';
 
-  import BatchOperateIcon from '@components/batch-operate-icon/Index.vue';
   import ClusterSelector from '@components/cluster-selector/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
   import TicketRemark from '@components/ticket-remark/Index.vue';
 
+  import BatchOperateIcon from '@views/db-manage/common/batch-operate-icon/Index.vue';
   import type { InfoItem } from '@views/db-manage/redis/db-data-copy/pages/page1/Index.vue';
 
   import RenderDataRow, { createRowData, type IDataRow } from './Row.vue';
diff --git a/dbm-ui/frontend/src/views/db-manage/mysql/webconsole/Index.vue b/dbm-ui/frontend/src/views/db-manage/mysql/webconsole/Index.vue
index cf1fffbfb2..1d943ad66f 100644
--- a/dbm-ui/frontend/src/views/db-manage/mysql/webconsole/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/mysql/webconsole/Index.vue
@@ -2,5 +2,5 @@
   <WebConsole />
 </template>
 <script setup lang="ts">
-  import WebConsole from '@components/webconsole/Index.vue';
+  import WebConsole from '@views/db-manage/common/webconsole/Index.vue';
 </script>
diff --git a/dbm-ui/frontend/src/views/db-manage/pulsar/apply/index.vue b/dbm-ui/frontend/src/views/db-manage/pulsar/apply/index.vue
index 34e8c8becc..c84e6c8740 100644
--- a/dbm-ui/frontend/src/views/db-manage/pulsar/apply/index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/pulsar/apply/index.vue
@@ -371,16 +371,17 @@
 
   import { OSTypes } from '@common/const';
 
-  // import AffinityItem from '@components/apply-items/AffinityItem.vue';
-  import BusinessItems from '@components/apply-items/BusinessItems.vue';
-  import CloudItem from '@components/apply-items/CloudItem.vue';
-  import ClusterAlias from '@components/apply-items/ClusterAlias.vue';
-  import ClusterName from '@components/apply-items/ClusterName.vue';
-  import DeployVersion from '@components/apply-items/DeployVersion.vue';
-  import RegionItem from '@components/apply-items/RegionItem.vue';
-  import SpecSelector from '@components/apply-items/SpecSelector.vue';
   import IpSelector from '@components/ip-selector/IpSelector.vue';
 
+  // import AffinityItem from '@views/db-manage/common/apply-items/AffinityItem.vue';
+  import BusinessItems from '@views/db-manage/common/apply-items/BusinessItems.vue';
+  import CloudItem from '@views/db-manage/common/apply-items/CloudItem.vue';
+  import ClusterAlias from '@views/db-manage/common/apply-items/ClusterAlias.vue';
+  import ClusterName from '@views/db-manage/common/apply-items/ClusterName.vue';
+  import DeployVersion from '@views/db-manage/common/apply-items/DeployVersion.vue';
+  import RegionItem from '@views/db-manage/common/apply-items/RegionItem.vue';
+  import SpecSelector from '@views/db-manage/common/apply-items/SpecSelector.vue';
+
   import { getInitFormdata } from './common/base';
 
   const getSmartActionOffsetTarget = () => document.querySelector('.bk-form-content');
diff --git a/dbm-ui/frontend/src/views/db-manage/pulsar/common/expansion/Index.vue b/dbm-ui/frontend/src/views/db-manage/pulsar/common/expansion/Index.vue
index 2fb9385e0c..91a441bc16 100644
--- a/dbm-ui/frontend/src/views/db-manage/pulsar/common/expansion/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/pulsar/common/expansion/Index.vue
@@ -40,10 +40,10 @@
         <HostExpansion
           v-if="!isLoading"
           :key="nodeType"
-          v-model:expansionDisk="nodeInfoMap[nodeType].expansionDisk"
-          v-model:hostList="nodeInfoMap[nodeType].hostList"
-          v-model:resourceSpec="nodeInfoMap[nodeType].resourceSpec"
-          v-model:targetDisk="nodeInfoMap[nodeType].targetDisk"
+          v-model:expansion-disk="nodeInfoMap[nodeType].expansionDisk"
+          v-model:host-list="nodeInfoMap[nodeType].hostList"
+          v-model:resource-spec="nodeInfoMap[nodeType].resourceSpec"
+          v-model:target-disk="nodeInfoMap[nodeType].targetDisk"
           :cloud-info="{
             id: data.bk_cloud_id,
             name: data.bk_cloud_name,
@@ -76,8 +76,8 @@
 
   import HostExpansion, {
     type TExpansionNode,
-  } from '@components/cluster-common/host-expansion/Index.vue';
-  import NodeStatusList from '@components/cluster-common/host-expansion/NodeStatusList.vue';
+  } from '@views/db-manage/common/host-expansion/Index.vue';
+  import NodeStatusList from '@views/db-manage/common/host-expansion/NodeStatusList.vue';
 
   import { messageError } from '@utils';
 
@@ -178,7 +178,7 @@
       host_id: item.bk_host_id,
       meta: {
         bk_biz_id: item.bk_biz_id,
-        scope_id: item.bk_biz_id,
+        scope_id: `${item.bk_biz_id}`,
         scope_type: 'biz',
       },
     }));
@@ -187,7 +187,7 @@
     getHostDetails({
       host_list: hostIdList,
       scope_list: [{
-        scope_id: bizId,
+        scope_id: `${bizId}`,
         scope_type: 'biz',
       }],
     }).then((data) => {
diff --git a/dbm-ui/frontend/src/views/db-manage/pulsar/common/replace/Index.vue b/dbm-ui/frontend/src/views/db-manage/pulsar/common/replace/Index.vue
index af1f033a85..d59931ff3a 100644
--- a/dbm-ui/frontend/src/views/db-manage/pulsar/common/replace/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/pulsar/common/replace/Index.vue
@@ -30,9 +30,9 @@
         <div class="item-label">Bookkeeper</div>
         <HostReplace
           ref="BookkeeperRef"
-          v-model:hostList="nodeInfoMap.bookkeeper.hostList"
-          v-model:nodeList="nodeInfoMap.bookkeeper.nodeList"
-          v-model:resourceSpec="nodeInfoMap.bookkeeper.resourceSpec"
+          v-model:host-list="nodeInfoMap.bookkeeper.hostList"
+          v-model:node-list="nodeInfoMap.bookkeeper.nodeList"
+          v-model:resource-spec="nodeInfoMap.bookkeeper.resourceSpec"
           :cloud-info="{
             id: data.bk_cloud_id,
             name: data.bk_cloud_name,
@@ -48,9 +48,9 @@
         <div class="item-label">Broker</div>
         <HostReplace
           ref="brokerRef"
-          v-model:hostList="nodeInfoMap.broker.hostList"
-          v-model:nodeList="nodeInfoMap.broker.nodeList"
-          v-model:resourceSpec="nodeInfoMap.broker.resourceSpec"
+          v-model:host-list="nodeInfoMap.broker.hostList"
+          v-model:node-list="nodeInfoMap.broker.nodeList"
+          v-model:resource-spec="nodeInfoMap.broker.resourceSpec"
           :cloud-info="{
             id: data.bk_cloud_id,
             name: data.bk_cloud_name,
@@ -66,9 +66,9 @@
         <div class="item-label">Zookeeper</div>
         <HostReplace
           ref="zookeeperRef"
-          v-model:hostList="nodeInfoMap.zookeeper.hostList"
-          v-model:nodeList="nodeInfoMap.zookeeper.nodeList"
-          v-model:resourceSpec="nodeInfoMap.zookeeper.resourceSpec"
+          v-model:host-list="nodeInfoMap.zookeeper.hostList"
+          v-model:node-list="nodeInfoMap.zookeeper.nodeList"
+          v-model:resource-spec="nodeInfoMap.zookeeper.resourceSpec"
           :cloud-info="{
             id: data.bk_cloud_id,
             name: data.bk_cloud_name,
@@ -106,7 +106,7 @@
 
   import { ClusterTypes } from '@common/const';
 
-  import HostReplace, { type TReplaceNode } from '@components/cluster-common/host-replace/Index.vue';
+  import HostReplace, { type TReplaceNode } from '@views/db-manage/common/host-replace/Index.vue';
 
   import { messageError } from '@utils';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/pulsar/common/shrink/Index.vue b/dbm-ui/frontend/src/views/db-manage/pulsar/common/shrink/Index.vue
index 6e771dc466..3b3735183c 100644
--- a/dbm-ui/frontend/src/views/db-manage/pulsar/common/shrink/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/pulsar/common/shrink/Index.vue
@@ -56,8 +56,8 @@
 
   import HostShrink, {
     type TShrinkNode,
-  } from '@components/cluster-common/host-shrink/Index.vue';
-  import NodeStatusList from '@components/cluster-common/host-shrink/NodeStatusList.vue';
+  } from '@views/db-manage/common/host-shrink/Index.vue';
+  import NodeStatusList from '@views/db-manage/common/host-shrink/NodeStatusList.vue';
 
   import { messageError } from '@utils';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/pulsar/list/components/detail/Index.vue b/dbm-ui/frontend/src/views/db-manage/pulsar/list/components/detail/Index.vue
index 6cd4332b09..1cc37ae55c 100644
--- a/dbm-ui/frontend/src/views/db-manage/pulsar/list/components/detail/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/pulsar/list/components/detail/Index.vue
@@ -73,9 +73,9 @@
 
   import { ClusterTypes } from '@common/const';
 
-  import ClusterTopo from '@components/cluster-details/ClusterTopo.vue';
-  import ClusterEventChange from '@components/cluster-event-change/EventChange.vue';
-  import MonitorDashboard from '@components/cluster-monitor/MonitorDashboard.vue';
+  import ClusterTopo from '@views/db-manage/common/cluster-details/ClusterTopo.vue';
+  import ClusterEventChange from '@views/db-manage/common/cluster-event-change/EventChange.vue';
+  import MonitorDashboard from '@views/db-manage/common/cluster-monitor/MonitorDashboard.vue';
 
   import { checkDbConsole } from '@utils';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/pulsar/list/components/detail/components/BaseInfo.vue b/dbm-ui/frontend/src/views/db-manage/pulsar/list/components/detail/components/BaseInfo.vue
index 9b9a713ba5..3ced3387d2 100644
--- a/dbm-ui/frontend/src/views/db-manage/pulsar/list/components/detail/components/BaseInfo.vue
+++ b/dbm-ui/frontend/src/views/db-manage/pulsar/list/components/detail/components/BaseInfo.vue
@@ -19,7 +19,7 @@
 <script setup lang="ts">
   import { getPulsarDetail } from '@services/source/pulsar';
 
-  import RenderBaseInfo from '@components/cluster-common/RenderBaseInfo.vue';
+  import RenderBaseInfo from '@views/db-manage/common/RenderBaseInfo.vue';
 
   interface Props {
     data: ServiceReturnType<typeof getPulsarDetail>;
diff --git a/dbm-ui/frontend/src/views/db-manage/pulsar/list/components/detail/components/node-list/Index.vue b/dbm-ui/frontend/src/views/db-manage/pulsar/list/components/detail/components/node-list/Index.vue
index e468f6f9a4..5e661b6398 100644
--- a/dbm-ui/frontend/src/views/db-manage/pulsar/list/components/detail/components/node-list/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/pulsar/list/components/detail/components/node-list/Index.vue
@@ -189,10 +189,10 @@
 
   import { ClusterTypes } from '@common/const';
 
-  import OperationBtnStatusTips from '@components/cluster-common/OperationBtnStatusTips.vue';
-  import RenderClusterRole from '@components/cluster-common/RenderRole.vue';
   import RenderHostStatus from '@components/render-host-status/Index.vue';
 
+  import OperationBtnStatusTips from '@views/db-manage/common/OperationBtnStatusTips.vue';
+  import RenderClusterRole from '@views/db-manage/common/RenderRole.vue';
   import ClusterExpansion from '@views/db-manage/pulsar/common/expansion/Index.vue';
   import ClusterReplace from '@views/db-manage/pulsar/common/replace/Index.vue';
   import ClusterShrink from '@views/db-manage/pulsar/common/shrink/Index.vue';
diff --git a/dbm-ui/frontend/src/views/db-manage/pulsar/list/components/detail/components/node-list/components/InstanceDetail.vue b/dbm-ui/frontend/src/views/db-manage/pulsar/list/components/detail/components/node-list/components/InstanceDetail.vue
index 166e68d671..7600a68f72 100644
--- a/dbm-ui/frontend/src/views/db-manage/pulsar/list/components/detail/components/node-list/components/InstanceDetail.vue
+++ b/dbm-ui/frontend/src/views/db-manage/pulsar/list/components/detail/components/node-list/components/InstanceDetail.vue
@@ -51,9 +51,9 @@
 
   import { useGlobalBizs } from '@stores';
 
-  import OperationBtnStatusTips from '@components/cluster-common/OperationBtnStatusTips.vue';
-  import RenderInstanceStatus from '@components/cluster-common/RenderInstanceStatus.vue';
-  import RenderOperationTag from '@components/cluster-common/RenderOperationTag.vue';
+  import OperationBtnStatusTips from '@views/db-manage/common/OperationBtnStatusTips.vue';
+  import RenderInstanceStatus from '@views/db-manage/common/RenderInstanceStatus.vue';
+  import RenderOperationTag from '@views/db-manage/common/RenderOperationTag.vue';
 
   import { useTimeoutPoll } from '@vueuse/core';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/pulsar/list/components/list/Index.vue b/dbm-ui/frontend/src/views/db-manage/pulsar/list/components/list/Index.vue
index 37c26e6d67..27e264a25b 100644
--- a/dbm-ui/frontend/src/views/db-manage/pulsar/list/components/list/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/pulsar/list/components/list/Index.vue
@@ -96,6 +96,7 @@
 </template>
 <script setup lang="tsx">
   import { InfoBox, Message } from 'bkui-vue';
+  import type { ISearchItem } from 'bkui-vue/lib/search-select/utils';
   import { useI18n } from 'vue-i18n';
   import {
     useRoute,
@@ -122,20 +123,20 @@
 
   import { ClusterTypes, DBTypes, UserPersonalSettings } from '@common/const';
 
-  import ClusterCapacityUsageRate from '@components/cluster-capacity-usage-rate/Index.vue'
-  import OperationBtnStatusTips from '@components/cluster-common/OperationBtnStatusTips.vue';
-  import RenderNodeInstance from '@components/cluster-common/RenderNodeInstance.vue';
-  import RenderOperationTag from '@components/cluster-common/RenderOperationTag.vue';
-  import RenderClusterStatus from '@components/cluster-common/RenderStatus.vue';
-  import EditEntryConfig from '@components/cluster-entry-config/Index.vue';
+  import RenderClusterStatus from '@components/cluster-status/Index.vue';
   import DbTable from '@components/db-table/index.vue';
-  import DropdownExportExcel from '@components/dropdown-export-excel/index.vue';
   import MoreActionExtend from '@components/more-action-extend/Index.vue';
   import TextOverflowLayout from '@components/text-overflow-layout/Index.vue';
 
+  import ClusterCapacityUsageRate from '@views/db-manage/common/cluster-capacity-usage-rate/Index.vue'
+  import EditEntryConfig from '@views/db-manage/common/cluster-entry-config/Index.vue';
   import ClusterIpCopy from '@views/db-manage/common/cluster-ip-copy/Index.vue';
+  import DropdownExportExcel from '@views/db-manage/common/dropdown-export-excel/index.vue';
+  import OperationBtnStatusTips from '@views/db-manage/common/OperationBtnStatusTips.vue';
   import RenderCellCopy from '@views/db-manage/common/render-cell-copy/Index.vue';
   import RenderHeadCopy from '@views/db-manage/common/render-head-copy/Index.vue';
+  import RenderNodeInstance from '@views/db-manage/common/RenderNodeInstance.vue';
+  import RenderOperationTag from '@views/db-manage/common/RenderOperationTag.vue';
   import ClusterExpansion from '@views/db-manage/pulsar/common/expansion/Index.vue';
   import ClusterShrink from '@views/db-manage/pulsar/common/shrink/Index.vue';
 
@@ -146,11 +147,6 @@
 
   import ManagerPassword from './components/ManagerPassword.vue';
 
-  import type {
-    SearchSelectData,
-    SearchSelectItem,
-  } from '@/types/bkui-vue';
-
   const clusterId = defineModel<number>('clusterId');
 
   const route = useRoute();
@@ -729,7 +725,7 @@
       multiple: true,
       children: searchAttrs.value.time_zone,
     },
-  ] as SearchSelectData);
+  ]);
 
   // 设置用户个人表头信息
   const defaultSettings = {
@@ -757,7 +753,7 @@
     updateTableSettings,
   } = useTableSettings(UserPersonalSettings.PULSAR_TABLE_SETTINGS, defaultSettings);
 
-  const getMenuList = async (item: SearchSelectItem | undefined, keyword: string) => {
+  const getMenuList = async (item: ISearchItem | undefined, keyword: string) => {
     if (item?.id !== 'creator' && keyword) {
       return getMenuListSearch(item, keyword, serachData.value, searchValue.value);
     }
diff --git a/dbm-ui/frontend/src/views/db-manage/redis/apply-ha/Index.vue b/dbm-ui/frontend/src/views/db-manage/redis/apply-ha/Index.vue
index 95cf6756cc..9c47f912a3 100644
--- a/dbm-ui/frontend/src/views/db-manage/redis/apply-ha/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/redis/apply-ha/Index.vue
@@ -215,14 +215,14 @@
 
   import { ClusterTypes, MachineTypes, TicketTypes } from '@common/const';
 
-  import AffinityItem from '@components/apply-items/AffinityItem.vue';
-  import BusinessItems from '@components/apply-items/BusinessItems.vue';
-  import CloudItem from '@components/apply-items/CloudItem.vue';
-  import DeployVersion from '@components/apply-items/DeployVersion.vue';
-  import RegionItem from '@components/apply-items/RegionItem.vue';
-  import SpecSelector from '@components/apply-items/SpecSelector.vue';
   import DbForm from '@components/db-form/index.vue';
 
+  import AffinityItem from '@views/db-manage/common/apply-items/AffinityItem.vue';
+  import BusinessItems from '@views/db-manage/common/apply-items/BusinessItems.vue';
+  import CloudItem from '@views/db-manage/common/apply-items/CloudItem.vue';
+  import DeployVersion from '@views/db-manage/common/apply-items/DeployVersion.vue';
+  import RegionItem from '@views/db-manage/common/apply-items/RegionItem.vue';
+  import SpecSelector from '@views/db-manage/common/apply-items/SpecSelector.vue';
   import PasswordInput from '@views/db-manage/redis/common/password-input/Index.vue';
 
   import DomainTable, { type Domain } from './components/domain-table/Index.vue';
diff --git a/dbm-ui/frontend/src/views/db-manage/redis/apply/ApplyRedis.vue b/dbm-ui/frontend/src/views/db-manage/redis/apply/ApplyRedis.vue
index aac5a267c9..0347812943 100644
--- a/dbm-ui/frontend/src/views/db-manage/redis/apply/ApplyRedis.vue
+++ b/dbm-ui/frontend/src/views/db-manage/redis/apply/ApplyRedis.vue
@@ -375,17 +375,17 @@
   import { ClusterTypes, OSTypes, TicketTypes } from '@common/const';
   import { nameRegx } from '@common/regex';
 
-  import AffinityItem from '@components/apply-items/AffinityItem.vue';
-  import BackendQPSSpec from '@components/apply-items/BackendSpec.vue';
-  import BusinessItems from '@components/apply-items/BusinessItems.vue';
-  import CloudItem from '@components/apply-items/CloudItem.vue';
-  import ClusterAlias from '@components/apply-items/ClusterAlias.vue';
-  import ClusterName from '@components/apply-items/ClusterName.vue';
-  import DeployVersion from '@components/apply-items/DeployVersion.vue';
-  import RegionItem from '@components/apply-items/RegionItem.vue';
-  import SpecSelector from '@components/apply-items/SpecSelector.vue';
   import IpSelector from '@components/ip-selector/IpSelector.vue';
 
+  import AffinityItem from '@views/db-manage/common/apply-items/AffinityItem.vue';
+  import BackendQPSSpec from '@views/db-manage/common/apply-items/BackendSpec.vue';
+  import BusinessItems from '@views/db-manage/common/apply-items/BusinessItems.vue';
+  import CloudItem from '@views/db-manage/common/apply-items/CloudItem.vue';
+  import ClusterAlias from '@views/db-manage/common/apply-items/ClusterAlias.vue';
+  import ClusterName from '@views/db-manage/common/apply-items/ClusterName.vue';
+  import DeployVersion from '@views/db-manage/common/apply-items/DeployVersion.vue';
+  import RegionItem from '@views/db-manage/common/apply-items/RegionItem.vue';
+  import SpecSelector from '@views/db-manage/common/apply-items/SpecSelector.vue';
   import PasswordInput from '@views/db-manage/redis/common/password-input/Index.vue';
 
   import { generateId } from '@utils';
diff --git a/dbm-ui/frontend/src/views/db-manage/redis/capacity-change/pages/page1/components/ClusterDeployPlan.vue b/dbm-ui/frontend/src/views/db-manage/redis/capacity-change/pages/page1/components/ClusterDeployPlan.vue
index 82424bd9e2..57ea78776e 100644
--- a/dbm-ui/frontend/src/views/db-manage/redis/capacity-change/pages/page1/components/ClusterDeployPlan.vue
+++ b/dbm-ui/frontend/src/views/db-manage/redis/capacity-change/pages/page1/components/ClusterDeployPlan.vue
@@ -259,9 +259,9 @@
 
   import { useBeforeClose } from '@hooks';
 
-  import ClusterCapacityUsageRate from '@components/cluster-capacity-usage-rate/Index.vue'
   import RenderSpec from '@components/render-table/columns/spec-display/Index.vue';
 
+  import ClusterCapacityUsageRate from '@views/db-manage/common/cluster-capacity-usage-rate/Index.vue'
   import ValueDiff from '@views/db-manage/common/value-diff/Index.vue'
 
   import { convertStorageUnits, messageError } from '@utils';
diff --git a/dbm-ui/frontend/src/views/db-manage/redis/capacity-change/pages/page1/components/RenderCurrentCapacity.vue b/dbm-ui/frontend/src/views/db-manage/redis/capacity-change/pages/page1/components/RenderCurrentCapacity.vue
index 5d838a3c78..89a9dc1bf6 100644
--- a/dbm-ui/frontend/src/views/db-manage/redis/capacity-change/pages/page1/components/RenderCurrentCapacity.vue
+++ b/dbm-ui/frontend/src/views/db-manage/redis/capacity-change/pages/page1/components/RenderCurrentCapacity.vue
@@ -65,9 +65,10 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import ClusterCapacityUsageRate from '@components/cluster-capacity-usage-rate/Index.vue';
   import RenderSpec from '@components/render-table/columns/spec-display/Index.vue';
 
+  import ClusterCapacityUsageRate from '@views/db-manage/common/cluster-capacity-usage-rate/Index.vue';
+
   import type { IDataRow } from './Row.vue';
 
   interface Props {
diff --git a/dbm-ui/frontend/src/views/db-manage/redis/capacity-change/pages/page1/components/RenderTargetCapacity.vue b/dbm-ui/frontend/src/views/db-manage/redis/capacity-change/pages/page1/components/RenderTargetCapacity.vue
index d9c02fa414..d682a0e127 100644
--- a/dbm-ui/frontend/src/views/db-manage/redis/capacity-change/pages/page1/components/RenderTargetCapacity.vue
+++ b/dbm-ui/frontend/src/views/db-manage/redis/capacity-change/pages/page1/components/RenderTargetCapacity.vue
@@ -107,10 +107,10 @@
   import RedisModel, { RedisClusterTypes } from '@services/model/redis/redis';
   import ClusterSpecModel from '@services/model/resource-spec/cluster-sepc';
 
-  import ClusterCapacityUsageRate from '@components/cluster-capacity-usage-rate/Index.vue';
   import DisableSelect from '@components/render-table/columns/select-disable/index.vue';
   import RenderSpec from '@components/render-table/columns/spec-display/Index.vue';
 
+  import ClusterCapacityUsageRate from '@views/db-manage/common/cluster-capacity-usage-rate/Index.vue';
   import ValueDiff from '@views/db-manage/common/value-diff/Index.vue';
   import { AffinityType } from '@views/db-manage/redis/common/types';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/redis/cluster-shard-update/pages/page1/components/Index.vue b/dbm-ui/frontend/src/views/db-manage/redis/cluster-shard-update/pages/page1/components/Index.vue
index 6ec8327bf9..fe750c490b 100644
--- a/dbm-ui/frontend/src/views/db-manage/redis/cluster-shard-update/pages/page1/components/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/redis/cluster-shard-update/pages/page1/components/Index.vue
@@ -115,10 +115,11 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
+
   import type { IDataRowBatchKey } from './Row.vue';
 
   interface Props {
diff --git a/dbm-ui/frontend/src/views/db-manage/redis/cluster-type-update/pages/page1/components/Index.vue b/dbm-ui/frontend/src/views/db-manage/redis/cluster-type-update/pages/page1/components/Index.vue
index 15fa6e6e65..64797e5cc8 100644
--- a/dbm-ui/frontend/src/views/db-manage/redis/cluster-type-update/pages/page1/components/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/redis/cluster-type-update/pages/page1/components/Index.vue
@@ -127,10 +127,11 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
+
   import type { IDataRowBatchKey } from './Row.vue';
 
   interface Props {
diff --git a/dbm-ui/frontend/src/views/db-manage/redis/common/cluster-oprations/Backup.vue b/dbm-ui/frontend/src/views/db-manage/redis/common/cluster-oprations/Backup.vue
index 96ffde8479..34932dee45 100644
--- a/dbm-ui/frontend/src/views/db-manage/redis/common/cluster-oprations/Backup.vue
+++ b/dbm-ui/frontend/src/views/db-manage/redis/common/cluster-oprations/Backup.vue
@@ -90,8 +90,6 @@
 
   import BatchEdit from './BatchEdit.vue';
 
-  import type { TableColumnRender } from '@/types/bkui-vue';
-
   interface DataItem extends RedisModel {
     target: string,
     backup_type: string
@@ -116,14 +114,11 @@
   const { t } = useI18n();
   const ticketMessage = useTicketMessage();
 
-  const formRef = ref();
+
 
   const globalBizsStore = useGlobalBizs();
   const handleBeforeClose = useBeforeClose();
-  // 判断是否为批量操作
-  const isBatch = computed(() => props.data.length > 1);
-  // 第一个集群的数据
-  const firstData = computed(() => props.data[0]);
+
   const backupList = [{
     id: 'normal_backup',
     label: t('常规备份'),
@@ -157,7 +152,7 @@
   }, {
     label: t('架构版本'),
     field: 'cluster_type_name',
-    render: ({ cell }: TableColumnRender) => <span>{cell || '--'}</span>,
+    render: ({ data }: { data: DataItem }) => data.cluster_type_name || '--',
   }, {
     label: () => (
       <span class="key-table-header">
@@ -229,6 +224,14 @@
       </bk-form-item>
     ),
   }];
+
+  const formRef = ref();
+
+   // 判断是否为批量操作
+   const isBatch = computed(() => props.data.length > 1);
+  // 第一个集群的数据
+  const firstData = computed(() => props.data[0]);
+
   // 实际渲染表头配置
   const rederColumns = computed(() => {
     if (isBatch.value) {
@@ -259,11 +262,10 @@
   });
 
   watch(() => props.data, (data) => {
-    state.formdata = data.map(item => ({
+    state.formdata = data.map(item => Object.assign({}, {
       backup_type: '',
       target: '',
-      ...item,
-    }));
+    }, item))
     state.renderKey = generateId('BACKUP_FORM_');
   }, { immediate: true, deep: true });
 
diff --git a/dbm-ui/frontend/src/views/db-manage/redis/db-data-copy/pages/page1/components/RenderTargetCluster.vue b/dbm-ui/frontend/src/views/db-manage/redis/db-data-copy/pages/page1/components/RenderTargetCluster.vue
index a00d4a59c3..f7763beeb7 100644
--- a/dbm-ui/frontend/src/views/db-manage/redis/db-data-copy/pages/page1/components/RenderTargetCluster.vue
+++ b/dbm-ui/frontend/src/views/db-manage/redis/db-data-copy/pages/page1/components/RenderTargetCluster.vue
@@ -24,12 +24,6 @@
     </div>
   </BkLoading>
 </template>
-<script lang="ts">
-  export interface SelectItem {
-    value: number;
-    label: string;
-  }
-</script>
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
@@ -49,6 +43,11 @@
     (e: 'select-change', value: number): void;
   }
 
+  export interface SelectItem {
+    value: number;
+    label: string;
+  }
+
   const props = withDefaults(defineProps<Props>(), {
     data: undefined,
     selectList: () => [],
diff --git a/dbm-ui/frontend/src/views/db-manage/redis/db-data-copy/pages/page1/components/cross-business/Index.vue b/dbm-ui/frontend/src/views/db-manage/redis/db-data-copy/pages/page1/components/cross-business/Index.vue
index 191e0fb79b..ef5d09ea65 100644
--- a/dbm-ui/frontend/src/views/db-manage/redis/db-data-copy/pages/page1/components/cross-business/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/redis/db-data-copy/pages/page1/components/cross-business/Index.vue
@@ -126,11 +126,11 @@
 
   import { ClusterTypes, LocalStorageKeys, TicketTypes } from '@common/const';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
   import ClusterSelector from '@components/cluster-selector/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
   import type { CrossBusinessInfoItem } from '@views/db-manage/redis/db-data-copy/pages/page1/Index.vue';
 
   import { destroyLocalStorage } from '../../Index.vue';
diff --git a/dbm-ui/frontend/src/views/db-manage/redis/db-data-copy/pages/page1/components/intra-business-third/Index.vue b/dbm-ui/frontend/src/views/db-manage/redis/db-data-copy/pages/page1/components/intra-business-third/Index.vue
index f004a8eef0..99d5ed7243 100644
--- a/dbm-ui/frontend/src/views/db-manage/redis/db-data-copy/pages/page1/components/intra-business-third/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/redis/db-data-copy/pages/page1/components/intra-business-third/Index.vue
@@ -127,11 +127,11 @@
 
   import { ClusterTypes, LocalStorageKeys, TicketTypes } from '@common/const';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
   import ClusterSelector from '@components/cluster-selector/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
   import type { SelectItem } from '@views/db-manage/redis/db-data-copy/pages/page1/components/RenderTargetCluster.vue';
   import type { IntraBusinessToThirdInfoItem } from '@views/db-manage/redis/db-data-copy/pages/page1/Index.vue';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/redis/db-data-copy/pages/page1/components/selfbuilt-clusters-intra-business/Index.vue b/dbm-ui/frontend/src/views/db-manage/redis/db-data-copy/pages/page1/components/selfbuilt-clusters-intra-business/Index.vue
index a7bb57d322..e35ec46af8 100644
--- a/dbm-ui/frontend/src/views/db-manage/redis/db-data-copy/pages/page1/components/selfbuilt-clusters-intra-business/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/redis/db-data-copy/pages/page1/components/selfbuilt-clusters-intra-business/Index.vue
@@ -109,10 +109,10 @@
 
   import { LocalStorageKeys, TicketTypes } from '@common/const';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
   import type { SelectItem } from '@views/db-manage/redis/db-data-copy/pages/page1/components/RenderTargetCluster.vue';
   import type { SelfbuiltClusterToIntraInfoItem } from '@views/db-manage/redis/db-data-copy/pages/page1/Index.vue';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/redis/db-data-copy/pages/page1/components/within-business/Index.vue b/dbm-ui/frontend/src/views/db-manage/redis/db-data-copy/pages/page1/components/within-business/Index.vue
index 6426403332..224bce8a6a 100644
--- a/dbm-ui/frontend/src/views/db-manage/redis/db-data-copy/pages/page1/components/within-business/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/redis/db-data-copy/pages/page1/components/within-business/Index.vue
@@ -122,11 +122,11 @@
 
   import { ClusterTypes, LocalStorageKeys, TicketTypes } from '@common/const';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
   import ClusterSelector from '@components/cluster-selector/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
   import type { SelectItem } from '@views/db-manage/redis/db-data-copy/pages/page1/components/RenderTargetCluster.vue';
   import type { InfoItem } from '@views/db-manage/redis/db-data-copy/pages/page1/Index.vue';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/redis/db-replace/pages/page1/components/instance-selector/components/RenderManualHost.vue b/dbm-ui/frontend/src/views/db-manage/redis/db-replace/pages/page1/components/instance-selector/components/RenderManualHost.vue
index c00575d473..99c65acca5 100644
--- a/dbm-ui/frontend/src/views/db-manage/redis/db-replace/pages/page1/components/instance-selector/components/RenderManualHost.vue
+++ b/dbm-ui/frontend/src/views/db-manage/redis/db-replace/pages/page1/components/instance-selector/components/RenderManualHost.vue
@@ -30,6 +30,7 @@
 </template>
 
 <script setup lang="tsx">
+  import type { Table } from 'bkui-vue';
   import { useI18n } from 'vue-i18n';
 
   import DbStatus from '@components/db-status/index.vue';
@@ -39,7 +40,6 @@
   import  type { InstanceItem } from './RenderManualInput.vue';
   import type { ChoosedItem } from './RenderRedisHost.vue';
 
-  import type { TableProps } from '@/types/bkui-vue';
 
   interface TableItem {
     data: InstanceItem
@@ -49,7 +49,7 @@
     role?: string;
     lastValues: InstanceSelectorValues;
     tableData: InstanceItem[];
-    tableSettings: TableProps['settings'];
+    tableSettings: InstanceType<typeof Table>['$props']['settings'];
   }
 
   interface Emits {
diff --git a/dbm-ui/frontend/src/views/db-manage/redis/db-replace/pages/page1/components/instance-selector/components/RenderManualInput.vue b/dbm-ui/frontend/src/views/db-manage/redis/db-replace/pages/page1/components/instance-selector/components/RenderManualInput.vue
index 76282bb71f..bf8be0822f 100644
--- a/dbm-ui/frontend/src/views/db-manage/redis/db-replace/pages/page1/components/instance-selector/components/RenderManualInput.vue
+++ b/dbm-ui/frontend/src/views/db-manage/redis/db-replace/pages/page1/components/instance-selector/components/RenderManualInput.vue
@@ -90,6 +90,7 @@
   </div>
 </template>
 <script setup lang="ts">
+  import type { Table } from 'bkui-vue';
   import { useI18n } from 'vue-i18n';
 
   import RedisClusterNodeByIpModel from '@services/model/redis/redis-cluster-node-by-ip';
@@ -105,8 +106,6 @@
   import type { PanelTypes } from './PanelTab.vue';
   import RenderManualHost from './RenderManualHost.vue';
 
-  import type { TableProps } from '@/types/bkui-vue';
-
   export interface InstanceItem extends Omit<InstanceInfos, 'spec_config'> {
     spec_config: RedisClusterNodeByIpModel['spec_config'];
   }
@@ -114,7 +113,7 @@
   interface Props {
     validTab: Exclude<PanelTypes, 'manualInput'>;
     lastValues: InstanceSelectorValues;
-    tableSettings: TableProps['settings'];
+    tableSettings: InstanceType<typeof Table>['$props']['settings'];
     role?: string;
   }
 
diff --git a/dbm-ui/frontend/src/views/db-manage/redis/db-replace/pages/page1/components/instance-selector/components/RenderRedis.vue b/dbm-ui/frontend/src/views/db-manage/redis/db-replace/pages/page1/components/instance-selector/components/RenderRedis.vue
index 31097a2cb3..71954814d9 100644
--- a/dbm-ui/frontend/src/views/db-manage/redis/db-replace/pages/page1/components/instance-selector/components/RenderRedis.vue
+++ b/dbm-ui/frontend/src/views/db-manage/redis/db-replace/pages/page1/components/instance-selector/components/RenderRedis.vue
@@ -73,6 +73,8 @@
   </BkLoading>
 </template>
 <script setup lang="ts">
+  import type { Table } from 'bkui-vue';
+
   import RedisModel from '@services/model/redis/redis';
   import { getRedisList } from '@services/source/redis';
 
@@ -81,15 +83,13 @@
   import type { PanelTypes } from './PanelTab.vue';
   import RenderRedisHost from './RenderRedisHost.vue';
 
-  import type { TableProps } from '@/types/bkui-vue';
-
   interface Emits {
     (e: 'change', value: InstanceSelectorValues): void;
   }
 
   interface Props {
     lastValues: InstanceSelectorValues;
-    tableSettings: TableProps['settings'];
+    tableSettings: InstanceType<typeof Table>['$props']['settings'];
     role?: string;
     activeTab?: PanelTypes;
     isRadioMode?: boolean;
diff --git a/dbm-ui/frontend/src/views/db-manage/redis/db-replace/pages/page1/components/instance-selector/components/RenderRedisHost.vue b/dbm-ui/frontend/src/views/db-manage/redis/db-replace/pages/page1/components/instance-selector/components/RenderRedisHost.vue
index 0f07cf893d..0ec41e575e 100644
--- a/dbm-ui/frontend/src/views/db-manage/redis/db-replace/pages/page1/components/instance-selector/components/RenderRedisHost.vue
+++ b/dbm-ui/frontend/src/views/db-manage/redis/db-replace/pages/page1/components/instance-selector/components/RenderRedisHost.vue
@@ -43,6 +43,7 @@
   </div>
 </template>
 <script setup lang="tsx">
+  import type { Table } from 'bkui-vue';
   import { useI18n } from 'vue-i18n';
 
   import { getRedisMachineList } from '@services/source/redis';
@@ -64,8 +65,6 @@
 
   import { activePanelInjectionKey } from './PanelTab.vue';
 
-  import type { TableProps } from '@/types/bkui-vue';
-
   type RedisHostModel = ServiceReturnType<typeof getRedisMachineList>['results'][number] & {
     isShowTip?: boolean;
   };
@@ -75,7 +74,7 @@
   }
 
   export interface Props {
-    tableSettings: TableProps['settings'],
+    tableSettings: InstanceType<typeof Table>['$props'],
     lastValues: InstanceSelectorValues,
     node?: {
       id: number,
diff --git a/dbm-ui/frontend/src/views/db-manage/redis/db-structure/pages/page1/components/Index.vue b/dbm-ui/frontend/src/views/db-manage/redis/db-structure/pages/page1/components/Index.vue
index 5983e58ed5..8023773ee1 100644
--- a/dbm-ui/frontend/src/views/db-manage/redis/db-structure/pages/page1/components/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/redis/db-structure/pages/page1/components/Index.vue
@@ -109,10 +109,11 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
+
   import type { IDataRowBatchKey } from './Row.vue';
 
   interface Emits {
diff --git a/dbm-ui/frontend/src/views/db-manage/redis/instance-list-ha/components/detail/components/Config.vue b/dbm-ui/frontend/src/views/db-manage/redis/instance-list-ha/components/detail/components/Config.vue
index 7bd1968fab..cf48cd2b52 100644
--- a/dbm-ui/frontend/src/views/db-manage/redis/instance-list-ha/components/detail/components/Config.vue
+++ b/dbm-ui/frontend/src/views/db-manage/redis/instance-list-ha/components/detail/components/Config.vue
@@ -32,15 +32,15 @@
 
   import { ClusterTypes } from '@common/const';
 
-  import type { TableColumnRender } from '@/types/bkui-vue';
-
   interface Props {
     queryInfos: {
-      version: string,
-      clusterId: number
-    }
+      version: string;
+      clusterId: number;
+    };
   }
 
+  type IRowData = ServiceReturnType<typeof getLevelConfig>['conf_items'][number];
+
   const props = defineProps<Props>();
 
   const { currentBizId } = useGlobalBizs();
@@ -57,35 +57,33 @@
     {
       label: t('参数项'),
       field: 'conf_name',
-      render: ({ cell }: TableColumnRender) => <div class="text-overflow" v-overflow-tips>{cell}</div>,
+      render: ({ data }: { data: IRowData }) => data.conf_name,
     },
     {
       label: t('参数值'),
       field: 'conf_value',
-      render: ({ cell }: TableColumnRender) => <div class="text-overflow" v-overflow-tips>{cell}</div>,
+      render: ({ data }: { data: IRowData }) => data.conf_value,
     },
     {
       label: t('描述'),
       field: 'description',
-      render: ({ cell }: TableColumnRender) => <div class="text-overflow" v-overflow-tips>{cell || '--'}</div>,
+      render: ({ data }: { data: IRowData }) => data.description || '--',
     },
-    // {
-    //   label: t('重启实例生效'),
-    //   field: 'need_restart',
-    //   width: 200,
-    //   render: ({ cell }: {cell: number}) => (cell === 1 ? t('是') : t('否')),
-    // }
   ];
 
-  watch(() => props.queryInfos, (infos) => {
-    const { version, clusterId } = infos;
-    if (version && clusterId) {
-      fetchClusterConfig();
-    }
-  }, {
-    immediate: true,
-    deep: true,
-  });
+  watch(
+    () => props.queryInfos,
+    (infos) => {
+      const { version, clusterId } = infos;
+      if (version && clusterId) {
+        fetchClusterConfig();
+      }
+    },
+    {
+      immediate: true,
+      deep: true,
+    },
+  );
 
   /**
    * 获取集群配置
@@ -99,9 +97,6 @@
       level_name: 'cluster',
       conf_type: 'dbconf',
       version: props.queryInfos.version,
-      // level_info: {
-      //   module: String(props.queryInfos.dbModuleId),
-      // },
     })
       .then((res) => {
         data.value = res;
@@ -109,7 +104,7 @@
       .finally(() => {
         isLoading.value = false;
       });
-  }
+  };
 </script>
 
 <style lang="less" scoped>
diff --git a/dbm-ui/frontend/src/views/db-manage/redis/instance-list/components/detail/components/Config.vue b/dbm-ui/frontend/src/views/db-manage/redis/instance-list/components/detail/components/Config.vue
index db4f4292ed..ab5ee5f7e3 100644
--- a/dbm-ui/frontend/src/views/db-manage/redis/instance-list/components/detail/components/Config.vue
+++ b/dbm-ui/frontend/src/views/db-manage/redis/instance-list/components/detail/components/Config.vue
@@ -30,8 +30,6 @@
   import { getLevelConfig } from '@services/source/configs';
   import { retrieveRedisInstance } from '@services/source/redis';
 
-  import type { TableColumnRender } from '@/types/bkui-vue';
-
   interface Props {
     instanceData: ServiceReturnType<typeof retrieveRedisInstance>;
   }
@@ -52,7 +50,7 @@
     {
       label: t('描述'),
       field: 'description',
-      render: ({ cell }: TableColumnRender) => cell || '--',
+      render: ({ cell }: { cell: string }) => cell || '--',
     },
   ];
 
diff --git a/dbm-ui/frontend/src/views/db-manage/redis/list-ha/components/detail/Index.vue b/dbm-ui/frontend/src/views/db-manage/redis/list-ha/components/detail/Index.vue
index 572a80dcd5..2ffbf79de8 100644
--- a/dbm-ui/frontend/src/views/db-manage/redis/list-ha/components/detail/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/redis/list-ha/components/detail/Index.vue
@@ -67,9 +67,9 @@
 
   import { DBTypes } from '@common/const';
 
-  import ClusterTopo from '@components/cluster-details/ClusterTopo.vue';
-  import ClusterEventChange from '@components/cluster-event-change/EventChange.vue';
-  import MonitorDashboard from '@components/cluster-monitor/MonitorDashboard.vue';
+  import ClusterTopo from '@views/db-manage/common/cluster-details/ClusterTopo.vue';
+  import ClusterEventChange from '@views/db-manage/common/cluster-event-change/EventChange.vue';
+  import MonitorDashboard from '@views/db-manage/common/cluster-monitor/MonitorDashboard.vue';
 
   import { checkDbConsole } from '@utils';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/redis/list-ha/components/list/Index.vue b/dbm-ui/frontend/src/views/db-manage/redis/list-ha/components/list/Index.vue
index 1fde09326e..6972f94376 100644
--- a/dbm-ui/frontend/src/views/db-manage/redis/list-ha/components/list/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/redis/list-ha/components/list/Index.vue
@@ -161,20 +161,20 @@
     UserPersonalSettings
   } from '@common/const';
 
-  import ClusterCapacityUsageRate from '@components/cluster-capacity-usage-rate/Index.vue'
-  import OperationBtnStatusTips from '@components/cluster-common/OperationBtnStatusTips.vue';
-  import RenderOperationTag from '@components/cluster-common/RenderOperationTag.vue';
-  import EditEntryConfig from '@components/cluster-entry-config/Index.vue';
   import DbStatus from '@components/db-status/index.vue';
   import DbTable from '@components/db-table/index.vue';
-  import DropdownExportExcel from '@components/dropdown-export-excel/index.vue';
   import MoreActionExtend from '@components/more-action-extend/Index.vue';
-  import RenderInstances from '@components/render-instances/RenderInstances.vue';
   import TextOverflowLayout from '@components/text-overflow-layout/Index.vue';
 
+  import ClusterCapacityUsageRate from '@views/db-manage/common/cluster-capacity-usage-rate/Index.vue'
+  import EditEntryConfig from '@views/db-manage/common/cluster-entry-config/Index.vue';
   import ClusterIpCopy from '@views/db-manage/common/cluster-ip-copy/Index.vue';
+  import DropdownExportExcel from '@views/db-manage/common/dropdown-export-excel/index.vue';
+  import OperationBtnStatusTips from '@views/db-manage/common/OperationBtnStatusTips.vue';
   import RenderCellCopy from '@views/db-manage/common/render-cell-copy/Index.vue';
   import RenderHeadCopy from '@views/db-manage/common/render-head-copy/Index.vue';
+  import RenderInstances from '@views/db-manage/common/render-instances/RenderInstances.vue';
+  import RenderOperationTag from '@views/db-manage/common/RenderOperationTag.vue';
   import RedisBackup from '@views/db-manage/redis/common/cluster-oprations/Backup.vue';
   import ClusterPassword from '@views/db-manage/redis/common/cluster-oprations/ClusterPassword.vue';
   import DeleteKeys from '@views/db-manage/redis/common/cluster-oprations/DeleteKeys.vue';
diff --git a/dbm-ui/frontend/src/views/db-manage/redis/list/components/detail/Index.vue b/dbm-ui/frontend/src/views/db-manage/redis/list/components/detail/Index.vue
index 5cdae952af..6540020379 100644
--- a/dbm-ui/frontend/src/views/db-manage/redis/list/components/detail/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/redis/list/components/detail/Index.vue
@@ -67,9 +67,9 @@
 
   import { DBTypes } from '@common/const';
 
-  import ClusterTopo from '@components/cluster-details/ClusterTopo.vue';
-  import ClusterEventChange from '@components/cluster-event-change/EventChange.vue';
-  import MonitorDashboard from '@components/cluster-monitor/MonitorDashboard.vue';
+  import ClusterTopo from '@views/db-manage/common/cluster-details/ClusterTopo.vue';
+  import ClusterEventChange from '@views/db-manage/common/cluster-event-change/EventChange.vue';
+  import MonitorDashboard from '@views/db-manage/common/cluster-monitor/MonitorDashboard.vue';
 
   import { checkDbConsole } from '@utils';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/redis/list/components/list/Index.vue b/dbm-ui/frontend/src/views/db-manage/redis/list/components/list/Index.vue
index 2ffcc83e9b..c9944ecbc3 100644
--- a/dbm-ui/frontend/src/views/db-manage/redis/list/components/list/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/redis/list/components/list/Index.vue
@@ -166,6 +166,7 @@
 </template>
 <script setup lang="tsx">
     import { InfoBox, Message } from 'bkui-vue';
+    import type { ISearchItem } from 'bkui-vue/lib/search-select/utils';
     import _ from 'lodash';
     import { useI18n } from 'vue-i18n';
     import {
@@ -201,21 +202,21 @@
       UserPersonalSettings,
     } from '@common/const';
 
-    import ClusterCapacityUsageRate from '@components/cluster-capacity-usage-rate/Index.vue'
-    import OperationBtnStatusTips from '@components/cluster-common/OperationBtnStatusTips.vue';
-    import RenderOperationTag from '@components/cluster-common/RenderOperationTag.vue';
-    import EditEntryConfig from '@components/cluster-entry-config/Index.vue';
     import DbStatus from '@components/db-status/index.vue';
     import DbTable from '@components/db-table/index.vue';
-    import DropdownExportExcel from '@components/dropdown-export-excel/index.vue';
     import MiniTag from '@components/mini-tag/index.vue';
     import MoreActionExtend from '@components/more-action-extend/Index.vue';
-    import RenderInstances from '@components/render-instances/RenderInstances.vue';
     import TextOverflowLayout from '@components/text-overflow-layout/Index.vue';
 
+    import ClusterCapacityUsageRate from '@views/db-manage/common/cluster-capacity-usage-rate/Index.vue'
+    import EditEntryConfig from '@views/db-manage/common/cluster-entry-config/Index.vue';
     import ClusterIpCopy from '@views/db-manage/common/cluster-ip-copy/Index.vue';
+    import DropdownExportExcel from '@views/db-manage/common/dropdown-export-excel/index.vue';
+    import OperationBtnStatusTips from '@views/db-manage/common/OperationBtnStatusTips.vue';
     import RenderCellCopy from '@views/db-manage/common/render-cell-copy/Index.vue';
     import RenderHeadCopy from '@views/db-manage/common/render-head-copy/Index.vue';
+    import RenderInstances from '@views/db-manage/common/render-instances/RenderInstances.vue';
+    import RenderOperationTag from '@views/db-manage/common/RenderOperationTag.vue';
     import RedisBackup from '@views/db-manage/redis/common/cluster-oprations/Backup.vue';
     import ClusterPassword from '@views/db-manage/redis/common/cluster-oprations/ClusterPassword.vue';
     import DeleteKeys from '@views/db-manage/redis/common/cluster-oprations/DeleteKeys.vue';
@@ -230,12 +231,6 @@
 
     import EntryPanel from './components/EntryPanel.vue';
 
-    import type {
-      SearchSelectData,
-      SearchSelectItem,
-      TableColumnRender,
-    } from '@/types/bkui-vue';
-
     type ColumnRenderData = { data: RedisModel }
 
     enum ClusterNodeKeys {
@@ -436,7 +431,7 @@
         multiple: true,
         children: searchAttrs.value.time_zone,
       },
-    ] as SearchSelectData);
+    ]);
 
     const paginationExtra = computed(() => {
       if (isStretchLayoutOpen.value) {
@@ -1127,7 +1122,7 @@
       updateTableSettings,
     } = useTableSettings(UserPersonalSettings.REDIS_TABLE_SETTINGS, defaultSettings);
 
-    const getMenuList = async (item: SearchSelectItem | undefined, keyword: string) => {
+    const getMenuList = async (item: ISearchItem | undefined, keyword: string) => {
       if (item?.id !== 'creator' && keyword) {
         return getMenuListSearch(item, keyword, searchSelectData.value, searchValue.value);
       }
@@ -1250,8 +1245,9 @@
       });
     };
 
-    const handleSelection = (data: RedisModel, list: RedisModel[]) => {
+    const handleSelection = (idList: number[], list: RedisModel[]) => {
       selected.value = list;
+      console.log('list = ', list)
     };
 
   /**
diff --git a/dbm-ui/frontend/src/views/db-manage/redis/master-failover/pages/page1/components/Index.vue b/dbm-ui/frontend/src/views/db-manage/redis/master-failover/pages/page1/components/Index.vue
index f4d5a4940b..edc46eff8d 100644
--- a/dbm-ui/frontend/src/views/db-manage/redis/master-failover/pages/page1/components/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/redis/master-failover/pages/page1/components/Index.vue
@@ -85,10 +85,11 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
+
   import { OnlineSwitchType } from './RenderSwitchMode.vue';
 
   interface Emits {
diff --git a/dbm-ui/frontend/src/views/db-manage/redis/proxy-scale-down/pages/page1/components/Index.vue b/dbm-ui/frontend/src/views/db-manage/redis/proxy-scale-down/pages/page1/components/Index.vue
index 58e01f4770..6175d7b17d 100644
--- a/dbm-ui/frontend/src/views/db-manage/redis/proxy-scale-down/pages/page1/components/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/redis/proxy-scale-down/pages/page1/components/Index.vue
@@ -95,10 +95,11 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
+
   import { OnlineSwitchType } from './RenderSwitchMode.vue';
 
   interface Emits {
diff --git a/dbm-ui/frontend/src/views/db-manage/redis/version-upgrade/pages/page1/components/Index.vue b/dbm-ui/frontend/src/views/db-manage/redis/version-upgrade/pages/page1/components/Index.vue
index b83d82626f..8d536700f4 100644
--- a/dbm-ui/frontend/src/views/db-manage/redis/version-upgrade/pages/page1/components/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/redis/version-upgrade/pages/page1/components/Index.vue
@@ -102,10 +102,12 @@
 
   import { getClusterVersions } from '@services/source/redisToolbox';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  // import { getClusterVersions } from '@services/source/redisToolbox';
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
+
   import type { IDataRow, IDataRowBatchKey } from './Row.vue';
 
   interface Props {
diff --git a/dbm-ui/frontend/src/views/db-manage/redis/webconsole/Index.vue b/dbm-ui/frontend/src/views/db-manage/redis/webconsole/Index.vue
index df2aef1681..5750f3cb28 100644
--- a/dbm-ui/frontend/src/views/db-manage/redis/webconsole/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/redis/webconsole/Index.vue
@@ -4,5 +4,5 @@
 <script setup lang="ts">
   import { DBTypes } from '@common/const';
 
-  import WebConsole from '@components/webconsole/Index.vue';
+  import WebConsole from '@views/db-manage/common/webconsole/Index.vue';
 </script>
diff --git a/dbm-ui/frontend/src/views/db-manage/riak/apply/Index.vue b/dbm-ui/frontend/src/views/db-manage/riak/apply/Index.vue
index 55fb356c2c..4a44349177 100644
--- a/dbm-ui/frontend/src/views/db-manage/riak/apply/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/riak/apply/Index.vue
@@ -220,14 +220,15 @@
 
   import { ClusterTypes, OSTypes, TicketTypes } from '@common/const';
 
-  import BusinessItems from '@components/apply-items/BusinessItems.vue';
-  import CloudItem from '@components/apply-items/CloudItem.vue';
-  import ClusterAlias from '@components/apply-items/ClusterAlias.vue';
-  import ClusterName from '@components/apply-items/ClusterName.vue';
-  import RegionItem from '@components/apply-items/RegionItem.vue';
-  import SpecSelector from '@components/apply-items/SpecSelector.vue';
   import IpSelector from '@components/ip-selector/IpSelector.vue';
 
+  import BusinessItems from '@views/db-manage/common/apply-items/BusinessItems.vue';
+  import CloudItem from '@views/db-manage/common/apply-items/CloudItem.vue';
+  import ClusterAlias from '@views/db-manage/common/apply-items/ClusterAlias.vue';
+  import ClusterName from '@views/db-manage/common/apply-items/ClusterName.vue';
+  import RegionItem from '@views/db-manage/common/apply-items/RegionItem.vue';
+  import SpecSelector from '@views/db-manage/common/apply-items/SpecSelector.vue';
+
   // 目前固定为此版本
   const dbVersionList = [2.2];
 
diff --git a/dbm-ui/frontend/src/views/db-manage/riak/list/Index.vue b/dbm-ui/frontend/src/views/db-manage/riak/list/Index.vue
index a322faedb3..d76f93d1e7 100644
--- a/dbm-ui/frontend/src/views/db-manage/riak/list/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/riak/list/Index.vue
@@ -106,7 +106,7 @@
 
   import { TicketTypes } from '@common/const';
 
-  import RenderClusterStatus from '@components/cluster-common/RenderStatus.vue';
+  import RenderClusterStatus from '@components/cluster-status/Index.vue';
   import StretchLayout from '@components/stretch-layout/StretchLayout.vue';
 
   import AddNodes from './components/components/AddNodes.vue';
diff --git a/dbm-ui/frontend/src/views/db-manage/riak/list/components/components/AddNodes.vue b/dbm-ui/frontend/src/views/db-manage/riak/list/components/components/AddNodes.vue
index 290ee1b1b4..eb97fc8ac5 100644
--- a/dbm-ui/frontend/src/views/db-manage/riak/list/components/components/AddNodes.vue
+++ b/dbm-ui/frontend/src/views/db-manage/riak/list/components/components/AddNodes.vue
@@ -115,9 +115,10 @@
 
   import { ClusterTypes, OSTypes, TicketTypes } from '@common/const';
 
-  import SpecSelector from '@components/apply-items/SpecSelector.vue';
   import IpSelector from '@components/ip-selector/IpSelector.vue';
 
+  import SpecSelector from '@views/db-manage/common/apply-items/SpecSelector.vue';
+
   import NodeNumber from './components/NodeNumber.vue';
 
   interface Props {
diff --git a/dbm-ui/frontend/src/views/db-manage/riak/list/components/detail/Index.vue b/dbm-ui/frontend/src/views/db-manage/riak/list/components/detail/Index.vue
index 8bf8c56385..91a355bd1f 100644
--- a/dbm-ui/frontend/src/views/db-manage/riak/list/components/detail/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/riak/list/components/detail/Index.vue
@@ -90,10 +90,11 @@
 
   import { ClusterTypes, DBTypes } from '@common/const';
 
-  import ClusterTopo from '@components/cluster-details/ClusterTopo.vue';
-  import MonitorDashboard from '@components/cluster-monitor/MonitorDashboard.vue';
   import DbStatus from '@components/db-status/index.vue';
 
+  import ClusterTopo from '@views/db-manage/common/cluster-details/ClusterTopo.vue';
+  import MonitorDashboard from '@views/db-manage/common/cluster-monitor/MonitorDashboard.vue';
+
   import BaseInfo from './components/BaseInfo.vue';
   import ClusterEventChange from './components/EventChange.vue';
   import NodeList from './components/NodeList.vue';
diff --git a/dbm-ui/frontend/src/views/db-manage/riak/list/components/detail/components/EventChange.vue b/dbm-ui/frontend/src/views/db-manage/riak/list/components/detail/components/EventChange.vue
index a7d7bd451e..630739527b 100644
--- a/dbm-ui/frontend/src/views/db-manage/riak/list/components/detail/components/EventChange.vue
+++ b/dbm-ui/frontend/src/views/db-manage/riak/list/components/detail/components/EventChange.vue
@@ -40,13 +40,13 @@
   import { useI18n } from 'vue-i18n';
 
   import { getClusterOperateRecords } from '@services/source/ticket';
-  import type { ClusterOperateRecord } from '@services/types/ticket';
 
   import DbStatus from '@components/db-status/index.vue';
 
   interface Props {
     id: number,
   }
+  type IRowData = ServiceReturnType<typeof getClusterOperateRecords>['results'][number]
 
   const props = defineProps<Props>();
   const loadingCount = defineModel<number>('loadingCount', {
@@ -76,26 +76,10 @@
       label: t('操作类型'),
       field: 'op_type',
     },
-    // {
-    //   label: t('操作对象'),
-    //   field: 'op_type',
-    //   showOverflowTooltip: false,
-    //   render: ({ data }: { data: ClusterOperateRecord }) => (
-    //     <>
-    //       <RenderRow data={data.ips} />
-    //       <bk-button
-    //         text
-    //         theme="primary"
-    //         onclick={ () => handleCopy(data.ips) }>
-    //         <db-icon type="copy" />
-    //       </bk-button>
-    //     </>
-    //   ),
-    // },
     {
       label: t('操作结果'),
       field: 'op_status',
-      render: ({ data }: { data: ClusterOperateRecord }) => {
+      render: ({ data }: { data: IRowData }) => {
         const status = statusInfoMap[data.op_status] || errorStatus;
         return (
           <DbStatus
@@ -158,7 +142,7 @@
     immediate: true,
   });
 
-  const handleRequestSuccess = ({ results } : { results: ClusterOperateRecord[] }) => {
+  const handleRequestSuccess = ({ results } : { results: IRowData[] }) => {
     loadingCount.value = results.filter(resultItem => ['PENDING', 'RUNNING'].includes(resultItem.op_status)).length;
   };
 
diff --git a/dbm-ui/frontend/src/views/db-manage/riak/list/components/detail/components/NodeList.vue b/dbm-ui/frontend/src/views/db-manage/riak/list/components/detail/components/NodeList.vue
index 617d70c020..001663a5f5 100644
--- a/dbm-ui/frontend/src/views/db-manage/riak/list/components/detail/components/NodeList.vue
+++ b/dbm-ui/frontend/src/views/db-manage/riak/list/components/detail/components/NodeList.vue
@@ -143,12 +143,13 @@
 
   import { TicketTypes } from '@common/const';
 
-  import OperationBtnStatusTips from '@components/cluster-common/OperationBtnStatusTips.vue';
   import DbTable from '@components/db-table/index.vue';
   import MiniTag from '@components/mini-tag/index.vue';
   import RenderHostStatus from '@components/render-host-status/Index.vue';
   import RenderTextEllipsisOneLine from '@components/text-ellipsis-one-line/index.vue';
 
+  import OperationBtnStatusTips from '@views/db-manage/common/OperationBtnStatusTips.vue';
+
   import { messageWarn } from '@utils';
 
   import { useTimeoutPoll } from '@vueuse/core';
diff --git a/dbm-ui/frontend/src/views/db-manage/riak/list/components/list/Index.vue b/dbm-ui/frontend/src/views/db-manage/riak/list/components/list/Index.vue
index e6918c60dc..6f3e1b9f08 100644
--- a/dbm-ui/frontend/src/views/db-manage/riak/list/components/list/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/riak/list/components/list/Index.vue
@@ -101,18 +101,18 @@
 
   import { ClusterTypes, TicketTypes, UserPersonalSettings } from '@common/const';
 
-  import ClusterCapacityUsageRate from '@components/cluster-capacity-usage-rate/Index.vue'
-  import OperationBtnStatusTips from '@components/cluster-common/OperationBtnStatusTips.vue';
-  import RenderNodeInstance from '@components/cluster-common/RenderNodeInstance.vue';
-  import RenderOperationTag from '@components/cluster-common/RenderOperationTag.vue';
-  import RenderClusterStatus from '@components/cluster-common/RenderStatus.vue';
+  import RenderClusterStatus from '@components/cluster-status/Index.vue';
   import DbTable from '@components/db-table/index.vue';
-  import DropdownExportExcel from '@components/dropdown-export-excel/index.vue';
   import MiniTag from '@components/mini-tag/index.vue';
   import TextOverflowLayout from '@components/text-overflow-layout/Index.vue';
 
+  import ClusterCapacityUsageRate from '@views/db-manage/common/cluster-capacity-usage-rate/Index.vue'
   import ClusterIpCopy from '@views/db-manage/common/cluster-ip-copy/Index.vue';
+  import DropdownExportExcel from '@views/db-manage/common/dropdown-export-excel/index.vue';
+  import OperationBtnStatusTips from '@views/db-manage/common/OperationBtnStatusTips.vue';
   import RenderHeadCopy from '@views/db-manage/common/render-head-copy/Index.vue';
+  import RenderNodeInstance from '@views/db-manage/common/RenderNodeInstance.vue';
+  import RenderOperationTag from '@views/db-manage/common/RenderOperationTag.vue';
 
   import {
     getMenuListSearch,
diff --git a/dbm-ui/frontend/src/views/db-manage/sqlserver/apply/SqlServer.vue b/dbm-ui/frontend/src/views/db-manage/sqlserver/apply/SqlServer.vue
index 42f166dfa7..8d7733a9ca 100644
--- a/dbm-ui/frontend/src/views/db-manage/sqlserver/apply/SqlServer.vue
+++ b/dbm-ui/frontend/src/views/db-manage/sqlserver/apply/SqlServer.vue
@@ -306,13 +306,14 @@
 
   import { sqlServerType, type SqlServerTypeString, TicketTypes } from '@common/const';
 
-  import AffinityItem from '@components/apply-items/AffinityItem.vue';
-  import BusinessItems from '@components/apply-items/BusinessItems.vue';
-  import CloudItem from '@components/apply-items/CloudItem.vue';
-  import RegionItem from '@components/apply-items/RegionItem.vue';
-  import SpecSelector from '@components/apply-items/SpecSelector.vue';
   import IpSelector from '@components/ip-selector/IpSelector.vue';
 
+  import AffinityItem from '@views/db-manage/common/apply-items/AffinityItem.vue';
+  import BusinessItems from '@views/db-manage/common/apply-items/BusinessItems.vue';
+  import CloudItem from '@views/db-manage/common/apply-items/CloudItem.vue';
+  import RegionItem from '@views/db-manage/common/apply-items/RegionItem.vue';
+  import SpecSelector from '@views/db-manage/common/apply-items/SpecSelector.vue';
+
   import DomainTable from './components/DomainTable.vue';
   import PreviewTable from './components/PreviewTable.vue';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/sqlserver/apply/components/PreviewTable.vue b/dbm-ui/frontend/src/views/db-manage/sqlserver/apply/components/PreviewTable.vue
index 12e702640b..648643612a 100644
--- a/dbm-ui/frontend/src/views/db-manage/sqlserver/apply/components/PreviewTable.vue
+++ b/dbm-ui/frontend/src/views/db-manage/sqlserver/apply/components/PreviewTable.vue
@@ -9,9 +9,10 @@
 </template>
 
 <script setup lang="tsx">
+  import type { Table } from 'bkui-vue';
   import { useI18n } from 'vue-i18n';
 
-  import type { TableProps } from '@/types/bkui-vue';
+  type TableProps = InstanceType<typeof Table>['$props']
 
   interface Props {
     data: {
diff --git a/dbm-ui/frontend/src/views/db-manage/sqlserver/ha-cluster-list/components/List.vue b/dbm-ui/frontend/src/views/db-manage/sqlserver/ha-cluster-list/components/List.vue
index 27d5271bb1..fc5e82a171 100644
--- a/dbm-ui/frontend/src/views/db-manage/sqlserver/ha-cluster-list/components/List.vue
+++ b/dbm-ui/frontend/src/views/db-manage/sqlserver/ha-cluster-list/components/List.vue
@@ -80,6 +80,7 @@
 </template>
 <script setup lang="tsx">
   import { InfoBox, Message } from 'bkui-vue';
+  import type { ISearchItem } from 'bkui-vue/lib/search-select/utils';
   import { useI18n } from 'vue-i18n';
   import { useRequest } from 'vue-request';
   import {
@@ -115,21 +116,21 @@
     UserPersonalSettings,
   } from '@common/const';
 
-  import ClusterAuthorize from '@components/cluster-authorize/ClusterAuthorize.vue';
-  import ClusterCapacityUsageRate from '@components/cluster-capacity-usage-rate/Index.vue'
-  import ExcelAuthorize from '@components/cluster-common/ExcelAuthorize.vue';
-  import OperationBtnStatusTips from '@components/cluster-common/OperationBtnStatusTips.vue';
-  import RenderOperationTag from '@components/cluster-common/RenderOperationTag.vue';
-  import RenderClusterStatus from '@components/cluster-common/RenderStatus.vue';
-  import EditEntryConfig, { type RowData } from '@components/cluster-entry-config/Index.vue';
+  import RenderClusterStatus from '@components/cluster-status/Index.vue';
   import DbTable from '@components/db-table/index.vue';
-  import DropdownExportExcel from '@components/dropdown-export-excel/index.vue';
-  import RenderInstances from '@components/render-instances/RenderInstances.vue';
   import TextOverflowLayout from '@components/text-overflow-layout/Index.vue';
 
+  import ClusterAuthorize from '@views/db-manage/common/cluster-authorize/ClusterAuthorize.vue';
+  import ClusterCapacityUsageRate from '@views/db-manage/common/cluster-capacity-usage-rate/Index.vue'
+  import EditEntryConfig, { type RowData } from '@views/db-manage/common/cluster-entry-config/Index.vue';
   import ClusterIpCopy from '@views/db-manage/common/cluster-ip-copy/Index.vue';
+  import DropdownExportExcel from '@views/db-manage/common/dropdown-export-excel/index.vue';
+  import ExcelAuthorize from '@views/db-manage/common/ExcelAuthorize.vue';
+  import OperationBtnStatusTips from '@views/db-manage/common/OperationBtnStatusTips.vue';
   import RenderCellCopy from '@views/db-manage/common/render-cell-copy/Index.vue';
   import RenderHeadCopy from '@views/db-manage/common/render-head-copy/Index.vue';
+  import RenderInstances from '@views/db-manage/common/render-instances/RenderInstances.vue';
+  import RenderOperationTag from '@views/db-manage/common/RenderOperationTag.vue';
   import ClusterReset from '@views/db-manage/sqlserver/components/cluster-reset/Index.vue'
 
   import {
@@ -138,11 +139,6 @@
     isRecentDays
   } from '@utils';
 
-  import type {
-    SearchSelectData,
-    SearchSelectItem,
-  } from '@/types/bkui-vue';
-
   const haClusterData = defineModel<{
     clusterId: number,
   }>('haClusterData');
@@ -281,7 +277,7 @@
       multiple: true,
       children: searchAttrs.value.time_zone,
     },
-  ] as SearchSelectData);
+  ]);
 
 
   const tableOperationWidth = computed(() => {
@@ -788,7 +784,7 @@
     updateTableSettings,
   } = useTableSettings(UserPersonalSettings.SQLSERVER_HA_TABLE_SETTINGS, defaultSettings);
 
-  const getMenuList = async (item: SearchSelectItem | undefined, keyword: string) => {
+  const getMenuList = async (item: ISearchItem | undefined, keyword: string) => {
     if (item?.id !== 'creator' && keyword) {
       return getMenuListSearch(item, keyword, searchSelectData.value, searchValue.value);
     }
diff --git a/dbm-ui/frontend/src/views/db-manage/sqlserver/ha-cluster-list/components/detail/index.vue b/dbm-ui/frontend/src/views/db-manage/sqlserver/ha-cluster-list/components/detail/index.vue
index 1cde956251..8cc9bc8d8d 100644
--- a/dbm-ui/frontend/src/views/db-manage/sqlserver/ha-cluster-list/components/detail/index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/sqlserver/ha-cluster-list/components/detail/index.vue
@@ -51,9 +51,9 @@
 
   import { ClusterTypes, DBTypes } from '@common/const';
 
-  import ClusterTopo from '@components/cluster-details/ClusterTopo.vue';
-  import ClusterEventChange from '@components/cluster-event-change/EventChange.vue';
-  import MonitorDashboard from '@components/cluster-monitor/MonitorDashboard.vue';
+  import ClusterTopo from '@views/db-manage/common/cluster-details/ClusterTopo.vue';
+  import ClusterEventChange from '@views/db-manage/common/cluster-event-change/EventChange.vue';
+  import MonitorDashboard from '@views/db-manage/common/cluster-monitor/MonitorDashboard.vue';
 
   import BaseInfo from './BaseInfo.vue';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/sqlserver/ha-instance-list/components/List.vue b/dbm-ui/frontend/src/views/db-manage/sqlserver/ha-instance-list/components/List.vue
index 5e379f011b..77de9d5873 100644
--- a/dbm-ui/frontend/src/views/db-manage/sqlserver/ha-instance-list/components/List.vue
+++ b/dbm-ui/frontend/src/views/db-manage/sqlserver/ha-instance-list/components/List.vue
@@ -77,10 +77,11 @@
 
   import DbStatus from '@components/db-status/index.vue';
   import DbTable from '@components/db-table/index.vue';
-  import DropdownExportExcel from '@components/dropdown-export-excel/index.vue';
   import MiniTag from '@components/mini-tag/index.vue';
   import TextOverflowLayout from '@components/text-overflow-layout/Index.vue';
 
+  import DropdownExportExcel from '@views/db-manage/common/dropdown-export-excel/index.vue';
+
   import { getSearchSelectorParams } from '@utils';
 
   const instanceData = defineModel<{
diff --git a/dbm-ui/frontend/src/views/db-manage/sqlserver/permission/Index.vue b/dbm-ui/frontend/src/views/db-manage/sqlserver/permission/Index.vue
index d2f2a0c8bf..cb7f4bf394 100644
--- a/dbm-ui/frontend/src/views/db-manage/sqlserver/permission/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/sqlserver/permission/Index.vue
@@ -108,10 +108,11 @@
 
   import { AccountTypes, ClusterTypes } from '@common/const';
 
-  import ClusterAuthorize from '@components/cluster-authorize/ClusterAuthorize.vue';
   import DbTable from '@components/db-table/index.vue';
   import TextOverflowLayout from '@components/text-overflow-layout/Index.vue';
 
+  import ClusterAuthorize from '@views/db-manage/common/cluster-authorize/ClusterAuthorize.vue';
+
   import { getSearchSelectorParams , messageSuccess } from '@utils';
 
   import AccountDialog from './components/AccountDialog.vue';
diff --git a/dbm-ui/frontend/src/views/db-manage/sqlserver/single-cluster/components/List.vue b/dbm-ui/frontend/src/views/db-manage/sqlserver/single-cluster/components/List.vue
index df4da4435a..2b220b2eb6 100644
--- a/dbm-ui/frontend/src/views/db-manage/sqlserver/single-cluster/components/List.vue
+++ b/dbm-ui/frontend/src/views/db-manage/sqlserver/single-cluster/components/List.vue
@@ -79,6 +79,7 @@
 
 <script setup lang="tsx">
   import { InfoBox, Message } from 'bkui-vue';
+  import type { ISearchItem } from 'bkui-vue/lib/search-select/utils';
   import { useI18n } from 'vue-i18n';
   import { useRequest } from 'vue-request';
   import {
@@ -114,21 +115,21 @@
     UserPersonalSettings,
   } from '@common/const';
 
-  import ClusterAuthorize from '@components/cluster-authorize/ClusterAuthorize.vue';
-  import ClusterCapacityUsageRate from '@components/cluster-capacity-usage-rate/Index.vue'
-  import ExcelAuthorize from '@components/cluster-common/ExcelAuthorize.vue';
-  import OperationBtnStatusTips from '@components/cluster-common/OperationBtnStatusTips.vue';
-  import RenderOperationTag from '@components/cluster-common/RenderOperationTag.vue';
-  import RenderClusterStatus from '@components/cluster-common/RenderStatus.vue';
-  import EditEntryConfig from '@components/cluster-entry-config/Index.vue';
+  import RenderClusterStatus from '@components/cluster-status/Index.vue';
   import DbTable from '@components/db-table/index.vue';
-  import DropdownExportExcel from '@components/dropdown-export-excel/index.vue';
-  import RenderInstances from '@components/render-instances/RenderInstances.vue';
   import TextOverflowLayout from '@components/text-overflow-layout/Index.vue';
 
+  import ClusterAuthorize from '@views/db-manage/common/cluster-authorize/ClusterAuthorize.vue';
+  import ClusterCapacityUsageRate from '@views/db-manage/common/cluster-capacity-usage-rate/Index.vue'
+  import EditEntryConfig from '@views/db-manage/common/cluster-entry-config/Index.vue';
   import ClusterIpCopy from '@views/db-manage/common/cluster-ip-copy/Index.vue';
+  import DropdownExportExcel from '@views/db-manage/common/dropdown-export-excel/index.vue';
+  import ExcelAuthorize from '@views/db-manage/common/ExcelAuthorize.vue';
+  import OperationBtnStatusTips from '@views/db-manage/common/OperationBtnStatusTips.vue';
   import RenderCellCopy from '@views/db-manage/common/render-cell-copy/Index.vue';
   import RenderHeadCopy from '@views/db-manage/common/render-head-copy/Index.vue';
+  import RenderInstances from '@views/db-manage/common/render-instances/RenderInstances.vue';
+  import RenderOperationTag from '@views/db-manage/common/RenderOperationTag.vue';
   import ClusterReset from '@views/db-manage/sqlserver/components/cluster-reset/Index.vue'
 
   import {
@@ -137,11 +138,6 @@
     isRecentDays,
   } from '@utils';
 
-  import type {
-    SearchSelectData,
-    SearchSelectItem,
-  } from '@/types/bkui-vue';
-
   const singleClusterData = defineModel<{ clusterId: number }>('singleClusterData');
 
   const router = useRouter();
@@ -277,7 +273,7 @@
       multiple: true,
       children: searchAttrs.value.time_zone,
     },
-  ] as SearchSelectData);
+  ]);
 
   const tableOperationWidth = computed(() => {
     if (!isStretchLayoutOpen.value) {
@@ -660,7 +656,7 @@
     },
   });
 
-  const getMenuList = async (item: SearchSelectItem | undefined, keyword: string) => {
+  const getMenuList = async (item: ISearchItem | undefined, keyword: string) => {
     if (item?.id !== 'creator' && keyword) {
       return getMenuListSearch(item, keyword, searchSelectData.value, searchValue.value);
     }
diff --git a/dbm-ui/frontend/src/views/db-manage/sqlserver/single-cluster/components/detail/index.vue b/dbm-ui/frontend/src/views/db-manage/sqlserver/single-cluster/components/detail/index.vue
index ff86772b98..191c747fc9 100644
--- a/dbm-ui/frontend/src/views/db-manage/sqlserver/single-cluster/components/detail/index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/sqlserver/single-cluster/components/detail/index.vue
@@ -51,9 +51,9 @@
 
   import { ClusterTypes, DBTypes } from '@common/const';
 
-  import ClusterTopo from '@components/cluster-details/ClusterTopo.vue';
-  import ClusterEventChange from '@components/cluster-event-change/EventChange.vue';
-  import MonitorDashboard from '@components/cluster-monitor/MonitorDashboard.vue';
+  import ClusterTopo from '@views/db-manage/common/cluster-details/ClusterTopo.vue';
+  import ClusterEventChange from '@views/db-manage/common/cluster-event-change/EventChange.vue';
+  import MonitorDashboard from '@views/db-manage/common/cluster-monitor/MonitorDashboard.vue';
 
   import BaseInfo from './BaseInfo.vue';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/apply/CreateModule.vue b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/apply/CreateModule.vue
index caf16f31d8..01b065515f 100644
--- a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/apply/CreateModule.vue
+++ b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/apply/CreateModule.vue
@@ -140,7 +140,7 @@
 
   import { useGlobalBizs } from '@stores';
 
-  import DeployVersion from '@components/apply-items/DeployVersion.vue';
+  import DeployVersion from '@views/db-manage/common/apply-items/DeployVersion.vue';
 
   import ModuleParameterTable from './components/ModuleParameterTable.vue';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/apply/Index.vue b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/apply/Index.vue
index 18f77ff21c..d3a3021995 100644
--- a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/apply/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/apply/Index.vue
@@ -147,14 +147,14 @@
   import { TicketTypes } from '@common/const';
   import { nameRegx } from '@common/regex';
 
-  import AffinityItem from '@components/apply-items/AffinityItem.vue';
-  import BackendQPSSpec from '@components/apply-items/BackendQPSSpec.vue';
-  import BusinessItems from '@components/apply-items/BusinessItems.vue';
-  import CloudItem from '@components/apply-items/CloudItem.vue';
-  import ClusterAlias from '@components/apply-items/ClusterAlias.vue';
-  import ClusterName from '@components/apply-items/ClusterName.vue';
-  import RegionItem from '@components/apply-items/RegionItem.vue';
-  import SpecSelector from '@components/apply-items/SpecSelector.vue';
+  import AffinityItem from '@views/db-manage/common/apply-items/AffinityItem.vue';
+  import BackendQPSSpec from '@views/db-manage/common/apply-items/BackendQPSSpec.vue';
+  import BusinessItems from '@views/db-manage/common/apply-items/BusinessItems.vue';
+  import CloudItem from '@views/db-manage/common/apply-items/CloudItem.vue';
+  import ClusterAlias from '@views/db-manage/common/apply-items/ClusterAlias.vue';
+  import ClusterName from '@views/db-manage/common/apply-items/ClusterName.vue';
+  import RegionItem from '@views/db-manage/common/apply-items/RegionItem.vue';
+  import SpecSelector from '@views/db-manage/common/apply-items/SpecSelector.vue';
 
   import ModuleItem from './components/ModuleItem.vue';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/capacity-change/pages/page1/components/RenderData/RenderTargetResourceSpec.vue b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/capacity-change/pages/page1/components/RenderData/RenderTargetResourceSpec.vue
index 48dd1eb591..4e27be4026 100644
--- a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/capacity-change/pages/page1/components/RenderData/RenderTargetResourceSpec.vue
+++ b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/capacity-change/pages/page1/components/RenderData/RenderTargetResourceSpec.vue
@@ -91,9 +91,12 @@
 
   import { useBeforeClose } from '@hooks';
 
-  import ClusterSpecPlanSelector, { type TicketSpecInfo } from '@components/cluster-spec-plan-selector/Index.vue';
   import DisableSelect from '@components/render-table/columns/select-disable/index.vue';
 
+  import ClusterSpecPlanSelector, {
+    type TicketSpecInfo,
+  } from '@views/db-manage/common/cluster-spec-plan-selector/Index.vue';
+
   import type { IDataRow } from './Row.vue';
 
   interface Props {
diff --git a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/checksum/pages/page1/components/RenderData/Index.vue b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/checksum/pages/page1/components/RenderData/Index.vue
index ef7f9abf0f..2c5d2c1f52 100644
--- a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/checksum/pages/page1/components/RenderData/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/checksum/pages/page1/components/RenderData/Index.vue
@@ -153,10 +153,11 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
+
   import type { IDataRowBatchKey } from './Row.vue';
 
   interface Emits {
diff --git a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/db-backup/pages/page1/components/RenderData/Index.vue b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/db-backup/pages/page1/components/RenderData/Index.vue
index 793787bbfd..fb1fe682c9 100644
--- a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/db-backup/pages/page1/components/RenderData/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/db-backup/pages/page1/components/RenderData/Index.vue
@@ -63,10 +63,11 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
+
   interface Emits {
     (e: 'batchSelectCluster'): void;
     (e: 'batchEditBackupLocal', value: string): void;
diff --git a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/db-clear/pages/page1/components/RenderData/Index.vue b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/db-clear/pages/page1/components/RenderData/Index.vue
index 926ec014fa..f168790bbc 100644
--- a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/db-clear/pages/page1/components/RenderData/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/db-clear/pages/page1/components/RenderData/Index.vue
@@ -140,10 +140,11 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
+
   import type { IDataRowBatchKey } from './Row.vue';
 
   interface Emits {
diff --git a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/db-rename/pages/page1/components/RenderData/Index.vue b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/db-rename/pages/page1/components/RenderData/Index.vue
index 091d830bd6..2e7b930bf7 100644
--- a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/db-rename/pages/page1/components/RenderData/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/db-rename/pages/page1/components/RenderData/Index.vue
@@ -82,10 +82,11 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
+
   import type { IDataRowBatchKey } from './Row.vue';
 
   interface Emits {
diff --git a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/db-table-backup/pages/page1/components/RenderData/Index.vue b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/db-table-backup/pages/page1/components/RenderData/Index.vue
index 2da947e1bb..9d7ceb6fa7 100644
--- a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/db-table-backup/pages/page1/components/RenderData/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/db-table-backup/pages/page1/components/RenderData/Index.vue
@@ -141,10 +141,11 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
+
   import type { IDataRowBatchKey } from './Row.vue';
 
   interface Emits {
diff --git a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/flashback/pages/page1/components/RenderData/Index.vue b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/flashback/pages/page1/components/RenderData/Index.vue
index cd9d88bd17..8b61a1809f 100644
--- a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/flashback/pages/page1/components/RenderData/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/flashback/pages/page1/components/RenderData/Index.vue
@@ -163,10 +163,11 @@
   import dayjs from 'dayjs';
   import { useI18n } from 'vue-i18n';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
+
   import type { IDataRowBatchKey } from './Row.vue';
 
   interface Emits {
diff --git a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/list-instance/components/detail/components/ParamsConfig.vue b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/list-instance/components/detail/components/ParamsConfig.vue
index 3e59227490..ae2aa2f31f 100644
--- a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/list-instance/components/detail/components/ParamsConfig.vue
+++ b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/list-instance/components/detail/components/ParamsConfig.vue
@@ -30,16 +30,17 @@
 
   import { ClusterTypes } from '@/common/const';
   import { useGlobalBizs } from '@/stores';
-  import type { TableColumnRender } from '@/types/bkui-vue';
 
   interface Props {
     queryInfos: {
-      dbModuleId: number,
-      version: string,
-      clusterId: number
-    }
+      dbModuleId: number;
+      version: string;
+      clusterId: number;
+    };
   }
 
+  type IRowData = ServiceReturnType<typeof getLevelConfig>['conf_items'][number];
+
   const props = defineProps<Props>();
 
   const { currentBizId } = useGlobalBizs();
@@ -53,31 +54,40 @@
     conf_items: [],
   } as ServiceReturnType<typeof getLevelConfig>);
 
-  const columns = [{
-    label: t('参数项'),
-    field: 'conf_name',
-    render: ({ cell }: TableColumnRender) => <div class="text-overflow" v-overflow-tips>{cell}</div>,
-  }, {
-    label: t('参数值'),
-    field: 'conf_value',
-    render: ({ cell }: TableColumnRender) => <div class="text-overflow" v-overflow-tips>{cell}</div>,
-  }, {
-    label: t('描述'),
-    field: 'description',
-    render: ({ cell }: TableColumnRender) => <div class="text-overflow" v-overflow-tips>{cell || '--'}</div>,
-  }, {
-    label: t('重启实例生效'),
-    field: 'need_restart',
-    width: 200,
-    render: ({ cell }: {cell: number}) => (cell === 1 ? t('是') : t('否')),
-  }];
+  const columns = [
+    {
+      label: t('参数项'),
+      field: 'conf_name',
+      render: ({ data }: { data: IRowData }) => data.conf_name,
+    },
+    {
+      label: t('参数值'),
+      field: 'conf_value',
+      render: ({ data }: { data: IRowData }) => data.conf_value,
+    },
+    {
+      label: t('描述'),
+      field: 'description',
+      render: ({ data }: { data: IRowData }) => data.description || '--',
+    },
+    {
+      label: t('重启实例生效'),
+      field: 'need_restart',
+      width: 200,
+      render: ({ cell }: { cell: number }) => (cell === 1 ? t('是') : t('否')),
+    },
+  ];
 
-  watch(() => props.queryInfos, (infos) => {
-    const { dbModuleId, version, clusterId } = infos;
-    if (dbModuleId && version && clusterId) {
-      fetchClusterConfig();
-    }
-  }, { immediate: true, deep: true });
+  watch(
+    () => props.queryInfos,
+    (infos) => {
+      const { dbModuleId, version, clusterId } = infos;
+      if (dbModuleId && version && clusterId) {
+        fetchClusterConfig();
+      }
+    },
+    { immediate: true, deep: true },
+  );
 
   /**
    * 获取集群配置
@@ -101,7 +111,7 @@
       .finally(() => {
         isLoading.value = false;
       });
-  }
+  };
 </script>
 
 <style lang="less" scoped>
diff --git a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/list-instance/components/list/Index.vue b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/list-instance/components/list/Index.vue
index a405dbd7ea..76b12b5b69 100644
--- a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/list-instance/components/list/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/list-instance/components/list/Index.vue
@@ -75,9 +75,10 @@
   } from '@common/const';
 
   import DbStatus from '@components/db-status/index.vue';
-  import DropdownExportExcel from '@components/dropdown-export-excel/index.vue';
   import TextOverflowLayout from '@components/text-overflow-layout/Index.vue';
 
+  import DropdownExportExcel from '@views/db-manage/common/dropdown-export-excel/index.vue';
+
   import {
     getSearchSelectorParams,
     isRecentDays,
diff --git a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/list/components/detail/Index.vue b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/list/components/detail/Index.vue
index fc2fb0d5a0..947842db8d 100644
--- a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/list/components/detail/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/list/components/detail/Index.vue
@@ -68,9 +68,9 @@
 
   import { ClusterTypes } from '@common/const';
 
-  import ClusterTopo from '@components/cluster-details/ClusterTopo.vue';
-  import ClusterEventChange from '@components/cluster-event-change/EventChange.vue';
-  import MonitorDashboard from '@components/cluster-monitor/MonitorDashboard.vue';
+  import ClusterTopo from '@views/db-manage/common/cluster-details/ClusterTopo.vue';
+  import ClusterEventChange from '@views/db-manage/common/cluster-event-change/EventChange.vue';
+  import MonitorDashboard from '@views/db-manage/common/cluster-monitor/MonitorDashboard.vue';
 
   import { checkDbConsole } from '@utils';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/list/components/list/Index.vue b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/list/components/list/Index.vue
index 42c098be01..f039e429bf 100644
--- a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/list/components/list/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/list/components/list/Index.vue
@@ -173,23 +173,23 @@
     UserPersonalSettings,
   } from '@common/const';
 
-  import ClusterAuthorize from '@components/cluster-authorize/ClusterAuthorize.vue';
-  import ClusterCapacityUsageRate from '@components/cluster-capacity-usage-rate/Index.vue'
-  import ExcelAuthorize from '@components/cluster-common/ExcelAuthorize.vue';
-  import OperationBtnStatusTips from '@components/cluster-common/OperationBtnStatusTips.vue';
-  import RenderOperationTag from '@components/cluster-common/RenderOperationTagNew.vue';
-  import EditEntryConfig, { type RowData } from '@components/cluster-entry-config/Index.vue';
-  import ClusterExportData from '@components/cluster-export-data/Index.vue'
   import DbStatus from '@components/db-status/index.vue';
   import DbTable from '@components/db-table/index.vue';
-  import DropdownExportExcel from '@components/dropdown-export-excel/index.vue';
   import MoreActionExtend from '@components/more-action-extend/Index.vue';
-  import RenderInstances from '@components/render-instances/RenderInstances.vue';
   import TextOverflowLayout from '@components/text-overflow-layout/Index.vue';
 
+  import ClusterAuthorize from '@views/db-manage/common/cluster-authorize/ClusterAuthorize.vue';
+  import ClusterCapacityUsageRate from '@views/db-manage/common/cluster-capacity-usage-rate/Index.vue'
+  import EditEntryConfig, { type RowData } from '@views/db-manage/common/cluster-entry-config/Index.vue';
+  import ClusterExportData from '@views/db-manage/common/cluster-export-data/Index.vue'
   import ClusterIpCopy from '@views/db-manage/common/cluster-ip-copy/Index.vue';
+  import DropdownExportExcel from '@views/db-manage/common/dropdown-export-excel/index.vue';
+  import ExcelAuthorize from '@views/db-manage/common/ExcelAuthorize.vue';
+  import OperationBtnStatusTips from '@views/db-manage/common/OperationBtnStatusTips.vue';
   import RenderCellCopy from '@views/db-manage/common/render-cell-copy/Index.vue';
   import RenderHeadCopy from '@views/db-manage/common/render-head-copy/Index.vue';
+  import RenderInstances from '@views/db-manage/common/render-instances/RenderInstances.vue';
+  import RenderOperationTag from '@views/db-manage/common/RenderOperationTag.vue';
 
   import {
     getMenuListSearch,
diff --git a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/list/components/list/components/CapacityChange.vue b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/list/components/list/components/CapacityChange.vue
index 7ff2b8b583..a8b9a5e0d6 100644
--- a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/list/components/list/components/CapacityChange.vue
+++ b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/list/components/list/components/CapacityChange.vue
@@ -99,7 +99,7 @@
 
   import SpecPlanSelector, {
     type TicketSpecInfo,
-  }  from '@components/cluster-spec-plan-selector/Index.vue';
+  }  from '@views/db-manage/common/cluster-spec-plan-selector/Index.vue';
 
   import { t } from '@/locales';
   import { useGlobalBizs } from '@/stores';
diff --git a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/openarea-create/components/target-cluster/components/RenderTable.vue b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/openarea-create/components/target-cluster/components/RenderTable.vue
index 900adb0e7b..236424afcf 100644
--- a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/openarea-create/components/target-cluster/components/RenderTable.vue
+++ b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/openarea-create/components/target-cluster/components/RenderTable.vue
@@ -81,10 +81,11 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
+
   interface Props {
     variableList: string[];
     showIpCloumn: boolean;
diff --git a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/openarea-template-create/Index.vue b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/openarea-template-create/Index.vue
index 6ded16739a..d52ccfe3c3 100644
--- a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/openarea-template-create/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/openarea-template-create/Index.vue
@@ -127,10 +127,11 @@
 
   import { ClusterTypes } from '@common/const';
 
-  import PermissionRule from '@components/add-permission-rule-dialog/Index.vue';
   import ClusterSelector, { type TabConfig } from '@components/cluster-selector/Index.vue';
   import TextOverflowLayout from '@components/text-overflow-layout/Index.vue';
 
+  import PermissionRule from '@views/db-manage/common/add-permission-rule-dialog/Index.vue';
+
   import { messageSuccess } from '@utils';
 
   import ConfigRule from './components/config-rule/Index.vue';
diff --git a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/openarea-template-create/components/config-rule/components/RenderData/Index.vue b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/openarea-template-create/components/config-rule/components/RenderData/Index.vue
index a8f80cf9b1..557dbf8cee 100644
--- a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/openarea-template-create/components/config-rule/components/RenderData/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/openarea-template-create/components/config-rule/components/RenderData/Index.vue
@@ -73,10 +73,11 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
+
   interface Emits {
     (e: 'batchEdit', value: string[]): void;
   }
diff --git a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/openarea-template-create/components/config-rule/components/RenderData/RenderPrivData.vue b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/openarea-template-create/components/config-rule/components/RenderData/RenderPrivData.vue
index aa4c9b75f7..23fab0f1d7 100644
--- a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/openarea-template-create/components/config-rule/components/RenderData/RenderPrivData.vue
+++ b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/openarea-template-create/components/config-rule/components/RenderData/RenderPrivData.vue
@@ -47,7 +47,7 @@
   import { ref } from 'vue';
   import { useI18n } from 'vue-i18n';
 
-  import PermissionRule from '@components/add-permission-rule-dialog/Index.vue';
+  import PermissionRule from '@views/db-manage/common/add-permission-rule-dialog/Index.vue';
 
   interface Props {
     clusterId: number;
diff --git a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/permission-list/Index.vue b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/permission-list/Index.vue
index d50fd3bd10..45404d5fb8 100644
--- a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/permission-list/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/permission-list/Index.vue
@@ -57,14 +57,13 @@
 
   import { AccountTypes, ClusterTypes } from '@common/const';
 
-  import ClusterAuthorize from '@components/cluster-authorize/ClusterAuthorize.vue';
+  import ClusterAuthorize from '@views/db-manage/common/cluster-authorize/ClusterAuthorize.vue';
 
   import { dbOperations } from '../permission/common/consts';
 
   import ExcelAuthorize from './components/ExcelAuthorize.vue';
 
   import { useGlobalBizs } from '@/stores';
-  import type { TableProps } from '@/types/bkui-vue';
 
   const tableSearch = ref([]);
   const authorizeShow = ref(false);
@@ -80,7 +79,7 @@
   });
 
   const keyword = ref('');
-  const columns: TableProps['columns'] = [
+  const columns = [
     {
       label: t('账号'),
       field: 'user',
diff --git a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/permission/Index.vue b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/permission/Index.vue
index 10ae4932ce..da972cf9b2 100644
--- a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/permission/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/permission/Index.vue
@@ -78,10 +78,11 @@
   } from '@common/const';
 
   import PermissionCatch from '@components/apply-permission/Catch.vue'
-  import ClusterAuthorize from '@components/cluster-authorize/ClusterAuthorize.vue';
   import DbTable from '@components/db-table/index.vue';
   import TextOverflowLayout from '@components/text-overflow-layout/Index.vue';
 
+  import ClusterAuthorize from '@views/db-manage/common/cluster-authorize/ClusterAuthorize.vue';
+
   import { getSearchSelectorParams } from '@utils';
 
   import { dbOperations } from './common/consts';
diff --git a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/rollback/pages/page1/components/render-data/exist-cluster/Index.vue b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/rollback/pages/page1/components/render-data/exist-cluster/Index.vue
index 694e50e4f1..830d178063 100644
--- a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/rollback/pages/page1/components/render-data/exist-cluster/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/rollback/pages/page1/components/render-data/exist-cluster/Index.vue
@@ -211,10 +211,11 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
+
   import { BackupTypes, selectList } from '../../common/const';
   import type { IDataRow } from '../Index.vue';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/rollback/pages/page1/components/render-data/new-cluster/Index.vue b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/rollback/pages/page1/components/render-data/new-cluster/Index.vue
index ecd38e0241..1256d9a2a5 100644
--- a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/rollback/pages/page1/components/render-data/new-cluster/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/rollback/pages/page1/components/render-data/new-cluster/Index.vue
@@ -215,10 +215,11 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
+
   import { BackupTypes, selectList } from '../../common/const';
   import type { IDataRow } from '../Index.vue';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/rollback/pages/page1/components/render-data/origin-cluster/Index.vue b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/rollback/pages/page1/components/render-data/origin-cluster/Index.vue
index 908c72e877..029d515780 100644
--- a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/rollback/pages/page1/components/render-data/origin-cluster/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/rollback/pages/page1/components/render-data/origin-cluster/Index.vue
@@ -124,10 +124,11 @@
 <script setup lang="ts">
   import { useI18n } from 'vue-i18n';
 
-  import BatchEditColumn from '@components/batch-edit-column/Index.vue';
   import RenderTableHeadColumn from '@components/render-table/HeadColumn.vue';
   import RenderTable from '@components/render-table/Index.vue';
 
+  import BatchEditColumn from '@views/db-manage/common/batch-edit-column/Index.vue';
+
   import { BackupTypes, selectList } from '../../common/const';
   import type { IDataRow } from '../Index.vue';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/slave-rebuild/pages/page1/components/new-host/components/resource-pool-manual-selector/components/table/Index.vue b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/slave-rebuild/pages/page1/components/new-host/components/resource-pool-manual-selector/components/table/Index.vue
index ffffdbe2cc..170c5fc46f 100644
--- a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/slave-rebuild/pages/page1/components/new-host/components/resource-pool-manual-selector/components/table/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/slave-rebuild/pages/page1/components/new-host/components/resource-pool-manual-selector/components/table/Index.vue
@@ -44,8 +44,8 @@
 
   import { UserPersonalSettings } from '@common/const';
 
-  import HostAgentStatus from '@components/cluster-common/HostAgentStatus.vue';
   import DiskPopInfo from '@components/disk-pop-info/DiskPopInfo.vue';
+  import HostAgentStatus from '@components/host-agent-status/Index.vue';
 
   import { useTableData } from './useTableData';
 
diff --git a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/webconsole/Index.vue b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/webconsole/Index.vue
index bbe1eb1180..ad3ab84385 100644
--- a/dbm-ui/frontend/src/views/db-manage/tendb-cluster/webconsole/Index.vue
+++ b/dbm-ui/frontend/src/views/db-manage/tendb-cluster/webconsole/Index.vue
@@ -4,5 +4,5 @@
 <script setup lang="ts">
   import { DBTypes } from '@common/const';
 
-  import WebConsole from '@components/webconsole/Index.vue';
+  import WebConsole from '@views/db-manage/common/webconsole/Index.vue';
 </script>
diff --git a/dbm-ui/frontend/src/views/inspection-manage/routes.ts b/dbm-ui/frontend/src/views/inspection-manage/routes.ts
index 3048becc64..93a7b3b5bc 100644
--- a/dbm-ui/frontend/src/views/inspection-manage/routes.ts
+++ b/dbm-ui/frontend/src/views/inspection-manage/routes.ts
@@ -40,5 +40,5 @@ const routes = [
 ];
 
 export default function getRoutes() {
-  return checkDbConsole('observableManage.healthReport') ? routes : []
+  return checkDbConsole('observableManage.healthReport') ? routes : [];
 }
diff --git a/dbm-ui/frontend/src/views/monitor-alarm-db/alarm-group/components/DetailDialog.vue b/dbm-ui/frontend/src/views/monitor-alarm-db/alarm-group/components/DetailDialog.vue
index a5c013c58b..96ac574a29 100644
--- a/dbm-ui/frontend/src/views/monitor-alarm-db/alarm-group/components/DetailDialog.vue
+++ b/dbm-ui/frontend/src/views/monitor-alarm-db/alarm-group/components/DetailDialog.vue
@@ -85,11 +85,7 @@
   import { useI18n } from 'vue-i18n';
   import { useRequest } from 'vue-request';
 
-  import {
-    getAlarmGroupList,
-    insertAlarmGroup,
-    updateAlarmGroup,
-  } from '@services/source/monitorNoticeGroup';
+  import { getAlarmGroupList, insertAlarmGroup, updateAlarmGroup } from '@services/source/monitorNoticeGroup';
 
   import { useBeforeClose } from '@hooks';
 
@@ -99,14 +95,14 @@
   import ReceiversSelector from './ReceiversSelector.vue';
 
   interface Props {
-    type: 'add' | 'edit' | 'copy',
-    detailData: ServiceReturnType<typeof getAlarmGroupList>['results'][number],
-    bizId: number,
-    nameList: string[]
+    type: 'add' | 'edit' | 'copy';
+    detailData: ServiceReturnType<typeof getAlarmGroupList>['results'][number];
+    bizId: number;
+    nameList: string[];
   }
 
   interface Emits {
-    (e: 'successed'): void,
+    (e: 'successed'): void;
   }
 
   const props = defineProps<Props>();
@@ -127,7 +123,7 @@
   const nameRules = [
     {
       message: t('长度不能大于n', [80]),
-      validator: (value: string)  => value.length <= 80,
+      validator: (value: string) => value.length <= 80,
     },
     {
       message: t('告警组名称重复'),
@@ -154,20 +150,14 @@
 
   const sidesliderTitle = computed(() => `${titleMap[props.type]}`);
 
-  const {
-    loading: insertLoading,
-    run: insertAlarmGroupRun,
-  } = useRequest(insertAlarmGroup, {
+  const { loading: insertLoading, run: insertAlarmGroupRun } = useRequest(insertAlarmGroup, {
     manual: true,
     onSuccess() {
       runSuccess(t('创建成功'));
     },
   });
 
-  const {
-    loading: updateLoading,
-    run: updateAlarmGroupRun,
-  } = useRequest(updateAlarmGroup, {
+  const { loading: updateLoading, run: updateAlarmGroupRun } = useRequest(updateAlarmGroup, {
     manual: true,
     onSuccess() {
       runSuccess(t('编辑成功'));
@@ -177,7 +167,7 @@
   watch(isShow, (newVal) => {
     if (newVal && props.type !== 'add') {
       formData.name = props.detailData.name;
-      formData.receivers = props.detailData.receivers.map(item => item.id);
+      formData.receivers = props.detailData.receivers.map((item) => item.id);
     }
   });
 
diff --git a/dbm-ui/frontend/src/views/monitor-alarm-db/alarm-group/components/NoticeMethodFormItem.vue b/dbm-ui/frontend/src/views/monitor-alarm-db/alarm-group/components/NoticeMethodFormItem.vue
index 929f6de27d..b9bd38a565 100644
--- a/dbm-ui/frontend/src/views/monitor-alarm-db/alarm-group/components/NoticeMethodFormItem.vue
+++ b/dbm-ui/frontend/src/views/monitor-alarm-db/alarm-group/components/NoticeMethodFormItem.vue
@@ -149,48 +149,45 @@
   import { useI18n } from 'vue-i18n';
   import { useRequest } from 'vue-request';
 
-  import {
-    getAlarmGroupList,
-    getAlarmGroupNotifyList,
-  } from '@services/source/monitorNoticeGroup';
+  import { getAlarmGroupList, getAlarmGroupNotifyList } from '@services/source/monitorNoticeGroup';
 
   import { messageWarn } from '@utils';
 
   interface Props {
-    type: 'add' | 'edit' | 'copy' | '',
-    details: AlarmGroupDetail,
-    disabled: boolean,
+    type: 'add' | 'edit' | 'copy' | '';
+    details: AlarmGroupDetail;
+    disabled: boolean;
   }
 
   interface Exposes {
     getSubmitData: () => AlarmGroupNotice[];
   }
 
-  type TimePickerRef = ComponentPublicInstance<typeof BkTimePicker>
-  type AlarmGroupDetail = ServiceReturnType<typeof getAlarmGroupList>['results'][number]['details']
-  type AlarmGroupNotice = AlarmGroupDetail['alert_notice'][number]
-  type AlarmGroupNotifyDisplay = Omit<ServiceReturnType<typeof getAlarmGroupNotifyList>[number], 'is_active'>
+  type TimePickerRef = ComponentPublicInstance<typeof BkTimePicker>;
+  type AlarmGroupDetail = ServiceReturnType<typeof getAlarmGroupList>['results'][number]['details'];
+  type AlarmGroupNotice = AlarmGroupDetail['alert_notice'][number];
+  type AlarmGroupNotifyDisplay = Omit<ServiceReturnType<typeof getAlarmGroupNotifyList>[number], 'is_active'>;
 
   interface LevelMapItem {
-    label: string,
-    type: 'default' | 'warning' | 'error',
-    level: 3 | 2 | 1
+    label: string;
+    type: 'default' | 'warning' | 'error';
+    level: 3 | 2 | 1;
   }
 
   interface PanelCheckbox extends AlarmGroupNotifyDisplay {
-    checked: boolean,
+    checked: boolean;
   }
 
   interface PanelInput extends AlarmGroupNotifyDisplay {
-    value: string
+    value: string;
   }
 
   interface TableHead {
-    label: string,
-    bold?: boolean,
-    type?: boolean,
-    icon?: string,
-    input?: boolean
+    label: string;
+    bold?: boolean;
+    type?: boolean;
+    icon?: string;
+    input?: boolean;
   }
 
   const props = defineProps<Props>();
@@ -237,8 +234,8 @@
   };
 
   const panelInitData: {
-    checkboxArr: PanelCheckbox[],
-    inputArr: PanelInput[]
+    checkboxArr: PanelCheckbox[];
+    inputArr: PanelInput[];
   } = {
     checkboxArr: [],
     inputArr: [],
@@ -248,32 +245,41 @@
     {
       required: true,
       message: t('每个告警级别至少选择一种通知方式'),
-      validator: () => panelList.value.every(item => item.dataList.every(dataItem => (dataItem.checkboxArr.some(checkItem => checkItem.checked) || dataItem.inputArr.some(inputItem => inputItem.value !== '')))),
+      validator: () =>
+        panelList.value.every((item) =>
+          item.dataList.every(
+            (dataItem) =>
+              dataItem.checkboxArr.some((checkItem) => checkItem.checked) ||
+              dataItem.inputArr.some((inputItem) => inputItem.value !== ''),
+          ),
+        ),
     },
   ];
 
   const timePickerRefs: Record<number, TimePickerRef> = {};
   let currentPanelIndex = -1;
-  let currentPanelTimeRange:[string, string] = ['', ''];
+  let currentPanelTimeRange: [string, string] = ['', ''];
 
   const active = ref('');
-  const panelList = ref<{
-    name: string,
-    open: boolean,
-    timeRange: [string, string],
-    dataList:({
-      checkboxArr: PanelCheckbox[],
-      inputArr: PanelInput[]
-    } & LevelMapItem)[]
-  }[]>([]);
+  const panelList = ref<
+    {
+      name: string;
+      open: boolean;
+      timeRange: [string, string];
+      dataList: ({
+        checkboxArr: PanelCheckbox[];
+        inputArr: PanelInput[];
+      } & LevelMapItem)[];
+    }[]
+  >([]);
 
   const addPanelTipDiabled = computed(() => {
-    const timeArr = panelList.value.map(item => timeRangeFormatter(item.timeRange));
+    const timeArr = panelList.value.map((item) => timeRangeFormatter(item.timeRange));
 
     return !isIntervalsFullDay(timeArr);
   });
 
-  const isTimePickerOpen = computed(() => panelList.value.some(panelItem => panelItem.open));
+  const isTimePickerOpen = computed(() => panelList.value.some((panelItem) => panelItem.open));
 
   useRequest(getAlarmGroupNotifyList, {
     onSuccess(notifyList) {
@@ -281,12 +287,7 @@
       const inputHead: TableHead[] = [];
 
       notifyList.forEach((item) => {
-        const {
-          type,
-          label,
-          is_active: isActive,
-          icon,
-        } = item;
+        const { type, label, is_active: isActive, icon } = item;
 
         if (isActive) {
           if (inputTypes.includes(type)) {
@@ -325,13 +326,15 @@
   });
 
   watch(active, () => {
-    panelList.value.forEach(item => Object.assign(item, { open: false }));
+    panelList.value.forEach((item) => Object.assign(item, { open: false }));
   });
 
-  const isIntervalsFullDay = (minutesIntervals: {
-    start: number,
-    end: number,
-  }[]) =>  {
+  const isIntervalsFullDay = (
+    minutesIntervals: {
+      start: number;
+      end: number;
+    }[],
+  ) => {
     if (minutesIntervals.length === 0) {
       return false;
     }
@@ -370,7 +373,7 @@
   };
 
   const findFirstAvailableTimeSlot = (): [string, string] => {
-    const timeRanges = panelList.value.map(item => item.timeRange);
+    const timeRanges = panelList.value.map((item) => item.timeRange);
     const fullDayInMinutes = 24 * 60;
 
     // 创建一个数组，用于表示整天的占用情况，初始都为空闲
@@ -378,10 +381,7 @@
 
     // 根据给定的时间段将已占用的分钟设置为 false
     for (const timeRangeItem of timeRanges) {
-      const {
-        start,
-        end,
-      } = timeRangeFormatter(timeRangeItem);
+      const { start, end } = timeRangeFormatter(timeRangeItem);
 
       for (let i = start; i <= end; i++) {
         availableMinutes[i] = false;
@@ -404,19 +404,14 @@
     }
 
     if (firstAvailableStart && firstAvailableEnd) {
-      return [
-        minutesToHoursAndMinutes(firstAvailableStart),
-        minutesToHoursAndMinutes(firstAvailableEnd),
-      ];
+      return [minutesToHoursAndMinutes(firstAvailableStart), minutesToHoursAndMinutes(firstAvailableEnd)];
     }
 
     return ['00:00', '23:59'];
   };
 
   const addPanel = () => {
-    const name = Math.random()
-      .toString(16)
-      .substring(4, 10);
+    const name = Math.random().toString(16).substring(4, 10);
 
     panelList.value.push({
       name,
@@ -454,9 +449,7 @@
     } else if (type === 'edit' || type === 'copy') {
       if (details?.alert_notice) {
         panelList.value = details.alert_notice.map((item) => {
-          const name = Math.random()
-            .toString(16)
-            .substring(4, 10);
+          const name = Math.random().toString(16).substring(4, 10);
 
           const dataList = item.notify_config.map((configItem) => {
             const checkboxArr = _.cloneDeep(panelInitData.checkboxArr);
@@ -464,13 +457,13 @@
 
             configItem.notice_ways.forEach((wayItem) => {
               if (inputTypes.includes(wayItem.name)) {
-                const idx = inputArr.findIndex(inputItem => inputItem.type === wayItem.name);
+                const idx = inputArr.findIndex((inputItem) => inputItem.type === wayItem.name);
 
                 if (idx > -1) {
                   inputArr[idx].value = wayItem.receivers?.join(',') as string;
                 }
               } else {
-                const idx = checkboxArr.findIndex(checkboxItem => checkboxItem.type === wayItem.name);
+                const idx = checkboxArr.findIndex((checkboxItem) => checkboxItem.type === wayItem.name);
 
                 if (idx > -1) {
                   checkboxArr[idx].checked = true;
@@ -502,13 +495,10 @@
 
   const areTimeRangesOverlapping = () => {
     const minuteOccupied = new Array(24 * 60).fill(false); // 创建一个布尔数组，用于跟踪每分钟的占用情况
-    const timeRanges = panelList.value.map(item => item.timeRange);
+    const timeRanges = panelList.value.map((item) => item.timeRange);
 
     for (const timeRangeItem of timeRanges) {
-      const {
-        start,
-        end,
-      } = timeRangeFormatter(timeRangeItem);
+      const { start, end } = timeRangeFormatter(timeRangeItem);
 
       // 检查时间段是否和已占用的时间冲突
       for (let i = start; i < end; i++) {
@@ -557,7 +547,7 @@
     });
   };
 
-  const timeArrayFormatter = (timeArr: string[]): string =>  {
+  const timeArrayFormatter = (timeArr: string[]): string => {
     if (timeArr && timeArr.length === 2) {
       const [start, end] = timeArr;
       let startArr = start.split(':');
@@ -593,45 +583,44 @@
   defineExpose<Exposes>({
     getSubmitData() {
       const submitData = panelList.value.map((item) => {
-        const {
-          timeRange,
-          dataList,
-        } = item;
+        const { timeRange, dataList } = item;
 
         return {
           time_range: timeRange.join('--'),
           notify_config: dataList.map((dataItem) => {
-            const {
-              checkboxArr,
-              inputArr,
-              level,
-            } = dataItem;
-
-            const noticeWaysCheck = checkboxArr.reduce((prev, current) => {
-              if (current.checked) {
-                prev.push({
-                  name: current.type,
-                });
-              }
-              return prev;
-            }, [] as {
-              name: string,
-              receivers?: string[]
-            }[]);
-
-            const noticeWaysInput = inputArr.reduce((prev, current) => {
-              if (current.value !== '') {
-                prev.push({
-                  name: current.type,
-                  receivers: current.value.split(','),
-                });
-              }
+            const { checkboxArr, inputArr, level } = dataItem;
+
+            const noticeWaysCheck = checkboxArr.reduce(
+              (prev, current) => {
+                if (current.checked) {
+                  prev.push({
+                    name: current.type,
+                  });
+                }
+                return prev;
+              },
+              [] as {
+                name: string;
+                receivers?: string[];
+              }[],
+            );
+
+            const noticeWaysInput = inputArr.reduce(
+              (prev, current) => {
+                if (current.value !== '') {
+                  prev.push({
+                    name: current.type,
+                    receivers: current.value.split(','),
+                  });
+                }
 
-              return prev;
-            }, [] as {
-              name: string,
-              receivers?: string[]
-            }[]);
+                return prev;
+              },
+              [] as {
+                name: string;
+                receivers?: string[];
+              }[],
+            );
 
             return {
               level,
diff --git a/dbm-ui/frontend/src/views/monitor-alarm-db/alarm-group/components/RenderRow.vue b/dbm-ui/frontend/src/views/monitor-alarm-db/alarm-group/components/RenderRow.vue
index 6bd5a8577e..5a5b555844 100644
--- a/dbm-ui/frontend/src/views/monitor-alarm-db/alarm-group/components/RenderRow.vue
+++ b/dbm-ui/frontend/src/views/monitor-alarm-db/alarm-group/components/RenderRow.vue
@@ -83,7 +83,7 @@
   import { useResizeObserver } from '@vueuse/core';
 
   interface Props {
-    data: ServiceReturnType<typeof getUserGroupList>
+    data: ServiceReturnType<typeof getUserGroupList>;
   }
 
   const props = defineProps<Props>();
diff --git a/dbm-ui/frontend/src/views/monitor-alarm-db/monitor-strategy/components/content/RenderNotifyGroup.vue b/dbm-ui/frontend/src/views/monitor-alarm-db/monitor-strategy/components/content/RenderNotifyGroup.vue
index 4939124232..c4a5457974 100644
--- a/dbm-ui/frontend/src/views/monitor-alarm-db/monitor-strategy/components/content/RenderNotifyGroup.vue
+++ b/dbm-ui/frontend/src/views/monitor-alarm-db/monitor-strategy/components/content/RenderNotifyGroup.vue
@@ -76,9 +76,9 @@
 
   interface Props {
     data: {
-      id: string,
-      displayName: string
-    }[]
+      id: string;
+      displayName: string;
+    }[];
   }
 
   const props = defineProps<Props>();
diff --git a/dbm-ui/frontend/src/views/monitor-alarm-db/monitor-strategy/components/edit-strategy/monitor-target/Index.vue b/dbm-ui/frontend/src/views/monitor-alarm-db/monitor-strategy/components/edit-strategy/monitor-target/Index.vue
index 75f73fb570..ee67e10b45 100644
--- a/dbm-ui/frontend/src/views/monitor-alarm-db/monitor-strategy/components/edit-strategy/monitor-target/Index.vue
+++ b/dbm-ui/frontend/src/views/monitor-alarm-db/monitor-strategy/components/edit-strategy/monitor-target/Index.vue
@@ -159,24 +159,24 @@
   type CustomItem = MonitorPolicyModel['custom_conditions'][0];
 
   type FlowListType = {
-    activeAdd: boolean,
-    activeMinus: boolean,
-    id: TargetType,
-    isCustom: boolean,
-    isSelect: boolean,
-    method: string,
+    activeAdd: boolean;
+    activeMinus: boolean;
+    id: TargetType;
+    isCustom: boolean;
+    isSelect: boolean;
+    method: string;
     selectList: {
       value: string;
       label: string;
-    }[],
-    title: string,
+    }[];
+    title: string;
     titleList: {
       value: string;
       label: string;
-    }[],
-    value: string[],
-    valueList: string[],
-  }[]
+    }[];
+    value: string[];
+    valueList: string[];
+  }[];
 
   interface Exposes {
     getValue: () => any;
@@ -203,9 +203,7 @@
     const titles = [TargetType.CLUSTER, TargetType.MODULE] as string[];
     let selectCounts = 0;
     const targets = _.cloneDeep(props.targets).reduce((results, item) => {
-      if (
-        !([TargetType.BIZ, TargetType.PLATFORM] as string[]).includes(item.level)
-      ) {
+      if (!([TargetType.BIZ, TargetType.PLATFORM] as string[]).includes(item.level)) {
         if (titles.includes(item.level)) {
           selectCounts = selectCounts + 1;
         }
@@ -268,7 +266,7 @@
       };
     });
 
-    const customeList = props.customs.map(item => ({
+    const customeList = props.customs.map((item) => ({
       id: item.key,
       title: item.dimension_name,
       isCustom: true,
@@ -341,17 +339,16 @@
   const { t } = useI18n();
   const { currentBizId } = useGlobalBizs();
 
-  const isPlatform = computed(() => props.targets.filter(item => item.level === TargetType.PLATFORM).length  > 0);
+  const isPlatform = computed(() => props.targets.filter((item) => item.level === TargetType.PLATFORM).length > 0);
 
   const isMySql = computed(() => props.dbType === 'mysql');
 
-  const bizId = computed(() => (isPlatform.value
-    ? currentBizId
-    : props.targets.find(item => item.level === TargetType.BIZ)!.rule
-      .value[0]));
+  const bizId = computed(() =>
+    isPlatform.value ? currentBizId : props.targets.find((item) => item.level === TargetType.BIZ)!.rule.value[0],
+  );
 
   const bizObj = computed(() => {
-    const selectCount = flowList.value.filter(item => item.isSelect).length;
+    const selectCount = flowList.value.filter((item) => item.isSelect).length;
     return {
       title: '0',
       titleList: [
@@ -371,7 +368,6 @@
     };
   });
 
-
   const flowList = ref<FlowListType>([]);
 
   watch(
@@ -416,7 +412,7 @@
     if (!_.trim(text)) {
       return [];
     }
-    return text.split(batchSplitRegex).map(item => ({
+    return text.split(batchSplitRegex).map((item) => ({
       id: item,
       name: item,
     }));
@@ -425,9 +421,7 @@
   const handleTitleChange = (index: number, value: string) => {
     const isModule = value === '0';
     flowList.value[index].id = isModule ? TargetType.MODULE : TargetType.CLUSTER;
-    flowList.value[index].selectList = isModule
-      ? props.moduleList
-      : props.clusterList;
+    flowList.value[index].selectList = isModule ? props.moduleList : props.clusterList;
     flowList.value[index].value = [];
   };
 
@@ -443,7 +437,7 @@
 
     if (index === -1 && bizObj.value.activeAdd) {
       // 点击业务栏添加
-      const selectCount = flowList.value.filter(item => item.isSelect).length;
+      const selectCount = flowList.value.filter((item) => item.isSelect).length;
       if (selectCount === 1) {
         const newItem = generateFlowSelectItem();
         if (newItem.id === TargetType.MODULE) {
@@ -487,8 +481,8 @@
         level: TargetType.BIZ,
       };
       const targetList = flowList.value
-        .filter(item => !item.isCustom)
-        .map(row => ({
+        .filter((item) => !item.isCustom)
+        .map((row) => ({
           rule: {
             key: row.id,
             value: row.value,
@@ -497,8 +491,8 @@
         }));
       const targets = [defalutObj, ...targetList];
       const customs = flowList.value
-        .filter(item => item.isCustom)
-        .map(item => ({
+        .filter((item) => item.isCustom)
+        .map((item) => ({
           condition: 'and',
           dimension_name: item.title,
           key: item.id,
diff --git a/dbm-ui/frontend/src/views/monitor-alarm-db/routes.ts b/dbm-ui/frontend/src/views/monitor-alarm-db/routes.ts
index d7789611d5..910b800450 100644
--- a/dbm-ui/frontend/src/views/monitor-alarm-db/routes.ts
+++ b/dbm-ui/frontend/src/views/monitor-alarm-db/routes.ts
@@ -30,7 +30,7 @@ const dbMonitorStrategyRoute = {
     fullscreen: true,
   },
   component: () => import('@views/monitor-alarm-db/monitor-strategy/Index.vue'),
-}
+};
 
 const dbMonitorAlarmGroupRoute = {
   name: 'DBMonitorAlarmGroup',
@@ -39,7 +39,7 @@ const dbMonitorAlarmGroupRoute = {
     navName: t('告警组'),
   },
   component: () => import('@views/monitor-alarm-db/alarm-group/Index.vue'),
-}
+};
 
 export default function getRoutes() {
   const routes: RouteRecordRaw[] = [];
diff --git a/dbm-ui/frontend/src/views/notification-setting/components/SingleMonthDateRange.vue b/dbm-ui/frontend/src/views/notification-setting/components/SingleMonthDateRange.vue
index ea8572a90b..3faf0a7554 100644
--- a/dbm-ui/frontend/src/views/notification-setting/components/SingleMonthDateRange.vue
+++ b/dbm-ui/frontend/src/views/notification-setting/components/SingleMonthDateRange.vue
@@ -44,38 +44,36 @@
   </BkSelect>
 </template>
 <script setup lang="ts">
-
   interface ListItem {
-    value: number,
-    active: boolean,
-    choosed: boolean,
-    isStart: boolean,
-    isEnd: boolean,
-    isToday: boolean,
+    value: number;
+    active: boolean;
+    choosed: boolean;
+    isStart: boolean;
+    isEnd: boolean;
+    isToday: boolean;
   }
 
   interface Emits {
-    (e: 'change', value: number[]): void
+    (e: 'change', value: number[]): void;
   }
 
   const emits = defineEmits<Emits>();
 
   function generateList() {
-    return new Array(31).fill(0)
-      .reduce((results, item, index) => {
-        const date = index + 1;
-        const isToday = date === todayDate;
-        const obj = {
-          value: date,
-          active: false,
-          choosed: false,
-          isStart: false,
-          isEnd: false,
-          isToday,
-        };
-        results.push(obj);
-        return results;
-      }, []) as ListItem[];
+    return new Array(31).fill(0).reduce((results, item, index) => {
+      const date = index + 1;
+      const isToday = date === todayDate;
+      const obj = {
+        value: date,
+        active: false,
+        choosed: false,
+        isStart: false,
+        isEnd: false,
+        isToday,
+      };
+      results.push(obj);
+      return results;
+    }, []) as ListItem[];
   }
 
   const showPanel = ref(false);
@@ -86,14 +84,19 @@
 
   const selectList = ref(generateList());
 
-  const selectedValue = computed(() => selectList.value.filter(item => item.choosed || item.active)
-    .map(item => item.value));
-
-  watch(selectedValue, (list) => {
-    emits('change', list);
-  }, {
-    immediate: true,
-  });
+  const selectedValue = computed(() =>
+    selectList.value.filter((item) => item.choosed || item.active).map((item) => item.value),
+  );
+
+  watch(
+    selectedValue,
+    (list) => {
+      emits('change', list);
+    },
+    {
+      immediate: true,
+    },
+  );
 
   const handleClickNum = (index: number) => {
     if (choosedIndexArr.length === 2) {
diff --git a/dbm-ui/frontend/src/views/quick-search/Index.vue b/dbm-ui/frontend/src/views/quick-search/Index.vue
index 0b862b4d5c..e44e529165 100644
--- a/dbm-ui/frontend/src/views/quick-search/Index.vue
+++ b/dbm-ui/frontend/src/views/quick-search/Index.vue
@@ -142,7 +142,7 @@
     {} as Record<number, string>,
   );
 
-  const keyword = ref(route.query.keyword as string || '');
+  const keyword = ref((route.query.keyword as string) || '');
   const isTableSearching = ref(false);
   const dataMap = ref<Omit<ServiceReturnType<typeof quickSearch>, 'machine'>>({
     cluster_name: [],
@@ -234,18 +234,22 @@
       panelList[4].count = data.task.length;
       panelList[5].count = data.ticket.length;
 
-      const panelItem = panelList.find(panel => panel.count > 0);
+      const panelItem = panelList.find((panel) => panel.count > 0);
       if (panelItem) {
         activeTab.value = panelItem.name;
       }
     },
   });
 
-  watch(formData, () => {
-    handleSearch();
-  }, {
-    deep: true,
-  });
+  watch(
+    formData,
+    () => {
+      handleSearch();
+    },
+    {
+      deep: true,
+    },
+  );
 
   watch(keyword, (newKeyword, oldKeyword) => {
     const newKeywordArr = newKeyword.split(batchSplitRegex);
diff --git a/dbm-ui/frontend/src/views/quick-search/components/ClusterDomain.vue b/dbm-ui/frontend/src/views/quick-search/components/ClusterDomain.vue
index 9d05882fb0..496cd1faac 100644
--- a/dbm-ui/frontend/src/views/quick-search/components/ClusterDomain.vue
+++ b/dbm-ui/frontend/src/views/quick-search/components/ClusterDomain.vue
@@ -11,7 +11,7 @@
           <I18nT
             class="ml-8"
             keypath="共n条"
-            style="color: #63656E;"
+            style="color: #63656e"
             tag="span">
             <template #n>
               <strong>{{ item.dataList.length }}</strong>
@@ -61,7 +61,7 @@
   import { UserPersonalSettings } from '@common/const';
   import { batchSplitRegex } from '@common/regex';
 
-  import RenderClusterStatus from '@components/cluster-common/RenderStatus.vue';
+  import RenderClusterStatus from '@components/cluster-status/Index.vue';
   import EmptyStatus from '@components/empty-status/EmptyStatus.vue';
   import HightLightText from '@components/system-search/components/search-result/render-result/components/HightLightText.vue';
   import { useRedirect } from '@components/system-search/hooks/useRedirect';
diff --git a/dbm-ui/frontend/src/views/quick-search/components/ClusterName.vue b/dbm-ui/frontend/src/views/quick-search/components/ClusterName.vue
index d44d3d72cf..b8a48048ef 100644
--- a/dbm-ui/frontend/src/views/quick-search/components/ClusterName.vue
+++ b/dbm-ui/frontend/src/views/quick-search/components/ClusterName.vue
@@ -11,7 +11,7 @@
           <I18nT
             class="ml-8"
             keypath="共n条"
-            style="color: #63656E;"
+            style="color: #63656e"
             tag="span">
             <template #n>
               <strong>{{ item.dataList.length }}</strong>
@@ -60,7 +60,7 @@
 
   import { UserPersonalSettings } from '@common/const';
 
-  import RenderClusterStatus from '@components/cluster-common/RenderStatus.vue';
+  import RenderClusterStatus from '@components/cluster-status/Index.vue';
   import EmptyStatus from '@components/empty-status/EmptyStatus.vue';
   import HightLightText from '@components/system-search/components/search-result/render-result/components/HightLightText.vue';
   import { useRedirect } from '@components/system-search/hooks/useRedirect';
diff --git a/dbm-ui/frontend/src/views/quick-search/components/ResourcePool.vue b/dbm-ui/frontend/src/views/quick-search/components/ResourcePool.vue
index 8dcf4e38fd..ee64259631 100644
--- a/dbm-ui/frontend/src/views/quick-search/components/ResourcePool.vue
+++ b/dbm-ui/frontend/src/views/quick-search/components/ResourcePool.vue
@@ -9,7 +9,7 @@
         <I18nT
           class="ml-8"
           keypath="共n条"
-          style="color: #63656E;"
+          style="color: #63656e"
           tag="span">
           <template #n>
             <strong>{{ data.length }}</strong>
@@ -47,9 +47,9 @@
 
   import { UserPersonalSettings } from '@common/const';
 
-  import HostAgentStatus from '@components/cluster-common/HostAgentStatus.vue';
   import DiskPopInfo from '@components/disk-pop-info/DiskPopInfo.vue';
   import EmptyStatus from '@components/empty-status/EmptyStatus.vue';
+  import HostAgentStatus from '@components/host-agent-status/Index.vue';
   import HightLightText from '@components/system-search/components/search-result/render-result/components/HightLightText.vue';
   import TextOverflowLayout from '@components/text-overflow-layout/Index.vue';
 
diff --git a/dbm-ui/frontend/src/views/quick-search/components/SearchInput.vue b/dbm-ui/frontend/src/views/quick-search/components/SearchInput.vue
index 4dbcba4930..3940497d38 100644
--- a/dbm-ui/frontend/src/views/quick-search/components/SearchInput.vue
+++ b/dbm-ui/frontend/src/views/quick-search/components/SearchInput.vue
@@ -63,10 +63,7 @@
 </template>
 
 <script setup lang="ts">
-  import tippy, {
-    type Instance,
-    type SingleTarget,
-  } from 'tippy.js';
+  import tippy, { type Instance, type SingleTarget } from 'tippy.js';
   import { useI18n } from 'vue-i18n';
 
   import { batchSplitRegex } from '@common/regex';
diff --git a/dbm-ui/frontend/src/views/quick-search/components/Ticket.vue b/dbm-ui/frontend/src/views/quick-search/components/Ticket.vue
index 31aa000111..d8a43079e2 100644
--- a/dbm-ui/frontend/src/views/quick-search/components/Ticket.vue
+++ b/dbm-ui/frontend/src/views/quick-search/components/Ticket.vue
@@ -9,7 +9,7 @@
         <I18nT
           class="ml-8"
           keypath="共n条"
-          style="color: #63656E;"
+          style="color: #63656e"
           tag="span">
           <template #n>
             <strong>{{ data.length }}</strong>
diff --git a/dbm-ui/frontend/src/views/resource-manage/pool/Index.vue b/dbm-ui/frontend/src/views/resource-manage/pool/Index.vue
index f75bfb8a5a..5dffe2d9ba 100644
--- a/dbm-ui/frontend/src/views/resource-manage/pool/Index.vue
+++ b/dbm-ui/frontend/src/views/resource-manage/pool/Index.vue
@@ -97,8 +97,8 @@
     removeResource,
   } from '@services/source/dbresourceResource';
 
-  import HostAgentStatus from '@components/cluster-common/HostAgentStatus.vue';
   import DiskPopInfo from '@components/disk-pop-info/DiskPopInfo.vue';
+  import HostAgentStatus from '@components/host-agent-status/Index.vue';
 
   import {
     execCopy,
diff --git a/dbm-ui/frontend/src/views/resource-manage/pool/components/search-box/components/com-factory/components/Hosts.vue b/dbm-ui/frontend/src/views/resource-manage/pool/components/search-box/components/com-factory/components/Hosts.vue
index 9d8f045253..b346798f5d 100644
--- a/dbm-ui/frontend/src/views/resource-manage/pool/components/search-box/components/com-factory/components/Hosts.vue
+++ b/dbm-ui/frontend/src/views/resource-manage/pool/components/search-box/components/com-factory/components/Hosts.vue
@@ -50,7 +50,7 @@
     if (!_.trim(text)) {
       return [];
     }
-    return text.split(batchSplitRegex).map(item => ({
+    return text.split(batchSplitRegex).map((item) => ({
       id: item,
       name: item,
     }));
diff --git a/dbm-ui/frontend/src/views/resource-manage/pool/components/search-box/components/field-tag/ValueTag.vue b/dbm-ui/frontend/src/views/resource-manage/pool/components/search-box/components/field-tag/ValueTag.vue
index d1a521452d..0f8f4ff1cb 100644
--- a/dbm-ui/frontend/src/views/resource-manage/pool/components/search-box/components/field-tag/ValueTag.vue
+++ b/dbm-ui/frontend/src/views/resource-manage/pool/components/search-box/components/field-tag/ValueTag.vue
@@ -71,18 +71,8 @@
   export default {};
 </script>
 <script setup lang="ts">
-  import tippy, {
-    type Instance,
-    type SingleTarget,
-  } from 'tippy.js';
-  import {
-    computed,
-    onBeforeUnmount,
-    onMounted,
-    ref,
-    shallowRef,
-    watch,
-  } from 'vue';
+  import tippy, { type Instance, type SingleTarget } from 'tippy.js';
+  import { computed, onBeforeUnmount, onMounted, ref, shallowRef, watch } from 'vue';
   import { useI18n } from 'vue-i18n';
 
   import ComFactory from '../com-factory/Index.vue';
@@ -91,13 +81,13 @@
 
   interface Props {
     name: string;
-    value: any,
-    model: Record<string, any>
+    value: any;
+    model: Record<string, any>;
   }
 
   interface Emits {
-    (e: 'remove', name: string): void
-    (e: 'change', name: string, value: any): void
+    (e: 'remove', name: string): void;
+    (e: 'change', name: string, value: any): void;
   }
 
   const props = defineProps<Props>();
@@ -151,15 +141,20 @@
     return valueList.join(', ');
   });
 
-  watch(() => props.model, () => {
-    localModel.value = { ...props.model };
-  }, {
-    immediate: true,
-  });
+  watch(
+    () => props.model,
+    () => {
+      localModel.value = { ...props.model };
+    },
+    {
+      immediate: true,
+    },
+  );
 
   if (config.service) {
     isRemoteOriginLoading.value = true;
-    config.service(props.value)
+    config
+      .service(props.value)
       .then((data) => {
         remoteOriginalList.value = Array.isArray(data) ? data : [data];
       })
@@ -186,13 +181,12 @@
 
   // 提交编辑状态
   const handleSubmit = () => {
-    inputRef.value.getValue()
-      .then(() => {
-        if (valueMemo !== undefined) {
-          emits('change', props.name, valueMemo);
-        }
-        tippyIns.hide();
-      });
+    inputRef.value.getValue().then(() => {
+      if (valueMemo !== undefined) {
+        emits('change', props.name, valueMemo);
+      }
+      tippyIns.hide();
+    });
   };
 
   // 取消
diff --git a/dbm-ui/frontend/src/views/resource-manage/routes.ts b/dbm-ui/frontend/src/views/resource-manage/routes.ts
index 400dc084fc..22252aa739 100644
--- a/dbm-ui/frontend/src/views/resource-manage/routes.ts
+++ b/dbm-ui/frontend/src/views/resource-manage/routes.ts
@@ -23,7 +23,7 @@ const resourcePoolRoute = {
     navName: t('DB 资源池'),
   },
   component: () => import('@views/resource-manage/pool/Index.vue'),
-}
+};
 
 const resourcePoolOperationRecordRoute = {
   name: 'resourcePoolOperationRecord',
@@ -32,7 +32,7 @@ const resourcePoolOperationRecordRoute = {
     navName: t('资源操作记录'),
   },
   component: () => import('@views/resource-manage/record/Index.vue'),
-}
+};
 
 const resourcePoolDirtyMachinesRoute = {
   name: 'resourcePoolDirtyMachines',
@@ -41,7 +41,7 @@ const resourcePoolDirtyMachinesRoute = {
     navName: t('污点主机处理'),
   },
   component: () => import('@views/resource-manage/dirty-machine/Index.vue'),
-}
+};
 
 const resourceSpecRoute = {
   name: 'resourceSpec',
@@ -51,7 +51,7 @@ const resourceSpecRoute = {
     fullscreen: true,
   },
   component: () => import('@views/resource-manage/spec/Index.vue'),
-}
+};
 
 const mainRoute = [
   {
@@ -65,7 +65,6 @@ const mainRoute = [
   },
 ];
 
-
 export default function getRoutes() {
   let existResourcePool = false;
 
diff --git a/dbm-ui/frontend/src/views/resource-manage/spec/hooks/useHasQPS.ts b/dbm-ui/frontend/src/views/resource-manage/spec/hooks/useHasQPS.ts
index b686a444ab..2231634c2f 100644
--- a/dbm-ui/frontend/src/views/resource-manage/spec/hooks/useHasQPS.ts
+++ b/dbm-ui/frontend/src/views/resource-manage/spec/hooks/useHasQPS.ts
@@ -9,7 +9,7 @@
  * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed
  * on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for
  * the specific language governing permissions and limitations under the License.
-*/
+ */
 
 import { computed } from 'vue';
 
@@ -23,10 +23,7 @@ const hasQPSClusterTypes = [
   `${ClusterTypes.MONGODB}_shardSvr`,
 ];
 
-export const useHasQPS = (props: {
-  clusterType: string,
-  machineType: string
-}) => {
+export const useHasQPS = (props: { clusterType: string; machineType: string }) => {
   const hasQPS = computed(() => hasQPSClusterTypes.includes(`${props.clusterType}_${props.machineType}`));
 
   return { hasQPS };
diff --git a/dbm-ui/frontend/src/views/service-apply/create-db-module/Index.vue b/dbm-ui/frontend/src/views/service-apply/create-db-module/Index.vue
index 34bcce8d08..8a5b39ec52 100644
--- a/dbm-ui/frontend/src/views/service-apply/create-db-module/Index.vue
+++ b/dbm-ui/frontend/src/views/service-apply/create-db-module/Index.vue
@@ -135,10 +135,9 @@
 
   import { mysqlType, type MysqlTypeString } from '@common/const';
 
-  import DeployVersion from '@components/apply-items/DeployVersion.vue';
-
   import ParameterTable from '@views/db-configure/components/ParameterTable.vue';
   import { type DiffItem, useDiff } from '@views/db-configure/hooks/useDiff';
+  import DeployVersion from '@views/db-manage/common/apply-items/DeployVersion.vue';
 
   type ParameterConfigItem = ServiceReturnType<typeof getLevelConfig>['conf_items'][number];
 
diff --git a/dbm-ui/frontend/src/views/service-apply/create-db-module/SqlServerCreateDbModule.vue b/dbm-ui/frontend/src/views/service-apply/create-db-module/SqlServerCreateDbModule.vue
index 421e5f4471..43f4177ef3 100644
--- a/dbm-ui/frontend/src/views/service-apply/create-db-module/SqlServerCreateDbModule.vue
+++ b/dbm-ui/frontend/src/views/service-apply/create-db-module/SqlServerCreateDbModule.vue
@@ -178,7 +178,7 @@
 
   import { sqlServerType } from '@common/const';
 
-  import DeployVersion from '@components/apply-items/DeployVersion.vue';
+  import DeployVersion from '@views/db-manage/common/apply-items/DeployVersion.vue';
 
   import { messageSuccess } from '@utils';
 
diff --git a/dbm-ui/frontend/src/views/staff-manage/routes.ts b/dbm-ui/frontend/src/views/staff-manage/routes.ts
index 6a6180252e..8bc3d7e522 100644
--- a/dbm-ui/frontend/src/views/staff-manage/routes.ts
+++ b/dbm-ui/frontend/src/views/staff-manage/routes.ts
@@ -24,7 +24,7 @@ const staffManageRoute = {
     fullScreen: true,
   },
   component: () => import('@views/staff-manage/Index.vue'),
-}
+};
 
 const platformStaffManageRoute = {
   name: 'PlatformStaffManage',
@@ -33,7 +33,7 @@ const platformStaffManageRoute = {
     navName: t('DBA人员管理'),
   },
   component: () => import('@views/staff-manage/Index.vue'),
-}
+};
 
 export default function getRoutes() {
   const routes: RouteRecordRaw[] = [];
diff --git a/dbm-ui/frontend/src/views/task-history/common/types.ts b/dbm-ui/frontend/src/views/task-history/common/types.ts
index 5eb9d1be3b..787a67710c 100644
--- a/dbm-ui/frontend/src/views/task-history/common/types.ts
+++ b/dbm-ui/frontend/src/views/task-history/common/types.ts
@@ -13,9 +13,9 @@
 
 // import type { DatePickerValueType } from 'bkui-vue/lib/date-picker/interface';
 
-import TaskFlowModel from '@services/model/taskflow/taskflow';
+import type { ISearchValue } from 'bkui-vue/lib/search-select/utils';
 
-import type { SearchSelectValues } from '@/types/bkui-vue';
+import TaskFlowModel from '@services/model/taskflow/taskflow';
 
 /**
  * 任务历史列表基础 state
@@ -25,6 +25,6 @@ export interface ListState {
   ticketTypes: Array<{ id: string; name: string }>;
   filter: {
     daterange: [string, string];
-    searchValues?: SearchSelectValues;
+    searchValues?: ISearchValue[];
   };
 }
diff --git a/dbm-ui/frontend/src/components/minimap/Minimap.vue b/dbm-ui/frontend/src/views/task-history/components/Minimap.vue
similarity index 100%
rename from dbm-ui/frontend/src/components/minimap/Minimap.vue
rename to dbm-ui/frontend/src/views/task-history/components/Minimap.vue
diff --git a/dbm-ui/frontend/src/views/task-history/components/PreviewHost.vue b/dbm-ui/frontend/src/views/task-history/components/PreviewHost.vue
index 5838b844a6..02ade84a6e 100644
--- a/dbm-ui/frontend/src/views/task-history/components/PreviewHost.vue
+++ b/dbm-ui/frontend/src/views/task-history/components/PreviewHost.vue
@@ -54,13 +54,12 @@
   import { useRequest } from 'vue-request';
 
   import { getHostDetails } from '@services/source/ipchooser';
+  import type { HostDetails } from '@services/types';
 
   import { useCopy } from '@hooks';
 
   import DbStatus from '@components/db-status/index.vue';
 
-  import type { TableColumnRender } from '@/types/bkui-vue';
-
   interface Props {
     hostIds: number[],
     // bizId: number,
@@ -83,44 +82,44 @@
   }, {
     label: 'IPv6',
     field: 'ipv6',
-    render: ({ cell }: TableColumnRender) => <span>{cell || '--'}</span>,
+    render: ({ data }: {data: HostDetails}) => data.ipv6 || '--',
   }, {
     label: t('管控区域'),
     field: 'bk_cloud_name',
-    render: ({ cell }: any) => <span>{cell?.name || '--'}</span>,
+    render: ({ data }: {data: HostDetails}) => data.cloud_area.name || '--',
   }, {
     label: t('Agent状态'),
     field: 'alive',
-    render: ({ cell }: { cell: number }) => {
-      if (typeof cell !== 'number') return '--';
+    render: ({ data }: {data: HostDetails}) => {
+      if (typeof data.alive !== 'number') return '--';
 
       const text = [t('异常'), t('正常')];
-      return <DbStatus theme={cell === 1 ? 'success' : 'danger'}>{text[cell]}</DbStatus>;
+      return <DbStatus theme={data.alive === 1 ? 'success' : 'danger'}>{text[data.alive]}</DbStatus>;
     },
   }, {
     label: t('主机名称'),
-    field: 'bk_host_name',
-    render: ({ cell }: TableColumnRender) => <span>{cell || '--'}</span>,
+    field: 'host_name',
+    render: ({ data }: {data: HostDetails}) => data.host_name || '--',
   }, {
     label: t('OS名称'),
-    field: 'bk_os_name',
-    render: ({ cell }: TableColumnRender) => <span>{cell || '--'}</span>,
+    field: 'os_name',
+    render: ({ data }: {data: HostDetails}) => data.os_name || '--',
   }, {
     label: t('所属云厂商'),
-    field: 'bk_cloud_vendor',
-    render: ({ cell }: TableColumnRender) => <span>{cell || '--'}</span>,
+    field: 'cloud_vendor',
+    render: ({ data }: {data: HostDetails}) => data.cloud_vendor || '--',
   }, {
     label: t('OS类型'),
-    field: 'bk_os_type',
-    render: ({ cell }: TableColumnRender) => <span>{cell || '--'}</span>,
+    field: 'os_type',
+    render: ({ data }: {data: HostDetails}) => data.os_type || '--',
   }, {
     label: t('主机ID'),
-    field: 'bk_host_id',
-    render: ({ cell }: TableColumnRender) => <span>{cell || '--'}</span>,
+    field: 'host_id',
+    render: ({ data }: {data: HostDetails}) => data.host_id || '--',
   }, {
     label: 'Agent ID',
-    field: 'bk_agent_id',
-    render: ({ cell }: TableColumnRender) => <span>{cell || '--'}</span>,
+    field: 'agent_id',
+    render: ({ data }: {data: HostDetails}) => data.agent_id || '--',
   }];
   const settings = {
     fields: columns.map(item => ({
@@ -154,17 +153,8 @@
       mode: 'all',
       host_list: props.hostIds.map(hostId => ({
         host_id: hostId,
-        // meta: {
-        //   bk_biz_id: props.bizId,
-        //   scope_id: props.bizId,
-        //   scope_type: 'biz',
-        // },
       })),
       scope_list: [],
-      // scope_list: [{
-      //   scope_id: props.bizId,
-      //   scope_type: 'biz',
-      // }],
     });
   };
 
diff --git a/dbm-ui/frontend/src/views/task-history/components/RedisResultFiles.vue b/dbm-ui/frontend/src/views/task-history/components/RedisResultFiles.vue
index 87fc842575..1d1cb6e08c 100644
--- a/dbm-ui/frontend/src/views/task-history/components/RedisResultFiles.vue
+++ b/dbm-ui/frontend/src/views/task-history/components/RedisResultFiles.vue
@@ -78,8 +78,6 @@
 
   import { downloadUrl, generateBkRepoDownloadUrl,messageWarn } from '@utils';
 
-  import type { TableSelectionData } from '@/types/bkui-vue';
-
   type KeyFileItem = ServiceReturnType<typeof getKeyFiles>[number]
 
   interface Props {
@@ -222,28 +220,34 @@
   /**
    * 表格选中
    */
-  function handleTableSelected({ isAll, checked, data, row }: TableSelectionData<KeyFileItem>) {
-    // 全选 checkbox 切换
-    if (isAll) {
-      state.selected = checked ? [...data] : [];
-      return;
-    }
+  function handleTableSelected({ isAll, checked, data, row }: {
+    checked: boolean;
+    data: KeyFileItem[];
+    index: number;
+    isAll: boolean;
+    row: KeyFileItem
+  }) {
+      // 全选 checkbox 切换
+      if (isAll) {
+        state.selected = checked ? [...data] : [];
+        return;
+      }
 
-    // 单选 checkbox 选中
-    if (checked) {
-      const toggleIndex = state.selected.findIndex(item => item.domain === row.domain);
-      if (toggleIndex === -1) {
-        state.selected.push(row);
+      // 单选 checkbox 选中
+      if (checked) {
+        const toggleIndex = state.selected.findIndex(item => item.domain === row.domain);
+        if (toggleIndex === -1) {
+          state.selected.push(row);
+        }
+        return;
       }
-      return;
-    }
 
-    // 单选 checkbox 取消选中
-    const toggleIndex = state.selected.findIndex(item => item.domain === row.domain);
-    if (toggleIndex > -1) {
-      state.selected.splice(toggleIndex, 1);
+      // 单选 checkbox 取消选中
+      const toggleIndex = state.selected.findIndex(item => item.domain === row.domain);
+      if (toggleIndex > -1) {
+        state.selected.splice(toggleIndex, 1);
+      }
     }
-  }
 
   /**
    * 打包下载文件
diff --git a/dbm-ui/frontend/src/views/task-history/pages/Details.vue b/dbm-ui/frontend/src/views/task-history/pages/Details.vue
index e7da062de6..789fa42ef9 100644
--- a/dbm-ui/frontend/src/views/task-history/pages/Details.vue
+++ b/dbm-ui/frontend/src/views/task-history/pages/Details.vue
@@ -372,7 +372,6 @@
   import EditInfo, {
     type InfoColumn,
   } from '@components/editable-info/index.vue';
-  import Minimap from '@components/minimap/Minimap.vue';
 
   import {
     generateId,
@@ -389,6 +388,7 @@
     type GraphLine,
     type GraphNode,
   } from '../common/utils';
+  import Minimap from '../components/Minimap.vue';
   import NodeLog from '../components/NodeLog.vue';
   import HostPreview from '../components/PreviewHost.vue';
   import PreviewNodeTree from '../components/PreviewNodeTree.vue';
diff --git a/dbm-ui/frontend/src/views/task-history/pages/index.vue b/dbm-ui/frontend/src/views/task-history/pages/index.vue
index f2fe22ced4..8c8c22d286 100644
--- a/dbm-ui/frontend/src/views/task-history/pages/index.vue
+++ b/dbm-ui/frontend/src/views/task-history/pages/index.vue
@@ -73,8 +73,6 @@
   import type { ListState } from '../common/types';
   import RedisResultFiles from '../components/RedisResultFiles.vue';
 
-  import type { TableColumnRender } from '@/types/bkui-vue';
-
   const route = useRoute();
   const { t } = useI18n();
 
@@ -154,7 +152,7 @@
       label: 'ID',
       field: 'root_id',
       fixed: 'left',
-      render: ({ cell, data }: TableColumnRender) => (
+      render: ({ data }: { data: TaskFlowModel }) => (
         <auth-router-link
           action-id="flow_detail"
           resource={data.root_id}
@@ -168,7 +166,7 @@
               from: route.name,
             },
           }}>
-          { cell }
+          { data.root_id }
         </auth-router-link>
       ),
     },
diff --git a/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/bigdata/Replace.vue b/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/bigdata/Replace.vue
index b455284444..30f763db66 100644
--- a/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/bigdata/Replace.vue
+++ b/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/bigdata/Replace.vue
@@ -25,8 +25,6 @@
 
   import { useCopy } from '@hooks';
 
-  import type { IHostTableData } from '@components/cluster-common/big-data-host-table/HdfsHostTable.vue';
-
   interface Props {
     ticketDetails: TicketDetails<BigDataReplaceDetails>
   }
@@ -128,7 +126,7 @@
       const key = item[0];
       const value = item[1];
       if (value.length) {
-        const data = value.map((key: IHostTableData) => key.ip);
+        const data = value.map((key: any) => key.ip);
         nodeList.push({ key, value: data });
       }
     });
diff --git a/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/components/import-sqlfile/Index.vue b/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/components/import-sqlfile/Index.vue
index 1d8e54ae51..675b111093 100644
--- a/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/components/import-sqlfile/Index.vue
+++ b/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/components/import-sqlfile/Index.vue
@@ -121,7 +121,7 @@
 
   import { TicketTypes } from '@common/const';
 
-  import RenderClusterStatus from '@components/cluster-common/RenderStatus.vue';
+  import RenderClusterStatus from '@components/cluster-status/Index.vue';
 
   import InfoList, {
     Item as InfoItem,
diff --git a/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/mongodb/AuthorizeRules.vue b/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/mongodb/AuthorizeRules.vue
index 73f81a63d0..ceff072404 100644
--- a/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/mongodb/AuthorizeRules.vue
+++ b/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/mongodb/AuthorizeRules.vue
@@ -248,7 +248,6 @@
       .cell {
         padding: 0 !important;
       }
-
     }
 
     td:first-child {
diff --git a/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/mongodb/DetailsClusterOperation.vue b/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/mongodb/DetailsClusterOperation.vue
index 507d2c3449..a1cf3467d7 100644
--- a/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/mongodb/DetailsClusterOperation.vue
+++ b/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/mongodb/DetailsClusterOperation.vue
@@ -109,5 +109,5 @@
 </script>
 
 <style lang="less" scoped>
-@import "@views/tickets/common/styles/DetailsTable.less";
+  @import '@views/tickets/common/styles/DetailsTable.less';
 </style>
diff --git a/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/mongodb/TargetClusterPreview.vue b/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/mongodb/TargetClusterPreview.vue
index 0ae1daa6b3..f1e0eda51c 100644
--- a/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/mongodb/TargetClusterPreview.vue
+++ b/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/mongodb/TargetClusterPreview.vue
@@ -57,7 +57,7 @@
 
   import { useDefaultPagination } from '@hooks';
 
-  import RenderClusterStatus from '@components/cluster-common/RenderStatus.vue';
+  import RenderClusterStatus from '@components/cluster-status/Index.vue';
 
   import { getSearchSelectorParams } from '@utils';
 
diff --git a/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/mongodb/script-execute/components/RenderFileContent.vue b/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/mongodb/script-execute/components/RenderFileContent.vue
index 5b50f2d0a8..9e2a4a1e11 100644
--- a/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/mongodb/script-execute/components/RenderFileContent.vue
+++ b/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/mongodb/script-execute/components/RenderFileContent.vue
@@ -39,24 +39,19 @@
 <script setup lang="ts">
   import * as monaco from 'monaco-editor';
   import screenfull from 'screenfull';
-  import {
-    onBeforeUnmount,
-    onMounted,
-    ref,
-    watch,
-  } from 'vue';
+  import { onBeforeUnmount, onMounted, ref, watch } from 'vue';
 
   import { getSQLFilename } from '@utils';
 
   interface Props {
-    modelValue: string,
-    title: string,
-    readonly?: boolean,
+    modelValue: string;
+    title: string;
+    readonly?: boolean;
   }
 
   interface Emits {
-    (e: 'update:modelValue', value: string): void
-    (e: 'change', value: string): void
+    (e: 'update:modelValue', value: string): void;
+    (e: 'change', value: string): void;
   }
 
   const props = withDefaults(defineProps<Props>(), {
@@ -72,15 +67,19 @@
 
   let editor: monaco.editor.IStandaloneCodeEditor;
 
-  watch(() => props.modelValue, () => {
-    setTimeout(() => {
-      if (props.modelValue !== editor.getValue()) {
-        editor.setValue(props.modelValue);
-      }
-    });
-  }, {
-    immediate: true,
-  });
+  watch(
+    () => props.modelValue,
+    () => {
+      setTimeout(() => {
+        if (props.modelValue !== editor.getValue()) {
+          editor.setValue(props.modelValue);
+        }
+      });
+    },
+    {
+      immediate: true,
+    },
+  );
 
   const handleToggleScreenfull = () => {
     if (screenfull.isFullscreen) {
@@ -143,7 +142,6 @@
     screenfull.off('change', handleToggleScreenfull);
     window.removeEventListener('resize', handleReize);
   });
-
 </script>
 <style lang="less">
   .ticket-import-sql-file-render {
diff --git a/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/mongodb/script-execute/components/SqlFileList.vue b/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/mongodb/script-execute/components/SqlFileList.vue
index b723cd4f08..1261a3897d 100644
--- a/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/mongodb/script-execute/components/SqlFileList.vue
+++ b/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/mongodb/script-execute/components/SqlFileList.vue
@@ -15,7 +15,7 @@
   <div class="sql-execute-sql-file-list">
     <div class="file-list-title">
       <span>{{ t('文件列表') }}</span>
-      <span style="font-size: 12px; font-weight: normal;color: #979ba5;">
+      <span style="font-size: 12px; font-weight: normal; color: #979ba5">
         {{ t('按顺序执行') }}
       </span>
     </div>
@@ -39,12 +39,12 @@
   import { getSQLFilename } from '@utils';
 
   interface Props {
-    modelValue: string,
-    data: Array<string>,
+    modelValue: string;
+    data: Array<string>;
   }
 
   interface Emits {
-    (e: 'update:modelValue', value: string): void,
+    (e: 'update:modelValue', value: string): void;
   }
 
   const props = defineProps<Props>();
@@ -53,18 +53,22 @@
 
   const { t } = useI18n();
 
-  const localList = ref<Array<Record<'id'|'name', string>>>([]);
-
-  watch(() => props.data, () => {
-    localList.value = props.data.map(fileName => ({
-      id: fileName,
-      name: fileName,
-    }));
-    const fileName = localList.value[0].name;
-    emits('update:modelValue', fileName);
-  }, {
-    immediate: true,
-  });
+  const localList = ref<Array<Record<'id' | 'name', string>>>([]);
+
+  watch(
+    () => props.data,
+    () => {
+      localList.value = props.data.map((fileName) => ({
+        id: fileName,
+        name: fileName,
+      }));
+      const fileName = localList.value[0].name;
+      emits('update:modelValue', fileName);
+    },
+    {
+      immediate: true,
+    },
+  );
 
   const handleClick = (fileName: string) => {
     emits('update:modelValue', fileName);
diff --git a/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/mysql/import-sql-file/components/SqlFileList.vue b/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/mysql/import-sql-file/components/SqlFileList.vue
index 74746f1356..4ff22d31e6 100644
--- a/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/mysql/import-sql-file/components/SqlFileList.vue
+++ b/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/mysql/import-sql-file/components/SqlFileList.vue
@@ -53,16 +53,20 @@
 
   const localList = ref<Array<Record<'id' | 'name', string>>>([]);
 
-  watch(() => props.data, () => {
-    localList.value = props.data.map(fileName => ({
-      id: fileName,
-      name: fileName,
-    }));
-    const fileName = props.modelValue ? props.modelValue : localList.value[0].name;
-    emits('update:modelValue', fileName);
-  }, {
-    immediate: true,
-  });
+  watch(
+    () => props.data,
+    () => {
+      localList.value = props.data.map((fileName) => ({
+        id: fileName,
+        name: fileName,
+      }));
+      const fileName = props.modelValue ? props.modelValue : localList.value[0].name;
+      emits('update:modelValue', fileName);
+    },
+    {
+      immediate: true,
+    },
+  );
 
   const handleClick = (fileName: string) => {
     emits('update:modelValue', fileName);
diff --git a/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/redis/ClusterCapacityUpdate.vue b/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/redis/ClusterCapacityUpdate.vue
index 4e396eb160..339b8842ba 100644
--- a/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/redis/ClusterCapacityUpdate.vue
+++ b/dbm-ui/frontend/src/views/tickets/common/components/demand-factory/redis/ClusterCapacityUpdate.vue
@@ -65,9 +65,9 @@
   import TicketModel from '@services/model/ticket/ticket';
   import { getRedisList } from '@services/source/redis';
 
-  import ClusterCapacityUsageRate from '@components/cluster-capacity-usage-rate/Index.vue';
   import RenderSpec from '@components/render-table/columns/spec-display/Index.vue';
 
+  import ClusterCapacityUsageRate from '@views/db-manage/common/cluster-capacity-usage-rate/Index.vue';
   import ValueDiff from '@views/db-manage/common/value-diff/Index.vue'
 
   import { convertStorageUnits } from '@utils';
diff --git a/dbm-ui/frontend/src/views/tickets/common/hooks/logCounts.ts b/dbm-ui/frontend/src/views/tickets/common/hooks/logCounts.ts
index bbf68ff35d..51fca53edd 100644
--- a/dbm-ui/frontend/src/views/tickets/common/hooks/logCounts.ts
+++ b/dbm-ui/frontend/src/views/tickets/common/hooks/logCounts.ts
@@ -82,24 +82,29 @@ export default function () {
       });
   };
 
-  watch(() => wholeLogList, () => {
-    const successLogs: any[] = [];
-    const failLogs: any[] = [];
-    wholeLogList.value.forEach((item) => {
-      const message = item.message.slice(0, 300);
-      if (message.match(fileStartReg)) {
-        successLogs.push(item);
-      }
-      if (message.match(fileEndReg)) {
-        failLogs.push(item);
-      }
-    });
-    const diffCounts = successLogs.length - failLogs.length;
-    counts.success =  successLogs.length - diffCounts;
-    counts.fail =  diffCounts === 0 ? 0 : diffCounts;
-  }, {
-    immediate: true, deep: true });
-
+  watch(
+    () => wholeLogList,
+    () => {
+      const successLogs: any[] = [];
+      const failLogs: any[] = [];
+      wholeLogList.value.forEach((item) => {
+        const message = item.message.slice(0, 300);
+        if (message.match(fileStartReg)) {
+          successLogs.push(item);
+        }
+        if (message.match(fileEndReg)) {
+          failLogs.push(item);
+        }
+      });
+      const diffCounts = successLogs.length - failLogs.length;
+      counts.success = successLogs.length - diffCounts;
+      counts.fail = diffCounts === 0 ? 0 : diffCounts;
+    },
+    {
+      immediate: true,
+      deep: true,
+    },
+  );
 
   onBeforeUnmount(() => {
     clearTimeout(logTimer);
diff --git a/dbm-ui/frontend/src/views/tickets/routes.ts b/dbm-ui/frontend/src/views/tickets/routes.ts
index b313833a9b..43d20e45f3 100644
--- a/dbm-ui/frontend/src/views/tickets/routes.ts
+++ b/dbm-ui/frontend/src/views/tickets/routes.ts
@@ -24,7 +24,7 @@ const selfServiceMyTicketsRoute = {
     fullscreen: true,
   },
   component: () => import('@views/tickets/my-tickets/Index.vue'),
-}
+};
 
 const myTodosRoute = {
   name: 'MyTodos',
@@ -34,7 +34,7 @@ const myTodosRoute = {
     fullscreen: true,
   },
   component: () => import('@views/tickets/my-todos/Index.vue'),
-}
+};
 
 export default function getRoutes() {
   const routes: RouteRecordRaw[] = [];
diff --git a/dbm-ui/frontend/src/views/whitelist/routes.ts b/dbm-ui/frontend/src/views/whitelist/routes.ts
index 1da6c4786b..c913537425 100644
--- a/dbm-ui/frontend/src/views/whitelist/routes.ts
+++ b/dbm-ui/frontend/src/views/whitelist/routes.ts
@@ -30,4 +30,3 @@ const routes: RouteRecordRaw[] = [
 export default function getRoutes() {
   return checkDbConsole('globalConfigManage.whitelistManage') ? routes : [];
 }
-
diff --git a/dbm-ui/frontend/tsconfig.json b/dbm-ui/frontend/tsconfig.json
index 3cc7857c99..f79d7a105c 100644
--- a/dbm-ui/frontend/tsconfig.json
+++ b/dbm-ui/frontend/tsconfig.json
@@ -1,6 +1,6 @@
 {
   "extends": "@vue/tsconfig/tsconfig.dom.json",
-  "include": ["env.d.ts","components.d.ts", "src/**/*", "src/**/*.vue"],
+  "include": ["env.d.ts","components.d.ts", "src/**/*", "src/**/*.vue", "vite.config.*"],
   "compilerOptions": {
     "composite": true,
     "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
diff --git a/dbm-ui/frontend/vite.config.mts b/dbm-ui/frontend/vite.config.mts
index 26cdc9f9fa..fd96c78a5b 100644
--- a/dbm-ui/frontend/vite.config.mts
+++ b/dbm-ui/frontend/vite.config.mts
@@ -22,9 +22,6 @@ import basicSsl from '@vitejs/plugin-basic-ssl';
 import vue from '@vitejs/plugin-vue';
 import vueJsx from '@vitejs/plugin-vue-jsx';
 
-// 用于判断前端资源更新
-const uniqueKey = `${new Date().getTime()}.1e78f18e-01c1-11ed-b939-0242ac120002`;
-
 export default defineConfig(({ mode }) => {
   const env = loadEnv(mode, process.cwd());
   const isHttps = mode === 'https';
@@ -84,7 +81,6 @@ export default defineConfig(({ mode }) => {
           {
             src: 'src/images/monitoring.png',
             dest: './',
-            rename: uniqueKey,
           },
           {
             src: 'lib',
@@ -110,7 +106,7 @@ export default defineConfig(({ mode }) => {
         '/bkrepo_upload': {
           target: '', // 见获取bkrepo上传凭证接口
           changeOrigin: true,
-          rewrite: path => path.replace(/^\/bkrepo_upload/, ''),
+          rewrite: (path) => path.replace(/^\/bkrepo_upload/, ''),
         },
       },
     },