fix(frontend): 权限验收前端交互问题修复 #4746

TencentBlueKing · Jun 4, 2024 · 82ad589 · 82ad589
1 parent 6d095cc
commit 82ad589
Show file tree

Hide file tree

Showing 18 changed files with 178 additions and 78 deletions.
diff --git a/dbm-ui/frontend/src/components/apply-items/BusinessItems.vue b/dbm-ui/frontend/src/components/apply-items/BusinessItems.vue
@@ -143,6 +143,10 @@
       const englishName = currentBiz.value?.english_name;
       hasEnglishName.value = !!englishName;
       appAbbr.value = englishName ?? '';
+      // 从实例申请 跳转过来，需要同步数据出去
+      if (route.query.bizId && currentBiz.value) {
+        handleAppChange(currentBiz.value);
+      }
     },
     {
       immediate: true,

diff --git a/dbm-ui/frontend/src/hooks/useTicketCloneInfo/generateCloneData/index.ts b/dbm-ui/frontend/src/hooks/useTicketCloneInfo/generateCloneData/index.ts
@@ -26,6 +26,7 @@ import {
   generateMysqlSlaveAddCloneData,
 } from './mysql';
 import {
+  generateRedisApplyCloneData,
   generateRedisClusterAddSlaveCloneData,
   generateRedisClusterCutoffCloneData,
   generateRedisClusterShardUpdateCloneData,
@@ -42,6 +43,7 @@ import {
 } from './redis';
 
 export const generateCloneDataHandlerMap = {
+  [TicketTypes.REDIS_CLUSTER_APPLY]: generateRedisApplyCloneData,
   [TicketTypes.REDIS_PROXY_SCALE_UP]: generateRedisProxyScaleUpCloneData, // Redis 接入层扩容
   [TicketTypes.REDIS_PROXY_SCALE_DOWN]: generateRedisProxyScaleDownCloneData, // Redis 接入层缩容
   [TicketTypes.REDIS_SCALE_UPDOWN]: generateRedisScaleUpdownCloneData, // Redis 集群容量变更
@@ -64,9 +66,9 @@ export const generateCloneDataHandlerMap = {
   [TicketTypes.MYSQL_CLIENT_CLONE_RULES]: generateMysqlClientCloneData, // Mysql 客户端权限克隆
   [TicketTypes.MYSQL_INSTANCE_CLONE_RULES]: generateMysqlInstanceCloneData, // Mysql DB实例权限克隆
   [TicketTypes.MYSQL_HA_APPLY]: generateMysqlHaApplyCloneData, // MySQL 高可用部署
-  [TicketTypes.MYSQL_SINGLE_APPLY] : generateMysqlSingleApplyCloneData, // MySQL 单节点部署
+  [TicketTypes.MYSQL_SINGLE_APPLY]: generateMysqlSingleApplyCloneData, // MySQL 单节点部署
   [TicketTypes.MYSQL_HA_DB_TABLE_BACKUP]: generateMysqlDbTableBackupCloneData, // Mysql 库表备份
-  [TicketTypes.MYSQL_HA_RENAME_DATABASE]: generateMysqlDbRenameCloneData,// MySQL 高可用DB重命名
+  [TicketTypes.MYSQL_HA_RENAME_DATABASE]: generateMysqlDbRenameCloneData, // MySQL 高可用DB重命名
   [TicketTypes.MYSQL_HA_FULL_BACKUP]: generateMysqlDbBackupCloneData, // Mysql 全库备份
   [TicketTypes.MYSQL_ROLLBACK_CLUSTER]: generateMysqlRollbackCloneData, // MySQL 定点构造
   [TicketTypes.MYSQL_FLASHBACK]: generateMysqlFlashbackCloneData, // MySQL 闪回
@@ -86,7 +88,5 @@ export type CloneDataHandlerMap = typeof generateCloneDataHandlerMap;
 export type CloneDataHandlerMapKeys = keyof CloneDataHandlerMap;
 
 export async function generateCloneData<T extends CloneDataHandlerMapKeys>(ticketType: T, ticketData: TicketModel) {
-  return (await generateCloneDataHandlerMap[ticketType](ticketData)) as ServiceReturnType<
-    CloneDataHandlerMap[T]
-  >;
+  return (await generateCloneDataHandlerMap[ticketType](ticketData)) as ServiceReturnType<CloneDataHandlerMap[T]>;
 }
diff --git a/dbm-ui/frontend/src/hooks/useTicketCloneInfo/generateCloneData/mysql/dbRename.ts b/dbm-ui/frontend/src/hooks/useTicketCloneInfo/generateCloneData/mysql/dbRename.ts
@@ -17,16 +17,17 @@ import { random } from '@utils';
 
 // MySQL 高可用DB重命名
 export function generateMysqlDbRenameCloneData(ticketData: TicketModel<MySQLRenameDetails>) {
-  const { clusters, force, infos} = ticketData.details;
-  const tableDataList = infos.map(item => ({
+  const { clusters, force, infos } = ticketData.details;
+  const tableDataList = infos.map((item) => ({
     cluster_id: item.cluster_id,
     cluster_domain: clusters[item.cluster_id].immute_domain,
+    cluster_type: clusters[item.cluster_id].cluster_type,
     from_database: item.from_database,
     to_database: item.to_database,
     uniqueId: random(),
-  }))
+  }));
   return Promise.resolve({
     tableDataList,
-    force
-   });
+    force,
+  });
 }
diff --git a/dbm-ui/frontend/src/hooks/useTicketCloneInfo/generateCloneData/redis/apply.ts b/dbm-ui/frontend/src/hooks/useTicketCloneInfo/generateCloneData/redis/apply.ts
@@ -0,0 +1,55 @@
+/*
+ * 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 { RedisDetails } from '@services/model/ticket/details/redis';
+import TicketModel from '@services/model/ticket/ticket';
+
+import { TicketTypes } from '@common/const';
+
+// Redis 集群部署
+export function generateRedisApplyCloneData(ticketData: TicketModel<RedisDetails>) {
+  const { details } = ticketData;
+  return Promise.resolve({
+    bk_biz_id: ticketData.bk_biz_id,
+    ticket_type: TicketTypes.REDIS_CLUSTER_APPLY,
+    remark: ticketData.remark,
+    details: {
+      bk_cloud_id: details.bk_cloud_id,
+      db_app_abbr: details.db_app_abbr,
+      proxy_port: details.proxy_port,
+      cluster_name: details.cluster_name,
+      cluster_alias: details.cluster_alias,
+      cluster_type: details.cluster_type,
+      city_code: details.city_code,
+      db_version: details.db_version,
+      cap_key: details.cap_key,
+      ip_source: details.ip_source,
+      disaster_tolerance_level: details.disaster_tolerance_level,
+      proxy_pwd: details.proxy_pwd,
+      nodes: details.nodes,
+      resource_spec: {
+        proxy: {
+          spec_id: details.resource_spec.proxy.spec_id,
+          count: details.resource_spec.proxy.count,
+        },
+        backend_group: {
+          count: details.resource_spec.backend_group.count,
+          spec_id: details.resource_spec.backend_group.spec_id,
+          capacity: '',
+          future_capacity: '',
+          affinity: details.resource_spec.backend_group.affinity,
+          location_spec: details.resource_spec.backend_group.location_spec,
+        },
+      },
+    },
+  });
+}
diff --git a/dbm-ui/frontend/src/hooks/useTicketCloneInfo/generateCloneData/redis/index.ts b/dbm-ui/frontend/src/hooks/useTicketCloneInfo/generateCloneData/redis/index.ts
@@ -1,3 +1,4 @@
+export * from './apply';
 export * from './clusterAddSlave';
 export * from './clusterCutoff';
 export * from './clusterShardUpdate';

diff --git a/dbm-ui/frontend/src/layout/components/database-manage/components/module-group/Mysql.vue b/dbm-ui/frontend/src/layout/components/database-manage/components/module-group/Mysql.vue
@@ -31,7 +31,9 @@
       <FunController
         controller-id="tendbsingle"
         module-id="mysql">
-        <BkMenuItem key="DatabaseTendbsingle" v-db-console="'mysql.partitionManage'">
+        <BkMenuItem
+          key="DatabaseTendbsingle"
+          v-db-console="'mysql.partitionManage'">
           <template #icon>
             <DbIcon type="node" />
           </template>
@@ -75,7 +77,7 @@
         </BkMenuItem>
       </BkSubmenu>
       <FunController
-        controller-id="toolbox"
+        :controller-id="dumperControlId"
         module-id="mysql">
         <BkMenuItem
           key="DumperDataSubscription"
@@ -101,7 +103,7 @@
         :favor-map="favorMeunMap"
         :toolbox-menu-config="toolboxMenuConfig" />
       <FunController
-        :controller-id="dumperControlId"
+        controller-id="toolbox"
         module-id="mysql">
         <BkMenuItem
           key="MySQLToolbox"

diff --git a/dbm-ui/frontend/src/locales/zh-cn.json b/dbm-ui/frontend/src/locales/zh-cn.json
@@ -2962,11 +2962,11 @@
     "Twemproxy+ TendisSSD 主从": "Twemproxy+ TendisSSD 主从",
     "Predixy + TendisplusCluster(gossip 协议)": "Predixy + TendisplusCluster(gossip 协议)",
     "SSD 磁盘": "SSD 磁盘",
-    "集群部署后，可在线切换为其他集群类型，注意事项:\n1. 切换过程中存量server连接会断开，需要程序需重连重试,持续时间1分钟内;\n2. 新集群类型 支持 老集群类型 相关特性;\n3. 如 TendisSSD 集群可在线切换为 TendisCache 集群和 Tendisplus 集群，但 TendisCache 集群不一定能切换为 TendisSSD 集群;": "集群部署后，可在线切换为其他集群类型，注意事项:\n1. 切换过程中存量server连接会断开，需要程序需重连重试,持续时间1分钟内;\n2. 新集群类型 支持 老集群类型 相关特性;\n3. 如 TendisSSD 集群可在线切换为 TendisCache 集群和 Tendisplus 集群，但 TendisCache 集群不一定能切换为 TendisSSD 集群;",
+    "集群部署后，可在线切换为其他集群类型，注意事项:\n1. 切换过程中存量server连接会断开，需要程序需重连重试,持续时间1分钟内;\n2. 新集群类型 支持 老集群类型 相关特性;\n3. 如 TendisSSD 集群可在线切换为 TendisCache 集群和 Tendisplus 集群，但 TendisCache 集群不一定能切换为 TendisSSD 集群": "集群部署后，可在线切换为其他集群类型，注意事项:\n1. 切换过程中存量server连接会断开，需要程序需重连重试,持续时间1分钟内;\n2. 新集群类型 支持 老集群类型 相关特性;\n3. 如 TendisSSD 集群可在线切换为 TendisCache 集群和 Tendisplus 集群，但 TendisCache 集群不一定能切换为 TendisSSD 集群;",
     "访问方式": "访问方式",
     "命令支持": "命令支持",
     "a. 缓存、QPS 要求较高、延迟要求较低;\nb. 同等数据规模,成本高;": "a. 缓存、QPS 要求较高、延迟要求较低;\nb. 同等数据规模,成本高;",
-    "a. 数据量很大,且大部分是 set/get/hset/hget等 O(1) 请求场景;\nb. hgetall、smembers 等 O(n) 请求性能较差,推荐使用 hscan、sscan 等命令代替;\nc. zset类型性能支持很差，不推荐使用;\nd. 同等数据规模,成本低;\ne. 需要精确恢复数据;\nf. 版本已经不迭代, 只做紧急 Bug 修复;\ng.未来将关闭申请入口;": "a. 数据量很大,且大部分是 set/get/hset/hget等 O(1) 请求场景;\nb. hgetall、smembers 等 O(n) 请求性能较差,推荐使用 hscan、sscan 等命令代替;\nc. zset类型性能支持很差，不推荐使用;\nd. 同等数据规模,成本低;\ne. 需要精确恢复数据;\nf. 版本已经不迭代, 只做紧急 Bug 修复;\ng.未来将关闭申请入口;",
+    "a. 数据量很大,且大部分是 set/get/hset/hget等 O(1) 请求场景;\nb. hgetall、smembers 等 O(n) 请求性能较差,推荐使用 hscan、sscan 等命令代替;\nc. zset类型性能支持很差，不推荐使用;\nd. 同等数据规模,成本低;\ne. 需要精确恢复数据;\nf. 版本已经不迭代, 只做紧急 Bug 修复;\ng.未来将关闭申请入口": "a. 数据量很大,且大部分是 set/get/hset/hget等 O(1) 请求场景;\nb. hgetall、smembers 等 O(n) 请求性能较差,推荐使用 hscan、sscan 等命令代替;\nc. zset类型性能支持很差，不推荐使用;\nd. 同等数据规模,成本低;\ne. 需要精确恢复数据;\nf. 版本已经不迭代, 只做紧急 Bug 修复;\ng.未来将关闭申请入口;",
     "a. 数据量很大,且大部分是 set/get/hset/hget 等 O(1) 请求场景;\nb. hgetall、smembers 等 O(n) 请求性能较差, 推荐使用 hscan、sscan 等命令代替;\nc. zset 类型性能约为原生 Redis 1/5;\nd. 可通过智能客户端直连 TendisplusCluster, 减少一层代理转发,降低延迟;\ne. 同等数据规模,成本低;\nf. 需要精确恢复数据;\ng. 版本持续迭代中;": "a. 数据量很大,且大部分是 set/get/hset/hget 等 O(1) 请求场景;\nb. hgetall、smembers 等 O(n) 请求性能较差, 推荐使用 hscan、sscan 等命令代替;\nc. zset 类型性能约为原生 Redis 1/5;\nd. 可通过智能客户端直连 TendisplusCluster, 减少一层代理转发,降低延迟;\ne. 同等数据规模,成本低;\nf. 需要精确恢复数据;\ng. 版本持续迭代中;",
     "a. 缓存、QPS 要求较高、延迟要求较低;\nb.可通过智能客户端直连 RedisCluster, 使用原生 Redis 各种特性, 同时减少一层代理转发,降低延迟;\nc. 同等数据规模,成本高;": "a. 缓存、QPS 要求较高、延迟要求较低;\nb.可通过智能客户端直连 RedisCluster, 使用原生 Redis 各种特性, 同时减少一层代理转发,降低延迟;\nc. 同等数据规模,成本高;",
     "a. 最新 Proxy 支持 Stream、Pubsub、事务;\nb. 支持 eval,key 需要满足 hash_tag 特性;": "a. 最新 Proxy 支持 Stream、Pubsub、事务;\nb. 支持 eval,key 需要满足 hash_tag 特性;",
@@ -3044,5 +3044,6 @@
     "标记为已处理的 IP，将会删除记录": "标记为已处理的 IP，将会删除记录",
     "只能选择“移入待回收的主机”": "只能选择“移入待回收的主机”",
     "只能选择“标记为处理的主机”": "只能选择“标记为处理的主机”",
+    "Predixy + RedisCluster(gossip 协议)": "Predixy + RedisCluster(gossip 协议)",
     "这行勿动！新增翻译请在上一行添加！": ""
 }
diff --git a/dbm-ui/frontend/src/main.ts b/dbm-ui/frontend/src/main.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.
-*/
+ */
 
 // eslint-disable-next-line simple-import-sort/imports
 import { createApp } from 'vue';
@@ -19,7 +19,6 @@ import tz from 'dayjs/plugin/timezone';
 import utc from 'dayjs/plugin/utc';
 import { createPinia } from 'pinia';
 
-
 import { useFunController, useGlobalBizs, useSystemEnviron } from '@stores';
 
 import { setGlobalComps } from '@common/importComps';

diff --git a/dbm-ui/frontend/src/services/model/ticket/details/mysql.ts b/dbm-ui/frontend/src/services/model/ticket/details/mysql.ts
@@ -26,13 +26,15 @@ export interface MysqlIpItem {
  * mysql-授权详情
  */
 export interface MysqlAuthorizationDetails {
-  authorize_uid: string,
-  authorize_data: AuthorizePreCheckData,
-    excel_url: string,
-    authorize_plugin_infos: Array<AuthorizePreCheckData & {
+  authorize_uid: string;
+  authorize_data: AuthorizePreCheckData;
+  excel_url: string;
+  authorize_plugin_infos: Array<
+    AuthorizePreCheckData & {
       bk_biz_id: number;
-    }>
-  }
+    }
+  >;
+}
 
 /**
  * MySQL SQL变更执行
@@ -108,7 +110,7 @@ export interface MySQLCloneDetails {
   clone_type: string;
   clone_uid: string;
   clone_data: {
-    bk_cloud_id: number,
+    bk_cloud_id: number;
     source: string;
     target: string[];
     module: string;
@@ -122,16 +124,14 @@ export interface MySQLInstanceCloneDetails {
   clone_type: string;
   clone_uid: string;
   clone_data: {
-    bk_cloud_id: number,
+    bk_cloud_id: number;
     source: string;
     target: string;
     module: string;
     cluster_domain: string;
   }[];
 }
 
-
-
 /**
  * MySQL 启停删
  */
@@ -439,7 +439,12 @@ export interface MySQLRollbackDetails {
     cluster_id: number;
     databases: string[];
     databases_ignore: string[];
-    rollback_ip: string;
+    rollback_host: {
+      bk_biz_id: number;
+      bk_cloud_id: number;
+      bk_host_id: number;
+      ip: string;
+    };
     rollback_time: string;
     tables: string[];
     tables_ignore: string[];

diff --git a/dbm-ui/frontend/src/services/model/ticket/details/redis.ts b/dbm-ui/frontend/src/services/model/ticket/details/redis.ts
@@ -21,6 +21,8 @@ import {
 import type { ExecuteModes, OnlineSwitchType, RepairModes } from '@services/types/common';
 import type { HostDetails } from '@services/types/ip';
 
+import type { ClusterTypes } from '@common/const';
+
 import type { DetailClusters, DetailSpecs, SpecInfo } from './common';
 
 // redis 新建从库
@@ -256,12 +258,13 @@ export interface RedisDBReplaceDetails {
 }
 
 export interface RedisDetails {
+  bk_cloud_id: number;
   cap_key: string;
   city_code: string;
   city_name: string;
   cluster_alias: string;
   cluster_name: string;
-  cluster_type: string;
+  cluster_type: ClusterTypes;
   cap_spec: string;
   db_version: string;
   db_app_abbr: string;
@@ -273,12 +276,18 @@ export interface RedisDetails {
     slave: HostDetails[];
   };
   proxy_port: number;
+  proxy_pwd: string;
   resource_spec: {
     proxy: SpecInfo;
     backend_group: {
+      affinity: string;
       count: number;
-      spec_id: string;
+      spec_id: number;
       spec_info: SpecInfo;
+      location_spec: {
+        city: string;
+        sub_zone_ids: number[];
+      };
     };
   };
 }

diff --git a/dbm-ui/frontend/src/views/es-manage/apply/Index.vue b/dbm-ui/frontend/src/views/es-manage/apply/Index.vue
@@ -429,13 +429,20 @@
   const isClickSubmit = ref(false);
 
   const tipTheme = computed(() => {
-    if (isClickSubmit.value === false) return 'info';
+    if (isClickSubmit.value === false) {
+      return 'info';
+    };
 
     const {
       hot,
       cold,
     } = formData.details.resource_spec;
-    const isPass = Boolean(hot.spec_id && hot.count) || Boolean(cold.spec_id && cold.count);
+
+    const {
+      hot: hotNodes,
+      cold: coldNodes,
+    } = formData.details.nodes;
+    const isPass = Boolean(hot.spec_id && hot.count) || Boolean(cold.spec_id && cold.count) || hotNodes.length > 0 || coldNodes.length > 0;
     return (isPass ? 'info' : 'danger');
   });
 

diff --git a/dbm-ui/frontend/src/views/mysql/checksum/Index.vue b/dbm-ui/frontend/src/views/mysql/checksum/Index.vue
@@ -179,7 +179,7 @@
   import ToolboxTable from '@components/mysql-toolbox/ToolboxTable.vue';
   import TimeZonePicker from '@components/time-zone-picker/index.vue';
 
-  import { generateId } from '@utils';
+  import { generateId, messageError } from '@utils';
 
   import type { InputItem } from './common/types';
   import BatchInput from './components/BatchInput.vue';
@@ -1046,6 +1046,9 @@
               window.changeConfirm = false;
             });
           })
