采集

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

 import React, { useState, useEffect, useContext, useMemo, useReducer } from 'react';
-import { Space, Button, TreeSelect, Select, Pagination, Typography } from 'antd';
+import { Space, Button, TreeSelect, Select, Pagination, Typography, Modal, Tooltip } from 'antd';
 
 import { AppContext } from '../../../../App';
 import { dispatch } from '../../../../model';
-import { paginate } from '../../../../util'; 
+import { paginate, showMessage } from '../../../../util'; 
 import Table from '../../ResizeableTable';
 import UpdateTask from './UpdateTask';
 import ColConfig from './ColConfig';
@@ -17,6 +17,7 @@ const FC = (props) => {
   const [configState, setConfigState] = useState(undefined);
   const [supportedTargetTypes, setSupportedTargetTypes] = useState([]);
   const [sortedInfo, setSortedInfo] = useState({});
+  const [ tasksProgress, setTasksProgress ] = useState(undefined);
 
   const [updateTaskParam, setUpdateTaskParam] = useState({
     visible: false,
@@ -29,6 +30,8 @@ const FC = (props) => {
 
   const {pageNum, pageSize} = pagination;
 
+  const [modal, contextHolder] = Modal.useModal();
+
   const columns = [
     {
       title: '序号',
@@ -73,18 +76,37 @@ const FC = (props) => {
     {
       title: '操作',
       dataIndex: 'action',
-      width: 120,
+      width: 150,
       fixed: 'right',
       render: (_, record) => {
+        let isExtract = false, editTip = '';
+
+        if (tasksProgress && tasksProgress[record.id]!==null && tasksProgress[record.id]!==undefined) {
+          isExtract = true;
+          editTip = '正在抽取中,不允许修改任务';
+        }
+
         return (
           <Space>
-            <a onClick={() =>{}}>执行</a>
-            <a onClick={() => {
-              setUpdateTaskParam({ visible: true, action: 'edit', id: record.id });
-            }}>
-              修改
-            </a>
-            <a onClick={() => {}}>
+            {
+              isExtract ? <a 
+                onClick={() => { onCancelTask(record); 
+              }}>取消执行</a> : <a 
+                onClick={() =>{
+                  onStartTask(record);
+              }}>执行</a>
+            }
+            <Tooltip placement='bottom' title={editTip}>
+              <a 
+                disabled={isExtract}
+                onClick={() => {
+                  setUpdateTaskParam({ visible: true, action: 'edit', id: record.id });
+                }}
+              >
+                修改
+              </a>
+            </Tooltip>
+            <a onClick={() => { onDeleteTask(record); }}>
               删除
             </a>
           </Space>
@@ -95,6 +117,13 @@ const FC = (props) => {
 
   useEffect(() => {
     getAllTasks();
+    const interval = setInterval(() => {
+      getAllTasksProgress();
+    }, 5000);
+
+    return () => {
+      clearInterval(interval);
+    }
   }, [])
 
   const _tasks = useMemo(() => {
@@ -179,6 +208,15 @@ const FC = (props) => {
     })
   }
 
+  const getAllTasksProgress = () => {
+    dispatch({
+      type: 'datasource.getAllTaskProgress',
+      callback: data => {
+        setTasksProgress(data||{});
+      }
+    })
+  }
+
   const onTableChange = (pagination, filters, sorter) => {
     console.log('sorter', sorter);
     setSortedInfo(sorter);
@@ -196,6 +234,66 @@ const FC = (props) => {
   const onColConfigCancel = (refresh = false) => {
     setColConfigParam({ visible: false });
   }
+
+  const onCancelTask = (task) => {
+    modal.confirm({
+      title: '是否取消该任务?',
+      content: '',
+      onOk: () => {
+        dispatch({
+          type: 'datasource.cancelTask',
+          payload: {
+            params: {
+              harvestingTaskId: task.id
+            }
+          },
+          callback: () => {
+            showMessage('success', '取消成功!');
+          }
+        });
+      }
+    });
+  }
+
+  const onStartTask = (task) => {
+    modal.confirm({
+      title: '是否执行该任务?',
+      content: '',
+      onOk: () => {
+        dispatch({
+          type: 'datasource.startTask',
+          payload: {
+            params: {
+              harvestingTaskId: task.id
+            }
+          },
+          callback: () => {
+            showMessage('success', '执行成功');
+            getAllTasksProgress();
+          }
+        });
+      }
+    });
+  }
+
+  const onDeleteTask = (task) => {
+    modal.confirm({
+      title: '是否确认删除该任务?',
+      content: '',
+      onOk: () => {
+        dispatch({
+          type: 'datasource.deleteTask',
+          payload: {
+            harvestingTaskId: task.id
+          },
+          callback: () => {
+            showMessage('success', '删除任务成功');
+            getAllTasks();
+          }
+        });
+      }
+    });
+  }
   
   return (
     <div>
@@ -250,7 +348,7 @@ const FC = (props) => {
         visible={colConfigParam.visible}
         onCancel={onColConfigCancel}
       />
-
+      {contextHolder}
     </div>
   )
 }