图表去除分页/图表数据源列字段别面同步/新增分组置于最前/不可过滤列bug

src/components/chart/list.jsx

@@ -2,7 +2,7 @@
  * 图表列表
  */
 import React from 'react'
-import { Layout, Button, Icon, Menu, Dropdown, Card, Col, Row, Breadcrumb, Tag, Checkbox, Pagination } from 'antd'
+import { Layout, Button, Icon, Menu, Dropdown, Card, Col, Row, Breadcrumb, Tag, Checkbox } from 'antd'
 import { connect } from 'dva'
 import ChooseDataSourceBox from './chooseDataSourceBox'
 import GroupManagementBox from '../common/groupManageMentBox/box'
@@ -35,13 +35,7 @@ class ChartList extends React.Component {
             visibleDeleteBox: false,
             visibleGroupManageMentBox: false, // 显示分组管理组件
             visibleDataPreviewBox: false,
-
             noGroup: false, // 显示未分组数据
-
-            page: 1, // 分页器当前页码
-            pageSize: 25,// 每页最大展示卡片数(maxRowCards * maxRow)
-            maxRowCards: 5, // 每行最大展示卡片数(无需自定义，有自动计算逻辑)
-            maxRow: 5, // 每页最大行数(手动设置，也许后期可以通过判断电脑性能自动设置该值？)
         }
         this.bodyRef = React.createRef();
     }