+          .catch(e => {
+            messageError(e.message);
+          })
           .finally(() => {
             isSubmitting.value = false;
           });

diff --git a/dbm-ui/frontend/src/views/mysql/rollback/pages/page1/components/RenderData/RenderMode.vue b/dbm-ui/frontend/src/views/mysql/rollback/pages/page1/components/RenderData/RenderMode.vue
@@ -47,6 +47,7 @@
   </div>
 </template>
 <script setup lang="ts">
+  import dayjs from 'dayjs';
   import _ from 'lodash';
   import { computed, ref, watch } from 'vue';
   import { useI18n } from 'vue-i18n';
@@ -58,6 +59,8 @@
   import TableEditDateTime from '@views/mysql/common/edit/DateTime.vue';
   import TableEditSelect from '@views/mysql/common/edit/Select.vue';
 
+  import { utcDisplayTime } from '@utils';
+
   interface Props {
     clusterId: number;
     backupSource?: string;
@@ -125,7 +128,7 @@
     }).then((dataList) => {
       logRecordList.value = dataList.map((item) => ({
         id: item.backup_id,
-        name: `${item.mysql_role} ${item.backup_time}`,
+        name: `${item.mysql_role} ${utcDisplayTime(dayjs(item.backup_time).tz(dayjs.tz.guess()).toString())}`,
       }));
       logRecordListMemo = dataList;
     });