提交一些小修改

src/components/common/deploy/Deploy.jsx

@@ -15,32 +15,17 @@ class Deploy extends Component {
       currentConfig: '',
       configs: [
         {
-          name: 'Tenc and Mongo',
+          name: 'I am config 1',
           cloudServer: 'tencent',
           database: 'mongodb',
-          configLocal: {
-            SCF_secretID: 'scfscfscfididididiid',
-            SCF_secretKey: 'i_am_a_key',
-            API_secretID: 'apiapiapiididididiid',
-            API_secretKey: 'apiapipaikeykeykey'
-          }
         },
         {
-          name: 'Ali but nedb',
-          cloudServer: 'Aliyun',
-          database: 'nedb',
-          configLocal: {
-            SCF_secretID: 'sididid34idiid',
-            SCF_secretKey: 'scfkeyk243weeykkeykey',
-            API_secretID: 'iidididdapi3eapiapidiid',
-            API_secretKey: 'apiapipav_ikeykeykey'
-          }
+          name: "I'm config 2",
+          cloudServer: 'tencent',
+          database: 'mongodb',
         }
       ]
     };
-    if (this.state.configs.length !== 0) {
-      this.state.currentConfig = this.state.configs[0].name
-    }
   }
 
   switchConfig = (name) => {
@@ -51,42 +36,6 @@ class Deploy extends Component {
     }
   };
 
