chore: merge 4.3.1

oceanbase · Aug 5, 2024 · a7ca18b · a7ca18b
2 parents 528fb84 + b924b21
commit a7ca18b
Show file tree

Hide file tree

Showing 39 changed files with 381 additions and 126 deletions.
diff --git a/src/common/network/project.ts b/src/common/network/project.ts
@@ -51,6 +51,15 @@ export async function getProject(id: number): Promise<IProject> {
   return res?.data;
 }
 
+export async function getProjectHistoryInfo(id: number): Promise<IProject> {
+  const res = await request.get(`/api/v2/collaboration/projects/${id}`, {
+    params: {
+      ignoreError: true,
+    },
+  });
+  return res?.data;
+}
+
 export async function updateProject(id: number, project: IProject): Promise<IProject> {
   const res = await request.put(`/api/v2/collaboration/projects/${id}`, {
     data: project,

diff --git a/src/common/network/sql/preHandle.tsx b/src/common/network/sql/preHandle.tsx
@@ -28,17 +28,17 @@ export function executeSQLPreHandle(
     }
     return pre;
   }, []);
-  const unauthorizedDatabases = taskInfo?.unauthorizedDBResources;
+  const unauthorizedDBResources = taskInfo?.unauthorizedDBResources;
   const violatedRules = rootViolatedRules?.concat(taskInfo?.sqls);
-  if (unauthorizedDatabases?.length) {
+  if (unauthorizedDBResources?.length) {
     // 无权限库
     return {
       data: {
         invalid: true,
         executeSuccess: false,
         executeResult: [],
         violatedRules: [],
-        unauthorizedDatabases,
+        unauthorizedDBResources,
         unauthorizedSql: (params as IExecuteSQLParams)?.sql || (params as string),
       },
       lintResultSet: [],

diff --git a/src/component/DelimiterSelect/index.tsx b/src/component/DelimiterSelect/index.tsx
@@ -24,7 +24,13 @@ interface IProps {}
 const DelimiterSelect: React.FC<IProps> = function (props) {
   const { session, pageKey } = useContext(SQLConfigContext);
   const [delimiterValue, setDelimiterValue] = useState(null);
+  const [delimiterLoadingStatus, setDelimiterLoadingStatus] = useState(false);
   const delimiter = session?.params?.delimiter;
+  const delimiterLoading = session?.params?.delimiterLoading;
+
+  useEffect(() => {
+    setDelimiterLoadingStatus(delimiterLoading);
+  }, [delimiterLoading]);
 
   useEffect(() => {
     setDelimiterValue(delimiter);
@@ -44,12 +50,13 @@ const DelimiterSelect: React.FC<IProps> = function (props) {
           if (!isSuccess) {
             setDelimiterValue(delimiter);
           }
+          setDelimiterLoadingStatus(false);
         } else {
           setDelimiterValue(delimiter);
         }
       }}
       size="small"
-      disabled={session?.params?.delimiterLoading}
+      disabled={delimiterLoadingStatus}
       options={[';', '/', '//', '$', '$$'].map((value) => {
         return {
           value,

diff --git a/src/component/ExecuteSqlDetailModal/constant.tsx b/src/component/ExecuteSqlDetailModal/constant.tsx
@@ -110,6 +110,9 @@ export const executeViewOptionsInPlan = [
   },
 ];
 
-export const planTabLabel = '计划统计';
+export const planTabLabel = formatMessage({
+  id: 'src.component.ExecuteSqlDetailModal.1882C007',
+  defaultMessage: '计划统计',
+});
 
 export const planTabOption = [{ value: PLAN_PAGE_TYPE.PLAN_DETAIL, label: planTabLabel }];
diff --git a/src/component/ProfileFlow/index.tsx b/src/component/ProfileFlow/index.tsx
@@ -47,9 +47,11 @@ function Flow(props: Iprops) {
 
   // 初始化数据
   useEffect(() => {
-    setNodes(initialNodes);
-    setEdges(initialEdges);
-  }, [JSON.stringify(dataSource)]);
+    setTimeout(() => {
+      setNodes(initialNodes);
+      setEdges(initialEdges);
+    }, 300);
+  }, [JSON.stringify(initialNodes)]);
 
   // 视图位置初始化
   useEffect(() => {
@@ -61,14 +63,6 @@ function Flow(props: Iprops) {
     handleSelectNode(setNodes, selectedNode?.id);
   }, [JSON.stringify(selectedNode?.id)]);
 
-  const onConnect = useCallback(
-    (connection) => {
-      const edge = { ...connection, type: 'CustomEdge' };
-      setEdges((eds) => addEdge(edge, eds));
-    },
-    [setEdges],
-  );
-
   return (
     <div className={styles.profileFlow}>
       <CustomDetailBox
@@ -93,7 +87,6 @@ function Flow(props: Iprops) {
         edges={edges}
         onNodesChange={onNodesChange}
         onEdgesChange={onEdgesChange}
-        onConnect={onConnect}
         // @ts-ignore
         edgeTypes={edgeTypes}
         nodeTypes={nodeTypes}

diff --git a/src/component/ProfileFlow/utils.ts b/src/component/ProfileFlow/utils.ts
@@ -53,11 +53,26 @@ export const locateNode: (...args) => void = (
   initialNodes,
   setSelectedNode,
   setViewport,
+  setNodes,
 ) => {
   // 1. 获取节点在画布上的坐标
-  // 2. 计算画布应该移动的位移
   const node = initialNodes?.find((n) => n?.id === nodeId);
+  // 2. 设置当前选中节点
   setSelectedNode(node);
+  // 3. 展开节点
+  setNodes((nds) =>
+    nds.map((node) => {
+      hiddenChild(nds, node, false);
+      return {
+        ...node,
+        data: {
+          ...node.data,
+          isTreeOpen: true,
+        },
+      };
+    }),
+  );
+  // 4. 计算画布应该移动的位移
   const { width, height } = getXYPosition();
   if (node) {
     const x = -node?.position.x + width / 2 - NODE_WIDTH / 2;
@@ -198,7 +213,8 @@ export function transformDataForReactFlow(
           id: node.data.graphId,
           isTreeOpen: true,
           changeTreeOpen: (...args: any[]) => changeTreeOpen(...args, setNodes),
-          locateNode: (...args) => locateNode(...args, nodes, setSelectedNode, setViewport),
+          locateNode: (...args) =>
+            locateNode(...args, nodes, setSelectedNode, setViewport, setNodes),
           hasChild: node?.data?.outEdges?.length,
           outEdges: node?.data?.outEdges || [],
           setSelectedNode: setSelectedNode,

diff --git a/src/component/SQLConfig/index.tsx b/src/component/SQLConfig/index.tsx
@@ -72,7 +72,10 @@ const SQLConfig: React.FC<IProps> = function (props) {
               width: '100%',
             }}
           >
-            Delimiter 设置
+            {formatMessage({
+              id: 'src.component.SQLConfig.1D15916D',
+              defaultMessage: 'Delimiter 设置',
+            })}
           </Row>
           <Row style={{ width: '100%' }}>
             <DelimiterSelect />
@@ -98,7 +101,9 @@ const SQLConfig: React.FC<IProps> = function (props) {
             />
           </Row>
         </div>
-        <h4>查询结果</h4>
+        <h4>
+          {formatMessage({ id: 'src.component.SQLConfig.27EDBEAB', defaultMessage: '查询结果' })}
+        </h4>
         <div className={styles.sqlconfigGroup}>
           <Row
             style={{

diff --git a/src/component/Task/AlterDdlTask/CreateModal/index.tsx b/src/component/Task/AlterDdlTask/CreateModal/index.tsx
@@ -25,6 +25,7 @@ import { openTasksPage } from '@/store/helper/page';
 import type { ModalStore } from '@/store/modal';
 import { useDBSession } from '@/store/sessionManager/hooks';
 import { formatMessage } from '@/util/intl';
+import { mbToKb } from '@/util/utils';
 import {
   Alert,
   Button,
@@ -45,6 +46,8 @@ import styles from './index.less';
 import ThrottleFormItem from '../../component/ThrottleFormItem';
 import { SettingStore } from '@/store/setting';
 import { getDataSourceModeConfig } from '@/common/datasource';
+import { OscMaxRowLimit, OscMaxDataSizeLimit } from '../../const';
+
 interface IProps {
   modalStore?: ModalStore;
   settingStore?: SettingStore;
@@ -143,7 +146,7 @@ const CreateDDLTaskModal: React.FC<IProps> = (props) => {
             rowLimit || dataSizeLimit
               ? {
                   rowLimit,
-                  dataSizeLimit,
+                  dataSizeLimit: mbToKb(dataSizeLimit),
                 }
               : null,
         };
@@ -622,7 +625,13 @@ const CreateDDLTaskModal: React.FC<IProps> = (props) => {
               </Radio>
             </Radio.Group>
           </Form.Item>
-          {settingStore.enableOSCLimiting && <ThrottleFormItem initialValue={initialValue} />}
+          {settingStore.enableOSCLimiting && (
+            <ThrottleFormItem
+              initialValue={initialValue}
+              maxRowLimit={OscMaxRowLimit}
+              maxDataSizeLimit={OscMaxDataSizeLimit}
+            />
+          )}
         </FormItemPanel>
         <DescriptionInput />
       </Form>

diff --git a/src/component/Task/AlterDdlTask/DetailContent/index.tsx b/src/component/Task/AlterDdlTask/DetailContent/index.tsx
@@ -20,7 +20,6 @@ import { getTaskExecStrategyMap } from '@/component/Task';
 import type { ITaskResult, TaskDetail } from '@/d.ts';
 import { TaskExecStrategy } from '@/d.ts';
 import { formatMessage } from '@/util/intl';
-import { getFormatDateTime } from '@/util/utils';
 import React from 'react';
 import { Typography, message } from 'antd';
 import { SimpleTextItem } from '../../component/SimpleTextItem';
@@ -29,6 +28,9 @@ import ThrottleEditableCell from '../../component/ThrottleEditableCell';
 import { getDataSourceModeConfigByConnectionMode } from '@/common/datasource';
 import { updateThrottleConfig } from '@/common/network/task';
 import setting from '@/store/setting';
+import { getFormatDateTime, kbToMb, mbToKb } from '@/util/utils';
+import { TaskStatus } from '@/d.ts';
+import { OscMaxRowLimit, OscMaxDataSizeLimit } from '../../const';
 
 const { Text } = Typography;
 interface IDDLAlterParamters {
@@ -129,7 +131,12 @@ export function getItems(
   textItems: [React.ReactNode, React.ReactNode, number?][];
   sectionRender?: (task: TaskDetail<IDDLAlterParamters>) => void;
 }[] {
-  const { parameters, id } = task;
+  const { parameters, id, status } = task;
+  const cantBeModified = [
+    TaskStatus.EXECUTION_SUCCEEDED,
+    TaskStatus.EXECUTION_FAILED,
+    TaskStatus.CANCELLED,
+  ]?.includes(status);
   if (!task) {
     return [];
   }
@@ -158,7 +165,7 @@ export function getItems(
 
   const handleDataSizeLimit = async (dataSizeLimit, handleClose) => {
     const res = await updateThrottleConfig(id, {
-      dataSizeLimit: dataSizeLimit,
+      dataSizeLimit: mbToKb(dataSizeLimit),
       rowLimit: parameters?.rateLimitConfig?.rowLimit,
     });
     if (res) {
@@ -324,11 +331,11 @@ export function getItems(
               <ThrottleEditableCell
                 suffix="Rows/s"
                 min={0}
-                max={setting.maxSingleTaskRowLimit}
+                max={OscMaxRowLimit}
                 defaultValue={parameters?.rateLimitConfig?.rowLimit}
                 onOk={handleRowLimit}
+                readlOnly={cantBeModified}
               />,
-
               1,
             ]
           : null,
@@ -342,9 +349,10 @@ export function getItems(
               <ThrottleEditableCell
                 suffix="MB/s"
                 min={0}
-                max={setting.maxSingleTaskDataSizeLimit}
-                defaultValue={parameters?.rateLimitConfig?.dataSizeLimit}
+                max={OscMaxDataSizeLimit}
+                defaultValue={kbToMb(parameters?.rateLimitConfig?.dataSizeLimit)}
                 onOk={handleDataSizeLimit}
+                readlOnly={cantBeModified}
               />,
 
               1,

diff --git a/src/component/Task/MutipleAsyncTask/CreateModal/DatabaseQueue.tsx b/src/component/Task/MutipleAsyncTask/CreateModal/DatabaseQueue.tsx
@@ -2,7 +2,7 @@ import { IConnection, IConnectionStatus } from '@/d.ts';
 import login from '@/store/login';
 import { formatMessage } from '@/util/intl';
 import { Button, Divider, Form, Space, Timeline, Tooltip } from 'antd';
-import React, { useEffect, useState } from 'react';
+import React, { useEffect, useMemo, useState } from 'react';
 import { DeleteOutlined, DownOutlined, PlusOutlined, UpOutlined } from '@ant-design/icons';
 import { DndProvider } from 'react-dnd';
 import { HTML5Backend } from 'react-dnd-html5-backend';
@@ -14,6 +14,7 @@ import { DatabasePermissionType } from '@/d.ts/database';
 import { SelectTemplate, CreateTemplate } from '../components/Template';
 import datasourceStatus from '@/store/datasourceStatus';
 import styles from './index.less';
+import { observer } from 'mobx-react';
 
 export const checkDbExpiredByDataSourceStatus = (status: IConnectionStatus) => {
   switch (status) {
@@ -34,11 +35,12 @@ export const DatabaseQueueSelect: React.FC<{
   rootName: (number | string)[];
   multipleDatabaseChangeOpen: boolean;
   setDefaultDatasource: React.Dispatch<React.SetStateAction<IConnection>>;
-}> = ({ rootName, multipleDatabaseChangeOpen, setDefaultDatasource }) => {
+}> = observer(({ rootName, multipleDatabaseChangeOpen, setDefaultDatasource }) => {
   const form = Form.useFormInstance();
+  const statusMap = datasourceStatus.statusMap;
   const projectId = Form.useWatch('projectId', form);
   const [databaseIdMap, setDatabaseIdMap] = useState<Map<number, boolean>>(new Map());
-  const [databaseOptions, setDatabaseOptions] = useState<DatabaseOption[]>([]);
+  const [_databaseOptions, setDatabaseOptions] = useState<DatabaseOption[]>([]);
   const {
     data,
     run,
@@ -58,29 +60,41 @@ export const DatabaseQueueSelect: React.FC<{
       true,
       true,
     );
-    setDatabaseOptions(
-      databaseList?.contents?.map((item) => {
-        const statusInfo = datasourceStatus.statusMap.get(item?.dataSource?.id);
-        return {
-          label: item?.name,
-          value: item?.id,
-          environment: item?.environment,
-          dataSource: item?.dataSource,
-          existed: item?.existed,
-          unauthorized: !item?.authorizedPermissionTypes?.includes(DatabasePermissionType.CHANGE),
-          expired: checkDbExpiredByDataSourceStatus(statusInfo?.status),
-        };
-      }),
-    );
     if (databaseList?.contents?.length) {
       setDefaultDatasource(databaseList?.contents?.[0]?.dataSource);
+      datasourceStatus.asyncUpdateStatus([
+        ...new Set(databaseList?.contents?.map((item) => item.dataSource?.id)),
+      ]);
+      setDatabaseOptions(
+        databaseList?.contents?.map((item) => {
+          const statusInfo = datasourceStatus.statusMap.get(item?.dataSource?.id);
+          return {
+            label: item?.name,
+            value: item?.id,
+            environment: item?.environment,
+            dataSource: item?.dataSource,
+            existed: item?.existed,
+            unauthorized: !item?.authorizedPermissionTypes?.includes(DatabasePermissionType.CHANGE),
+            expired: checkDbExpiredByDataSourceStatus(statusInfo?.status),
+          };
+        }),
+      );
     }
     databaseList?.contents?.forEach((db) => {
       databaseIdMap.set(db.id, false);
     });
     setDatabaseIdMap(databaseIdMap);
   };
 
+  const databaseOptions = useMemo(() => {
+    return _databaseOptions?.map((item) => {
+      return {
+        ...item,
+        expired: checkDbExpiredByDataSourceStatus(statusMap.get(item?.dataSource?.id)?.status),
+      };
+    });
+  }, [statusMap, _databaseOptions]);
+
   useEffect(() => {
     if (multipleDatabaseChangeOpen && projectId) {
       loadDatabaseList(projectId);
@@ -231,7 +245,7 @@ export const DatabaseQueueSelect: React.FC<{
       </Form.List>
     </div>
   );
-};
+});
 
 const DatabaseQueue: React.FC<{
   multipleDatabaseChangeOpen: boolean;