Skip to content

Commit

Permalink
PullRequest: 243 feat: dataArchiveTask support edit
Browse files Browse the repository at this point in the history 
Merge branch 'feat/dev-4.2.2-task-1124 of [email protected]:oceanbase/oceanbase-developer-center.git into dev-4.2.2

https://code.alipay.com/oceanbase/oceanbase-developer-center/pull_requests/243


Signed-off-by: 晓康 <[email protected]>


* feat: dataArchiveTask support edit

* feat: dataArchiveTask support edit (default value)
  • Loading branch information
@bluesky-xyh
bluesky-xyh committed Nov 27, 2023
1 parent 44e5809 commit 9501eac
Show file tree
Hide file tree
Showing 4 changed files with 127 additions and 23 deletions.
128 changes: 110 additions & 18 deletions src/component/Task/DataArchiveTask/CreateModal/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,9 +15,9 @@
*/

import { getTableListByDatabaseName } from '@/common/network/table';
import { createTask } from '@/common/network/task';
import { createTask, getCycleTaskDetail } from '@/common/network/task';
import Crontab from '@/component/Crontab';
import { CrontabDateType, ICrontab } from '@/component/Crontab/interface';
import { CrontabDateType, ICrontab, CrontabMode } from '@/component/Crontab/interface';
import FormItemPanel from '@/component/FormItemPanel';
import DescriptionInput from '@/component/Task/component/DescriptionInput';
import {
Expand All @@ -30,22 +30,25 @@ import {
TaskPageScope,
TaskPageType,
TaskType,
IDataArchiveJobParameters,
} from '@/d.ts';
import { openTasksPage } from '@/store/helper/page';
import type { ModalStore } from '@/store/modal';
import { useDBSession } from '@/store/sessionManager/hooks';
import { isClient } from '@/util/env';
import { formatMessage } from '@/util/intl';
import { mbToKb } from '@/util/utils';
import { mbToKb, kbToMb } from '@/util/utils';
import { FieldTimeOutlined } from '@ant-design/icons';
import { Button, Checkbox, DatePicker, Drawer, Form, Modal, Radio, Space } from 'antd';
import { inject, observer } from 'mobx-react';
import React, { useEffect, useRef, useState } from 'react';
import moment from 'moment';
import DatabaseSelect from '../../component/DatabaseSelect';
import ArchiveRange from './ArchiveRange';
import styles from './index.less';
import VariableConfig from './VariableConfig';
import ThrottleFormItem from '../../component/ThrottleFormItem';
import { timeUnitOptions } from './VariableConfig';
export enum IArchiveRange {
PORTION = 'portion',
ALL = 'all',
Expand All @@ -67,7 +70,13 @@ export const InsertActionOptions = [
export const variable = {
name: '',
format: '',
pattern: [null],
pattern: [
{
operator: '',
step: '',
unit: '',
},
],
};
const defaultValue = {
triggerStrategy: TaskExecStrategy.START_NOW,
Expand Down Expand Up @@ -98,7 +107,7 @@ const getVariables = (
try {
_pattern = pattern
?.map((item) => {
return `${item.operator}${item.step}${item.unit}`;
return `${item.operator}${item.step ?? 0}${item.unit}`;
})
?.join(' ');
} catch (error) {}
Expand All @@ -108,9 +117,41 @@ const getVariables = (
};
});
};

const getVariableValue = (
value: {
name: string;
pattern: string;
}[],
) => {
var reg = /([+-])?(\d+)?(.+)?/;
return value?.map(({ name, pattern }) => {
const [format, _pattern] = pattern?.split('|');
let patternValue = {
operator: '',
step: '',
unit: '',
};
if (_pattern) {
const res = _pattern?.match(reg);
const operator = res[1] ?? '';
const step = res[2] ?? '';
const unit = timeUnitOptions.map((item) => item.value).includes(res[3]) ? res[3] : '';
patternValue = {
operator,
step,
unit,
};
}
return {
name,
format,
pattern: [patternValue],
};
});
};
const CreateModal: React.FC<IProps> = (props) => {
const { modalStore, projectId } = props;
const [formData, setFormData] = useState(null);
const [hasEdit, setHasEdit] = useState(false);
const [confirmLoading, setConfirmLoading] = useState(false);
const [crontab, setCrontab] = useState<ICrontab>(null);
Expand All @@ -127,15 +168,57 @@ const CreateModal: React.FC<IProps> = (props) => {
setValue: (value: ICrontab) => void;
resetFields: () => void;
}>();
const { dataArchiveVisible, SQLPlanEditId } = modalStore;
const isEdit = !!SQLPlanEditId;
const setFormStatus = (fieldName: string, errorMessage: string) => {
form.setFields([
{
name: [fieldName],
errors: errorMessage ? [errorMessage] : [],
},
]);
const { dataArchiveVisible, dataArchiveEditId } = modalStore;
const isEdit = !!dataArchiveEditId;
const loadEditData = async (editId: number) => {
const data = await getCycleTaskDetail<IDataArchiveJobParameters>(editId);
const {
jobParameters,
description,
triggerConfig: { triggerStrategy, cronExpression, hours, days, startAt },
} = data;

const {
targetDataBaseId,
sourceDatabaseId,
deleteAfterMigration,
migrationInsertAction,
rateLimit,
tables,
variables,
} = jobParameters;

const formData = {
databaseId: sourceDatabaseId,
targetDatabase: targetDataBaseId,
rowLimit: rateLimit?.rowLimit,
dataSizeLimit: kbToMb(rateLimit?.dataSizeLimit),
deleteAfterMigration,
migrationInsertAction,
tables,
variables: getVariableValue(variables),
archiveRange: IArchiveRange.PORTION,
triggerStrategy,
startAt: undefined,
description,
};

if (![TaskExecStrategy.START_NOW, TaskExecStrategy.START_AT].includes(triggerStrategy)) {
formData.triggerStrategy = TaskExecStrategy.TIMER;
const crontab = {
mode: triggerStrategy === TaskExecStrategy.CRON ? CrontabMode.custom : CrontabMode.default,
dateType: triggerStrategy as any,
cronString: cronExpression,
hour: hours,
dayOfMonth: days,
dayOfWeek: days,
};
setCrontab(crontab);
}
if (triggerStrategy === TaskExecStrategy.START_AT) {
formData.startAt = moment(startAt);
}
form.setFieldsValue(formData);
};
const handleCancel = (hasEdit: boolean) => {
if (hasEdit) {
Expand Down Expand Up @@ -226,7 +309,7 @@ const CreateModal: React.FC<IProps> = (props) => {
const parameters = {
type: TaskType.MIGRATION,
operationType: isEdit ? TaskOperationType.UPDATE : TaskOperationType.CREATE,
taskId: SQLPlanEditId,
taskId: dataArchiveEditId,
scheduleTaskParameters: {
sourceDatabaseId: databaseId,
targetDataBaseId: targetDatabase,
Expand Down Expand Up @@ -289,7 +372,6 @@ const CreateModal: React.FC<IProps> = (props) => {
setHasEdit(true);
};
const handleReset = () => {
setFormData(null);
form?.resetFields();
crontabRef.current?.resetFields();
};
Expand All @@ -301,9 +383,18 @@ const CreateModal: React.FC<IProps> = (props) => {
useEffect(() => {
if (database?.id) {
loadTables();
form.setFieldValue('tables', [null]);
if (!isEdit) {
form.setFieldValue('tables', [null]);
}
}
}, [database?.id]);

useEffect(() => {
if (dataArchiveEditId) {
loadEditData(dataArchiveEditId);
}
}, [dataArchiveEditId]);

return (
<Drawer
destroyOnClose
Expand Down Expand Up @@ -360,6 +451,7 @@ const CreateModal: React.FC<IProps> = (props) => {
<Space align="start">
<DatabaseSelect
type={TaskType.DATA_ARCHIVE}
disabled={isEdit}
label={formatMessage({
id: 'odc.DataArchiveTask.CreateModal.SourceDatabase',
})}
Expand Down
13 changes: 9 additions & 4 deletions src/component/Task/component/ActionBar/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -188,7 +188,11 @@ const ActionBar: React.FC<IProps> = inject(

const editCycleTask = async () => {
props?.onClose?.();
props.modalStore.changeCreateSQLPlanTaskModal(true, task?.id);
if (task?.type === TaskType.DATA_ARCHIVE) {
props.modalStore.changeDataArchiveModal(true, task?.id);
} else {
props.modalStore.changeCreateSQLPlanTaskModal(true, task?.id);
}
};

const disableCycleTask = async () => {
Expand Down Expand Up @@ -529,7 +533,8 @@ const ActionBar: React.FC<IProps> = inject(

_executeBtn.tooltip = formatMessage(
{
id: 'odc.TaskManagePage.component.TaskTools.ScheduledExecutionTimeExecutiontime',
id:
'odc.TaskManagePage.component.TaskTools.ScheduledExecutionTimeExecutiontime',
},

{ executionTime: executionTime },
Expand Down Expand Up @@ -694,8 +699,8 @@ const ActionBar: React.FC<IProps> = inject(
} else {
tools = [viewBtn];
}
// 仅 sql 计划支持编辑
if (task?.type !== TaskType.SQL_PLAN) {
// 仅 sql 计划 & 数据归档支持编辑
if (![TaskType.SQL_PLAN, TaskType.DATA_ARCHIVE].includes(task?.type)) {
tools = tools.filter((item) => item.key !== 'edit');
}
return tools;
Expand Down
3 changes: 3 additions & 0 deletions src/component/Task/component/DatabaseSelect/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,7 @@ import { toInteger } from 'lodash';
interface IProps {
type: TaskType;
label?: string;
disabled?: boolean;
name?: string;
projectId?: number;
extra?: string;
Expand All @@ -47,6 +48,7 @@ const DatabaseSelect: React.FC<IProps> = (props) => {
projectId,
extra = '',
width = '320px',
disabled = false,
onChange,
} = props;
const [database, setDatabase] = useState<IDatabase[]>([]);
Expand Down Expand Up @@ -158,6 +160,7 @@ const DatabaseSelect: React.FC<IProps> = (props) => {
>
<Select
showSearch
disabled={disabled}
filterOption={(input, option) =>
(option?.label?.props?.['data-label'] ?? '').toLowerCase().includes(input.toLowerCase())
}
Expand Down
6 changes: 5 additions & 1 deletion src/store/modal.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -112,6 +112,9 @@ export class ModalStore {
@observable
public dataArchiveVisible: boolean = false;

@observable
public dataArchiveEditId: number = null;

@observable
public dataClearVisible: boolean = false;

Expand Down Expand Up @@ -319,8 +322,9 @@ export class ModalStore {
}

@action
public changeDataArchiveModal(isShow: boolean = true) {
public changeDataArchiveModal(isShow: boolean = true, id?: number) {
this.dataArchiveVisible = isShow;
this.dataArchiveEditId = isShow ? id : null;
}

@action
Expand Down

0 comments on commit 9501eac

Please sign in to comment.