Browse Source

filterBox处理时间介于数据解析/数据源、图表分组栏样式

zhuth 6 years ago
parent
commit
0cfa17ae6d

+ 13 - 8
src/components/chart/list.jsx

@@ -190,6 +190,11 @@ class ChartList extends React.Component {
             { pGroups.map(g => (
                 <Breadcrumb.Item key={g.code}>
                     <Tag color={'blue'} >
+                        {g.code === '-1' && <Icon title="分组维护" type="bars" onClick={() => {
+                            this.setState({
+                                visibleGroupManageMentBox: true
+                            });
+                        }}/>}
                         <span onClick={() => {
                             let group = chart.groupList.find(group => group.code === g.code);
                             dispatch({ type: 'chart/setCurrentGroup', group: group });
@@ -220,7 +225,7 @@ class ChartList extends React.Component {
                                 })
                             }}
                         >
-                            <Icon style={{ marginLeft: '2px', fontSize: '12px' }} type="down" />
+                            <Icon style={{ marginLeft: '4px', fontSize: '12px' }} type="caret-down" />
                         </GroupSelector>
                     </Tag>
                 </Breadcrumb.Item>
@@ -447,15 +452,15 @@ class ChartList extends React.Component {
                 <Content>
                     <Card bordered={false} title={
                         <Row className='tools' type='flex' justify='space-between'>
-                            <Col style={{ display: 'flex', width: 'calc(100% - 324px)', overflow: 'hidden' }}>
+                            <Col className="groups" style={{ display: 'flex', width: 'calc(100% - 324px)', overflow: 'hidden' }}>
                                 <Checkbox style={{ marginTop: '4px' }} checked={noGroup} onChange={(e) => {
-                                    this.setState({noGroup: e.target.checked})
-                                }}>未分组</Checkbox>
-                                <Icon type="bars" onClick={() => {
                                     this.setState({
-                                        visibleGroupManageMentBox: true
-                                    });
-                                }}/>
+                                        noGroup: e.target.checked,
+                                        page: 1
+                                    }, () => {
+                                        this.bodyRef.current.parentNode.scrollTo(0, 0)
+                                    })
+                                }}><span className="nogroup">未分组</span></Checkbox>
                                 { this.generateGroupTags() }
                             </Col>
                             <Col className='search'>

+ 27 - 22
src/components/chart/list.less

@@ -11,29 +11,34 @@
                 .tools {
                     flex: 1;
                     flex-wrap: nowrap;
-                    .anticon-bars {
-                        cursor: pointer;
-                        line-height: 1.6;
-                        font-size: 20px;
-                        margin-right: 6px;
-                        &> svg {
-                            height: 100%;
-                        }
-                    }
-                    .group {
-                        line-height: 2.1;
-                        white-space: normal;
-                        .ant-breadcrumb-link {
-                            .ant-tag {
-                                max-width: 200px;
-                                white-space: nowrap;
-                                text-overflow: ellipsis;
-                                overflow: hidden;
-                                margin: -6px 0;
+                    .groups {
+                        .group {
+                            line-height: 2.1;
+                            white-space: normal;
+                            .ant-breadcrumb-link {
+                                .ant-tag {
+                                    cursor: default;
+                                    max-width: 200px;
+                                    white-space: nowrap;
+                                    text-overflow: ellipsis;
+                                    overflow: hidden;
+                                    margin: -6px 0;
+                                    .anticon-bars {
+                                        cursor: pointer;
+                                        vertical-align: middle;
+                                        font-size: 16px;
+                                        margin-right: 8px;
+                                        line-height: 18px;
+                                    }
+                                    &> span {
+                                        cursor: pointer;
+                                        font-size: 14px;
+                                    }
+                                }
+                            }
+                            &.nogroup {
+                                opacity: .5;
                             }
-                        }
-                        &.nogroup {
-                            opacity: .7;
                         }
                     }
                     .search {

+ 2 - 1
src/components/common/filterBox/filter.jsx

@@ -42,10 +42,11 @@ class Filter extends React.Component {
         const { key, type, operator } = filter;
         let defaultValue = type==='time' ? (
             operator === 'between' ? (
-                filter['value1'] ? [filter['value1'], filter['value2']] : null
+                filter['value1'] ? [moment(filter['value1']), moment(filter['value2'])] : null
             ) :
             (filter['value' + index] ? ( filter['value' + index].dynamic ? ( filter['value' + index] ) : moment(filter['value' + index]) ) : null)
         ) : filter['value' + index];
+        console.log(defaultValue);
         const commonProps = { defaultValue }
 
         if(['index', 'string'].indexOf(type) !== -1) {

+ 1 - 1
src/components/common/filterBox/filter2.jsx

@@ -57,7 +57,7 @@ class Filter extends React.Component {
 
         let defaultValue = type==='time' ? (
             operator === 'between' ? (
-                filter['value1'] ? [filter['value1'], filter['value2']] : null
+                filter['value1'] ? [moment(filter['value1']), moment(filter['value2'])] : null
             ) :
             (filter['value' + index] ? ( filter['value' + index].dynamic ? ( filter['value' + index] ) : moment(filter['value' + index]) ) : null)
         ) : filter['value' + index];

+ 1 - 1
src/components/common/filterBox/filterBox.jsx

@@ -259,7 +259,7 @@ class FilterBox extends React.Component {
 
         let defaultValue = type==='time' ? (
             operator === 'between' ? (
-                filter['value1'] ? [filter['value1'], filter['value2']] : null
+                filter['value1'] ? [moment(filter['value1']), moment(filter['value2'])] : null
             ) :
             (filter['value' + index] ? ( filter['value' + index].dynamic ? ( filter['value' + index] ) : moment(filter['value' + index]) ) : null)
         ) : filter['value' + index];

+ 1 - 1
src/components/common/filterBox/filterBox2.jsx

@@ -401,7 +401,7 @@ class FilterBox extends React.Component {
 
         let defaultValue = type==='time' ? (
             operator === 'between' ? (
-                filter['value1'] ? [filter['value1'], filter['value2']] : null
+                filter['value1'] ? [moment(filter['value1']), moment(filter['value2'])] : null
             ) :
             (filter['value' + index] ? ( filter['value' + index].dynamic ? ( filter['value' + index] ) : moment(filter['value' + index]) ) : null)
         ) : filter['value' + index]

+ 27 - 22
src/components/dataSource/list.less

@@ -9,29 +9,34 @@
             .datasource-tools {
                 flex: 1;
                 flex-wrap: nowrap;
-                .anticon-bars {
-                    cursor: pointer;
-                    line-height: 1.6;
-                    font-size: 20px;
-                    margin-right: 6px;
-                    &> svg {
-                        height: 100%;
-                    }
-                }
-                .group {
-                    line-height: 2.1;
-                    white-space: normal;
-                    .ant-breadcrumb-link {
-                        .ant-tag {
-                            max-width: 200px;
-                            white-space: nowrap;
-                            text-overflow: ellipsis;
-                            overflow: hidden;
-                            margin: -6px 0;
+                .groups {
+                    .group {
+                        line-height: 2.1;
+                        white-space: normal;
+                        .ant-breadcrumb-link {
+                            .ant-tag {
+                                cursor: default;
+                                max-width: 200px;
+                                white-space: nowrap;
+                                text-overflow: ellipsis;
+                                overflow: hidden;
+                                margin: -6px 0;
+                                .anticon-bars {
+                                    cursor: pointer;
+                                    vertical-align: middle;
+                                    font-size: 16px;
+                                    margin-right: 8px;
+                                    line-height: 18px;
+                                }
+                                &> span {
+                                    cursor: pointer;
+                                    font-size: 14px;
+                                }
+                            }
+                        }
+                        &.nogroup {
+                            opacity: .5;
                         }
-                    }
-                    &.nogroup {
-                        opacity: .7;
                     }
                 }
                 .search {

+ 12 - 7
src/themes/default/chart.less

@@ -4,14 +4,19 @@
             >.ant-card-head {
                 >.ant-card-head-wrapper {
                     >.ant-card-head-title {
-                        .group {
-                            .ant-tag {
-                                background: transparent;
-                                border: none;
-                                text-decoration: underline;
+                        .groups {
+                            .ant-checkbox-wrapper {
+                                color: #2C82BE;
                             }
-                            .ant-breadcrumb-separator {
-                                margin: 0;
+                            .group {
+                                .ant-tag {
+                                    color: #2C82BE;
+                                    background: transparent;
+                                    border: none;
+                                }
+                                .ant-breadcrumb-separator {
+                                    margin: 0;
+                                }
                             }
                         }
                     }

+ 12 - 7
src/themes/default/datasource.less

@@ -4,14 +4,19 @@
             >.ant-card-head {
                 >.ant-card-head-wrapper {
                     >.ant-card-head-title {
-                        .group {
-                            .ant-tag {
-                                background: transparent;
-                                border: none;
-                                text-decoration: underline;
+                        .groups {
+                            .ant-checkbox-wrapper {
+                                color: #2C82BE;
                             }
-                            .ant-breadcrumb-separator {
-                                margin: 0;
+                            .group {
+                                .ant-tag {
+                                    color: #2C82BE;
+                                    background: transparent;
+                                    border: none;
+                                }
+                                .ant-breadcrumb-separator {
+                                    margin: 0;
+                                }
                             }
                         }
                     }