首页样式调整/添加最近访问recent model/调整看板、图表列表卡片样式，去除看板备注/导航栏字体加大/数据视图loading/分页逻辑

src/components/chart/list.jsx

@@ -6,7 +6,7 @@ import { Layout, Button, Icon, Input, Menu, Dropdown, Card, Col, Row, Popover, B
 import { connect } from 'dva'
 import './list.less'
 import ChooseDataSourceBox from './chooseDataSourceBox'
-import { dateFormat } from '../../utils/baseUtils'
+import moment from 'moment'
 import Ellipsis from 'ant-design-pro/lib/Ellipsis'
 import 'ant-design-pro/dist/ant-design-pro.css'
 import GroupSelector from '../datasource/groupSelector'
@@ -164,7 +164,7 @@ class ChartList extends React.Component {
                             <Row className='thumb' onClick={l.access ? () => {
                                 dispatch({ type: 'chartDesigner/reset' });
                                 dispatch({ type: 'main/redirect', path: '/chart/' + l.code });
-                                dispatch({ type: 'chart/addHistory', code: l.code });
+                                dispatch({ type: 'main/addRecentRecord', tarId: l.code, recordType: 0});
                             } : () => {}}>
                                 {!l.access && <div className='deny-body'>
                                     <div className='deny-tip'>无数据权限</div>
@@ -188,12 +188,12 @@ class ChartList extends React.Component {
                                 }</Ellipsis>
                             </Row>
                             <Row className='footer' type='flex' justify='end' align='bottom'>
-                                <Col style={{ textAlign: 'left' }} span={22}>
-                                    <Row>{l.creatorName} {dateFormat(l.createTime, 'yyyy-MM-dd')}</Row>
+                                <Col style={{ textAlign: 'left', lineHeight: '28px' }} span={21}>
+                                    <Row>{l.creatorName} {moment(l.createTime).format('YYYY-MM-DD')}</Row>
                                 </Col>
-                                <Col span={2} style={{ textAlign: 'right' }}>
+                                <Col span={3} style={{ textAlign: 'right' }}>
                                     <Dropdown overlay={operationMenu} trigger={['click']}>
-                                        <Icon type="ellipsis" />
+                                        <Icon style={{ fontSize: '24px' }} type="ellipsis" theme="outlined" />
                                     </Dropdown>
                                 </Col>
                             </Row>

src/components/chart/list.less

@@ -1,122 +1,135 @@
 .chart-list {
-    .ant-card-head {
-        padding: 0 10px;
-        .tools {
-            .anticon-bars {
-                cursor: pointer;
-                line-height: 1.6;
-                font-size: 20px;
-                margin-right: 6px;
-                &> svg {
-                    height: 100%;
-                }
-            }
-            .group {
-                line-height: 2.1;
-                .ant-breadcrumb-link {
-                    .ant-tag {
-                        margin: 0;
-                    }
-                }
-            }
-            .search {
-                display: flex;
-                > div:first-child {
-                    margin-right: 5px;
-                }
-            } 
-        }
-    }
-    .ant-card-body {
-        padding: 10px;
-        display: flex;
-        flex-wrap: wrap;
-        justify-content: center;
-
-        .chart-card {
-            width: 207px;
-            text-align: center;
-            margin: 5px;
-            padding: 0;
-
-            .ant-card-head {
-                min-height: 20px;
-                cursor: default;
-                .ant-card-head-title {
-                    font-size: 14px;
-                    padding: 6px 0;
-                    .anticon {
+    &>.ant-layout-content {
+        &>.ant-card {
+            &>.ant-card-head {
+                padding: 0 10px;
+                .tools {
+                    .anticon-bars {
                         cursor: pointer;
+                        line-height: 1.6;
+                        font-size: 20px;
+                        margin-right: 6px;
+                        &> svg {
+                            height: 100%;
+                        }
+                    }
+                    .group {
+                        line-height: 2.1;
+                        .ant-breadcrumb-link {
+                            .ant-tag {
+                                margin: 0;
+                            }
+                        }
                     }
+                    .search {
+                        display: flex;
+                        > div:first-child {
+                            margin-right: 5px;
+                        }
+                    } 
                 }
             }
-
-            .ant-card-cover {
-                height: 200px;
-                .cover-body {
-                    padding: 10px;
-                    .thumb {
-                        height: 132px;
-                        .deny-body {
-                            height: 100%;
-                            width: 100%;
-                            display: flex;
-                            position: absolute;
-                            text-align: center;
-                            justify-content: center;
-                            flex-direction: column;
-                            z-index: 1;
-                            .deny-tip {
-                                height: 40px;
-                                line-height: 40px;
-                                background: rgba(218, 218, 218, 0.5);
-                                border: 2px solid #aaaaaa;
-                                font-weight: bold;
+            &>.ant-card-body {
+                padding: 10px;
+                display: flex;
+                flex-wrap: wrap;
+                justify-content: center;
+                &>.chart-body {
+                    .chart-card {
+                        width: 207px;
+                        text-align: center;
+                        margin: 5px;
+                        padding: 0;
+                        &>.ant-card {
+                            border: 2px solid #CCCCCC;
+                            &>.ant-card-head {
+                                border-bottom: 2px solid #CCCCCC;
+                                min-height: 20px;
+                                cursor: default;
+                                padding: 0 10px;
+                                &>.ant-card-head-wrapper {
+                                    &>.ant-card-head-title {
+                                        font-size: 14px;
+                                        padding: 6px 0;
+                                        .anticon {
+                                            cursor: pointer;
+                                        }
+                                    }
+                                }
                             }
                         }
-                        cursor: pointer;
-                        canvas {
-                            cursor: pointer;
-                        }
-                        .table-default {
-                            background-image: url(/images/table-default.png);
-                            width: 100%;
-                            height: 100%;
-                            background-position: center;
-                            background-size: contain;
-                            background-repeat: no-repeat;
-                            cursor: pointer;
+                        .ant-card-cover {
+                            height: 200px;
+                            .cover-body {
+                                padding: 10px;
+                                .thumb {
+                                    height: 132px;
+                                    .deny-body {
+                                        height: 100%;
+                                        width: 100%;
+                                        display: flex;
+                                        position: absolute;
+                                        text-align: center;
+                                        justify-content: center;
+                                        flex-direction: column;
+                                        z-index: 1;
+                                        .deny-tip {
+                                            height: 40px;
+                                            line-height: 40px;
+                                            background: rgba(218, 218, 218, 0.5);
+                                            border: 2px solid #aaaaaa;
+                                            font-weight: bold;
+                                        }
+                                    }
+                                    cursor: pointer;
+                                    canvas {
+                                        cursor: pointer;
+                                    }
+                                    .table-default {
+                                        background-image: url(/images/table-default.png);
+                                        width: 100%;
+                                        height: 100%;
+                                        background-position: center;
+                                        background-size: contain;
+                                        background-repeat: no-repeat;
+                                        cursor: pointer;
+                                    }
+                                    .chart-default {
+                                        background-image: url(/images/chart-default.png);
+                                        width: 100%;
+                                        height: 100%;
+                                        background-position: center;
+                                        background-size: contain;
+                                        background-repeat: no-repeat;
+                                        cursor: pointer;
+                                        opacity: .3;
+                                    }
+                                }
+                                .desc {
+                                    text-align: left;
+                                    height: 41px;
+                                }
+                                .footer {
+                                    margin-top: 6px;
+                                }
+                            }
+                            .ant-row-flex-bottom {
+                                cursor: default;
+                                .anticon {
+                                    cursor: pointer;
+                                }
+                            }
                         }
-                        .chart-default {
-                            background-image: url(/images/chart-default.png);
-                            width: 100%;
-                            height: 100%;
-                            background-position: center;
-                            background-size: contain;
-                            background-repeat: no-repeat;
-                            cursor: pointer;
-                            opacity: .3;
+                        .ant-card-body {
+                            padding: 10px;
                         }
                     }
-                    .desc {
-                        text-align: left;
-                        height: 41px;
-                    }
-                    .footer {
-                        margin-top: 6px;
-                    }
-                }
-                .ant-row-flex-bottom {
-                    cursor: default;
-                    .anticon {
-                        cursor: pointer;
+                    .chart-card-hide {
+                        display: none;
                     }
                 }
             }
         }
-        .chart-card-hide {
-            display: none;
-        }
     }
 }
 .popover-group {

src/components/chartDesigner/layout.jsx

@@ -15,7 +15,6 @@ class ChartDesigner extends React.Component {
         if(code !== 'create') {
             dispatch({ type: 'chart/remoteDetail', code: code });
             dispatch({ type: 'chart/remoteGroupList', code: code });
-            dispatch({ type: 'main/addRecentRecord', tarId: code, recordType: 0})
         }
     }
     render() {

src/components/common/CardList.jsx

@@ -2,7 +2,7 @@ import React from 'react'
 import { Menu, Icon, Card, Row, Col, Dropdown } from 'antd'
 import { connect } from 'dva'
 import Ellipsis from 'ant-design-pro/lib/Ellipsis'
-import { dateFormat } from '../../utils/baseUtils'
+import moment from 'moment'
 import Thumbnail from './thumbnail'
 import './CardList.less'
 const CardGrid = Card.Grid
@@ -87,12 +87,17 @@ class CardList extends React.Component {
                     cover={
                         <Col className='cover-body'>
                             <Row className='thumb' onClick={() => {
-                                dispatch({ type: 'dashboardDesigner/reset' });
-                                dispatch({ type: 'main/redirect', path: '/dashboard/' + l.code });
+                                if(type === 'dashboard') {
+                                    dispatch({ type: 'dashboardDesigner/reset' });
+                                    dispatch({ type: 'main/redirect', path: '/dashboard/' + l.code });
+                                }else {
+                                    dispatch({ type: 'chartDesigner/reset' });
+                                    dispatch({ type: 'main/redirect', path: '/chart/' + l.code });
+                                }
                             }}>
                                 <Thumbnail mode={type} type={l.type} code={l.code} option={l.chartOption} thumbnail={l.thumbnail}/> 
                             </Row>
-                            <Row className='desc'>
+                            {type === 'chart' && <Row className='desc'>
                                 <Ellipsis tooltip={l.description.length > 16} lines={2}>{
                                     <span>
                                     { filterLabel ?
@@ -107,10 +112,10 @@ class CardList extends React.Component {
                                     }
                                 </span>
                                 }</Ellipsis>
-                            </Row>
+                            </Row>}
                             <Row className='footer' type='flex' justify='end' align='bottom'>
-                                <Col style={{ textAlign: 'left' }} span={22}>
-                                    <Row>{l.createBy} {dateFormat(l.createTime, 'yyyy-MM-dd')}</Row>
+                                <Col style={{ textAlign: 'left', lineHeight: '30px' }} span={22}>
+                                    <Row>{l.createBy} {moment(l.createTime).format('YYYY-MM-DD')}</Row>
                                 </Col>
                                 <Col span={2} style={{ textAlign: 'right' }}>
                                     <Dropdown overlay={operationMenu} trigger={['click']}>

src/components/common/CardList.less

@@ -69,12 +69,9 @@
             }
             .footer {
                 margin-top: 6px;
-            }
-        }
-        .ant-row-flex-bottom {
-            cursor: default;
-            .anticon {
-                cursor: pointer;
+                .anticon {
+                    font-size: 24px;
+                }
             }
         }
     }
@@ -103,7 +100,7 @@
         .cover-body {
             padding: 10px;
             .thumb {
-                height: 182px;
+                height: 222px;
                 cursor: pointer;
                 canvas {
                     cursor: pointer;
@@ -134,12 +131,9 @@
             }
             .footer {
                 margin-top: 6px;
-            }
-        }
-        .ant-row-flex-bottom {
-            cursor: default;
-            .anticon {
-                cursor: pointer;
+                .anticon {
+                    font-size: 24px;
+                }
             }
         }
     }

src/components/common/dataPreview/dataPreview.jsx

@@ -34,7 +34,7 @@ class DataPreview extends React.Component {
     }
 
     render() {
-        const { dataList, visibleBox, hideBox } = this.props;
+        const { fetching, dataList, visibleBox, hideBox } = this.props;
         const { columns, dataSource } = dataList;
         const { screenWidth, screenHeight } = this.state;
         const tableBodyWidth = screenWidth * 0.8 - 10 - 10 - 18;
@@ -62,9 +62,10 @@ class DataPreview extends React.Component {
                 size='small'
                 pagination={{ defaultPageSize: Math.floor(tableBodyHeight/tableRowHeight) || 10 }}
                 scroll={{ x: columns ? columns.length * 200 : tableBodyWidth, y: tableBodyHeight }}
+                loading={fetching}
             />
         </Modal>
     }
 }
 
-export default connect(({ present: { dataList } }) => ({ dataList }))(DataPreview);
+export default connect(({ present: { loading, dataList } }) => ({ fetching: loading.effects['dataList/remoteDataList'], dataList }))(DataPreview);

src/components/common/login/login.jsx

@@ -51,7 +51,6 @@ class LoginComponent extends React.Component {
         const { dispatch } = this.props;
         const { autoLogin } = this.state;
 
-        const self = this;
         let body = {
             userName: username,
             passWord: password
@@ -66,7 +65,7 @@ class LoginComponent extends React.Component {
                 if(!r.err && r.data.code > 0) {
                     return r.data.data;
                 }else {
-                    self.setState({
+                    this.setState({
                         notice: r.err || r.data.msg,
                     });
                     throw (r.err || r.data.msg);
@@ -92,6 +91,7 @@ class LoginComponent extends React.Component {
                 });
             }).catch(ex => {
                 this.setState({
+                    notice: ex,
                     fetching: false
                 });
                 console.error('登录失败', ex);

src/components/common/navigator.less

@@ -7,6 +7,7 @@
     .navigator-menu {
         border-bottom: none;
         .nav-page {
+            font-size: 16px;
             border-bottom: none !important;
             .hover {
                 ::after {

src/components/dashboard/list.jsx

@@ -2,7 +2,6 @@ import React from 'react'
 import { Layout, Button, Icon, Input, Menu, Dropdown, Card, Col, Row } from 'antd'
 import { connect } from 'dva'
 import moment from 'moment'
-import Ellipsis from 'ant-design-pro/lib/Ellipsis'
 import TransferBox from '../common/selectUserBox/selectUserBox';
 import AccessObjectBox from '../datasource/accessObjectBox'
 import Thumbnail from './thumbnail'
@@ -91,7 +90,7 @@ class DashboardList extends React.Component {
 
         let cards = list.filter(l => {
             let reg = new RegExp('(' + filterLabel + '){1}', 'ig');
-            return (l.name || '').search(reg) !== -1 || (l.description || '').search(reg) !== -1;
+            return (l.name || '').search(reg) !== -1;
         }).sort((a, b) => {
             return new Date(b.createTime) - new Date(a.createTime)
         }).map( (l, i) => (
@@ -123,26 +122,10 @@ class DashboardList extends React.Component {
                             <Row className='thumb' onClick={() => {
                                 dispatch({ type: 'dashboardDesigner/reset' });
                                 dispatch({ type: 'main/redirect', path: '/dashboard/' + l.code });
-                                dispatch({ type: 'dashboard/addHistory', code: l.code });
+                                dispatch({ type: 'main/addRecentRecord', tarId: l.code, recordType: 1});
                             }}>
                                 <Thumbnail type={l.type} code={l.code} option={l.chartOption} thumbnail={l.thumbnail}/>
                             </Row>
-                            <Row className='desc'>
-                                <Ellipsis tooltip={l.description.length > 16} lines={2}>{
-                                    <span>
-                                    { filterLabel ?
-                                        ((l.description || '').split(new RegExp(`(${filterLabel})`, 'i')).map((fragment, i) => {
-                                            return (
-                                                fragment.toLowerCase().replace(new RegExp('(\\\\)', 'g'), '\\$1').replace(reg, '\\$1') === filterLabel.toLowerCase() ?
-                                                <span key={i} style={{fontWeight: 'bold', color: 'red'}} className="highlight">{fragment}</span> :
-                                                fragment
-                                            )
-                                        }
-                                        )) : l.description
-                                    }
-                                </span>
-                                }</Ellipsis>
-                            </Row>
                             <Row className='footer' type='flex' justify='end' align='bottom'>
                                 <Col style={{ textAlign: 'left' }} span={22}>
                                     <Row>{l.creatorName} {moment(l.createTime).format('YYYY-MM-DD')}</Row>

src/components/dashboard/list.less

@@ -35,61 +35,67 @@
             text-align: center;
             margin: 5px;
             padding: 0;
-
-            .ant-card-head {
-                min-height: 20px;
-                cursor: default;
-                .ant-card-head-title {
-                    font-size: 14px;
-                    padding: 6px 0;
-                    .anticon {
-                        cursor: pointer;
+            &>.ant-card {
+                border: 2px solid #CCCCCC;
+                .ant-card-head {
+                    border-bottom: 2px solid #CCCCCC;
+                    min-height: 20px;
+                    cursor: default;
+                    .ant-card-head-title {
+                        font-size: 14px;
+                        padding: 6px 0;
+                        .anticon {
+                            cursor: pointer;
+                        }
                     }
                 }
-            }
-
-            .ant-card-cover {
-                height: 247px;
-                .cover-body {
-                    padding: 10px;
-                    .thumb {
-                        height: 182px;
-                        cursor: pointer;
-                        canvas {
+    
+                .ant-card-cover {
+                    height: 247px;
+                    .cover-body {
+                        padding: 10px;
+                        .thumb {
+                            height: 222px;
                             cursor: pointer;
+                            canvas {
+                                cursor: pointer;
+                            }
+                            .table-default {
+                                background-image: url(/images/table-default.png);
+                                width: 100%;
+                                height: 100%;
+                                background-position: center;
+                                background-size: contain;
+                                background-repeat: no-repeat;
+                                cursor: pointer;
+                            }
+                            .dashboard-default {
+                                background-image: url(/images/dashboard-default.png);
+                                width: 100%;
+                                height: 100%;
+                                background-position: center;
+                                background-size: contain;
+                                background-repeat: no-repeat;
+                                cursor: pointer;
+                                opacity: .3;
+                            }
                         }
-                        .table-default {
-                            background-image: url(/images/table-default.png);
-                            width: 100%;
-                            height: 100%;
-                            background-position: center;
-                            background-size: contain;
-                            background-repeat: no-repeat;
-                            cursor: pointer;
+                        .desc {
+                            text-align: left;
+                            height: 41px;
                         }
-                        .dashboard-default {
-                            background-image: url(/images/dashboard-default.png);
-                            width: 100%;
-                            height: 100%;
-                            background-position: center;
-                            background-size: contain;
-                            background-repeat: no-repeat;
-                            cursor: pointer;
-                            opacity: .3;
+                        .footer {
+                            margin-top: 6px;
+                            .anticon {
+                                font-size: 24px;
+                            }
                         }
                     }
-                    .desc {
-                        text-align: left;
-                        height: 41px;
-                    }
-                    .footer {
-                        margin-top: 6px;
-                    }
-                }
-                .ant-row-flex-bottom {
-                    cursor: default;
-                    .anticon {
-                        cursor: pointer;
+                    .ant-row-flex-bottom {
+                        cursor: default;
+                        .anticon {
+                            cursor: pointer;
+                        }
                     }
                 }
             }

src/components/dashboardDesigner/layout.jsx

@@ -21,7 +21,6 @@ class DashboardDesigner extends React.Component {
         const { code } = this.props.match.params;
         if (code !== 'create') {
             dispatch({ type: 'dashboard/remoteDetail', code: code });
-            dispatch({ type: 'main/addRecentRecord', tarId: code, recordType: 1})
         }
     }
 

src/components/homePage/homePage.jsx

@@ -2,83 +2,52 @@ import React from 'react';
 import { Layout, Card } from 'antd'
 import CardList from '../common/CardList'
 import { connect } from 'dva'
-import Markdown from 'react-markdown'
-
-const markdown = `
-# 快速上手
-点击访问[产品文档](http://192.168.253.189:82)
-
-`
+import './homePage.less'
 const { Content, Sider } = Layout
 
 class HomePage extends React.Component {
     constructor(props) {
         super(props);
         this.state = {
-
         }
     }
 
     componentDidMount() {
         const { dispatch } = this.props;
-        dispatch({ type: 'main/fetchRecentChart' });
-        dispatch({ type: 'main/fetchRecentDashboard' });
+        dispatch({ type: 'recent/fetchRecentChart' });
+        dispatch({ type: 'recent/fetchRecentDashboard' });
     }
 
     render() {
+        const { recent } = this.props;
+        const { recentChart, recentDashboard } = recent;
+
         return (
-            <Layout>
+            <Layout className='homepage'>
                 <Content>
-                    <Layout>
-                        <Content>
-                            <Card style={{
-                                display: 'flex',
-                                flexWrap: 'wrap',
-                                justifyContent: 'left'
-                            }}
-                                bodyStyle={{
-                                    padding: '10px'
-                                }}
-                            >
-                                <CardList
-                                    mode='homepage' 
-                                    type='chart' 
-                                    list={this.props.main.recentChart}
-                                />
-                            </Card>
-                            <Card style={{
-                                display: 'flex',
-                                flexWrap: 'wrap',
-                                justifyContent: 'left'
-                            }}
-                                bodyStyle={{
-                                    padding: '10px'
-                            }}
-                            >
-                                <CardList
-                                    mode='homepage' 
-                                    type='dashboard' 
-                                    list={this.props.main.recentDashboard}
-                                />
-                            </Card>
-                        </Content>
-                        <Sider width={300}> 
-                            {/* TODO: 主页尚未上线，暂时隐藏  */}
-                            <Card>
-                                <Markdown source={markdown}/>
-                            </Card>
-                            <Card>
-                                {/* 公告与帮助区 */}
-                            </Card>
-                            <Card>
-                                {/* 最近访问记录 */}
-                            </Card>
-                        </Sider>
-                    </Layout>
+                    <Card className='recent-chart' title='最近访问图表' >
+                        <CardList
+                            mode='homepage' 
+                            type='chart' 
+                            list={recentChart}
+                        />
+                    </Card>
+                    <Card className='recent-dashboard' title='最近访问看板'>
+                        <CardList
+                            mode='homepage' 
+                            type='dashboard' 
+                            list={recentDashboard}
+                        />
+                    </Card>
                 </Content>
+                <Sider width={280}> 
+                    <Card>
+                        <div><h1>快速上手</h1><p>点击访问<a href="http://192.168.253.189:82" target="_blank" rel="noopener noreferrer">产品文档</a></p></div>
+                    </Card>
+                </Sider>
             </Layout>
         );
     }
 }
 
-export default connect(({ present: { main } }) =>  { return { main }})(HomePage)
+export default connect(({ present: { recent } }) =>  { return { recent }})(HomePage)

src/components/homePage/homePage.less

@@ -0,0 +1,49 @@
+.homepage {
+    &>.ant-layout-content {
+        padding: 20px;
+        &>.ant-card {
+            &>.ant-card-head {
+                padding: 0;
+                height: 42px;
+                min-height: 42px;
+                &>.ant-card-head-wrapper {
+                    &>.ant-card-head-title {
+                        padding: 8px 10px;
+                    }
+                }
+            }
+            &>.ant-card-body {
+                padding: 10px;
+                &>.ant-card-grid {
+                    &>.ant-card {
+                        border: 2px solid #CCCCCC;
+                        &>.ant-card-head {
+                            border-bottom: 2px solid #CCCCCC;
+                            min-height: 20px;
+                            cursor: default;
+                            padding: 0 10px;
+                        }
+                        &>.ant-card-body {
+                            padding: 10px;
+                        }
+                    }
+                }
+            }
+        }
+        &>.recent-chart {
+            margin-bottom: 20px;
+        }
+        &>.recent-dashboard {
+
+        }
+    }
+    .ant-layout-sider {
+        padding: 20px 20px 20px 0;
+        background: transparent;
+        &>.ant-layout-sider-children {
+            &>.ant-card {
+                height: 100%;
+            }
+        }
+    }
+}

src/index.js

@@ -13,6 +13,7 @@ import user from './models/user'
 import chartPolicy from './models/chartPolicy'
 import dataSourcePolicy from './models/dataSourcePolicy'
 import dataList from './models/dataList'
+import recent from './models/recent'
 import './utils/baseUtils'
 import './index.less'
 import createLoading from 'dva-loading';
@@ -44,6 +45,7 @@ app.model(user); // 用户
 app.model(chartPolicy); // 图表策略
 app.model(dataSourcePolicy); // 数据源策略
 app.model(dataList); // 数据列表
+app.model(recent); // 最近访问记录
 
 // 4. Router
 app.router(indexRouter);

src/models/chart.js

@@ -128,17 +128,23 @@ export default {
     },
     effects: {
         *fetchList(action, { select, call, put }) {
+            const { pageNum, pageSize } = action;
+            const body = {
+                pageNum: pageNum || 1,
+                pageSize: pageSize || 999
+            }
             try{
                 const chart = yield select(state => state.present.chart);
                 if(!action.mandatory && chart.list.length > 0) {
                     return;
                 }
                 const res = yield call(service.fetch, {
-                    url: URLS.CHART_LIST
+                    url: URLS.CHART_LIST,
+                    body
                 });
-                console.log('请求图表列表', res);
+                console.log('请求图表列表', body, res);
                 if(!res.err && res.data.code > 0) {
-                    let list = res.data.data.map(d => {
+                    let list = res.data.data.list.map(d => {
                         let chartOption = d.chartOption ? JSON.parse(d.chartOption) : {};
                         return {
                             code:  d.chartId+'',
@@ -160,7 +166,7 @@ export default {
                     message.error('请求图表列表失败: ' + (res.err || res.data.msg));
                 }
             }catch(e) {
-                console.log(e);
+                console.log(body, e);
                 message.error('请求图表列表失败: ' + e);
             }
         },

src/models/dashboard.js

@@ -27,17 +27,23 @@ export default {
     },
     effects: {
         *fetchList(action, {select, call, put}) {
+            const { pageNum, pageSize } = action;
+            const body = {
+                pageNum: pageNum || 1,
+                pageSize: pageSize || 999
+            }
             try {
                 const dashboard = yield select(state => state.present.dashboard);
                 if(!action.mandatory && dashboard.list.length > 0) {
                     return;
                 }
                 const res = yield call(service.fetch, {
-                    url: URLS.DASHBOARD_LIST
+                    url: URLS.DASHBOARD_LIST,
+                    body
                 });
-                console.log('请求看板列表', res);
+                console.log('请求看板列表', body, res);
                 if(!res.err && res.data.code > 0) {
-                    const resData = res.data.data;
+                    const resData = res.data.data.list;
                     let list = resData.map(d => {
                         let items = d.bdConfiguration ? JSON.parse(d.bdConfiguration) : [];
                         return {
@@ -56,7 +62,7 @@ export default {
                     message.error('请求看板列表失败: ' + (res.err || res.data.msg));
                 }
             }catch(e) {
-                console.log(e);
+                console.log(body, e);
                 message.error('请求看板列表失败: ' + e)
             }
         },

src/models/dataConnect.js

@@ -100,6 +100,11 @@ export default {
     },
     effects: {
         *fetchList(action, { select, call, put, takeEvery, takeLatest }) {
+            const { pageNum, pageSize } = action;
+            const body = {
+                pageNum: pageNum || 1,
+                pageSize: pageSize || 999
+            }
             try {
                 const dataConnect = yield select(state => state.present.dataConnect);
                 if(!action.mandatory && dataConnect.list.length > 0) {
@@ -107,11 +112,11 @@ export default {
                 }
                 const res = yield call(service.fetch, {
                     url: URLS.DATACONNECT_LIST,
-                    body: {}
+                    body
                 });
-                console.log('请求数据连接配置列表',  res);
+                console.log('请求数据连接配置列表', body,  res);
                 if(!res.err && res.data.code > 0) {
-                    let data = res.data.data.map((r, i) => {
+                    let data = res.data.data.list.map((r, i) => {
                         return {
                             key: i,
                             code: r.id,
@@ -131,7 +136,7 @@ export default {
                 }
             }catch(e) {
                 message.error('读取数据连接配置列表错误: ' + e);
-                console.log(e);
+                console.error(body, e);
             }
         },
         *remoteValidate(action, { select, call, put, takeEvery, takeLatest }) {

src/models/dataSource.js

@@ -156,7 +156,11 @@ export default {
     },
     effects: {
         *fetchList(action, { select, call, put, takeEvery, takeLatest }) {
-            const body = {};
+            const { pageNum, pageSize } = action;
+            const body = {
+                pageNum: pageNum || 1,
+                pageSize: pageSize || 999
+            }
             try {
                 const dataSource = yield select(state => state.present.dataSource);
                 if(!action.mandatory && dataSource.list.length > 0) {
@@ -169,7 +173,7 @@ export default {
                 
                 console.log('请求数据源列表', body, res);
                 if(!res.err && res.data.code > 0) {
-                    let list = res.data.data.map((r, i) => {
+                    let list = res.data.data.list.map((r, i) => {
                         let dbConfig = JSON.parse(r.dbConfig);
                         let tags = JSON.parse(r.dataTag);
                         return {
@@ -191,7 +195,7 @@ export default {
                     message.error('读取数据源列表错误: ' + (res.err || res.data.msg));
                 }
             }catch(e) {
-                console.log(e);
+                console.error(body, e);
                 message.error('读取数据源列表错误: ' + e);
             }
             

src/models/main.js

@@ -1,7 +1,8 @@
+/**
+ * 全局model
+ */
 import { routerRedux } from 'dva/router'
 import { message } from 'antd'
-import * as service from '../services/index'
-import URLS from '../constants/url'
 
 
 const code = window.localStorage.getItem('usercode');
@@ -22,8 +23,6 @@ export default {
             role,
         },
         currentPage: '',
-        recentChart: [],
-        recentDashboard: []
     },
     reducers: {
         setPage(state, action) {
@@ -42,14 +41,6 @@ export default {
         setAuthenticated(state, action) {
             const { authenticated } = action;
             return { ...state, authenticated };
-        },
-        listRecentChart(state, action) {
-            const { recentChart } = action;
-            return { ...state, recentChart };
-        },
-        listRecentDashboard(state, action) {
-            const { recentDashboard } = action;
-            return { ...state, recentDashboard };
         }
     },
     effects: {
@@ -85,98 +76,13 @@ export default {
                 yield put({ type: 'dashboard/list', list: [] });
                 yield put({ type: 'user/list', list: [] });
                 yield put({ type: 'userGroup/list', list: [] });
+                yield put({ type: 'recent/listRecentChart', recentChart: [] });
+                yield put({ type: 'recent/listRecentDashboard', recentDashboard: [] });
             }catch(e) {
                 console.log(e);
                 message.error('注销失败: ' + e);
             }
         },
-        *fetchRecentChart(action, { select, call, put }) {
-            const body = {};
-            try {
-                const main = yield select(state => state.present.main);
-                if(!action.mandatory && main.recentChart.length > 0) {
-                    return;
-                }
-                const res = yield call(service.fetch, {
-                    url: URLS.HOMEPAGE_RECENT_CHART_GET,
-                    body
-                });
-                
-                console.log('请求最近访问图表', body, res);
-                if(!res.err && res.data.code > 0) {
-                    let recentChart = res.data.data.map((r, i) => {
-                        return {
-                            key: r.chartId,
-                            code: r.chartId,
-                            name: r.chartName,
-                            type: r.chartType,
-                            createBy: r.createBy,
-                            chartOption: r.chartOption,
-                            description: r.describes || "",
-                            createTime: r.createDate,
-                        }
-                    });
-                    yield put({ type: 'listRecentChart', recentChart });
-                }else {
-                    message.error('读取最近访问图表列表错误: ' + (res.err || res.data.msg));
-                }
-            }catch(e) {
-                console.log(e);
-                message.error('读取最近访问图表列表错误: ' + e);
-            }
-        },
-        *fetchRecentDashboard(action, { select, call, put }) {
-            const body = {};
-            try {
-                const main = yield select(state => state.present.main);
-                if(!action.mandatory && main.recentDashboard.length > 0) {
-                    return;
-                }
-                const res = yield call(service.fetch, {
-                    url: URLS.HOMEPAGE_RECENT_DASHBOARD_GET,
-                    body
-                });
-                console.log('请求最近访问看板', body, res);
-                if(!res.err && res.data.code > 0) {
-                    let recentDashboard = res.data.data.map((r, i) => {
-                        return {
-                            key: r.id,
-                            code: r.id,
-                            name: r.bdName,
-                            thumbnail: r.thumbnail,
-                            createBy: r.createBy,
-                            description: r.bdNote || ""
-                        }
-                    });
-                    yield put({ type: 'listRecentDashboard', recentDashboard });
-                }else {
-                    message.error('读取最近访问看板列表错误: ' + (res.err || res.data.msg));
-                }
-            }catch(e) {
-                console.log(e);
-                message.error('读取最近访问看板列表错误: ' + e);
-            }
-            
-        },
-        *addRecentRecord(action, { call }) {
-            const { tarId, recordType } = action
-            console.log(tarId, recordType)
-            try {
-                const res = yield call(service.fetch, {
-                    url: URLS.HOMEPAGE_ADD_RECENT_RECORD,
-                    body: {
-                        tarId: tarId,
-                        type: recordType
-                    }
-                });
-                console.log("添加访问记录: " + res + tarId, recordType)
-            }catch(e) {
-                console.log(e);
-                message.error('添加访问记录错误: ' + e);
-            }
-
-
-        }
     },
     subscriptions: {
         setup({ dispatch, history }) {

src/models/recent.js

@@ -0,0 +1,106 @@
+/**
+ * 历史记录
+ */
+import { message } from 'antd'
+import * as service from '../services/index'
+import URLS from '../constants/url'
+
+export default {
+    namespace: 'recent',
+    state: {
+        recentChart: [],
+        recentDashboard: []
+    },
+    reducers: {
+        listRecentChart(state, action) {
+            const { recentChart } = action;
+            return { ...state, recentChart };
+        },
+        listRecentDashboard(state, action) {
+            const { recentDashboard } = action;
+            return { ...state, recentDashboard };
+        }
+    },
+    effects: {
+        *fetchRecentChart(action, { select, call, put }) {
+            try {
+                const main = yield select(state => state.present.main);
+                if(!action.mandatory && main.recentChart.length > 0) {
+                    return;
+                }
+                const res = yield call(service.fetch, {
+                    url: URLS.HOMEPAGE_RECENT_CHART_GET,
+                });
+                
+                console.log('请求最近访问图表', res);
+                if(!res.err && res.data.code > 0) {
+                    let recentChart = res.data.data.map((r, i) => {
+                        return {
+                            key: r.chartId + '',
+                            code: r.chartId + '',
+                            name: r.chartName,
+                            type: r.chartType,
+                            createBy: r.createBy,
+                            chartOption: r.chartOption,
+                            description: r.describes || "",
+                            createTime: r.createDate,
+                        }
+                    });
+                    yield put({ type: 'listRecentChart', recentChart });
+                }else {
+                    message.error('读取最近访问图表列表错误: ' + (res.err || res.data.msg));
+                }
+            }catch(e) {
+                console.error(e);
+                message.error('读取最近访问图表列表错误: ' + e);
+            }
+        },
+        *fetchRecentDashboard(action, { select, call, put }) {
+            try {
+                const main = yield select(state => state.present.main);
+                if(!action.mandatory && main.recentDashboard.length > 0) {
+                    return;
+                }
+                const res = yield call(service.fetch, {
+                    url: URLS.HOMEPAGE_RECENT_DASHBOARD_GET,
+                });
+                console.log('请求最近访问看板', res);
+                if(!res.err && res.data.code > 0) {
+                    let recentDashboard = res.data.data.map((r, i) => {
+                        return {
+                            key: r.id + '',
+                            code: r.id + '',
+                            name: r.bdName,
+                            thumbnail: r.thumbnail,
+                            createBy: r.createBy,
+                            description: r.bdNote || ""
+                        }
+                    });
+                    yield put({ type: 'listRecentDashboard', recentDashboard });
+                }else {
+                    message.error('读取最近访问看板列表错误: ' + (res.err || res.data.msg));
+                }
+            }catch(e) {
+                console.error(e);
+                message.error('读取最近访问看板列表错误: ' + e);
+            }
+            
+        },
+        *addRecentRecord(action, { call }) {
+            const { tarId, recordType } = action
+            try {
+                const res = yield call(service.fetch, {
+                    url: URLS.HOMEPAGE_ADD_RECENT_RECORD,
+                    body: {
+                        tarId: tarId,
+                        type: recordType
+                    }
+                });
+                console.log("添加访问记录: " + res + tarId, recordType)
+            }catch(e) {
+                console.log(e);
+                message.error('添加访问记录错误: ' + e);
+            }
+        }
+    }
+};