Browse Source

修复未设置图表展示属性时样式设置可能报错的问题/统一tableView的emptyContent

zhuth 6 years ago
parent
commit
7ac0ba9e38

+ 1 - 1
src/components/chartDesigner/charts/echartsView.jsx

@@ -4,7 +4,7 @@ import { hashcode } from '../../../utils/baseUtils'
 import EmptyContent from '../../common/emptyContent'
 
 const EchartsView = ({ chartOption }) => {
-    if(!chartOption || !chartOption.series) {
+    if(!chartOption || !chartOption.series || chartOption.series.length === 0) {
         return <EmptyContent />
     }else {
         return <Echarts

+ 7 - 4
src/components/chartDesigner/charts/tableView.jsx

@@ -1,5 +1,6 @@
 import React from 'react'
 import { Table } from 'antd'
+import EmptyContent from '../../common/emptyContent'
 import './tableView.less'
 
 class TableView extends React.Component {
@@ -16,11 +17,13 @@ class TableView extends React.Component {
         const { viewRef } = this.props;
         this.onTableLayoutChange();
         this[viewRef].addEventListener('resize', this.onTableLayoutChange);
+        window.addEventListener('resize', this.onTableLayoutChange);
     }
 
     componentWillUnmount() {
         const { viewRef } = this.props;
         this[viewRef].removeEventListener('resize', this.onTableLayoutChange);
+        window.removeEventListener('resize', this.onTableLayoutChange);
     }
 
     onTableLayoutChange = () => {
@@ -28,12 +31,12 @@ class TableView extends React.Component {
     }
 
     getTableLayout = () => {
+        console.log('getTableLayout');
         const { chartOption, viewRef, onPageSizeChange } = this.props;
         let bodyRef = this[viewRef];
         const containerHeight = bodyRef.offsetHeight;
-        const tableEl = bodyRef.getElementsByClassName('table-view')[0];
         let obj = {};
-        if(tableEl && containerHeight > 0 ) {
+        if(containerHeight > 0 ) {
             let tableScrollHeight = containerHeight - 40 - 24 - 8 * 2;
             let pageSize = ~~(tableScrollHeight/38) + 1;
             obj = {
@@ -54,7 +57,7 @@ class TableView extends React.Component {
         const { bordered } = (styleConfig || {});
 
         return (<div style={{ height: '100%' }} ref={node => this[viewRef] = node }>
-            <Table
+            { !columns || columns.length === 0 ? <EmptyContent /> : <Table
                 className='table-view'
                 columns={columns ? columns.map((c, i) => {
                     let obj = { ...c };
@@ -79,7 +82,7 @@ class TableView extends React.Component {
                     y: tableScrollHeight
                 }}
                 pagination={pagination}
-            />
+            />}
         </div>);
     }
 }

+ 1 - 0
src/components/chartDesigner/sections/style/bar.jsx

@@ -23,6 +23,7 @@ class BarStyle extends React.Component {
         const { styleConfig, chartOption, barConfig } = chartDesigner;
         const { groupBy } = barConfig;
         const barStyle = styleConfig.bar || {};
+        chartOption.series = chartOption.series || [];
 
         return <Form>
             <Divider>图域</Divider>

+ 1 - 0
src/components/chartDesigner/sections/style/line.jsx

@@ -23,6 +23,7 @@ class LineStyle extends React.Component {
         const { styleConfig, chartOption, lineConfig } = chartDesigner;
         const { groupBy } = lineConfig;
         const lineStyle = styleConfig.line || {};
+        chartOption.series = chartOption.series || [];
 
         return <Form>
             <Divider>图域</Divider>

+ 1 - 0
src/components/chartDesigner/sections/style/scatter.jsx

@@ -23,6 +23,7 @@ class ScatterStyle extends React.Component {
         const { styleConfig, chartOption, scatterConfig } = chartDesigner;
         const { groupBy } = scatterConfig;
         const scatterStyle = styleConfig.scatter || {};
+        chartOption.series = chartOption.series || [];
 
         return <Form>
             <Divider>图域</Divider>