重新设计form展示组件，不再使用td和div嵌套的方式（那可真蠢），超长内容自动隐藏

kanban-client/app/assets/Form/index.css

@@ -22,6 +22,17 @@ body,
   height: 100%;
   overflow: hidden;
 }
+.rc-form table {
+  table-layout: fixed;
+  border-collapse: collapse;
+}
+.rc-form td {
+  text-align: left;
+  padding-left: 5px;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  overflow: hidden;
+}
 .rc-form-header {
   font-weight: bold;
 }
@@ -36,20 +47,5 @@ body,
   transform: none !important;
 }
 .rc-form-header-content {
-  padding: 5px;
-}
-.rc-form-item-field {
-  width: 50%;
-  float: left;
-  text-align: left;
-  padding-left: 5px;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-  overflow: hidden;
-}
-.rc-form-item-value {
-  white-space: nowrap;
-  float: left;
-  text-overflow: ellipsis;
-  overflow: hidden;
+  padding: 0 5px;
 }

kanban-client/app/assets/Form/index.less

@@ -23,6 +23,19 @@ html,body,#root{
     height: 100%;
     overflow: hidden;
 }
+.@{prefixCls} table {
+    table-layout: fixed;
+    border-collapse: collapse;
+}
+.@{prefixCls} td {
+    text-align: left;
+    padding-left: 5px;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    overflow: hidden;
+    // border: 1px solid white;
+    // box-sizing: border-box;
+}
 .@{prefixCls}-header {
     font-weight: bold;
 }
@@ -37,20 +50,5 @@ html,body,#root{
     transform: none !important;
 }
 .@{prefixCls}-header-content {
-    padding: 5px;
-}
-.@{prefixCls}-item-field {
-    width: 50%;
-    float: left;
-    text-align: left;
-    padding-left: 5px;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-    overflow: hidden;
+    padding: 0 5px;
 }
-.@{prefixCls}-item-value {
-    white-space: nowrap;
-    float: left;
-    text-overflow: ellipsis;
-    overflow: hidden;
-}

kanban-client/app/component/factory.dev.js

@@ -5,7 +5,7 @@ import MessageBox from '../src/MsgBox/MessageBox.jsx';
 import { converter } from './converter.js';
 import URL from '../constants/url.dev.json';
 
