Skip to content

S
szse
Commit f947c507 by zhaochengxiang
Options

采集调度

parent a1b9c621
Showing with 148 additions and 85 deletions
src/view/Manage/DatasourceManage/Component/ScheduleAction.jsx
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { Modal, Select, Form, Input, Divider, Space, Button, Switch, TimePicker } from 'antd'; import { Select, Form, Input, Switch, TimePicker, Cascader, Row, Col } from 'antd';
import moment from 'moment'; import moment from 'moment';
import { dispatch } from '../../../../model'; import { dispatch } from '../../../../model';
import { showMessage } from '../../../../util';
const { Option } = Select;
const ScheduleAction = (props) => { const ScheduleAction = (props) => {
const { action, id, form, tid } = props; const { action, id, form, tid, onChange } = props;
const [ schedule, setSchedule ] = useState({}); const [ schedule, setSchedule ] = useState({});
const [ currentExeCycleType, setCurrentExeCycleType ] = useState(null);
useEffect(() => { useEffect(() => {
reset(); reset();
...@@ -31,6 +27,7 @@ const ScheduleAction = (props) => { ...@@ -31,6 +27,7 @@ const ScheduleAction = (props) => {
}, },
callback: data => { callback: data => {
setSchedule(data||{}); setSchedule(data||{});
onChange && onChange(data||{});
} }
}); });
} }
...@@ -53,18 +50,11 @@ const ScheduleAction = (props) => { ...@@ -53,18 +50,11 @@ const ScheduleAction = (props) => {
setSchedule(data||{}); setSchedule(data||{});
setFormFiledsValue(data||{}); setFormFiledsValue(data||{});
onChange && onChange(data||{});
} }
}) })
} }
const getCurrentExeCycleType = (data) => {
(data?.scheduleParameters||[]).forEach(item => {
if (item.name === 'exeCycleType') {
setCurrentExeCycleType(item.value);
}
});
}
const setFormFiledsValue = (data) => { const setFormFiledsValue = (data) => {
let _fieldsValue = {}; let _fieldsValue = {};
...@@ -75,6 +65,8 @@ const ScheduleAction = (props) => { ...@@ -75,6 +65,8 @@ const ScheduleAction = (props) => {
_fieldsValue[item.name||''] = (item.value==="1") ? true: false; _fieldsValue[item.name||''] = (item.value==="1") ? true: false;
} else if (item.selectMode === 'timePicker') { } else if (item.selectMode === 'timePicker') {
_fieldsValue[item.name||''] = moment(item.value, 'HH:mm:ss'); _fieldsValue[item.name||''] = moment(item.value, 'HH:mm:ss');
} else if (item.selectMode === 'cascader') {
_fieldsValue[item.name||''] = (item.value||'').split(',');
} }
}); });
...@@ -84,6 +76,8 @@ const ScheduleAction = (props) => { ...@@ -84,6 +76,8 @@ const ScheduleAction = (props) => {
_fieldsValue[item.name||''] = (item.value==="1") ? true: false; _fieldsValue[item.name||''] = (item.value==="1") ? true: false;
} else if (item.selectMode === 'timePicker') { } else if (item.selectMode === 'timePicker') {
_fieldsValue[item.name||''] = moment(item.value, 'HH:mm:ss'); _fieldsValue[item.name||''] = moment(item.value, 'HH:mm:ss');
} else if (item.selectMode === 'cascader') {
_fieldsValue[item.name||''] = (item.value||'').split(',');
} }
}); });
...@@ -94,6 +88,36 @@ const ScheduleAction = (props) => { ...@@ -94,6 +88,36 @@ const ScheduleAction = (props) => {
form.resetFields(); form.resetFields();
} }
const onValuesChange = (changedValues, allValues) => {
let newSchedule = JSON.parse(JSON.stringify(schedule));
(newSchedule?.targetParameters||[]).forEach(item => {
item.value = allValues[item.name];
if (item.selectMode === 'switch') {
item.value = (allValues[item.name||'']===true)?'1':'0';
} else if (item.selectMode === 'timePicker') {
item.value = allValues[item.name||''].format('HH:mm:ss');
} else if (item.selectMode === 'cascader') {
item.value = allValues[item.name||''].join(',');
}
});
(newSchedule?.scheduleParameters||[]).forEach(item => {
item.value = allValues[item.name];
if (item.selectMode === 'switch') {
item.value = (allValues[item.name||'']===true)?'1':'0';
} else if (item.selectMode === 'timePicker') {
item.value = allValues[item.name||''].format('HH:mm:ss');
} else if (item.selectMode === 'cascader') {
item.value = allValues[item.name||''].join(',');
}
});
onChange && onChange(newSchedule);
}
const formItemLayout = { const formItemLayout = {
labelCol: { labelCol: {
xs: { span: 24 }, xs: { span: 24 },
...@@ -112,14 +136,9 @@ const ScheduleAction = (props) => { ...@@ -112,14 +136,9 @@ const ScheduleAction = (props) => {
if (item.selectMode === 'singleSelect') { if (item.selectMode === 'singleSelect') {
const _datas = []; const _datas = [];
if (item.name === 'exeDay') { for (var key in item.selectItemMap) {
_datas.push({key, value: item.selectItemMap[key]});
} else {
for (var key in item.selectItemMap) {
_datas.push({key, value: item.selectItemMap[key]});
}
} }
return ( return (
...@@ -135,6 +154,13 @@ const ScheduleAction = (props) => { ...@@ -135,6 +154,13 @@ const ScheduleAction = (props) => {
); );
} }
if (item.selectMode === 'cascader') {
return <Cascader
options={item.selectItemList}
expandTrigger="hover"
/>
}
if (item.selectMode === 'timePicker') { if (item.selectMode === 'timePicker') {
return <TimePicker />; return <TimePicker />;
} }
...@@ -146,36 +172,62 @@ const ScheduleAction = (props) => { ...@@ -146,36 +172,62 @@ const ScheduleAction = (props) => {
} }
return ( return (
<Form {...formItemLayout} form={form}> <Form {...formItemLayout} form={form} onValuesChange={onValuesChange}>
{ <Row gutter={10}>
schedule && (schedule.targetParameters||[]).map((item, index) => { {
return ( schedule && (schedule.targetParameters||[]).map((item, index) => {
<Form.Item
label={item.cnName||''} let _type = 'string';
name={item.name||''} if (item.selectMode === 'switch') {
key={index} _type = 'boolean';
rules={[{ required: item.required, message: '必填项', type: (item.selectMode==='timePicker')?'object': 'string'}]} } else if (item.selectMode === 'timePicker') {
valuePropName={(item.selectMode==='switch')? 'checked': 'value'} _type = 'object';
> } else if (item.selectMode === 'cascader') {
{ formItemBody(item) } _type = 'array';
</Form.Item> }
)
}) return (
} <Col span={12} key={index}>
{ <Form.Item
schedule && (schedule.scheduleParameters||[]).map((item, index) => { label={item.cnName||''}
return ( name={item.name||''}
<Form.Item key={index}
label={item.cnName||''} rules={[{ required: item.required, message: '必填项', type: _type }]}
name={item.name||''} valuePropName={(item.selectMode==='switch')? 'checked': 'value'}
key={index} >
rules={[{ required: item.required, message: '必填项'}]} { formItemBody(item) }
> </Form.Item>
{ formItemBody(item) } </Col>
</Form.Item> )
) })
}) }
} {
schedule && (schedule.scheduleParameters||[]).map((item, index) => {
let _type = 'string';
if (item.selectMode === 'switch') {
_type = 'boolean';
} else if (item.selectMode === 'timePicker') {
_type = 'object';
} else if (item.selectMode === 'cascader') {
_type = 'array';
}
return (
<Col span={12} key={index}>
<Form.Item
label={item.cnName||''}
name={item.name||''}
rules={[{ required: item.required, message: '必填项', type: _type }]}
valuePropName={(item.selectMode==='switch')? 'checked': 'value'}
>
{ formItemBody(item) }
</Form.Item>
</Col>
)
})
}
</Row>
</Form> </Form>
); );
} }
......
src/view/Manage/DatasourceManage/Component/ScheduleCURDModal.jsx
import React, { useEffect, useState } from 'react'; import React, { useEffect, useState } from 'react';
import { Table, Space, Button, Tooltip, Modal, Form } from 'antd'; import { Table, Space, Button, Tooltip, Modal, Form } from 'antd';
import { EditOutlined, ReconciliationOutlined, DeleteOutlined } from '@ant-design/icons'; import { EditOutlined, DeleteOutlined } from '@ant-design/icons';
import ScheduleAction from './ScheduleAction'; import ScheduleAction from './ScheduleAction';
import { dispatch } from '../../../../model'; import { dispatch } from '../../../../model';
import { showMessage } from '../../../../util'; import { showMessage } from '../../../../util';
import './ScheduleCURDModal.less';
const ScheduleCURDModal = (props) => { const ScheduleCURDModal = (props) => {
const { visible, onCancel, id } = props; const { visible, onCancel, id } = props;
...@@ -15,6 +17,7 @@ const ScheduleCURDModal = (props) => { ...@@ -15,6 +17,7 @@ const ScheduleCURDModal = (props) => {
const [ currentSchedule, setCurrentSchedule ] = useState(''); const [ currentSchedule, setCurrentSchedule ] = useState('');
const [ step, setStep ] = useState(0); const [ step, setStep ] = useState(0);
const [ confirmLoading, setConfirmLoading ] = useState(false); const [ confirmLoading, setConfirmLoading ] = useState(false);
const [ editSchedule, setEditSchedule ] = useState({});
const [modal, contextHolder] = Modal.useModal(); const [modal, contextHolder] = Modal.useModal();
const [form] = Form.useForm(); const [form] = Form.useForm();
...@@ -24,7 +27,8 @@ const ScheduleCURDModal = (props) => { ...@@ -24,7 +27,8 @@ const ScheduleCURDModal = (props) => {
if (visible) { if (visible) {
getSchedules(); getSchedules();
} }
//eslint-disable-next-line react-hooks/exhaustive-deps
}, [ visible ]) }, [ visible ])
const columns = [ const columns = [
...@@ -53,7 +57,7 @@ const ScheduleCURDModal = (props) => { ...@@ -53,7 +57,7 @@ const ScheduleCURDModal = (props) => {
{ {
title: '调度时间', title: '调度时间',
dataIndex: 'cronDesc', dataIndex: 'cronDesc',
width: 180, width: 200,
ellipsis: true, ellipsis: true,
}, },
{ {
...@@ -72,9 +76,9 @@ const ScheduleCURDModal = (props) => { ...@@ -72,9 +76,9 @@ const ScheduleCURDModal = (props) => {
<Tooltip placement='bottom' title={'修改'}> <Tooltip placement='bottom' title={'修改'}>
<Button icon={<EditOutlined />} size='small' onClick={() => { editItem(record); }} /> <Button icon={<EditOutlined />} size='small' onClick={() => { editItem(record); }} />
</Tooltip> </Tooltip>
<Tooltip placement='bottom' title={'详情'}> {/* <Tooltip placement='bottom' title={'详情'}>
<Button icon={<ReconciliationOutlined />} size='small' onClick={() => { detailItem(record); }} /> <Button icon={<ReconciliationOutlined />} size='small' onClick={() => { detailItem(record); }} />
</Tooltip> </Tooltip> */}
<Tooltip placement='bottom' title={'删除'}> <Tooltip placement='bottom' title={'删除'}>
<Button icon={<DeleteOutlined />} size='small' onClick={() => { deleteItem(record); }} /> <Button icon={<DeleteOutlined />} size='small' onClick={() => { deleteItem(record); }} />
</Tooltip> </Tooltip>
...@@ -109,11 +113,11 @@ const ScheduleCURDModal = (props) => { ...@@ -109,11 +113,11 @@ const ScheduleCURDModal = (props) => {
setCurrentSchedule(record); setCurrentSchedule(record);
} }
const detailItem = (record) => { // const detailItem = (record) => {
setStep(1); // setStep(1);
setAction('detail'); // setAction('detail');
setCurrentSchedule(record); // setCurrentSchedule(record);
} // }
const deleteItem = (record) => { const deleteItem = (record) => {
modal.confirm({ modal.confirm({
...@@ -148,12 +152,13 @@ const ScheduleCURDModal = (props) => { ...@@ -148,12 +152,13 @@ const ScheduleCURDModal = (props) => {
const reset = () => { const reset = () => {
setStep(0); setStep(0);
setSchedules([]);
setCurrentSchedule({}); setCurrentSchedule({});
setConfirmLoading(false); setConfirmLoading(false);
} }
const onActionChange = (data) => { const onActionChange = (data) => {
getSchedules(); setEditSchedule(data);
} }
const prev = () => { const prev = () => {
...@@ -161,30 +166,28 @@ const ScheduleCURDModal = (props) => { ...@@ -161,30 +166,28 @@ const ScheduleCURDModal = (props) => {
} }
const save = async () => { const save = async () => {
// try { try {
// const row = await form.validateFields(); await form.validateFields();
// const newTemplateData = {...currentTemplate, ...row};
// setConfirmLoading(true); setConfirmLoading(true);
// dispatchLatest({ dispatch({
// type: 'datamodel.saveTemplate', type: 'datasource.saveAndStartSchedule',
// payload: { payload: {
// data: newTemplateData data: editSchedule
// }, },
// callback: () => { callback: () => {
// setConfirmLoading(false); setConfirmLoading(false);
// reset(); reset();
// onCancel && onCancel(true); getSchedules();
// }, },
// error: () => { error: () => {
// setConfirmLoading(false); setConfirmLoading(false);
// } }
// }) })
// } catch (errInfo) { } catch (errInfo) {
// console.log('Validate Failed:', errInfo); console.log('Validate Failed:', errInfo);
// } }
} }
...@@ -275,6 +278,7 @@ const ScheduleCURDModal = (props) => { ...@@ -275,6 +278,7 @@ const ScheduleCURDModal = (props) => {
id={currentSchedule.id} id={currentSchedule.id}
form={form} form={form}
tid={id} tid={id}
onChange={onActionChange}
/> />
} }
{ contextHolder } { contextHolder }
......
src/view/Manage/DatasourceManage/Component/ScheduleCURDModal.less 0 → 100644
.schedule-curd-modal {
.yy-table {
max-height: 600px !important;
overflow: auto !important;
}
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment