任务报告

src/model/datamodel.js

@@ -504,6 +504,10 @@ export function* runCompareJob(payload) {
   return yield call(datamodelerService.runCompareJob, payload)
 }
 
+export function* cancelCompareJob(payload) {
+  return yield call(datamodelerService.cancelCompareJob, payload)
+}
+
 export function* getCompareJobStates() {
   return yield call(datamodelerService.getCompareJobStates)
 }
@@ -538,4 +542,12 @@ export function* getSettingCols(payload) {
 
 export function* setSettingCols(payload) {
   return yield call(datamodelerService.setSettingCols, payload)
+}
+
+export function* getCompareJobResultList(payload) {
+  return yield call(datamodelerService.getCompareJobResultList, payload)
+}
+
+export function* getCompareJobRunStateTypes() {
+  return yield call(datamodelerService.getCompareJobRunStateTypes)
 }
\ No newline at end of file

src/service/datamodeler.js

@@ -457,6 +457,10 @@ export function runCompareJob(payload) {
   return GetJSON("/datamodeler/easyDataModelModelCompareJob/runJob", payload)
 }
 
+export function cancelCompareJob(payload) {
+  return GetJSON("/datamodeler/easyDataModelModelCompareJob/cancelJob", payload)
+}
+
 export function getCompareJobStates() {
   return GetJSON("/datamodeler/easyDataModelModelCompareJob/getJobStatusTypes")
 }
@@ -483,4 +487,12 @@ export function getSettingCols(payload) {
 
 export function setSettingCols(payload) {
   return PostJSON("/dataquality/setting/set", payload)
+}
+
+export function getCompareJobResultList(payload) {
+  return GetJSON("/datamodeler/easyDataModelModelCompareJobResult/getList", payload)
+}
+
+export function getCompareJobRunStateTypes() {
+  return GetJSON("/datamodeler/easyDataModelModelCompareJobResult/getModelCompareJobRunStateTypes")
 }
\ No newline at end of file

src/view/Manage/ModelCompare/task-report.jsx

 import React from 'react'
+import { Space, Input, Select, DatePicker, Typography, Tooltip, Modal } from 'antd'
+import { useDebounceEffect } from 'ahooks'
+
+import { defaultPage } from '../../../util/hooks/page'
+import { dispatch } from '../../../model'
+import Table from '../../../util/Component/Table'
+import UpdateTask from './update-task'
+
+import '../AssetTask/index.less'
+import { showMessage } from '../../../util'
 
 const FC = (props) => {
+  const [args, setArgs] = React.useState({
+    state: undefined,
+    keyword: undefined,
+    startTime: undefined,
+    endTime: undefined, 
+    page: defaultPage.pageNum, 
+    size: defaultPage.pageSize, 
+  })
+  const [loadingStates, setLoadingStates] = React.useState(false)
+  const [states, setStates] = React.useState()
+  const [loading, setLoading] = React.useState(false)
+  const [data, setData] = React.useState()
+  const [total, setTotal] = React.useState(0)
+  const [updateTaskParams, setUpdateTaskParams] = React.useState({
+    visible: false,
+    item: undefined,
+    type: undefined
+  })
+  const [rightRow, setRightRow] = React.useState()
+
+  const [modal, contextHolder] = Modal.useModal()
+
+  const setArgsByParams = React.useCallback((params) => {
+    setArgs((prev) => {
+      return {...prev, ...params}
+    })
+  }, [])
+
+  React.useEffect(() => {
+    getStates()
+  }, [])
+
+  useDebounceEffect(()=>{
+    getResults()
+  }, [args], { wait:300 })
+
+  const menuData = React.useMemo(() => {
+    if (rightRow) {
+      return rightRow?.runStateId === 'STARTED' ? ['执行日志', '取消'] : ['执行日志', '执行结果', '重跑']
+    }
+    return []
+  }, [rightRow])
+
+  const cols = [
+    {
+      title: '序号',
+      dataIndex: 'index',
+      width:60,
+      render:(_, __, index)=> ((args.page-1)*args.size+index+1)
+    },
+    {
+      title: '执行编号',
+      dataIndex: 'showResultNumber',
+    },
+    {
+      title: '任务名称',
+      dataIndex: 'jobName',
+      render: (text, record) => (
+        <Tooltip title={text}>
+          <Typography.Text ellipsis={true}>
+            <a onClick={() => {
+              setUpdateTaskParams({
+                visible: true,
+                type: 'detail',
+                item: {
+                  id: record?.jobId
+                }, 
+              })
+            }}>{text}</a>
+          </Typography.Text>
+        </Tooltip>
+      )
+    },
+    {
+      title: '执行状态',
+      dataIndex: 'runStateName',
+    },
+    {
+      title: '匹配数/差异数/不匹数',
+      dataIndex: 'count',
+    },
+    {
+      title: '开始时间',
+      dataIndex: 'beginTs',
+      render: (_, record) => record.beginTs ? new Date(record.beginTs).toLocaleString() : ''
+    },
+    {
+      title: '结束时间',
+      dataIndex: 'endTs',
+      render: (_, record) => record.endTs ? new Date(record.endTs).toLocaleString() : ''
+    },
+    {
+      title: '耗时（s）',
+      dataIndex: 'executionTime',
+    },
+  ]
+
+  const getStates = () => {
+    setLoadingStates(true)
+    dispatch({
+      type: 'datamodel.getCompareJobRunStateTypes',
+      callback: data => {
+        setLoadingStates(false)
+        setStates(data)
+      },
+      error: () => {
+        setLoadingStates(false)
+      }
+    })
+  }
+
+  const getResults = () => {
+    setLoading(true)
+    dispatch({
+      type: 'datamodel.getCompareJobResultList',
+      payload: {
+        keyword: args.keyword,
+        runStateTypeId: args.state,
+        beginTs: args.startTime,
+        endTs: args.endTime,
+        pageNo: args.page,
+        pageSize: args.size,
+      },
+      callback: data => {
+        setLoading(false)
+        setData(data?.content)
+        setTotal(data?.totalElements)
+      },
+      error: () => {
+        setLoading(false)
+      }
+    })
+  }
+
+  const onRightMenuItemClick = (key, record) => {
+    if (key === '执行日志') {
+
+    } else if (key === '执行结果') {
+
+    } else if (key === '重跑') {
+
+    } else if (key === '取消') {
+      modal.confirm({
+        title:'提示',
+        content: '您确定要取消正在执行中的任务吗?',
+        okText: '确认',
+        cancelText: '取消',
+        onOk: () => {
+          dispatch({
+            type: 'datamodel.cancelCompareJob',
+            payload: {
+              resultId: record?.id
+            },
+            callback: data => {
+              showMessage('success', '取消成功')
+              getResults()
+            }
+          })
+        }
+      })
+    }
+  }
+
   return (
-    <div>
-      task report
+    <div className='task-manage'>
+      <div className='header px-3'>
+        <div />
+        <Space>
+          <DatePicker.RangePicker 
+            format="YYYY-MM-DD" 
+            onChange={(values) => {
+              setArgsByParams({ startTime: (values??[]).length>0?values[0].valueOf():'', endTime: (values??[]).length>1?values[1].valueOf():'', page: 1 })
+            }}
+            style={{ width: 240 }}
+          />
+          <Select allowClear
+            loading={loadingStates}
+            placeholder="请选择执行状态"
+            value={args.state}
+            onChange={(val) => {
+              setArgsByParams({ state: val, page: 1 })
+            }}
+            style={{ width: 160 }}
+          >
+          { (states??[]).map(item => (
+            <Select.Option key={item.id} value={item.id}>{item.name}</Select.Option>
+          )) }
+          </Select>
+          <Input size="middle"
+            placeholder="执行编号/任务名称"
+            value={args.keyword}
+            bordered={true} allowClear
+            onChange={(e) => {
+              setArgsByParams({ keyword: e.target.value, page: 1 })
+            }} 
+          />
+        </Space>
+      </div>
+      <div className='px-3 pt-3'>
+        <Table
+          loading={loading}
+          maxHeight='calc(100vh - 285px - 46px)'
+          columns={cols??[]}
+          dataSource={data??[]}
+          pageNum={args.page} pageSize={args.size} total={total ?? 0}
+          onPaginate={(page, size) => {
+            setArgsByParams({ page, size })
+          }}
+          shouldRowContextMenu={(record) => {
+            setRightRow(record)
+            return true
+          }}
+          menuData={menuData}
+          menuPermissions={menuData}
+          onMenuItemClick={onRightMenuItemClick}
+        />
+      </div>
+      <UpdateTask
+        {...updateTaskParams}
+        onCancel={(refresh) => {
+          setUpdateTaskParams({
+            visible: false,
+            item: undefined,
+            type: undefined,
+          })
+        }}
+      />
+      {contextHolder}
     </div>
   )
 }