feat: add title input

Open-Federation · Nov 1, 2019 · 9553035 · 9553035
1 parent 9d4497f
commit 9553035
Show file tree

Hide file tree

Showing 9 changed files with 66 additions and 17 deletions.
diff --git a/.gitignore b/.gitignore
@@ -7,6 +7,7 @@ npm-debug.log*
 pids
 *.pid
 *.seed
+prd_sourcemap
 
 # Directory for instrumented libs generated by jscoverage/JSCover
 lib-cov

diff --git a/package.json b/package.json
@@ -6,6 +6,7 @@
   "license": "MIC",
   "scripts": {
     "start": "ykit s -p 8082",
+    "demo": "NODE_ENV=production ykit pack -m",
     "build": "webpack"
   },
   "dependencies": {

diff --git a/package/App.js b/package/App.js
@@ -99,7 +99,7 @@ class jsonSchema extends React.Component {
     if (!data) {
       data = `{
         "type": "object",
-        "title": "empty object",
+        "title": "title",
         "properties":{}
       }`;
     }
@@ -372,7 +372,7 @@ class jsonSchema extends React.Component {
           )}
           <Col span={this.props.showEditor ? 16 : 24} className="wrapper object-style">
             <Row type="flex" align="middle">
-              <Col span={this.props.isMock ? 10 : 12} className="col-item name-item col-item-name">
+              <Col span={8} className="col-item name-item col-item-name">
                 <Row type="flex" justify="space-around" align="middle">
                   <Col span={2} className="down-style-col">
                     {schema.type === 'object' ? (
@@ -402,7 +402,7 @@ class jsonSchema extends React.Component {
                   </Col>
                 </Row>
               </Col>
-              <Col span={4} className="col-item col-item-type">
+              <Col span={3} className="col-item col-item-type">
                 <Select
                   className="type-select-style"
                   onChange={e => this.changeType(`type`, e)}
@@ -426,6 +426,21 @@ class jsonSchema extends React.Component {
                   />
                 </Col>
               )}
+              <Col span={this.props.isMock ? 4 : 5} className="col-item col-item-mock">
+                <Input
+                  addonAfter={
+                    <Icon
+                      type="edit"
+                      onClick={() =>
+                        this.showEdit([], 'title', this.props.schema.title)
+                      }
+                    />
+                  }
+                  placeholder={'Title'}
+                  value={this.props.schema.title}
+                  onChange={e => this.changeValue(['title'], e.target.value)}
+                />
+              </Col>
               <Col span={this.props.isMock ? 4 : 5} className="col-item col-item-desc">
                 <Input
                   addonAfter={
@@ -441,7 +456,7 @@ class jsonSchema extends React.Component {
                   onChange={e => this.changeValue(['description'], e.target.value)}
                 />
               </Col>
-              <Col span={3} className="col-item col-item-setting">
+              <Col span={2} className="col-item col-item-setting">
                 <span className="adv-set" onClick={() => this.showAdv([], this.props.schema)}>
                   <Tooltip placement="top" title={LocalProvider('adv_setting')}>
                     <Icon type="setting" />

diff --git a/package/components/LocalProvider/index.js b/package/components/LocalProvider/index.js
@@ -3,6 +3,7 @@ import React from 'react';
 
 const langs = {
   en_US: {
+    'title': 'Title',
     'import_json': 'Import JSON',
     'base_setting': 'Base Setting',
     'all_setting': 'Sourec Code',
@@ -37,6 +38,7 @@ const langs = {
     'mockLink': 'Help'
   },
   zh_CN: {
+    'title': '标题',
     'import_json': '导入 json',
     'base_setting': '基础设置',
     'all_setting': '编辑源码',

diff --git a/package/components/SchemaComponents/SchemaJson.js b/package/components/SchemaComponents/SchemaJson.js
@@ -85,6 +85,13 @@ class SchemaArray extends PureComponent {
     this.Model.changeValueAction({ key, value });
   };
 
+  handleChangeTitle = e =>{
+    let prefix = this.getPrefix();
+    let key = [].concat(prefix, `title`);
+    let value = e.target.value;
+    this.Model.changeValueAction({ key, value });
+  }
+
   // 增加子节点
   handleAddChildField = () => {
     let prefix = this.getPrefix();
@@ -121,7 +128,7 @@ class SchemaArray extends PureComponent {
         <div className="array-type">
           <Row className="array-item-type" type="flex" justify="space-around" align="middle">
             <Col
-              span={this.context.isMock ? 10 : 12}
+              span={8}
               className="col-item name-item col-item-name"
               style={this.__tagPaddingLeftStyle}
             >
@@ -142,7 +149,7 @@ class SchemaArray extends PureComponent {
                 </Col>
               </Row>
             </Col>
-            <Col span={4} className="col-item col-item-type">
+            <Col span={3} className="col-item col-item-type">
               <Select
                 name="itemtype"
                 className="type-select-style"
@@ -168,6 +175,14 @@ class SchemaArray extends PureComponent {
                 />
               </Col>
             )}
+            <Col span={this.context.isMock ? 4 : 5} className="col-item col-item-mock">
+              <Input
+                addonAfter={<Icon type="edit" onClick={() => this.handleShowEdit('title')} />}
+                placeholder={LocaleProvider('title')}
+                value={value.title}
+                onChange={this.handleChangeTitle}
+              />
+            </Col>
             <Col span={this.context.isMock ? 4 : 5} className="col-item col-item-desc">
               <Input
                 addonAfter={<Icon type="edit" onClick={() => this.handleShowEdit('description')} />}
@@ -176,7 +191,7 @@ class SchemaArray extends PureComponent {
                 onChange={this.handleChangeDesc}
               />
             </Col>
-            <Col span={3} className="col-item col-item-setting">
+            <Col span={this.context.isMock ? 2: 3} className="col-item col-item-setting">
               <span className="adv-set" onClick={this.handleShowAdv}>
                 <Tooltip placement="top" title={LocaleProvider('adv_setting')}>
                   <Icon type="setting" />
@@ -253,6 +268,13 @@ class SchemaItem extends PureComponent {
     this.Model.changeValueAction({ key, value });
   };
 
+  handleChangeTitle = e => {
+    let prefix = this.getPrefix();
+    let key = [].concat(prefix, `title`);
+    let value = e.target.value;
+    this.Model.changeValueAction({ key, value });
+  }
+
   // 修改数据类型
   handleChangeType = e => {
     let prefix = this.getPrefix();
@@ -319,7 +341,7 @@ class SchemaItem extends PureComponent {
       <div>
         <Row type="flex" justify="space-around" align="middle">
           <Col
-            span={this.context.isMock ? 10 : 12}
+            span={8}
             className="col-item name-item col-item-name"
             style={this.__tagPaddingLeftStyle}
           >
@@ -355,7 +377,7 @@ class SchemaItem extends PureComponent {
           </Col>
 
 
-          <Col span={4} className="col-item col-item-type">
+          <Col span={3} className="col-item col-item-type">
             <Select
               className="type-select-style"
               onChange={this.handleChangeType}
@@ -391,6 +413,14 @@ class SchemaItem extends PureComponent {
             </Col>
           )}
 
+          <Col span={this.context.isMock ? 4 : 5} className="col-item col-item-mock">
+            <Input
+              addonAfter={<Icon type="edit" onClick={() => this.handleShowEdit('title')} />}
+              placeholder={LocaleProvider('title')}
+              value={value.title}
+              onChange={this.handleChangeTitle}
+            />
+          </Col>
 
           <Col span={this.context.isMock ? 4 : 5} className="col-item col-item-desc">
             <Input
@@ -402,7 +432,7 @@ class SchemaItem extends PureComponent {
           </Col>
 
 
-          <Col span={3} className="col-item col-item-setting">
+          <Col span={this.context.isMock ? 2: 3}  className="col-item col-item-setting">
             <span className="adv-set" onClick={this.handleShowAdv}>
               <Tooltip placement="top" title={LocaleProvider('adv_setting')}>
                 <Icon type="setting" />

diff --git a/package/components/SchemaComponents/schemaJson.css b/package/components/SchemaComponents/schemaJson.css
@@ -36,11 +36,11 @@
 
 .json-schema-react-editor .col-item-mock{
   text-align: center;
-  padding-right: 16px;
+  padding-right: 6px;
 }
 
 .json-schema-react-editor .col-item-setting{
-  padding-left: 16px;
+  padding-left: 6px;
   cursor: pointer;
 }
 
@@ -96,7 +96,7 @@
 }
 
 .json-schema-react-editor .type-select-style {
-  width: 80%
+  width: 90%
 }
 
 .json-schema-react-editor-import-modal .ant-tabs-nav .ant-tabs-tab{

diff --git a/prd/src/index.css b/prd/src/index.css
diff --git a/prd/src/index.js b/prd/src/index.js
diff --git a/src/index.js b/src/index.js
@@ -51,7 +51,7 @@ render(
 
     <JEditor1
       showEditor={true}
-      isMock={true}
+      isMock={false}
       data={''}
       onChange={e => {
         console.log('changeValue', e);
-Original file line number
+Diff line change
@@ Expand Up / @@ -7,6 +7,7 @@ npm-debug.log* @@
     pids
     *.pid
     *.seed
+    prd_sourcemap
     # Directory for instrumented libs generated by jscoverage/JSCover
     lib-cov
@@ Expand Down @@