From 461720e14dacb228f8cc0c4befe21df5497008b6 Mon Sep 17 00:00:00 2001 From: Austin <1344583166@qq.com> Date: Thu, 28 Mar 2024 20:06:36 +0800 Subject: [PATCH] =?UTF-8?q?feat(frontend):=20mysql=E3=80=81redis=E9=9B=86?= =?UTF-8?q?=E7=BE=A4=E5=92=8C=E5=AE=9E=E4=BE=8B=E5=88=97=E8=A1=A8=E6=90=9C?= =?UTF-8?q?=E7=B4=A2=E5=A2=9E=E5=BC=BA=20#3756=20#=20Reviewed,=20transacti?= =?UTF-8?q?on=20id:=204844?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../cluster-authorize/ClusterAuthorize.vue | 3 +- .../components/common/SearchBar.vue | 77 - .../cluster-selector/ClusterSelector.vue | 617 -- .../cluster-selector/CollapseMini.vue | 105 - .../Index.vue | 215 +- .../SpiderClusterSelector.vue | 666 -- .../cluster-relate-tasks/Index.vue | 69 - .../cluster-relate-tasks/TaskItem.vue | 87 - .../components/common/SearchBar.vue | 94 + .../common/result-preview/CollapseMini.vue | 30 +- .../common/result-preview/Index.vue | 10 +- .../components/common/task-panel/Index.vue | 0 .../components/common/task-panel/Item.vue | 6 +- .../components/redis/Index.vue | 104 +- .../components/redis/useClusterData.ts | 4 +- .../components/tendb-cluster/Index.vue | 105 +- .../tendb-cluster/useClusterData.ts | 4 +- .../components/tendb-single}/Index.vue | 84 +- .../tendb-single}/useClusterData.ts | 4 +- .../components/tendbha/Index.vue | 369 ++ .../tendbha/useClusterData.ts} | 48 +- .../src/components/cluster-selector/types.ts | 36 - .../cluster-selector/useClusterData.ts | 114 - .../src/components/db-table/OriginalTable.vue | 13 +- .../src/components/db-table/index.vue | 19 +- .../components/instance-selector/Index.vue | 70 +- .../components/common/SearchBar.vue | 68 + .../common/manual-content/Index.vue | 4 +- .../common/manual-content/table/Index.vue | 141 +- .../manual-content/table/useTableData.ts | 103 - .../common/preview-result/Index.vue | 6 +- .../components/mysql/Index.vue | 10 +- .../components/mysql/table/Index.vue | 85 +- .../components/mysql/table/useTableData.ts | 15 +- .../components/mysql/useTopoData.ts | 2 +- .../components/redis/Index.vue | 10 +- .../components/redis/table/Index.vue | 7 +- .../components/tendb-cluster/Index.vue | 10 +- .../components/tendb-cluster/table/Index.vue | 7 +- .../components/tendb-cluster/useTopoData.ts | 2 +- dbm-ui/frontend/src/hooks/index.ts | 1 + .../src/hooks/useLinkQueryColumnSerach.ts | 160 + dbm-ui/frontend/src/locales/zh-cn.json | 5452 +++++++++-------- dbm-ui/frontend/src/services/source/dbbase.ts | 25 + .../src/services/source/mysqlCluster.ts | 4 +- dbm-ui/frontend/src/services/source/redis.ts | 69 +- .../src/services/source/redisToolbox.ts | 29 + .../src/utils/getSearchSelectorParams.ts | 3 +- .../es-manage/list/components/list/Index.vue | 175 +- .../list/components/list/Index.vue | 165 +- .../components/render-group/Index.vue | 14 + .../components/render-list/Index.vue | 149 +- .../list/components/list/Index.vue | 172 +- .../src/views/mysql/checksum/Index.vue | 68 +- .../mysql/db-backup/pages/page1/Index.vue | 19 +- .../pages/page1/components/TargetCluster.vue | 194 - .../src/views/mysql/db-clear/index.vue | 57 +- .../src/views/mysql/db-rename/index.vue | 47 +- .../db-table-backup/pages/page1/Index.vue | 49 +- .../components/receiver-data/Index.vue | 2 +- .../mysql/flashback/pages/page1/Index.vue | 54 +- .../mysql/ha-cluster-list/components/List.vue | 246 +- .../ha-instance-list/components/List.vue | 122 +- .../master-slave-clone/pages/page1/Index.vue | 36 +- .../components/target-cluster/Index.vue | 2 +- .../mysql/proxy-add/pages/page1/Index.vue | 50 +- .../mysql/rollback/pages/page1/Index.vue | 48 +- .../single-cluster-list/components/List.vue | 201 +- .../src/views/mysql/slave-add/index.vue | 45 +- .../steps/step1/components/TargetCluster.vue | 37 +- .../list/components/list/Index.vue | 205 +- .../capacity-change/pages/page1/Index.vue | 2 +- .../pages/page1/Index.vue | 2 +- .../cluster-type-update/pages/page1/Index.vue | 2 +- .../redis/common/edit-field/ClusterName.vue | 4 +- .../pages/page1/components/RenderHost.vue | 2 +- .../page1/components/cross-business/Index.vue | 16 +- .../components/intra-business-third/Index.vue | 16 +- .../components/within-business/Index.vue | 14 +- .../redis/db-structure/pages/page1/Index.vue | 2 +- .../redis/list/components/list/Index.vue | 242 +- .../proxy-scale-down/pages/page1/Index.vue | 2 +- .../proxy-scale-up/pages/page1/Index.vue | 2 +- .../pages/page1/Index.vue | 2 +- .../list/components/list/Index.vue | 170 +- .../add-mnt/pages/page1/Index.vue | 2 +- .../capacity-change/pages/page1/Index.vue | 2 +- .../checksum/pages/page1/Index.vue | 2 +- .../db-backup/pages/page1/Index.vue | 2 +- .../pages/page1/components/TargetCluster.vue | 200 - .../db-clear/pages/page1/Index.vue | 6 +- .../db-rename/pages/page1/Index.vue | 2 +- .../db-table-backup/pages/page1/Index.vue | 2 +- .../flashback/pages/page1/Index.vue | 2 +- .../list-instance/components/list/Index.vue | 104 +- .../list/components/list/Index.vue | 155 +- .../components/target-cluster/Index.vue | 2 +- .../proxy-scale-down/pages/page1/Index.vue | 2 +- .../proxy-scale-up/pages/page1/Index.vue | 12 +- .../proxy-slave-apply/pages/page1/Index.vue | 12 +- .../rollback/pages/page1/Index.vue | 16 +- .../steps/step1/components/TargetCluster.vue | 2 +- .../task-history/components/PreviewHost.vue | 21 +- 103 files changed, 6195 insertions(+), 6152 deletions(-) delete mode 100644 dbm-ui/frontend/src/components/cluster-selector-new/components/common/SearchBar.vue delete mode 100644 dbm-ui/frontend/src/components/cluster-selector/ClusterSelector.vue delete mode 100644 dbm-ui/frontend/src/components/cluster-selector/CollapseMini.vue rename dbm-ui/frontend/src/components/{cluster-selector-new => cluster-selector}/Index.vue (73%) delete mode 100644 dbm-ui/frontend/src/components/cluster-selector/SpiderClusterSelector.vue delete mode 100644 dbm-ui/frontend/src/components/cluster-selector/cluster-relate-tasks/Index.vue delete mode 100644 dbm-ui/frontend/src/components/cluster-selector/cluster-relate-tasks/TaskItem.vue create mode 100644 dbm-ui/frontend/src/components/cluster-selector/components/common/SearchBar.vue rename dbm-ui/frontend/src/components/{cluster-selector-new => cluster-selector}/components/common/result-preview/CollapseMini.vue (85%) rename dbm-ui/frontend/src/components/{cluster-selector-new => cluster-selector}/components/common/result-preview/Index.vue (95%) rename dbm-ui/frontend/src/components/{cluster-selector-new => cluster-selector}/components/common/task-panel/Index.vue (100%) rename dbm-ui/frontend/src/components/{cluster-selector-new => cluster-selector}/components/common/task-panel/Item.vue (90%) rename dbm-ui/frontend/src/components/{cluster-selector-new => cluster-selector}/components/redis/Index.vue (86%) rename dbm-ui/frontend/src/components/{cluster-selector-new => cluster-selector}/components/redis/useClusterData.ts (95%) rename dbm-ui/frontend/src/components/{cluster-selector-new => cluster-selector}/components/tendb-cluster/Index.vue (86%) rename dbm-ui/frontend/src/components/{cluster-selector-new => cluster-selector}/components/tendb-cluster/useClusterData.ts (95%) rename dbm-ui/frontend/src/components/{cluster-selector-new/components/tendbha => cluster-selector/components/tendb-single}/Index.vue (87%) rename dbm-ui/frontend/src/components/{cluster-selector-new/components/tendbha => cluster-selector/components/tendb-single}/useClusterData.ts (95%) create mode 100644 dbm-ui/frontend/src/components/cluster-selector/components/tendbha/Index.vue rename dbm-ui/frontend/src/components/cluster-selector/{useSpiderClusterData.ts => components/tendbha/useClusterData.ts} (74%) delete mode 100644 dbm-ui/frontend/src/components/cluster-selector/types.ts delete mode 100644 dbm-ui/frontend/src/components/cluster-selector/useClusterData.ts create mode 100644 dbm-ui/frontend/src/components/instance-selector/components/common/SearchBar.vue delete mode 100644 dbm-ui/frontend/src/components/instance-selector/components/common/manual-content/table/useTableData.ts create mode 100644 dbm-ui/frontend/src/hooks/useLinkQueryColumnSerach.ts delete mode 100644 dbm-ui/frontend/src/views/mysql/db-backup/pages/page1/components/TargetCluster.vue delete mode 100644 dbm-ui/frontend/src/views/spider-manage/db-backup/pages/page1/components/TargetCluster.vue diff --git a/dbm-ui/frontend/src/components/cluster-authorize/ClusterAuthorize.vue b/dbm-ui/frontend/src/components/cluster-authorize/ClusterAuthorize.vue index c9f9aa11c3..b577fd8657 100644 --- a/dbm-ui/frontend/src/components/cluster-authorize/ClusterAuthorize.vue +++ b/dbm-ui/frontend/src/components/cluster-authorize/ClusterAuthorize.vue @@ -173,7 +173,6 @@ TicketTypes, } from '@common/const'; - import type { ClusterSelectorResult } from '@components/cluster-selector/types'; import DBCollapseTable, { type ClusterTableProps, } from '@components/db-collapse-table/DBCollapseTable.vue'; @@ -204,6 +203,8 @@ (e: 'success'): void, } + type ClusterSelectorResult = Record> + const props = withDefaults(defineProps(), { user: '', accessDbs: () => [], diff --git a/dbm-ui/frontend/src/components/cluster-selector-new/components/common/SearchBar.vue b/dbm-ui/frontend/src/components/cluster-selector-new/components/common/SearchBar.vue deleted file mode 100644 index 14d5f639fe..0000000000 --- a/dbm-ui/frontend/src/components/cluster-selector-new/components/common/SearchBar.vue +++ /dev/null @@ -1,77 +0,0 @@ - - diff --git a/dbm-ui/frontend/src/components/cluster-selector/ClusterSelector.vue b/dbm-ui/frontend/src/components/cluster-selector/ClusterSelector.vue deleted file mode 100644 index 8b3ddecee4..0000000000 --- a/dbm-ui/frontend/src/components/cluster-selector/ClusterSelector.vue +++ /dev/null @@ -1,617 +0,0 @@ - - - - - - - - - -./useSpiderClusterData diff --git a/dbm-ui/frontend/src/components/cluster-selector/CollapseMini.vue b/dbm-ui/frontend/src/components/cluster-selector/CollapseMini.vue deleted file mode 100644 index b4de487cfa..0000000000 --- a/dbm-ui/frontend/src/components/cluster-selector/CollapseMini.vue +++ /dev/null @@ -1,105 +0,0 @@ - - - - - - - - diff --git a/dbm-ui/frontend/src/components/cluster-selector-new/Index.vue b/dbm-ui/frontend/src/components/cluster-selector/Index.vue similarity index 73% rename from dbm-ui/frontend/src/components/cluster-selector-new/Index.vue rename to dbm-ui/frontend/src/components/cluster-selector/Index.vue index 8f5d25296a..07e7905bb7 100644 --- a/dbm-ui/frontend/src/components/cluster-selector-new/Index.vue +++ b/dbm-ui/frontend/src/components/cluster-selector/Index.vue @@ -30,11 +30,11 @@ :min="300" placement="right"> - @@ -392,7 +388,7 @@ padding: 0; } - &__tabs { + .cluster-selector-tabs { height: 42px; font-size: @font-size-mini; line-height: 42px; @@ -400,7 +396,7 @@ border-bottom: 1px solid @border-disable; .flex-center(); - .tabs__item { + .tabs-item { min-width: 200px; margin-bottom: -1px; text-align: center; @@ -409,15 +405,14 @@ border-top: 0; border-left: 0; border-bottom-color: transparent; - - &--active { + } + .tabs-item-active { background-color: @bg-white; border-bottom-color: @border-white; } - } } - &__content { + .cluster-selector-content { height: 580px; padding: 16px 24px 0; @@ -428,13 +423,13 @@ } } - &__result { + .cluster-selector-result { height: 100%; padding: 12px 24px; font-size: @font-size-mini; background-color: #f5f6fa; - .result__title { + .result-title { padding-bottom: 16px; .flex-center(); @@ -444,12 +439,12 @@ color: @title-color; } - .result__dropdown { + .result-dropdown { font-size: 0; line-height: 20px; } - .result__trigger { + .result-trigger { display: block; font-size: 18px; color: @gray-color; @@ -461,37 +456,9 @@ } } } - - .result__item { - padding: 0 12px; - margin-bottom: 2px; - line-height: 32px; - background-color: @bg-white; - border-radius: 2px; - justify-content: space-between; - .flex-center(); - - .result__remove { - display: none; - font-size: @font-size-large; - font-weight: bold; - color: @gray-color; - cursor: pointer; - - &:hover { - color: @default-color; - } - } - - &:hover { - .result__remove { - display: block; - } - } - } } - &__button { + .cluster-selector-button { width: 88px; } } diff --git a/dbm-ui/frontend/src/components/cluster-selector/SpiderClusterSelector.vue b/dbm-ui/frontend/src/components/cluster-selector/SpiderClusterSelector.vue deleted file mode 100644 index 4993478715..0000000000 --- a/dbm-ui/frontend/src/components/cluster-selector/SpiderClusterSelector.vue +++ /dev/null @@ -1,666 +0,0 @@ - - - - - - -./useSpiderClusterData diff --git a/dbm-ui/frontend/src/components/cluster-selector/cluster-relate-tasks/Index.vue b/dbm-ui/frontend/src/components/cluster-selector/cluster-relate-tasks/Index.vue deleted file mode 100644 index 36702cb37e..0000000000 --- a/dbm-ui/frontend/src/components/cluster-selector/cluster-relate-tasks/Index.vue +++ /dev/null @@ -1,69 +0,0 @@ - - - - - diff --git a/dbm-ui/frontend/src/components/cluster-selector/cluster-relate-tasks/TaskItem.vue b/dbm-ui/frontend/src/components/cluster-selector/cluster-relate-tasks/TaskItem.vue deleted file mode 100644 index 17b9d21841..0000000000 --- a/dbm-ui/frontend/src/components/cluster-selector/cluster-relate-tasks/TaskItem.vue +++ /dev/null @@ -1,87 +0,0 @@ - - - - - - - diff --git a/dbm-ui/frontend/src/components/cluster-selector/components/common/SearchBar.vue b/dbm-ui/frontend/src/components/cluster-selector/components/common/SearchBar.vue new file mode 100644 index 0000000000..fe807e6906 --- /dev/null +++ b/dbm-ui/frontend/src/components/cluster-selector/components/common/SearchBar.vue @@ -0,0 +1,94 @@ + + diff --git a/dbm-ui/frontend/src/components/cluster-selector-new/components/common/result-preview/CollapseMini.vue b/dbm-ui/frontend/src/components/cluster-selector/components/common/result-preview/CollapseMini.vue similarity index 85% rename from dbm-ui/frontend/src/components/cluster-selector-new/components/common/result-preview/CollapseMini.vue rename to dbm-ui/frontend/src/components/cluster-selector/components/common/result-preview/CollapseMini.vue index c711b133ad..3f1044a3b3 100644 --- a/dbm-ui/frontend/src/components/cluster-selector-new/components/common/result-preview/CollapseMini.vue +++ b/dbm-ui/frontend/src/components/cluster-selector/components/common/result-preview/CollapseMini.vue @@ -14,11 +14,11 @@ - 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 b9502c8782..d1ae77c6f9 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 @@ -117,7 +117,7 @@ } interface Emits { - (e: 'change', value: InstanceSelectorValues): void + (e: 'change', value: Props['lastValues']): void } const props = withDefaults(defineProps(), { firsrColumn: undefined, @@ -151,7 +151,7 @@ }, }); - const handleHostChange = (values: InstanceSelectorValues) => { + const handleHostChange = (values: Props['lastValues']) => { emits('change', values); }; diff --git a/dbm-ui/frontend/src/components/instance-selector/components/common/manual-content/table/Index.vue b/dbm-ui/frontend/src/components/instance-selector/components/common/manual-content/table/Index.vue index 37fd6aec8f..ce24bf77a5 100644 --- a/dbm-ui/frontend/src/components/instance-selector/components/common/manual-content/table/Index.vue +++ b/dbm-ui/frontend/src/components/instance-selector/components/common/manual-content/table/Index.vue @@ -17,26 +17,18 @@ v-model="searchValue" clearable :placeholder="t('请输入实例')" /> - - - + - - diff --git a/dbm-ui/frontend/src/views/mysql/db-clear/index.vue b/dbm-ui/frontend/src/views/mysql/db-clear/index.vue index bc764a3992..00377bffa6 100644 --- a/dbm-ui/frontend/src/views/mysql/db-clear/index.vue +++ b/dbm-ui/frontend/src/views/mysql/db-clear/index.vue @@ -15,26 +15,26 @@ + :title="t('清档_删除目标数据库数据_数据会暂存在不可见的备份库中_只有在执行删除备份库后_才会真正的删除数据')" />
- {{ $t('批量录入') }} + {{ t('批量录入') }}
- {{ $t('安全模式') }} + {{ t('安全模式') }}
@@ -77,17 +77,18 @@ @change="handleBatchInput" />
-

