fix: view dispath info

app/containers/DataGovernanceMarkRule/components/AuditClassificationFormModal.tsx

@@ -135,7 +135,7 @@ export const AuditClassificationFormModal = (
   const handleDeleteTheme = async (data: IRule) => {
     try {
       setTableLoading(true)
-      const result = await request(api.deleteDataSubject + data.id, { method: 'delete' })
+      const result = await request(api.deleteDataRules + data.id, { method: 'delete' })
       // @ts-ignore
       if (result?.header?.code === 200) {
         message.success({ content: '删除成功' })

app/containers/DataGovernanceQualityAudit/components/ScheduleFormModal.tsx

@@ -1,39 +1,59 @@
-import React from 'react'
+import React, { useEffect, useState } from 'react'
 import {
   Modal,
   Form,
   Radio,
   Button,
-  Input,
   Switch,
-  Select,
+  message,
   DatePicker,
-  InputNumber
+  InputNumber,
+  Spin
 } from 'antd'
 import { FormComponentProps } from 'antd/lib/form'
-import { IClassification, ISchedule } from '../types'
-import {
-  ICronExpressionPartition,
-  SchedulePeriodUnit
-} from 'containers/Schedule/components/types'
+import { IQualityTask, ISchedule } from '../types'
+import { SchedulePeriodUnit } from 'containers/Schedule/components/types'
+import request from 'app/utils/request'
+import api from 'app/utils/api'
+import moment from 'moment'
 
 const FormItem = Form.Item
 
 interface IScheduleFormModalProps extends FormComponentProps<ISchedule> {
   visible: boolean
   loading: boolean
-  formView: ISchedule
+  formView: Partial<IQualityTask>
   onSave: (view: ISchedule) => void
   onCancel: () => void
 }
 
+interface State {
+  view: IQualityTask
+}
+
+const getIntervalFromCronExpression = (cronExpression = '') => {
+  const regs = [
+    new RegExp(/0 \*\/(\S*) \* \* \* \?/), // Minute `0 */12 * * * ?`.match(/0 \*\/(\S*) \* \* \* \?/)[1]
+    new RegExp(/0 0 0\/(\S*) \* \* \?/), // Hour `0 0 0/12 * * ?`.match(/0 0 0\/(\S*) \* \* \?/)[1]
+    new RegExp(/0 0 0 1\/(\S*) \* \?/), // Day `0 0 0 1/12 * ?`.match(/0 0 0 1\/(\S*) \* \?/)[1]
+    new RegExp(/0 0 0 \? \* (\S*)/), // Week `0 0 0 ? * 12`.match(/0 0 0 \? \* (\S*)/)[1]
+    new RegExp(/0 0 0 1 1\/(\S*) \? \*/), // Month `0 0 0 1 1/12 ? *`.match(/0 0 0 1 1\/(\S*) \? \*/)[1]
+    new RegExp(/0 0 0 1 1 \? 1\/(\S*)/) // Year `0 0 0 1 1 ? 1/12`.match(/0 0 0 1 1 \? 1\/(\S*)/)[1]
+  ]
+
+  return regs
+    .map((o) => cronExpression?.match(o)?.[1])
+    .filter((o) => o)
+    .join()
+}
+
 const getCronExpressionByPartition = (partition: {
-  periodUnit: string
+  periodUnit: SchedulePeriodUnit
   interval: number
 }) => {
   const { periodUnit, interval } = partition
   let cronExpression = ''
-  switch (periodUnit as SchedulePeriodUnit) {
+  switch (periodUnit) {
     case 'Minute':
       cronExpression = `0 */${interval} * * * ?`
       break
@@ -56,15 +76,24 @@ const getCronExpressionByPartition = (partition: {
   return cronExpression
 }
 
-class ScheduleFormModal extends React.PureComponent<IScheduleFormModalProps> {
-  // @ts-ignore
-  private formItemStyle = {
-    labelCol: { span: 6 },
-    wrapperCol: { span: 18 }
+const formItemStyle = {
+  labelCol: { span: 6 },
+  wrapperCol: { span: 18 }
+}
+
+const ScheduleFormModal = (props: IScheduleFormModalProps) => {
+  const { loading, onCancel, form, formView, onSave, visible } = props
+  const { getFieldDecorator } = form
+
+  const [view, setView] = useState<ISchedule>({})
+
+  const [viewLoading, setViewLoading] = useState(false)
+
+  const clearFieldsValue = () => {
+    form.resetFields()
   }
 
-  private save = () => {
-    const { form, formView, onSave } = this.props
+  const handleSave = () => {
     form.validateFieldsAndScroll((err, fieldsValue) => {
       if (err) {
         return
@@ -80,43 +109,77 @@ class ScheduleFormModal extends React.PureComponent<IScheduleFormModalProps> {
     })
   }
 
-  private clearFieldsValue = () => {
-    this.props.form.resetFields()
+  const getDispatchInfo = async() => {
+    try {
+      setViewLoading(true)
+
+      const result = await request({
+        url: api.getDispatch + formView?.id,
+        method: 'get',
+        headers: {
+          ContentType: 'application/json'
+        },
+        data: {
+          id: formView?.id
+        }
+      })
+
+      // @ts-ignore
+      if (result?.header?.code === 200) {
+        setView({
+          // @ts-ignore
+          ...(result?.payload ?? {}),
+          interval: getIntervalFromCronExpression(
+            // @ts-ignore
+            result?.payload?.cronExpression ?? ''
+          )
+        })
+      }
+    } catch (err) {
+      if (err?.response?.data?.header?.msg) {
+        message.error({ content: err?.response?.data?.header?.msg })
+      }
+      console.log(err)
+    } finally {
+      setViewLoading(false)
+    }
   }
 
-  public render() {
-    const { form, visible, loading, formView, onCancel } = this.props
-    const { getFieldDecorator } = form
-
-    const modalButtons = [
-      <Button key={'back'} size={'large'} onClick={onCancel}>
-        取 消
-      </Button>,
-      <Button
-        disabled={loading}
-        key={'submit'}
-        size={'large'}
-        type={'primary'}
-        onClick={this.save}
-      >
-        保 存
-      </Button>
-    ]
-
-    return (
-      <Modal
-        title={'调度器'}
-        visible={visible}
-        footer={modalButtons}
-        onCancel={onCancel}
-        afterClose={this.clearFieldsValue}
-        destroyOnClose
-        // width={800}
-      >
+  useEffect(() => {
+    if (visible) {
+      getDispatchInfo()
+    }
+  }, [formView?.id, visible])
+
+  const modalButtons = [
+    <Button key="back" size="large" onClick={onCancel}>
+      取 消
+    </Button>,
+    <Button
+      disabled={loading}
+      key="submit"
+      size="large"
+      type="primary"
+      onClick={handleSave}
+    >
+      保 存
+    </Button>
+  ]
+  return (
+    <Modal
+      title="调度器"
+      visible={visible}
+      footer={modalButtons}
+      onCancel={onCancel}
+      afterClose={clearFieldsValue}
+      destroyOnClose
+      // width={800}
+    >
+      <Spin spinning={viewLoading}>
         <Form>
-          <FormItem label={'调度周期'} {...this.formItemStyle} required>
+          <FormItem label="调度周期" {...formItemStyle} required>
             {getFieldDecorator<ISchedule>('periodUnit', {
-              initialValue: formView?.periodUnit,
+              initialValue: view?.periodUnit,
               rules: [
                 {
                   required: true,
@@ -125,25 +188,28 @@ class ScheduleFormModal extends React.PureComponent<IScheduleFormModalProps> {
               ]
             })(
               <Radio.Group>
-                <Radio value={'Minute'}>分钟</Radio>
-                <Radio value={'Hour'}>小时</Radio>
-                <Radio value={'Day'}>日</Radio>
-                <Radio value={'Week'}>周</Radio>
-                <Radio value={'Month'}>月</Radio>
-                <Radio value={'Year'}>年</Radio>
+                <Radio value="Minute">分钟</Radio>
+                <Radio value="Hour">小时</Radio>
+                <Radio value="Day">日</Radio>
+                <Radio value="Week">周</Radio>
+                <Radio value="Month">月</Radio>
+                <Radio value="Year">年</Radio>
               </Radio.Group>
             )}
           </FormItem>
-          <FormItem label={'调度间隔'} {...this.formItemStyle} required>
+          <FormItem label="调度间隔" {...formItemStyle} required>
             {getFieldDecorator<ISchedule>('interval', {
-              initialValue: formView?.interval,
+              initialValue: view?.interval,
               rules: [{ required: true, message: '请输入' }]
             })(<InputNumber />)}
           </FormItem>
 
-          <FormItem label={'起止日期'} {...this.formItemStyle} required>
+          <FormItem label="起止日期" {...formItemStyle} required>
             {getFieldDecorator<ISchedule>('startDate', {
-              initialValue: [formView?.startDate, formView.endDate],
+              initialValue:
+                view?.startDate && view?.endDate
+                  ? [moment(view?.startDate), moment(view.endDate)]
+                  : [],
               rules: [
                 {
                   required: true,
@@ -153,14 +219,15 @@ class ScheduleFormModal extends React.PureComponent<IScheduleFormModalProps> {
             })(
               <DatePicker.RangePicker
                 style={{ width: '100%' }}
-                format={'YYYY-MM-DD hh:mm:ss'}
+                format="YYYY-MM-DD hh:mm:ss"
               />
             )}
           </FormItem>
 
-          <FormItem label={'是否激活'} {...this.formItemStyle} required>
+          <FormItem label="是否激活" {...formItemStyle} required>
             {getFieldDecorator<ISchedule>('jobStatus', {
-              initialValue: formView?.jobStatus === 'started',
+              valuePropName: 'checked',
+              initialValue: view?.jobStatus === 'started',
               rules: [
                 {
                   required: true,
@@ -171,22 +238,22 @@ class ScheduleFormModal extends React.PureComponent<IScheduleFormModalProps> {
           </FormItem>
         </Form>
         <p>
-          提示：您希望每 {this.props.form.getFieldValue('interval')}{' '}
-          {TIME_KEY_VALUE?.[this.props.form.getFieldValue('periodUnit')]}{' '}
+          提示：您希望每 {form.getFieldValue?.('interval')}{' '}
+          {TIME_KEY_VALUE?.[form.getFieldValue?.('periodUnit')]}{' '}
           执行一次该任务， 从{' '}
-          {this.props.form
-            .getFieldValue('startDate')?.[0]
-            ?.format('YYYY-MM-DD hh:mm:ss')}{' '}
+          {form
+            .getFieldValue?.('startDate')?.[0]
+            ?.format?.('YYYY-MM-DD hh:mm:ss')}{' '}
           时间开始到
-          {this.props.form
-            .getFieldValue('startDate')?.[1]
-            ?.format('YYYY-MM-DD hh:mm:ss')}{' '}
+          {form
+            .getFieldValue?.('startDate')?.[1]
+            ?.format?.('YYYY-MM-DD hh:mm:ss')}{' '}
           时间停止周期调度， 并且当前任务状态{' '}
-          {this.props.form.getFieldValue('jobStatus') ? '开启' : '关闭'}
+          {form.getFieldValue?.('jobStatus') ? '开启' : '关闭'}
         </p>
-      </Modal>
-    )
-  }
+      </Spin>
+    </Modal>
+  )
 }
 
 const TIME_KEY_VALUE = {

app/containers/DataGovernanceQualityAudit/index.tsx

@@ -247,6 +247,11 @@ function DataGovernanceQualityAudit(
         message.success({ content: '设置调度成功' })
         queryQualityTasks()
       }
+    } catch (err) {
+      if (err?.response?.data?.header?.msg) {
+        message.error({ content: err?.response?.data?.header?.msg })
+      }
+      console.log(err)
     } finally {
       setSCLoading(false)
     }
@@ -425,7 +430,7 @@ function DataGovernanceQualityAudit(
       <ScheduleFormModal
         visible={scVisible}
         loading={scLoading}
-        formView={scForm}
+        formView={qtForm}
         onSave={handleDispatch}
         onCancel={() => setScVisible(false)}
       />

app/utils/api.ts

@@ -117,6 +117,9 @@ export default {
 
   // 设置调度 PUT /api/v3/qualityTask/setDispatch/{id}
   setDispatch: `${API_HOST}/qualityTask/setDispatch/`,
+  // 查询调度信息 GET /api/v3/qualityTask/getDispatch/{id}
+  getDispatch: `${API_HOST}/qualityTask/getDispatch/`,
+
   // 立即稽核 PUT /api/v3/qualityTask/auditor/{id}
   setDispatchRightNow: `${API_HOST}/qualityTask/auditor/`,