自定义iconfont图标引用

src/components/chart/list.jsx

@@ -12,16 +12,16 @@ import Ellipsis from 'ant-design-pro/lib/Ellipsis'
 import 'ant-design-pro/dist/ant-design-pro.css'
 import GroupSelector from '../common/groupSelector/popover'
 import Thumbnail from './thumbnail'
-import DistributeBox from './distributeBox';
+import DistributeBox from './distributeBox'
 import TransferBox from '../common/selectUserBox/selectUserBox'
 import DeleteBox from '../common/deleteBox/deleteBox'
 import { arrayToTree } from '../../utils/baseUtils'
 import ListFilter from '../common/listFilter/index'
+import CusIcon from '../common/cusIcon/index'
 import './list.less'
 const { Content } = Layout
 const CardGrid = Card.Grid
 
-
 class ChartList extends React.Component {
     constructor(props) {
         super(props);
@@ -360,16 +360,18 @@ class ChartList extends React.Component {
                                 { this.generateGroupTags() }
                             </Col>
                             <Col className='search'>
-                                <Col style={{ padding: '0 5px' }}>
-                                    <ListFilter modelName='chart' model={chart} />
-                                </Col>
-                                <Col >
-                                    <Button style={{ marginRight: '8px' }} onClick={() => {
+                                <Col>
+                                    <Button className='btn-refresh' onClick={() => {
                                         dispatch({ type: 'chart/setFilterLabel', label: '' });
                                         dispatch({ type: 'chart/fetchList', mandatory: true });
                                     }}>
-                                        <Icon type="sync" />
+                                        <CusIcon type='bi-refresh'/>
                                     </Button>
+                                </Col>
+                                <Col>
+                                    <ListFilter modelName='chart' model={chart} />
+                                </Col>
+                                <Col >
                                     <Button onClick={() => {
                                         dispatch({ type: 'dataSource/fetchList' });
                                         this.setState({

src/components/chart/list.less

@@ -36,8 +36,12 @@
                     }
                     .search {
                         display: flex;
-                        > div:first-child {
-                            margin-right: 5px;
+                        >div {
+                            margin-left: 8px;
+                        }
+                        .btn-refresh {
+                            border: none;
+                            font-size: 18px;
                         }
                     } 
                 }

src/components/common/cusIcon/index.jsx

@@ -0,0 +1,5 @@
+import { Icon } from 'antd'
+
+export default Icon.createFromIconfontCN({
+    scriptUrl: '../../../../static/iconfont/iconfont.js'
+});

src/components/common/listFilter/index.jsx

@@ -3,7 +3,6 @@ import { connect } from 'dva'
 import { DatePicker, Input, Select } from 'antd'
 import moment from 'moment'
 import './index.less'
-const { Search } = Input
 const { Option } = Select
 const { RangePicker } = DatePicker
 
@@ -80,7 +79,7 @@ class ListFilter extends React.Component {
             >
             </RangePicker> 
         }else if(type === 'string') {
-            return <Search
+            return <Input
                 style={{ width: 150 }}
                 placeholder="请输入关键字"
                 value={filterLabel}

src/components/dashboard/list.jsx

@@ -9,6 +9,7 @@ import ShareBox from './shareBox'
 import CopyBox from './copyBox'
 import ListFilter from '../common/listFilter/index'
 import EllipsisTooltip from '../common/ellipsisTooltip/index'
+import CusIcon from '../common/cusIcon/index'
 import './list.less'
 const { Content } = Layout
 const { Option } = Select
@@ -353,11 +354,8 @@ class DashboardList extends React.Component {
                                 { [].concat(currentMenuParents).reverse().map(m => m.name).join(' > ') }
                             </Col>
                             <Col className='search'>
-                                <Col style={{ padding: '0 5px' }}>
-                                    <ListFilter modelName='dashboard' model={dashboard}/>
-                                </Col>
-                                <Col >
-                                    <Button style={{ marginRight: '8px' }} onClick={() => {
+                                <Col>
+                                    <Button className='btn-refresh' onClick={() => {
                                         dispatch({ type: 'dashboard/setFilterLabel', label: '' });
                                         if(!currentMenu ||  currentMenu.code === '-1') {
                                             // dispatch({ type: 'dashboard/fetchList', mandatory: true });
@@ -365,8 +363,13 @@ class DashboardList extends React.Component {
                                             dispatch({ type: 'dashboard/remoteMenuDashboardList', menuCode: currentMenu.code });
                                         }
                                     }}>
-                                        <Icon type="sync" />
+                                        <CusIcon type='bi-refresh'/>
                                     </Button>
+                                </Col>
+                                <Col>
+                                    <ListFilter modelName='dashboard' model={dashboard}/>
+                                </Col>
+                                <Col>
                                     <Button disabled={!currentMenu || currentMenu.code === '-1'} onClick={() => {
                                         dispatch({ type: 'dashboardDesigner/reset' });
                                         dispatch({ type: 'dashboard/remoteQucikAdd', menuCode: currentMenu.code });

src/components/dashboard/list.less

@@ -32,8 +32,12 @@
                 }
                 .search {
                     display: flex;
-                    > div:first-child {
-                        margin-right: 5px;
+                    >div {
+                        margin-left: 8px;
+                    }
+                    .btn-refresh {
+                        border: none;
+                        font-size: 18px;
                     }
                 }
             }

src/components/dashboardDesigner/header.jsx

@@ -1,6 +1,7 @@
 import React from 'react'
 import { Input, Icon, Button, Popconfirm, Switch } from 'antd'
 import { connect } from 'dva'
+import DeleteBox from '../common/deleteBox/deleteBox'
 import './header.less'
 
 class Header extends React.Component {
@@ -8,7 +9,8 @@ class Header extends React.Component {
         super(props);
         this.state = {
             visibleConfirm: false,
-            visibleSettingBox: false
+            visibleSettingBox: false,
+            visibleDeleteBox: false,
         }
     }
 
@@ -25,6 +27,7 @@ class Header extends React.Component {
 
     render() {
         const { dashboardDesigner, dispatch } = this.props;
+        const { visibleDeleteBox } = this.state;
         const { editMode } = dashboardDesigner;
 
         return (
@@ -127,6 +130,23 @@ class Header extends React.Component {
                             dispatch({ type: 'dashboard/remoteAdd' });
                         }
                     }}><Icon type='save' />保存</Button>}
+                    {this.isOwner() && <Button style={{ marginLeft: '8px' }} onClick={() => {
+                        this.setState({
+                            visibleDeleteBox: true
+                        });
+                    }}><Icon type='delete' />删除</Button>}
+                    {visibleDeleteBox && <DeleteBox
+                        visibleBox={visibleDeleteBox}
+                        text={<div><span>确定要删除报表【{dashboardDesigner.name}】吗？</span></div>}
+                        hideBox={() => {
+                            this.setState({
+                                visibleDeleteBox: false
+                            })
+                        }}
+                        okHandler={() => {
+                            dispatch({ type: 'dashboard/remoteDelete', code: dashboardDesigner.code })
+                            dispatch({ type: 'main/redirect', path: '/workshop/dashboard' });
+                    }} />}
                 </div>
             </div>
         );

src/components/dataConnect/list.jsx

@@ -5,6 +5,7 @@ import DeleteBox from '../common/deleteBox/deleteBox'
 import EmptyContent from '../common/emptyContent/index'
 import DataConnectBox from '../dataSourceDetail/dataConnectBox'
 import ListFilter from '../common/listFilter/index'
+import CusIcon from '../common/cusIcon/index'
 import './list.less'
 const CardGrid = Card.Grid
 const { Content } = Layout
@@ -241,17 +242,19 @@ class DataConnect extends React.Component {
                             <Col style={{ display: 'flex' }}>
                             </Col>
                             <Col className='search'>
-                                <Col style={{ padding: '0 5px' }}>
-                                    <ListFilter modelName='dataConnect' model={dataConnect} />
-                                </Col>
-                                <Col >
-                                    <Button style={{ marginRight: '8px' }} onClick={() => {
+                                <Col>
+                                    <Button className='btn-refresh' onClick={() => {
                                         dispatch({ type: 'dataConnect/setFilterLabel', label: '' });
                                         dispatch({ type: 'dataConnect/fetchList', mandatory: true });
                                     }}>
-                                        <Icon type="sync" />
+                                        <CusIcon type='bi-refresh'/>
                                     </Button>
-                                    <Button onClick={() => {
+                                </Col>
+                                <Col>
+                                    <ListFilter modelName='dataConnect' model={dataConnect} />
+                                </Col>
+                                <Col>
+                                    <Button className='btn-add' onClick={() => {
                                         // 设置新增默认值
                                         dispatch({ type: 'dataConnect/setNewModel', model: { dbType: 'oracle', dbName: 'orcl', port: 1521 } });
                                         dispatch({ type: 'dataConnect/setNewModelFields', fields: [
@@ -259,7 +262,7 @@ class DataConnect extends React.Component {
                                             { name: 'boxOperation', value: 'create' }
                                         ] });
                                     }}>
-                                        <Icon type="plus" />添加数据链接
+                                        添加数据链接
                                     </Button>
                                 </Col>
                             </Col>

src/components/dataConnect/list.less

@@ -10,8 +10,12 @@
                     flex: 1;
                     .search {
                         display: flex;
-                        > div:first-child {
-                            margin-right: 5px;
+                        >div {
+                            margin-left: 8px;
+                        }
+                        .btn-refresh {
+                            border: none;
+                            font-size: 18px;
                         }
                     } 
                 }

src/components/dataSource/list.jsx

@@ -10,6 +10,7 @@ import DeleteBox from '../common/deleteBox/deleteBox'
 import DataPreview from '../common/dataPreview/dataPreview'
 import ListFilter from '../common/listFilter/index'
 import EllipsisTooltip from '../common/ellipsisTooltip/index'
+import CusIcon from '../common/cusIcon/index'
 import './list.less'
 const { Content } = Layout
 const { Option } = Select
@@ -394,16 +395,18 @@ class DataSource extends React.Component {
                                 { this.generateGroupTags() }
                             </Col>
                             <Col className='search'>
-                                <Col style={{ padding: '0 5px' }}>
-                                    <ListFilter modelName='dataSource' model={dataSource} />
-                                </Col>
                                 <Col>
-                                    <Button style={{ marginRight: '8px' }} onClick={() => {
+                                    <Button className='btn-refresh' onClick={() => {
                                         dispatch({ type: 'dataSource/setFilterLabel', label: '' });
                                         dispatch({ type: 'dataSource/fetchList', mandatory: true });
                                     }}>
-                                        <Icon type="sync" />
+                                        <CusIcon type='bi-refresh'/>
                                     </Button>
+                                </Col>
+                                <Col>
+                                    <ListFilter modelName='dataSource' model={dataSource} />
+                                </Col>
+                                <Col>
                                     <Dropdown overlay={(
                                         <Menu onClick={(item, key, keyPath) => {
                                             const type = item.key;
@@ -417,7 +420,7 @@ class DataSource extends React.Component {
                                         </Menu>
                                     )} trigger={['click']}>
                                         <Button>
-                                            <Icon type="plus" />添加数据源
+                                            添加数据源
                                         </Button>
                                     </Dropdown>
                                 </Col>

src/components/dataSource/list.less

@@ -36,8 +36,12 @@
                 }
                 .search {
                     display: flex;
-                    > div:first-child {
-                        margin-right: 5px;
+                    >div {
+                        margin-left: 8px;
+                    }
+                    .btn-refresh {
+                        border: none;
+                        font-size: 18px;
                     }
                 }
             }

src/index.js

@@ -18,9 +18,9 @@ import dataList from './models/dataList'
 import authority from './models/authority'
 import logs from './models/logs'
 import recent from './models/recent'
+import createLoading from 'dva-loading';
 import './utils/baseUtils'
 import './themes/default/index.less'
-import createLoading from 'dva-loading';
 
 // 1. Initialize
 const app = dva({