feat: 完善忽略，派单和自动处理请求

src/pages/TaskManage/Popup/WorkOrderModal.less

@@ -1,5 +1,5 @@
 .modalContainer {
-  padding: 0 30px;
+  padding: 0 30px 30px 30px;
 }
 
 .closeModalBtn {

src/pages/TaskManage/Popup/index.js

@@ -1,5 +1,10 @@
+import {
+  dispatchOrder,
+  ignoreTaskRequest,
+  setTaskAutomation,
+} from '@/services/TaskManage';
 import { CloseOutlined } from '@ant-design/icons';
-import { connect, useLocation, useParams } from '@umijs/max';
+import { connect, useLocation, useParams, useRequest } from '@umijs/max';
 import { Button, Tabs } from 'antd';
 import { useEffect, useState } from 'react';
 import MandateDetail from '../components/MandateDetail';
@@ -21,6 +26,18 @@ const TaskModal = (props) => {
   const [tabItems, setTabItems] = useState([]);
   const [activeKey, setActiveKey] = useState();
 
+  const { run: runIgnore } = useRequest(ignoreTaskRequest, {
+    manual: true,
+  });
+
+  const { run: runDispatch } = useRequest(dispatchOrder, {
+    manual: true,
+  });
+
+  const { run: runAutomate } = useRequest(setTaskAutomation, {
+    manual: true,
+  });
+
   const onTabChange = (key) => {
     setActiveKey(String(key));
   };
@@ -28,6 +45,37 @@ const TaskModal = (props) => {
   const closePage = () => {
     // send message to unity close this modal page
   };
+  // 忽略
+  const onIgnoreTaskConfirm = async (mandateID, reason) => {
+    const params = {
+      Id: mandateID,
+      Status: 4,
+      note: reason,
+    };
+    const result = await runIgnore(params);
+    if (result) {
+      return true;
+    }
+  };
+  // 派单
+  const onDispatchTaskConfirm = async (params) => {
+    const result = await runDispatch(params);
+    if (result) {
+      return true;
+    }
+  };
+  // 自动处理
+  const onAutoHandleTaskConfirm = async (pw, mandate) => {
+    console.log(mandate);
+    const params = {
+      mandate_id: mandate.Id,
+      pw,
+    };
+    const result = runAutomate(params, mandate);
+    if (result) {
+      return true;
+    }
+  };
 
   useEffect(() => {
     if (mandateIDs !== undefined) {
@@ -44,6 +92,9 @@ const TaskModal = (props) => {
                   mandateID={item}
                   userList={userList}
                   projectID={projectID}
+                  ignoreTask={onIgnoreTaskConfirm}
+                  dispatchTask={onDispatchTaskConfirm}
+                  autoHandleTask={onAutoHandleTaskConfirm}
                 />
               ),
             };
@@ -86,6 +137,9 @@ const TaskModal = (props) => {
             mandateID={mandateIDs}
             userList={userList}
             projectID={projectID}
+            ignoreTask={onIgnoreTaskConfirm}
+            dispatchTask={onDispatchTaskConfirm}
+            autoHandleTask={onAutoHandleTaskConfirm}
           />
         </>
       )}

src/pages/TaskManage/Popup/index.less

@@ -1,5 +1,5 @@
 .modalContainer {
-  padding: 0 30px;
+  padding: 0 30px 30px 30px;
 }
 
 .closeModalBtn {
@@ -18,46 +18,12 @@
   padding: 10px 0;
 }
 
-.footerConstainer {
-  display: flex;
-  flex-direction: row;
-  justify-content: flex-end;
-  .footerBtn {
-    height: 50px;
-    width: 125px;
-    font-size: 20px;
-    border: 0;
-    color: #5697e4;
-    background-color: #e5effa;
-  }
+.fontS20 {
+  font-size: 20px;
 }
 
-.footerConstainer > * {
-  margin-left: 10px;
-}
-
-.relatedOrder {
-  margin-bottom: 20px;
-  background-color: #e5effa;
-  border-radius: 8px;
-  display: flex;
-  align-items: center;
-  padding: 15px;
-  .leftInfo {
-    width: 80%;
-  }
-  .leftInfo > * {
-    padding: 5px;
-  }
-  .rightButton {
-    flex: auto;
-    color: #5697e4;
-    font-size: 24px;
-    text-align: center;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-  }
+.fontS22 {
+  font-size: 22px;
 }
 
 .fontS24 {

src/pages/TaskManage/components/MandateDetail.js

@@ -1,9 +1,11 @@
 import { queryMandate } from '@/services/SmartOps';
-import { useRequest } from '@umijs/max';
+import { connect, useRequest } from '@umijs/max';
 import {
   Button,
+  Checkbox,
   Col,
   ConfigProvider,
+  DatePicker,
   Divider,
   Form,
   Input,
@@ -15,7 +17,6 @@ import {
 } from 'antd';
 import dayjs from 'dayjs';
 import { useEffect, useState } from 'react';
-import styles from '../Popup/index.less';
 import {
   MandateClass,
   MandateStatus,
@@ -24,17 +25,38 @@ import {
   OrderType,
   ignoreReason,
 } from '../constent';
+import styles from './MandateDetail.less';
 
 import zhCN from 'antd/es/locale/zh_CN';
 
 const MandateDetail = (props) => {
-  const { projectID, mandateID, userList } = props;
+  const {
+    projectID,
+    mandateID,
+    userList,
+    ignoreTask,
+    dispatchTask,
+    autoHandleTask,
+    dispatch,
+  } = props;
+
+  useEffect(() => {
+    if (userList.length === 0) {
+      dispatch({
+        type: 'taskUser/fetchUserList',
+        payload: { project_id: projectID },
+      });
+    }
+  }, []);
+
   const [mandateDetail, setMandateDetail] = useState();
   const [mandateChild, setMandateChild] = useState([]);
   const [handledWorkOrder, setHandledWorkOrder] = useState([]);
 
   const [ignoreModalOpen, setIgnoreModalOpen] = useState(false);
   const [autoHandleModalOpen, setAutoHandleModalOpen] = useState(false);
+  const [mandateSelectModalOpen, setMandateSelectModalOpen] = useState(false);
+  const [selectedTask, setSelectedTask] = useState([]);
   const [dispatchModalOpen, setDispatchModalOpen] = useState(false);
 
   const columns = [
@@ -86,40 +108,67 @@ const MandateDetail = (props) => {
     },
   });
 
-  const onIgnoreClick = () => {
-    setIgnoreModalOpen(true);
-  };
-
-  const onDispatchClick = () => {
-    setDispatchModalOpen(true);
-  };
-
-  const onAutoHandleClick = () => {
-    setAutoHandleModalOpen(true);
-  };
-
-  const onManualHandleClick = () => {
-    console.log('manual handle click');
+  // 打开指定弹窗
+  const openSpecifiedModal = (type) => {
+    switch (type) {
+      case 'ignore':
+        setIgnoreModalOpen(true);
+        break;
+      case 'manual':
+        console.log('manual');
+        break;
+      case 'auto':
+        setAutoHandleModalOpen(true);
+        break;
+      case 'dispatch':
+        setMandateSelectModalOpen(true);
+        break;
+    }
   };
 
-  const onIgnoreConfirm = (text) => {
-    console.log(text);
-    // 调用ignore
-    setIgnoreModalOpen(false);
+  // 忽略
+  const onIgnoreConfirm = async (reason) => {
+    const result = await ignoreTask(mandateID, reason);
+    if (result) {
+      setIgnoreModalOpen(false);
+      getMandateInfo({ mandate_id: mandateID });
+    }
   };
 
-  const onAutoHandleConfirm = (text) => {
-    console.log(text);
-    setAutoHandleModalOpen(false);
+  const onAutoHandleConfirm = async (pw) => {
+    const result = await autoHandleTask(pw, mandateDetail);
+    if (result) {
+      setAutoHandleModalOpen(false);
+      getMandateInfo({ mandate_id: mandateID });
+    }
   };
 
   const onManualHandleConfirm = () => {
     console.log('manual handle Confirm');
   };
 
-  const onDispatchConfirm = () => {
-    console.log('ignore Confirm');
-    setDispatchModalOpen(false);
+  const onMandateSelected = (records) => {
+    // 打开派单Form弹窗将选中的任务进行派遣
+    if (records?.length === 0) {
+      message.warning('请先选择要派遣的任务');
+      return;
+    }
+    setSelectedTask(records);
+    setDispatchModalOpen(true);
+  };
+
+  const onDispatchConfirm = async (value) => {
+    const params = {
+      ...value,
+      m_id: Number(mandateID),
+      mc_id: selectedTask.join(),
+      plan_end_time: dayjs(value.plan_end_time).format('YYYY-MM-DD HH:mm:ss'),
+    };
+    const result = await dispatchTask(params);
+    if (result) {
+      setDispatchModalOpen(false);
+      getMandateInfo({ mandate_id: mandateID });
+    }
   };
 
   useEffect(() => {
@@ -146,7 +195,7 @@ const MandateDetail = (props) => {
             任务时间：{mandateDetail?.CreateTime || '-'}
           </Col>
           <Col className={styles.fontS24}>
-            任务类别：{mandateDetail?.MandateClass.label || '-'}
+            任务类别：{mandateDetail?.MandateClass?.label || '-'}
           </Col>
         </Row>
         <Row>
@@ -195,33 +244,42 @@ const MandateDetail = (props) => {
           <Button
             className={styles.footerBtn}
             shape="round"
-            onClick={onIgnoreClick}
+            onClick={() => {
+              openSpecifiedModal('ignore');
+            }}
           >
             忽略
           </Button>
           <Button
             className={styles.footerBtn}
             shape="round"
-            onClick={onManualHandleClick}
+            onClick={() => {
+              openSpecifiedModal('manual');
+            }}
           >
             手动处理
           </Button>
           <Button
             className={styles.footerBtn}
             shape="round"
-            onClick={onAutoHandleClick}
+            onClick={() => {
+              openSpecifiedModal('auto');
+            }}
           >
             自动处理
           </Button>
           <Button
             className={styles.footerBtn}
             shape="round"
-            onClick={onDispatchClick}
+            onClick={() => {
+              openSpecifiedModal('dispatch');
+            }}
           >
             派单
           </Button>
         </div>
       )}
+      {/* 弹窗 */}
       <ConfigProvider locale={zhCN}>
         <IgnoreTaskModal
           open={ignoreModalOpen}
@@ -233,17 +291,32 @@ const MandateDetail = (props) => {
           onCancel={() => setAutoHandleModalOpen(false)}
           onOk={onAutoHandleConfirm}
         />
-        <DispatchModa
+        <MandateSelectModal
+          open={mandateSelectModalOpen}
+          onCancel={() => setMandateSelectModalOpen(false)}
+          selectedTask={selectedTask}
+          setSelectedTask={setSelectedTask}
+          onOk={onMandateSelected}
+          list={mandateChild}
+        />
+        <DispatchTaskModal
           open={dispatchModalOpen}
-          onCancel={() => setDispatchModalOpen(false)}
-          onOk={onDispatchConfirm}
+          userList={userList}
+          onCancel={() => {
+            setDispatchModalOpen(false);
+          }}
+          onOK={onDispatchConfirm}
         />
       </ConfigProvider>
     </div>
   );
 };
 
-export default MandateDetail;
+export default connect(({ taskUser }) => {
+  return {
+    userList: taskUser.userList,
+  };
+})(MandateDetail);
 
 const IgnoreTaskModal = (params) => {
   const { open, onCancel, onOk } = params;
@@ -313,7 +386,7 @@ const IgnoreTaskModal = (params) => {
 const AutoHandleModal = (props) => {
   const { open, onCancel, onOk } = props;
 
-  const [automation, setAutomation] = useState('');
+  const [automation, setAutomation] = useState();
 
   const confirmAutoHandle = () => {
     if (automation.length) {
@@ -336,6 +409,8 @@ const AutoHandleModal = (props) => {
           <Form.Item label="口令:">
             {
               <Input
+                autoFocus
+                style={{ width: '100%' }}
                 placeholder="请输入口令"
                 onChange={(e) => {
                   setAutomation(e.target.value);
@@ -349,11 +424,139 @@ const AutoHandleModal = (props) => {
   );
 };
 
-const DispatchModa = (props) => {
-  const { open, onCancel } = props;
+const MandateSelectModal = (props) => {
+  const { open, onCancel, list, onOk, selectedTask, setSelectedTask } = props;
+
+  const [checkOptions, setCheckOptions] = useState([]);
+
+  useEffect(() => {
+    setCheckOptions(
+      list.map((mandate, index) => {
+        return {
+          label: (
+            <Row className={styles.taskCheckItem}>
+              <span
+                style={{
+                  textDecoration: `${
+                    mandate.Status === 0 ? '' : 'line-through'
+                  }`,
+                }}
+              >
+                {`${index + 1}. ${mandate.Title}为${mandate.Content}`}
+              </span>
+            </Row>
+          ),
+          value: mandate.Id,
+          disabled: mandate.Status !== 0,
+        };
+      }),
+    );
+  }, [list]);
+
+  const onDispatchClick = () => {
+    onOk(selectedTask);
+  };
+
+  const handleCheckChange = (checkedValue) => {
+    setSelectedTask(checkedValue);
+  };
+
+  return (
+    <Modal
+      title={<span className={styles.fontS24}>选择任务</span>}
+      open={open}
+      onCancel={onCancel}
+      width={'95%'}
+      destroyOnClose
+      footer={[
+        <Button key="back" onClick={onCancel}>
+          取消
+        </Button>,
+        <Button key="dispatch" type="primary" onClick={onDispatchClick}>
+          派单
+        </Button>,
+      ]}
+    >
+      <Checkbox.Group
+        className={styles.taskCheckBox}
+        options={checkOptions}
+        onChange={handleCheckChange}
+      />
+    </Modal>
+  );
+};
+
+const DispatchTaskModal = (props) => {
+  const { open, onCancel, onOK, userList } = props;
+
+  const [form] = Form.useForm();
+
+  useEffect(() => {
+    if (!open) {
+      form.resetFields();
+    }
+  }, [open]);
+
+  const handleDispatchConfirm = async () => {
+    const value = await form.validateFields().catch((err) =>
+      err.errorFields.forEach((item) => {
+        message.error(item.errors);
+      }),
+    );
+    if (!value) {
+      return;
+    }
+    onOK(value);
+  };
+
   return (
-    <Modal title="工单派遣" open={open} onCancel={onCancel}>
-      派单
+    <Modal
+      title={<span className={styles.fontS24}>派遣任务</span>}
+      onCancel={onCancel}
+      open={open}
+      destroyOnClose
+      style={{ padding: '20px 0' }}
+      onOk={handleDispatchConfirm}
+    >
+      <Form
+        form={form}
+        layout="horizontal"
+        labelCol={{ span: 6 }}
+        wrapperCol={{ span: 18 }}
+      >
+        <Form.Item
+          label="工单类型"
+          name="type"
+          rules={[{ required: true, message: '请选择工单类型' }]}
+        >
+          <Select options={OrderType} placeholder="请选择工单类型" />
+        </Form.Item>
+        <Form.Item
+          label="操作人"
+          name="operator_id"
+          rules={[{ required: true, message: '请选择操作人' }]}
+        >
+          <Select
+            options={userList.map((item) => {
+              return {
+                label: item.CName,
+                value: item.ID,
+              };
+            })}
+            placeholder="请选择操作人"
+          />
+        </Form.Item>
+        <Form.Item
+          label="计划完成时间"
+          name="plan_end_time"
+          rules={[{ required: true, message: '请选择完成时间' }]}
+        >
+          <DatePicker style={{ width: '100%' }} placeholder="请选择完成时间" />
+        </Form.Item>
+        <Form.Item label="备注" name="note">
+          <Input.TextArea placeholder="备注" />
+        </Form.Item>
+      </Form>
     </Modal>
   );
 };

src/pages/TaskManage/components/MandateDetail.less

@@ -0,0 +1,82 @@
+.modalContainer {
+  padding: 0 30px;
+}
+
+.closeModalBtn {
+  position: absolute;
+  top: 15px;
+  right: 20px;
+}
+
+.mandate > * {
+  margin-top: 15px;
+}
+
+.modalTitle {
+  font-size: 28px;
+  font-weight: 600;
+  padding: 10px 0;
+}
+
+.footerConstainer {
+  display: flex;
+  flex-direction: row;
+  justify-content: flex-end;
+  .footerBtn {
+    height: 50px;
+    width: 125px;
+    font-size: 20px;
+    border: 0;
+    color: #5697e4;
+    background-color: #e5effa;
+  }
+}
+
+.footerConstainer > * {
+  margin-left: 10px;
+}
+
+.relatedOrder {
+  margin-bottom: 20px;
+  background-color: #e5effa;
+  border-radius: 8px;
+  display: flex;
+  align-items: center;
+  padding: 15px;
+  .leftInfo {
+    width: 80%;
+  }
+  .leftInfo > * {
+    padding: 5px;
+  }
+  .rightButton {
+    flex: auto;
+    color: #5697e4;
+    font-size: 24px;
+    text-align: center;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+}
+
+.taskCheckBox {
+  padding: 10px;
+}
+
+.taskCheckItem {
+  font-size: 20px;
+  padding: 10px;
+}
+
+.fontS20 {
+  font-size: 20px;
+}
+
+.fontS22 {
+  font-size: 22px;
+}
+
+.fontS24 {
+  font-size: 24px;
+}

src/services/TaskManage.js

@@ -38,11 +38,23 @@ export async function getMandateDetail(params) {
  * @param params.pw MD5加密的口令
  * @returns {Promise<*>}
  */
-export async function setTaskAutomation(params) {
-  return request(`${baseURL}/v1/mandate/automation`, {
+export async function setTaskAutomation(params, mandate) {
+  let res = await request(`${baseURL}/v1/mandate/automation`, {
     method: 'POST',
     data: params,
   });
+  if (res.code === 200) {
+    if (mandate.MandateClass === 2) {
+      res = await SetVarValues(mandate.MandateChild[0].Payload);
+      if (res) {
+        return res;
+      } else {
+        return false;
+      }
+    }
+  } else {
+    return false;
+  }
 }
 
 /**
@@ -52,7 +64,7 @@ export async function setTaskAutomation(params) {
  * @param params.note 备注
  * @returns {Promise<*>}
  */
-export async function ignoreTask(params) {
+export async function ignoreTaskRequest(params) {
   const encodeParams = new URLSearchParams(params).toString();
   return request(`${baseURL}/v1/mandate/edit`, {
     method: 'POST',
@@ -139,3 +151,15 @@ export async function getWorkOrderFlow(params) {
   const res = await request(`/api/v1/work_order/flow?${stringify(params)}`);
   return res.data;
 }
+
+export async function SetVarValues(params) {
+  const res = await request(
+    `/api/v1/scada/set-var-values-batch`,
+    'POST',
+    params,
+  );
+  if (res) {
+    console.log('上报成功');
+  }
+  return res;
+}