A web update

spug_web/src/pages/deploy/request/Approve.js

@@ -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)

spug_web/src/pages/deploy/request/Ext1Form.js

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

spug_web/src/pages/deploy/request/Ext2Form.js

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

spug_web/src/pages/deploy/request/Table.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { Link } from 'react-router-dom';
 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 store from './store';
 import { LinkButton } from "components";
@@ -43,7 +43,19 @@ class ComTable extends React.Component {
     }
   }, {
     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: '申请人',
     dataIndex: 'created_by_user',
@@ -52,15 +64,35 @@ class ComTable extends React.Component {
     dataIndex: 'created_at'
   }, {
     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) => {

spug_web/src/pages/deploy/request/index.js

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

spug_web/src/pages/deploy/request/store.js

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