@@ -51,9 +45,6 @@ class ChartList extends React.Component {
         this.setBodyWidth();
         dispatch({ type: 'chart/fetchList' })
         dispatch({ type: 'chart/remoteGroupList' });
-        this.setState({
-            page: chart.page || 1
-        });
         let parent = this.bodyRef.current.parentNode;
         parent.scrollTo && parent.scrollTo(0, chart.listScrollTop)
         window.addEventListener('resize', this.setBodyWidth);
@@ -64,7 +55,6 @@ class ChartList extends React.Component {
         window.removeEventListener('resize', this.setBodyWidth);
         dispatch({ type: 'chart/setFields', fields: [
             { name: 'listScrollTop', value: this.bodyRef.current.parentNode.scrollTop },
-            { name: 'page', value: this.state.page },
         ] });
     }
 
@@ -72,7 +62,6 @@ class ChartList extends React.Component {
      * 设置卡片容器宽度 = 每行最大卡片数量 * 卡片宽度
      */
     setBodyWidth = () => {
-        const { maxRowCards, maxRow } = this.state;
         const cardBody = this.bodyRef.current; // 卡片容器
         const parent = cardBody.parentNode; // 父级容器
         const pWidth = parent.offsetWidth; // 父级容器宽度
@@ -85,30 +74,9 @@ class ChartList extends React.Component {
         const cardBodyWidth = count * cTrueWidth; // 考虑到滚动条，减少一个
 
         cardBodyWidth > 0 ? cardBody.style.width = cardBodyWidth + 'px' : void(0);
-
-        if(maxRowCards !== count) {
-            this.setState({
-                maxRowCards: count,
-                pageSize: count * maxRow
-            });
-        }
     }
 
-    onGroup = () => {
-        const { chart } = this.props;
-        const { noGroup } = this.state;
-        const { list, currentGroup } = chart;
-        
-        if(noGroup) {
-            return list.filter(l => l.groupCode === '-1' );
-        }else if(currentGroup) {
-            return list.filter(l => l.groupCode === currentGroup.code );
-        }else {
-            return list;
-        }
-    }
-
-    onFilterAndGroup = (cardList) => {
+    onFilterAndGroup = cardList => {
         const { chart } = this.props;
         const { noGroup } = this.state;
         const { filterItem, currentGroup } = chart;
@@ -116,13 +84,14 @@ class ChartList extends React.Component {
         let filterLabel = chart.filterLabel ? (chart.filterLabel + '').replace(new RegExp('(\\\\)', 'g'), '\\$1').replace(reg, '\\$1') : ''; // 添加转义符号
         let filterReg = new RegExp('(' + filterLabel + '){1}', 'ig');
 
-        let list = cardList.filter(l => {
+        let list = cardList.map(l => {
+            let visible = false;
             if(filterItem.type === 'date') {
                 if(filterLabel===""){
                     if(noGroup) {
-                        return l.groupCode === '-1'
+                        visible = l.groupCode === '-1';
                     }else {
-                        return !!currentGroup ? l.groupCode === currentGroup.code : true;
+                        visible = !!currentGroup ? l.groupCode === currentGroup.code : true;
                     }
                 }else if(filterLabel.indexOf('#')>-1){
                     let start = filterLabel.split('#')[0]
@@ -130,26 +99,27 @@ class ChartList extends React.Component {
                     let nowTime = new Date(l[filterItem.name]).getTime();
                     if(nowTime>=start && nowTime<=end){
                         if(noGroup) {
-                            return l.groupCode === '-1'
+                            visible = l.groupCode === '-1'
                         }else {
-                            return !!currentGroup ? l.groupCode === currentGroup.code : true;
+                            visible = !!currentGroup ? l.groupCode === currentGroup.code : true;
                         }
                     }
-                    return false;
+                    visible = false;
                 }else{
-                    return false;
+                    visible = false;
                 }
             }else {
                 if((l[filterItem.name] + '').search(filterReg) > -1) {
                     if(noGroup) {
-                        return l.groupCode === '-1'
+                        visible = l.groupCode === '-1'
                     }else {
-                        return !!currentGroup ? l.groupCode === currentGroup.code : true;
+                        visible = !!currentGroup ? l.groupCode === currentGroup.code : true;
                     }
                 }else {
-                    return false;
+                    visible = false;
                 }
             }
+            return { ...l, visible }
         })
 
         return list;
@@ -161,14 +131,9 @@ class ChartList extends React.Component {
         })
     }
 
-    onPage = (list) => {
-        const { page, pageSize } = this.state;
-        return list.slice(pageSize * (page - 1), pageSize * (page - 1) + pageSize)
-    }
-
-    onReduce = () => {
+    onFilter = () => {
         const { list } = this.props.chart;
-        return this.onSort(this.onFilterAndGroup(list));
+        return this.onFilterAndGroup(list);
     }
 
     getParens = (group) => {
@@ -198,11 +163,7 @@ class ChartList extends React.Component {
                         <span onClick={() => {
                             let group = chart.groupList.find(group => group.code === g.code);
                             dispatch({ type: 'chart/setCurrentGroup', group: group });
-                            this.setState({
-                                page: 1
-                            }, () => {
-                                this.bodyRef.current.parentNode.scrollTo && this.bodyRef.current.parentNode.scrollTo(0, 0)
-                            })
+                            this.bodyRef.current.parentNode.scrollTo && this.bodyRef.current.parentNode.scrollTo(0, 0)
                         }}>{g.label}</span>
                         <GroupSelector
                             visible={this.state['visibleGroupSelector' + g.code]}
@@ -218,11 +179,7 @@ class ChartList extends React.Component {
                                 obj['visibleGroupSelector' + g.code] = false;
                                 this.setState(obj);
                                 dispatch({ type: 'chart/setCurrentGroup', group });
-                                this.setState({
-                                    page: 1
-                                }, () => {
-                                    this.bodyRef.current.parentNode.scrollTo && this.bodyRef.current.parentNode.scrollTo(0, 0)
-                                })
+                                this.bodyRef.current.parentNode.scrollTo && this.bodyRef.current.parentNode.scrollTo(0, 0)
                             }}
                         >
                             <Icon style={{ marginLeft: '4px', fontSize: '12px' }} type="caret-down" />
@@ -289,9 +246,8 @@ class ChartList extends React.Component {
         const reg = new RegExp('([+ \\- & | ! ( ) { } \\[ \\] ^ \" ~ * ? : ( ) \/])', 'g'); // 需要转义的字符
         let filterLabel = chart.filterLabel ? (chart.filterLabel + '').replace(new RegExp('(\\\\)', 'g'), '\\$1').replace(reg, '\\$1') : ''; // 添加转义符号
         
-        console.time('generateCard');
         let cards = list.map( (l, i) => (
-            <CardGrid className={`chart-card`} key={i} onClick={() => {
+            <CardGrid className={`chart-card${l.visible ? ' visible' : ' hidden'}`} key={i} onClick={() => {
                 this.setState({ selectedRecord: l })
             }}>
                 <Card
@@ -352,7 +308,6 @@ class ChartList extends React.Component {
                 </Card>
             </CardGrid>
         ));
-        console.timeEnd('generateCard');
         if(cards.length === 0) {
             return <EmptyContent />
         }
@@ -401,20 +356,13 @@ class ChartList extends React.Component {
         dispatch({ type: 'chart/remoteMoveGroup', dragCode, dropCode, dropPosition });
     }
 
-    onPageChange = (pageNumber) => {
-        this.setState({
-            page: pageNumber
-        }, () => {
-            this.bodyRef.current.parentNode.scrollTo && this.bodyRef.current.parentNode.scrollTo(0, 0)
-        })
-    }
-
     render() {
         const { dispatch, chart } = this.props;
         const { listLoading } = chart;
-        const { visibleChooseDataSourceBox, visibleDistributeBox, visibleGroupManageMentBox, visibleTransferBox, visibleDeleteBox, selectedRecord, noGroup, pageSize, page } = this.state;
-        let reduceList =  this.onReduce();
-        let viewList = this.onPage(reduceList);
+        const { visibleChooseDataSourceBox, visibleDistributeBox, visibleGroupManageMentBox, visibleTransferBox, visibleDeleteBox, selectedRecord, noGroup } = this.state;
+        let viewList =  this.onFilter();
+        // let viewList = this.onPage(reduceList);
+        // let viewList = reduceList;
         return (
             <Layout className='layout-chart'>
                 <Loading visible={listLoading} />
@@ -425,7 +373,6 @@ class ChartList extends React.Component {
                                 <Checkbox style={{ marginTop: '4px' }} checked={noGroup} onChange={(e) => {
                                     this.setState({
                                         noGroup: e.target.checked,
-                                        page: 1
                                     }, () => {
                                         this.bodyRef.current.parentNode.scrollTo && this.bodyRef.current.parentNode.scrollTo(0, 0)
                                     })
@@ -467,9 +414,6 @@ class ChartList extends React.Component {
                             { this.generateCard(viewList) }
                         </div>
                     </Card>
-                    <Pagination showQuickJumper pageSize={pageSize} current={page} total={reduceList.length} onChange={this.onPageChange}
-                        showTotal={total => `共${total}个图表`}
-                    />
                 </Content>
                 {visibleGroupManageMentBox && <GroupManagementBox
                     typeText='图表'

src/components/chart/list.less

@@ -79,6 +79,9 @@
                         box-shadow: none;
                         border: 1px solid #D6EEFE;
                         border-radius: @border-radius-base;
+                        &.hidden {
+                            display: none;
+                        }
                         &>.ant-card {
                             &>.ant-card-head {
                                 min-height: 20px;

src/components/chartDesigner/charts/echartsView.jsx

@@ -7,7 +7,6 @@ const EchartsView = ({ chartOption }) => {
     if(!chartOption || ((!chartOption.series || chartOption.series.length === 0) && (!chartOption.baseOption || !chartOption.baseOption.series || chartOption.baseOption.series.length === 0))) {
         return <EmptyContent />
     }else {
-        console.log(chartOption);
         return <Echarts
         key={hashcode(chartOption)}
         option={chartOption}

src/components/common/dataPreview/dataPreview.jsx

@@ -34,7 +34,6 @@ class DataPreview extends React.Component {
     onWindowResize = () => {
         const boxEl = document.getElementsByClassName('datapreview')[0];
         const tableHeaderEl = boxEl.getElementsByTagName('thead')[0];
-        console.log('onWindowResize');
 
         this.setState({
             screenWidth: document.documentElement.clientWidth || document.body.clientWidth, // 屏幕宽
@@ -44,7 +43,7 @@ class DataPreview extends React.Component {
     }
 
     render() {
-        const { title, fetchFunction, dataList, visibleBox, hideBox } = this.props;
+        const { title, fetchFunction, dataList, visibleBox, hideBox, dispatch } = this.props;
         const { loading, columns, dataSource, pageSize, total } = dataList;
         const { screenWidth, screenHeight, boxW, boxH, columnWidth, tableHeaderHeight } = this.state;
         const tableBodyWidth = screenWidth * boxW - 10 - 10 - 18;
@@ -58,7 +57,10 @@ class DataPreview extends React.Component {
             height={`${100 * boxH}%`}
             visible={visibleBox}
             footer={null}
-            onCancel={hideBox}
+            onCancel={() => {
+                dispatch({ type: 'dataList/reset' });
+                hideBox()
+            }}
             maskClosable={false}
         >
             <Table

src/components/common/filterBox/filterBox2.jsx

@@ -579,9 +579,11 @@ class FilterBox extends React.Component {
                     key: i,
                     name: c.columnName,
                     label: c.columnRaname,
-                    type: c.columnType
+                    type: c.columnType,
+                    groupable: c.isGroup==='1'?true:false,
+                    filterable: c.isFilter==='1'?true:false
                 }
-            })
+            }).filter(c => c.filterable);
             fieldOptions[stateIdx].columns = columns;
             this.setState({
                 fieldOptions: fieldOptions

src/components/common/groupManageMentBox/box.jsx

@@ -49,7 +49,7 @@ class GroupBox extends React.Component {
         const reg = new RegExp('([+ \\- & | ! ( ) { } \\[ \\] ^ \" ~ * ? : ( ) \/])', 'g'); // 需要转义的字符
         const regLabel = filterLabel.replace(new RegExp('(\\\\)', 'g'), '\\$1').replace(reg, '\\$1'); // 添加转义符号
         let arr = this.onFilter(treeData, regLabel);
-        let list = arr.sort((a, b) => (a.index - b.index)).map(t => {
+        let list = arr.map(t => {
             const title = <span>{ (regLabel) ?
                 ((t.label || '').split(new RegExp(`(${regLabel})`, 'i')).map((fragment, i) => {
                     return (
@@ -213,21 +213,20 @@ class GroupBox extends React.Component {
 
     addGroup = (pgroup) => {
         let { aGroups, groupData } = this.state;
-        let treeData = arrayToTree(groupData, '-1', 'code', 'pcode', 'children');
-        let fGroup = this.findGroup(treeData, pgroup);
+        // let treeData = arrayToTree(groupData, '-1', 'code', 'pcode', 'children');
+        // let fGroup = this.findGroup(treeData, pgroup);
         let pGroups = pgroup ? this.getParens(pgroup) : [];
         let g = {
             label: '新分组',
             operate: 'add',
             code: 'new-' + Math.random() * 10,
-            index: fGroup ? ( fGroup.children ? fGroup.children.length : 0 ) : treeData.length
         };
         if(pgroup) {
             g.pcode = pgroup.code
         }else {
             g.pcode = '-1'
         }
-        groupData.push(g);
+        groupData.unshift(g);
         this.setState({
             groupData,
             expandedKeys: pGroups.concat([{ code: '-1' }]).map(g => g.code),

src/components/dataSource/list.jsx

@@ -446,9 +446,9 @@ class DataSource extends React.Component {
                                     <Dropdown overlay={(
                                         <Menu onClick={(item, key, keyPath) => {
                                             const type = item.key;
-                                            dispatch({ type: 'dataSource/resetNewModel' });
+                                            // dispatch({ type: 'dataSource/resetNewModel' });
                                             dispatch({ type: 'dataConnect/resetSelected' });
-                                            dispatch({ type: 'dataSource/setNewModelField', name: 'type', value: type });
+                                            // dispatch({ type: 'dataSource/setNewModelField', name: 'type', value: type, group });
                                             dispatch({type: 'main/redirect', path: {pathname: '/workshop/datasource/'+ type +'/create/base'}});
                                         }}>
                                             { (currentUser.role === 'admin' || currentUser.role === 'superAdmin') && <Menu.Item key='database'>选择数据链接</Menu.Item>}

src/components/dataSourceDetail/dataConnectConfig.jsx

@@ -116,12 +116,12 @@ class DataConnectConfig extends React.Component {
         return cards;
     }
 
-    generateOperationMenu = () => {
+    generateOperationMenu = (item) => {
         const { dataConnect, dispatch } = this.props;
 
         return <Menu className='menu-operation'>
             <Menu.Item onClick={() => {
-                dispatch({ type: 'dataConnect/setNewModel', model: dataConnect.selected });
+                dispatch({ type: 'dataConnect/setNewModel', model: item || dataConnect.selected });
                 dispatch({ type: 'dataConnect/setNewModelFields', fields: [
                     { name: 'visibleBox', value: true },
                     { name: 'boxOperation', value: 'view' }

src/components/dataSourceDetail/layout.jsx

@@ -20,16 +20,16 @@ class DataSourceDetail extends React.Component {
     }
 
     componentDidMount() {
-        const { dispatch } = this.props;
+        const { dataSource, dispatch } = this.props;
         const { paramsType: type, paramsCode: code } = this.state;
-        
         dispatch({ type: 'dataSourceDetail/reset' });
         if(code !== 'create') {
             dispatch({ type: 'dataSource/remoteDetail', code: code })
             dispatch({ type: 'dataSourcePolicy/fetchList', dataSourceCode: code });
         }else {
             dispatch({ type: 'dataSourceDetail/setFields', fields: [
-                { name: 'type', value: type }
+                { name: 'type', value: type },
+                { name: 'group', value: dataSource.currentGroup ? dataSource.currentGroup.code : '-1'  }
             ] });
         }
     }
@@ -52,4 +52,4 @@ class DataSourceDetail extends React.Component {
 
 }
 
-export default connect(({ present: { dataSourceDetail } }) => ({ dataSourceDetail }))(DataSourceDetail)
+export default connect(({ present: { dataSource, dataSourceDetail } }) => ({ dataSource, dataSourceDetail }))(DataSourceDetail)

src/models/chart.js

@@ -63,7 +63,6 @@ export default {
             ],
             filterItem: { name: 'name', label: '名称', type: 'string' }, // 已选过滤字段
             listScrollTop: 0, // 记录列表界面滚动条位置
-            page: 1, // 分页器当前所在页码
         },
     },
     reducers: {
@@ -221,7 +220,9 @@ export default {
                             styleConfig: JSON.parse(d.style || '{}'),
                             demo: d.demo,
                         }
-                    })
+                    }).sort((a, b) => {
+                        return new Date(b.createTime) - new Date(a.createTime)
+                    });
                     yield put({ type: 'list', list: list });
                     return list;
                 }else {

src/models/chartDesigner.js

@@ -2,6 +2,7 @@ import { message } from 'antd'
 import * as service from '../services/index'
 import URLS from '../constants/url'
 import parseChartOption from './parseChartOption'
+import { deepAssign } from '../utils/baseUtils'
 import moment from 'moment'
 
 function getBodyFilters(filters) {
@@ -278,6 +279,7 @@ export default {
                         }
                     })
                     yield put({ type: 'silentSetField', name: 'columns', value: columns });
+                    yield put({ type: 'updateColumns' });
                 }else {
                     message.error('请求列数据失败:' + res.msg);
                     yield put({ type: 'silentSetField', name: 'columns', value: [] });
@@ -287,6 +289,89 @@ export default {
                 yield put({ type: 'silentSetField', name: 'columns', value: [] });
             }
         },
+        // 因为数据源列字段可能发生重命名，需要替换到最新的别名
+        *updateColumns(action, { select, call, put }) {
+            const chartDesigner = yield select(state => state.present.chartDesigner);
+            const { columns, baseConfig } = chartDesigner;
+            const { viewType } = baseConfig;
+            try {
+                if(viewType === 'bar') {
+                    const { barConfig } = chartDesigner;
+                    const { xAxis, yAxis, groupBy } = barConfig;
+                    const newXAxisColumn = columns.find(c => c.name === xAxis.column.value);
+                    const newYAxisColumn = columns.find(c => c.name === yAxis.column.value);
+                    const newGroupByColumn = columns.find(c => c.name === groupBy.key);
+                    let fields = {};
+                    newXAxisColumn ? fields.xAxis = { column: { label: newXAxisColumn.label } } : void(0);
+                    newYAxisColumn ? fields.yAxis = { column: { label: newYAxisColumn.label } } : void(0);
+                    newGroupByColumn ? fields.groupBy = { label: newGroupByColumn.label } :void(0);
+                    yield put({ type: 'silentSetField', name: 'barConfig', value: deepAssign(barConfig, { ...fields }) });
+                }else if(viewType === 'line') {
+                    const { lineConfig } = chartDesigner;
+                    const { xAxis, yAxis, groupBy } = lineConfig;
+                    const newXAxisColumn = columns.find(c => c.name === xAxis.column.value);
+                    const newYAxisColumn = columns.find(c => c.name === yAxis.column.value);
+                    const newGroupByColumn = columns.find(c => c.name === groupBy.key);
+                    let fields = {};
+                    newXAxisColumn ? fields.xAxis = { column: { label: newXAxisColumn.label } } : void(0);
+                    newYAxisColumn ? fields.yAxis = { column: { label: newYAxisColumn.label } } : void(0);
+                    newGroupByColumn ? fields.groupBy = { label: newGroupByColumn.label } :void(0);
+                    yield put({ type: 'silentSetField', name: 'lineConfig', value: deepAssign(lineConfig, { ...fields }) });
+                }else if(viewType === 'pie') {
+                    const { pieConfig } = chartDesigner;
+                    const { xAxis, yAxis } = pieConfig;
+                    const newXAxisColumn = columns.find(c => c.name === xAxis.column.value);
+                    const newYAxisColumn = columns.find(c => c.name === yAxis.column.value);
+                    let fields = {};
+                    newXAxisColumn ? fields.xAxis = { column: { label: newXAxisColumn.label } } : void(0);
+                    newYAxisColumn ? fields.yAxis = { column: { label: newYAxisColumn.label } } : void(0);
+                    yield put({ type: 'silentSetField', name: 'pieConfig', value: deepAssign(pieConfig, { ...fields }) });
+                }else if(viewType === 'scatter') {
+                    const { scatterConfig } = chartDesigner;
+                    const { xAxis, yAxis, groupBy } = scatterConfig;
+                    const newXAxisColumn = columns.find(c => c.name === xAxis.column.value);
+                    const newYAxisColumn = columns.find(c => c.name === yAxis.column.value);
+                    const newGroupByColumn = columns.find(c => c.name === groupBy.key);
+                    let fields = {};
+                    newXAxisColumn ? fields.xAxis = { column: { label: newXAxisColumn.label } } : void(0);
+                    newYAxisColumn ? fields.yAxis = { column: { label: newYAxisColumn.label } } : void(0);
+                    newGroupByColumn ? fields.groupBy = { label: newGroupByColumn.label } :void(0);
+                    yield put({ type: 'silentSetField', name: 'scatterConfig', value: deepAssign(scatterConfig, { ...fields }) });
+                }else if(viewType === 'dataView') {
+                    const { dataViewConfig } = chartDesigner;
+                    const { sortColumn, viewColumns } = dataViewConfig;
+                    let fields = {};
+                    const newSortColumn = columns.find(c => c.name === sortColumn.key);
+                    let arr = viewColumns.map(v => {
+                        const newViewColumn = columns.find(c => c.name === v.name);
+                        return newViewColumn ? { label: newViewColumn.label } : {};
+                    });
+                    newSortColumn ? fields.sortColumn = { label: newSortColumn.label } : void(0);
+                    fields.viewColumns = arr;
+                    yield put({ type: 'silentSetField', name: 'dataViewConfig', value: deepAssign(dataViewConfig, { ...fields }) });
+                }else if(viewType === 'aggregateTable') {
+                    const { aggregateTableConfig } = chartDesigner;
+                    const { groupBy, targetColumn } = aggregateTableConfig;
+                    let fields = {};
+                    const newTargetColumn = columns.find(c => c.name === targetColumn.name);
+                    let arr = groupBy.map(g => {
+                        const newGroupByColumn = columns.find(c => c.name === g.key);
+                        return newGroupByColumn ? { label: newGroupByColumn.label } : {};
+                    });
+                    newTargetColumn ? fields.targetColumn = { label: newTargetColumn.label } : void(0);
+                    fields.groupBy = arr;
+                    yield put({ type: 'silentSetField', name: 'aggregateTableConfig', value: deepAssign(aggregateTableConfig, { ...fields }) });
+                }
+                const { filters } = chartDesigner;
+                let fields = filters.map(f => {
+                    const newFilterColumn = columns.find(c => c.name === f.name);
+                    return newFilterColumn ? { label: newFilterColumn.label } : {};
+                });
+                yield put({ type: 'silentSetField', name: 'filters', value: deepAssign(filters, fields) });
+            }catch(e) {
+                console.error(e.message);
+            }
+        },
         *fetchChartData(action, { select, call, put }) {
             const chartDesigner = yield select(state => state.present.chartDesigner);
             const { baseConfig } = chartDesigner;

src/models/dashboardDesigner.js

@@ -406,7 +406,6 @@ export default {
                 return;
             }
             
-
             try {
                 const res = yield call(service.fetch, {
                     url: URLS.DATASOURCE_QUERY_DATACOLUMNS,
@@ -426,7 +425,7 @@ export default {
                             bucketizable: c.isSubsection==='1'?true:false,
                             selection: []
                         }
-                    })
+                    }).filter(c => c.filterable);
                     
                     dataSources[idx] = { ...dataSources[idx], columns }
                     yield put({ type: 'silentSetField', name: 'dataSources', value: dataSources });

src/models/dataList.js

@@ -1,12 +1,14 @@
 export default {
     namespace: 'dataList',
     state: {
-        columns: [],
-        dataSource: [],
-
-        loading: false,
-        pageSize: 25,
-        total: 0,
+        originData: {
+            columns: [],
+            dataSource: [],
+    
+            loading: false,
+            pageSize: 25,
+            total: 0,
+        },
     },
     reducers: {
         setField(state, action) {
@@ -32,9 +34,15 @@ export default {
             return { ...state, dataSource }
         },
         reset(state, action) {
-            return { ...state, columns: [], dataSource: [] }
-        }
+            let newState = Object.assign({}, state, state.originData);
+            return Object.assign({}, newState);
+        },
     },
     effects: {
     },
+    subscriptions: {
+        setup({ dispatch, history }) {
+            dispatch({ type: 'reset' });
+        }
+    }
 };