采集

src/view/Manage/DatasourceManage/Component/ScheduleAction.jsx

@@ -11,13 +11,15 @@ const ScheduleAction = (props) => {
 
   useEffect(() => {
     reset();
+    console.log('action', action);
+    console.log('tid', tid);
     if (action === 'add' && tid) {
       getScheduleForm();
-    } else {
+    } else if (action === 'edit' && id) {
       getScheduleById();
     }
     //eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [ action, id])
+  }, [action, tid, id])
 
   const getScheduleForm = () => {
     dispatch({

src/view/Manage/MetadataHarvester/Component/Task.jsx

 import React, { useState, useEffect, useContext, useMemo, useReducer } from 'react';
-import { Space, Button, TreeSelect, Select, Pagination } from 'antd';
+import { Space, Button, TreeSelect, Select, Pagination, Typography } from 'antd';
 
 import { AppContext } from '../../../../App';
 import { dispatch } from '../../../../model';
@@ -58,6 +58,27 @@ const FC = (props) => {
       title: '表黑名单',
       dataIndex: 'tableBlackList',
     },
+    {
+      title: '操作',
+      dataIndex: 'action',
+      width: 120,
+      fixed: 'right',
+      render: (_, record) => {
+        return (
+          <Space>
+            <a onClick={() =>{}}>执行</a>
+            <a onClick={() => {
+              setUpdateTaskParam({ visible: true, action: 'edit', id: record.id });
+            }}>
+              修改
+            </a>
+            <a onClick={() => {}}>
+              删除
+            </a>
+          </Space>
+        )
+      }
+    }
   ]
 
   useEffect(() => {
@@ -177,7 +198,7 @@ export const reducer = (prevState, action) => {
   return prevState
 }
 
-export function Config({  onState }) {
+export function Config({ onState, autoSelect }) {
   // const { env } = useContext(AppContext);
   const [treeData, setTreeData] = useState([]);
   const [treeExpandKeys, setTreeExpandKeys] = useState([]);
@@ -225,6 +246,12 @@ export function Config({  onState }) {
   }, [scope])
 
   useEffect(() => {
+    if (autoSelect && (datasources||[]).length > 0) {
+      dispatchState({type: 'selectDatasource', payload: [datasources[0].id]});
+    }
+  }, [autoSelect, datasources])
+
+  useEffect(() => {
     dispatchState({type: 'selectDatasource', payload: [undefined]})
   }, [scope, targetType])
 

src/view/Manage/MetadataHarvester/Component/UpdateTask.jsx

-import React, { useEffect, useState } from 'react';
-import { Modal, Checkbox, Row, Col, Divider, Input, Typography, Form, Switch } from 'antd';
+import React, { useEffect, useMemo, useState } from 'react';
+import { Modal, Checkbox, Row, Col, Divider, Input, Typography, Form, Switch, Spin } from 'antd';
 
 import { Config } from './Task';
 import ScheduleAction from '../../DatasourceManage/Component/ScheduleAction';
@@ -13,10 +13,16 @@ const FC = (props) => {
   const [taskSettings, setTaskSettings] = useState({});
   const [currentTask, setCurrentTask] = useState({});
   const [keyword, setKeyword] = useState('');
+  const [loading, setLoading] = useState(false);
   const [confirmLoading, setConfirmLoading] = useState(false);
   const [checkAllValue, setCheckAllValue] = useState(false);
   const [configState, setConfigState] = useState(undefined);
   const [step, setStep] = useState(1);
+  const [scheduleParam, setScheduleParam] = useState({
+    action: undefined,
+    id: undefined,
+    tid: undefined
+  });
 
   const [ form ] = Form.useForm();
   const [ scheduleForm ] = Form.useForm();
@@ -39,27 +45,45 @@ const FC = (props) => {
     setFilterSchemas((schemas||[]).filter(schema => (schema||'').indexOf(keyword)!==-1));
   }, [keyword, schemas])
 
+  const isNeo4jTarget = useMemo(() => {
+    if (action === 'add' && configState?.targetType==='Neo4jTarget') {
+      return true;
+    } else if (action === 'edit' && currentTask?.target?.type === 'Neo4jTarget') {
+      return true;
+    }
+
+    return false;
+  }, [action, currentTask, configState]) 
+
   const getTask = () => {
+    setLoading(true);
     dispatch({
       type: 'datasource.getTask',
       payload: {
         harvestingTaskId: id
       },
       callback: data => {
+        setLoading(false);
         setCurrentTask(data);
+        getSchedules();
         getTaskSettings(data?.target?.id);
+      },
+      error: () => {
+        setLoading(false);
       }
     })
   }
 
   const getTaskSettings = (id) => {
     setCurrentTask((prevTask) => {
+      setLoading(true);
       dispatch({
         type: 'datasource.getTaskSettingsByDatasource',
         payload: {
           datasourceId: id
         },
         callback: data => {
+          setLoading(false);
           setTaskSettings(data);
 
           let recentSchemas = [];
@@ -82,6 +106,9 @@ const FC = (props) => {
 
             form.setFieldsValue(_fieldsValue);
           }
+        },
+        error: () => {
+          setLoading(false);
         }
       });
 
@@ -89,6 +116,34 @@ const FC = (props) => {
     });
   }
 
+  const getSchedules = () => {
+    setCurrentTask(prevTask => {
+      setLoading(true);
+      dispatch({
+        type: 'datasource.getScheduleListByTaskId',
+        payload: {
+          params: {
+            targetConfId: prevTask.id
+          }
+        },
+        callback: data => {
+          if ((data?.datas||[]).length === 0) {
+            setScheduleParam({action: 'add', tid: prevTask.id});
+          } else {
+            setScheduleParam({action: 'edit', id: data?.datas[0].id});
+          }
+          
+          setLoading(false);
+        },
+        error: () => {
+          setLoading(false);
+        }
+      })
+
+      return prevTask;
+    })
+  }
+
   const onOk = async() => {
     try {
       const row = await form.validateFields();
@@ -118,6 +173,7 @@ const FC = (props) => {
           if (action === 'add') {
             setCurrentTask({id: data});
             setStep(2);
+            setScheduleParam({action, tid: data});
           }
           // reset();
           // onCancel && onCancel(true);
@@ -197,14 +253,19 @@ const FC = (props) => {
     >
       {
         step === 1 && <React.Fragment>
-          <Config onState={(state) => {
+          {
+            (action === 'add') && <div className='flex' style={{ justifyContent: 'end' }}>
+              <Config autoSelect onState={(state) => {
                 setConfigState(state);
               }} />
-          <Divider>{(configState?.targetType==="Neo4jTarget")?'neo4j数据库信息':'schema信息'}</Divider>
+            </div>
+          }
+          <Spin spinning={loading}>
+            <Divider>{isNeo4jTarget?'neo4j数据库信息':'schema信息'}</Divider>
             <div className='d-flex mb-3' style={{ alignItems: 'center' }}>
-            <span className='mr-3'>{(configState?.targetType==="Neo4jTarget")?'neo4j数据库搜索':'schema搜索'}:</span>
+              <span className='mr-3'>{isNeo4jTarget?'neo4j数据库搜索':'schema搜索'}:</span>
               <Input 
-              placeholder={`请输入${(configState?.targetType==="Neo4jTarget")?'neo4j数据库':'schema'}名称`}
+                placeholder={`请输入${isNeo4jTarget?'neo4j数据库':'schema'}名称`}
                 allowClear 
                 value={keyword}
                 onChange={onSearchInputChange} 
@@ -256,17 +317,28 @@ const FC = (props) => {
               })
             }
             </Form>
+          </Spin>
+          {
+            action === 'edit' && <React.Fragment>
+              <Divider>定时调度</Divider>
+              <ScheduleAction 
+                action={scheduleParam.action} 
+                id={scheduleParam.id} 
+                form={scheduleForm}
+                tid={scheduleParam.tid}
+              />
+            </React.Fragment>
+          }
         </React.Fragment>
       }
       {
         step === 2 && <React.Fragment>
           <Divider>定时调度</Divider>
           <ScheduleAction 
-            action={action} 
-            // id={currentSchedule.id} 
+            action={scheduleParam.action} 
+            id={scheduleParam.id} 
             form={scheduleForm}
-            tid={currentTask.id}
-            // onChange={onActionChange}
+            tid={scheduleParam.tid}
           />
         </React.Fragment> 
       }