解决用户管理界面resize之后切换tab表格数据丢失问题

src/components/admin/admin.jsx

@@ -12,12 +12,23 @@ class Admin extends React.Component {
 
         }
     };
+
+    changeTab = () => {
+        // 主动触发一次window的resize事件
+        window.setTimeout(() => {
+            var e = document.createEvent("Event");
+            e.initEvent("resize", true, true);
+            window.dispatchEvent(e);
+        }, 300);
+    }
+
     render() {
         return (      
             <Tabs 
                 className='admin-tabs'
                 tabPosition='left'
                 defaultActiveKey="userGroup"
+                onChange={this.changeTab}
             >
                 <TabPane tab="用户分组" key="userGroup" >
                     <UserGroupManagement />

src/components/admin/userGroupManagement.jsx

@@ -182,6 +182,7 @@ class UserGroupManagement extends React.Component {
                             okHandler={(selectedUser) => {
                                 selectedUser.length > 0 && dispatch({ type: 'userGroup/remoteMemberAdd', userList: selectedUser, group: selectedGroup });
                             }}
+                            selectedUsers={selectedGroup.member}
                         />}
                     </div>
                 </Content>

src/components/chart/list.jsx

@@ -474,7 +474,7 @@ class ChartList extends React.Component {
                         })
                     }}
                     selectedRecord={selectedRecord}
