update pipeline module

spug_web/src/pages/pipeline/console/Ask.js

@@ -5,32 +5,51 @@
  */
 import React, { useState } from 'react';
 import { observer } from 'mobx-react';
-import { Button, Form, Upload } from 'antd';
-import { ArrowRightOutlined, UploadOutlined } from '@ant-design/icons';
+import { Button, Form, Upload, message } from 'antd';
+import { ThunderboltOutlined, UploadOutlined } from '@ant-design/icons';
 import Parameter from '../modules/Parameter';
 import { http, X_TOKEN } from 'libs';
 import S from './store';
+import lds from 'lodash';
 
 function Ask(props) {
   const [form] = Form.useForm();
   const [loading, setLoading] = useState(false);
 
   function handleOk() {
-    const params = form.getFieldsValue();
+    const data = form.getFieldsValue();
+    const params = {};
+    for (let item of S.dynamicParams) {
+      if (item.required && lds.isEmpty(data[item.variable])) {
+        message.error(`请设置参数 ${item.name}`);
+        return
+      }
+      if (item.type !== 'upload') params[item.variable] = data[item.variable]
+    }
     setLoading(true)
-    http.patch('/api/pipeline/do/', {id: 1, token: S.token, params})
+    http.patch('/api/pipeline/do/', {id: S.record.id, token: S.token, params})
       .then(res => {
         S.dynamicParams = null
-      })
-      .finally(() => setLoading(false))
+      }, () => setLoading(false))
+  }
+
+  function beforeUpload(file, size) {
+    if (size) {
+      const fileSize = file.size / 1024 / 1024;
+      if (fileSize > size) {
+        message.error(`上传文件大小不能超过 ${size}MB`);
+        return Upload.LIST_IGNORE;
+      }
+    }
   }
 
   return (
     <Form form={form} labelCol={{span: 6}} wrapperCol={{span: 16}}>
       {(S.dynamicParams ?? []).map((item, idx) => item.type === 'upload' ? (
-        <Form.Item key={idx} required label={item.name}>
-          <Upload multiple action="/api/pipeline/upload/" headers={{'X-Token': X_TOKEN}}
-                  data={{token: S.token, id: item.id}}>
+        <Form.Item key={idx} required name={item.variable} label={item.name} valuePropName="fileList"
+                   getValueFromEvent={e => Array.isArray(e) ? e : e?.fileList}>
+          <Upload multiple accept={item.accept} action="/api/pipeline/upload/" headers={{'X-Token': X_TOKEN}}
+                  data={{token: S.token, id: item.variable}} beforeUpload={file => beforeUpload(file, item.size)}>
             <Button icon={<UploadOutlined/>}>点击上传</Button>
           </Upload>
         </Form.Item>
@@ -40,7 +59,7 @@ function Ask(props) {
         </Form.Item>
       ))}
       <Form.Item wrapperCol={{offset: 6, span: 16}}>
-        <Button icon={<ArrowRightOutlined/>} loading={loading} type="primary" onClick={handleOk}>下一步</Button>
+        <Button icon={<ThunderboltOutlined/>} loading={loading} type="primary" onClick={handleOk}>开始执行</Button>
       </Form.Item>
     </Form>
   )

spug_web/src/pages/pipeline/console/Body.js

@@ -78,7 +78,6 @@ function Body() {
       }
     }
     socket.onerror = () => setWSState('2')
-    socket.onclose = () => setWSState('2')
     return () => socket && socket.close()
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [])

spug_web/src/pages/pipeline/console/index.js

@@ -14,20 +14,18 @@ import css from './index.module.less';
 
 function Index() {
   function handleClose() {
-    S.open = false
-    S.dynamicParams = null
+    S.record = null
   }
 
   return (
     <Modal
-      open={S.open}
+      open={S.record}
       width={S.dynamicParams ? '540px' : '80%'}
       title={S.dynamicParams ? '执行参数设置' : '执行控制台'}
       footer={null}
       destroyOnClose
       maskClosable={false}
       wrapClassName={css.fade}
-      afterClose={S.initial}
       onCancel={handleClose}>
       {S.dynamicParams ? (
         <Ask/>

spug_web/src/pages/pipeline/console/store.js

@@ -9,7 +9,7 @@ import { transfer } from '../utils';
 class Store {
   host_id = null;
   @observable token = null;
-  @observable open = false;
+  @observable record = null;
   @observable node = {};
   @observable nodes = [];
   @observable outputs = {};
@@ -22,12 +22,6 @@ class Store {
   @computed get matrixNodes() {
     return transfer(this.nodes)
   }
-
-  initial = () => {
-    this.node = {}
-    this.nodes = []
-    this.outputs = {}
-  }
 }
 
 export default new Store()