A web update

spug_web/src/pages/deploy/app/Ext2Setup1.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { observer } from 'mobx-react';
 import { Link } from 'react-router-dom';
-import { Switch, Col, Form, Input, Select, Button } from "antd";
+import { Switch, Col, Form, Select, Button } from "antd";
 import envStore from 'pages/config/environment/store';
 import store from './store';
 

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

@@ -28,9 +28,9 @@ class Store {
       .finally(() => this.isFetching = false)
   };
 
-  loadDeploys = (id) => {
+  loadDeploys = (app_id) => {
-    http.get('/api/app/deploy/', {params: {id}})
+    http.get('/api/app/deploy/', {params: {app_id}})
-      .then(res => this.records[id]['deploys'] = res)
+      .then(res => this.records[app_id]['deploys'] = res)
   };
 
   showForm = (info) => {

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

@@ -31,7 +31,7 @@ class Ext1Form extends React.Component {
 
   fetchVersions = () => {
     this.setState({fetching: true});
-    http.get(`/api/app/${store.record.app_id}/versions/`)
+    http.get(`/api/app/deploy/${store.record.deploy_id}/versions/`)
       .then(res => {
         this.setState({versions: res}, this._initExtra1);
       })
@@ -78,7 +78,7 @@ class Ext1Form extends React.Component {
     const {git_type, extra1, extra2} = this.state;
     const formData = this.props.form.getFieldsValue();
     formData['id'] = store.record.id;
-    formData['app_id'] = store.record.app_id;
+    formData['deploy_id'] = store.record.deploy_id;
     formData['host_ids'] = this.state.host_ids;
     formData['extra'] = [git_type, extra1, extra2];
     http.post('/api/deploy/request/', formData)

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

@@ -30,7 +30,7 @@ class Ext2Form extends React.Component {
     this.setState({loading: true});
     const formData = this.props.form.getFieldsValue();
     formData['id'] = store.record.id;
-    formData['app_id'] = store.record.app_id;
+    formData['deploy_id'] = store.record.deploy_id;
     formData['extra'] = [formData['extra']];
     formData['host_ids'] = this.state.host_ids;
     http.post('/api/deploy/request/', formData)

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

@@ -1,11 +1,10 @@
 import React from 'react';
 import { Link } from 'react-router-dom';
 import { observer } from 'mobx-react';
-import { Modal, Button, Menu, Icon } from 'antd';
+import { Modal, Button, Menu, Spin, Icon } from 'antd';
 import store from './store';
 import styles from './index.module.css';
 import envStore from 'pages/config/environment/store';
-import appStore from '../app/store';
 import lds from 'lodash';
 
 @observer
@@ -23,8 +22,8 @@ class SelectApp extends React.Component {
     } else {
       this._initEnv()
     }
-    if (appStore.records.length === 0) {
+    if (store.deploys.length === 0) {
-      appStore.fetchRecords()
+      store.loadDeploys()
     }
   }
 
@@ -34,9 +33,9 @@ class SelectApp extends React.Component {
     }
   };
 
-  handleClick = (app) => {
+  handleClick = (deploy) => {
-    store.record = {app_id: app.id, app_host_ids: app.host_ids};
+    store.record = {deploy_id: deploy.id, app_host_ids: deploy.host_ids};
-    if (app.extend === '1') {
+    if (deploy.extend === '1') {
       store.ext1Visible = true
     } else {
       store.ext2Visible = true
@@ -46,7 +45,7 @@ class SelectApp extends React.Component {
 
   render() {
     const {env_id} = this.state;
-    const records = appStore.records.filter(x => String(x.env_id) === env_id);
+    const records = store.deploys.filter(x => x.env_id === Number(env_id));
     return (
       <Modal
         visible
@@ -58,25 +57,31 @@ class SelectApp extends React.Component {
         footer={null}>
         <div className={styles.container}>
           <div className={styles.left}>
-            <Menu
+            <Spin spinning={envStore.isFetching}>
-              mode="inline"
+              <Menu
-              selectedKeys={[String(env_id)]}
+                mode="inline"
-              style={{border: 'none'}}
+                selectedKeys={[String(env_id)]}
-              onSelect={({selectedKeys}) => this.setState({env_id: selectedKeys[0]})}>
+                style={{border: 'none'}}
-              {envStore.records.map(item => <Menu.Item key={item.id}>{item.name}</Menu.Item>)}
+                onSelect={({selectedKeys}) => this.setState({env_id: selectedKeys[0]})}>
-            </Menu>
+                {envStore.records.map(item => <Menu.Item key={item.id}>{item.name}</Menu.Item>)}
+              </Menu>
+            </Spin>
           </div>
+
           <div className={styles.right}>
-            <div className={styles.title}>{lds.get(envStore.idMap, `${env_id}.name`)}</div>
+            <Spin spinning={store.isLoading}>
-            {records.map(item => (
+              <div className={styles.title}>{lds.get(envStore.idMap, `${env_id}.name`)}</div>
-              <Button key={item.id} type="primary" className={styles.appBlock} onClick={() => this.handleClick(item)}>
+              {records.map(item => (
-                <div style={{width: 135, overflow: 'hidden', textOverflow: 'ellipsis'}}>
+                <Button key={item.id} type="primary" className={styles.appBlock} onClick={() => this.handleClick(item)}>
-                  <Icon type={item.extend === '1' ? 'ordered-list' : 'build'} style={{marginRight: 10}}/>{item.name}
+                  <div style={{width: 135, overflow: 'hidden', textOverflow: 'ellipsis'}}>
-                </div>
+                    <Icon type={item.extend === '1' ? 'ordered-list' : 'build'}
-              </Button>
+                          style={{marginRight: 10}}/>{item['app_name']}
-            ))}
+                  </div>
-            {records.length === 0 &&
+                </Button>
-            <div className={styles.tips}>该环境下还没有可发布的应用哦，快去<Link to="/deploy/app">应用管理</Link>创建应用吧。</div>}
+              ))}
+              {records.length === 0 &&
+              <div className={styles.tips}>该环境下还没有可发布的应用哦，快去<Link to="/deploy/app">应用管理</Link>创建应用发布配置吧。</div>}
+            </Spin>
           </div>
         </div>
       </Modal>

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

@@ -143,7 +143,7 @@ class ComTable extends React.Component {
       title: '删除确认',
       content: `确定要删除【${info['name']}】?`,
       onOk: () => {
-        return http.delete('/api/exec/template/', {params: {id: info.id}})
+        return http.delete('/api/deploy/request/', {params: {id: info.id}})
           .then(() => {
             message.success('删除成功');
             store.fetchRecords()

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

@@ -3,8 +3,10 @@ import http from 'libs/http';
 
 class Store {
   @observable records = [];
+  @observable deploys = [];
   @observable types = [];
   @observable record = {};
+  @observable isLoading = false;
   @observable isFetching = false;
   @observable addVisible = false;
   @observable ext1Visible = false;
@@ -21,6 +23,13 @@ class Store {
       .finally(() => this.isFetching = false)
   };
 
+  loadDeploys = () => {
+    this.isLoading = true;
+    http.get('/api/app/deploy/')
+      .then(res => this.deploys = res)
+      .finally(() => this.isLoading = false)
+  };
+
   showForm = (info) => {
     this.record = info;
     if (info['app_extend'] === '1') {