-                    onOk={() => {
+                    okHandler={() => {
                         dispatch({ type: 'chart/remoteDelete', code: this.state.selectedRecord.code })
                 }} />}
                 {visibleDataPreviewBox && <DataPreview

src/components/chartDesigner/charts/echartsView.jsx

@@ -3,9 +3,9 @@ import Echarts from 'echarts-for-react'
 import { connect } from 'dva'
 import { hashcode } from '../../../utils/baseUtils'
 
-const EchartsView = ({ chartDesigner, dispatch }) => {
+const EchartsView = ({ chartDesigner, dispatch, optionConfig }) => {
     const { chartOption } = chartDesigner;
-    const option = chartOption;
+    const option = { ...chartOption, ...optionConfig };
     return <Echarts
         key={hashcode(option)}
         option={option}

src/components/chartDesigner/content.jsx

@@ -23,6 +23,8 @@ class ChartDesignerContent extends React.Component {
     constructor(props) {
         super(props);
         this.state = {
+            isOwner: false,
+            animation: false,
             autoRefresh: true,
             collapsed: false,
             contentSize: {
@@ -33,9 +35,28 @@ class ChartDesignerContent extends React.Component {
     }
 
     componentDidMount() {
+        window.setTimeout(() => {
+            this.setState({
+                animation: true
+            });
+        }, 2000);
         this.refreshContentSize();
     }
 
+    static getDerivedStateFromProps(nextProps, nextState) {
+        const { chartDesigner, main } = nextProps;
+        const isOwner = chartDesigner.creatorCode === main.currentUser.code;
+        if(chartDesigner.code !== nextState.code) {
+            return {
+                code: chartDesigner.code,
+                isOwner: isOwner,
+                collapsed: !isOwner,
+            };
+        }else {
+            return null;
+        }
+    }
+
     /**
      * 设置图表区域大小
      */
@@ -43,8 +64,6 @@ class ChartDesignerContent extends React.Component {
         let contentEl = findDOMNode(this.refs.contentEl);
         if(!contentEl) { return; }
         let contentLayout = contentEl.getBoundingClientRect();
-        console.log(contentLayout);
-        // let scroll = contentEl.scrollHeight > contentEl.clientHeight;
         this.setState({
             contentSize: {
                 width: contentLayout.width,
@@ -61,7 +80,7 @@ class ChartDesignerContent extends React.Component {
 
     render() {
         const { chartDesigner, dispatch } = this.props;
-        const { autoRefresh, contentSize } = this.state;
+        const { isOwner, animation, autoRefresh, contentSize } = this.state;
         const { baseConfig } = chartDesigner;
         const { viewType } = baseConfig;
         const formItemLayout = {
@@ -79,22 +98,22 @@ class ChartDesignerContent extends React.Component {
             chartView = (<TableView contentSize={contentSize}/>);
         }else if(viewType === 'line') {
             configForm = (<LineConfigForm autoRefresh={autoRefresh} formItemLayout={formItemLayout}/>);
-            chartView = (<EchartsView contentSize={contentSize}/>);
+            chartView = (<EchartsView contentSize={contentSize} optionConfig={{ animation }}/>);
         }else if(viewType === 'bar') {
             configForm = (<BarConfigForm autoRefresh={autoRefresh} formItemLayout={formItemLayout}/>);
-            chartView = (<EchartsView contentSize={contentSize}/>);
+            chartView = (<EchartsView contentSize={contentSize} optionConfig={{ animation }}/>);
         }else if(viewType === 'pie') {
             configForm = (<PieConfigForm autoRefresh={autoRefresh} formItemLayout={formItemLayout}/>);
-            chartView = (<EchartsView contentSize={contentSize}/>);
+            chartView = (<EchartsView contentSize={contentSize} optionConfig={{ animation }}/>);
         }else if(viewType === 'scatter') {
             configForm = (<ScatterConfigForm autoRefresh={autoRefresh} formItemLayout={formItemLayout}/>);
-            chartView = (<EchartsView contentSize={contentSize}/>);
+            chartView = (<EchartsView contentSize={contentSize} optionConfig={{ animation }}/>);
         }
 
         return (
             <Layout className='chartdesigner'>
-                <Sider className={`sider-left${this.state.collapsed ? ' sider-left-collapsed' : ''}`}>
-                    <Button className='collapse-toggle' shape='circle' size='small' icon={`${this.state.collapsed?'right':'left'}`} onClick={this.onCollapse} />
+                <Sider className={`sider-left${this.state.collapsed ? ' sider-left-collapsed' : ''}`} width={isOwner ? 300 : 0} >
+                    <Button className='collapse-toggle' style={{ display: isOwner? 'block' : 'none' }} shape='circle' size='small' icon={`${this.state.collapsed?'right':'left'}`} onClick={this.onCollapse} />
                     <Tabs className='sider-tabs'>
                         <TabPane className='chartconfig' tab='图表设置' key='1'>
                             <BaseConfigForm formItemLayout={formItemLayout}/>
@@ -138,9 +157,5 @@ class ChartDesignerContent extends React.Component {
         )
     }
 }
-function mapStateToProps(state) {
-    const chartDesigner = state.present.chartDesigner;
 
-    return { chartDesigner: chartDesigner }
-}
-export default connect(mapStateToProps)(ChartDesignerContent);
+export default connect(({ present:{ main, chartDesigner } }) => ({ main, chartDesigner }))(ChartDesignerContent);

src/components/chartDesigner/content.less

@@ -1,10 +1,10 @@
 .chartdesigner {
     flex-direction: row;
     .sider-left {
-        flex: 0 0 300px !important;
-        max-width: 300px !important;
-        min-width: 300px !important;
-        width: 300px !important;
+        // flex: 0 0 300px !important;
+        // max-width: 300px !important;
+        // min-width: 300px !important;
+        // width: 300px !important;
 
         .ant-layout-sider-children {
             padding-bottom: 40px;

src/components/chartDesigner/header.jsx

@@ -110,7 +110,7 @@ class Header extends React.Component {
                             </Button>
                         </Tooltip>}
                         {this.isOwner() && visibleCopyBox && <Modal
-                            title="以当前图表配置创建新的图表副本"
+                            title="复制新增"
                             visible={visibleCopyBox}
                             okText='创建'
                             onOk={this.copyHandler}

src/components/chartDesigner/sections/displayColumnBox.jsx

@@ -55,8 +55,8 @@ class DisplayColumnBox extends React.Component {
     onOk= () => {
         const { hideBox, okHandler } = this.props;
         const { targetColumns } = this.state;
-        okHandler(targetColumns);
-        hideBox()
+        typeof okHandler === 'function' && okHandler(targetColumns);
+        typeof hideBox === 'function' && hideBox();
     }
     
     onCancel = () => {

src/components/common/deleteBox/deleteBox.jsx

@@ -16,8 +16,29 @@ import { Modal } from 'antd'
  *
  */
 class DeleteBox extends React.Component {
+
+    componentDidMount() {
+        window.addEventListener('keydown', this.hhh);
+    }
+
+    componentWillUnmount() {
+        window.removeEventListener('keydown', this.hhh);
+    }
+
+    hhh = (e) => {
+        if(e.keyCode === 13) { // 按下回车
+            this.onOk();
+        }
+    }
+
+    onOk = () => {
+        const { okHandler, hideBox } = this.props;
+        typeof okHandler === 'function' && okHandler();
+        typeof hideBox === 'function' && hideBox();
+    }
+
     render() {
-        const { visibleDeleteBox, hideBox, selectedRecord, type, onOk } = this.props
+        const { visibleDeleteBox, hideBox, selectedRecord, type } = this.props
         const typeMapper = {
             'datasource': '数据源',
             'chart': '图表',
@@ -27,7 +48,7 @@ class DeleteBox extends React.Component {
             <Modal 
                 visible={visibleDeleteBox}
                 onCancel={hideBox}
-                onOk={() => {onOk();hideBox();}}
+                onOk={this.onOk}
                 destroyOnClose={true}
             >
                 <span>确定要删除{typeMapper[type]}：{selectedRecord ? selectedRecord.name : ''} 吗？</span>

src/components/common/selectUserBox/selectUserBox.jsx

@@ -36,9 +36,9 @@ class AddGroupMemberBox extends React.Component {
                 const resData = r.data.data || [];
                 this.setState({
                     userData: resData.map(d => ({
-                        code: d.id,
+                        code: d.id + '',
                         name: d.name,
-                        account: d.userName,
+                        account: d.userName + '',
                         password: d.passWord,
                         role: d.role === 'admin' ? 'admin' : 'default',
                         department: d.department,
@@ -57,7 +57,12 @@ class AddGroupMemberBox extends React.Component {
     }
 
     render() {
-        const { visibleBox, title, hideBox, okHandler, multiple, onlyAdmin } = this.props;
+        /**
+         * multiple: 允许多选
+         * onlyAdmin: 只允许选管理员
+         * selectedUsers: 已选中用户（无法再被选）
+         */
+        const { visibleBox, title, hideBox, okHandler, multiple, onlyAdmin, selectedUsers } = this.props;
         const { userData, fetching } = this.state;
 
         return (
@@ -112,7 +117,7 @@ class AddGroupMemberBox extends React.Component {
                             }}
                         >
                             { userData.filter(u => !!onlyAdmin ? (u.role === 'admin') : ( true )).map((s, i) => {
-                                return <SelectOption key={i} value={s.code}>{s.name}</SelectOption>
+                                return <SelectOption key={i} value={s.code} disabled={!!selectedUsers && selectedUsers.length > 0 && selectedUsers.findIndex(u => u.code === s.code) !== -1}>{s.name}</SelectOption>
                             }) }
                         </Select>
                     </Col>

src/components/dashboard/list.jsx

@@ -254,7 +254,7 @@ class DashboardList extends React.Component {
                         })
                     }}
                     selectedRecord={selectedRecord}
-                    onOk={() => {
+                    okHandler={() => {
                         dispatch({ type: 'dashboard/remoteDelete', code: this.state.selectedRecord.code })
                     }} />
             </Layout>

src/components/dashboardDesigner/chartView.jsx

@@ -11,7 +11,6 @@ class ChartView extends React.Component {
     constructor(props) {
         super(props);
         this.state = {
-            fetching: false,
             chartOption: {
                 showLoading: true
             }, // 图表详细数据
@@ -22,7 +21,7 @@ class ChartView extends React.Component {
         const { item, dispatch } = this.props;
         const { viewType } = item;
         if(viewType === 'chart') {
-            dispatch({ type: 'dashboardDesigner/fetchChartData', item });
+            dispatch({ type: 'dashboardDesigner/fetchChartData', item, mandatory: true });
         }
     }
 
@@ -78,7 +77,7 @@ class ChartView extends React.Component {
         return (
             <div className='chartview-content' style={{ width: '100%', height: '100%' }}>
                 { children }
-                { fetching && <div style={{ display: fetching ? 'block' : 'none', position: 'absolute', height: '100%', width: '100%', zIndex: '4', background: 'rgba(51,51,51,.1)', top: 0 }}>
+                { fetching && <div style={{ display: fetching ? 'block' : 'none', position: 'absolute', height: '100%', width: '100%', zIndex: '4', background: 'rgba(51,51,51,.1)', top: 0, left: 0 }}>
                     <Spin style={{ display: 'inline-block', position: 'absolute', top: '50%', left: '50%', margin: '-10px' }} indicator={<Icon type="loading" style={{ fontSize: 24 }} spin />} />
                 </div> }
             </div>
@@ -86,4 +85,4 @@ class ChartView extends React.Component {
     }
 }
 
-export default connect(({ present: { dashboardDesigner } }) => ({ dashboardDesigner }))(ChartView);
+export default connect()(ChartView);

src/components/dashboardDesigner/chooseChartBox.jsx

@@ -25,6 +25,10 @@ class ChooseChartBox extends React.Component {
         window.addEventListener('resize', this.onWindowResize);
     }
 
+    componentWillUmmount() {
+        window.removeEvenetListener('resize', this.onWindowResize);
+    }
+
     onWindowResize = () => {
         this.setState({
             screenWidth: document.documentElement.clientWidth || document.body.clientWidth,
@@ -49,22 +53,6 @@ class ChooseChartBox extends React.Component {
         }
     }
 
-    handleChange = (content) => {
-    }
-
-    handleRawChange = (rawContent) => {
-    }
-
-    
-    static editorProps = {
-        height: 300,
-        contentFormat: 'raw',
-        initialContent: '<p>Hello World!</p>',
-        onChange: () => {},
-        onRawChange: () => {},
-        image: true, // 开启图片插入功能?
-    }
-
     render() {
         const { main, visibleBox, hideBox, dashboardDesigner, chart } = this.props;
         const { selectedRecord, screenWidth, screenHeight } = this.state;

src/components/dashboardDesigner/viewLayout.jsx

@@ -9,6 +9,7 @@ class ViewLayout extends React.PureComponent {
     constructor(props) {
         super(props);
         this.state = {
+            previewItem: null,
             visiblePreviewBox: false,
             screenWidth: document.documentElement.clientWidth || document.body.clientWidth,
             screenHeight: document.documentElement.clientHeight || document.body.clientHeight
@@ -35,25 +36,26 @@ class ViewLayout extends React.PureComponent {
         const { currentUser } = main;
         const { editMode } = dashboardDesigner;
         const { code, name, viewType, layout, chartCode } = item;
+        const iconCls = editMode ? 'visible-icon' : '';
 
         return (
             <div className={`chartview${ isPreview ? ' chartview-preview' : (editMode ? ' chartview-edit' : '')}`} key={code} data-grid={layout}>
                 <div className='chartview-toolbar mover'>
                     <div className='chart-title'><span>{name}</span></div>
                     <div className='chart-tools'>
-                        {viewType !== 'richText' && <Icon type="reload" theme="outlined" onClick={() => {
+                        {viewType !== 'richText' && <Icon className={iconCls} type="reload" theme="outlined" onClick={() => {
                             dispatch({ type: 'dashboardDesigner/fetchChartData', item, mandatory: true });
                         }}/>}
-                        {!isPreview && viewType !== 'richText' && <Icon type="arrows-alt" onClick={() => this.showPreviewBox(item)}/>}
-                        {editMode && item.creatorCode === currentUser.code && viewType !== 'richText' &&  <Icon type='edit' onClick={() => {
+                        {!isPreview && viewType !== 'richText' && <Icon className={iconCls} type="arrows-alt" onClick={() => this.showPreviewBox(item)}/>}
+                        {editMode && !isPreview && item.creatorCode === currentUser.code && viewType !== 'richText' &&  <Icon className={iconCls} type='edit' onClick={() => {
                             dispatch({ type: 'dashboard/remoteModify' });
                             dispatch({ type: 'chartDesigner/reset' });
                             dispatch({ type: 'main/redirect', path: '/chart/' + chartCode });
                         }}/>}
-                        {!isPreview && editMode && <Icon type='delete' onClick={() => {
+                        {!isPreview && editMode && <Icon className={iconCls} type='delete' onClick={() => {
                             dispatch({ type: 'dashboardDesigner/deleteItem', item });
                         }} />}
-                        {isPreview && <Icon type="close" onClick={this.hidePreviewBox}/>}
+                        {isPreview && <Icon className={iconCls} type="close" onClick={this.hidePreviewBox}/>}
                     </div>
                 </div>
                 <ChartView tableBodyHeight={isPreview ? (this.state.screenHeight * 0.8 - 24 - 40 - 50 - 38) : 50 * layout.h - 30 - 50 -38} editMode={isPreview ? false : editMode} item={{...item}}/>
@@ -81,6 +83,7 @@ class ViewLayout extends React.PureComponent {
 
     hidePreviewBox = () => {
         this.setState({
+            previewItem: null,
             visiblePreviewBox: false
         });
     }
@@ -118,7 +121,8 @@ class ViewLayout extends React.PureComponent {
                 keyboard={true}
                 maskClosable={true}
                 >
-                {previewItem && this.createElement(previewItem, true)}
+                {/* {!!previewItem && this.createElement(previewItem, true)} */}
+                {!!previewItem && this.createElement(dashboardDesigner.items.find(item => item.code === previewItem.code), true)}
             </Modal>
         </div>);
     }

src/components/datasource/dataSource.jsx

@@ -480,7 +480,7 @@ class DataSource extends React.Component {
                             }}
                             onlyAdmin={true}
                         />
-                        <DeleteBox
+                        {visibleDeleteBox && <DeleteBox
                             visibleDeleteBox={visibleDeleteBox}
                             type='datasource'
                             hideBox={() => {
@@ -489,9 +489,9 @@ class DataSource extends React.Component {
                                 })
                             }}
                             selectedRecord={selectedRecord}
-                            onOk={() =>{
+                            okHandler={() =>{
                                 dispatch({ type: 'dataSource/remoteDelete', code: selectedRecord.code })
-                        }} />
+                        }} />}
                         {visibleDataPreviewBox && <DataPreview
                             visibleBox={visibleDataPreviewBox}
                             hideBox={() => {

src/models/chart.js

@@ -177,7 +177,6 @@ export default {
                 console.log('解析图表数据', code, res);
                 if(!res.err && res.data.code > 0) {
                     let resData = res.data.data;
-                    let groupBy = JSON.parse(resData.groupBy) || [];
                     let chartConfig = JSON.parse(resData.chartConfig || '{ "xAxis": { "column": {}, "granularity": {} }, "yAxis": { "column": {}, "gauge": {} } }');
                     let styleConfig = JSON.parse(resData.style || '{}');
                     let otherConfig = JSON.parse(resData.otherConfig || '{}');
@@ -186,7 +185,7 @@ export default {
                     let chartOption = JSON.parse(resData.chartOption || '{}');
 
                     let data = {
-                        code: resData.chartId,
+                        code: resData.chartId + '',
                         creatorCode: resData.createId+'',
                         creatorName: resData.createBy,
                         header: {
@@ -194,7 +193,7 @@ export default {
                         },
                         baseConfig: {
                             dataSource: {
-                                code: resData.dataId,
+                                code: resData.dataId + '',
                                 name: resData.dataName,
                             },
                             viewType: viewType
@@ -208,35 +207,15 @@ export default {
                     }
 
                     if(viewType === 'bar') {
-                        data.barConfig = { ...chartConfig, groupBy: groupBy.map(g => {
-                            return {
-                                key: g.columnName.toLowerCase(),
-                                label: g.columnRename
-                            }
-                        })[0] };
+                        data.barConfig = chartConfig;
                     }else if(viewType === 'pie') {
                         data.pieConfig = chartConfig;
                     }else if(viewType === 'line') {
-                        data.lineConfig = { ...chartConfig, groupBy: groupBy.map(g => {
-                            return {
-                                key: g.columnName.toLowerCase(),
-                                label: g.columnRename
-                            }
-                        })[0] };
+                        data.lineConfig = chartConfig;
                     }else if(viewType === 'scatter') {
-                        data.scatterConfig = { ...chartConfig, groupBy: groupBy.map(g => {
-                            return {
-                                key: g.columnName.toLowerCase(),
-                                label: g.columnRename
-                            }
-                        })[0] };
+                        data.scatterConfig = chartConfig;
                     }else if(viewType === 'aggregateTable') {
-                        data.aggregateTableConfig = { ...chartConfig, groupBy: groupBy.map(g => {
-                            return {
-                                key: g.columnName.toLowerCase(),
-                                label: g.columnRename
-                            }
-                        }) };
+                        data.aggregateTableConfig = chartConfig;
                     }else if(viewType === 'dataView') {
                         data.dataViewConfig = chartConfig;
                     }
@@ -268,7 +247,7 @@ export default {
                     chartName: header.label,
                     dataId: baseConfig.dataSource.code,
                     describes: description,
-                    style: '',
+                    style: '{}',
                     otherConfig: JSON.stringify(otherConfig),
                     chartsGroup: group ? group : '-1',
                     filters: JSON.stringify(filters),
@@ -277,36 +256,18 @@ export default {
                 if(baseConfig.viewType === 'bar') {
                     body.chartType = 'Histogram';
                     body.chartConfig = JSON.stringify(barConfig);
-                    body.groupBy = barConfig.groupBy.key ? [{
-                        columnName: barConfig.groupBy.key,
-                        columnRename: barConfig.groupBy.label
-                    }] : []
                 }else if(baseConfig.viewType === 'pie') {
                     body.chartType = 'Pie';
                     body.chartConfig = JSON.stringify(pieConfig);
                 }else if(baseConfig.viewType === 'line') {
                     body.chartType = 'Line';
                     body.chartConfig = JSON.stringify(lineConfig);
-                    body.groupBy = lineConfig.groupBy.key ? [{
-                        columnName: lineConfig.groupBy.key,
-                        columnRename: lineConfig.groupBy.label
-                    }] : []
                 }else if(baseConfig.viewType === 'scatter') {
                     body.chartType = 'scatter';
                     body.chartConfig = JSON.stringify(scatterConfig);
-                    body.groupBy = scatterConfig.groupBy.key ? [{
-                        columnName: scatterConfig.groupBy.key,
-                        columnRename: scatterConfig.groupBy.label
-                    }] : []
                 }else if(baseConfig.viewType === 'aggregateTable') {
                     body.chartType = 'population';
                     body.chartConfig = JSON.stringify(aggregateTableConfig);
-                    body.groupBy = aggregateTableConfig.groupBy && aggregateTableConfig.groupBy.length > 0 ? aggregateTableConfig.groupBy.map(g => {
-                        return {
-                            columnName: g.key,
-                            columnRename: g.label
-                        }
-                    }) : []
                 }else if(baseConfig.viewType === 'dataView') {
                     body.chartType = 'individual';
                     body.chartConfig = JSON.stringify(dataViewConfig);
@@ -350,36 +311,18 @@ export default {
                 if(baseConfig.viewType === 'bar') {
                     body.chartType = 'Histogram';
                     body.chartConfig = JSON.stringify(barConfig);
-                    body.groupBy = barConfig.groupBy && barConfig.groupBy.key ? [{
-                        columnName: barConfig.groupBy.key,
-                        columnRename: barConfig.groupBy.label
-                    }] : []
                 }else if(baseConfig.viewType === 'pie') {
                     body.chartType = 'Pie';
                     body.chartConfig = JSON.stringify(pieConfig);
                 }else if(baseConfig.viewType === 'line') {
                     body.chartType = 'Line';
                     body.chartConfig = JSON.stringify(lineConfig);
-                    body.groupBy = lineConfig.groupBy && lineConfig.groupBy.key ? [{
-                        columnName: lineConfig.groupBy.key,
-                        columnRename: lineConfig.groupBy.label
-                    }] : []
                 }else if(baseConfig.viewType === 'scatter') {
                     body.chartType = 'scatter';
                     body.chartConfig = JSON.stringify(scatterConfig);
-                    body.groupBy = scatterConfig.groupBy && scatterConfig.groupBy.key ? [{
-                        columnName: scatterConfig.groupBy.key,
-                        columnRename: scatterConfig.groupBy.label
-                    }] : []
                 }else if(baseConfig.viewType === 'aggregateTable') {
                     body.chartType = 'population';
                     body.chartConfig = JSON.stringify(aggregateTableConfig);
-                    body.groupBy = aggregateTableConfig.groupBy && aggregateTableConfig.groupBy.length > 0 ? aggregateTableConfig.groupBy.map(g => {
-                        return {
-                            columnName: g.key,
-                            columnRename: g.label
-                        }
-                    }) : []
                 }else if(baseConfig.viewType === 'dataView') {
                     body.chartType = 'individual';
                     body.chartConfig = JSON.stringify(dataViewConfig);

src/models/chartDesigner.js

@@ -126,7 +126,6 @@ export default {
         setDirty(state, action) {
             const { dirty } = action;
             let newState = Object.assign({}, state, { dirty });
-            console.log(newState);
             return newState;
         }
     },
@@ -180,18 +179,10 @@ export default {
                 yield put({ type: 'silentSetFields', fields: [
                     { name: 'baseConfig', value: { dataSource: dataSource.code, viewType: '' } }
                 ] });
-                const chartDesigner = yield select(state => state.present.chartDesigner);
-                const { baseConfig, styleConfig } = chartDesigner;
-
                 let body = {
                     chartName: dataSource.name + '_未命名',
-                    dataId: baseConfig.dataSource,
-                    groupBy: baseConfig.groupBy && baseConfig.groupBy.key ? [{
-                        columnName: baseConfig.groupBy.key,
-                        columnRamane: baseConfig.groupBy.label
-                    }] : [],
+                    dataId: dataSource.code,
                     describes: '',
-                    style: JSON.stringify(styleConfig),
                     chartConfig: '{}',
                     chartType: '',
                 };
@@ -221,49 +212,34 @@ export default {
                 yield put({ type: 'chart/remoteModify' });
                 const { newHeaderLabel } = action;
                 const chartDesigner = yield select(state => state.present.chartDesigner);
-                const { baseConfig, pieConfig, lineConfig, barConfig, scatterConfig, aggregateTableConfig,
-                    dataViewConfig, otherConfig, description, group, styleConfig } = chartDesigner;
+                const { filters, baseConfig, pieConfig, lineConfig, aggregateTableConfig, dataViewConfig,
+                    barConfig, scatterConfig, otherConfig, description, group, chartOption, fetchConfig, styleConfig } = chartDesigner;
                 let body = {
+                    filters: JSON.stringify(filters),
                     chartName: newHeaderLabel,
-                    dataId: baseConfig.dataSource,
+                    dataId: baseConfig.dataSource.code,
                     describes: description || '',
                     style: JSON.stringify(styleConfig),
                     otherConfig: JSON.stringify(otherConfig),
-                    chartsGroup: group ? group : '-1',
+                    chartsGroup: group+'' ? group : '-1',
+                    chartOption: JSON.stringify(chartOption),
+                    fetchConfig: JSON.stringify(fetchConfig),
                 }; // 基本属性
                 if(baseConfig.viewType === 'bar') {
                     body.chartType = 'Histogram';
                     body.chartConfig = JSON.stringify(barConfig);
-                    body.groupBy = barConfig.groupBy ? [{
-                        columnName: barConfig.groupBy.key,
-                        columnRamane: barConfig.groupBy.label
-                    }] : [];
                 }else if(baseConfig.viewType === 'pie') {
                     body.chartType = 'Pie';
                     body.chartConfig = JSON.stringify(pieConfig);
                 }else if(baseConfig.viewType === 'line') {
                     body.chartType = 'Line';
                     body.chartConfig = JSON.stringify(lineConfig);
-                    body.groupBy = lineConfig.groupBy ? [{
-                        columnName: lineConfig.groupBy.key,
-                        columnRamane: lineConfig.groupBy.label
-                    }] : [];
                 }else if(baseConfig.viewType === 'scatter') {
                     body.chartType = 'scatter';
                     body.chartConfig = JSON.stringify(scatterConfig);
-                    body.groupBy = scatterConfig.groupBy ? [{
-                        columnName: scatterConfig.groupBy.key,
-                        columnRamane: scatterConfig.groupBy.label
-                    }] : [];
                 }else if(baseConfig.viewType === 'aggregateTable') {
                     body.chartType = 'population';
                     body.chartConfig = JSON.stringify(aggregateTableConfig);
-                    body.groupBy = aggregateTableConfig.groupBy && aggregateTableConfig.groupBy.length > 0 ? aggregateTableConfig.groupBy.map(g => {
-                        return {
-                            columnName: g.key,
-                            columnRamane: g.label
-                        }
-                    }) : [];
                 }else if(baseConfig.viewType === 'dataView') {
                     body.chartType = 'individual';
                     body.chartConfig = JSON.stringify(dataViewConfig);;

src/models/dataSource.js

@@ -173,8 +173,8 @@ export default {
                         let dbConfig = JSON.parse(r.dbConfig);
                         let tags = JSON.parse(r.dataTag);
                         return {
-                            key: r.dataId,
-                            code: r.dataId,
+                            key: r.dataId + '',
+                            code: r.dataId + '',
                             name: r.dataName,
                             type: r.type || 'database',
                             dbType: dbConfig.databaseType,
@@ -267,10 +267,10 @@ export default {
                     let dbConfig = JSON.parse(resData.dbConfig);
                     let tags = JSON.parse(resData.dataTag);
                     let data = {
-                        code: resData.dataId,
+                        code: resData.dataId + '',
                         name: resData.dataName,
                         type: resData.type,
-                        connectCode: dbConfig.id,
+                        connectCode: dbConfig.id + '',
                         dbType: dbConfig.databaseType,
                         dbName: dbConfig.dataName,
                         address: dbConfig.addrass,

src/models/userGroup.js

@@ -100,7 +100,7 @@ export default {
                 console.log('请求用户组列表', res);
                 if(!res.err && res.data.code > 0) {
                     const list = res.data.data.map(d => ({
-                        code: d.id+'',
+                        code: d.id + '',
                         name: d.userGroupName,
                         description: d.userGroupNote,
                         createTime: new Date(d.createDate),
@@ -131,7 +131,7 @@ export default {
                 });
                 if(!res.err && res.data.code > 0) {
                     yield put({ type: 'add', group: {
-                        code: res.data.data+'',
+                        code: res.data.data + '',
                         name: newOne.name,
                         description: newOne.description,
                         member: []
@@ -219,7 +219,7 @@ export default {
                 console.log('请求用户组成员列表', groupCode, res);
                 if(!res.err && res.data.code > 0) {
                     const memberList = res.data.data.map(d => ({
-                        code: d.id,
+                        code: d.id + '',
                         name: d.name,
                         role: d.role
                     }));