diff --git a/client/components/ModalPostman/MockList.js b/client/components/ModalPostman/MockList.js
index 34ff3354..16dc455d 100644
--- a/client/components/ModalPostman/MockList.js
+++ b/client/components/ModalPostman/MockList.js
@@ -51,7 +51,6 @@ class MockList extends Component {
     const { click, clickValue } = this.props;
     return (
       <div className="modal-postman-form-mock">
-        <h3 className="mock-title title">mock数据</h3>
         <Search
           onChange={this.onFilter}
           onSearch={this.onSearch}
diff --git a/client/components/ModalPostman/VariablesSelect.js b/client/components/ModalPostman/VariablesSelect.js
new file mode 100644
index 00000000..014cba5b
--- /dev/null
+++ b/client/components/ModalPostman/VariablesSelect.js
@@ -0,0 +1,152 @@
+import React, { Component } from 'react'
+// import PropTypes from 'prop-types'
+import { Tree } from 'antd';
+const TreeNode = Tree.TreeNode;
+
+// $.{id}.params.{path}
+// $.{id}.body.{path}
+
+const records = [{
+  _id: 1,
+  name: 'abc',
+  caseList: [{
+    _id: 11,
+    casename: 'case-test',
+    params: {
+      id: '123',
+      name: '小明'
+    },
+    body: {
+      email: 'weriri@qq.com',
+      arr: [{
+        pid: 1,
+        tt: {
+          a: 1
+        }
+      }]
+    }
+  }, {
+    _id: 12,
+    casename: 'case-test1',
+    params: {
+      id: '123',
+      name: '小明'
+    },
+    body: {
+      email: 'weriri@qq.com',
+      arr: [{
+        pid: 1,
+        tt: {
+          a: 1
+        }
+      }]
+    }
+  }]
+},
+{
+  _id: 2,
+  name: 'abc2222',
+  caseList: [{
+    _id: 13,
+    casename: 'case-test222',
+    params: {},
+    body: [{
+      pid: 1,
+      tt: {
+        a: 1
+      }
+    }]
+  }]
+}]
+
+// const x = 3;
+// const y = 2;
+// const z = 1;
+const gData = [];
+
+// const generateData = (_level, _preKey, _tns) => {
+//   const preKey = _preKey || '0';
+//   const tns = _tns || gData;
+//   const children = [];
+//   for (let i = 0; i < x; i++) {
+//     const key = `${preKey}-${i}`;
+//     tns.push({ title: key, key });  // 0-0, 0-1,0-2
+//     if (i < y) {
+//       children.push(key);     
+//     }
+//   }
+//   if (_level < 0) {
+//     return tns;
+//   }
+//   const level = _level - 1;
+//   children.forEach((key, index) => {
+//     tns[index].children = [];
+//     return generateData(level, key, tns[index].children);
+//   });
+// };
+// generateData(z);
+
+const generateData = (records, _tns) => {
+  const tns = _tns || gData;
+  records.forEach((item, index) => {
+    tns.push({ title: item.name, key: item._id });
+    const children = [];
+    // let paramsItem = []
+    item.caseList.forEach((item, index) => {
+      let paramsItemChildren = [];
+      let paramsItem = []
+      paramsItem.push({ title: 'params', key: `params${index}`, children: [] });
+      for (let keys in item.params) {
+        paramsItemChildren.push({ title: keys, key: item.params[keys] });
+      }
+      
+      paramsItem[0].children = paramsItemChildren;
+      children.push({ title: item.casename, key: item._id, children: paramsItem })
+      // children.params
+    })
+
+    tns[index].children = children;
+  })
+
+
+}
+
+generateData(records)
+
+class VariablesSelect extends Component {
+
+  componentDidMount() {
+
+  }
+  state = {
+    gData
+    // expandedKeys: ['0-0', '0-0-0', '0-0-0-0']
+  }
+
+
+
+  render() {
+    const loop = data => data.map((item) => {
+      if (item.children && item.children.length) {
+        return <TreeNode key={item.key} title={item.title}>{loop(item.children)}</TreeNode>;
+      }
+      return <TreeNode key={item.key} title={item.title} />;
+    });
+
+    console.log('gDate', this.state.gData);
+
+    return (
+      <div className="modal-postman-form-variable">
+        <Tree
+          className="draggable-tree"
+        >
+          {loop(this.state.gData)}
+        </Tree>
+      </div>
+    )
+
+  }
+
+}
+
+export default VariablesSelect;
\ No newline at end of file
diff --git a/client/components/ModalPostman/index.js b/client/components/ModalPostman/index.js
index 7b753c95..43e4ecd9 100644
--- a/client/components/ModalPostman/index.js
+++ b/client/components/ModalPostman/index.js
@@ -4,11 +4,12 @@ import React, { Component } from 'react'
 import PropTypes from 'prop-types'
 import './index.scss'
 // import { withRouter } from 'react-router-dom';
-import { Modal, Row, Col, Icon } from 'antd';
-import MockList from './MockList.js';
+import { Modal, Row, Col, Icon, Collapse, Input } from 'antd'
+import MockList from './MockList.js'
 import MethodsList from './MethodsList.js'
+import VariablesSelect from './VariablesSelect.js'
 import { handleParamsValue } from '../../common.js'
-import common from 'common/power-string.js'
+const Panel = Collapse.Panel;
 
 // 深拷贝
 function deepEqual(state) {
@@ -62,12 +63,17 @@ class ModalPostman extends Component {
     return (curname, params) => {
       console.log('value', params);
       // let curname = e;
+      console.log('curname', curname);
       let newParamsList = closeRightTabsAndAddNewTab(this.state.methodsParamsList, index, curname, params)
       this.setState({
         methodsParamsList: newParamsList
       })
     }
   }
+  //  处理常量输入 
+  handleConstantsInput = (val, index) => {
+    this.mockClick(index)(val);
+  }
 
   handleParamsInput = (e, clickIndex, paramsIndex) => {
     let newParamsList = deepEqual(this.state.methodsParamsList);
@@ -78,8 +84,8 @@ class ModalPostman extends Component {
     })
   }
 
+  // 方法
   MethodsListSource = (props) => {
-
     return <MethodsList
       click={this.mockClick(props.index)}
       clickValue={props.value}
@@ -88,6 +94,8 @@ class ModalPostman extends Component {
     />
   }
 
+
+  //  处理表达式
   handleValue(val) {
     // let val = '{@string |length}'
     return handleParamsValue(val, {});
@@ -96,21 +104,21 @@ class ModalPostman extends Component {
   render() {
     const { visible, handleCancel, handleOk } = this.props
     const { methodsParamsList } = this.state;
-    const { name } = methodsParamsList[0];
+    // const { name } = methodsParamsList[0];
     // console.log('common', common);
 
     const outputParams = () => {
       let str = '';
       let length = methodsParamsList.length;
       methodsParamsList.forEach((item, index) => {
-        let isShow = item.name && length-2 !== index;
+        let isShow = item.name && length - 2 !== index;
         str += item.name;
-        item.params.forEach((item, index)=>{
+        item.params.forEach((item, index) => {
           let isParams = index > 0;
-          str += isParams ? ',': ':' ;
+          str += isParams ? ' , ' : ' : ';
           str += item
         })
-        str += isShow ? '|': '';
+        str += isShow ? ' | ' : '';
       })
       return str
     }
@@ -123,6 +131,8 @@ class ModalPostman extends Component {
         onCancel={handleCancel}
         wrapClassName="modal-postman"
         width={1000}
+        maskClosable={false}
+        okText="插入"
       >
 
         <Row className="modal-postman-form" type="flex">
@@ -130,8 +140,17 @@ class ModalPostman extends Component {
             methodsParamsList.map((item, index) => {
               return item.type === 'dataSource' ?
                 <Col span={8} className="modal-postman-col" key={index}>
-                  <MockList click={this.mockClick(index)} clickValue={name}></MockList>
-                  <h3>变量</h3>
+                  <Collapse className="modal-postman-collapse" defaultActiveKey={['1']} bordered={false} accordion>
+                    <Panel header={<h3 className="mock-title">常量</h3>} key="1">
+                      <Input placeholder="基础参数值" onChange={(e) => this.handleConstantsInput(e.target.value, index)} />
+                    </Panel>
+                    <Panel header={<h3 className="mock-title">mock数据</h3>} key="2">
+                      <MockList click={this.mockClick(index)} clickValue={item.name}></MockList>
+                    </Panel>
+                    <Panel header={<h3 className="mock-title">变量</h3>} key="3">
+                      <VariablesSelect />
+                    </Panel>
+                  </Collapse>
                 </Col>
                 :
                 <Col span={8} className="modal-postman-col" key={index}>
@@ -141,24 +160,10 @@ class ModalPostman extends Component {
           }
         </Row>
         <Row className="modal-postman-expression">
-          <Col span={6}><h3 className="title">输入值</h3></Col>
+          <Col span={6}><h3 className="title">表达式</h3></Col>
           <Col span={18}>
             <span className="expression">{'{'}</span>
-            {
-              methodsParamsList.map((item, index) => {
-                return item.name &&
-                  <span className="expression-item" key={index}>
-                    {item.name}
-                    (
-                    {
-                      item.params.map((item, index) => {
-                        return <span className="expression-item-params" key={index}>{item}</span>
-                      })
-                    }
-                    )
-                  </span>
-              })
-            }
+            <span className="expression-item">{outputParams()}</span>
             <span className="expression">{'}'}</span>
           </Col>
         </Row>
diff --git a/client/components/ModalPostman/index.scss b/client/components/ModalPostman/index.scss
index 6c0018a2..39f664cd 100644
--- a/client/components/ModalPostman/index.scss
+++ b/client/components/ModalPostman/index.scss
@@ -42,6 +42,17 @@
   .modal-postman-preview {
     background-color: #f5f5f5;
   }
+  .modal-postman-collapse{
+     .ant-collapse-item > .ant-collapse-header{
+      padding-left: 20px;
+    }
+
+     .ant-collapse-item > .ant-collapse-header .arrow{
+      left: 0;
+      font-size: 1.17em;
+    }
+  }
+
   .title {
     border-left: 3px solid #2395f1;
     padding-left: 8px;
@@ -103,25 +114,10 @@
       padding-right: 4px;
     }
 
-    .expression-item:nth-last-child(2){
+    .expression-item{
       color: #2395f1;
     }
 
-    .expression-item:after{
-      content:".";
-    }
-
-    .expression-item:nth-last-child(2):after{
-      content:"";
-    }
-
-    .expression-item-params:after{
-      content:",";
-    }
-
-    .expression-item-params:nth-last-child(1):after{
-      content:"";
-    }
 
   }
 
diff --git a/common/power-string.js b/common/power-string.js
index d77fdcae..823acc1c 100644
--- a/common/power-string.js
+++ b/common/power-string.js
@@ -152,7 +152,7 @@ function handleSegment(str, index){
     let method, args = [];
     if(str.indexOf(methodAndArgsSeparateChar) > 0){
         str = str.split(methodAndArgsSeparateChar);
-        method = str[0];
+        method = str[0].trim();
         args = str[1].split(argsSeparateChar).map(item=> _handleValue(item.trim()));
     }else{
         method = str;