zhuth 7 лет назад
Родитель
Сommit
dd225389dc

+ 119 - 4
app/components/chart/list.jsx

@@ -1,9 +1,124 @@
 import React from 'react'
+import { Layout, Tabs, Button, Icon, Input, Menu, Dropdown, Card, Col, Row, Avatar } from 'antd'
+import { Link } from 'react-router-dom'
+const { Header, Content } = Layout
+const { Search } = Input
+const { TabPane } = Tabs
+const { Meta } = Card
+import { connect } from 'dva'
+import '../../models/chart'
+
+
+class ChartList extends React.Component {
+    constructor(props) {
+        super(props);
+        this.state = {
+        }
+    }
+
+    generateCard() { 
+        const list = this.props.chart.list;
+        return list.map(i => {
+            return (
+                <Card key={i.dashboardID}
+                    className='dashboard-card'
+                    cover={<img alt={i.coverAlt} src={i.coverImg} />}
+                    actions={[<Icon type="setting" />, <Icon type="edit" />, <Icon type="ellipsis" />]}
+                >
+                    <Meta
+                        avatar={<Avatar src={i.avatar} />}
+                        title={i.title}
+                        description={i.description}
+                    />
+                </Card>
+            )
+        })
+    }
+
+    render() {
+        return (
+            <Layout>
+                <Header>
+                    <div className='toolbar'>
+                        <div>
+                        </div>
+                        <div className='tools'>
+                            <Search
+                                placeholder="请输入关键字"
+                                onSearch={value => console.log(value)}
+                            />
+                            <Link to='/chart/chartdesigner/create'>
+                                <Button>
+                                    <Icon type="area-chart" />创建图表
+                                </Button>
+                            </Link>
+                        </div>
+                    </div>
+                </Header>
+                <Content>
+                </Content>
+            </Layout>
+        )
+
+        //     <Tabs
+        //         className='dashboard-tabs'
+        //         type="card"
+        //         defaultActiveKey="1"
+        //         tabBarExtraContent={
+        //             <div className='dashboard-tabs-tools'>
+        //                 <Button onClick={() => {
+        //                     dispatch({ type: activeTab == 'dashboard' ? 'databoard/remoteList' : 'dashboard/testData' });
+        //                 }}>测试数据</Button>
+        //                 <Search
+        //                     placeholder="请输入关键字"
+        //                     onSearch={value => console.log(value)}
+        //                 />
+        //                 <Dropdown overlay={(
+        //                     <Menu onClick={(item, key, keyPath) => {
+        //                         const type = item.key;
+        //                         dispatch({ type: 'dashboard/resetNewModel' });
+        //                         dispatch({ type: 'dashboard/setNewModelField', name: 'type', value: type });
+        //                         dispatch({ type: 'main/redirect', path: { pathname: '/dashboard/' + type + '/create' } });
+        //                     }}>
+        //                         <Menu.Item key='static'>报告</Menu.Item>
+        //                         <Menu.Item key='dynamic'>看板</Menu.Item>
+        //                     </Menu>
+        //                 )} trigger={['click']}>
+        //                     <Button style={{ display: 'inline-block' }}>
+        //                         <Icon type="plus" />创建
+        //                     </Button>
+        //                 </Dropdown>
+        //             </div>
+        //         }
+        //         onChange={(key) => {
+        //             this.setState({
+        //                 activeTab: key == '1' ? 'static' : 'dynamic'
+        //             });
+        //         }}
+
+        //     >
+        //         <TabPane tab="我的看板" key="1" >
+        //             <div style={{ display: 'flex', background: '#ECECEC', padding: '30px', flexWrap: 'wrap' }}>
+        //                 {this.generateCard()}
+        //             </div>
+
+
+        //         </TabPane>
+        //         <TabPane tab="我的报告" key="2" >
+        //             {/* 我的报表View */}
+        //         </TabPane>
+        //         <TabPane tab="最近打开" key="3" >
+        //             {/* 最近打开View */}
+        //         </TabPane>
+        //     </Tabs>
+
 
-class chartList extends React.Component {
-    constructor() {
-        
     }
 }
 
-export default chartList;
+
+function mapStateToProps({present: {chart}}) {
+    return { chart }
+}
+
+export default connect(mapStateToProps)(ChartList)

+ 12 - 9
app/components/chartDesigner/header.jsx

@@ -1,18 +1,21 @@
-import React from 'react';
-import { Input, Select, Icon, Button } from 'antd';
-const Option = Select.Option;
+import React from 'react'
+import { Input, Select, Icon, Button } from 'antd'
+const Option = Select.Option
 import { Link } from 'react-router-dom'
-import './header.less';
-import { connect } from 'dva';
-import { ActionCreators } from 'redux-undo';
-import chartDesigner from '../../models/chartDesigner';
+import { connect } from 'dva'
+import { ActionCreators } from 'redux-undo'
+import { hashHistory } from 'react-router'
+import '../../models/chartDesigner'
+import './header.less'
 
 const Header = ({ chartDesigner, dispatch }) => {
     return (
         <div className='header'>
             <div className='header-item toolbar-back'>
-                <Button>
-                    <Link to='/'>返回</Link>
+                <Button onClick={() => {
+                    dispatch({ type: 'main/redirect', path: '/' });
+                }}>
+                    返回
                 </Button>
             </div>
             <div className='header-item toolbar-title'>

+ 1 - 1
app/components/common/navigator.jsx

@@ -27,7 +27,7 @@ class Navigator extends React.Component {
                 <Link to='/dashboard'><Icon type="desktop" />报告与看板</Link>
             </Menu.Item>
             <Menu.Item key="chart">
-                <Link to='/chartdesigner'><Icon type="area-chart" />图表</Link>
+                <Link to='/chart'><Icon type="area-chart" />图表</Link>
             </Menu.Item>
             <Menu.Item key="datasource">
                 <Link to='/datasource'><Icon type="database" />数据源</Link>

+ 1 - 28
app/components/datasource/accessConfig.jsx

@@ -8,37 +8,10 @@ const SubMenu = Menu.SubMenu
 const MenuItem = Menu.Item
 const MenuItemGroup = Menu.ItemGroup;
 import { connect } from 'dva'
-import dataSource from '../../models/dataSource'
+import '../../models/dataSource'
 
 const DataSourceAccessConfig = ({ dataSource, dispatch }) => {
 
-    const formItemLayout = {
-        labelCol: { span: 4 },
-        wrapperCol: { span: 20 },
-    };
-
-    const dataSourceLinkMenu = (
-        <Menu
-            className='menu-datasource-link'
-            onClick={() => {
-                dispatch({ type: 'dataSource/setNewModelField', name: 'address', value: '1111adddd' });
-                dispatch({ type: 'dataSource/setNewModelField', name: 'port', value: '1234' });
-                dispatch({ type: 'dataSource/setNewModelField', name: 'type', value: {
-                    key: 'oracle',
-                    label: 'ORACLE'
-                } });
-                dispatch({ type: 'dataSource/setNewModelField', name: 'dbName', value: 'orcl' });
-                dispatch({ type: 'dataSource/setNewModelField', name: 'userName', value: 'UAS' });
-                dispatch({ type: 'dataSource/setNewModelField', name: 'password', value: 'select!#%*(' });
-            }}
-        >
-            <MenuItem>1111</MenuItem>
-            <MenuItem>2222</MenuItem>
-            <MenuItem>33333</MenuItem>
-            <MenuItem>44</MenuItem>
-        </Menu>
-    );
-
     return (
         <div>Null</div>
     );

+ 2 - 2
app/components/datasource/baseConfig.jsx

@@ -9,8 +9,8 @@ const MenuItem = Menu.Item
 const MenuItemGroup = Menu.ItemGroup
 const UploadDragger = Upload.Dragger
 import { connect } from 'dva'
-import dataSource from '../../models/dataSource'
-import dataConnect from '../../models/dataConnect'
+import '../../models/dataSource'
+import '../../models/dataConnect'
 
 const DataSourceBaseConfig = ({ dataSource, dataConnect, dispatch }) => {
 

+ 3 - 1
app/index.js

@@ -5,6 +5,7 @@ import chartDesigner from './models/chartDesigner'
 import dataSource from './models/dataSource'
 import dataConnect from './models/dataConnect'
 import dashboard from './models/dashboard'
+import chart from './models/chart'
 import './utils/baseUtils'
 import './index.less'
 
@@ -24,10 +25,11 @@ const app = dva({
 
 // 3. Model
 app.model(mainModel); // 通用action
-app.model(chartDesigner); // 图表
+app.model(chartDesigner); // 图表设计
 app.model(dataSource); // 数据源
 app.model(dataConnect); // 数据连接
 app.model(dashboard);  //报告与看板
+app.model(chart);  // 图表
 
 // 4. Router
 app.router(require('./routes/router'));

+ 22 - 0
app/models/chart.js

@@ -0,0 +1,22 @@
+export default {
+    namespace: 'chart',
+    state: {
+        list: []
+    },
+    reducer: {
+
+    },
+    effects: {
+        *fetchList(action, { call, put }) {
+            const res = yield call({
+                url: '',
+                body: ''
+            });
+        }
+    },
+    subscriptions: {
+        setup({ dispatch, history }) {
+            //dispatch({ type: 'fetchList' })
+        }
+    }
+}

+ 24 - 5
app/models/dataSource.js

@@ -280,11 +280,30 @@ export default {
             }
         },
         *remoteDelete(action, { select, call, put }) {
-            const res = yield call(service.fetch, {
-                url: URLS.DATASOURCE_DELETE,
-                body: [action.code]
-            });
-            yield put({ type: 'fetchList' });
+            const dataSource = yield select(state => state.present.dataSource);
+            const code = action.code;
+            let list = dataSource.list;
+            try {
+                const res = yield call(service.fetch, {
+                    url: URLS.DATASOURCE_DELETE,
+                    body: [code]
+                });
+                if(!res.err && res.data.code > 0) {
+                    for(let i = 0; i < list.length; i++) {
+                        if(list[i].code == code) {
+                            list.splice(i, 1);
+                            break;
+                        }
+                    }
+                    yield put({ type: 'list', data: list });
+                    message.success('删除成功');
+                }else {
+                    message.error('删除失败');
+                }
+            }catch(e) {
+                message.error('删除失败');
+                console.log(e);
+            }
         },
         *remoteModify(action, { select, call, put }) {
             try{

+ 2 - 0
app/routes/mainLayout.js

@@ -8,6 +8,7 @@ import ChartDesigner from '../components/chartDesigner/layout'
 import DataSource from '../components/datasource/dataSource'
 import DataSourceDetail from '../components/datasource/dataSourceDetail'
 import Dashboard from '../components/dashboard/dashboard'
+import Chart from '../components/chart/list'
 
 import './mainLayout.less';
 import DashboardDetail from '../components/dashboard/dashboardDetail';
@@ -26,6 +27,7 @@ const MainLayout = (history) => {
                     <Route sensitive path='/datasource/:type/:code/:tab' component={DataSourceDetail}/>
                     <Route exact sensitive path='/dashboard' component={Dashboard} />
                     <Route sensitive path='/dashboard/:code/' component={DashboardDetail}/>
+                    <Route exact sensitive path='/chart' component={Chart} />
                 </Switch>
             </Content>
         </Layout>

+ 1 - 1
app/routes/router.js

@@ -11,7 +11,7 @@ function RouterConfig({ history }) {
     <LocaleProvider locale={zhCN}>
       <Router history={history}>
         <Switch>
-          <Route sensitive path='/chartdesigner' component={ChartDesigner}/>
+          <Route sensitive path='/chart/chartdesigner/:id' component={ChartDesigner}/>
           <Route path='/' component={MainLayout}/>
         </Switch>
       </Router>