|
@@ -1,102 +1,154 @@
|
|
|
-import React, { Component } from 'react'
|
|
|
-import { Modal, Input, Icon, Select, Radio, Checkbox, Button } from 'antd'
|
|
|
+import React from 'react'
|
|
|
+import { connect } from 'dva'
|
|
|
+
|
|
|
+import { Modal, Input, Icon, Select, Checkbox, Button, message } from 'antd'
|
|
|
import { FormItem } from 'wptpc-design'
|
|
|
import s from './index.less'
|
|
|
+// import { decorators } from 'handlebars'
|
|
|
+// import { thisExpression } from '@babel/types'
|
|
|
// import CheckBox from 'rc-checkbox'
|
|
|
|
|
|
-export default class JobModal extends Component {
|
|
|
+@connect(() => ({}))
|
|
|
+
|
|
|
+class JobModal extends React.PureComponent {
|
|
|
constructor (props) {
|
|
|
super(props)
|
|
|
this.state = {
|
|
|
params: {}
|
|
|
}
|
|
|
- debugger;
|
|
|
+ // debugger;
|
|
|
this.formSetting = [
|
|
|
- {
|
|
|
- label: 'JSON',
|
|
|
- formItemLayout:{
|
|
|
- labelCol: {
|
|
|
- xs: { span: 24 },
|
|
|
- sm: { span: 1 },
|
|
|
+ {
|
|
|
+ label: 'JSON',
|
|
|
+ formItemLayout: {
|
|
|
+ labelCol: {
|
|
|
+ xs: { span: 24 },
|
|
|
+ sm: { span: 1 }
|
|
|
+ },
|
|
|
+ wrapperCol: {
|
|
|
+ xs: { span: 24 },
|
|
|
+ sm: { span: 23 }
|
|
|
+ }
|
|
|
},
|
|
|
- wrapperCol: {
|
|
|
- xs: { span: 24 },
|
|
|
- sm: { span: 23 },
|
|
|
- },
|
|
|
- },
|
|
|
- render: () => {
|
|
|
- const { fieldsJson } = this.state.params
|
|
|
- return <div>
|
|
|
- <div><Icon type="plus" onClick={() => {
|
|
|
- fieldsJson.push({})
|
|
|
- this.onParamsChange('fieldsJson', fieldsJson)
|
|
|
- }}/></div>
|
|
|
- <div className={s.spanMargin}>
|
|
|
- <span>* 订阅描述</span>
|
|
|
- <span>* 查询名</span>
|
|
|
- <span>* 唯一标识</span>
|
|
|
- <span>* 返回数据字段</span>
|
|
|
- <span>* 订阅类型</span>
|
|
|
- <span>* 缓存类型-天</span>
|
|
|
- <span>* 缓存类型-小时</span>
|
|
|
- <span>* 操作</span>
|
|
|
- </div>
|
|
|
- <div>
|
|
|
- {fieldsJson.map((f, index) => <div>
|
|
|
- <Input value={f.description} onChange={(e) => {
|
|
|
- fieldsJson[index].description = e.target.value
|
|
|
- this.onParamsChange('fieldsJson', fieldsJson)
|
|
|
- }} style={{ width: 120, marginRight: 10 }}/>
|
|
|
- <Input value={f.name} onChange={(e) => {
|
|
|
- fieldsJson[index].name = e.target.value
|
|
|
- this.onParamsChange('fieldsJson', fieldsJson)
|
|
|
- }} style={{ width: 120, marginRight: 10 }}/>
|
|
|
- <Input value={f.uniqueId} onChange={(e) => {
|
|
|
- fieldsJson[index].uniqueId = e.target.value
|
|
|
- this.onParamsChange('fieldsJson', fieldsJson)
|
|
|
- }} style={{ width: 120, marginRight: 10 }}/>
|
|
|
- <Input value={f.fields} onChange={(e) => {
|
|
|
- fieldsJson[index].fields = e.target.value
|
|
|
- this.onParamsChange('fieldsJson', fieldsJson)
|
|
|
- }} style={{ width: 120, marginRight: 10 }}/>
|
|
|
- <Select value={f.type} style={{width:120, marginRight: 10}}>
|
|
|
- <Select.Option value={1}>自增</Select.Option>
|
|
|
- <Select.Option value={2}>变量增加</Select.Option>
|
|
|
- </Select>
|
|
|
- <Checkbox style={{width:120, marginRight: 10}}>按天缓存</Checkbox>
|
|
|
- <Checkbox style={{width:120, marginRight: 10}}>按小时缓存</Checkbox>
|
|
|
- <Button type="primary" onClick={this.clickSaveJob} size="small" style={{marginRight: 5}}>保存</Button>
|
|
|
- <Button type="danger" onClick={this.clickDeleteJob} size="small" onClick={this.deleteItem(index)}>删除</Button>
|
|
|
- {/* <Icon onClick={(e) => {
|
|
|
- fieldsJson.splice(index, 1)
|
|
|
- this.onParamsChange('fieldsJson', fieldsJson)
|
|
|
- }} type="close"/> */}
|
|
|
- </div>)}
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- }
|
|
|
- }]
|
|
|
- }
|
|
|
-
|
|
|
- clickSaveJob = () => {
|
|
|
- console.log('save');
|
|
|
+ render: () => {
|
|
|
+ const { fieldsJson } = this.state.params
|
|
|
+ return <div>
|
|
|
+ <div><Icon type="plus" onClick={() => {
|
|
|
+ fieldsJson.push({
|
|
|
+ type: 1,
|
|
|
+ cacheDay: 1,
|
|
|
+ cacheHour: 0
|
|
|
+ })
|
|
|
+ this.onParamsChange('fieldsJson', fieldsJson)
|
|
|
+ }}/></div>
|
|
|
+ <div className={s.spanMargin}>
|
|
|
+ <span>* 订阅描述</span>
|
|
|
+ <span>* 查询名</span>
|
|
|
+ <span>* 唯一标识</span>
|
|
|
+ <span>* 返回数据字段</span>
|
|
|
+ <span>* 订阅类型</span>
|
|
|
+ <span>* 缓存类型-天</span>
|
|
|
+ <span>* 缓存类型-小时</span>
|
|
|
+ <span>* 操作</span>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ {fieldsJson.map((f, index) => <div>
|
|
|
+ <Input value={f.description} onChange={(e) => {
|
|
|
+ fieldsJson[index].sid = f.sid
|
|
|
+ fieldsJson[index].description = e.target.value
|
|
|
+ this.onParamsChange('fieldsJson', fieldsJson)
|
|
|
+ }} style={{ width: 120, marginRight: 10 }}/>
|
|
|
+ <Input value={f.name} onChange={(e) => {
|
|
|
+ fieldsJson[index].name = e.target.value
|
|
|
+ this.onParamsChange('fieldsJson', fieldsJson)
|
|
|
+ }} style={{ width: 120, marginRight: 10 }}/>
|
|
|
+ <Input value={f.uniqueId} onChange={(e) => {
|
|
|
+ fieldsJson[index].uniqueId = e.target.value
|
|
|
+ this.onParamsChange('fieldsJson', fieldsJson)
|
|
|
+ }} style={{ width: 120, marginRight: 10 }}/>
|
|
|
+ <Input value={f.fields} onChange={(e) => {
|
|
|
+ fieldsJson[index].fields = e.target.value
|
|
|
+ this.onParamsChange('fieldsJson', fieldsJson)
|
|
|
+ }} style={{ width: 120, marginRight: 10 }}/>
|
|
|
+ <Select value={f.type} onChange = {value => {
|
|
|
+ fieldsJson[index].type = value
|
|
|
+ this.onParamsChange('fieldsJson', fieldsJson)
|
|
|
+ }} style={{ width: 120, marginRight: 10 }}>
|
|
|
+ <Select.Option value={1}>自增</Select.Option>
|
|
|
+ <Select.Option value={2}>变量增加</Select.Option>
|
|
|
+ </Select>
|
|
|
+ <Checkbox checked={fieldsJson[index].cacheDay === 1} onChange={(e) => {
|
|
|
+ fieldsJson[index].cacheDay = e.target.checked
|
|
|
+ this.onParamsChange('fieldsJson', fieldsJson)
|
|
|
+ }} style={{ width: 120, marginRight: 10 }}>按天缓存</Checkbox>
|
|
|
+ <Checkbox checked={fieldsJson[index].cacheHour === 1} onChange={(e) => {
|
|
|
+ fieldsJson[index].cacheHour = e.target.checked
|
|
|
+ this.onParamsChange('fieldsJson', fieldsJson)
|
|
|
+ }} style={{ width: 120, marginRight: 10 }}>按小时缓存</Checkbox>
|
|
|
+ <Button type="primary" size="small" onClick={this.clickSaveJob(index)} style={{ marginRight: 5 }}>保存</Button>
|
|
|
+ <Button type="danger" size="small" onClick={this.clickDeleteJob(index)}>删除</Button>
|
|
|
|
|
|
+ </div>)}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ }
|
|
|
+ }]
|
|
|
}
|
|
|
|
|
|
- deleteItem = (index) => () => {
|
|
|
- const { params } = this.state;
|
|
|
- const { fieldsJson } = params;
|
|
|
- fieldsJson.splice(index, 1);
|
|
|
- this.setState({
|
|
|
- params:{
|
|
|
- ...params,
|
|
|
- fieldsJson,
|
|
|
+ clickSaveJob = (index) => () => {
|
|
|
+ const { params } = this.state
|
|
|
+ const { fieldsJson } = params
|
|
|
+ const type = 'template/_editSubJobItem'
|
|
|
+ console.log(params)
|
|
|
+ fieldsJson[index].sid = params.id
|
|
|
+ this.props.dispatch({
|
|
|
+ type,
|
|
|
+ payload: fieldsJson[index],
|
|
|
+ callback: res => {
|
|
|
+ const { code, data } = res || {}
|
|
|
+ if (code === 0) {
|
|
|
+ const msg = params.id ? '编辑成功' : '添加成功'
|
|
|
+ console.log(data)
|
|
|
+ fieldsJson[index].id = data
|
|
|
+ message.success(msg)
|
|
|
+ params.fieldsJson = fieldsJson
|
|
|
+ this.setState({
|
|
|
+ showModal: false,
|
|
|
+ params: {
|
|
|
+ ...params,
|
|
|
+ fieldsJson
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.refresh()
|
|
|
+ }
|
|
|
}
|
|
|
- });
|
|
|
+ })
|
|
|
}
|
|
|
|
|
|
- clickDeleteJob = () => {
|
|
|
- console.log('delete')
|
|
|
+ clickDeleteJob = (index) => () => {
|
|
|
+ const { params } = this.state
|
|
|
+ const { fieldsJson } = params
|
|
|
+ const type = 'template/_deleteSubJobItem'
|
|
|
+ console.log(index)
|
|
|
+ this.props.dispatch({
|
|
|
+ type,
|
|
|
+ payload: { id: fieldsJson[index].id },
|
|
|
+ callback: res => {
|
|
|
+ const { code } = res || {}
|
|
|
+ if (code === 0) {
|
|
|
+ const msg = '删除成功'
|
|
|
+ message.success(msg)
|
|
|
+ fieldsJson.splice(index, 1)
|
|
|
+ this.setState({
|
|
|
+ params: {
|
|
|
+ ...params,
|
|
|
+ fieldsJson
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.refresh()
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
}
|
|
|
|
|
|
// 组件挂在的时候调用的生命周期函数
|
|
@@ -117,8 +169,14 @@ export default class JobModal extends Component {
|
|
|
this.setState({ params })
|
|
|
}
|
|
|
|
|
|
+ onJobCancel = () => {
|
|
|
+ const { onCancel } = this.props
|
|
|
+ const isEdit = true
|
|
|
+ if (onCancel) onCancel(isEdit)
|
|
|
+ }
|
|
|
+
|
|
|
render () {
|
|
|
- const { showModal, onCancel, loading } = this.props
|
|
|
+ const { showModal, loading } = this.props
|
|
|
const { params } = this.state
|
|
|
|
|
|
return (
|
|
@@ -126,7 +184,7 @@ export default class JobModal extends Component {
|
|
|
title={'创建'}
|
|
|
visible={showModal}
|
|
|
onOk={this.onOk}
|
|
|
- onCancel={onCancel}
|
|
|
+ onCancel={this.onJobCancel}
|
|
|
// 确认按钮点击后,发起接口会处罚loading值的变化,从而控制确认按钮的状态(disable or enable)
|
|
|
okButtonProps={{ disabled: loading }}
|
|
|
width={1200}
|
|
@@ -136,3 +194,5 @@ export default class JobModal extends Component {
|
|
|
)
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+export default JobModal
|