mirror of https://github.com/openspug/spug
update pipeline module
parent
3aa5e8fe66
commit
29fe6e0742
|
@ -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>
|
||||
)
|
||||
|
|
|
@ -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
|
||||
}, [])
|
||||
|
|
|
@ -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/>
|
||||
|
|
|
@ -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()
|
||||
|
|
Loading…
Reference in New Issue