-  addConfig = (content, name) => {
-    if (content === 'new') {
-      this.setState({
-        configs: [...this.state.configs, {
-          name,
-          schemas: [],
-          cloudServer: '',
-          database: '',
-          configLocal: {}
-        }]
-      })
-    } else {
-      let configs = this.state.configs;
-      configs.splice(this.state.configs.findIndex(obj => obj.name === name), 1, content);
-      this.setState({
-        configs
-      })
-    }
-  };
-
-  deleteConfig = (name) => {
-    let configs = this.state.configs;
-    configs.splice(this.state.configs.findIndex(obj => obj.name === name), 1);
-    this.setState({
-      configs
-    });
-    if (this.state.configs.length !== 0) {
-      this.setState({
-        currentConfig: this.state.configs[0].name
-      });
-    } else {
-      this.setState({
-        currentConfig: ''
-      });
-    }
-  };
 
   render() {
     return (
@@ -118,7 +67,7 @@ class Deploy extends Component {
           </Col>
           <Col span={17} offset={1}>
             <TencentConfig addConfig={this.addConfig} deleteConfig={this.deleteConfig} currentConfig={this.state.currentConfig}
-                  configs={this.state.configs}/>
+                  config={this.state.configs[0]}/>
           </Col>
         </Row>
       </div>

src/components/common/deploy/index.css

@@ -34,6 +34,6 @@ p.show {
 }
 
 .vice-title {
-    width: 80px;
+    width: 120px;
     display: inline-block;
 }

src/components/common/deploy/tencent/TencentConfig.jsx

@@ -5,146 +5,110 @@ import {Input, Select, Button, Row, Col} from 'antd';
 const Option = Select.Option;
 
 class TencentConfig extends Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      config: props.configs.find(obj => obj.name === props.currentConfig) || {
-        name: '',
-        schemas: [],
-        cloudServer: '',
-        database: '',
-        configLocal: {}
-      }
+    constructor(props) {
+        super(props);
+        this.state = {
+            configs: ['region', 'bucket-name', 'cos-name', 'fn-name', 'vpc-id', 'subnet-id', 'handler', 'description', 'memory-size', 'timeout'],
+            name: props.config.name,
+            cloudServer: props.config.cloudServer,
+            database: props.config.database,
+        };
+    }
+
+    switchCS = (value) => {
+        this.setState({
+            cloudServer: value
+        })
     };
-  }
-
-  switchCS = (value) => {
-    this.setState({
-      config: {
-        ...this.state.config,
-        cloudServer: value
-      }
-    })
-  };
-
-  switchConfigLocal = (label) => {
-    return (e) => {
-      this.setState({
-        config: {
-          ...this.state.config,
-          configLocal: {...this.state.config.configLocal, [label]: e.target.value}
-        }
-      })
+
+    switchConfig = (label) => {
+        return (e) => {
+            this.setState({
+                [label]: e.target.value
+            })
+        };
     };
-  };
-
-  switchDataBase = (value) => {
-    this.setState({
-      config: {
-        ...this.state.config,
-        database: value
-      }
-    })
-  };
-
-  componentWillReceiveProps(next) {
-    this.setState({
-      config: next.configs.find(obj => obj.name === next.currentConfig) || {
-        name: '',
-        schemas: [],
-        cloudServer: '',
-        database: '',
-        configLocal: {}
-      }
-    });
-  };
-
-  render() {
-    return (
-      <div style={{margin: 20}}>
-        <div style={{marginTop: 10}}>
-          {
-            this.state.config.name ? '' :
-              <div style={{marginBottom: 30}}>
-                <p><b>how about create a new one</b></p>
-              </div>
-          }
-        </div>
-
-
-        <div>
-          <span className='table-title'> Cloud Config</span>
-
-          <div style={{marginBottom: 10}}>
-            <p><b>Cloud Server providers</b></p>
-            <Select defaultValue="tencent" value={this.state.config.cloudServer} style={{width: 120}}
-                    onChange={this.switchCS}>
-              <Option value="tencent">Tencent</Option>
-              <Option value="aliyun">Aliyun</Option>
-              <Option value="huawei">Huawei</Option>
-            </Select>
-          </div>
-
-
-          <Row>
-            <Col span={6}>
-              <div style={{marginBottom: 30}}>
-                <p><b>Serverless Cloud Function</b></p>
-                <div>
-                  <div>
-                    <span className='vice-title'>secretID: </span>
-                    <Input value={this.state.config.configLocal.SCF_secretID} style={{width: 200}}
-                           onChange={this.switchConfigLocal('SCF_secretID')}/>
-                  </div>
-                  <div style={{marginTop: 5}}>
-                    <span className='vice-title'>secretKey: </span>
-                    <Input value={this.state.config.configLocal.SCF_secretKey} style={{width: 200}}
-                           onChange={this.switchConfigLocal('SCF_secretKey')}/>
-                  </div>
+
+    switchDataBase = (value) => {
+        this.setState({
+            database: value
+        })
+    };
+
+    componentWillReceiveProps(next) {
+        this.setState({
+            name: next.config.name,
+            cloudServer: next.config.cloudServer,
+            database: next.config.database
+        });
+    };
+
+    render() {
+        return (
+            <div style={{margin: 20}}>
+                <div style={{marginTop: 10}}>
+                    {
+                        this.state.name ? '' :
+                            <div style={{marginBottom: 30}}>
+                                <p><b>how about choose or create a new one</b></p>
+                            </div>
+                    }
+                </div>
+
+
+                <div style={{marginBottom: 20}}>
+                    <span className='table-title'> Name</span>
+                    <Input value={this.state.name} style={{width: 200}}
+                           onChange={this.switchConfig('name')}/>
+                </div>
+
+                <div style={{marginBottom: 30}}>
+                    <span className='table-title'> Database Config</span>
+                    <Select defaultValue="mongodb" value={this.state.database} style={{width: 120}}
+                            onChange={this.switchDataBase}>
+                        <Option value="mongodb">MongoDB</Option>
+                        <Option disabled value="mySQL">nedb</Option>
+                        <Option disabled value="postgres">postgres</Option>
+                    </Select>
                 </div>
-              </div>
-            </Col>
 
-            <Col span={6}>
-              <div style={{marginBottom: 30}}>
-                <p><b>API</b></p>
+
                 <div>
-                  <div>
-                    <span className='vice-title'>secretID: </span>
-                    <Input value={this.state.config.configLocal.API_secretID} style={{width: 200}}
-                           onChange={this.switchConfigLocal('API_secretID')}/>
-                  </div>
-                  <div style={{marginTop: 5}}>
-                    <span className='vice-title'>secretKey: </span>
-                    <Input value={this.state.config.configLocal.API_secretKey} style={{width: 200}}
-                           onChange={this.switchConfigLocal('API_secretKey')}/>
-                  </div>
+                    <span className='table-title'> Cloud Config</span>
+
+                    <div style={{marginBottom: 20}}>
+                        <p><b>Cloud Server providers</b></p>
+                        <Select defaultValue="tencent" value={this.state.cloudServer} style={{width: 120}}
+                                onChange={this.switchCS}>
+                            <Option value="tencent">Tencent</Option>
+                            <Option disabled value="aliyun">Aliyun</Option>
+                            <Option disabled value="huawei">Huawei</Option>
+                        </Select>
+                    </div>
+
+                    <p><b>Other configs</b></p>
+                    {
+                        this.state.configs.map(config => (
+                            <div key={config} style={{marginBottom: 10}}>
+                                <span className='vice-title'>{config}: </span>
+                                <Input value={this.state[config]} style={{width: 200}}
+                                       onChange={this.switchConfig(config)}/>
+                            </div>
+                        ))
+                    }
+
                 </div>
-              </div>
-            </Col>
-          </Row>
-
-        </div>
-
-        <div style={{marginBottom: 30}}>
-          <span className='table-title'> Database Config</span>
-          <Select defaultValue="mongodb" value={this.state.config.database} style={{width: 120}}
-                  onChange={this.switchDataBase}>
-            <Option value="mongodb">MongoDB</Option>
-            <Option value="nedb">nedb</Option>
-            <Option value="postgres">postgres</Option>
-          </Select>
-        </div>
-
-        <Button type="primary" onClick={() => {
-          this.props.addConfig(this.state.config, this.state.config.name);
-        }}>SUBMIT</Button>
-        <Button style={{marginLeft: 10}} type="danger" onClick={() => {
-          this.props.deleteConfig(this.state.config.name);
-        }}>DELETE</Button>
-      </div>
-    )
-  }
+
+
+                <Button type="primary" onClick={() => {
+                    this.props.addConfig(this.state.config, this.state.config.name);
+                }}>SUBMIT</Button>
+                <Button style={{marginLeft: 10}} type="danger" onClick={() => {
+                    this.props.deleteConfig(this.state.config.name);
+                }}>DELETE</Button>
+            </div>
+        )
+    }
 }
 
 export default TencentConfig;