{{ $t('匹配任意长度字符串_如a_不允许独立使用') }}

-

{{ $t('匹配任意单一字符_如a_d') }}

-

{{ $t('专门指代ALL语义_只能独立使用') }}

-

{{ $t('注_含通配符的单元格仅支持输入单个对象') }}

-

{{ $t('Enter完成内容输入') }}

+

{{ t('匹配任意长度字符串_如a_不允许独立使用') }}

+

{{ t('匹配任意单一字符_如a_d') }}

+

{{ t('专门指代ALL语义_只能独立使用') }}

+

{{ t('注_含通配符的单元格仅支持输入单个对象') }}

+

{{ t('Enter完成内容输入') }}

@@ -97,10 +98,10 @@ import type { Instance, SingleTarget } from 'tippy.js'; import { useI18n } from 'vue-i18n'; + import TendbhaModel from '@services/model/mysql/tendbha'; import { getClusterInfoByDomains } from '@services/source/mysqlCluster'; import { getClusterDatabaseNameList } from '@services/source/remoteService'; import { createTicket } from '@services/source/ticket'; - import type { ResourceItem } from '@services/types'; import { useInfo, @@ -113,8 +114,7 @@ } from '@common/const'; import { dbTippy } from '@common/tippy'; - import ClusterSelector from '@components/cluster-selector/ClusterSelector.vue'; - import type { ClusterSelectorResult } from '@components/cluster-selector/types'; + import ClusterSelector from '@components/cluster-selector/Index.vue'; import SuccessView from '@components/mysql-toolbox/Success.vue'; import ToolboxTable from '@components/mysql-toolbox/ToolboxTable.vue'; @@ -148,7 +148,6 @@ const globalBizsStore = useGlobalBizs(); const tableMaxHeight = useTableMaxHeight(334); let tippyInst:Instance | undefined; - const clusterSelectorTabList = [ClusterTypes.TENDBHA]; const ticketId = ref(0); const toolboxTableRef = ref(); @@ -158,9 +157,12 @@ const isForce = ref(false); const popRef = ref(); const isShowInputTips = ref(false); - const clusterInfoMap: Map = reactive(new Map()); + const clusterInfoMap: Map = reactive(new Map()); const clusterDBNameMap: Map> = reactive(new Map()); const tableData = ref>([getTableItem()]); + + const selectedClusters = shallowRef<{[key: string]: Array}>({ [ClusterTypes.TENDBHA]: [] }); + const rules = { cluster: [ { @@ -333,6 +335,9 @@ }, ]; + // 集群域名是否已存在表格的映射表 + let domainMemo: Record = {}; + const tagInputPasteFn = (value: string) => value.split('\n').map(item => ({ id: item })); // 设置 target|source form-item @@ -661,7 +666,8 @@ /** * 集群选择器批量选择 */ - function handleBatchSelectorChange(selected: ClusterSelectorResult) { + function handleBatchSelectorChange(selected: Record>) { + selectedClusters.value = selected; const list: Array = []; for (const key of Object.keys(selected)) { const formatList = selected[key].map((item) => { @@ -724,6 +730,13 @@ } function handleRemoveItem(index: number) { + const dataList = [...tableData.value]; + const domain = dataList[index].cluster_domain; + if (domain) { + delete domainMemo[domain]; + const clustersArr = selectedClusters.value[ClusterTypes.TENDBHA]; + selectedClusters.value[ClusterTypes.TENDBHA] = clustersArr.filter(item => item.master_domain !== domain); + } tableData.value.splice(index, 1); } @@ -733,6 +746,8 @@ content: t('重置后_将会清空当前填写的内容'), onConfirm: () => { tableData.value = [getTableItem()]; + selectedClusters.value[ClusterTypes.TENDBHA] = []; + domainMemo = {}; nextTick(() => { window.changeConfirm = false; }); diff --git a/dbm-ui/frontend/src/views/mysql/db-rename/index.vue b/dbm-ui/frontend/src/views/mysql/db-rename/index.vue index c8163a6811..83c2c896bd 100644 --- a/dbm-ui/frontend/src/views/mysql/db-rename/index.vue +++ b/dbm-ui/frontend/src/views/mysql/db-rename/index.vue @@ -15,26 +15,26 @@ + :title="t('DB重命名_database重命名')" />
- {{ $t('批量录入') }} + {{ t('批量录入') }}
- {{ $t('忽略业务连接') }} + {{ t('忽略业务连接') }}
@@ -77,7 +77,8 @@ @change="handleBatchInput" /> @@ -85,17 +86,16 @@ import _ from 'lodash'; import { useI18n } from 'vue-i18n'; + import TendbhaModel from '@services/model/mysql/tendbha'; import { getClusterInfoByDomains } from '@services/source/mysqlCluster'; import { getClusterDatabaseNameList } from '@services/source/remoteService'; import { createTicket } from '@services/source/ticket'; - import type { ResourceItem } from '@services/types'; import { useInfo, useTableMaxHeight } from '@hooks'; import { ClusterTypes, TicketTypes } from '@common/const'; - import ClusterSelector from '@components/cluster-selector/ClusterSelector.vue'; - import type { ClusterSelectorResult } from '@components/cluster-selector/types'; + import ClusterSelector from '@components/cluster-selector/Index.vue'; import SuccessView from '@components/mysql-toolbox/Success.vue'; import ToolboxTable from '@components/mysql-toolbox/ToolboxTable.vue'; @@ -125,16 +125,18 @@ const globalBizsStore = useGlobalBizs(); const tableMaxHeight = useTableMaxHeight(334); - const clusterSelectorTabList = [ClusterTypes.TENDBHA]; const ticketId = ref(0); const toolboxTableRef = ref(); const isShowBatchInput = ref(false); const isShowBatchSelector = ref(false); const isSubmitting = ref(false); const clusterDBNameMap: Map = reactive(new Map()); - const clusterInfoMap: Map = reactive(new Map()); + const clusterInfoMap: Map = reactive(new Map()); const isForce = ref(false); const tableData = ref>([getTableItem()]); + + const selectedClusters = shallowRef<{[key: string]: Array}>({ [ClusterTypes.TENDBHA]: [] }); + const clusterRules = [ { validator: (value: string) => !!value, @@ -200,6 +202,9 @@ }, ]; + // 集群域名是否已存在表格的映射表 + let domainMemo: Record = {}; + /** * 获取表格数据 */ @@ -473,13 +478,21 @@ } function handleRemoveItem(index: number) { + const dataList = [...tableData.value]; + const domain = dataList[index].cluster_domain; + if (domain) { + delete domainMemo[domain]; + const clustersArr = selectedClusters.value[ClusterTypes.TENDBHA]; + selectedClusters.value[ClusterTypes.TENDBHA] = clustersArr.filter(item => item.master_domain !== domain); + } tableData.value.splice(index, 1); } /** * 集群选择器批量选择 */ - function handleBatchSelectorChange(selected: ClusterSelectorResult) { + function handleBatchSelectorChange(selected: Record>) { + selectedClusters.value = selected; const list: Array = []; for (const key of Object.keys(selected)) { const formatList = selected[key].map((item) => { @@ -504,6 +517,8 @@ content: t('重置后_将会清空当前填写的内容'), onConfirm: () => { tableData.value = [getTableItem()]; + selectedClusters.value[ClusterTypes.TENDBHA] = []; + domainMemo = {}; nextTick(() => { window.changeConfirm = false; }); diff --git a/dbm-ui/frontend/src/views/mysql/db-table-backup/pages/page1/Index.vue b/dbm-ui/frontend/src/views/mysql/db-table-backup/pages/page1/Index.vue index 28acf450e9..2c20c931fa 100644 --- a/dbm-ui/frontend/src/views/mysql/db-table-backup/pages/page1/Index.vue +++ b/dbm-ui/frontend/src/views/mysql/db-table-backup/pages/page1/Index.vue @@ -17,12 +17,12 @@ + :title="t('指定库表备份_支持模糊匹配')" />
- {{ $t('批量录入') }} + {{ t('批量录入') }}
- {{ $t('提交') }} + {{ t('提交') }} + :content="t('重置将会情况当前填写的所有内容_请谨慎操作')" + :title="t('确认重置页面')"> - {{ $t('重置') }} + {{ t('重置') }} @@ -68,19 +69,17 @@ diff --git a/dbm-ui/frontend/src/views/mysql/dumper/components/create-rule/components/receiver-data/Index.vue b/dbm-ui/frontend/src/views/mysql/dumper/components/create-rule/components/receiver-data/Index.vue index 1fef63b38e..b72977088e 100644 --- a/dbm-ui/frontend/src/views/mysql/dumper/components/create-rule/components/receiver-data/Index.vue +++ b/dbm-ui/frontend/src/views/mysql/dumper/components/create-rule/components/receiver-data/Index.vue @@ -183,7 +183,7 @@ import { ClusterTypes } from '@common/const'; - import ClusterSelector from '@components/cluster-selector-new/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'; diff --git a/dbm-ui/frontend/src/views/mysql/flashback/pages/page1/Index.vue b/dbm-ui/frontend/src/views/mysql/flashback/pages/page1/Index.vue index 321f71c70d..a67ff98a1f 100644 --- a/dbm-ui/frontend/src/views/mysql/flashback/pages/page1/Index.vue +++ b/dbm-ui/frontend/src/views/mysql/flashback/pages/page1/Index.vue @@ -17,18 +17,18 @@ + :title="t('通过flashback工具_对row格式的binlog做逆向操作')" />
- {{ $t('批量录入') }} + {{ t('批量录入') }}
- {{ $t('时区') }} + {{ t('时区') }}
- {{ $t('提交') }} + {{ t('提交') }} + :content="t('重置将会情况当前填写的所有内容_请谨慎操作')" + :title="t('确认重置页面')"> - {{ $t('重置') }} + {{ t('重置') }} @@ -74,19 +75,17 @@ diff --git a/dbm-ui/frontend/src/views/mysql/ha-cluster-list/components/List.vue b/dbm-ui/frontend/src/views/mysql/ha-cluster-list/components/List.vue index 94c122e56f..61291f524b 100644 --- a/dbm-ui/frontend/src/views/mysql/ha-cluster-list/components/List.vue +++ b/dbm-ui/frontend/src/views/mysql/ha-cluster-list/components/List.vue @@ -14,60 +14,56 @@ @@ -68,19 +69,17 @@ diff --git a/dbm-ui/frontend/src/views/mysql/rollback/pages/page1/Index.vue b/dbm-ui/frontend/src/views/mysql/rollback/pages/page1/Index.vue index 2748020848..2437c8548e 100644 --- a/dbm-ui/frontend/src/views/mysql/rollback/pages/page1/Index.vue +++ b/dbm-ui/frontend/src/views/mysql/rollback/pages/page1/Index.vue @@ -17,18 +17,18 @@ + :title="t('新建一个单节点实例_通过全备_binlog的方式_将数据库恢复到过去的某一时间点或者某个指定备份文件的状态')" />
- {{ $t('批量录入') }} + {{ t('批量录入') }}
- {{ $t('时区') }} + {{ t('时区') }}
- {{ $t('提交') }} + {{ t('提交') }} + :content="t('重置将会情况当前填写的所有内容_请谨慎操作')" + :title="t('确认重置页面')"> - {{ $t('重置') }} + {{ t('重置') }} @@ -74,15 +75,17 @@ diff --git a/dbm-ui/frontend/src/views/mysql/single-cluster-list/components/List.vue b/dbm-ui/frontend/src/views/mysql/single-cluster-list/components/List.vue index c4aa267f34..3d69359249 100644 --- a/dbm-ui/frontend/src/views/mysql/single-cluster-list/components/List.vue +++ b/dbm-ui/frontend/src/views/mysql/single-cluster-list/components/List.vue @@ -14,45 +14,41 @@ @@ -78,7 +78,8 @@ @change="handleBatchInput" /> @@ -86,13 +87,13 @@ import _ from 'lodash'; import { useI18n } from 'vue-i18n'; + import TendbhaModel from '@services/model/mysql/tendbha'; import { checkHost } from '@services/source/ipchooser'; import { findRelatedClustersByClusterIds, getClusterInfoByDomains, } from '@services/source/mysqlCluster'; import { createTicket } from '@services/source/ticket'; - import type { ResourceItem } from '@services/types'; import { useInfo, useTableMaxHeight } from '@hooks'; @@ -101,8 +102,7 @@ import { ClusterTypes, TicketTypes } from '@common/const'; import { ipv4 } from '@common/regex'; - import ClusterSelector from '@components/cluster-selector/ClusterSelector.vue'; - import type { ClusterSelectorResult } from '@components/cluster-selector/types'; + import ClusterSelector from '@components/cluster-selector/Index.vue'; import SuccessView from '@components/mysql-toolbox/Success.vue'; import ToolboxTable from '@components/mysql-toolbox/ToolboxTable.vue'; @@ -126,11 +126,13 @@ const isShowBatchInput = ref(false); const isShowBatchSelector = ref(false); const isSubmitting = ref(false); - const clusterInfoMap: Map = reactive(new Map()); + const clusterInfoMap: Map = reactive(new Map()); const hostInfoMap: Map[number]> = reactive(new Map()); const tableData = ref>([getTableItem()]); const backupSource = ref('local'); + const selectedClusters = shallowRef<{[key: string]: Array}>({ [ClusterTypes.TENDBHA]: [] }); + const isCN = computed(() => locale.value === 'zh-cn'); const columns: TableProps['columns'] = [ @@ -175,6 +177,9 @@ }, ]; + // 集群域名是否已存在表格的映射表 + let domainMemo: Record = {}; + const getHostInfo = (domain: string, ip: string) => { const clusterInfo = clusterInfoMap.get(domain); return hostInfoMap.get(`${clusterInfo?.bk_cloud_id}:${ip}`); @@ -386,7 +391,8 @@ /** * 集群选择器批量选择 */ - function handleBatchSelectorChange(selected: ClusterSelectorResult) { + function handleBatchSelectorChange(selected: Record>) { + selectedClusters.value = selected; const formatList = selected[ClusterTypes.TENDBHA].map((item) => { clusterInfoMap.set(item.master_domain, item); return { @@ -443,6 +449,13 @@ } function handleRemoveItem(index: number) { + const dataList = [...tableData.value]; + const domain = dataList[index].cluster_domain; + if (domain) { + delete domainMemo[domain]; + const clustersArr = selectedClusters.value[ClusterTypes.TENDBHA]; + selectedClusters.value[ClusterTypes.TENDBHA] = clustersArr.filter(item => item.master_domain !== domain); + } tableData.value.splice(index, 1); } @@ -452,9 +465,9 @@ content: t('重置后_将会清空当前填写的内容'), onConfirm: () => { tableData.value = [getTableItem()]; - nextTick(() => { - window.changeConfirm = false; - }); + selectedClusters.value[ClusterTypes.TENDBHA] = []; + domainMemo = {}; + window.changeConfirm = false; return true; }, }); diff --git a/dbm-ui/frontend/src/views/mysql/sql-execute/steps/step1/components/TargetCluster.vue b/dbm-ui/frontend/src/views/mysql/sql-execute/steps/step1/components/TargetCluster.vue index cfaebe8a60..0ddb3749f4 100644 --- a/dbm-ui/frontend/src/views/mysql/sql-execute/steps/step1/components/TargetCluster.vue +++ b/dbm-ui/frontend/src/views/mysql/sql-execute/steps/step1/components/TargetCluster.vue @@ -15,7 +15,7 @@
@@ -23,7 +23,7 @@ - {{ $t('添加目标集群') }} + {{ t('添加目标集群') }}
@@ -37,7 +37,9 @@
@@ -52,19 +54,18 @@ - - diff --git a/dbm-ui/frontend/src/views/spider-manage/db-clear/pages/page1/Index.vue b/dbm-ui/frontend/src/views/spider-manage/db-clear/pages/page1/Index.vue index f07ae9d55d..d3f40708e2 100644 --- a/dbm-ui/frontend/src/views/spider-manage/db-clear/pages/page1/Index.vue +++ b/dbm-ui/frontend/src/views/spider-manage/db-clear/pages/page1/Index.vue @@ -32,12 +32,12 @@
+ v-bk-tooltips="t('安全模式下_存在业务连接时需要人工确认')"> - {{ $t('安全模式') }} + {{ t('安全模式') }}
@@ -80,7 +80,7 @@ import { ClusterTypes } from '@common/const'; - import ClusterSelector from '@components/cluster-selector-new/Index.vue'; + import ClusterSelector from '@components/cluster-selector/Index.vue'; import RenderData from './components/RenderData/Index.vue'; import RenderDataRow, { diff --git a/dbm-ui/frontend/src/views/spider-manage/db-rename/pages/page1/Index.vue b/dbm-ui/frontend/src/views/spider-manage/db-rename/pages/page1/Index.vue index 0715f602da..5e71bbe6af 100644 --- a/dbm-ui/frontend/src/views/spider-manage/db-rename/pages/page1/Index.vue +++ b/dbm-ui/frontend/src/views/spider-manage/db-rename/pages/page1/Index.vue @@ -80,7 +80,7 @@ import { ClusterTypes, TicketTypes } from '@common/const'; - import ClusterSelector from '@components/cluster-selector-new/Index.vue'; + import ClusterSelector from '@components/cluster-selector/Index.vue'; import RenderData from './components/RenderData/Index.vue'; import RenderDataRow, { diff --git a/dbm-ui/frontend/src/views/spider-manage/db-table-backup/pages/page1/Index.vue b/dbm-ui/frontend/src/views/spider-manage/db-table-backup/pages/page1/Index.vue index 40f59947c0..5510ddef67 100644 --- a/dbm-ui/frontend/src/views/spider-manage/db-table-backup/pages/page1/Index.vue +++ b/dbm-ui/frontend/src/views/spider-manage/db-table-backup/pages/page1/Index.vue @@ -69,7 +69,7 @@ import { ClusterTypes } from '@common/const'; - import ClusterSelector from '@components/cluster-selector-new/Index.vue'; + import ClusterSelector from '@components/cluster-selector/Index.vue'; import RenderData from './components/RenderData/Index.vue'; import RenderDataRow, { diff --git a/dbm-ui/frontend/src/views/spider-manage/flashback/pages/page1/Index.vue b/dbm-ui/frontend/src/views/spider-manage/flashback/pages/page1/Index.vue index 32e40f0abc..3b52afb051 100644 --- a/dbm-ui/frontend/src/views/spider-manage/flashback/pages/page1/Index.vue +++ b/dbm-ui/frontend/src/views/spider-manage/flashback/pages/page1/Index.vue @@ -75,7 +75,7 @@ import { ClusterTypes } from '@common/const'; - import ClusterSelector from '@components/cluster-selector-new/Index.vue'; + import ClusterSelector from '@components/cluster-selector/Index.vue'; import TimeZonePicker from '@components/time-zone-picker/index.vue'; import { messageError } from '@utils'; diff --git a/dbm-ui/frontend/src/views/spider-manage/list-instance/components/list/Index.vue b/dbm-ui/frontend/src/views/spider-manage/list-instance/components/list/Index.vue index e7072789b0..b98bee079b 100644 --- a/dbm-ui/frontend/src/views/spider-manage/list-instance/components/list/Index.vue +++ b/dbm-ui/frontend/src/views/spider-manage/list-instance/components/list/Index.vue @@ -19,7 +19,7 @@ class="mb-16" theme="primary" @click="handleApply"> - {{ $t('实例申请') }} + {{ t('实例申请') }} + :placeholder="t('请输入或选择条件搜索')" + unique-select />
@@ -59,6 +60,7 @@ import { useCopy, + useLinkQueryColumnSerach, useStretchLayout, useTableSettings, } from '@hooks'; @@ -68,6 +70,7 @@ import { type ClusterInstStatus, clusterInstStatus, + ClusterTypes, UserPersonalSettings, } from '@common/const'; @@ -80,8 +83,6 @@ utcDisplayTime, } from '@utils'; - import type { SearchSelectValues } from '@/types/bkui-vue'; - interface IColumn { cell: string, data: TendbInstanceModel @@ -97,11 +98,19 @@ isOpen: isStretchLayoutOpen, splitScreen: stretchLayoutSplitScreen, } = useStretchLayout(); + const { + columnAttrs, + searchAttrs, + searchValue, + sortValue, + columnFilterChange, + columnSortChange, + clearSearchValue, + } = useLinkQueryColumnSerach(ClusterTypes.TENDBCLUSTER, ['role'], () => fetchTableData(), false); const tableRef = ref(); const selected = shallowRef([]); - const filterData = shallowRef([]); const hasSelected = computed(() => selected.value.length > 0); const selectedIds = computed(() => selected.value.map(item => item.bk_host_id)); @@ -119,14 +128,14 @@ const list = [ { label: t('实例'), - field: 'instance_address', + field: 'instance', fixed: 'left', minWidth: 200, showOverflowTooltip: false, - render: ({ cell, data }: IColumn) => ( + render: ({ data }: IColumn) => (
{ isRecentDays(data.create_at, 24 * 3) @@ -160,6 +169,18 @@ label: t('状态'), field: 'status', width: 140, + filter: { + list: [ + { + value: 'normal', + text: t('正常'), + }, + { + value: 'abnormal', + text: t('异常'), + }, + ], + }, render: ({ cell }: { cell: ClusterInstStatus }) => { const info = clusterInstStatus[cell] || clusterInstStatus.unavailable; return {info.text}; @@ -206,10 +227,14 @@ { label: t('部署角色'), field: 'role', + filter: { + list: columnAttrs.value.role, + }, }, { label: t('部署时间'), field: 'create_at', + sort: true, width: 160, render: ({ cell }: IColumn) => {utcDisplayTime(cell)}, }, @@ -237,29 +262,52 @@ return list; }); - const searchSelectData = [ + const searchSelectData = computed(() => [ + { + name: 'IP', + id: 'ip', + multiple: true, + }, { name: t('实例'), - id: 'instance_address', + id: 'instance', + multiple: true, }, { - name: t('域名'), - id: 'domain', + name: t('集群名称'), + id: 'name', }, { - name: 'IP', - id: 'ip', + name: t('状态'), + id: 'status', + multiple: true, + children: [ + { + id: 'normal', + name: t('正常'), + }, + { + id: 'abnormal', + name: t('异常'), + }, + ], + }, + { + name: t('访问入口'), + id: 'domain', + multiple: true, }, { name: t('端口'), id: 'port', }, { - name: t('状态'), - id: 'status', - children: Object.values(clusterInstStatus).map(item => ({ id: item.key, name: item.text })), + name: t('部署角色'), + id: 'role', + multiple: true, + children: searchAttrs.value.role, }, - ]; + ]); // 设置行样式 const setRowClass = (row: TendbInstanceModel) => { @@ -284,6 +332,7 @@ })), checked: columns.value.map(item => item.field).filter(key => !!key) as string[], showLineHeight: false, + trigger: 'manual' as const, }; const { settings, @@ -292,19 +341,14 @@ const fetchTableData = () => { tableRef.value.fetchData({ - ...getSearchSelectorParams(filterData.value), - }, {}); + ...getSearchSelectorParams(searchValue.value), + }, { ...sortValue }); }; const handleSelection = (data: TendbInstanceModel, list: TendbInstanceModel[]) => { selected.value = list; }; - // 清空搜索条件 - const handleClearSearch = () => { - filterData.value = []; - fetchTableData(); - }; // 查看实例详情 const handleToDetails = (e: Event, data: TendbInstanceModel) => { @@ -356,7 +400,7 @@ .bk-search-select { flex: 1; - max-width: 320px; + max-width: 500px; min-width: 320px; margin-left: auto; } diff --git a/dbm-ui/frontend/src/views/spider-manage/list/components/list/Index.vue b/dbm-ui/frontend/src/views/spider-manage/list/components/list/Index.vue index 7c2d0cd644..3c76308fdc 100644 --- a/dbm-ui/frontend/src/views/spider-manage/list/components/list/Index.vue +++ b/dbm-ui/frontend/src/views/spider-manage/list/components/list/Index.vue @@ -54,12 +54,11 @@ type="spider" />
+ unique-select />
@@ -144,6 +146,7 @@ useCopy, useInfo, useInfoWithIcon, + useLinkQueryColumnSerach, useStretchLayout, useTableSettings, useTicketMessage, @@ -193,25 +196,21 @@ const { currentBizId } = useGlobalBizs(); const copy = useCopy(); const ticketMessage = useTicketMessage(); - - const searchData = [ - { - name: 'ID', - id: 'id', - }, - { - name: t('集群名'), - id: 'name', - }, - { - name: t('域名'), - id: 'domain', - }, - { - name: 'IP', - id: 'ip', - }, - ]; + const { + columnAttrs, + searchAttrs, + searchValue, + sortValue, + columnFilterChange, + columnSortChange, + clearSearchValue, + } = useLinkQueryColumnSerach(ClusterTypes.TENDBCLUSTER, [ + 'bk_cloud_id', + 'db_module_id', + 'major_version', + 'region', + 'time_zone', + ], () => fetchTableData()); const clusterId = defineModel('clusterId'); @@ -223,7 +222,6 @@ const isChangeShrinkForm = ref(false); const isChangeCapacityForm = ref(false); const removeMNTInstanceIds = ref([]); - const searchValues = ref>([]); const excelAuthorizeShow = ref(false); const showEditEntryConfig = ref(false); const clusterAuthorizeShow = ref(false); @@ -235,6 +233,71 @@ const selectedIds = computed(() => selected.value.map(item => item.id)); const hasData = computed(() => tableRef.value?.getData().length > 0); const isCN = computed(() => locale.value === 'zh-cn'); + const searchData = computed(() => [ + { + name: 'ID', + id: 'id', + }, + { + name: 'IP', + id: 'ip', + multiple: true, + }, + { + name: t('实例'), + id: 'instance', + multiple: true, + }, + { + name: t('访问入口'), + id: 'domain', + multiple: true, + }, + { + name: t('集群名称'), + id: 'name', + multiple: true, + }, + { + name: t('管控区域'), + id: 'bk_cloud_id', + multiple: true, + children: searchAttrs.value.bk_cloud_id, + }, + { + name: t('状态'), + id: 'status', + multiple: true, + children: [ + { + id: 'normal', + name: t('正常'), + }, + { + id: 'abnormal', + name: t('异常'), + }, + ], + }, + { + name: t('版本'), + id: 'major_version', + multiple: true, + children: searchAttrs.value.major_version, + }, + { + name: t('地域'), + id: 'region', + multiple: true, + children: searchAttrs.value.region, + }, + { + name: t('时区'), + id: 'time_zone', + multiple: true, + children: searchAttrs.value.time_zone, + }, + ]); const paginationExtra = computed(() => { if (isStretchLayoutOpen.value) { return { small: false }; @@ -253,8 +316,8 @@ return 60; }); const searchIp = computed(() => { - const ipObj = searchValues.value.find(item => item.id === 'ip'); - if (ipObj) { + const ipObj = searchValue.value.find(item => item.id === 'ip'); + if (ipObj && ipObj.values) { return [ipObj.values[0].id]; } return []; @@ -416,11 +479,26 @@ label: t('管控区域'), width: 120, field: 'bk_cloud_name', + filter: { + list: columnAttrs.value.bk_cloud_id, + }, }, { label: t('状态'), field: 'status', minWidth: 100, + filter: { + list: [ + { + value: 'normal', + text: t('正常'), + }, + { + value: 'abnormal', + text: t('异常'), + }, + ], + }, render: ({ data }: IColumn) => { const info = data.status === 'normal' ? { theme: 'success', text: t('正常') } : { theme: 'danger', text: t('异常') }; return {info.text}; @@ -547,12 +625,18 @@ label: t('版本'), field: 'major_version', minWidth: 100, + filter: { + list: columnAttrs.value.major_version, + }, render: ({ data }: IColumn) => {data.major_version || '--'}, }, { label: t('地域'), field: 'region', minWidth: 100, + filter: { + list: columnAttrs.value.region, + }, render: ({ data }: IColumn) => {data.region || '--'}, }, { @@ -562,8 +646,9 @@ render: ({ data }: IColumn) => {data.creator || '--'}, }, { - label: t('创建时间'), + label: t('部署时间'), field: 'create_at', + sort: true, width: 160, render: ({ data }: IColumn) => {data.createAtDisplay || '--'}, }, @@ -571,6 +656,9 @@ label: t('时区'), field: 'cluster_time_zone', width: 100, + filter: { + list: columnAttrs.value.time_zone, + }, render: ({ data }: IColumn) => {data.cluster_time_zone || '--'}, }, { @@ -760,6 +848,7 @@ })), checked: (columns.value || []).map(item => item.field).filter(key => !!key && key !== 'id') as string[], showLineHeight: false, + trigger: 'manual' as const, }; const { @@ -770,8 +859,8 @@ let isInitData = true; const fetchTableData = () => { tableRef.value?.fetchData({ - ...getSearchSelectorParams(searchValues.value), - }, {}, isInitData); + ...getSearchSelectorParams(searchValue.value), + }, { ...sortValue }, isInitData); isInitData = false; return Promise.resolve([]); @@ -994,6 +1083,14 @@ display: flex; margin-bottom: 16px; flex-wrap: wrap; + + .bk-search-select { + flex: 1; + max-width: 500px; + min-width: 320px; + margin-left: auto; + } + } .is-shrink-table { diff --git a/dbm-ui/frontend/src/views/spider-manage/openarea-create/components/target-cluster/Index.vue b/dbm-ui/frontend/src/views/spider-manage/openarea-create/components/target-cluster/Index.vue index 126a423ed0..0fe0b89ffd 100644 --- a/dbm-ui/frontend/src/views/spider-manage/openarea-create/components/target-cluster/Index.vue +++ b/dbm-ui/frontend/src/views/spider-manage/openarea-create/components/target-cluster/Index.vue @@ -28,7 +28,7 @@ import { ClusterTypes } from '@common/const'; - import ClusterSelector from '@components/cluster-selector-new/Index.vue'; + import ClusterSelector from '@components/cluster-selector/Index.vue'; import RenderTable from './components/RenderTable.vue'; import RenderDataRow, { diff --git a/dbm-ui/frontend/src/views/spider-manage/proxy-scale-down/pages/page1/Index.vue b/dbm-ui/frontend/src/views/spider-manage/proxy-scale-down/pages/page1/Index.vue index aed0b835f5..56471de08a 100644 --- a/dbm-ui/frontend/src/views/spider-manage/proxy-scale-down/pages/page1/Index.vue +++ b/dbm-ui/frontend/src/views/spider-manage/proxy-scale-down/pages/page1/Index.vue @@ -91,7 +91,7 @@ TicketTypes, } from '@common/const'; - import ClusterSelector from '@components/cluster-selector-new/Index.vue'; + import ClusterSelector from '@components/cluster-selector/Index.vue'; import { random } from '@utils'; diff --git a/dbm-ui/frontend/src/views/spider-manage/proxy-scale-up/pages/page1/Index.vue b/dbm-ui/frontend/src/views/spider-manage/proxy-scale-up/pages/page1/Index.vue index 6e718bcde7..a3771d4e37 100644 --- a/dbm-ui/frontend/src/views/spider-manage/proxy-scale-up/pages/page1/Index.vue +++ b/dbm-ui/frontend/src/views/spider-manage/proxy-scale-up/pages/page1/Index.vue @@ -17,7 +17,7 @@ + :title="t('扩容接入层:增加集群的Proxy数量')" /> @@ -47,16 +47,16 @@ :loading="isSubmitting" theme="primary" @click="handleSubmit"> - {{ $t('提交') }} + {{ t('提交') }} + :content="t('重置将会情况当前填写的所有内容_请谨慎操作')" + :title="t('确认重置页面')"> - {{ $t('重置') }} + {{ t('重置') }} @@ -80,7 +80,7 @@ TicketTypes, } from '@common/const'; - import ClusterSelector from '@components/cluster-selector-new/Index.vue'; + import ClusterSelector from '@components/cluster-selector/Index.vue'; import { random } from '@utils'; diff --git a/dbm-ui/frontend/src/views/spider-manage/proxy-slave-apply/pages/page1/Index.vue b/dbm-ui/frontend/src/views/spider-manage/proxy-slave-apply/pages/page1/Index.vue index 82b10cfe3c..9f38d328c1 100644 --- a/dbm-ui/frontend/src/views/spider-manage/proxy-slave-apply/pages/page1/Index.vue +++ b/dbm-ui/frontend/src/views/spider-manage/proxy-slave-apply/pages/page1/Index.vue @@ -17,7 +17,7 @@ + :title="t('部署只读接入层:在原集群上增加Spider Slave节点,一个集群最多只能有一个')" /> @@ -45,16 +45,16 @@ :loading="isSubmitting" theme="primary" @click="handleSubmit"> - {{ $t('提交') }} + {{ t('提交') }} + :content="t('重置将会情况当前填写的所有内容_请谨慎操作')" + :title="t('确认重置页面')"> - {{ $t('重置') }} + {{ t('重置') }} @@ -78,7 +78,7 @@ TicketTypes, } from '@common/const'; - import ClusterSelector from '@components/cluster-selector-new/Index.vue'; + import ClusterSelector from '@components/cluster-selector/Index.vue'; import { random } from '@utils'; diff --git a/dbm-ui/frontend/src/views/spider-manage/rollback/pages/page1/Index.vue b/dbm-ui/frontend/src/views/spider-manage/rollback/pages/page1/Index.vue index 3305899576..fde33e6d5a 100644 --- a/dbm-ui/frontend/src/views/spider-manage/rollback/pages/page1/Index.vue +++ b/dbm-ui/frontend/src/views/spider-manage/rollback/pages/page1/Index.vue @@ -17,9 +17,9 @@ + :title="t('定点构造:新建一个单节点实例,通过全备 +binlog 的方式,将数据库恢复到过去的某一时间点或者某个指定备份文件的状态')" />
- {{ $t('时区') }} + {{ t('时区') }}
- {{ $t('提交') }} + {{ t('提交') }} + :content="t('重置将会情况当前填写的所有内容_请谨慎操作')" + :title="t('确认重置页面')"> - {{ $t('重置') }} + {{ t('重置') }} @@ -63,6 +63,7 @@