图表名称长度限制为20个字符/报表中的元素名称长度限制为20个字符

src/components/chartDesigner/header.jsx

@@ -43,7 +43,7 @@ class Header extends React.Component {
         const { chartDesigner } = this.props;
         const { header } = chartDesigner; 
 
-        return !!header.label && header.label.trim().length > 0 && header.label.length <= 50;
+        return !!header.label && header.label.trim().length > 0 && header.label.length <= 20;
     }
 
     render() {
@@ -118,9 +118,9 @@ class Header extends React.Component {
                                 if(val.trim().length === 0) {
                                     status = 'error';
                                     help = '图表名称不能为空';
-                                }else if(val.trim().length > 50) {
+                                }else if(val.trim().length > 20) {
                                     status = 'error';
-                                    help = '图表名称不能超过50个字符';
+                                    help = '图表名称不能超过20个字符';
                                 }else {
                                     status = 'success';
                                     help = '';

src/components/dashboardDesigner/viewLayoutItem.jsx

@@ -1,13 +1,14 @@
 import React from 'react';
 import { connect } from 'dva';
-import { Input, Icon } from 'antd'
+import { Input, Icon, message } from 'antd'
 import ChartView from './chartView';
 
 class ViewLayoutItem extends React.Component {
     constructor(props) {
         super(props);
         this.state = {
-            editing: false
+            editing: false,
+            title: props.item.name
         };
     }
 
@@ -18,7 +19,7 @@ class ViewLayoutItem extends React.Component {
 
     render() {
         const { dispatch, main, dashboardDesigner, item, isPreview, reload } = this.props;
-        const { editing } = this.state;
+        const { editing, title } = this.state;
         const { currentUser } = main;
         const { dashboardDesignerCode, editMode, minLayoutHeight, theme: themeName } = dashboardDesigner;
         const { code, name, viewType, layout, chartCode, chartOption } = item;
@@ -29,12 +30,24 @@ class ViewLayoutItem extends React.Component {
                 <div className='chartview-toolbar mover'>
                     <div className='chart-title'>
                         {editing ? <Input width={200} ref={node => this['inputRef-' + code] = node} defaultValue={name}
+                            value={title}
                             style={{ marginTop: '4px' }}
+                            onChange={e => {
+                                let val = e.target.value + '';
+                                if(val.trim().length > 20) {
+                                    message.warning('名称长度不能大于20');
+                                }else {
+                                    this.setState({
+                                        title: val
+                                    });
+                                }
+                            }}
                             onMouseDown={e => {
                                 e.stopPropagation()
                             }}
                             onBlur={(e) => {
-                                let value = e.target.value
+                                let value = e.target.value;
+                                console.log(value);
                                 this.setState({
                                     editing: false,
                                 }, () => {
@@ -42,7 +55,8 @@ class ViewLayoutItem extends React.Component {
                                 });
                             }}
                             onPressEnter={(e) => {
-                                let value = e.target.value
+                                let value = e.target.value;
+                                console.log(value);
                                 this.setState({
                                     editing: false,
                                 }, () => {