Merge pull request #557 from actiontech/feature/issue-2134

Feature/issue 2134

packages/shared/lib/api/sqle/service/SqlManage/index.d.ts

@@ -29,7 +29,8 @@ import {
   IGetSqlManageRuleTipsResp,
   ISqlManageCodingReq,
   IPostSqlManageCodingResp,
-  IGetSqlManageSqlAnalysisResp
+  IGetSqlManageSqlAnalysisResp,
+  ISqlManageAnalysisChartResp
 } from '../common.d';
 
 export interface IGetGlobalSqlManageListParams {
@@ -160,6 +161,21 @@ export interface IGetSqlManageSqlAnalysisV1Params {
 export interface IGetSqlManageSqlAnalysisV1Return
   extends IGetSqlManageSqlAnalysisResp {}
 
+export interface IGetSqlManageSqlAnalysisChartV1Params {
+  project_name: string;
+
+  sql_manage_id: string;
+
+  start_time: string;
+
+  end_time: string;
+
+  metric_name: string;
+}
+
+export interface IGetSqlManageSqlAnalysisChartV1Return
+  extends ISqlManageAnalysisChartResp {}
+
 export interface IGetSqlManageListV2Params {
   project_name: string;
 

packages/shared/lib/api/sqle/service/SqlManage/index.ts

@@ -22,6 +22,8 @@ import {
   ISendSqlManageReturn,
   IGetSqlManageSqlAnalysisV1Params,
   IGetSqlManageSqlAnalysisV1Return,
+  IGetSqlManageSqlAnalysisChartV1Params,
+  IGetSqlManageSqlAnalysisChartV1Return,
   IGetSqlManageListV2Params,
   IGetSqlManageListV2Return
 } from './index.d';
@@ -144,6 +146,24 @@ class SqlManageService extends ServiceBase {
     );
   }
 
+  public GetSqlManageSqlAnalysisChartV1(
+    params: IGetSqlManageSqlAnalysisChartV1Params,
+    options?: AxiosRequestConfig
+  ) {
+    const paramsData = this.cloneDeep(params);
+    const project_name = paramsData.project_name;
+    delete paramsData.project_name;
+
+    const sql_manage_id = paramsData.sql_manage_id;
+    delete paramsData.sql_manage_id;
+
+    return this.get<IGetSqlManageSqlAnalysisChartV1Return>(
+      `/v1/projects/${project_name}/sql_manages/${sql_manage_id}/sql_analysis_chart`,
+      paramsData,
+      options
+    );
+  }
+
   public GetSqlManageListV2(
     params: IGetSqlManageListV2Params,
     options?: AxiosRequestConfig

packages/shared/lib/api/sqle/service/common.d.ts

@@ -542,6 +542,16 @@ export interface IBlacklistResV1 {
   type?: BlacklistResV1TypeEnum;
 }
 
+export interface IChartPoint {
+  info?: Array<{
+    [key: string]: string;
+  }>;
+
+  x?: string;
+
+  y?: number;
+}
+
 export interface ICheckLicenseResV1 {
   code?: number;
 
@@ -880,6 +890,18 @@ export interface IDatabaseDiffObject {
   objects_diff_result?: IObjectDiffResult[];
 }
 
+export interface IDatabaseDriverLogosV1 {
+  db_type?: string;
+
+  logo?: number[];
+}
+
+export interface IDatabaseDriverOptionsV1 {
+  db_type?: string;
+
+  params?: IInstanceAdditionalParamResV1[];
+}
+
 export interface IDatabaseObject {
   object_name?: string;
 
@@ -1296,6 +1318,22 @@ export interface IGetDatabaseComparisonReqV1 {
   comparison_db_object?: IDatabaseComparisonObject;
 }
 
+export interface IGetDatabaseDriverLogosResV1 {
+  code?: number;
+
+  data?: IDatabaseDriverLogosV1[];
+
+  message?: string;
+}
+
+export interface IGetDatabaseDriverOptionsResV1 {
+  code?: number;
+
+  data?: IDatabaseDriverOptionsV1[];
+
+  message?: string;
+}
+
 export interface IGetDepBetweenStageInstanceResV1 {
   code?: number;
 
@@ -2812,6 +2850,10 @@ export interface ISqlAnalysis {
   table_metas?: ITableMetas;
 }
 
+export interface ISqlAnalysisChart {
+  points?: IChartPoint[];
+}
+
 export interface ISqlAnalysisResDataV1 {
   sql_explain?: ISQLExplain;
 
@@ -2902,6 +2944,14 @@ export interface ISqlManage {
   status?: SqlManageStatusEnum;
 }
 
+export interface ISqlManageAnalysisChartResp {
+  code?: number;
+
+  data?: ISqlAnalysisChart;
+
+  message?: string;
+}
+
 export interface ISqlManageCodingReq {
   coding_project_name?: string;
 

packages/shared/lib/api/sqle/service/instance/index.d.ts

@@ -1,6 +1,6 @@
-import { getInstanceTipListV1FunctionalModuleEnum } from './index.enum';
-
 import {
+  IGetDatabaseDriverLogosResV1,
+  IGetDatabaseDriverOptionsResV1,
   IGetInstanceTipsResV1,
   IBatchCheckInstanceConnectionsReqV1,
   IBatchGetInstanceConnectionsResV1,
@@ -12,6 +12,18 @@ import {
   IGetInstanceResV2
 } from '../common.d';
 
+import { getInstanceTipListV1FunctionalModuleEnum } from './index.enum';
+
+export interface IGetDatabaseDriverLogosParams {
+  db_types: string;
+}
+
+export interface IGetDatabaseDriverLogosReturn
+  extends IGetDatabaseDriverLogosResV1 {}
+
+export interface IGetDatabaseDriverOptionsReturn
+  extends IGetDatabaseDriverOptionsResV1 {}
+
 export interface IGetInstanceTipListV1Params {
   project_name: string;
 

packages/shared/lib/api/sqle/service/instance/index.ts

@@ -7,6 +7,9 @@ import ServiceBase from '../Service.base';
 import { AxiosRequestConfig } from 'axios';
 
 import {
+  IGetDatabaseDriverLogosParams,
+  IGetDatabaseDriverLogosReturn,
+  IGetDatabaseDriverOptionsReturn,
   IGetInstanceTipListV1Params,
   IGetInstanceTipListV1Return,
   IBatchCheckInstanceIsConnectableByNameParams,
@@ -26,6 +29,26 @@ import {
 } from './index.d';
 
 class InstanceService extends ServiceBase {
+  public GetDatabaseDriverLogos(
+    params: IGetDatabaseDriverLogosParams,
+    options?: AxiosRequestConfig
+  ) {
+    const paramsData = this.cloneDeep(params);
+    return this.get<IGetDatabaseDriverLogosReturn>(
+      '/v1/database_driver_logos',
+      paramsData,
+      options
+    );
+  }
+
+  public getDatabaseDriverOptions(options?: AxiosRequestConfig) {
+    return this.get<IGetDatabaseDriverOptionsReturn>(
+      '/v1/database_driver_options',
+      undefined,
+      options
+    );
+  }
+
   public getInstanceTipListV1(
     params: IGetInstanceTipListV1Params,
     options?: AxiosRequestConfig

packages/shared/lib/testUtil/mockAntDesignPlots.jsx

@@ -88,6 +88,20 @@ const RingProgressWithCustomRenderCalled = (options) => (props) => {
   return <div data-custom-params={params} />;
 };
 
+const LineWithCustomRenderCalled = (options) => (props) => {
+  const clonePropsData = cloneDeep(props);
+
+  const tooltipCustomContent = clonePropsData?.tooltip?.customContent?.(
+    ...(options?.tooltip?.customContent?.(props) ?? [])
+  );
+
+  const params = JSON.stringify(clonePropsData);
+  if (tooltipCustomContent) {
+    return <div data-custom-params={params}>{tooltipCustomContent}</div>;
+  }
+  return <div data-custom-params={params} />;
+};
+
 export {
   Line,
   Pie,
@@ -103,7 +117,8 @@ export {
   PieWithCustomRenderCalled,
   BarWithCustomRenderCalled,
   AreaWithCustomRenderCalled,
-  RingProgressWithCustomRenderCalled
+  RingProgressWithCustomRenderCalled,
+  LineWithCustomRenderCalled
 };
 
 // eslint-disable-next-line import/no-anonymous-default-export

packages/shared/lib/utils/Common.ts

@@ -2,6 +2,7 @@ import { AxiosResponse } from 'axios';
 import moment from 'moment';
 import i18n from 'i18next';
 import { MIMETypeEnum, ResponseBlobJsonType } from '../enum';
+import { Dayjs } from 'dayjs';
 
 export const emailValidate = (email: string): boolean => {
   if (!email || typeof email !== 'string') {
@@ -50,13 +51,11 @@ export const formatTime = (
 };
 
 export function translateTimeForRequest(time: undefined): undefined;
-export function translateTimeForRequest(time: moment.Moment): string;
+export function translateTimeForRequest(time: Dayjs): string;
 export function translateTimeForRequest(
-  time: moment.Moment | undefined
+  time: Dayjs | undefined
 ): string | undefined;
-export function translateTimeForRequest(
-  time?: moment.Moment
-): string | undefined {
+export function translateTimeForRequest(time?: Dayjs): string | undefined {
   if (!time) {
     return;
   }

packages/shared/lib/utils/__tests__/Common.test.ts

@@ -1,5 +1,4 @@
 import { AxiosResponse } from 'axios';
-import moment from 'moment';
 import {
   cleanEmptyParams,
   emailValidate,
@@ -19,6 +18,7 @@ import {
 import { act } from '@testing-library/react';
 import 'blob-polyfill';
 import { MIMETypeEnum } from '../../enum';
+import dayjs from 'dayjs';
 
 describe('utils/Common', () => {
   test('should check params is a email address', () => {
@@ -54,8 +54,8 @@ describe('utils/Common', () => {
     expect(formatTime(undefined, '--')).toBe('--');
   });
 
-  test('should format a time from moment to YYYY-MM-DDTHH:mm:ssZ', () => {
-    expect(translateTimeForRequest(moment('2021-06-09 08:11:52'))).toBe(
+  test('should format a time from dayjs to YYYY-MM-DDTHH:mm:ssZ', () => {
+    expect(translateTimeForRequest(dayjs('2021-06-09 08:11:52'))).toBe(
       `2021-06-09T08:11:52+08:00`
     );
     expect(translateTimeForRequest(undefined)).toBe(undefined);

packages/sqle/src/hooks/useBackendTable/useBackendTable.tsx

@@ -29,7 +29,9 @@ const useBackendTable = () => {
       options?: {
         customRender?: (
           text: string,
-          record: DataSourceItem
+          record: DataSourceItem,
+          index: number,
+          fieldName: string
         ) => React.ReactNode;
       }
     ): ColumnType<DataSourceItem>[] => {
@@ -51,17 +53,22 @@ const useBackendTable = () => {
         );
       };
       return head.map((item) => {
-        const renderMethod = (text: string, record: DataSourceItem) => {
+        const renderMethod = (
+          text: string,
+          record: DataSourceItem,
+          index: number,
+          fieldName: string
+        ) => {
           if (options?.customRender) {
-            return options?.customRender?.(text, record);
+            return options?.customRender?.(text, record, index, fieldName);
           }
           return tableCellRenderWithEllipsisAndTooltipAndCopyable(text);
         };
 
         return {
           dataIndex: item.field_name ?? '',
           title: (item.desc || item.field_name) ?? '',
-          render: renderMethod
+          render: (...rest) => renderMethod(...rest, item.field_name ?? '')
         };
       });
     },

packages/sqle/src/locale/zh-CN/sqlQuery.ts

@@ -24,7 +24,15 @@ export default {
   executePlan: {
     title: '执行计划{{index}}',
     sql: 'SQL语句',
-    sqlExplain: '执行计划',
+    planCost: 'SQL执行计划 Cost趋势',
+    twentyFourHours: '24小时',
+    sevenDays: '7天',
+    thirtyDays: '30天',
+    costValue: 'Cost值',
+    emptyText: '暂无数据，选择其他时间段查看',
+    compareDifference: '对比执行计划',
+    historyExecPlan: '历史执行计划',
+    sqlExplain: '当前执行计划',
     performanceStatistics: '性能统计',
     affectRows: '影响行数',
     affectRowTips: '区别于执行计划的rows列，显示SQL的实际影响行数'