|
@@ -1,182 +0,0 @@
|
|
|
-import React from 'react'
|
|
|
-import { Form, Input, Row, Col, Switch, Button, Modal, message } from 'antd'
|
|
|
-import { connect } from 'dva'
|
|
|
-import AceEditor from 'react-ace'
|
|
|
-import { detail, test, update } from '../service'
|
|
|
-import { isJSON } from '@/utils/utils'
|
|
|
-
|
|
|
-import 'ace-builds/src-noconflict/mode-java'
|
|
|
-import 'ace-builds/src-noconflict/theme-monokai'
|
|
|
-
|
|
|
-const formItemLayout = {
|
|
|
- layout: 'vertical'
|
|
|
-}
|
|
|
-
|
|
|
-@connect(({ user }) => ({
|
|
|
- currentUser: user.currentUser
|
|
|
-}))
|
|
|
-@Form.create()
|
|
|
-class Add extends React.PureComponent {
|
|
|
- state = {
|
|
|
- content: '',
|
|
|
- showTest: false, // 是否展示测试内容
|
|
|
- testContent: '', // 测试数据
|
|
|
- testResult: '' // 测试结果
|
|
|
- }
|
|
|
-
|
|
|
- componentDidMount () {
|
|
|
- detail({
|
|
|
- name: this.props.match.params.name
|
|
|
- }).then(res => {
|
|
|
- if (res.code === 0) {
|
|
|
- this.setState({ ...res.data })
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
-
|
|
|
- create = () => {
|
|
|
- this.props.form.validateFields((err, values) => {
|
|
|
- if (!err) {
|
|
|
- update({
|
|
|
- ...values,
|
|
|
- content: this.state.content,
|
|
|
- createUser: this.state.createUser || this.props.currentUser.name, // 创建人
|
|
|
- updateUser: this.props.currentUser.name // 最后修改人
|
|
|
- }).then(res => {
|
|
|
- if (res.code === 0) {
|
|
|
- this.setState({ ...values })
|
|
|
- Modal.success({
|
|
|
- title: '提交成功',
|
|
|
- content: '流程代码编译正常,点击“测试按钮”可以继续测试流程逻辑'
|
|
|
- })
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
-
|
|
|
- test =(id) => {
|
|
|
- if (!this.state.name) {
|
|
|
- message.warn('请先填写流程名称!')
|
|
|
- return false
|
|
|
- }
|
|
|
- if (!isJSON(this.state.testContent)) {
|
|
|
- message.warn('输入数据格式错误!')
|
|
|
- return false
|
|
|
- }
|
|
|
- test({
|
|
|
- name: this.state.name,
|
|
|
- input: JSON.parse(this.state.testContent)
|
|
|
- }).then(res => {
|
|
|
- if (res.code === 0) {
|
|
|
- console.log(res)
|
|
|
- this.setState({ testResult: JSON.stringify(res) })
|
|
|
- }
|
|
|
- })
|
|
|
- }
|
|
|
-
|
|
|
- render () {
|
|
|
- const { getFieldDecorator } = this.props.form
|
|
|
- const { name, description, enabled, content } = this.state
|
|
|
- return (
|
|
|
- <div>
|
|
|
- <h1>编辑流程</h1>
|
|
|
- <Row>
|
|
|
- <Col span={12}>
|
|
|
- <Form {...formItemLayout}>
|
|
|
- <Form.Item label="流程名称">
|
|
|
- {getFieldDecorator('name', {
|
|
|
- initialValue: name
|
|
|
- })(<Input placeholder="全英文或英文带下划线" />)}
|
|
|
- </Form.Item>
|
|
|
- <Form.Item label="流程描述">
|
|
|
- {getFieldDecorator('description', {
|
|
|
- initialValue: description
|
|
|
- })(<Input.TextArea placeholder="多行输入" />)}
|
|
|
- </Form.Item>
|
|
|
- <Form.Item label="是否启用">
|
|
|
- {getFieldDecorator('enabled', {
|
|
|
- initialValue: enabled
|
|
|
- })(<Switch checked={enabled} onChange={checked => this.setState({ enabled: checked })} />)}
|
|
|
- </Form.Item>
|
|
|
- <Form.Item label="流程逻辑开发">
|
|
|
-
|
|
|
- <AceEditor
|
|
|
- style={{ width: this.state.showTest ? '100%' : '200%' }}
|
|
|
- mode="java"
|
|
|
- theme="monokai"
|
|
|
- name="content"
|
|
|
- onChange={(value) => this.setState({ content: value })}
|
|
|
- fontSize={14}
|
|
|
- showPrintMargin={true}
|
|
|
- showGutter={true}
|
|
|
- highlightActiveLine={true}
|
|
|
- value={content}
|
|
|
- setOptions={{
|
|
|
- enableBasicAutocompletion: true,
|
|
|
- enableLiveAutocompletion: true,
|
|
|
- enableSnippets: true,
|
|
|
- showLineNumbers: true,
|
|
|
- tabSize: 2
|
|
|
- }}
|
|
|
- />
|
|
|
- </Form.Item>
|
|
|
- <Form.Item>
|
|
|
- <Button type="primary" onClick={this.create}>提交</Button> 
|
|
|
- <Button onClick={() => this.setState({ showTest: true })}>测试</Button>
|
|
|
- </Form.Item>
|
|
|
- </Form>
|
|
|
- </Col>
|
|
|
- <Col span={12}>
|
|
|
- <div style={{ paddingLeft: '20px', display: this.state.showTest ? 'block' : 'none' }}>
|
|
|
- <Form.Item label="输入数据">
|
|
|
- <AceEditor
|
|
|
- mode="json"
|
|
|
- theme="monokai"
|
|
|
- onChange={(value) => this.setState({ testContent: value })}
|
|
|
- fontSize={14}
|
|
|
- showPrintMargin={true}
|
|
|
- showGutter={true}
|
|
|
- highlightActiveLine={true}
|
|
|
- value={this.state.testContent}
|
|
|
- height="300px"
|
|
|
- setOptions={{
|
|
|
- enableBasicAutocompletion: true,
|
|
|
- enableLiveAutocompletion: true,
|
|
|
- enableSnippets: true,
|
|
|
- showLineNumbers: true,
|
|
|
- tabSize: 2
|
|
|
- }}
|
|
|
- />
|
|
|
- </Form.Item>
|
|
|
-
|
|
|
- <Button type="primary" onClick={this.test}>执行测试</Button> 
|
|
|
- <Form.Item label="输出结果">
|
|
|
- <AceEditor
|
|
|
- mode="json"
|
|
|
- theme="monokai"
|
|
|
- fontSize={14}
|
|
|
- showPrintMargin={true}
|
|
|
- showGutter={true}
|
|
|
- highlightActiveLine={true}
|
|
|
- value={this.state.testResult}
|
|
|
- setOptions={{
|
|
|
- enableBasicAutocompletion: true,
|
|
|
- enableLiveAutocompletion: true,
|
|
|
- enableSnippets: true,
|
|
|
- showLineNumbers: true,
|
|
|
- tabSize: 2
|
|
|
- }}
|
|
|
- />
|
|
|
- </Form.Item>
|
|
|
- </div>
|
|
|
-
|
|
|
- </Col>
|
|
|
- </Row>
|
|
|
-
|
|
|
- </div>
|
|
|
- )
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-export default Add
|