数据源前台过滤/图表编辑界面离开前提示保存修改

src/components/chartDesigner/charts/resolveChartOption.js

@@ -4,19 +4,19 @@ export default (config) => {
     let option = {}
     switch(viewType) {
         case 'bar': {
-            option = barConfig(data ? data.data : {});
+            option = barConfig(data ? data.data: {});
             break;
         }
         case 'pie': {
-            option = pieConfig(data ? data.data : {});
+            option = pieConfig(data ? data.data: {});
             break;
         }
         case 'line': {
-            option = lineConfig(data ? data.data : {});
+            option = lineConfig(data ? data.data: {});
             break;
         }
         case 'scatter': {
-            option = scatterConfig();
+            option = scatterConfig(data? data.data: {});
             break;
         }
         default:{
@@ -39,7 +39,7 @@ function barConfig(data) {
             }
         },
         legend: {
-            show: false
+            show: true
         },
         xAxis: [{
             type: 'category',
@@ -101,6 +101,9 @@ function lineConfig(data) {
                 type: 'cross'
             }
         },
+        legend: {
+            show: true
+        },
         xAxis:  {
             name: xTitle,
             type: 'time'
@@ -124,23 +127,11 @@ function lineConfig(data) {
     return o;
 }
 
-function scatterConfig() {
+function scatterConfig(data) {
+    const { serieses, xTitle, yTitle } = data;
     let o = {
         tooltip : {
-            // trigger: 'axis',
             showDelay : 0,
-            formatter : function (params) {
-                if (params.value.length > 1) {
-                    return params.seriesName + ' :<br/>'
-                    + params.value[0] + 'cm '
-                    + params.value[1] + 'kg ';
-                }
-                else {
-                    return params.seriesName + ' :<br/>'
-                    + params.name + ' : '
-                    + params.value + 'kg ';
-                }
-            },
             axisPointer:{
                 show: true,
                 type : 'cross',
@@ -151,16 +142,13 @@ function scatterConfig() {
             }
         },
         legend: {
-            data: ['女性','男性'],
-            left: 'center'
+            show: true
         },
         xAxis : [
             {
                 type : 'value',
+                name: xTitle,
                 scale:true,
-                axisLabel : {
-                    formatter: '{value} cm'
-                },
                 splitLine: {
                     show: false
                 }
@@ -169,129 +157,22 @@ function scatterConfig() {
         yAxis : [
             {
                 type : 'value',
+                name: yTitle,
                 scale:true,
-                axisLabel : {
-                    formatter: '{value} kg'
-                },
                 splitLine: {
                     show: false
                 }
             }
         ],
-        series : [
-            {
-                name:'女性',
-                type:'scatter',
-                data: [[161.2, 51.6], [167.5, 59.0], [159.5, 49.2], [157.0, 63.0], [155.8, 53.6],
-                    [170.0, 59.0], [159.1, 47.6], [166.0, 69.8], [176.2, 66.8], [160.2, 75.2],
-                    [172.5, 55.2], [170.9, 54.2], [172.9, 62.5], [153.4, 42.0], [160.0, 50.0],
-                    [147.2, 49.8], [168.2, 49.2], [175.0, 73.2], [157.0, 47.8], [167.6, 68.8],
-                    [159.5, 50.6], [175.0, 82.5], [166.8, 57.2], [176.5, 87.8], [170.2, 72.8],
-                    [174.0, 54.5], [173.0, 59.8], [179.9, 67.3], [170.5, 67.8], [160.0, 47.0],
-                    [154.4, 46.2], [162.0, 55.0], [176.5, 83.0], [160.0, 54.4], [152.0, 45.8],
-                    [162.1, 53.6], [170.0, 73.2], [160.2, 52.1], [161.3, 67.9], [166.4, 56.6],
-                    [168.9, 62.3], [163.8, 58.5], [167.6, 54.5], [160.0, 50.2], [161.3, 60.3],
-                    [167.6, 58.3], [165.1, 56.2], [160.0, 50.2], [170.0, 72.9], [157.5, 59.8],
-                    [167.6, 61.0], [160.7, 69.1], [163.2, 55.9], [152.4, 46.5], [157.5, 54.3],
-                    [168.3, 54.8], [180.3, 60.7], [165.5, 60.0], [165.0, 62.0], [164.5, 60.3],
-                    [156.0, 52.7], [160.0, 74.3], [163.0, 62.0], [165.7, 73.1], [161.0, 80.0],
-                    [162.0, 54.7], [166.0, 53.2], [174.0, 75.7], [172.7, 61.1], [167.6, 55.7],
-                    [151.1, 48.7], [164.5, 52.3], [163.5, 50.0], [152.0, 59.3], [169.0, 62.5],
-                    [164.0, 55.7], [161.2, 54.8], [155.0, 45.9], [170.0, 70.6], [176.2, 67.2],
-                    [170.0, 69.4], [162.5, 58.2], [170.3, 64.8], [164.1, 71.6], [169.5, 52.8],
-                    [163.2, 59.8], [154.5, 49.0], [159.8, 50.0], [173.2, 69.2], [170.0, 55.9],
-                    [161.4, 63.4], [169.0, 58.2], [166.2, 58.6], [159.4, 45.7], [162.5, 52.2],
-                    [159.0, 48.6], [162.8, 57.8], [159.0, 55.6], [179.8, 66.8], [162.9, 59.4],
-                    [161.0, 53.6], [151.1, 73.2], [168.2, 53.4], [168.9, 69.0], [173.2, 58.4],
-                    [171.8, 56.2], [178.0, 70.6], [164.3, 59.8], [163.0, 72.0], [168.5, 65.2],
-                    [166.8, 56.6], [172.7, 105.2], [163.5, 51.8], [169.4, 63.4], [167.8, 59.0],
-                    [159.5, 47.6], [167.6, 63.0], [161.2, 55.2], [160.0, 45.0], [163.2, 54.0],
-                    [162.2, 50.2], [161.3, 60.2], [149.5, 44.8], [157.5, 58.8], [163.2, 56.4],
-                    [172.7, 62.0], [155.0, 49.2], [156.5, 67.2], [164.0, 53.8], [160.9, 54.4],
-                    [162.8, 58.0], [167.0, 59.8], [160.0, 54.8], [160.0, 43.2], [168.9, 60.5],
-                    [158.2, 46.4], [156.0, 64.4], [160.0, 48.8], [167.1, 62.2], [158.0, 55.5],
-                    [167.6, 57.8], [156.0, 54.6], [162.1, 59.2], [173.4, 52.7], [159.8, 53.2],
-                    [170.5, 64.5], [159.2, 51.8], [157.5, 56.0], [161.3, 63.6], [162.6, 63.2],
-                    [160.0, 59.5], [168.9, 56.8], [165.1, 64.1], [162.6, 50.0], [165.1, 72.3],
-                    [166.4, 55.0], [160.0, 55.9], [152.4, 60.4], [170.2, 69.1], [162.6, 84.5],
-                    [170.2, 55.9], [158.8, 55.5], [172.7, 69.5], [167.6, 76.4], [162.6, 61.4],
-                    [167.6, 65.9], [156.2, 58.6], [175.2, 66.8], [172.1, 56.6], [162.6, 58.6],
-                    [160.0, 55.9], [165.1, 59.1], [182.9, 81.8], [166.4, 70.7], [165.1, 56.8],
-                    [177.8, 60.0], [165.1, 58.2], [175.3, 72.7], [154.9, 54.1], [158.8, 49.1],
-                    [172.7, 75.9], [168.9, 55.0], [161.3, 57.3], [167.6, 55.0], [165.1, 65.5],
-                    [175.3, 65.5], [157.5, 48.6], [163.8, 58.6], [167.6, 63.6], [165.1, 55.2],
-                    [165.1, 62.7], [168.9, 56.6], [162.6, 53.9], [164.5, 63.2], [176.5, 73.6],
-                    [168.9, 62.0], [175.3, 63.6], [159.4, 53.2], [160.0, 53.4], [170.2, 55.0],
-                    [162.6, 70.5], [167.6, 54.5], [162.6, 54.5], [160.7, 55.9], [160.0, 59.0],
-                    [157.5, 63.6], [162.6, 54.5], [152.4, 47.3], [170.2, 67.7], [165.1, 80.9],
-                    [172.7, 70.5], [165.1, 60.9], [170.2, 63.6], [170.2, 54.5], [170.2, 59.1],
-                    [161.3, 70.5], [167.6, 52.7], [167.6, 62.7], [165.1, 86.3], [162.6, 66.4],
-                    [152.4, 67.3], [168.9, 63.0], [170.2, 73.6], [175.2, 62.3], [175.2, 57.7],
-                    [160.0, 55.4], [165.1, 104.1], [174.0, 55.5], [170.2, 77.3], [160.0, 80.5],
-                    [167.6, 64.5], [167.6, 72.3], [167.6, 61.4], [154.9, 58.2], [162.6, 81.8],
-                    [175.3, 63.6], [171.4, 53.4], [157.5, 54.5], [165.1, 53.6], [160.0, 60.0],
-                    [174.0, 73.6], [162.6, 61.4], [174.0, 55.5], [162.6, 63.6], [161.3, 60.9],
-                    [156.2, 60.0], [149.9, 46.8], [169.5, 57.3], [160.0, 64.1], [175.3, 63.6],
-                    [169.5, 67.3], [160.0, 75.5], [172.7, 68.2], [162.6, 61.4], [157.5, 76.8],
-                    [176.5, 71.8], [164.4, 55.5], [160.7, 48.6], [174.0, 66.4], [163.8, 67.3]
-                ],
-            },
-            {
-                name:'男性',
-                type:'scatter',
-                data: [[174.0, 65.6], [175.3, 71.8], [193.5, 80.7], [186.5, 72.6], [187.2, 78.8],
-                    [181.5, 74.8], [184.0, 86.4], [184.5, 78.4], [175.0, 62.0], [184.0, 81.6],
-                    [180.0, 76.6], [177.8, 83.6], [192.0, 90.0], [176.0, 74.6], [174.0, 71.0],
-                    [184.0, 79.6], [192.7, 93.8], [171.5, 70.0], [173.0, 72.4], [176.0, 85.9],
-                    [176.0, 78.8], [180.5, 77.8], [172.7, 66.2], [176.0, 86.4], [173.5, 81.8],
-                    [178.0, 89.6], [180.3, 82.8], [180.3, 76.4], [164.5, 63.2], [173.0, 60.9],
-                    [183.5, 74.8], [175.5, 70.0], [188.0, 72.4], [189.2, 84.1], [172.8, 69.1],
-                    [170.0, 59.5], [182.0, 67.2], [170.0, 61.3], [177.8, 68.6], [184.2, 80.1],
-                    [186.7, 87.8], [171.4, 84.7], [172.7, 73.4], [175.3, 72.1], [180.3, 82.6],
-                    [182.9, 88.7], [188.0, 84.1], [177.2, 94.1], [172.1, 74.9], [167.0, 59.1],
-                    [169.5, 75.6], [174.0, 86.2], [172.7, 75.3], [182.2, 87.1], [164.1, 55.2],
-                    [163.0, 57.0], [171.5, 61.4], [184.2, 76.8], [174.0, 86.8], [174.0, 72.2],
-                    [177.0, 71.6], [186.0, 84.8], [167.0, 68.2], [171.8, 66.1], [182.0, 72.0],
-                    [167.0, 64.6], [177.8, 74.8], [164.5, 70.0], [192.0, 101.6], [175.5, 63.2],
-                    [171.2, 79.1], [181.6, 78.9], [167.4, 67.7], [181.1, 66.0], [177.0, 68.2],
-                    [174.5, 63.9], [177.5, 72.0], [170.5, 56.8], [182.4, 74.5], [197.1, 90.9],
-                    [180.1, 93.0], [175.5, 80.9], [180.6, 72.7], [184.4, 68.0], [175.5, 70.9],
-                    [180.6, 72.5], [177.0, 72.5], [177.1, 83.4], [181.6, 75.5], [176.5, 73.0],
-                    [175.0, 70.2], [174.0, 73.4], [165.1, 70.5], [177.0, 68.9], [192.0, 102.3],
-                    [176.5, 68.4], [169.4, 65.9], [182.1, 75.7], [179.8, 84.5], [175.3, 87.7],
-                    [184.9, 86.4], [177.3, 73.2], [167.4, 53.9], [178.1, 72.0], [168.9, 55.5],
-                    [157.2, 58.4], [180.3, 83.2], [170.2, 72.7], [177.8, 64.1], [172.7, 72.3],
-                    [165.1, 65.0], [186.7, 86.4], [165.1, 65.0], [174.0, 88.6], [175.3, 84.1],
-                    [185.4, 66.8], [177.8, 75.5], [180.3, 93.2], [180.3, 82.7], [177.8, 58.0],
-                    [177.8, 79.5], [177.8, 78.6], [177.8, 71.8], [177.8, 116.4], [163.8, 72.2],
-                    [188.0, 83.6], [198.1, 85.5], [175.3, 90.9], [166.4, 85.9], [190.5, 89.1],
-                    [166.4, 75.0], [177.8, 77.7], [179.7, 86.4], [172.7, 90.9], [190.5, 73.6],
-                    [185.4, 76.4], [168.9, 69.1], [167.6, 84.5], [175.3, 64.5], [170.2, 69.1],
-                    [190.5, 108.6], [177.8, 86.4], [190.5, 80.9], [177.8, 87.7], [184.2, 94.5],
-                    [176.5, 80.2], [177.8, 72.0], [180.3, 71.4], [171.4, 72.7], [172.7, 84.1],
-                    [172.7, 76.8], [177.8, 63.6], [177.8, 80.9], [182.9, 80.9], [170.2, 85.5],
-                    [167.6, 68.6], [175.3, 67.7], [165.1, 66.4], [185.4, 102.3], [181.6, 70.5],
-                    [172.7, 95.9], [190.5, 84.1], [179.1, 87.3], [175.3, 71.8], [170.2, 65.9],
-                    [193.0, 95.9], [171.4, 91.4], [177.8, 81.8], [177.8, 96.8], [167.6, 69.1],
-                    [167.6, 82.7], [180.3, 75.5], [182.9, 79.5], [176.5, 73.6], [186.7, 91.8],
-                    [188.0, 84.1], [188.0, 85.9], [177.8, 81.8], [174.0, 82.5], [177.8, 80.5],
-                    [171.4, 70.0], [185.4, 81.8], [185.4, 84.1], [188.0, 90.5], [188.0, 91.4],
-                    [182.9, 89.1], [176.5, 85.0], [175.3, 69.1], [175.3, 73.6], [188.0, 80.5],
-                    [188.0, 82.7], [175.3, 86.4], [170.5, 67.7], [179.1, 92.7], [177.8, 93.6],
-                    [175.3, 70.9], [182.9, 75.0], [170.8, 93.2], [188.0, 93.2], [180.3, 77.7],
-                    [177.8, 61.4], [185.4, 94.1], [168.9, 75.0], [185.4, 83.6], [180.3, 85.5],
-                    [174.0, 73.9], [167.6, 66.8], [182.9, 87.3], [160.0, 72.3], [180.3, 88.6],
-                    [167.6, 75.5], [186.7, 101.4], [175.3, 91.1], [175.3, 67.3], [175.9, 77.7],
-                    [175.3, 81.8], [179.1, 75.5], [181.6, 84.5], [177.8, 76.6], [182.9, 85.0],
-                    [177.8, 102.5], [184.2, 77.3], [179.1, 71.8], [176.5, 87.9], [188.0, 94.3],
-                    [174.0, 70.9], [167.6, 64.5], [170.2, 77.3], [167.6, 72.3], [188.0, 87.3],
-                    [174.0, 80.0], [176.5, 82.3], [180.3, 73.6], [167.6, 74.1], [188.0, 85.9],
-                    [180.3, 73.2], [167.6, 76.3], [183.0, 65.9], [183.0, 90.9], [179.1, 89.1],
-                    [170.2, 62.3], [177.8, 82.7], [179.1, 79.1], [190.5, 98.2], [177.8, 84.1],
-                    [180.3, 83.2], [180.3, 83.2]
-                ],
+        series : serieses.map(s => {
+            return {
+                name: s.name,
+                type: 'scatter',
+                data: s.mdata.map(m => {
+                    return [m.date, m.value]
+                })
             }
-        ]
+        })
     };
     return o;
 }

src/components/chartDesigner/content.jsx

@@ -8,8 +8,9 @@ import PieConfigForm from './sections/pieConfigForm'
 import LineConfigForm from './sections/lineConfigForm'
 import TableView from './charts/table'
 import ScatterConfigForm from './sections/ScatterConfigForm'
+import StyleConfigForm from './sections/styleConfigForm'
+import OtherConfigForm from './sections/otherConfigForm'
 import EchartsView from './charts/echartsView'
-import StyleEditor from './sections/styleEditor'
 import ToolBar from './sections/toolbar'
 import { connect } from 'dva'
 import '../../models/chartDesigner'
@@ -46,7 +47,7 @@ class ChartDesignerContent extends React.Component {
             configForm = (<PieConfigForm formItemLayout={formItemLayout}/>);
             chartView = (<EchartsView />);
         }else if(viewType === 'scatter') {
-            // configForm = (<ScatterConfigForm formItemLayout={formItemLayout}/>);
+            configForm = (<ScatterConfigForm formItemLayout={formItemLayout}/>);
             chartView = (<EchartsView />);
         }
 
@@ -58,14 +59,17 @@ class ChartDesignerContent extends React.Component {
                             <BaseConfigForm formItemLayout={formItemLayout}/>
                             { configForm }
                         </TabPane>
-                        <TabPane className='otherconfig' tab='其他设置' key='2'>
-                            <StyleEditor formItemLayout={formItemLayout}/>
+                        <TabPane className='styleconfig' tab='样式设置' key='2'>
+                            <StyleConfigForm formItemLayout={formItemLayout}/>
+                        </TabPane>
+                        <TabPane className='otherconfig' tab='其他设置' key='3'>
+                            <OtherConfigForm formItemLayout={formItemLayout}/>
                         </TabPane>
                     </Tabs>
                     <Footer className='sider-footer'>
                         <div className='fresh-bar'>
                             <Switch defaultChecked checkedChildren='自动刷新' unCheckedChildren='手动刷新' onChange={(checked) => {
-                                // 设为自动刷新后立即请求一次数据
+                                // 自动刷新后立即请求一次数据
                                 if(checked) {
                                     dispatch({ type: 'chartDesigner/fetchChartData' });
                                 }

src/components/chartDesigner/header.jsx

@@ -1,58 +1,103 @@
 import React from 'react'
-import { Input, Icon, Button } from 'antd'
+import { Input, Icon, Button, Popconfirm } from 'antd'
 import { connect } from 'dva'
 import { ActionCreators } from 'redux-undo'
 import '../../models/chartDesigner'
 import './header.less'
 
-const Header = ({ chartDesigner, dispatch }) => {
-    return (
-        <div className='header'>
-            <div className='header-item toolbar-back'>
-                <Button onClick={() => {
-                    dispatch({ type: 'main/redirect', path: '/chart' });
-                }}>
-                    <Icon type='left' />返回
-                </Button>
-            </div>
-            <div className='header-item toolbar-title'>
-                <Input
-                    className='input-title' 
-                    addonAfter={<Icon type="edit" 
-                        onClick={(e) => {
-                            const input = e.currentTarget.parentElement.parentElement.getElementsByTagName('input')[0];
-                            input && input.focus()
+class Header extends React.Component {
+    constructor(props) {
+        super(props);
+        this.state = {
+            visibleConfirm: false
+        }
+    }
+
+    handleVisibleChange = (visible) => {
+        this.setState({ visibleConfirm: visible });
+    }
+
+    render() {
+        const { past, chartDesigner, dispatch } = this.props;
+
+        return (
+            <div className='header'>
+                <div className='header-item toolbar-back'>
+                    <Popconfirm
+                        placement="bottomLeft"
+                        title="离开前保存修改吗？"
+                        visible={this.state.visibleConfirm}
+                        onVisibleChange={this.handleVisibleChange}
+                        onConfirm={() => {
+                            this.setState({
+                                visibleConfirm: false
+                            });
+                            dispatch({ type: 'chartDesigner/remoteModify' });
+                            dispatch({ type: 'main/redirect', path: '/chart' });
                         }}
-                    />}
-                    onChange={(e) => {
-                        dispatch({ type: 'chartDesigner/setField', name: 'header', value: { label: e.target.value } });
-                    }}
-                    value={chartDesigner.header.label}
-                />
-            </div>
-            <div className='header-item toolbar-buttons'>
-                <div className=''>
-                    <Button className='button-uodo' icon='undo' onClick={() => {
-                        dispatch(ActionCreators.undo());
-                    }}>撤销</Button>
-                    <Button className='button-redo' icon='redo' onClick={() => {
-                        dispatch(ActionCreators.redo());
-                    }}>重做</Button>
-                    <Button className='button-uodo' >预览</Button>
+                        onCancel={() => {
+                            this.setState({
+                                visibleConfirm: false
+                            });
+                            dispatch({ type: 'main/redirect', path: '/chart' });
+                        }}
+                        okText="是的"
+                        cancelText="不必了"
+                    >
+                        <Button onClick={() => {
+                            if(past.length > 0) {
+                                this.setState({
+                                    visibleConfirm: true
+                                });
+                            }else {
+                                dispatch({ type: 'main/redirect', path: '/chart' });
+                            }
+                        }}>
+                            <Icon type='left' />返回
+                        </Button>
+                    </Popconfirm>
                     <Button className='button-uodo' onClick={() => {
                         if(chartDesigner.code && chartDesigner.code !== -1) {
                             dispatch({ type: 'chartDesigner/remoteModify' });
                         }else {
                             dispatch({ type: 'chartDesigner/remoteAdd' });
                         }
-                    }}>保存</Button>
+                    }}><Icon type='save' />保存</Button>
+                </div>
+                <div className='header-item toolbar-title'>
+                    <Input
+                        className='input-title' 
+                        addonAfter={<Icon type="edit" 
+                            onClick={(e) => {
+                                const input = e.currentTarget.parentElement.parentElement.getElementsByTagName('input')[0];
+                                input && input.focus()
+                            }}
+                        />}
+                        onChange={(e) => {
+                            dispatch({ type: 'chartDesigner/setField', name: 'header', value: { label: e.target.value } });
+                        }}
+                        value={chartDesigner.header.label}
+                    />
+                </div>
+                <div className='header-item toolbar-buttons'>
+                    <div className=''>
+                        <Button className='button-uodo' icon='undo' onClick={() => {
+                            dispatch(ActionCreators.undo());
+                        }}>撤销</Button>
+                        <Button className='button-redo' icon='redo' onClick={() => {
+                            dispatch(ActionCreators.redo());
+                        }}>重做</Button>
+                        <Button className='button-uodo' >预览</Button>
+                    </div>
                 </div>
             </div>
-        </div>
-    )
+        );
+    }
 }
 
-function mapStateToProps({ present: { chartDesigner } }) {
-    return { chartDesigner: chartDesigner }
+function mapStateToProps(state) {
+    const chartDesigner = state.present.chartDesigner;
+    const past = state.past;
+    return { past, chartDesigner }
 }
 export default connect(mapStateToProps)(Header);

src/components/chartDesigner/sections/ScatterConfigForm.jsx

@@ -79,7 +79,7 @@ const ScatterConfigForm = ({ chartDesigner, dispatch, formItemLayout }) => {
 							column = { type: items[0].type, value: items[0].value, label: items[0].label };
 							gauge = { value: items[1].value, label: items[1].label };
 						}
-						dispatch({ type: 'chartDesigner/changeField', name: 'ScatterConfigForm', value: { ...chartDesigner.scatterConfig, yAxis: { column, gauge } } });
+						dispatch({ type: 'chartDesigner/changeField', name: 'scatterConfig', value: { ...chartDesigner.scatterConfig, yAxis: { column, gauge } } });
 					}}
 					displayRender={(label, selectedOptions) => {
 						let menu = selectedOptions.length > 0 ? <Menu

src/components/chartDesigner/sections/otherConfigForm.jsx

@@ -0,0 +1,33 @@
+import React from 'react'
+import { Form, Input } from 'antd'
+import { connect } from 'dva'
+import '../../../models/chartDesigner.js'
+import './otherConfigForm.less'
+const FormItem = Form.Item
+const InputTextArea = Input.TextArea
+
+const OtherConfigForm = ({ chartDesigner, dispatch, formItemLayout }) => {
+    return (
+        <Form className='form-otherconfig'>
+            <FormItem label='备注' {...formItemLayout}>
+                <InputTextArea
+                    className='inputarea-description'
+                    value={chartDesigner.otherConfig.description}
+                    autosize={{ minRows: 2, maxRows: 6 }}
+                    // onChange={(e) => {
+                    //     dispatch({ type: 'chartDesigner/setField', name: 'otherConfig', value: {
+                    //         ...chartDesigner.otherConfig,
+                    //         description: e.target.value
+                    //     } });
+                    // }}
+                />
+            </FormItem>
+        </Form>
+    );
+}
+
+function mapStateToProps({ present: {chartDesigner}}) {
+    return { chartDesigner };
+}
+
+export default connect(mapStateToProps)(OtherConfigForm);

src/components/chartDesigner/sections/otherConfigForm.less

@@ -0,0 +1,5 @@
+.form-otherconfig {
+    .inputarea-description {
+        margin-top: 4px;
+    }
+}

src/components/chartDesigner/sections/styleConfigForm.jsx

@@ -0,0 +1,21 @@
+import React from 'react'
+import { Form, Input } from 'antd'
+import { connect } from 'dva'
+import '../../../models/chartDesigner.js'
+const FormItem = Form.Item
+
+const StyleConfigForm = ({ chartDesigner, formItemLayout }) => {
+    return (
+        <Form>
+            <FormItem label='样式1' {...formItemLayout}>
+                <Input />
+            </FormItem>
+        </Form>
+    );
+}
+
+function mapStateToProps({ present: {chartDesigner}}) {
+    return { chartDesigner };
+}
+
+export default connect(mapStateToProps)(StyleConfigForm);

src/components/chartDesigner/sections/styleEditor.jsx

@@ -1,22 +0,0 @@
-import React from 'react';
-import { Form, Input } from 'antd';
-const FormItem = Form.Item;
-
-class StyleManager extends React.Component {
-    constructor(props) {
-        super(props);
-        this.state = {};
-    }
-
-    render() {
-        const { formItemLayout } = this.props;
-        return (
-            <Form>
-                <FormItem label='图例' {...formItemLayout}>
-                    <Input />
-                </FormItem>
-            </Form>
-        );
-    }
-}
-export default Form.create()(StyleManager);

src/components/datasource/baseConfig.jsx

@@ -33,6 +33,7 @@ const DataSourceBaseConfig = ({ dataSource, dataConnect, dispatch, mode }) => {
                         <Divider orientation="left">连接配置</Divider>
                         <FormItem label='数据库类型' {...formItemLayout}>
                             <Select
+                                disabled
                                 value={dataSource.newOne.dbType}
                                 onChange={(value) => {
                                     dispatch({ type: 'dataSource/setNewModelField', name: 'dbType', value: value} );
@@ -59,6 +60,7 @@ const DataSourceBaseConfig = ({ dataSource, dataConnect, dispatch, mode }) => {
                                     wrapperCol: { span: 19 }
                                 }}>
                                     <Input
+                                        disabled
                                         value={dataSource.newOne.address}
                                         onChange={(e) => {
                                             dispatch({ type: 'dataSource/setNewModelField', name: 'address', value: e.target.value });
@@ -72,6 +74,7 @@ const DataSourceBaseConfig = ({ dataSource, dataConnect, dispatch, mode }) => {
                                     wrapperCol: { span: 12 }
                                 }}>
                                     <InputNumber
+                                        disabled
                                         value={dataSource.newOne.port}
                                         onChange={(value) => {
                                             dispatch({ type: 'dataSource/setNewModelField', name: 'port', value: value });
@@ -82,6 +85,7 @@ const DataSourceBaseConfig = ({ dataSource, dataConnect, dispatch, mode }) => {
                         </Row>
                         <FormItem label='数据库名' {...formItemLayout}>
                             <Input
+                                disabled
                                 value={dataSource.newOne.dbName}
                                 onChange={(e) => {
                                     dispatch({ type: 'dataSource/setNewModelField', name: 'dbName', value: e.target.value });
@@ -95,6 +99,7 @@ const DataSourceBaseConfig = ({ dataSource, dataConnect, dispatch, mode }) => {
                                     wrapperCol: { span: 16 }
                                 }}>
                                     <Input
+                                        disabled
                                         value={dataSource.newOne.userName}
                                         onChange={(e) => {
                                             dispatch({ type: 'dataSource/setNewModelField', name: 'userName', value: e.target.value });
@@ -108,8 +113,8 @@ const DataSourceBaseConfig = ({ dataSource, dataConnect, dispatch, mode }) => {
                                     wrapperCol: { span: 16 }
                                 }}>
                                     <Input
+                                        disabled
                                         // value={dataSource.newOne.password}
-                                        emptyText='********'
                                         onChange={(e) => {
                                             let value = e.target.value;
                                             dispatch({ type: 'dataSource/setNewModelField', name: 'password', value: value });

src/components/datasource/dataSource.jsx

@@ -12,11 +12,10 @@ class DataSource extends React.Component {
     constructor(props) {
         super(props);
         this.state = {
+            list: props.dataSource.list,
             loading: false,
-            activeTab: 'dataSource',
-            visibleCreateBox: false,
-            selectedDataSourceCode: -1, // 当前选中的dataSource的code
-            filterDropdownVisible: false,
+            selectedRecord: null, // 当前选中的dataSource
+            filterLabel: '',
             search: {} // 搜索条件
         }
     };
@@ -30,7 +29,6 @@ class DataSource extends React.Component {
      */
     setScrollTableHeight() {
         const mainContent = document.getElementsByClassName('main-content')[0];
-        //const tabBar = mainContent.getElementsByClassName('datasource-view')[0];
         const toolbar = mainContent.getElementsByClassName('datasource-tools')[0];
         const tableHeader = mainContent.getElementsByClassName('ant-table-header')[0];
         const tableBody = mainContent.getElementsByClassName('ant-table-body')[0];
@@ -44,52 +42,40 @@ class DataSource extends React.Component {
         this.setState({ search: newSearch });
     }
 
-    onSearch = () => {
+    onSearch = (value) => {
         this.setState({
-          filterDropdownVisible: false
+          filterLabel: value
         });
       }
 
     render() {
         
         const { dataSource, dispatch } = this.props;
-        const { loading, activeTab, selectedDataSourceCode } = this.state;
+        const { list, loading, selectedRecord } = this.state;
         
         const moreOperatingMenu = (
             <Menu className='operationmenu'>
                 <Menu.Item
                     onClick={() => {
-                        dispatch({ type: 'main/redirect', path: '/chart/create' });
-                        dispatch({ type: 'chartDesigner/changeDataSource', value: {
-                            dataSource: selectedDataSourceCode,
-                            viewType: 'bar'
-                        } });
+                        dispatch({ type: 'chartDesigner/remoteQucikAdd', dataSource: selectedRecord });
                     }}
                 >
                     <Icon type="file-add" />创建图表
                 </Menu.Item>
                 <Menu.Item
                     onClick={(e) => {
-                        let selectedModel = dataSource.list.find((i) => { return i.code === selectedDataSourceCode })
+                        let selectedModel = dataSource.list.find((i) => { return i.code === selectedRecord.code })
                         dispatch({type: 'main/redirect', path: {pathname: '/datasource/'+ selectedModel.type +'/' + selectedModel.code + '/base'}});
                     }}>
                     <Icon type="info-circle-o" />属性设置
                 </Menu.Item>
-                <Menu.Item onClick={() => {
-                    let selectedModel = dataSource.list.find((i) => { return i.code === selectedDataSourceCode })
-                    dispatch({type: 'main/redirect', path: {pathname: '/datasource/'+ selectedModel.type +'/' + selectedModel.code + '/column'}});
-                }}>
-                    <Icon type="table" />数据列设置
-                </Menu.Item>
                 <Menu.Item><Icon type="search" />预览数据</Menu.Item>
-                <Menu.Item onClick={() => {
-                    let selectedModel = dataSource.list.find((i) => { return i.code === selectedDataSourceCode })
-                    dispatch({type: 'main/redirect', path: {pathname: '/datasource/'+ selectedModel.type +'/' + selectedModel.code + '/access'}});
-                }}><Icon type="lock" />权限设置</Menu.Item>
+                <Menu.Divider />
+                <Menu.Item><Icon type="profile" />分组</Menu.Item>
                 <Menu.Divider />
                 <Menu.Item
                     onClick={(e) => {
-                        dispatch({ type: 'dataSource/remoteDelete', code: selectedDataSourceCode });
+                        dispatch({ type: 'dataSource/remoteDelete', code: selectedRecord.code });
                     }}
                 ><Icon type="delete" />删除</Menu.Item>
             </Menu>
@@ -102,28 +88,43 @@ class DataSource extends React.Component {
             render: (text, record) => {
                 return <div className='datasource-name'>
                     <div className={`datasource-type type-${record.type.key}`}></div>
-                    <div>{text}</div>
+                    <div>
+                        <span>
+                            { dataSource.filterLabel? (text.split(new RegExp(`(${dataSource.filterLabel})`, 'i')).map((fragment, i) => (
+                                fragment.toLowerCase() === dataSource.filterLabel.toLowerCase()
+                                ? <span key={i} style={{fontWeight: 'bold', color: 'red'}} className="highlight">{fragment}</span> : fragment)
+                            )) : text }
+                        </span>
+                    </div>
                 </div>
             }
         }, {
-            title: '标签',
-            dataIndex: 'tags',
-            key: 'tag',
-            width: 150,
-            render: (text, record) => {
-                text=text.join(',');
-                let tags = text ? text.split(',').map((t, i) => {
-                    return <Tag className='datasource-tag' key={i}>{t}</Tag>
-                }) : '';
-                return (<div>
-                    {tags}
-                </div>)
-            }
-        }, {
+        //     title: '标签',
+        //     dataIndex: 'tags',
+        //     key: 'tag',
+        //     width: 150,
+        //     render: (text, record) => {
+        //         text=text.join(',');
+        //         let tags = text ? text.split(',').map((t, i) => {
+        //             return <Tag className='datasource-tag' key={i}>{t}</Tag>
+        //         }) : '';
+        //         return (<div>
+        //             {tags}
+        //         </div>)
+        //     }
+        // }, {
             title: '说明',
             dataIndex: 'description',
             key: 'description',
-            width: 200
+            width: 200,
+            render: (text, record) => {
+                return <span>
+                    { dataSource.filterLabel? (text.split(new RegExp(`(${dataSource.filterLabel})`, 'i')).map((fragment, i) => (
+                        fragment.toLowerCase() === dataSource.filterLabel.toLowerCase()
+                        ? <span key={i} style={{fontWeight: 'bold', color: 'red'}} className="highlight">{fragment}</span> : fragment
+                    ))) : text }
+                </span>
+            }
         }, {
             title: '创建人',
             dataIndex: 'creator',
@@ -136,11 +137,11 @@ class DataSource extends React.Component {
             render: (text, record) => dateFormat(text, 'yyyy-MM-dd hh:mm:ss'),
             width: 100
         }, {
-            title: '图表',
-            dataIndex: 'chartSum',
-            key: 'chartSum',
-            width: 80
-        }, {
+        //     title: '图表',
+        //     dataIndex: 'chartSum',
+        //     key: 'chartSum',
+        //     width: 80
+        // }, {
             title: '操作',
             key: 'action',
             render: (text, record, index) => (
@@ -148,7 +149,7 @@ class DataSource extends React.Component {
                     <Icon type="setting" />
                 </Dropdown>
             ),
-            width: 80
+            width: 50
         }];
 
         return ( 
@@ -158,8 +159,11 @@ class DataSource extends React.Component {
                         <Row className='datasource-tools' type='flex' justify='end'>
                             <Col className='search'>
                                 <Search
+                                    value={dataSource.filterLabel}
                                     placeholder="请输入关键字"
-                                    onSearch={value => console.log(value)}
+                                    onChange={e => {
+                                        dispatch({ type: 'dataSource/setFilterLabel', label: e.target.value });
+                                    }}
                                 />
                             </Col>
                             <Col>
@@ -174,7 +178,7 @@ class DataSource extends React.Component {
                                         <Menu.Item key='file'>文件</Menu.Item>
                                     </Menu>
                                 )} trigger={['click']}>
-                                    <Button style={{ display: activeTab==='dataConnect'?'none':'inline-block' }}>
+                                    <Button>
                                         <Icon type="plus" />添加数据源
                                     </Button>
                                 </Dropdown>
@@ -184,7 +188,17 @@ class DataSource extends React.Component {
                         <Table
                             className='datasource-table datasource-table'
                             columns={dataSourceColumns}
-                            dataSource={dataSource.list.sort((a, b) => {
+                            dataSource={dataSource.list.map(a => {
+                                let o = Object.assign({}, a);
+                                let reg = new RegExp('('+dataSource.filterLabel+'){1}', 'ig');
+                                if(o.name.search(reg) !== -1) {
+                                    return o;
+                                }else if(o.description.search(reg) !== -1) {
+                                    return o;
+                                }else {
+                                    return null
+                                }
+                            }).filter(a => a!==null).sort((a, b) => {
                                 return new Date(b.createTime) - new Date(a.createTime);
                             })}
                             loading={loading}
@@ -193,7 +207,7 @@ class DataSource extends React.Component {
                             pagination={false}
                             onRow={(record) => {
                                 return {
-                                    onClick: () => {this.setState({ selectedDataSourceCode:  record.code})}
+                                    onClick: () => {this.setState({ selectedRecord:  record})}
                                 }
                             }}
                         />

src/components/datasource/dataSourceDetail.jsx

@@ -103,7 +103,6 @@ class DataSourceDetail extends React.Component {
                                 current === steps.length - 1
                                 && <Button type="primary" onClick={() => {
                                     dispatch({ type: 'dataSource/remoteAdd' })
-                                    dispatch({ type: 'main/redirect', path: { pathname: '/datasource' } });
                                 }}>完成</Button>
                             }
                         </div>

src/constants/url.js

@@ -47,6 +47,6 @@ const URLS = {
 
     CHART_LINE_OPTION: BASE_URL + '/showLine', // 请求折线图展示数据
 
-    CHART_SCATTER_OPTION: BASE_URL + '/showXXXXX', // 请求散点图展示四数据
+    CHART_SCATTER_OPTION: BASE_URL + '/showScatter', // 请求散点图展示四数据
 }
 export default URLS

src/models/chart.js

@@ -66,6 +66,8 @@ export default {
                             return 'line';
                         }else if(type === 'Pie') {
                             return 'pie';
+                        }else if(type === 'scatter') {
+                            return 'scatter'
                         }else {
                             return '';
                         }
@@ -73,7 +75,8 @@ export default {
 
                     let resData = res.data.data;
                     let groupBy = JSON.parse(resData.groupBy) || [];
-                    let chartConfig = JSON.parse(resData.chartConfig) || { xAxis: { column: {}, granularity: {} }, yAxis: { column: {}, gauge: {} } };
+                    let chartConfig = JSON.parse(resData.chartConfig || '{ "xAxis": { "column": {}, "granularity": {} }, "yAxis": { "column": {}, "gauge": {} } }');
+                    let otherConfig = JSON.parse(resData.otherConfig || '{ "description": "" }');
                     let viewType = getViewType(resData.chartType);
 
                     let data = {
@@ -92,15 +95,18 @@ export default {
                                     label: g.columnRename
                                 }
                             })[0]
-                        }
+                        },
+                        otherConfig: otherConfig
                     }
 
                     if(viewType === 'bar') {
-                        data.barConfig = chartConfig
+                        data.barConfig = chartConfig;
                     }else if(viewType === 'pie') {
-                        data.pieConfig = chartConfig
+                        data.pieConfig = chartConfig;
                     }else if(viewType === 'line') {
                         data.lineConfig = chartConfig;
+                    }else if(viewType === 'scatter') {
+                        data.scatterConfig = chartConfig;
                     }
 
                     let fields = [];

src/models/chartDesigner.js

@@ -15,6 +15,7 @@ export default {
             barConfig: { xAxis: { column: {}, granularity: {} }, yAxis: { column: {}, gauge: {} } },
             lineConfig: { xAxis: { column: {}, granularity: {} }, yAxis: { column: {}, gauge: {} } },
             pieConfig: { xAxis: { column: {}, granularity: {} }, yAxis: { column: {}, gauge: {} } },
+            scatterConfig: { xAxis: { column: {}, granularity: {} }, yAxis: { column: {}, gauge: {} } },
             style: {},
             filters: [],
             chartOption: {},
@@ -71,8 +72,21 @@ export default {
                 gauge: {}
             }
         },
-        style: {
+        scatterConfig: {
+            xAxis: {
+                column: {},
+                granularity: {}
+            },
+            yAxis: {
+                column: {},
+                gauge: {}
+            }
+        },
+        styleConfig: {
 
+        },
+        otherConfig:{
+            description: ''
         },
         filters: [],
         chartOption: {},
@@ -203,10 +217,9 @@ export default {
                     url: URLS.CHART_ADD,
                     body: body
                 })
-                if(!res.err && res.data.code > 0) {
+                if(!res.err && res.data.data > 0) {
                     yield put({ type: 'chart/fetchList', mandatory: true });
-                    // TODO 
-                    // yield put({ type: 'main/redirect', path: '/chart/' + 32 });
+                    yield put({ type: 'main/redirect', path: '/chart/' + res.data.data });
                 }else {
                     message.error('新增失败');
                 }
@@ -218,7 +231,7 @@ export default {
         *remoteAdd(action, { select, call, put }) {
             try{
                 const chartDesigner = yield select(state => state.present.chartDesigner);
-                const { header, baseConfig, preparing, barConfig, pieConfig, lineConfig } = chartDesigner;
+                const { header, baseConfig, preparing, barConfig, pieConfig, lineConfig, otherConfig } = chartDesigner;
 
                 let body = {
                     chartName: header.label,
@@ -229,7 +242,8 @@ export default {
                     }] : [],
                     createBy: 'zhuth',
                     describes: '',
-                    style: ''
+                    style: '',
+                    otherConfig: JSON.stringify(otherConfig)
                 }; // 基本属性
                 if(baseConfig.viewType === 'bar') {
                     body.chartType = 'Histogram';
@@ -260,7 +274,7 @@ export default {
         *remoteModify(action, { select, call, put }) {
             try{
                 const chartDesigner = yield select(state => state.present.chartDesigner);
-                const { code, header, baseConfig, pieConfig, lineConfig, preparing, barConfig } = chartDesigner;
+                const { code, header, baseConfig, pieConfig, lineConfig, preparing, barConfig, scatterConfig, otherConfig } = chartDesigner;
                 let body = {
                     chartId: code,
                     chartName: header.label,
@@ -271,7 +285,8 @@ export default {
                     }] : [],
                     createBy: 'zhuth',
                     describes: '',
-                    style: ''
+                    style: '',
+                    otherConfig: JSON.stringify(otherConfig)
                 }; // 基本属性
                 if(baseConfig.viewType === 'bar') {
                     body.chartType = 'Histogram';
@@ -282,6 +297,9 @@ export default {
                 }else if(baseConfig.viewType === 'line') {
                     body.chartType = 'Line';
                     body.chartConfig = JSON.stringify(lineConfig);
+                }else if(baseConfig.viewType === 'scatter') {
+                    body.chartType = 'scatter';
+                    body.chartConfig = JSON.stringify(scatterConfig);
                 }
                 const res = yield call(service.fetch, {
                     url: URLS.CHART_UPDATE,
@@ -347,9 +365,9 @@ export default {
         *fetchBarData(action, { select, call, put }) {
             try {
                 const chartDesigner = yield select(state => state.present.chartDesigner);
-                const { barConfig, preparing } = chartDesigner;
+                const { code, barConfig, preparing } = chartDesigner;
                 const body = {
-                    tableName: "TEST_BI_DATA",
+                    id: code,
                     groups: preparing.groupBy && preparing.groupBy.key ? [preparing.groupBy.key] : [],
                     xAxis: {
                         columnRename: barConfig.xAxis.column.value,
@@ -361,6 +379,7 @@ export default {
                         showDataType: barConfig.yAxis.gauge.value
                     }
                 };
+                console.log(body);
                 
                 let res = yield call(service.fetch, {
                     url: URLS.CHART_BAR_OPTION,
@@ -382,9 +401,9 @@ export default {
         *fetchPieData(action, { select, call, put }) {
             try {
                 const chartDesigner = yield select(state => state.present.chartDesigner);
-                const { pieConfig } = chartDesigner;
+                const { code, pieConfig } = chartDesigner;
                 const body = {
-                    tableName: "TEST_BI_DATA",
+                    id: code,
                     legendData: {
                         columnRename: pieConfig.xAxis.column.value,
                         columnType: pieConfig.xAxis.column.type,
@@ -416,9 +435,9 @@ export default {
         *fetchLineData(action, { select, call, put }) {
             try {
                 const chartDesigner = yield select(state => state.present.chartDesigner);
-                const { lineConfig, preparing } = chartDesigner;
+                const { code, lineConfig, preparing } = chartDesigner;
                 const body = {
-                    tableName: "TEST_BI_DATA",
+                    id: code,
                     xAxis: {
                         columnRename: lineConfig.xAxis.column.value,
                         columnType: lineConfig.xAxis.column.type
@@ -435,6 +454,8 @@ export default {
                 });
                 if(!res.err && res.data.code > 0) {
                     res.viewType = 'line';
+                    res.data.data.xTitle = lineConfig.xAxis?`${lineConfig.xAxis.column.label}${lineConfig.xAxis.granularity.value?'('+lineConfig.xAxis.granularity.label+')':''}`:null
+                    res.data.data.yTitle = lineConfig.yAxis?`${lineConfig.yAxis.column.label}${lineConfig.yAxis.gauge.value?'('+lineConfig.yAxis.gauge.label+')':''}`:null
                     yield put({ type: 'silentSetField', name: 'chartOption', value: res });
                 }else {
                     yield put({ type: 'silentSetField', name: 'chartOption', value: {} });
@@ -446,34 +467,34 @@ export default {
         },
         *fetchScatterData(action, { select, call, put }) {
             try {
-                let res = {
-                    viewType: 'scatter'
-                }
-
-                // const chartDesigner = yield select(state => state.present.chartDesigner);
-                // const { lineConfig, preparing } = chartDesigner;
-                // const body = {
-                //     tableName: "TEST_BI_DATA",
-                //     xAxis: {
-                //         columnRename: lineConfig.xAxis.column.value,
-                //         columnType: lineConfig.xAxis.column.type
-                //     },
-                //     yAxis: {
-                //         columnRename: lineConfig.yAxis.column.value,
-                //         showDataType: lineConfig.yAxis.gauge.value
-                //     },
-                //     groups: preparing.groupBy && preparing.groupBy.key ? [preparing.groupBy.key] : [],
-                // };
-                // let res = yield call(service.fetch, {
-                //     url: URLS.CHART_LINE_OPTION,
-                //     body: body
-                // });
-                // if(!res.err && res.data.code > 0) {
-                //     res.viewType = 'scatter';
+                const chartDesigner = yield select(state => state.present.chartDesigner);
+                const { code, scatterConfig, preparing } = chartDesigner;
+                const body = {
+                    id: code,
+                    xAxis: {
+                        columnRename: scatterConfig.xAxis.column.value,
+                        columnType: scatterConfig.xAxis.column.type
+                    },
+                    yAxis: {
+                        columnRename: scatterConfig.yAxis.column.value,
+                        showDataType: scatterConfig.yAxis.gauge.value
+                    },
+                    groups: preparing.groupBy && preparing.groupBy.key ? [preparing.groupBy.key] : [],
+                };
+                console.log(body);
+                let res = yield call(service.fetch, {
+                    url: URLS.CHART_SCATTER_OPTION,
+                    body: body
+                });
+                console.log(res);
+                if(!res.err && res.data.code > 0) {
+                    res.viewType = 'scatter';
+                    res.data.data.xTitle = scatterConfig.xAxis?`${scatterConfig.xAxis.column.label}${scatterConfig.xAxis.granularity.value?'('+scatterConfig.xAxis.granularity.label+')':''}`:null
+                    res.data.data.yTitle = scatterConfig.yAxis?`${scatterConfig.yAxis.column.label}${scatterConfig.yAxis.gauge.value?'('+scatterConfig.yAxis.gauge.label+')':''}`:null
                     yield put({ type: 'silentSetField', name: 'chartOption', value: res });
-                // }else {
-                //     yield put({ type: 'silentSetField', name: 'chartOption', value: {} });
-                // }
+                }else {
+                    yield put({ type: 'silentSetField', name: 'chartOption', value: {} });
+                }
             }catch(e) {
                 console.error(e);
                 yield put({ type: 'silentSetField', name: 'chartOption', value: {} });

src/models/dataSource.js

@@ -7,31 +7,9 @@ export default {
     state: {
         newOne: {},
         list: [],
+        filterLabel: ''
     },
     reducers: {
-        testData(state, action) {
-            let list = state.list;
-            for(let i = 0; i < 4; i++) {
-                let newOne = {
-                    name: 'aldjalsdal',
-                    type: i%2?'file':'database',
-                    dbType: {key: 'oracle', label: 'ORACLE'},
-                    address: '2',
-                    port: '3',
-                    target: 'select * from employee',
-                    creator: 'zhuth',
-                    createTime: new Date(),
-                    userName: '2222',
-                    password: 'aaaww',
-                    tags: ['tttt', 'accc'],
-                    description: ' dddddddddddddddddddddd'
-                };
-                newOne.key = new Date().getMilliseconds()+(Math.random()*100).toFixed(0)+i;
-                newOne.code = new Date().getMilliseconds()+(Math.random()*100).toFixed(0)+i;
-                list.push(newOne);
-            }
-            return Object.assign({}, state, {list});
-        },
         list(state, action) {
             let data = action.data;
             return Object.assign({}, state, {list: data});
@@ -92,8 +70,9 @@ export default {
         resetNewModel(state, action) {
             return Object.assign({}, state, {newOne: {}});
         },
-        printNewOne(state, action) {
-            return state;
+        setFilterLabel(state, action) {
+            const { label } = action;
+            return Object.assign({}, state, {filterLabel: label});
         }
     },
     effects: {
@@ -172,6 +151,7 @@ export default {
                     let list = dataSource.list;
                     list.unshift(model);
                     yield put({ type: 'list', data: list });
+                    yield put({ type: 'main/redirect', path: { pathname: '/datasource' } });
                     message.success('新增成功!');
                 }else {
                     message.error('新增失败!');
@@ -288,7 +268,7 @@ export default {
                 });
                 if(!res.err && res.data.code > 0) {
                     for(let i = 0; i < list.length; i++) {
-                        if(list[i].code === code) {
+                        if((list[i].code + '') === (code + '')) {
                             list.splice(i, 1);
                             break;
                         }
@@ -346,7 +326,7 @@ export default {
                 });
                 if(!res.err && res.data.code > 0) {
                     list = list.map(l => {
-                        if(l.code === action.code) {
+                        if((l.code + '') === (action.code + '')) {
                             l = model;
                         }
                         return l;