Merge branch 'dev' of gitlab.corp.qunar.com:mfe/yapi into dev

client/components/UsernameAutoComplete/UsernameAutoComplete.js

@@ -40,7 +40,8 @@ class UsernameAutoComplete extends Component {
     this.state = {
       dataSource: [],
       uid: 0,
-      username: ''
+      username: '',
+      changeName: ''
     }
   }
 
@@ -48,39 +49,63 @@ class UsernameAutoComplete extends Component {
     callbackState: PropTypes.func
   }
 
+  // 改变本组件 state，并回调给父组件
+  changeState = (uid, username) => {
+    // 设置本组件 state
+    this.setState({ uid, username });
+    // 回调 将当前选中的uid和username回调给父组件
+    this.props.callbackState({ uid, username });
+  }
+
+  // 输入框中的值改变时
+  onChange = (userName) => {
+    this.setState({
+      changeName: userName
+    });
+  }
+
+  // 选中候选词时
   onSelect = (userName) => {
     this.state.dataSource.forEach((item) => {
       if (item.username === userName) {
-        // 设置本组件 state
-        this.setState({
-          uid: item.id,
-          username: item.username
-        });
-        // 回调 将当前选中的uid和username回调给父组件
-        this.props.callbackState({
-          uid: item.id,
-          username: item.username
-        })
+        this.changeState(item.id, item.username);
       }
     });
   }
 