-import tempdata from '../data/ceshi.json';
+import tempdata from '../data/cc.json';
 
 class Factory extends React.Component {
 

kanban-client/app/data/cc.json

@@ -1,47 +1,602 @@
 {
     "instance": {
-        "enabledKanbanCodes": ["5FD2C0FAA12"],
+        "enabledKanbanCodes": ["5DE01DE4D16"],
         "display": "AutoSwitch",
         "switchFrequency": 10,
         "refreshFrequency": 5,
-        "parameters": []
+        "parameters": [{
+            "code": "5E326742F2A",
+            "createTime": 1508485784623,
+            "inputMode": "DropDownBox",
+            "lastModified": 1508919901414,
+            "name": "线别",
+            "optionalValues": ["SMT"],
+            "panelCode": "5DE01C8DF14",
+            "type": "String",
+            "value": "SMT",
+            "version": 5
+        }, {
+            "code": "5FD06CEC511",
+            "createTime": 1508919918275,
+            "inputMode": "DropDownBox",
+            "lastModified": 1508919918275,
+            "name": "新参数",
+            "optionalValues": ["a"],
+            "panelCode": "5DE01C8DF14",
+            "type": "String",
+            "value": "a",
+            "version": 1
+        }]
     },
     "data": [{
         "content": {
+            "title": "<table width=\"100%\" border=\"0\" cellpadding=\"0\" cellspacing=\"1\" style=\"font-weight: bold; background: #2f2e2c;border-collapse: collapse;color: white; text-align: center;\">  <tr>    <td width=\"20%\" rowspan=\"2\" style=\"border:1px solid white\"><img style=\"width: auto;height: 40%; max-width: 100%; max-height: 100%;\" src=\"static/images/log.png\" alt=\"\"/></td>    <td width=\"60%\" rowspan=\"4\" colspan=\"2\" style=\"border:1px solid white\">车间执行进度看板</td>    <td width=\"10%\" rowspan=\"1\" style=\"border:1px solid white\">车间</td>  <td width=\"10%\" rowspan=\"1\" style=\"border:1px solid white;color:red\">车间</td>  </tr>  <tr>    <td width=\"10%\" rowspan=\"1\" style=\"border:1px solid white\">SMT</td><td width=\"10%\" rowspan=\"1\" style=\"border:1px solid white;color:red\">SMT</td>  </tr>  </table>",
             "items": [{
                 "layout": {
-                    "w": 50,
+                    "w": 40,
                     "x": 0,
-                    "h": 50,
+                    "h": 57,
                     "y": 0
                 },
                 "type": "form",
                 "config": {
-                    "columns": 2
+                    "valueStyle": "{\"border\":\"1px solid white\"}",
+                    "data": [{
+                        "field": {
+                            "text": "组长"
+                        },
+                        "value": {
+                            "style": "{\"fontStyle\":\"oblique\"}",
+                            "text": "余海文1111111111111111111111"
+                        },
+                        "render": "function(field,value){;if(1==1){return{field:{text:field,style:{\"fontStyle\":\"oblique\"}},value:{text:'1000',style:{\"fontStyle\":\"oblique\"}}}}}"
+                    }, {
+                        "field": {
+                            "text": "PE"
+                        },
+                        "value": {
+                            "text": "黄伟平"
+                        }
+                    }, {
+                        "field": {
+                            "text": "机动"
+                        },
+                        "value": {
+                            "text": "何伟文"
+                        }
+                    }, {
+                        "field": {
+                            "style": "{\"color\":\"red\"}",
+                            "text": "IPQC"
+                        },
+                        "value": {
+                            "text": "张晓辉"
+                        }
+                    }, {
+                        "field": {
+                            "text": "当前产量"
+                        },
+                        "width": 100,
+                        "value": {
+                            "style": "{\"color\":\"red\"}",
+                            "text": 0
+                        },
+                        "render": "function(field,value){;if(1==1){return{field:{text:field,style:{}},value:{text:value + '100000011111111111111111111111111111000',style:{}}}}}"
+                    }, {
+                        "field": {
+                            "text": "计划产量"
+                        },
+                        "width": 100,
+                        "value": {
+                            "style": "{\"color\":\"red\"}",
+                            "text": 0
+                        }
+                    }, {
+                        "field": {
+                            "text": "计划达成率"
+                        },
+                        "width": 100,
+                        "value": {
+                            "style": "{\"color\":\"red\"}",
+                            "text": 0
+                        }
+                    }, {
+                        "field": {
+                            "text": "直通率"
+                        },
+                        "width": 100,
+                        "value": {
+                            "style": "{\"color\":\"red\"}",
+                            "text": 0
+                        }
+                    }],
+                    "columns": 2,
+                    "header": {
+                        "text": "header",
+                        "style":"{\"color\":\"red\"}"
+                    }
                 }
             }, {
                 "layout": {
-                    "w": 50,
-                    "x": 50,
-                    "h": 50,
-                    "y": 0
+                    "w": 40,
+                    "x": 0,
+                    "h": 43,
+                    "y": 57
                 },
                 "type": "table",
-                "config": {}
+                "config": {
+                    "data": [{
+                        "前五大不良": "反面"
+                    }, {
+                        "前五大不良": "漏印"
+                    }, {
+                        "前五大不良": "反向"
+                    }, {
+                        "前五大不良": "其它"
+                    }, {
+                        "前五大不良": "漏件"
+                    }],
+                    "columns": [{
+                        "dataIndex": "前五大不良",
+                        "width": 180,
+                        "sort": 0,
+                        "title": "前五大不良"
+                    }, {
+                        "dataIndex": "数量",
+                        "width": 100,
+                        "sort": 0,
+                        "title": "数量"
+                    }, {
+                        "dataIndex": "原因",
+                        "width": 100,
+                        "sort": 0,
+                        "title": "原因"
+                    }],
+                    "pagesize": 5,
+                    "interval": 3,
+                    "title": {}
+                }
             }, {
                 "layout": {
-                    "w": 50,
-                    "x": 0,
-                    "h": 50,
-                    "y": 50
+                    "w": 60,
+                    "x": 40,
+                    "h": 100,
+                    "y": 0
                 },
-                "type": "bar",
+                "type": "table",
                 "config": {
-                    "xfields": "刻度1,刻度2,刻度3",
-                    "ytitle": "Y-name",
-                    "xtype": "category",
-                    "xtitle": "X-name",
-                    "ytype": "numeric"
+                    "data": [{
+                        "时段": "8~9",
+                        "投入数": 0
+                    }, {
+                        "时段": "8~9",
+                        "投入数": 0
+                    }, {
+                        "时段": "8~9",
+                        "投入数": 0
+                    }, {
+                        "时段": "8~9",
+                        "投入数": 0
+                    }, {
+                        "时段": "8~9",
+                        "投入数": 5
+                    }, {
+                        "时段": "8~9",
+                        "投入数": 0
+                    }, {
+                        "时段": "8~9",
+                        "投入数": 0
+                    }, {
+                        "时段": "8~9",
+                        "投入数": 53
+                    }, {
+                        "时段": "8~9",
+                        "投入数": 0
+                    }, {
+                        "时段": "8~9",
+                        "投入数": 0
+                    }, {
+                        "时段": "8~9",
+                        "投入数": 642
+                    }, {
+                        "时段": "8~9",
+                        "投入数": 52
+                    }, {
+                        "时段": "8~9",
+                        "投入数": 0
+                    }, {
+                        "时段": "9~10",
+                        "投入数": 0
+                    }, {
+                        "时段": "9~10",
+                        "投入数": 14
+                    }, {
+                        "时段": "9~10",
+                        "投入数": 0
+                    }, {
+                        "时段": "9~10",
+                        "投入数": 0
+                    }, {
+                        "时段": "9~10",
+                        "投入数": 0
+                    }, {
+                        "时段": "9~10",
+                        "投入数": 6
+                    }, {
+                        "时段": "9~10",
+                        "投入数": 0
+                    }, {
+                        "时段": "9~10",
+                        "投入数": 0
+                    }, {
+                        "时段": "9~10",
+                        "投入数": 119
+                    }, {
+                        "时段": "9~10",
+                        "投入数": 0
+                    }, {
+                        "时段": "9~10",
+                        "投入数": 0
+                    }, {
+                        "时段": "9~10",
+                        "投入数": 7
+                    }, {
+                        "时段": "9~10",
+                        "投入数": 89
+                    }, {
+                        "时段": "10~11",
+                        "投入数": 0
+                    }, {
+                        "时段": "10~11",
+                        "投入数": 0
+                    }, {
+                        "时段": "10~11",
+                        "投入数": 2
+                    }, {
+                        "时段": "10~11",
+                        "投入数": 0
+                    }, {
+                        "时段": "10~11",
+                        "投入数": 0
+                    }, {
+                        "时段": "10~11",
+                        "投入数": 92
+                    }, {
+                        "时段": "10~11",
+                        "投入数": 0
+                    }, {
+                        "时段": "10~11",
+                        "投入数": 0
+                    }, {
+                        "时段": "10~11",
+                        "投入数": 252
+                    }, {
+                        "时段": "10~11",
+                        "投入数": 144
+                    }, {
+                        "时段": "10~11",
+                        "投入数": 0
+                    }, {
+                        "时段": "10~11",
+                        "投入数": 62
+                    }, {
+                        "时段": "10~11",
+                        "投入数": 0
+                    }, {
+                        "时段": "11~12",
+                        "投入数": 0
+                    }, {
+                        "时段": "11~12",
+                        "投入数": 0
+                    }, {
+                        "时段": "11~12",
+                        "投入数": 8
+                    }, {
+                        "时段": "11~12",
+                        "投入数": 38
+                    }, {
+                        "时段": "11~12",
+                        "投入数": 0
+                    }, {
+                        "时段": "11~12",
+                        "投入数": 0
+                    }, {
+                        "时段": "11~12",
+                        "投入数": 40
+                    }, {
+                        "时段": "11~12",
+                        "投入数": 0
+                    }, {
+                        "时段": "11~12",
+                        "投入数": 0
+                    }, {
+                        "时段": "11~12",
+                        "投入数": 0
+                    }, {
+                        "时段": "11~12",
+                        "投入数": 0
+                    }, {
+                        "时段": "11~12",
+                        "投入数": 0
+                    }, {
+                        "时段": "11~12",
+                        "投入数": 0
+                    }, {
+                        "时段": "上午",
+                        "投入数": 201
+                    }, {
+                        "时段": "上午",
+                        "投入数": 1517
+                    }, {
+                        "时段": "上午",
+                        "投入数": 0
+                    }, {
+                        "时段": "上午",
+                        "投入数": 0
+                    }, {
+                        "时段": "上午",
+                        "投入数": 1648
+                    }, {
+                        "时段": "上午",
+                        "投入数": 0
+                    }, {
+                        "时段": "上午",
+                        "投入数": 922
+                    }, {
+                        "时段": "上午",
+                        "投入数": 13
+                    }, {
+                        "时段": "上午",
+                        "投入数": 701
+                    }, {
+                        "时段": "上午",
+                        "投入数": 0
+                    }, {
+                        "时段": "上午",
+                        "投入数": 0
+                    }, {
+                        "时段": "上午",
+                        "投入数": 718
+                    }, {
+                        "时段": "上午",
+                        "投入数": 0
+                    }, {
+                        "时段": "12~13",
+                        "投入数": 0
+                    }, {
+                        "时段": "12~13",
+                        "投入数": 0
+                    }, {
+                        "时段": "12~13",
+                        "投入数": 0
+                    }, {
+                        "时段": "12~13",
+                        "投入数": 0
+                    }, {
+                        "时段": "12~13",
+                        "投入数": 21
+                    }, {
+                        "时段": "12~13",
+                        "投入数": 0
+                    }, {
+                        "时段": "12~13",
+                        "投入数": 126
+                    }, {
+                        "时段": "12~13",
+                        "投入数": 0
+                    }, {
+                        "时段": "12~13",
+                        "投入数": 0
+                    }, {
+                        "时段": "12~13",
+                        "投入数": 0
+                    }, {
+                        "时段": "12~13",
+                        "投入数": 0
+                    }, {
+                        "时段": "12~13",
+                        "投入数": 113
+                    }, {
+                        "时段": "12~13",
+                        "投入数": 0
+                    }, {
+                        "时段": "13~14",
+                        "投入数": 0
+                    }, {
+                        "时段": "13~14",
+                        "投入数": 0
+                    }, {
+                        "时段": "13~14",
+                        "投入数": 0
+                    }, {
+                        "时段": "13~14",
+                        "投入数": 0
+                    }, {
+                        "时段": "13~14",
+                        "投入数": 19
+                    }, {
+                        "时段": "13~14",
+                        "投入数": 2
+                    }, {
+                        "时段": "13~14",
+                        "投入数": 12
+                    }, {
+                        "时段": "13~14",
+                        "投入数": 0
+                    }, {
+                        "时段": "13~14",
+                        "投入数": 0
+                    }, {
+                        "时段": "13~14",
+                        "投入数": 0
+                    }, {
+                        "时段": "13~14",
+                        "投入数": 0
+                    }, {
+                        "时段": "13~14",
+                        "投入数": 34
+                    }, {
+                        "时段": "13~14",
+                        "投入数": 0
+                    }, {
+                        "时段": "14~15",
+                        "投入数": 0
+                    }, {
+                        "时段": "14~15",
+                        "投入数": 0
+                    }, {
+                        "时段": "14~15",
+                        "投入数": 0
+                    }, {
+                        "时段": "14~15",
+                        "投入数": 0
+                    }, {
+                        "时段": "14~15",
+                        "投入数": 0
+                    }, {
+                        "时段": "14~15",
+                        "投入数": 0
+                    }, {
+                        "时段": "14~15",
+                        "投入数": 0
+                    }, {
+                        "时段": "14~15",
+                        "投入数": 0
+                    }, {
+                        "时段": "14~15",
+                        "投入数": 0
+                    }, {
+                        "时段": "14~15",
+                        "投入数": 0
+                    }, {
+                        "时段": "14~15",
+                        "投入数": 0
+                    }, {
+                        "时段": "14~15",
+                        "投入数": 3
+                    }, {
+                        "时段": "14~15",
+                        "投入数": 0
+                    }, {
+                        "时段": "下午",
+                        "投入数": 0
+                    }, {
+                        "时段": "下午",
+                        "投入数": 0
+                    }, {
+                        "时段": "下午",
+                        "投入数": 0
+                    }, {
+                        "时段": "下午",
+                        "投入数": 0
+                    }, {
+                        "时段": "下午",
+                        "投入数": 40
+                    }, {
+                        "时段": "下午",
+                        "投入数": 2
+                    }, {
+                        "时段": "下午",
+                        "投入数": 138
+                    }, {
+                        "时段": "下午",
+                        "投入数": 0
+                    }, {
+                        "时段": "下午",
+                        "投入数": 0
+                    }, {
+                        "时段": "下午",
+                        "投入数": 0
+                    }, {
+                        "时段": "下午",
+                        "投入数": 0
+                    }, {
+                        "时段": "下午",
+                        "投入数": 150
+                    }, {
+                        "时段": "下午",
+                        "投入数": 0
+                    }, {
+                        "时段": "当天",
+                        "投入数": 201
+                    }, {
+                        "时段": "当天",
+                        "投入数": 718
+                    }, {
+                        "时段": "当天",
+                        "投入数": 0
+                    }, {
+                        "时段": "当天",
+                        "投入数": 0
+                    }, {
+                        "时段": "当天",
+                        "投入数": 741
+                    }, {
+                        "时段": "当天",
+                        "投入数": 15
+                    }, {
+                        "时段": "当天",
+                        "投入数": 1060
+                    }, {
+                        "时段": "当天",
+                        "投入数": 0
+                    }, {
+                        "时段": "当天",
+                        "投入数": 1648
+                    }, {
+                        "时段": "当天",
+                        "投入数": 0
+                    }, {
+                        "时段": "当天",
+                        "投入数": 0
+                    }, {
+                        "时段": "当天",
+                        "投入数": 1667
+                    }, {
+                        "时段": "当天",
+                        "投入数": 0
+                    }],
+                    "columns": [{
+                        "dataIndex": "时段",
+                        "width": 100,
+                        "sort": 0,
+                        "title": "时段"
+                    }, {
+                        "dataIndex": "计划数",
+                        "width": 100,
+                        "sort": 0,
+                        "title": "计划数"
+                    }, {
+                        "dataIndex": "投入数",
+                        "width": 100,
+                        "sort": 0,
+                        "title": "投入数",
+                        "render": "function(value,record,index){;if(value>200){return{children:value,props:{style:{\"color\":\"#99CC00\"}}}}else{return{children:value,props:{style:{}}}}}"
+                    }, {
+                        "dataIndex": "送检数",
+                        "width": 100,
+                        "sort": 0,
+                        "title": "送检数"
+                    }, {
+                        "dataIndex": "包装数",
+                        "width": 100,
+                        "sort": 0,
+                        "title": "包装数"
+                    }, {
+                        "dataIndex": "达成率",
+                        "width": 100,
+                        "sort": 0,
+                        "title": "达成率"
+                    }, {
+                        "dataIndex": "备注",
+                        "width": 100,
+                        "sort": 0,
+                        "title": "备注"
+                    }],
+                    "pagesize": 13,
+                    "interval": 7,
+                    "title": {},
+                    "headerrowsstyle": "{\"color\":\"#FFFF00\"}"
                 }
             }]
         }

kanban-client/app/src/Form/Form.jsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import FormItem from './FormItem.jsx';
+import {isEmptyObject} from '../../utils/BaseUtils.js';
 import '../../assets/Form/index.less';
 
 export default class Form extends React.Component {
@@ -66,26 +66,25 @@ export default class Form extends React.Component {
         let columnsData = this.getItemColumns();
         const contentEl = <tbody style={{ fontSize: fontSize }} className={`${prefixCls}-content`} key="form_content">
             {
-                columnsData.map((tr, i) => (
+                columnsData.map((tr, i) => {return(
                     <tr className={`${prefixCls}-tr`} key={`content_item_tr_${i}`}>
-                        {tr.map((td, i) => {
-                            return (
-                                <FormItem
-                                    prefixCls={prefixCls}
-                                    fieldCls={fieldCls}
-                                    fieldStyle={fieldStyle}
-                                    valueCls={valueCls}
-                                    valueStyle={valueStyle}
-                                    colSpan={td.colSpan}
-                                    key={`content_item_td_${i}`}
-                                    {...td}
-                                />
-                            )
+                        {
+                            tr.map((td, i) => {
+                                let c = [];
+                                let colSpan = td.colSpan.replace('%','')/2 + '%';
+                                let field = td.render ? ((td.render(td.field.text, td.value.text)) ? td.render(td.field.text, td.value.text).field.text : '' ) : (typeof td.field === 'object' ? td.field.text : td.field);
+                                let value = td.render ? ((td.render(td.field.text, td.value.text)) ? td.render(td.field.text, td.value.text).value.text : '' ) : (typeof td.value === 'object' ? td.value.text : td.value);
+                                let fieldStyle = td.render ? ((td.render(td.field.text, td.value.text)) ? td.render(td.field.text, td.value.text).field.style : {} ) : (typeof td.field === 'object' ? (isEmptyObject(td.field.style) ? td.fieldStyle : td.field.style) : td.fieldStyle);
+                                let valueStyle = td.render ? ((td.render(td.field.text, td.value.text)) ? td.render(td.field.text, td.value.text).value.style : {} ) : (typeof td.value === 'object' ? (isEmptyObject(td.value.style) ? td.valueStyle : td.value.style) : td.valueStyle);
+                                return [
+                                    <td colSpan={colSpan} className={`${prefixCls}-item-field`} style={fieldStyle} > {field}</td>,
+                                    <td colSpan={colSpan} className={`${prefixCls}-item-value`} style={valueStyle} > {value}</td>
+                                ];
+                            })
                         }
-                        )}
 
                     </tr>
-                ))
+                )})
             }
         </tbody>;
         return contentEl;

kanban-client/app/src/Form/FormItem.jsx

@@ -1,45 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import {isEmptyObject} from '../../utils/BaseUtils.js';
-
-export default class FormItem extends React.Component {
-
-  constructor(props) {
-      super(props);
-      this.state = {
-          colSpan: props.colSpan,
-          field: props.render ? props.render(props.field, props.value).field.text : (typeof props.field === 'object' ? props.field.text : props.field),
-          fieldCls: (typeof props.field === 'object' ? (props.field.cls ? props.field.cls : props.fieldCls) : props.fieldCls),
-          fieldStyle: props.render ? props.render(props.field, props.value).field.style : (typeof props.field === 'object' ? (!isEmptyObject(props.field.style) ? props.field.style : props.fieldStyle) : props.fieldStyle),
-          value: props.render ? props.render(props.field, props.value).value.text : (typeof props.value === 'object' ? props.value.text : props.value),
-          valueCls: (typeof props.value === 'object' ? (props.value.cls ? props.value.cls : props.valueCls) : props.valueCls),
-          valueStyle: props.render ? props.render(props.field, props.value).value.style : (typeof props.value === 'object' ? (!isEmptyObject(props.value.style) ? props.value.style : props.valueStyle) : props.valueStyle),
-      };
-  }
-
-  componentWillReceiveProps(nextProps) {
-      this.newProps = nextProps;
-      this.setState({
-          colSpan: nextProps.colSpan,
-          field: nextProps.render ? nextProps.render(nextProps.field, nextProps.value).field.text : (typeof nextProps.field === 'object' ? nextProps.field.text : nextProps.field),
-          fieldCls: (typeof nextProps.field === 'object' ? (nextProps.field.cls ? nextProps.field.cls : nextProps.fieldCls) : nextProps.fieldCls),
-          fieldStyle: nextProps.render ? nextProps.render(nextProps.field, nextProps.value).field.style : (typeof nextProps.field === 'object' ? (isEmptyObject(nextProps.field.style) ? nextProps.fieldStyle : nextProps.field.style) : nextProps.fieldStyle),
-          value: nextProps.render ? nextProps.render(nextProps.field, nextProps.value).value.text : (typeof nextProps.value === 'object' ? nextProps.value.text : nextProps.value),
-          valueCls: (typeof nextProps.value === 'object' ? (nextProps.value.cls ? nextProps.value.cls : nextProps.valueCls) : nextProps.valueCls),
-          valueStyle: nextProps.render ? nextProps.render(nextProps.field, nextProps.value).value.style : (typeof nextProps.value === 'object' ? (isEmptyObject(nextProps.value.style) ? nextProps.valueStyle : nextProps.value.style) : nextProps.valueStyle),
-
-      });
-  }
-
-  render() {
-    const {colSpan, field, fieldCls, fieldStyle, value, valueCls, valueStyle} = this.state;
-    
-    const prefixCls = this.props.prefixCls;
-    return (
-        <td className={`${prefixCls}-item`} colSpan={colSpan}>
-            <div className={`${prefixCls}-item-field ${fieldCls}`} style={fieldStyle} >{field}</div>
-            <div className={`${prefixCls}-item-value ${valueCls}`} style={valueStyle} >{value}</div>
-        </td>
-    );
-  }
-}