Merge branch 'dev-4.2.4' of https://code.alipay.com/oceanbase/oceanba…

…se-developer-center into dev-4.2.4
oceanbase · Mar 22, 2024 · 7c3f608 · 7c3f608
2 parents 0268b54 + da58d75
commit 7c3f608
Show file tree

Hide file tree

Showing 32 changed files with 802 additions and 422 deletions.
diff --git a/src/component/Crontab/index.less b/src/component/Crontab/index.less
@@ -7,9 +7,15 @@
   }
   .content {
     width: 100%;
+    display: grid;
+    grid-gap: 8px;
     &.default-mode {
       padding: 8px;
       background: var(--background-tertraiy-color);
+      grid-template-columns: 120px 210px 1fr;
+      &.daily {
+        grid-template-columns: 120px 1fr;
+      }
     }
   }
   .custom-editor {

diff --git a/src/component/Crontab/index.tsx b/src/component/Crontab/index.tsx
@@ -191,11 +191,11 @@ const Crontab = (props, ref) => {
           />
         </Space>
       </div>
-      <Space
+      <div
         className={classnames(styles.content, {
           [styles['default-mode']]: mode !== CrontabMode.custom,
+          [styles.daily]: dateType === CrontabDateType.daily,
         })}
-        direction={mode === CrontabMode.custom ? 'vertical' : 'horizontal'}
       >
         {mode === CrontabMode.custom ? (
           <>
@@ -215,19 +215,13 @@ const Crontab = (props, ref) => {
           </>
         ) : (
           <>
-            <Select
-              value={dateType}
-              style={{ width: 120 }}
-              options={dateOptions}
-              onChange={handleDateTypeChange}
-            />
+            <Select value={dateType} options={dateOptions} onChange={handleDateTypeChange} />
 
             {dateType === CrontabDateType.weekly && (
               <Select
                 mode="multiple"
                 maxTagCount={2}
                 value={dayOfWeek}
-                style={{ width: 210 }}
                 options={weekOptions}
                 onChange={(value) => {
                   handleValueChange({
@@ -243,7 +237,6 @@ const Crontab = (props, ref) => {
                 mode="multiple"
                 maxTagCount={3}
                 value={dayOfMonth}
-                style={{ width: 210 }}
                 options={dayOptions}
                 onChange={(value) => {
                   handleValueChange({
@@ -258,7 +251,6 @@ const Crontab = (props, ref) => {
               mode="multiple"
               maxTagCount={3}
               value={hour}
-              style={{ width: 310 }}
               options={hourOptions}
               onChange={(value) => {
                 handleValueChange({
@@ -269,7 +261,7 @@ const Crontab = (props, ref) => {
             />
           </>
         )}
-      </Space>
+      </div>
       <Collapse
         bordered={false}
         expandIconPosition="end"

diff --git a/src/component/Task/AlterDdlTask/CreateModal/index.tsx b/src/component/Task/AlterDdlTask/CreateModal/index.tsx
@@ -66,6 +66,7 @@ export enum ClearStrategy {
 }
 const CreateDDLTaskModal: React.FC<IProps> = (props) => {
   const { modalStore, projectId, theme } = props;
+  const { ddlAlterData } = modalStore;
   const [form] = Form.useForm();
   const [hasEdit, setHasEdit] = useState(false);
   const [confirmLoading, setConfirmLoading] = useState(false);
@@ -185,6 +186,16 @@ const CreateDDLTaskModal: React.FC<IProps> = (props) => {
       checkLockDatabaseUserRequired(databaseId);
     }
   }, [databaseId]);
+
+  useEffect(() => {
+    const databaseId = ddlAlterData?.databaseId;
+    if (databaseId) {
+      form.setFieldsValue({
+        databaseId,
+      });
+    }
+  }, [ddlAlterData?.databaseId]);
+
   return (
     <Drawer
       destroyOnClose

diff --git a/src/component/Task/DataArchiveTask/CreateModal/index.tsx b/src/component/Task/DataArchiveTask/CreateModal/index.tsx
@@ -443,6 +443,15 @@ const CreateModal: React.FC<IProps> = (props) => {
     }
   }, [dataArchiveEditId]);
 
+  useEffect(() => {
+    const databaseId = dataArchiveTaskData?.databaseId;
+    if (databaseId) {
+      form.setFieldsValue({
+        databaseId,
+      });
+    }
+  }, [dataArchiveTaskData?.databaseId]);
+
   return (
     <Drawer
       destroyOnClose

diff --git a/src/component/Task/DataClearTask/CreateModal/index.tsx b/src/component/Task/DataClearTask/CreateModal/index.tsx
@@ -386,6 +386,15 @@ const CreateModal: React.FC<IProps> = (props) => {
     }
   }, [editTaskId]);
 
+  useEffect(() => {
+    const databaseId = dataClearTaskData?.databaseId;
+    if (databaseId) {
+      form.setFieldsValue({
+        databaseId,
+      });
+    }
+  }, [dataClearTaskData?.databaseId]);
+
   return (
     <Drawer
       destroyOnClose

diff --git a/src/component/Task/PartitionTask/CreateModal/index.tsx b/src/component/Task/PartitionTask/CreateModal/index.tsx
@@ -114,7 +114,7 @@ export interface ITableConfig {
   };
 }
 
-const getOriginTableConfigs: (tableConfigs: IPartitionTableConfig[]) => ITableConfig[] = (
+const getCreatedTableConfigs: (tableConfigs: IPartitionTableConfig[]) => ITableConfig[] = (
   tableConfigs,
 ) => {
   const originPartitionTableConfigs = tableConfigs?.map((config) => {
@@ -161,14 +161,17 @@ interface IProps extends Pick<DrawerProps, 'visible'> {
 const CreateModal: React.FC<IProps> = inject('modalStore')(
   observer((props) => {
     const { modalStore, projectId } = props;
-    const { partitionVisible } = modalStore;
+    const { partitionVisible, partitionData } = modalStore;
     const [tableConfigs, setTableConfigs] = useState<ITableConfig[]>();
     const [confirmLoading, setConfirmLoading] = useState(false);
     const [disabledSubmit, setDisabledSubmit] = useState(true);
     const [hasPartitionPlan, setHasPartitionPlan] = useState(false);
     const [crontab, setCrontab] = useState<ICrontab>(null);
     const [dropCrontab, setDropCrontab] = useState<ICrontab>(null);
-    const [createdOriginTableConfigs, setCreatedOriginTableConfigs] = useState<ITableConfig[]>([]);
+    const [createdTableConfigs, setCreatedTableConfigs] = useState<ITableConfig[]>([]);
+    const [createdOriginTableConfigs, setCreatedOriginTableConfigs] = useState<
+      IPartitionTableConfig[]
+    >([]);
     const [historyOriginTableConfigs, setHistoryOriginTableConfigs] = useState<
       IPartitionTableConfig[]
     >([]);
@@ -195,20 +198,22 @@ const CreateModal: React.FC<IProps> = inject('modalStore')(
         const allPartitionPlanTableConfigs = res?.contents
           ?.map((item) => item?.partitionPlanTableConfig)
           ?.filter(Boolean);
-        const createdOriginTableConfigs = getOriginTableConfigs(
-          allPartitionPlanTableConfigs?.filter(({ partitionKeyConfigs }) => {
+        const createdOriginTableConfigs = allPartitionPlanTableConfigs?.filter(
+          ({ partitionKeyConfigs }) => {
             return partitionKeyConfigs?.some((item) =>
               validPartitionKeyInvokers.includes(item?.partitionKeyInvoker),
             );
-          }),
+          },
         );
+        const createdTableConfigs = getCreatedTableConfigs(createdOriginTableConfigs);
         const historyOriginTableConfigs = allPartitionPlanTableConfigs?.filter(
           ({ partitionKeyConfigs }) => {
             return partitionKeyConfigs?.some((item) =>
               historyPartitionKeyInvokers.includes(item?.partitionKeyInvoker),
             );
           },
         );
+        setCreatedTableConfigs(createdTableConfigs);
         setCreatedOriginTableConfigs(createdOriginTableConfigs);
         setHistoryOriginTableConfigs(historyOriginTableConfigs);
         setHasPartitionPlan(hasPartitionPlan);
@@ -288,6 +293,12 @@ const CreateModal: React.FC<IProps> = inject('modalStore')(
         let partitionTableConfigs: IPartitionTableConfig[] = tableConfigs
           ?.filter((config) => config?.strategies?.length)
           ?.map((config) => {
+            const createdOriginTableConfig = createdOriginTableConfigs?.find(
+              (item) => item.tableName === config.tableName,
+            );
+            if (!config?.__isCreate && createdOriginTableConfig) {
+              return createdOriginTableConfig;
+            }
             const {
               generateCount,
               nameRuleType,
@@ -474,6 +485,15 @@ const CreateModal: React.FC<IProps> = inject('modalStore')(
     useEffect(() => {
       loadData();
     }, [databaseId, sessionId]);
+
+    useEffect(() => {
+      const databaseId = partitionData?.databaseId;
+      if (databaseId) {
+        form.setFieldsValue({
+          databaseId,
+        });
+      }
+    }, [partitionData?.databaseId]);
     return (
       <Drawer
         open={partitionVisible}
@@ -544,7 +564,7 @@ const CreateModal: React.FC<IProps> = inject('modalStore')(
               databaseId={databaseId}
               sessionId={sessionId}
               tableConfigs={tableConfigs}
-              createdOriginTableConfigs={createdOriginTableConfigs}
+              createdTableConfigs={createdTableConfigs}
               onPlansConfigChange={handlePlansConfigChange}
               onLoad={loadData}
             />

diff --git a/src/component/Task/SQLPlanTask/CreateModal/index.tsx b/src/component/Task/SQLPlanTask/CreateModal/index.tsx
@@ -95,7 +95,8 @@ const CreateModal: React.FC<IProps> = (props) => {
     resetFields: () => void;
   }>();
 
-  const { createSQLPlanVisible, SQLPlanEditId } = modalStore;
+  const { createSQLPlanVisible, sqlPlanData } = modalStore;
+  const SQLPlanEditId = sqlPlanData?.id;
   const isEdit = !!SQLPlanEditId;
   const isInitContent = isEdit ? isEdit && formData : true;
   const loadEditData = async (editId: number) => {
@@ -445,6 +446,15 @@ const CreateModal: React.FC<IProps> = (props) => {
     }
   }, [createSQLPlanVisible]);
 
+  useEffect(() => {
+    const databaseId = sqlPlanData?.databaseId;
+    if (databaseId) {
+      form.setFieldsValue({
+        databaseId,
+      });
+    }
+  }, [sqlPlanData?.databaseId]);
+
   return (
     <Drawer
       destroyOnClose

diff --git a/src/component/Task/ShadowSyncTask/CreateModal/SelectPanel/index.tsx b/src/component/Task/ShadowSyncTask/CreateModal/SelectPanel/index.tsx
@@ -17,6 +17,7 @@
 import { getTableListByDatabaseName } from '@/common/network/table';
 import { getShadowSyncAnalysisResult, startShadowSyncAnalysis } from '@/common/network/task';
 import ExportCard from '@/component/ExportCard';
+import { ModalStore } from '@/store/modal';
 import HelpDoc from '@/component/helpDoc';
 import { DbObjsIcon } from '@/constant';
 import { TaskType } from '@/d.ts';
@@ -26,6 +27,7 @@ import { useUnmountedRef } from 'ahooks';
 import { Checkbox, Col, Form, Input, message, Radio, Row, Select, Space } from 'antd';
 import { CheckboxChangeEvent } from 'antd/lib/checkbox';
 import { clone, cloneDeep } from 'lodash';
+import { inject, observer } from 'mobx-react';
 import { forwardRef, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';
 import { List as VirtualList } from 'react-virtualized';
 import DatabaseSelect from '../../../component/DatabaseSelect';
@@ -34,12 +36,15 @@ import styles from './index.less';
 
 const Option = Select.Option;
 
-interface IProps extends IContentProps {}
+interface IProps extends IContentProps {
+  modalStore: ModalStore;
+}
 
 const SelectPanel = forwardRef<any, IProps>(function (
-  { databaseId, schemaName, connectionId, sessionId, projectId, data, setData },
+  { modalStore, databaseId, schemaName, connectionId, sessionId, projectId, data, setData },
   ref,
 ) {
+  const { shadowSyncData } = modalStore;
   const [tables, setTables] = useState([]);
   const [sourceSearchValue, setSourceSearchValue] = useState(null);
   const [targetSearchValue, setTargetSearchValue] = useState(null);
@@ -198,6 +203,14 @@ const SelectPanel = forwardRef<any, IProps>(function (
       originTableNames: clone(data.originTableNames),
     });
   }
+
+  useEffect(() => {
+    const databaseId = shadowSyncData?.databaseId;
+    if (databaseId) {
+      form.setFieldsValue({ databaseId });
+    }
+  }, [shadowSyncData?.databaseId]);
+
   return (
     <Form
       form={form}
@@ -463,4 +476,4 @@ const SelectPanel = forwardRef<any, IProps>(function (
   );
 });
 
-export default SelectPanel;
+export default inject('modalStore')(observer(SelectPanel));
diff --git a/src/component/Task/StructureComparisonTask/CreateModal/index.tsx b/src/component/Task/StructureComparisonTask/CreateModal/index.tsx
@@ -27,7 +27,7 @@ interface IProps {
 }
 
 const StructureComparisonTask: React.FC<IProps> = ({ projectId, modalStore }) => {
-  const { structureComparisonVisible } = modalStore;
+  const { structureComparisonVisible, structureComparisonTaskData } = modalStore;
   const [form] = useForm<CreateStructureComparisonTaskRecord>();
   const taskExecStrategyMap = getTaskExecStrategyMap(TaskType.STRUCTURE_COMPARISON);
   const sourceDatabaseId = Form.useWatch(['parameters', 'sourceDatabaseId'], form);
@@ -93,6 +93,14 @@ const StructureComparisonTask: React.FC<IProps> = ({ projectId, modalStore }) =>
       targetDatabaseId && resetTargetDatabase();
     }
   }, [sourceDatabaseId]);
+
+  useEffect(() => {
+    const databaseId = structureComparisonTaskData?.databaseId;
+    if (databaseId) {
+      form.setFieldValue(['parameters', 'sourceDatabaseId'], databaseId);
+    }
+  }, [structureComparisonTaskData?.databaseId]);
+
   return (
     <Drawer
       open={structureComparisonVisible}

diff --git a/src/component/Task/component/ActionBar/index.tsx b/src/component/Task/component/ActionBar/index.tsx
@@ -224,7 +224,9 @@ const ActionBar: React.FC<IProps> = inject(
           type: 'EDIT',
         });
       } else {
-        props.modalStore.changeCreateSQLPlanTaskModal(true, task?.id);
+        props.modalStore.changeCreateSQLPlanTaskModal(true, {
+          id: task?.id,
+        });
       }
     };
 

diff --git a/src/component/Task/component/PartitionPolicyFormTable/EditTable/index.less b/src/component/Task/component/PartitionPolicyFormTable/EditTable/index.less
@@ -24,6 +24,17 @@
   height: 72px;
   grid-gap: 1px;
   background-color: var(--neutral-grey4-color);
+  position: relative;
+  &:not(:last-child)::after {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    content: '';
+    display: block;
+    width: 100%;
+    height: 1px;
+    background-color: var(--neutral-grey4-color);
+  }
   .td {
     display: flex;
     height: 100%;
@@ -34,20 +45,17 @@
       display: inline-flex;
       padding: 0 8px;
       line-height: 72px;
-      border-bottom: 1px solid var(--neutral-grey4-color);
     }
   }
   .ruleFormItem {
     width: 100%;
     padding: 4px 8px;
-    border-bottom: 1px solid var(--neutral-grey4-color);
   }
   .typeSelect {
     display: flex;
     vertical-align: middle;
     padding: 0 8px;
     line-height: 71px;
-    border-bottom: 1px solid var(--neutral-grey4-color);
     :global {
       .ant-form-item {
         margin-bottom: 0px;