+  // 搜索回调
   handleSearch = (value) => {
     const params = { q: value}
     axios.get('/api/user/search', { params })
       .then(data => {
-        const userList = []
-        data = data.data.data
+        const userList = [];
+        data = data.data.data;
+
         if (data) {
           data.forEach( v => userList.push({
             username: v.username,
             id: v.uid
           }));
+          // 取回搜索值后，设置 dataSource
           this.setState({
             dataSource: userList
-          })
+          });
+          if (userList.length) {
+            userList.forEach((item) => {
+              if (item.username === this.state.changeName) {
+                // 每次取回搜索值后，没选择时默认选择第一位
+                this.changeState(userList[0].id, userList[0].username);
+              } else {
+                // 有候选词但没有对应输入框中的字符串，此时应清空候选 uid 和 username
+                this.changeState(-1, '');
+              }
+            });
+          } else {
+            // 如果没有搜索结果，则清空候选 uid 和 username
+            this.changeState(-1, '');
+          }
         }
-      })
+      });
   }
 
   render () {
@@ -88,6 +113,7 @@ class UsernameAutoComplete extends Component {
       <AutoComplete
         dataSource={this.state.dataSource.map(i => i.username)}
         style={{ width: '100%' }}
+        onChange={this.onChange}
         onSelect={this.onSelect}
         onSearch={this.handleSearch}
         placeholder="请输入用户名"

client/containers/Project/Interface/InterfaceList/InterfaceEditForm.js

@@ -6,7 +6,7 @@ import { handlePath } from '../../../../common.js'
 
 import {
   Form, Select, Input, Tooltip,
-  Button, Row, Col, Radio, Icon
+  Button, Row, Col, Radio, Icon, AutoComplete
 } from 'antd';
 
 const FormItem = Form.Item;
@@ -23,6 +23,7 @@ const dataTpl = {
 const mockEditor = require('./mockEditor.js');
 const HTTP_METHOD = constants.HTTP_METHOD;
 const HTTP_METHOD_KEYS = Object.keys(HTTP_METHOD);
+const HTTP_REQUEST_HEADER = constants.HTTP_REQUEST_HEADER;
 
 class InterfaceEditForm extends Component {
   static propTypes = {
@@ -85,8 +86,8 @@ class InterfaceEditForm extends Component {
   handleSubmit = (e) => {
     e.preventDefault();
     this.props.form.validateFields((err, values) => {
-      if (!err) {        
-        if (values.res_body_type === 'json') values.res_body = this.state.res_body;        
+      if (!err) {
+        if (values.res_body_type === 'json') values.res_body = this.state.res_body;
         values.method = this.state.method;
         let isfile = false, isHavaContentType = false;
         if (values.req_body_type === 'form') {
@@ -206,6 +207,10 @@ class InterfaceEditForm extends Component {
     }
   }
 
+  onSelect = (name) => {
+    console.log(name);
+  }
+
   render() {
     const { getFieldDecorator } = this.props.form;
     const formItemLayout = {
@@ -248,11 +253,15 @@ class InterfaceEditForm extends Component {
 
     const headerTpl = (data, index) => {
       return <Row key={index} className="interface-edit-item-content">
-        <Col span="4">
+        <Col span="6">
           {getFieldDecorator('req_headers[' + index + '].name', {
             initialValue: data.name
           })(
-            <Input placeholder="参数名称" />
+            <AutoComplete
+              dataSource={HTTP_REQUEST_HEADER}
+              filterOption={(inputValue, option) => option.props.children.toUpperCase().indexOf(inputValue.toUpperCase()) !== -1}
+              placeholder="参数名称"
+            />
             )}
         </Col>
         <Col span="6" >
@@ -612,4 +621,4 @@ class InterfaceEditForm extends Component {
   }
 }
 
-export default Form.create()(InterfaceEditForm);
+export default Form.create()(InterfaceEditForm);

index.html

@@ -1,55 +0,0 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <meta charset="utf-8">
-    <title></title>
-    <style media="screen">
-    .test {
-        width: 400px;
-        position: relative;
-        min-height: 240px;
-        background-color: #2395f1;
-        overflow: hidden;
-    }
-    .test:before, .test:after {
-        content: "";
-        position: absolute;
-        left: 50%;
-        min-width: 800px;
-        min-height: 800px;
-        background-color: #fff;
-        animation-name: rotate;
-        animation-iteration-count: infinite;
-        animation-timing-function: linear;
-    }
-    .test:before {
-        bottom: 180px;
-        border-radius: 45%;
-        animation-duration: 10s;
-    }
-    .test:after {
-        top: 180px;
-        opacity: .5;
-        border-radius: 47%;
-        animation-duration: 10s;
-    }
-
-    @keyframes rotate {
-        0% {
-        transform: translate(-50%, 0) rotateZ(0deg);
-        }
-        50% {
-        transform: translate(-50%, -2%) rotateZ(180deg);
-        }
-        100% {
-        transform: translate(-50%, 0%) rotateZ(360deg);
-        }
-    }
-    </style>
-  </head>
-  <body>
-    <div class="test">
-
-    </div>
-  </body>
-</html>

server_dist/controllers/interface.js

@@ -114,7 +114,7 @@ var interfaceController = function (_baseController) {
     (0, _createClass3.default)(interfaceController, [{
         key: 'add',
         value: function () {
-            var _ref = (0, _asyncToGenerator3.default)(_regenerator2.default.mark(function _callee(ctx) {
+            var _ref = (0, _asyncToGenerator3.default)( /*#__PURE__*/_regenerator2.default.mark(function _callee(ctx) {
                 var _this2 = this;
 
                 var params, auth, checkRepeat, data, paths, name, i, result;
@@ -300,7 +300,7 @@ var interfaceController = function (_baseController) {
     }, {
         key: 'get',
         value: function () {
-            var _ref2 = (0, _asyncToGenerator3.default)(_regenerator2.default.mark(function _callee2(ctx) {
+            var _ref2 = (0, _asyncToGenerator3.default)( /*#__PURE__*/_regenerator2.default.mark(function _callee2(ctx) {
                 var params, result;
                 return _regenerator2.default.wrap(function _callee2$(_context2) {
                     while (1) {
@@ -362,7 +362,7 @@ var interfaceController = function (_baseController) {
     }, {
         key: 'list',
         value: function () {
-            var _ref3 = (0, _asyncToGenerator3.default)(_regenerator2.default.mark(function _callee3(ctx) {
+            var _ref3 = (0, _asyncToGenerator3.default)( /*#__PURE__*/_regenerator2.default.mark(function _callee3(ctx) {
                 var project_id, result;
                 return _regenerator2.default.wrap(function _callee3$(_context3) {
                     while (1) {
@@ -412,7 +412,7 @@ var interfaceController = function (_baseController) {
     }, {
         key: 'listByCat',
         value: function () {
-            var _ref4 = (0, _asyncToGenerator3.default)(_regenerator2.default.mark(function _callee4(ctx) {
+            var _ref4 = (0, _asyncToGenerator3.default)( /*#__PURE__*/_regenerator2.default.mark(function _callee4(ctx) {
                 var catid, result;
                 return _regenerator2.default.wrap(function _callee4$(_context4) {
                     while (1) {
@@ -462,7 +462,7 @@ var interfaceController = function (_baseController) {
     }, {
         key: 'listByMenu',
         value: function () {
-            var _ref5 = (0, _asyncToGenerator3.default)(_regenerator2.default.mark(function _callee5(ctx) {
+            var _ref5 = (0, _asyncToGenerator3.default)( /*#__PURE__*/_regenerator2.default.mark(function _callee5(ctx) {
                 var project_id, result, newResult, i, item, list, j;
                 return _regenerator2.default.wrap(function _callee5$(_context5) {
                     while (1) {
@@ -567,7 +567,7 @@ var interfaceController = function (_baseController) {
     }, {
         key: 'up',
         value: function () {
-            var _ref6 = (0, _asyncToGenerator3.default)(_regenerator2.default.mark(function _callee6(ctx) {
+            var _ref6 = (0, _asyncToGenerator3.default)( /*#__PURE__*/_regenerator2.default.mark(function _callee6(ctx) {
                 var _this3 = this;
 
                 var params, id, interfaceData, auth, checkRepeat, data, result, username, cateid;
@@ -773,7 +773,7 @@ var interfaceController = function (_baseController) {
     }, {
         key: 'del',
         value: function () {
-            var _ref7 = (0, _asyncToGenerator3.default)(_regenerator2.default.mark(function _callee7(ctx) {
+            var _ref7 = (0, _asyncToGenerator3.default)( /*#__PURE__*/_regenerator2.default.mark(function _callee7(ctx) {
                 var _this4 = this;
 
                 var id, data, auth, inter, result, username;
@@ -870,7 +870,7 @@ var interfaceController = function (_baseController) {
     }, {
         key: 'solveConflict',
         value: function () {
-            var _ref8 = (0, _asyncToGenerator3.default)(_regenerator2.default.mark(function _callee8(ctx) {
+            var _ref8 = (0, _asyncToGenerator3.default)( /*#__PURE__*/_regenerator2.default.mark(function _callee8(ctx) {
                 var _this5 = this;
 
                 var id, result, userInst, userinfo, data;
@@ -953,7 +953,7 @@ var interfaceController = function (_baseController) {
     }, {
         key: 'addCat',
         value: function () {
-            var _ref9 = (0, _asyncToGenerator3.default)(_regenerator2.default.mark(function _callee9(ctx) {
+            var _ref9 = (0, _asyncToGenerator3.default)( /*#__PURE__*/_regenerator2.default.mark(function _callee9(ctx) {
                 var params, auth, result, username;
                 return _regenerator2.default.wrap(function _callee9$(_context9) {
                     while (1) {
@@ -1048,7 +1048,7 @@ var interfaceController = function (_baseController) {
     }, {
         key: 'upCat',
         value: function () {
-            var _ref10 = (0, _asyncToGenerator3.default)(_regenerator2.default.mark(function _callee10(ctx) {
+            var _ref10 = (0, _asyncToGenerator3.default)( /*#__PURE__*/_regenerator2.default.mark(function _callee10(ctx) {
                 var params, result, username, cate, auth;
                 return _regenerator2.default.wrap(function _callee10$(_context10) {
                     while (1) {
@@ -1120,7 +1120,7 @@ var interfaceController = function (_baseController) {
     }, {
         key: 'delCat',
         value: function () {
-            var _ref11 = (0, _asyncToGenerator3.default)(_regenerator2.default.mark(function _callee11(ctx) {
+            var _ref11 = (0, _asyncToGenerator3.default)( /*#__PURE__*/_regenerator2.default.mark(function _callee11(ctx) {
                 var id, catData, auth, username, result, r;
                 return _regenerator2.default.wrap(function _callee11$(_context11) {
                     while (1) {