update less

src/pages/dc/components/Edit/index.js

@@ -1,6 +1,7 @@
 import React, { Component } from 'react'
 import { Modal, Input, Icon } from 'antd'
 import { FormItem } from 'wptpc-design'
+import s from './index.less'
 
 export default class Index extends Component {
   constructor (props) {
@@ -30,17 +31,17 @@ export default class Index extends Component {
         { value: 1, label: '可运行' },
         { value: 2, label: '停止' }
       ],
-      style:{width:'100%'},
+      style: { width: '100%' },
       isRequired: true,
       placeholder: '请输入'
-    },{
+    }, {
       label: '描述',
       type: 'input',
       key: 'desc',
       isRequired: true,
       placeholder: '请输入'
     },
-     {
+    {
       label: 'JSON',
       render: () => {
         const { fieldsJson } = this.state.params
@@ -49,23 +50,30 @@ export default class Index extends Component {
             fieldsJson.push({})
             this.onParamsChange('fieldsJson', fieldsJson)
           }}/></div>
-          {fieldsJson.map((f, index) => <div>
-            <Input value={f.key} onChange={(e) => {
-              fieldsJson[index].key = e.target.value
-              this.onParamsChange('fieldsJson', fieldsJson)
-            }} style={{ width: 100, marginRight: 10 }}/>
-            <Input value={f.desc} onChange={(e) => {
-              fieldsJson[index].desc = e.target.value
-              this.onParamsChange('fieldsJson', fieldsJson)
-            }} style={{ width: 150, marginRight: 10 }}/>
-            <Input value={f.column} onChange={(e) => {
-              fieldsJson[index].column = e.target.value
-              this.onParamsChange('fieldsJson', fieldsJson)
-            }} style={{ width: 150, marginRight: 10 }}/>
-            <Icon onClick={(e) => {
-              fieldsJson.splice(index, 1)
-              this.onParamsChange('fieldsJson', fieldsJson)
-            }} type="close"/></div>)}
+          <div className={s.spanMargin}>
+            <span>* 映射字段</span>
+            <span>* 描  述</span>
+            <span>* 接口字段</span>
+          </div>
+          <div>
+            {fieldsJson.map((f, index) => <div>
+              <Input value={f.key} onChange={(e) => {
+                fieldsJson[index].key = e.target.value
+                this.onParamsChange('fieldsJson', fieldsJson)
+              }} style={{ width: 165, marginRight: 10 }}/>
+              <Input value={f.desc} onChange={(e) => {
+                fieldsJson[index].desc = e.target.value
+                this.onParamsChange('fieldsJson', fieldsJson)
+              }} style={{ width: 165, marginRight: 10 }}/>
+              <Input value={f.column} onChange={(e) => {
+                fieldsJson[index].column = e.target.value
+                this.onParamsChange('fieldsJson', fieldsJson)
+              }} style={{ width: 165, marginRight: 10 }}/>
+              <Icon onClick={(e) => {
+                fieldsJson.splice(index, 1)
+                this.onParamsChange('fieldsJson', fieldsJson)
+              }} type="close"/></div>)}
+          </div>
         </div>
       }
     }]
@@ -101,7 +109,7 @@ export default class Index extends Component {
         onCancel={onCancel}
         // 确认按钮点击后，发起接口会处罚loading值的变化，从而控制确认按钮的状态（disable or enable）
         okButtonProps={{ disabled: loading }}
-        width={720}
+        width={900}
       >
         <FormItem formSetting={this.formSetting} params={params} onChange={this.onParamsChange} />
       </Modal>

src/pages/dc/components/Edit/index.less

@@ -0,0 +1,6 @@
+.spanMargin > span {
+  display: inline-flex;;
+  width: 175px;
+  font-weight: bold;
+  text-align: center;
+}