A web update

This commit is contained in:
雷二猛 2019-12-22 11:31:21 +08:00
parent 138181edb1
commit d65307d751
6 changed files with 111 additions and 16 deletions

View File

@ -0,0 +1,55 @@
import React from 'react';
import { observer } from 'mobx-react';
import { Modal, Form, Input, Switch, message } from 'antd';
import http from 'libs/http';
import store from './store';
@observer
class Approve extends React.Component {
constructor(props) {
super(props);
this.state = {
loading: false,
}
}
handleSubmit = () => {
this.setState({loading: true});
const formData = this.props.form.getFieldsValue();
http.patch(`/api/deploy/request/${store.record.id}/`, formData)
.then(res => {
message.success('操作成功');
store.approveVisible = false;
store.fetchRecords()
}, () => this.setState({loading: false}))
};
render() {
const {getFieldDecorator, getFieldValue} = this.props.form;
return (
<Modal
visible
width={600}
maskClosable={false}
title="审核发布申请"
onCancel={() => store.approveVisible = false}
confirmLoading={this.state.loading}
onOk={this.handleSubmit}>
<Form labelCol={{span: 6}} wrapperCol={{span: 14}}>
<Form.Item required label="审批结果">
{getFieldDecorator('is_pass', {initialValue: true, valuePropName: "checked"})(
<Switch checkedChildren="通过" unCheckedChildren="驳回"/>
)}
</Form.Item>
<Form.Item required={getFieldValue('is_pass') === false} label={getFieldValue('is_pass') ? '审批意见' : '驳回原因'}>
{getFieldDecorator('reason')(
<Input.TextArea placeholder={getFieldValue('is_pass') ? '请输入审批意见' : '请输入驳回原因'}/>
)}
</Form.Item>
</Form>
</Modal>
)
}
}
export default Form.create()(Approve)

View File

@ -18,7 +18,7 @@ class Ext1Form extends React.Component {
extra1: lds.get(store.record, 'extra.1'), extra1: lds.get(store.record, 'extra.1'),
extra2: lds.get(store.record, 'extra.2'), extra2: lds.get(store.record, 'extra.2'),
versions: {}, versions: {},
host_ids: store.record['host_ids'].concat() host_ids: store.record['app_host_ids'].concat()
} }
} }

View File

@ -13,7 +13,7 @@ class Ext2Form extends React.Component {
this.state = { this.state = {
loading: false, loading: false,
type: null, type: null,
host_ids: store.record['host_ids'].concat() host_ids: store.record['app_host_ids'].concat()
} }
} }

View File

@ -1,7 +1,7 @@
import React from 'react'; import React from 'react';
import { Link } from 'react-router-dom'; import { Link } from 'react-router-dom';
import { observer } from 'mobx-react'; import { observer } from 'mobx-react';
import { Table, Divider, Modal, Icon, message } from 'antd'; import { Table, Divider, Modal, Icon, Popover, message } from 'antd';
import http from 'libs/http'; import http from 'libs/http';
import store from './store'; import store from './store';
import { LinkButton } from "components"; import { LinkButton } from "components";
@ -43,7 +43,19 @@ class ComTable extends React.Component {
} }
}, { }, {
title: '状态', title: '状态',
dataIndex: 'status_alias' render: info => {
if (info.status === '-1' && info.reason) {
return <Popover title="驳回原因:" content={info.reason}>
<span style={{color: '#1890ff'}}>{info['status_alias']}</span>
</Popover>
} else if (info.status === '2' && info.reason) {
return <Popover title="审核意见:" content={info.reason}>
<span style={{color: '#1890ff'}}>{info['status_alias']}</span>
</Popover>
} else {
return info['status_alias']
}
}
}, { }, {
title: '申请人', title: '申请人',
dataIndex: 'created_by_user', dataIndex: 'created_by_user',
@ -52,15 +64,35 @@ class ComTable extends React.Component {
dataIndex: 'created_at' dataIndex: 'created_at'
}, { }, {
title: '操作', title: '操作',
render: info => ( render: info => {
<span> switch (info.status) {
<Link to={`/deploy/do/${info.id}`}>发布</Link> case '-3':
<Divider type="vertical"/> case '3':
<LinkButton onClick={() => store.showForm(info)}>编辑</LinkButton> return <LinkButton onClick={() => store.showForm(info)}>回滚</LinkButton>;
<Divider type="vertical"/> case '-1':
<LinkButton onClick={() => this.handleDelete(info)}>删除</LinkButton> return <React.Fragment>
</span> <LinkButton onClick={() => store.showForm(info)}>编辑</LinkButton>
) <Divider type="vertical"/>
<LinkButton onClick={() => this.handleDelete(info)}>删除</LinkButton>
</React.Fragment>;
case '1':
return <React.Fragment>
<LinkButton onClick={() => store.showApprove(info)}>审核</LinkButton>
<Divider type="vertical"/>
<LinkButton onClick={() => store.showForm(info)}>编辑</LinkButton>
<Divider type="vertical"/>
<LinkButton onClick={() => this.handleDelete(info)}>删除</LinkButton>
</React.Fragment>
case '2':
return <React.Fragment>
<Link to={`/deploy/do/${info.id}`}>发布</Link>
<Divider type="vertical"/>
<LinkButton onClick={() => this.handleDelete(info)}>删除</LinkButton>
</React.Fragment>;
default:
return null
}
}
}]; }];
handleDelete = (text) => { handleDelete = (text) => {

View File

@ -5,6 +5,7 @@ import { SearchForm } from 'components';
import SelectApp from './SelectApp'; import SelectApp from './SelectApp';
import Ext1Form from './Ext1Form'; import Ext1Form from './Ext1Form';
import Ext2Form from './Ext2Form'; import Ext2Form from './Ext2Form';
import Approve from './Approve';
import ComTable from './Table'; import ComTable from './Table';
import store from './store'; import store from './store';
@ -26,9 +27,10 @@ export default observer(function () {
<Button type="primary" icon="plus" onClick={() => store.addVisible = true}>新建发布申请</Button> <Button type="primary" icon="plus" onClick={() => store.addVisible = true}>新建发布申请</Button>
</div> </div>
<ComTable/> <ComTable/>
{store.addVisible && <SelectApp />} {store.addVisible && <SelectApp/>}
{store.ext1Visible && <Ext1Form />} {store.ext1Visible && <Ext1Form/>}
{store.ext2Visible && <Ext2Form />} {store.ext2Visible && <Ext2Form/>}
{store.approveVisible && <Approve/>}
</Card> </Card>
) )
}) })

View File

@ -9,6 +9,7 @@ class Store {
@observable addVisible = false; @observable addVisible = false;
@observable ext1Visible = false; @observable ext1Visible = false;
@observable ext2Visible = false; @observable ext2Visible = false;
@observable approveVisible = false;
@observable f_name; @observable f_name;
@observable f_app_name; @observable f_app_name;
@ -27,6 +28,11 @@ class Store {
} else { } else {
this.ext2Visible = true this.ext2Visible = true
} }
};
showApprove = (info) => {
this.record = info;
this.approveVisible = true;
} }
} }