From 02c263e95c65d2b7b089bbbdd6bf7e687e684ed0 Mon Sep 17 00:00:00 2001 From: zzyangh <799463087@qq.com> Date: Fri, 7 Nov 2025 10:28:03 +0800 Subject: [PATCH 1/5] [feature]: Adjust SQL beautification function --- .../base/src/hooks/useDbService/index.tsx | 13 +++- .../CreateTask/ExportFormAction/index.tsx | 16 +++- .../CreateTask/ExportFormAction/index.type.ts | 1 + .../ExportMethodForm/ExportMethodFormItem.tsx | 36 +++++++-- .../CreateTask/ExportMethodForm/index.tsx | 6 +- .../ExportSourceForm/ExportSourceFormItem.tsx | 26 ++++++- .../Create/components/CreateTask/index.tsx | 6 +- .../components/CreateTask/index.type.ts | 3 + .../SubmitWorkflow/UpdateInfoDrawer/index.tsx | 9 ++- .../Create/hooks/useCreateExportTaskForm.ts | 61 ++++++++------- .../components/CustomMonacoEditor/index.tsx | 44 +++++++++++ .../components/CustomMonacoEditor/style.ts | 9 +++ .../sqle/src/locale/zh-CN/execWorkflow.ts | 4 +- .../Create/SQLInfoForm/DatabaseInfo.tsx | 3 + .../Create/SQLInfoForm/SQLInfoFormItem.tsx | 52 +++++++++---- .../SqlAudit/Create/SQLInfoForm/index.type.ts | 2 + .../components/SqlUploadCont/index.tsx | 44 ++++++++--- .../Create/SQLStatementForm/index.tsx | 4 +- .../sqle/src/page/SqlAudit/Create/index.tsx | 13 +++- .../components/SqlFormatterAndSubmitter.tsx | 53 +++++++++++-- .../components/SqlUploadContent.tsx | 58 +++++++++++--- .../components/index.type.ts | 6 +- .../SqlStatementFormItem/index.tsx | 5 +- .../SqlStatementFormItem/index.type.ts | 5 +- .../src/page/SqlExecWorkflow/Common/style.ts | 11 +++ .../hooks/useRenderDatabaseSelectionItems.tsx | 14 +++- .../SqlAuditInfoFormItem/index.tsx | 1 + .../src/page/SqlExecWorkflow/Create/index.tsx | 66 +++++++++++++--- .../page/SqlExecWorkflow/Create/index.type.ts | 3 + .../components/ModifySqlStatement/index.tsx | 45 +++++++++-- .../Create/SQLInfoForm/SQLInfoFormItem.tsx | 78 ++++++++++++++----- .../SQLStatementForm/SqlUploadFileCont.tsx | 13 ++-- .../Create/SQLStatementForm/index.tsx | 9 ++- .../src/page/SqlOptimization/Create/index.tsx | 14 ++-- .../src/page/SqlOptimization/index.type.ts | 6 +- 35 files changed, 576 insertions(+), 163 deletions(-) create mode 100644 packages/sqle/src/components/CustomMonacoEditor/index.tsx create mode 100644 packages/sqle/src/components/CustomMonacoEditor/style.ts diff --git a/packages/base/src/hooks/useDbService/index.tsx b/packages/base/src/hooks/useDbService/index.tsx index 03cccc952..6bdade5ab 100644 --- a/packages/base/src/hooks/useDbService/index.tsx +++ b/packages/base/src/hooks/useDbService/index.tsx @@ -1,4 +1,4 @@ -import React, { useMemo } from 'react'; +import React, { useCallback, useMemo } from 'react'; import { useBoolean } from 'ahooks'; import { Select } from 'antd'; import { useDbServiceDriver } from '@actiontech/shared/lib/features'; @@ -112,6 +112,14 @@ const useDbService = () => { const dbServiceIDOptions = useMemo(() => { return generateCommonDbServiceOptions('id'); }, [generateCommonDbServiceOptions]); + + const getServiceDbType = useCallback( + (id: string) => { + return dbServiceList.find((i) => i.id === id)?.db_type ?? ''; + }, + [dbServiceList] + ); + return { dbServiceList, dbServiceOptions, @@ -119,7 +127,8 @@ const useDbService = () => { updateDbServiceList, generateDbServiceSelectOptions, generateDbServiceIDSelectOptions, - dbServiceIDOptions + dbServiceIDOptions, + getServiceDbType }; }; export default useDbService; diff --git a/packages/base/src/page/DataExportManagement/Create/components/CreateTask/ExportFormAction/index.tsx b/packages/base/src/page/DataExportManagement/Create/components/CreateTask/ExportFormAction/index.tsx index a2e6cb7c5..822abdfa0 100644 --- a/packages/base/src/page/DataExportManagement/Create/components/CreateTask/ExportFormAction/index.tsx +++ b/packages/base/src/page/DataExportManagement/Create/components/CreateTask/ExportFormAction/index.tsx @@ -5,10 +5,14 @@ import { Space } from 'antd'; import { FormatLanguageSupport } from '@actiontech/dms-kit'; import { InfoCircleOutlined } from '@actiontech/icons'; import useThemeStyleData from '../../../../../../hooks/useThemeStyleData'; +import { SqlFormatterButtonStyleWrapper } from 'sqle/src/page/SqlExecWorkflow/Common/style'; +import classNames from 'classnames'; + const ExportFormAction: React.FC = ({ auditAction, auditLoading, - formatSQLAction + formatSQLAction, + formatted }) => { const { t } = useTranslation(); const { baseTheme } = useThemeStyleData(); @@ -17,9 +21,15 @@ const ExportFormAction: React.FC = ({ {t('dmsDataExport.create.form.action.audit')} - + {t('dmsDataExport.create.form.action.format')} - + void; formatSQLAction: () => void; auditLoading: boolean; + formatted?: boolean; }; diff --git a/packages/base/src/page/DataExportManagement/Create/components/CreateTask/ExportMethodForm/ExportMethodFormItem.tsx b/packages/base/src/page/DataExportManagement/Create/components/CreateTask/ExportMethodForm/ExportMethodFormItem.tsx index 67d8a019f..311f35ff4 100644 --- a/packages/base/src/page/DataExportManagement/Create/components/CreateTask/ExportMethodForm/ExportMethodFormItem.tsx +++ b/packages/base/src/page/DataExportManagement/Create/components/CreateTask/ExportMethodForm/ExportMethodFormItem.tsx @@ -1,8 +1,10 @@ -import { FormItemNoLabel } from '@actiontech/dms-kit'; import { - MonacoEditor, - useMonacoEditor -} from '@actiontech/shared/lib/components/MonacoEditor'; + BasicInput, + BasicSwitch, + FormItemNoLabel, + isSupportLanguage +} from '@actiontech/dms-kit'; +import { useMonacoEditor } from '@actiontech/shared/lib/components/MonacoEditor'; import { whiteSpaceSql } from '@actiontech/dms-kit'; import { useTranslation } from 'react-i18next'; import { CreateExportTaskFormEntryProps } from '../index.type'; @@ -10,13 +12,23 @@ import { ExportMethodEnum } from './index.enum'; import { ModeSwitcher } from '@actiontech/dms-kit'; import { PanelCardOutlined } from '@actiontech/icons'; import { SQL_EDITOR_PLACEHOLDER_VALUE } from '@actiontech/dms-kit'; +import CustomMonacoEditor from 'sqle/src/components/CustomMonacoEditor'; +import { useMemo } from 'react'; +import { Form } from 'antd'; + const ExportMethodFormItem: React.FC< - Pick -> = ({ methodForm }) => { + Pick +> = ({ methodForm, sourceForm }) => { const { t } = useTranslation(); const { editorDidMount } = useMonacoEditor(methodForm, { formName: 'sql' }); + const formatted = Form.useWatch('formatted', methodForm); + const dbType = Form.useWatch('dbType', sourceForm); + + const isReadOnlyMode = useMemo(() => { + return formatted && !isSupportLanguage(dbType); + }, [formatted, dbType]); return ( <> @@ -47,16 +59,24 @@ const ExportMethodFormItem: React.FC< ...whiteSpaceSql() ]} > - + + ); }; diff --git a/packages/base/src/page/DataExportManagement/Create/components/CreateTask/ExportMethodForm/index.tsx b/packages/base/src/page/DataExportManagement/Create/components/CreateTask/ExportMethodForm/index.tsx index df4f69aa2..90dda10c5 100644 --- a/packages/base/src/page/DataExportManagement/Create/components/CreateTask/ExportMethodForm/index.tsx +++ b/packages/base/src/page/DataExportManagement/Create/components/CreateTask/ExportMethodForm/index.tsx @@ -9,8 +9,8 @@ import { FormItemSubTitle } from '@actiontech/dms-kit'; import ExportMethodFormItem from './ExportMethodFormItem'; const ExportMethodForm: React.FC< - Pick -> = ({ methodForm }) => { + Pick +> = ({ methodForm, sourceForm }) => { const { t } = useTranslation(); return ( @@ -25,7 +25,7 @@ const ExportMethodForm: React.FC< {t('dmsDataExport.create.form.method.title')} - + ); diff --git a/packages/base/src/page/DataExportManagement/Create/components/CreateTask/ExportSourceForm/ExportSourceFormItem.tsx b/packages/base/src/page/DataExportManagement/Create/components/CreateTask/ExportSourceForm/ExportSourceFormItem.tsx index df0d1c48d..97871d4c5 100644 --- a/packages/base/src/page/DataExportManagement/Create/components/CreateTask/ExportSourceForm/ExportSourceFormItem.tsx +++ b/packages/base/src/page/DataExportManagement/Create/components/CreateTask/ExportSourceForm/ExportSourceFormItem.tsx @@ -2,7 +2,8 @@ import { BasicSelect, jsonParse, ROUTE_PATHS, - TRANSIT_FROM_CONSTANT + TRANSIT_FROM_CONSTANT, + BasicInput } from '@actiontech/dms-kit'; import { FormItemLabel } from '@actiontech/dms-kit'; import { useTranslation } from 'react-i18next'; @@ -32,8 +33,10 @@ const ExportSourceFormItem: React.FC< updateDbServiceList, generateDbServiceIDSelectOptions, dbServiceList, - loading: getDbServiceListLoading + loading: getDbServiceListLoading, + getServiceDbType } = useDbService(); + const dbServiceID = Form.useWatch('dbService', sourceForm); const dbServiceName = useMemo(() => { const name = dbServiceList.find((v) => v.id === dbServiceID)?.name; @@ -53,6 +56,7 @@ const ExportSourceFormItem: React.FC< `${name}_${dayjs().format('YYYYMMDDhhmmss')}` ); } + sourceForm.setFieldValue('dbType', getServiceDbType(id)); }; useEffect(() => { updateDbServiceList({ @@ -100,7 +104,10 @@ const ExportSourceFormItem: React.FC< )?.id; if (serviceId) { - sourceForm.setFieldValue('dbService', serviceId); + sourceForm.setFieldsValue({ + dbService: serviceId, + dbType: getServiceDbType(serviceId) + }); } if (databaseName) { @@ -111,7 +118,15 @@ const ExportSourceFormItem: React.FC< console.error(`${error}`); } } - }, [baseForm, dbServiceList, extractQueries, methodForm, mode, sourceForm]); + }, [ + baseForm, + dbServiceList, + extractQueries, + methodForm, + mode, + sourceForm, + getServiceDbType + ]); return ( <> @@ -162,6 +177,9 @@ const ExportSourceFormItem: React.FC< {generateDbServiceIDSelectOptions()} + diff --git a/packages/base/src/page/DataExportManagement/Create/components/CreateTask/index.tsx b/packages/base/src/page/DataExportManagement/Create/components/CreateTask/index.tsx index fac9202ed..2d00bded2 100644 --- a/packages/base/src/page/DataExportManagement/Create/components/CreateTask/index.tsx +++ b/packages/base/src/page/DataExportManagement/Create/components/CreateTask/index.tsx @@ -22,7 +22,8 @@ const CreateExportTask: React.FC = () => { auditAction, formatSQLAction, auditLoading, - resetAllForms + resetAllForms, + formatted } = useCreateExportTaskForm(); return ( @@ -43,7 +44,7 @@ const CreateExportTask: React.FC = () => { baseForm={baseForm} methodForm={methodForm} /> - + { }} auditLoading={auditLoading} formatSQLAction={formatSQLAction} + formatted={formatted} /> diff --git a/packages/base/src/page/DataExportManagement/Create/components/CreateTask/index.type.ts b/packages/base/src/page/DataExportManagement/Create/components/CreateTask/index.type.ts index d732778fb..879ecd2ee 100644 --- a/packages/base/src/page/DataExportManagement/Create/components/CreateTask/index.type.ts +++ b/packages/base/src/page/DataExportManagement/Create/components/CreateTask/index.type.ts @@ -10,11 +10,14 @@ export type SourceFormFieldsType = { business?: string; dbService: string; schema?: string; + dbType?: string; }; export type MethodFormFieldsType = { sql: string; exportMethod: ExportMethodEnum; + formatted?: boolean; + originSql?: string; }; export type CreateExportTaskFormEntryProps = { diff --git a/packages/base/src/page/DataExportManagement/Create/components/SubmitWorkflow/UpdateInfoDrawer/index.tsx b/packages/base/src/page/DataExportManagement/Create/components/SubmitWorkflow/UpdateInfoDrawer/index.tsx index 2525bf7a9..339c2bab3 100644 --- a/packages/base/src/page/DataExportManagement/Create/components/SubmitWorkflow/UpdateInfoDrawer/index.tsx +++ b/packages/base/src/page/DataExportManagement/Create/components/SubmitWorkflow/UpdateInfoDrawer/index.tsx @@ -29,7 +29,8 @@ const UpdateInfoDrawer: React.FC = () => { methodForm, auditAction, formatSQLAction, - auditLoading + auditLoading, + formatted } = useCreateExportTaskForm(); const closeHandle = () => { if (auditLoading) { @@ -115,7 +116,10 @@ const UpdateInfoDrawer: React.FC = () => { {t('dmsDataExport.create.update.methodTitle')} - + @@ -129,6 +133,7 @@ const UpdateInfoDrawer: React.FC = () => { }} auditLoading={auditLoading} formatSQLAction={formatSQLAction} + formatted={formatted} /> diff --git a/packages/base/src/page/DataExportManagement/Create/hooks/useCreateExportTaskForm.ts b/packages/base/src/page/DataExportManagement/Create/hooks/useCreateExportTaskForm.ts index 0d3ef8cd4..cc8d83dcd 100644 --- a/packages/base/src/page/DataExportManagement/Create/hooks/useCreateExportTaskForm.ts +++ b/packages/base/src/page/DataExportManagement/Create/hooks/useCreateExportTaskForm.ts @@ -1,51 +1,48 @@ -import DBService from '@actiontech/shared/lib/api/base/service/DBService'; import DataExportTask from '@actiontech/shared/lib/api/base/service/DataExportTask'; import { useCurrentProject } from '@actiontech/shared/lib/features'; -import { useForm } from 'antd/es/form/Form'; +import { useForm, useWatch } from 'antd/es/form/Form'; import useCreateDataExportReduxManage from './index.redux'; import { BaseFormFieldsType, MethodFormFieldsType, SourceFormFieldsType } from '../components/CreateTask/index.type'; -import { ResponseCode } from '@actiontech/dms-kit'; +import { + isSupportLanguage, + ResponseCode, + SQL_EDITOR_PLACEHOLDER_VALUE +} from '@actiontech/dms-kit'; import { formatterSQL } from '@actiontech/dms-kit'; const useCreateExportTaskForm = () => { const [baseForm] = useForm(); const [sourceForm] = useForm(); const [methodForm] = useForm(); + + const formatted = useWatch('formatted', methodForm); + const originSql = useWatch('originSql', methodForm); + const { projectID } = useCurrentProject(); const { auditLoading, updateAuditLoading, updateFormValues, updateTaskIDs } = useCreateDataExportReduxManage(); - const formatSQLAction = () => { + const formatSQLAction = async () => { const currentSQL = methodForm.getFieldValue('sql'); - const dbServiceID = sourceForm.getFieldValue('dbService'); - const getInstanceType = (id: string) => { - return DBService.ListDBServices({ - project_uid: projectID, - page_size: 9999, - page_index: 1, - filter_by_uid: id - }).then((res) => res.data.data?.[0]); - }; - if (dbServiceID) { - getInstanceType(dbServiceID).then((res) => { - methodForm.setFields([ - { - name: 'sql', - value: formatterSQL(currentSQL, res?.db_type) - } - ]); + const dbType = sourceForm.getFieldValue('dbType'); + + if (dbType && currentSQL !== SQL_EDITOR_PLACEHOLDER_VALUE) { + if (formatted && !isSupportLanguage(dbType)) { + methodForm.setFieldsValue({ + sql: originSql, + formatted: false + }); + return; + } + methodForm.setFieldsValue({ + sql: formatterSQL(currentSQL, dbType), + formatted: true, + originSql: currentSQL }); - } else { - methodForm.setFields([ - { - name: 'sql', - value: formatterSQL(currentSQL) - } - ]); } }; @@ -62,13 +59,16 @@ const useCreateExportTaskForm = () => { updateAuditLoading(true); + const sql = isSupportLanguage(sourceValues.dbType) + ? methodValues.sql + : methodValues.originSql; return DataExportTask.AddDataExportTask({ project_uid: projectID, data_export_tasks: [ { database_name: sourceValues.schema, db_service_uid: sourceValues.dbService, - export_sql: methodValues.sql + export_sql: sql } ] }) @@ -92,7 +92,8 @@ const useCreateExportTaskForm = () => { auditLoading, formatSQLAction, auditAction, - resetAllForms + resetAllForms, + formatted }; }; diff --git a/packages/sqle/src/components/CustomMonacoEditor/index.tsx b/packages/sqle/src/components/CustomMonacoEditor/index.tsx new file mode 100644 index 000000000..6b522be6d --- /dev/null +++ b/packages/sqle/src/components/CustomMonacoEditor/index.tsx @@ -0,0 +1,44 @@ +import { + MonacoEditor, + CustomMonacoEditorProps +} from '@actiontech/shared/lib/components/MonacoEditor'; +import { Alert } from 'antd'; +import { CustomMonacoEditorStyleWrapper } from './style'; +import { EmptyBox } from '@actiontech/dms-kit'; +import { useTranslation } from 'react-i18next'; + +type MonacoEditorProps = CustomMonacoEditorProps & { + showAlert?: boolean; +}; + +const CustomMonacoEditor: React.FC = ({ + showAlert, + ...props +}) => { + const { t } = useTranslation(); + return ( + + { + props.onMount?.(editor, monaco); + // 目前版本的monaco-editor不支持修改只读模式下的提示信息 所以暂时隐藏掉此提示信息 + editor + .getContribution('editor.contrib.readOnlyMessageController') + ?.dispose?.(); + }} + /> + + + + + ); +}; + +export default CustomMonacoEditor; diff --git a/packages/sqle/src/components/CustomMonacoEditor/style.ts b/packages/sqle/src/components/CustomMonacoEditor/style.ts new file mode 100644 index 000000000..458d78771 --- /dev/null +++ b/packages/sqle/src/components/CustomMonacoEditor/style.ts @@ -0,0 +1,9 @@ +import { styled } from '@mui/material'; + +export const CustomMonacoEditorStyleWrapper = styled('div')` + width: 100%; + + & .ant-alert.ant-alert-warning { + margin: 12px 0; + } +`; diff --git a/packages/sqle/src/locale/zh-CN/execWorkflow.ts b/packages/sqle/src/locale/zh-CN/execWorkflow.ts index c1dc215b8..6634cc7ed 100644 --- a/packages/sqle/src/locale/zh-CN/execWorkflow.ts +++ b/packages/sqle/src/locale/zh-CN/execWorkflow.ts @@ -114,7 +114,9 @@ export default { cancelSwitchSqlBackupTips: '当前应用的数据源已开启备份需求，是否确认关闭备份？', cancelSwitchSqlBackupTipsWithInstanceName: - '{{instanceName}}已开启备份需求，是否确认关闭备份？' + '{{instanceName}}已开启备份需求，是否确认关闭备份？', + unsupportedSqlFormatAlert: + '当前数据源类型不支持编辑美化后的SQL，如需编辑，请取消美化' }, tour: { modifyName: '修改工单名称', diff --git a/packages/sqle/src/page/SqlAudit/Create/SQLInfoForm/DatabaseInfo.tsx b/packages/sqle/src/page/SqlAudit/Create/SQLInfoForm/DatabaseInfo.tsx index 4f943ba29..c9e7c5038 100644 --- a/packages/sqle/src/page/SqlAudit/Create/SQLInfoForm/DatabaseInfo.tsx +++ b/packages/sqle/src/page/SqlAudit/Create/SQLInfoForm/DatabaseInfo.tsx @@ -50,6 +50,9 @@ const DatabaseInfo = ({ .then((res) => { if (res.data.code === ResponseCode.SUCCESS) { setInstanceInfo(res.data.data); + form.setFieldsValue({ + dbType: res.data.data?.db_type + }); } }); }; diff --git a/packages/sqle/src/page/SqlAudit/Create/SQLInfoForm/SQLInfoFormItem.tsx b/packages/sqle/src/page/SqlAudit/Create/SQLInfoForm/SQLInfoFormItem.tsx index a6acba76f..0c0c0345f 100644 --- a/packages/sqle/src/page/SqlAudit/Create/SQLInfoForm/SQLInfoFormItem.tsx +++ b/packages/sqle/src/page/SqlAudit/Create/SQLInfoForm/SQLInfoFormItem.tsx @@ -6,7 +6,11 @@ import { UploadTypeEnum } from './index.type'; import { useCurrentProject } from '@actiontech/shared/lib/features'; -import { FormItemLabel, CustomLabelContent } from '@actiontech/dms-kit'; +import { + FormItemLabel, + CustomLabelContent, + isSupportLanguage +} from '@actiontech/dms-kit'; import { Form, Radio, RadioGroupProps, SelectProps, Space } from 'antd'; import { formItemLayout } from '@actiontech/dms-kit/es/components/CustomForm/style'; import { BasicButton, BasicSelect, BasicToolTip } from '@actiontech/dms-kit'; @@ -20,6 +24,9 @@ import { FormatLanguageSupport, formatterSQL } from '@actiontech/dms-kit'; import { InfoCircleOutlined } from '@actiontech/icons'; import useGlobalRuleTemplate from '../../../../hooks/useGlobalRuleTemplate'; import useRuleTemplate from '../../../../hooks/useRuleTemplate'; +import { SqlFormatterButtonStyleWrapper } from '../../../SqlExecWorkflow/Common/style'; +import classNames from 'classnames'; + const SQLInfoFormItem = ({ form, submit, @@ -31,6 +38,8 @@ const SQLInfoFormItem = ({ const auditType = Form.useWatch('auditType', form); const uploadType = Form.useWatch('uploadType', form); const selectedDbType = Form.useWatch('dbType', form); + const formatted = Form.useWatch('formatted', form); + const originSql = Form.useWatch('originSql', form); const { loading: getDriverMetaLoading, updateDriverNameList, @@ -39,7 +48,6 @@ const SQLInfoFormItem = ({ const { instanceOptions, updateInstanceList, - instanceList, loading: instanceLoading } = useInstance(); const { @@ -76,20 +84,28 @@ const SQLInfoFormItem = ({ ]); const auditTypeChange: RadioGroupProps['onChange'] = () => { form.setFieldsValue({ - instanceName: undefined + instanceName: undefined, + dbType: undefined }); }; + const formatSql = async () => { - const values = await form.getFieldsValue(); - const dbType = - auditType === AuditTypeEnum.dynamic - ? instanceList.find((v) => v.instance_name === values.instanceName) - ?.instance_type - : values.dbType; - const sql = formatterSQL(values.sql, dbType); - form.setFieldsValue({ - sql - }); + const values = form.getFieldsValue(); + if (values.sql && selectedDbType) { + const sql = formatterSQL(values.sql, selectedDbType); + if (formatted && !isSupportLanguage(selectedDbType)) { + form.setFieldsValue({ + formatted: false, + sql: originSql + }); + return; + } + form.setFieldsValue({ + sql, + originSql: values.sql, + formatted: true + }); + } }; const internalSubmit = async () => { const params = await form.validateFields(); @@ -191,9 +207,15 @@ const SQLInfoFormItem = ({ {t('sqlAudit.create.sqlInfo.audit')} diff --git a/packages/sqle/src/page/SqlExecWorkflow/Common/SqlStatementFormController/SqlStatementFormItem/components/SqlUploadContent.tsx b/packages/sqle/src/page/SqlExecWorkflow/Common/SqlStatementFormController/SqlStatementFormItem/components/SqlUploadContent.tsx index fea25d85e..76818b4ca 100644 --- a/packages/sqle/src/page/SqlExecWorkflow/Common/SqlStatementFormController/SqlStatementFormItem/components/SqlUploadContent.tsx +++ b/packages/sqle/src/page/SqlExecWorkflow/Common/SqlStatementFormController/SqlStatementFormItem/components/SqlUploadContent.tsx @@ -1,24 +1,46 @@ import { Form } from 'antd'; import { SqlUploadContentProps } from './index.type'; import { SqlAuditInfoFormFields } from '../../../../Create/index.type'; -import { CustomDraggerUpload, LazyLoadComponent } from '@actiontech/dms-kit'; import { AuditTaskResV1SqlSourceEnum } from '@actiontech/shared/lib/api/sqle/service/common.enum'; -import { FormItemNoLabel } from '@actiontech/dms-kit'; -import { getFileFromUploadChangeEvent } from '@actiontech/dms-kit'; -import { useTranslation } from 'react-i18next'; -import { whiteSpaceSql } from '@actiontech/dms-kit'; import { - MonacoEditor, - useMonacoEditor -} from '@actiontech/shared/lib/components/MonacoEditor'; + getFileFromUploadChangeEvent, + whiteSpaceSql, + FormItemNoLabel, + SQL_EDITOR_PLACEHOLDER_VALUE, + CustomDraggerUpload, + LazyLoadComponent, + BasicSwitch, + BasicInput +} from '@actiontech/dms-kit'; +import { useTranslation } from 'react-i18next'; +import { useMonacoEditor } from '@actiontech/shared/lib/components/MonacoEditor'; import { NamePath } from 'antd/es/form/interface'; -import { SQL_EDITOR_PLACEHOLDER_VALUE } from '@actiontech/dms-kit'; +import { useMemo } from 'react'; +import CustomMonacoEditor from '../../../../../../components/CustomMonacoEditor'; + const SqlUploadContent: React.FC = ({ fieldPrefixPath, - currentSqlUploadType + currentSqlUploadType, + dbSourceInfoCollection }) => { const { t } = useTranslation(); const form = Form.useFormInstance(); + const currentFieldSqlIsFormatted = Form.useWatch( + [fieldPrefixPath, 'formatted'], + form + ); + + const isReadOnlyMode = useMemo(() => { + return ( + currentFieldSqlIsFormatted && + !dbSourceInfoCollection.value?.[fieldPrefixPath]?.isSupportFormatSql + ); + }, [ + currentFieldSqlIsFormatted, + dbSourceInfoCollection.value, + fieldPrefixPath + ]); + const generateFieldName = (name: string) => { return [fieldPrefixPath, name]; }; @@ -50,16 +72,28 @@ const SqlUploadContent: React.FC = ({ ) ]} > - + + ; +} & Pick< + SqlStatementFormItemProps, + 'fieldPrefixPath' | 'dbSourceInfoCollection' +>; export type SqlExecModeSelectorProps = { currentSqlUploadType: AuditTaskResV1SqlSourceEnum; @@ -22,6 +25,7 @@ export type SqlFormatterAndSubmitterProps = { | 'databaseInfo' | 'isSameSqlForAll' | 'setActiveKey' + | 'dbSourceInfoCollection' >; export type SqlBackupSwitcherProps = Pick< diff --git a/packages/sqle/src/page/SqlExecWorkflow/Common/SqlStatementFormController/SqlStatementFormItem/index.tsx b/packages/sqle/src/page/SqlExecWorkflow/Common/SqlStatementFormController/SqlStatementFormItem/index.tsx index ed3931f0a..3f88f5634 100644 --- a/packages/sqle/src/page/SqlExecWorkflow/Common/SqlStatementFormController/SqlStatementFormItem/index.tsx +++ b/packages/sqle/src/page/SqlExecWorkflow/Common/SqlStatementFormController/SqlStatementFormItem/index.tsx @@ -23,7 +23,8 @@ const SqlStatementFormItem: React.FC = ({ isSupportFileModeExecuteSql, isAtRejectStep, isAtFormStep, - setActiveKey + setActiveKey, + dbSourceInfoCollection }) => { const { t } = useTranslation(); const form = Form.useFormInstance(); @@ -72,6 +73,7 @@ const SqlStatementFormItem: React.FC = ({ = ({ databaseInfo={databaseInfo} isSameSqlForAll={isSameSqlForAll} setActiveKey={setActiveKey} + dbSourceInfoCollection={dbSourceInfoCollection} /> ); diff --git a/packages/sqle/src/page/SqlExecWorkflow/Common/SqlStatementFormController/SqlStatementFormItem/index.type.ts b/packages/sqle/src/page/SqlExecWorkflow/Common/SqlStatementFormController/SqlStatementFormItem/index.type.ts index 6b3149a36..c21af2df5 100644 --- a/packages/sqle/src/page/SqlExecWorkflow/Common/SqlStatementFormController/SqlStatementFormItem/index.type.ts +++ b/packages/sqle/src/page/SqlExecWorkflow/Common/SqlStatementFormController/SqlStatementFormItem/index.type.ts @@ -10,4 +10,7 @@ export type SqlStatementFormItemProps = { isSupportFileModeExecuteSql: boolean; isAtRejectStep?: boolean; setActiveKey?: (key: string) => void; -} & Pick; +} & Pick< + SqlAuditInfoFormProps, + 'isAuditing' | 'auditAction' | 'isAtFormStep' | 'dbSourceInfoCollection' +>; diff --git a/packages/sqle/src/page/SqlExecWorkflow/Common/style.ts b/packages/sqle/src/page/SqlExecWorkflow/Common/style.ts index 8ecf9d400..cc9e0f6a6 100644 --- a/packages/sqle/src/page/SqlExecWorkflow/Common/style.ts +++ b/packages/sqle/src/page/SqlExecWorkflow/Common/style.ts @@ -1,4 +1,15 @@ import { styled } from '@mui/material'; +import { BasicButton } from '@actiontech/dms-kit'; + +export const SqlFormatterButtonStyleWrapper = styled(BasicButton)` + &.ant-btn.basic-button-wrapper.active-formatter-button { + color: ${({ theme }) => + theme.sqleTheme.execWorkflow.create.auditResult.toggleButton.activeColor}; + background: ${({ theme }) => + theme.sqleTheme.execWorkflow.create.auditResult.toggleButton + .activeBgColor}; + } +`; export const ToggleButtonStyleWrapper = styled('div')<{ active: boolean; diff --git a/packages/sqle/src/page/SqlExecWorkflow/Create/components/FormStep/SqlAuditInfoForm/SqlAuditInfoFormItem/DatabaseSelectionItems/hooks/useRenderDatabaseSelectionItems.tsx b/packages/sqle/src/page/SqlExecWorkflow/Create/components/FormStep/SqlAuditInfoForm/SqlAuditInfoFormItem/DatabaseSelectionItems/hooks/useRenderDatabaseSelectionItems.tsx index 3ce98f548..db8bbee50 100644 --- a/packages/sqle/src/page/SqlExecWorkflow/Create/components/FormStep/SqlAuditInfoForm/SqlAuditInfoFormItem/DatabaseSelectionItems/hooks/useRenderDatabaseSelectionItems.tsx +++ b/packages/sqle/src/page/SqlExecWorkflow/Create/components/FormStep/SqlAuditInfoForm/SqlAuditInfoFormItem/DatabaseSelectionItems/hooks/useRenderDatabaseSelectionItems.tsx @@ -2,7 +2,11 @@ import instance from '@actiontech/shared/lib/api/sqle/service/instance'; import { DatabaseSelectionItemProps } from '../../../index.type'; import { useCurrentProject } from '@actiontech/shared/lib/features'; import { ResponseCode } from '@actiontech/dms-kit'; -import { BasicButton, BasicToolTip } from '@actiontech/dms-kit'; +import { + BasicButton, + BasicToolTip, + isSupportLanguage +} from '@actiontech/dms-kit'; import { TypedLink } from '@actiontech/shared'; import { MinusCircleFilled, ProfileSquareFilled } from '@actiontech/icons'; import { useTranslation } from 'react-i18next'; @@ -95,11 +99,13 @@ const useRenderDatabaseSelectionItems = ({ }) .then(async (res) => { if (res.data.code === ResponseCode.SUCCESS) { + const dbType = res.data.data?.db_type ?? ''; dbSourceInfoCollection.set(key, { - dbType: res.data.data?.db_type, - ruleTemplate: res.data.data?.rule_template + dbType, + ruleTemplate: res.data.data?.rule_template, + isSupportFormatSql: isSupportLanguage(dbType) }); - getSupportedFileModeByInstanceType(key, res.data.data?.db_type ?? ''); + getSupportedFileModeByInstanceType(key, dbType); } }); }; diff --git a/packages/sqle/src/page/SqlExecWorkflow/Create/components/FormStep/SqlAuditInfoForm/SqlAuditInfoFormItem/index.tsx b/packages/sqle/src/page/SqlExecWorkflow/Create/components/FormStep/SqlAuditInfoForm/SqlAuditInfoFormItem/index.tsx index 70e5fd824..af25792e2 100644 --- a/packages/sqle/src/page/SqlExecWorkflow/Create/components/FormStep/SqlAuditInfoForm/SqlAuditInfoFormItem/index.tsx +++ b/packages/sqle/src/page/SqlExecWorkflow/Create/components/FormStep/SqlAuditInfoForm/SqlAuditInfoFormItem/index.tsx @@ -137,6 +137,7 @@ const SqlAuditInfoFormItem = forwardRef( isAuditing={sharedStepDetail.isAuditing} isSupportFileModeExecuteSqlRecord={isSupportFileModeExecuteSqlRecord} isAtFormStep={sharedStepDetail.isAtFormStep} + dbSourceInfoCollection={sharedStepDetail.dbSourceInfoCollection} /> ); diff --git a/packages/sqle/src/page/SqlExecWorkflow/Create/index.tsx b/packages/sqle/src/page/SqlExecWorkflow/Create/index.tsx index 859138929..fc8fd50e6 100644 --- a/packages/sqle/src/page/SqlExecWorkflow/Create/index.tsx +++ b/packages/sqle/src/page/SqlExecWorkflow/Create/index.tsx @@ -2,6 +2,7 @@ import { Spin, message } from 'antd'; import { useForm } from 'antd/es/form/Form'; import { SqlAuditInfoFormFields, + SqlStatementFields, WorkflowBaseInfoFormFields } from './index.type'; import useCreateWorkflowSteps from './hooks/useCreateWorkflowSteps'; @@ -26,6 +27,10 @@ import { useSelector } from 'react-redux'; import { IReduxState } from '../../../store'; import useCreationMode from './hooks/useCreationMode'; import useCheckTaskAuditRuleExceptionStatus from './hooks/useCheckTaskAuditRuleExceptionStatus'; +import { SAME_SQL_MODE_DEFAULT_FIELD_KEY } from '../Common/SqlStatementFormController/SqlStatementFormItem/index.data'; +import { AuditTaskResV1SqlSourceEnum } from '@actiontech/shared/lib/api/sqle/service/common.enum'; +import { cloneDeep } from 'lodash'; + const CreateSqlExecWorkflow: React.FC = () => { const { t } = useTranslation(); const [baseInfoForm] = useForm(); @@ -82,6 +87,7 @@ const CreateSqlExecWorkflow: React.FC = () => { goToCreateResultStep } = useCreateWorkflowSteps(); const sharedStepDetail = useSharedStepDetail(); + const { taskInfos, auditWorkflowWithSameSql, @@ -89,6 +95,7 @@ const CreateSqlExecWorkflow: React.FC = () => { isConfirmationRequiredForSubmission, submitWorkflowConfirmationMessage } = useAuditWorkflow(); + const auditAction = useCallback( async ( values: SqlAuditInfoFormFields, @@ -104,25 +111,60 @@ const CreateSqlExecWorkflow: React.FC = () => { goToAuditResultStep(); } }; + try { //虽然审核不需要 baseInfo 数据，但还是需要进行校验 await baseInfoForm.validateFields(); sharedStepDetail.isAuditing.set(true); if (values.isSameSqlForAll) { + // 如果是不支持美化的数据源，则提交原始sql + const sqlStatementInfo = values[ + SAME_SQL_MODE_DEFAULT_FIELD_KEY + ] as SqlStatementFields; + + const isFormDataUploadType = + sqlStatementInfo.currentUploadType === + AuditTaskResV1SqlSourceEnum.form_data; + const { isSupportFormatSql } = + sharedStepDetail.dbSourceInfoCollection.value[ + SAME_SQL_MODE_DEFAULT_FIELD_KEY + ]; + const noFormattedSql = sqlStatementInfo.originSql; + + if (isFormDataUploadType && !isSupportFormatSql && !!noFormattedSql) { + sqlStatementInfo.form_data = noFormattedSql; + } auditWorkflowWithSameSql(values, onSuccess).finally(finallyFunc); } else { + const convertValues = cloneDeep(values); + const dataSourceInfo = Object.keys( + sharedStepDetail.dbSourceInfoCollection.value + ).map((key) => ({ + key, + instanceName: + sharedStepDetail.dbSourceInfoCollection.value[key].instanceName, + schemaName: + sharedStepDetail.dbSourceInfoCollection.value[key].schemaName + })); + dataSourceInfo.map((i) => { + const sqlStatementInfo = convertValues[i.key] as SqlStatementFields; + const isFormDataUploadType = + sqlStatementInfo.currentUploadType === + AuditTaskResV1SqlSourceEnum.form_data; + const { isSupportFormatSql } = + sharedStepDetail.dbSourceInfoCollection.value[i.key]; + const noFormattedSql = sqlStatementInfo.originSql; + if ( + isFormDataUploadType && + !isSupportFormatSql && + !!noFormattedSql + ) { + sqlStatementInfo.form_data = noFormattedSql; + } + }); auditWorkflowWthDifferenceSql( - values, - Object.keys(sharedStepDetail.dbSourceInfoCollection.value).map( - (key) => ({ - key, - instanceName: - sharedStepDetail.dbSourceInfoCollection.value[key] - .instanceName, - schemaName: - sharedStepDetail.dbSourceInfoCollection.value[key].schemaName - }) - ), + convertValues, + dataSourceInfo, onSuccess ).finally(finallyFunc); } @@ -133,7 +175,7 @@ const CreateSqlExecWorkflow: React.FC = () => { auditWorkflowWthDifferenceSql, baseInfoForm, goToAuditResultStep, - sharedStepDetail.dbSourceInfoCollection.value, + sharedStepDetail.dbSourceInfoCollection, sharedStepDetail.isAuditing ] ); diff --git a/packages/sqle/src/page/SqlExecWorkflow/Create/index.type.ts b/packages/sqle/src/page/SqlExecWorkflow/Create/index.type.ts index 50473e3dd..e87e25ff4 100644 --- a/packages/sqle/src/page/SqlExecWorkflow/Create/index.type.ts +++ b/packages/sqle/src/page/SqlExecWorkflow/Create/index.type.ts @@ -28,6 +28,8 @@ export type SqlStatementFields = Record< currentUploadType: AuditTaskResV1SqlSourceEnum; backup?: boolean; backupMaxRows?: number; + originSql?: string; // 用户输入的原始sql + formatted?: boolean; // 当前sql是否已经格式化 }; export type CreateWorkflowDatabaseInfo = Array<{ @@ -70,6 +72,7 @@ export type DataSourceSchemaCollection = Record< enableBackup?: boolean; backupMaxRows?: number; allowBackup?: boolean; + isSupportFormatSql?: boolean; } >; diff --git a/packages/sqle/src/page/SqlExecWorkflow/Detail/components/ModifySqlStatement/index.tsx b/packages/sqle/src/page/SqlExecWorkflow/Detail/components/ModifySqlStatement/index.tsx index 32cabeba2..3fd17a66d 100644 --- a/packages/sqle/src/page/SqlExecWorkflow/Detail/components/ModifySqlStatement/index.tsx +++ b/packages/sqle/src/page/SqlExecWorkflow/Detail/components/ModifySqlStatement/index.tsx @@ -15,7 +15,7 @@ import { useEffect, useMemo } from 'react'; import { useBoolean } from 'ahooks'; import { useCurrentProject } from '@actiontech/shared/lib/features'; import workflow from '@actiontech/shared/lib/api/sqle/service/workflow'; -import { ResponseCode } from '@actiontech/dms-kit'; +import { isSupportLanguage, ResponseCode } from '@actiontech/dms-kit'; import { PageLayoutHasFixedHeaderStyleWrapper } from '@actiontech/dms-kit'; import { BasicButton, EmptyBox, PageHeader } from '@actiontech/dms-kit'; import { usePrompt } from '@actiontech/shared/lib/hooks'; @@ -36,6 +36,8 @@ import { BriefcaseFilled, LeftArrowOutlined } from '@actiontech/icons'; import Icon from '@ant-design/icons'; import useInstance from '../../../../../hooks/useInstance'; import useCheckTaskAuditRuleExceptionStatus from '../../../Create/hooks/useCheckTaskAuditRuleExceptionStatus'; +import instance from '@actiontech/shared/lib/api/sqle/service/instance'; + const ModifySqlStatement: React.FC = ({ currentTasks, modifiedTasks, @@ -61,8 +63,12 @@ const ModifySqlStatement: React.FC = ({ const { updateTaskRecordCount, checkTaskCountIsEmpty } = useCheckTaskAuditSqlCount(); const [messageApi, messageContextHolder] = message.useMessage(); - const { isAuditing, sqlStatementTabActiveKey, resetAllSharedData } = - useSharedStepDetail(); + const { + isAuditing, + sqlStatementTabActiveKey, + resetAllSharedData, + dbSourceInfoCollection + } = useSharedStepDetail(); const [submitLoading, { setTrue: startSubmit, setFalse: submitFinish }] = useBoolean(); const [ @@ -101,19 +107,45 @@ const ModifySqlStatement: React.FC = ({ const databaseInfo = useMemo(() => { return (currentTasks ?? []) .map((item, index) => { + const instanceInfo = instanceList.find( + (i) => i.instance_name === item.instance_name + ); return { key: isSameSqlForAll ? `${index}` : item.task_id?.toString() ?? '', instanceName: item.instance_name, schemaName: item.instance_schema, enableBackup: item.enable_backup, backupMaxRows: item.backup_max_rows, - allowBackup: !!instanceList.find( - (i) => i.instance_name === item.instance_name - )?.supported_backup_strategy?.length + allowBackup: !!instanceInfo?.supported_backup_strategy?.length }; }) .filter((v) => !!v.instanceName); }, [currentTasks, instanceList, isSameSqlForAll]); + + useEffect(() => { + if (databaseInfo.length) { + const taskList = isSameSqlForAll ? [databaseInfo[0]] : databaseInfo; + taskList.forEach((i) => { + instance + .getInstanceV2({ + project_name: projectName, + instance_name: i.instanceName ?? '' + }) + .then(async (res) => { + if (res.data.code === ResponseCode.SUCCESS) { + const dbType = res.data.data?.db_type ?? ''; + dbSourceInfoCollection.set(i.key, { + dbType, + ruleTemplate: res.data.data?.rule_template, + isSupportFormatSql: isSupportLanguage(dbType) + }); + } + }); + }); + } + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [databaseInfo]); + const innerAuditAction = async (values: SqlAuditInfoFormFields) => { isAuditing.set(true); try { @@ -289,6 +321,7 @@ const ModifySqlStatement: React.FC = ({ auditAction={innerAuditAction} disabledUploadType isAtRejectStep + dbSourceInfoCollection={dbSourceInfoCollection} /> diff --git a/packages/sqle/src/page/SqlOptimization/Create/SQLInfoForm/SQLInfoFormItem.tsx b/packages/sqle/src/page/SqlOptimization/Create/SQLInfoForm/SQLInfoFormItem.tsx index d4dc1778a..051ff7d2b 100644 --- a/packages/sqle/src/page/SqlOptimization/Create/SQLInfoForm/SQLInfoFormItem.tsx +++ b/packages/sqle/src/page/SqlOptimization/Create/SQLInfoForm/SQLInfoFormItem.tsx @@ -1,5 +1,5 @@ import { useTranslation } from 'react-i18next'; -import { useEffect } from 'react'; +import { useEffect, useMemo } from 'react'; import { SqlInfoFormProps, OptimizationTypeEnum, @@ -12,9 +12,13 @@ import { BasicToolTip, BasicInput, EmptyBox, - BasicSelect + BasicSelect, + isSupportLanguage, + FormItemNoLabel, + BasicSwitch, + SQL_EDITOR_PLACEHOLDER_VALUE } from '@actiontech/dms-kit'; -import { MonacoEditor, useMonacoEditor } from '@actiontech/shared'; +import { useMonacoEditor } from '@actiontech/shared'; import DatabaseInfo from './DatabaseInfo'; import useInstance from '../../../../hooks/useInstance'; @@ -27,6 +31,9 @@ import { formItemLayout } from '@actiontech/dms-kit/es/components/CustomForm/sty import { useSelector } from 'react-redux'; import { IReduxState } from '../../../../store'; import useDatabaseType from '../../../../hooks/useDatabaseType'; +import { SqlFormatterButtonStyleWrapper } from '../../../SqlExecWorkflow/Common/style'; +import classNames from 'classnames'; +import CustomMonacoEditor from '../../../../components/CustomMonacoEditor'; const SQLInfoFormItem: React.FC = ({ form, submit }) => { const { t } = useTranslation(); @@ -37,6 +44,9 @@ const SQLInfoFormItem: React.FC = ({ form, submit }) => { const optimizationType = Form.useWatch('optimizationType', form); const uploadType = Form.useWatch('uploadType', form); + const dbType = Form.useWatch('dbType', form); + const formatted = Form.useWatch('formatted', form); + const originSql = Form.useWatch('originSql', form); const { editorDidMount } = useMonacoEditor(form, { formName: 'sql' @@ -71,21 +81,41 @@ const SQLInfoFormItem: React.FC = ({ form, submit }) => { form.setFieldsValue({ instanceName: undefined, instanceSchema: undefined, - dbType: undefined + dbType: undefined, + formatted: undefined, + originSql: undefined }); }; + const isReadOnlyMode = useMemo(() => { + return formatted && !isSupportLanguage(dbType); + }, [formatted, dbType]); + const formatSql = async () => { const values = await form.getFieldsValue(); - if (values.optimizationType === OptimizationTypeEnum.online) { - const sql = formatterSQL(values.sql, values.dbType); - form.setFieldsValue({ - sql - }); - } else { - const sql = formatterSQL(values?.offlineSql ?? '', values.dbType); + const sqlNotDefaultValue = + !!values.sql && values.sql !== SQL_EDITOR_PLACEHOLDER_VALUE; + const offlineSqlNotDefaultValue = + !!values.offlineSql && values.offlineSql !== SQL_EDITOR_PLACEHOLDER_VALUE; + const sqlContentNotNull = sqlNotDefaultValue || offlineSqlNotDefaultValue; + + if (sqlContentNotNull && dbType) { + const sqlKey = + values.optimizationType === OptimizationTypeEnum.online + ? 'sql' + : 'offlineSql'; + if (formatted && !isSupportLanguage(dbType)) { + form.setFieldsValue({ + formatted: false, + [sqlKey]: originSql + }); + return; + } + const formattedSql = formatterSQL(values[sqlKey] ?? '', values.dbType); form.setFieldsValue({ - offlineSql: sql + [sqlKey]: formattedSql, + originSql: values[sqlKey], + formatted: true }); } }; @@ -156,15 +186,16 @@ const SQLInfoFormItem: React.FC = ({ form, submit }) => { } ]} > - = ({ form, submit }) => { getInstanceDbType={getInstanceDbType} /> - + - + + = ({ form, submit }) => { } > - + {t('sqlOptimization.create.sqlInfo.format')} - + } title={t('sqlOptimization.create.sqlInfo.formatTips', { diff --git a/packages/sqle/src/page/SqlOptimization/Create/SQLStatementForm/SqlUploadFileCont.tsx b/packages/sqle/src/page/SqlOptimization/Create/SQLStatementForm/SqlUploadFileCont.tsx index 2169a0d6d..50aefef05 100644 --- a/packages/sqle/src/page/SqlOptimization/Create/SQLStatementForm/SqlUploadFileCont.tsx +++ b/packages/sqle/src/page/SqlOptimization/Create/SQLStatementForm/SqlUploadFileCont.tsx @@ -6,10 +6,7 @@ import { UploadTypeEnum } from '../../index.type'; import { Form } from 'antd'; -import { - MonacoEditor, - useMonacoEditor -} from '@actiontech/shared/lib/components/MonacoEditor'; +import { useMonacoEditor } from '@actiontech/shared/lib/components/MonacoEditor'; import { CustomDraggerUpload, EmptyBox, @@ -22,8 +19,9 @@ import { } from '@actiontech/dms-kit'; import { useSelector } from 'react-redux'; import { IReduxState } from '../../../../store'; +import CustomMonacoEditor from '../../../../components/CustomMonacoEditor'; -const SqlUploadFileCont = ({ form }: SQLStatementFormProps) => { +const SqlUploadFileCont = ({ form, isReadOnlyMode }: SQLStatementFormProps) => { const { t } = useTranslation(); const submitLoading = useSelector( (state: IReduxState) => state.sqlOptimization.submitLoading @@ -58,15 +56,16 @@ const SqlUploadFileCont = ({ form }: SQLStatementFormProps) => { ]} initialValue={SQL_EDITOR_PLACEHOLDER_VALUE} > - diff --git a/packages/sqle/src/page/SqlOptimization/Create/SQLStatementForm/index.tsx b/packages/sqle/src/page/SqlOptimization/Create/SQLStatementForm/index.tsx index 479124b12..59efcbf03 100644 --- a/packages/sqle/src/page/SqlOptimization/Create/SQLStatementForm/index.tsx +++ b/packages/sqle/src/page/SqlOptimization/Create/SQLStatementForm/index.tsx @@ -15,7 +15,10 @@ import { formItemLayout } from '@actiontech/dms-kit/es/components/CustomForm/sty import { useSelector } from 'react-redux'; import { IReduxState } from '../../../../store'; -const SQLStatementFormWrapper = ({ form }: SQLStatementFormProps) => { +const SQLStatementFormWrapper = ({ + form, + isReadOnlyMode +}: SQLStatementFormProps) => { const { t } = useTranslation(); const submitLoading = useSelector( (state: IReduxState) => state.sqlOptimization.submitLoading @@ -67,7 +70,9 @@ const SQLStatementFormWrapper = ({ form }: SQLStatementFormProps) => { } + defaultNode={ + + } > {/* git form info */} { const baseValue = await baseForm.validateFields(); const sqlInfoValue = await sqlInfoForm.validateFields(); dispatch(updateSubmitLoading({ loading: true })); + const formattedSql = + sqlInfoValue.optimizationType === OptimizationTypeEnum.online + ? sqlInfoValue.sql + : sqlInfoValue.offlineSql; + const sql = isSupportLanguage(sqlInfoValue.dbType) + ? formattedSql + : sqlInfoValue.originSql; sqlOptimization .SQLOptimizeV2({ optimization_name: baseValue.optimizationName, @@ -59,10 +66,7 @@ const SqlOptimizationCreate = () => { instance_name: sqlInfoValue.instanceName, schema_name: sqlInfoValue.instanceSchema, db_type: sqlInfoValue.dbType, - sql_content: - sqlInfoValue.optimizationType === OptimizationTypeEnum.online - ? sqlInfoValue.sql - : sqlInfoValue.offlineSql, + sql_content: sql, metadata: sqlInfoValue.tableStructure, explain_info: sqlInfoValue.executionPlan, input_sql_file: sqlInfoValue.sqlFile?.[0], diff --git a/packages/sqle/src/page/SqlOptimization/index.type.ts b/packages/sqle/src/page/SqlOptimization/index.type.ts index ff4c73269..b48538d12 100644 --- a/packages/sqle/src/page/SqlOptimization/index.type.ts +++ b/packages/sqle/src/page/SqlOptimization/index.type.ts @@ -24,12 +24,14 @@ export type SqlInfoFormFields = { optimizationType: OptimizationTypeEnum; uploadType: UploadTypeEnum; sql: string; + originSql: string; sqlFile: File[]; mybatisFile: File[]; zipFile: File[]; instanceName: string; instanceSchema: string; dbType: string; + formatted?: boolean; gitHttpUrl: string; gitUserName: string; gitUserPassword: string; @@ -53,7 +55,9 @@ export type DatabaseInfoProps = { getInstanceDbType: (instanceName: string) => string; }; -export type SQLStatementFormProps = Pick; +export type SQLStatementFormProps = Pick & { + isReadOnlyMode?: boolean; +}; export type SQLStatementFields = { sql: string; From 674e4090b957a9ccab03bd86fae33aa27ace4d3f Mon Sep 17 00:00:00 2001 From: zzyangh <799463087@qq.com> Date: Fri, 7 Nov 2025 10:28:23 +0800 Subject: [PATCH 2/5] [test]: Update unit tests --- .../__snapshots__/index.test.tsx.snap | 141 +- .../Create/__tests__/index.test.tsx | 122 +- .../__snapshots__/index.test.tsx.snap | 282 ++- .../__snapshots__/index.test.tsx.snap | 282 ++- .../useCreateExportTaskForm.test.tsx | 44 +- .../testUtils/mockUseCreateExportTaskForm.ts | 3 +- .../testUtil/mockApi/sqle/instance/data.ts | 8 + .../lib/testUtil/mockModule/mockEditor.jsx | 1 + .../__snapshots__/index.test.tsx.snap | 75 + .../__tests__/index.test.tsx | 14 + .../__snapshots__/index.test.tsx.snap | 112 +- .../Create/__snapshots__/index.test.tsx.snap | 442 +++- .../src/page/SqlAudit/Create/index.test.tsx | 139 +- .../SqlFormatterAndSubmitter.test.tsx | 198 ++ .../__tests__/SqlUploadContent.test.tsx | 9 +- .../SqlUploadContent.test.tsx.snap | 18 + .../__snapshots__/index.ce.test.tsx.snap | 110 +- .../__snapshots__/index.test.tsx.snap | 224 +- .../__tests__/index.ce.test.tsx | 1 + .../__tests__/index.test.tsx | 1 + .../__snapshots__/index.ce.test.tsx.snap | 114 +- .../__snapshots__/index.test.tsx.snap | 342 ++- .../__tests__/index.ce.test.tsx | 1 + .../__tests__/index.test.tsx | 1 + .../__snapshots__/index.ce.test.tsx.snap | 114 +- .../__snapshots__/index.test.tsx.snap | 2189 +++++++++++++++-- .../Create/__tests__/index.test.tsx | 145 ++ .../useRenderDatabaseSelectionItems.test.tsx | 3 +- .../Detail/__tests__/index.test.tsx | 1 + .../__snapshots__/index.test.tsx.snap | 456 +++- .../__tests__/index.test.tsx | 4 +- .../Create/__snapshots__/index.test.tsx.snap | 114 +- .../SqlOptimization/Create/index.test.tsx | 103 + 33 files changed, 5290 insertions(+), 523 deletions(-) create mode 100644 packages/sqle/src/components/CustomMonacoEditor/__tests__/__snapshots__/index.test.tsx.snap create mode 100644 packages/sqle/src/components/CustomMonacoEditor/__tests__/index.test.tsx diff --git a/packages/base/src/page/DataExportManagement/Create/__tests__/__snapshots__/index.test.tsx.snap b/packages/base/src/page/DataExportManagement/Create/__tests__/__snapshots__/index.test.tsx.snap index e060f7f25..cb08fc3f5 100644 --- a/packages/base/src/page/DataExportManagement/Create/__tests__/__snapshots__/index.test.tsx.snap +++ b/packages/base/src/page/DataExportManagement/Create/__tests__/__snapshots__/index.test.tsx.snap @@ -359,6 +359,33 @@ exports[`first should match snapshot when pageState is equal CREATE_TASK 1`] = ` +
+
+
+
+
+ +
+
+
+
+
@@ -612,24 +639,114 @@ exports[`first should match snapshot when pageState is equal CREATE_TASK 1`] = ` class="ant-form-item-control-input-content" >
- +
+ +
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+ + + + + +
+
+
+
+
+
+
+ +
+
+
+
+
+ + + + + +
+
+
+
+
+
+
+ +
+
+
+
+
+ + + + + +
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
@@ -1452,24 +1596,114 @@ exports[`test base/DataExport/Create/UpdateInfoDrawer should match snapshot when class="ant-form-item-control-input-content" >
- +
+ +
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
diff --git a/packages/sqle/src/page/SqlAudit/Create/__snapshots__/index.test.tsx.snap b/packages/sqle/src/page/SqlAudit/Create/__snapshots__/index.test.tsx.snap index 4559eb806..75a63b50e 100644 --- a/packages/sqle/src/page/SqlAudit/Create/__snapshots__/index.test.tsx.snap +++ b/packages/sqle/src/page/SqlAudit/Create/__snapshots__/index.test.tsx.snap @@ -1181,24 +1181,114 @@ exports[`sqle/SqlAudit/Create enter default content to create sql audit 1`] = ` class="ant-form-item-control-input-content" >
- +
+ +
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
@@ -1226,7 +1316,7 @@ exports[`sqle/SqlAudit/Create enter default content to create sql audit 1`] = ` style="margin-right: 8px;" >
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
@@ -2670,7 +2850,7 @@ exports[`sqle/SqlAudit/Create select static audit type 1`] = ` style="margin-right: 8px;" >
@@ -3908,24 +4088,114 @@ exports[`sqle/SqlAudit/Create select static audit type 2`] = ` class="ant-form-item-control-input-content" >
- +
+ +
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
@@ -3953,7 +4223,7 @@ exports[`sqle/SqlAudit/Create select static audit type 2`] = ` style="margin-right: 8px;" >
- mysql + MySQL
@@ -4544,9 +4814,9 @@ exports[`sqle/SqlAudit/Create upload sql file 1`] = ` src="" /> - mysql + MySQL @@ -5452,7 +5722,7 @@ exports[`sqle/SqlAudit/Create upload sql file 1`] = ` style="margin-right: 8px;" > + + + + + +
+
+
+
+
+
+
+ +
+
+
+
+
- +
+ +
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
{ { key: '1', instanceName: 'mysql-1', schemaName: 'test' } ]} isAtFormStep + dbSourceInfoCollection={{ value: {}, set: jest.fn() }} {...params} /> diff --git a/packages/sqle/src/page/SqlExecWorkflow/Common/SqlStatementFormController/SqlStatementFormItem/__tests__/index.test.tsx b/packages/sqle/src/page/SqlExecWorkflow/Common/SqlStatementFormController/SqlStatementFormItem/__tests__/index.test.tsx index 099f40062..a89a5032e 100644 --- a/packages/sqle/src/page/SqlExecWorkflow/Common/SqlStatementFormController/SqlStatementFormItem/__tests__/index.test.tsx +++ b/packages/sqle/src/page/SqlExecWorkflow/Common/SqlStatementFormController/SqlStatementFormItem/__tests__/index.test.tsx @@ -38,6 +38,7 @@ describe('test SqlStatementFormItem', () => { ]} setActiveKey={jest.fn()} isAtFormStep + dbSourceInfoCollection={{ value: {}, set: jest.fn() }} {...params} /> diff --git a/packages/sqle/src/page/SqlExecWorkflow/Common/SqlStatementFormController/__tests__/__snapshots__/index.ce.test.tsx.snap b/packages/sqle/src/page/SqlExecWorkflow/Common/SqlStatementFormController/__tests__/__snapshots__/index.ce.test.tsx.snap index fa4a0bd9b..1845d254c 100644 --- a/packages/sqle/src/page/SqlExecWorkflow/Common/SqlStatementFormController/__tests__/__snapshots__/index.ce.test.tsx.snap +++ b/packages/sqle/src/page/SqlExecWorkflow/Common/SqlStatementFormController/__tests__/__snapshots__/index.ce.test.tsx.snap @@ -292,24 +292,114 @@ exports[`test SqlStatementFormController ce should match snapshot 1`] = ` class="ant-form-item-control-input-content" >
- +
+ +
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+ +
+ + + TiDB + +
+ +
+
+
+ tidb-1(10.186.62.17:4000) +
+
@@ -13414,24 +13991,114 @@ exports[`sqle/SqlExecWorkflow/Create should handle form submission and audit act class="ant-form-item-control-input-content" >
- +
+ +
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+ +
+ + + TiDB + +
+ +
+
+
+ tidb-1(10.186.62.17:4000) +
+
@@ -15909,24 +16613,114 @@ exports[`sqle/SqlExecWorkflow/Create should handle form submission and audit act class="ant-form-item-control-input-content" >
- +
+ +
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+ +
+ + + TiDB + +
+ +
+
+
+ tidb-1(10.186.62.17:4000) +
+
@@ -20123,23 +21044,113 @@ exports[`sqle/SqlExecWorkflow/Create should handle form submission and audit act class="ant-form-item-control-input-content" >
- +
+ +
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
- +
+ +
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+ +
+ + + TiDB + +
+ +
+
+
+ tidb-1(10.186.62.17:4000) +
+
@@ -24636,28 +25864,118 @@ exports[`sqle/SqlExecWorkflow/Create should snapshot UI and perform SQL audit in class="ant-form-item-control-input-content" >
- + + width="100%" + /> +
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+ +
+ + + TiDB + +
+ +
+
+
+ tidb-1(10.186.62.17:4000) +
+
@@ -26488,28 +27843,118 @@ exports[`sqle/SqlExecWorkflow/Create should snapshot UI and perform SQL audit in class="ant-form-item-control-input-content" >
- + + width="100%" + /> +
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+ +
+ + + TiDB + +
+ +
+
+
+ tidb-1(10.186.62.17:4000) +
+
@@ -28860,24 +30342,114 @@ exports[`sqle/SqlExecWorkflow/Create should snapshot render initial workflow cre class="ant-form-item-control-input-content" >
- +
+ +
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+ +
+ + + TiDB + +
+ +
+
+
+ tidb-1(10.186.62.17:4000) +
+
diff --git a/packages/sqle/src/page/SqlExecWorkflow/Create/__tests__/index.test.tsx b/packages/sqle/src/page/SqlExecWorkflow/Create/__tests__/index.test.tsx index 63d364356..517d292fc 100644 --- a/packages/sqle/src/page/SqlExecWorkflow/Create/__tests__/index.test.tsx +++ b/packages/sqle/src/page/SqlExecWorkflow/Create/__tests__/index.test.tsx @@ -1157,4 +1157,149 @@ describe('sqle/SqlExecWorkflow/Create', () => { workflow_id: '1' }); }); + + it('should use original SQL when database type does not support formatting in same SQL mode', async () => { + requestInstance.mockImplementation(() => + createSpySuccessResponse({ + data: { + db_type: 'TiDB' + } + }) + ); + + const { baseElement } = customRender(); + await act(async () => jest.advanceTimersByTime(3000)); + + // workflow_subject + const workflowName = getBySelector('#workflow_subject', baseElement); + fireEvent.change(workflowName, { + target: { + value: 'workflow_name_unsupported_db' + } + }); + + // data source + const instanceNameEle = getBySelector( + '#databaseInfo_0_instanceName', + baseElement + ); + fireEvent.mouseDown(instanceNameEle); + const instanceNameLabel = `${instanceTipsMockData[5].instance_name}(${instanceTipsMockData[5].host}:${instanceTipsMockData[5].port})`; + fireEvent.click(getBySelector(`div[title="${instanceNameLabel}"]`)); + await act(async () => jest.advanceTimersByTime(3000)); + + const SchemaNameEle = getBySelector( + '#databaseInfo_0_instanceSchema', + baseElement + ); + fireEvent.mouseDown(SchemaNameEle); + await act(async () => jest.advanceTimersByTime(0)); + fireEvent.click(getBySelector(`div[title="test123"]`)); + await act(async () => jest.advanceTimersByTime(3000)); + + // 输入原始 SQL + const originalSql = 'SELECT * FROM users WHERE id=1'; + const monacoEditor = getBySelector('.custom-monaco-editor', baseElement); + fireEvent.change(monacoEditor, { + target: { + value: originalSql + } + }); + await act(async () => jest.advanceTimersByTime(0)); + + // 点击 SQL 美化按钮 + fireEvent.click(screen.getByText('SQL美化')); + await act(async () => jest.advanceTimersByTime(3000)); + + // 执行审核 - 应该使用原始 SQL + fireEvent.click(screen.getByText('审 核')); + await act(async () => jest.advanceTimersByTime(0)); + + expect(requestAuditTask).toHaveBeenCalledTimes(1); + + await act(async () => jest.advanceTimersByTime(3000)); + expect(auditTaskGroupId).toHaveBeenCalledTimes(1); + expect(auditTaskGroupId).toHaveBeenCalledWith({ + task_group_id: 99, + enable_backup: undefined, + backup_max_rows: undefined, + sql: originalSql + }); + }); + + it('should use original SQL when database type does not support formatting in different SQL mode', async () => { + requestInstance.mockImplementation(() => + createSpySuccessResponse({ + data: { + db_type: 'TiDB' + } + }) + ); + + const { baseElement } = customRender(); + await act(async () => jest.advanceTimersByTime(3000)); + + // workflow_subject + const workflowName = getBySelector('#workflow_subject', baseElement); + fireEvent.change(workflowName, { + target: { + value: 'workflow_name_different_sql' + } + }); + + // isSameSqlForAll false + const isSameSqlForAll = getBySelector('#isSameSqlForAll', baseElement); + fireEvent.click(isSameSqlForAll); + await act(async () => jest.advanceTimersByTime(0)); + + // data source 1 + const instanceNameEle1 = getBySelector( + '#databaseInfo_0_instanceName', + baseElement + ); + fireEvent.mouseDown(instanceNameEle1); + await act(async () => jest.advanceTimersByTime(0)); + const instanceNameLabel1 = `${instanceTipsMockData[5].instance_name}(${instanceTipsMockData[5].host}:${instanceTipsMockData[5].port})`; + fireEvent.click(getAllBySelector(`div[title="${instanceNameLabel1}"]`)[0]); + await act(async () => jest.advanceTimersByTime(3000)); + + const SchemaNameEle1 = getBySelector( + '#databaseInfo_0_instanceSchema', + baseElement + ); + fireEvent.mouseDown(SchemaNameEle1); + await act(async () => jest.advanceTimersByTime(0)); + fireEvent.click(getBySelector(`div[title="test123"]`)); + await act(async () => jest.advanceTimersByTime(3000)); + + const originalSql1 = 'SELECT * FROM table1 WHERE id=1'; + const monacoEditors = getAllBySelector( + '.custom-monaco-editor', + baseElement + ); + fireEvent.change(monacoEditors[0], { + target: { + value: originalSql1 + } + }); + await act(async () => jest.advanceTimersByTime(0)); + + // 点击第一个 SQL 美化按钮 + const formatButtons = screen.getAllByText('SQL美化'); + fireEvent.click(formatButtons[0]); + await act(async () => jest.advanceTimersByTime(3000)); + + fireEvent.click(screen.getByText('审 核')); + await act(async () => jest.advanceTimersByTime(0)); + + expect(requestAudit).toHaveBeenCalledTimes(1); + expect(requestAudit).toHaveBeenCalledWith({ + exec_mode: undefined, + file_order_method: undefined, + project_name: projectName, + sql: originalSql1, + instance_name: instanceTipsMockData[5].instance_name, + instance_schema: 'test123' + }); + }); }); diff --git a/packages/sqle/src/page/SqlExecWorkflow/Create/components/FormStep/SqlAuditInfoForm/SqlAuditInfoFormItem/DatabaseSelectionItems/__tests__/useRenderDatabaseSelectionItems.test.tsx b/packages/sqle/src/page/SqlExecWorkflow/Create/components/FormStep/SqlAuditInfoForm/SqlAuditInfoFormItem/DatabaseSelectionItems/__tests__/useRenderDatabaseSelectionItems.test.tsx index 00d5c237f..72e098428 100644 --- a/packages/sqle/src/page/SqlExecWorkflow/Create/components/FormStep/SqlAuditInfoForm/SqlAuditInfoFormItem/DatabaseSelectionItems/__tests__/useRenderDatabaseSelectionItems.test.tsx +++ b/packages/sqle/src/page/SqlExecWorkflow/Create/components/FormStep/SqlAuditInfoForm/SqlAuditInfoFormItem/DatabaseSelectionItems/__tests__/useRenderDatabaseSelectionItems.test.tsx @@ -140,7 +140,8 @@ describe('test useRenderDatabaseSelectionItems', () => { MockSharedStepDetail.dbSourceInfoCollection.set ).toHaveBeenCalledWith('key1', { dbType: instanceInfoMockData.db_type, - ruleTemplate: instanceInfoMockData.rule_template + ruleTemplate: instanceInfoMockData.rule_template, + isSupportFormatSql: true }); expect( MockSharedStepDetail.dbSourceInfoCollection.set diff --git a/packages/sqle/src/page/SqlExecWorkflow/Detail/__tests__/index.test.tsx b/packages/sqle/src/page/SqlExecWorkflow/Detail/__tests__/index.test.tsx index 830b38b72..8f01528d2 100644 --- a/packages/sqle/src/page/SqlExecWorkflow/Detail/__tests__/index.test.tsx +++ b/packages/sqle/src/page/SqlExecWorkflow/Detail/__tests__/index.test.tsx @@ -75,6 +75,7 @@ describe('sqle/ExecWorkflow/Detail', () => { executeTasksOnWorkflow = execWorkflow.executeTasksOnWorkflow(); batchCompleteWorkflowsSpy = execWorkflow.batchCompleteWorkflows(); instance.getInstanceTipList(); + instance.getInstance(); terminateMultipleTaskByWorkflowSpy = execWorkflow.terminateMultipleTaskByWorkflow(); getSummaryOfInstanceTasksSpy.mockClear(); diff --git a/packages/sqle/src/page/SqlExecWorkflow/Detail/components/ModifySqlStatement/__tests__/__snapshots__/index.test.tsx.snap b/packages/sqle/src/page/SqlExecWorkflow/Detail/components/ModifySqlStatement/__tests__/__snapshots__/index.test.tsx.snap index f4f7ad982..288c668a9 100644 --- a/packages/sqle/src/page/SqlExecWorkflow/Detail/components/ModifySqlStatement/__tests__/__snapshots__/index.test.tsx.snap +++ b/packages/sqle/src/page/SqlExecWorkflow/Detail/components/ModifySqlStatement/__tests__/__snapshots__/index.test.tsx.snap @@ -378,24 +378,114 @@ exports[`sqle/ExecWorkflow/Detail/ModifySqlStatement render snap when click form class="ant-form-item-control-input-content" >
- +
+ +
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
@@ -808,7 +898,7 @@ exports[`sqle/SqlOptimization/Create enter default content to create sql optimiz style="margin-right: 8px;" >
+
+
+ + + TiDB + +
+
+
+
+ tidb-1(10.186.62.17:4000) +
+
@@ -6044,6 +6078,40 @@ exports[`test sqle/SqlManagementConf/Create render create audit plan 2`] = ` unselectable="on" /> +
+
+ + + TiDB + +
+
+
+
+ tidb-1(10.186.62.17:4000) +
+
@@ -9744,6 +9812,40 @@ exports[`test sqle/SqlManagementConf/Create render create audit plan 3`] = ` unselectable="on" /> +
+
+ + + TiDB + +
+
+
+
+ tidb-1(10.186.62.17:4000) +
+
@@ -11115,6 +11217,40 @@ exports[`test sqle/SqlManagementConf/Create render create audit plan with perfor unselectable="on" /> +
+
+ + + TiDB + +
+
+
+
+ tidb-1(10.186.62.17:4000) +
+
@@ -12694,6 +12830,40 @@ exports[`test sqle/SqlManagementConf/Create render create audit plan with perfor unselectable="on" /> +
+
+ + + TiDB + +
+
+
+
+ tidb-1(10.186.62.17:4000) +
+
diff --git a/packages/sqle/src/page/SqlManagementException/Drawer/__tests__/__snapshots__/Create.test.tsx.snap b/packages/sqle/src/page/SqlManagementException/Drawer/__tests__/__snapshots__/Create.test.tsx.snap index 41b9740f3..302a901f6 100644 --- a/packages/sqle/src/page/SqlManagementException/Drawer/__tests__/__snapshots__/Create.test.tsx.snap +++ b/packages/sqle/src/page/SqlManagementException/Drawer/__tests__/__snapshots__/Create.test.tsx.snap @@ -1683,6 +1683,40 @@ exports[`slqe/SqlManagementException/CreateSqlManagementException render create unselectable="on" /> +
+
+ + + TiDB + +
+
+
+
+ tidb-1 (10.186.62.17:4000) +
+
diff --git a/packages/sqle/src/page/VersionManagement/Detail/components/ModifyWorkflowSql/__tests__/__snapshots__/index.test.tsx.snap b/packages/sqle/src/page/VersionManagement/Detail/components/ModifyWorkflowSql/__tests__/__snapshots__/index.test.tsx.snap index e57498497..33542b37b 100644 --- a/packages/sqle/src/page/VersionManagement/Detail/components/ModifyWorkflowSql/__tests__/__snapshots__/index.test.tsx.snap +++ b/packages/sqle/src/page/VersionManagement/Detail/components/ModifyWorkflowSql/__tests__/__snapshots__/index.test.tsx.snap @@ -375,25 +375,115 @@ exports[`sqle/VersionManagement/Detail/ModifyWorkflowSql render init snap shot 1 class="ant-form-item-control-input-content" >
- + + width="100%" + /> +
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+
+
+