add record/filters
authorHongyuan Ma <CS_MaleicAcid@163.com>
Sat, 23 Jun 2018 05:08:10 +0000 (13:08 +0800)
committerHongyuan Ma <CS_MaleicAcid@163.com>
Sat, 23 Jun 2018 05:08:10 +0000 (13:08 +0800)
front-end/src/component/result-filter/index.jsx
front-end/src/util/basic-table/index.css
front-end/src/util/basic-table/index.jsx
web/apps/test_records/filters.py [new file with mode: 0644]
web/apps/test_records/views.py
web/pgperffarm/settings.py

index 77bfe282e4ddc207127519bfdda1b47aa7219fe5..69991b715000e22951abf93352653dea9d5e3c3a 100644 (file)
@@ -14,28 +14,37 @@ class ResultFilter extends React.Component {
             selected: [{
                 'cate': 'Category 1',
                 'index': 2,
-                'data': [
-                    'All',
-                    'Improving',
-                    'Regressive'
-                ],
-            }, {
-                'cate': 'Category 2',
-                'index': 1,
                 'data': [
                     'All',
                     '7 days',
                     '30 days'
                 ],
-            }, {
-                'cate': 'Category 3',
-                'index': 1,
-                'data': [
-                    'All',
-                    'item3-1',
-                    'item3-2'
-                ],
             }],
+            // selected: [{
+            //     'cate': 'Category 1',
+            //     'index': 2,
+            //     'data': [
+            //         'All',
+            //         'Improving',
+            //         'Regressive'
+            //     ],
+            // }, {
+            //     'cate': 'Category 2',
+            //     'index': 1,
+            //     'data': [
+            //         'All',
+            //         '7 days',
+            //         '30 days'
+            //     ],
+            // }, {
+            //     'cate': 'Category 3',
+            //     'index': 1,
+            //     'data': [
+            //         'All',
+            //         'item3-1',
+            //         'item3-2'
+            //     ],
+            // }],
             isClear: true
         };
 
index f8c930f454c4048f0e3b8601ecd65190cf802634..0fe34f8c4987b396f2ff662cd0d9f2057fc28f67 100644 (file)
@@ -8,4 +8,36 @@
 
 .ReactTable .rt-tr-group:nth-child(2n) {
     background-color: #ffffff;
+}
+
+.bgc-clear{
+    background-color: #ffffff;
+}
+
+.anonymous {
+    color: #e8e8e8;
+}
+
+.anonymous :hover {
+    color: lightgrey;
+}
+.improved {
+    color: #7cb305;
+}
+
+.quo {
+    color: #40a9ff;
+}
+
+.regressive {
+    color: #fa541c;
+}
+
+.mini-label {
+    font-weight: 100!important;
+    font-size: 0.1em!important;
+    min-width: 1.3em!important;
+    min-height: 0.1em!important;
+    padding: .2em!important;
+    line-height: 0.5em!important;
 }
\ No newline at end of file
index 21b49e5b6f946bc77ca3547f7c1c940d9e344f88..e63141dd5f2d79f01903e0ce7bcc1e876596b8fe 100644 (file)
@@ -1,8 +1,21 @@
 import React from 'react';
-import {Icon, Table, Menu, Message, Button} from 'semantic-ui-react'
+import {Icon, Table, Label, Message, Button} from 'semantic-ui-react'
 import Pagination from 'util/pagination/index.jsx'
 import './index.css';
 
+function Bubble(props) {
+
+    if (props.num <= 0) {
+        return null;
+    }
+    let className = props.name + 'IconClassName';
+    return (
+        <Label circular size="mini" className={"mini-label " + className}>
+            {props.num}
+        </Label>
+    );
+}
+
 // general basic table
 class BasicTable extends React.Component {
     constructor(props) {
@@ -14,9 +27,11 @@ class BasicTable extends React.Component {
         }
     }
 
-    onPageNumChange(current){
+
+
+    onPageNumChange(current) {
         this.setState({
-            currentPage : current
+            currentPage: current
         }, () => {
             this.props.loadfunc(current);
         });
@@ -36,6 +51,9 @@ class BasicTable extends React.Component {
             let branch = record.pg_info.pg_branch;
 
             let trend = record.trend
+            let improvedIconClassName = trend.improved > 0 ? 'improved' : 'anonymous'
+            let quoIconClassName = trend.quo > 0 ? 'quo' : 'anonymous'
+            let regressiveIconClassName = trend.regressive > 0 ? 'regressive' : 'anonymous'
             return (
 
                 <Table.Row key={index}>
@@ -50,23 +68,27 @@ class BasicTable extends React.Component {
 
                     {/*trending-data*/}
                     <Table.Cell textAlign='center'>
-                        <Icon color='green' name='checkmark' size='large'/>{trend.improved}
+                        <Icon className={"bgc-clear " + improvedIconClassName} name='smile outline' size='large'/>
+                        <Bubble num={trend.improved} name="improved"/>
                     </Table.Cell>
                     <Table.Cell textAlign='center'>
-                        <Icon color='green' name='meh' size='large'/>{trend.quo}
+                        <Icon className={"bgc-clear " + quoIconClassName} name='meh outline' size='large'/>
+                        <Bubble num={trend.quo} name="quo"/>
                     </Table.Cell>
                     <Table.Cell textAlign='center'>
-                        <i className="fa fa-meh-o"></i>{trend.regressive}
+                        <Icon className={"bgc-clear " + regressiveIconClassName} name='frown outline'
+                              size='large'/>
+                        <Bubble num={trend.regressive} name="regressive"/>
                     </Table.Cell>
                     <Table.Cell textAlign='center'>
-                        <a href={'detail/' + record.uuid}>
-                            <Button size='mini' color='linkedin'>
-                                <Icon name='linkify' /> Link
-                            </Button>
+                        <a color='linkedin' href={'detailInfo/' + record.uuid}>
+                            {/*<Button size='mini' color='linkedin'>*/}
+                            <Icon name='linkify'/> Link
+                            {/*</Button>*/}
                         </a>
                     </Table.Cell>
                     {/*date*/}
-                    <Table.Cell>{new Date().toDateString()}</Table.Cell>
+                    <Table.Cell>{record.add_time}</Table.Cell>
                 </Table.Row>
             );
         });
@@ -97,18 +119,19 @@ class BasicTable extends React.Component {
                     <Table.Row>
                         <Table.HeaderCell colSpan='10'>
                             {/*<Menu size='small' floated='right' pagination>*/}
-                                {/*<Menu.Item as='a' icon>*/}
-                                    {/*<Icon name='chevron left'/>*/}
-                                {/*</Menu.Item>*/}
-                                {/*<Menu.Item as='a'>1</Menu.Item>*/}
-                                {/*<Menu.Item as='a'>2</Menu.Item>*/}
-                                {/*<Menu.Item as='a'>3</Menu.Item>*/}
-                                {/*<Menu.Item as='a'>4</Menu.Item>*/}
-                                {/*<Menu.Item as='a' icon>*/}
-                                    {/*<Icon name='chevron right'/>*/}
-                                {/*</Menu.Item>*/}
+                            {/*<Menu.Item as='a' icon>*/}
+                            {/*<Icon name='chevron left'/>*/}
+                            {/*</Menu.Item>*/}
+                            {/*<Menu.Item as='a'>1</Menu.Item>*/}
+                            {/*<Menu.Item as='a'>2</Menu.Item>*/}
+                            {/*<Menu.Item as='a'>3</Menu.Item>*/}
+                            {/*<Menu.Item as='a'>4</Menu.Item>*/}
+                            {/*<Menu.Item as='a' icon>*/}
+                            {/*<Icon name='chevron right'/>*/}
+                            {/*</Menu.Item>*/}
                             {/*</Menu>*/}
-                            <Pagination style={style} onChange={(current) => this.onPageNumChange(current)} pageSize={2} current={this.state.currentPage} total={this.props.total}/>
+                            <Pagination style={style} onChange={(current) => this.onPageNumChange(current)} pageSize={2}
+                                        current={this.state.currentPage} total={this.props.total}/>
 
                         </Table.HeaderCell>
 
@@ -118,6 +141,8 @@ class BasicTable extends React.Component {
         );
 
     }
+
+
 }
 
 export default BasicTable;
\ No newline at end of file
diff --git a/web/apps/test_records/filters.py b/web/apps/test_records/filters.py
new file mode 100644 (file)
index 0000000..998f3d7
--- /dev/null
@@ -0,0 +1,17 @@
+
+# -*- coding: utf-8 -*-
+import django_filters
+from django.db.models import Q
+
+from .models import TestRecord
+
+
+class TestRecordListFilter(django_filters.rest_framework.FilterSet):
+    """
+    TestRecordListFilter
+    """
+    date = django_filters.DateTimeFilter(name='add_time',lookup_expr='gte')
+
+    class Meta:
+        model = TestRecord
+        fields = ['date', ]
\ No newline at end of file
index 41a766751c0fe02456cb2ec8567306b00f69cafa..2f4d9112e8c21fedfd12825af0e35f3fc94afc11 100644 (file)
@@ -1,6 +1,7 @@
 # -*- coding: utf-8 -*-
 from __future__ import unicode_literals
 
+import django_filters
 import shortuuid
 
 from django.contrib.auth.hashers import make_password
@@ -8,6 +9,7 @@ from django.shortcuts import render
 from rest_framework.pagination import PageNumberPagination
 
 from exception import TestDataUploadError
+from filters import TestRecordListFilter
 from models import UserMachine, TestCategory
 from pgperffarm.settings import DB_ENUM
 from .serializer import TestRecordListSerializer, TestRecordDetailSerializer, LinuxInfoSerializer, MetaInfoSerializer, \
@@ -36,7 +38,8 @@ class TestRecordListViewSet(mixins.ListModelMixin, viewsets.GenericViewSet):
     queryset = TestRecord.objects.all().order_by('add_time')
     serializer_class = TestRecordListSerializer
     pagination_class = StandardResultsSetPagination
-
+    filter_backends = (django_filters.rest_framework.DjangoFilterBackend,)
+    filter_class = TestRecordListFilter
 
 class TestRecordDetailViewSet(mixins.RetrieveModelMixin, viewsets.GenericViewSet):
     """
index afe66afc1d5ec57b14d4451b9ba24b10ebca71ff..a02e3cfda6529e1a344b50490c4a29d17d166e0b 100644 (file)
@@ -46,9 +46,11 @@ INSTALLED_APPS = (
     'django.contrib.staticfiles',
     'django_gravatar',
     'rest_framework',
+    'django_filters',
     'rest_framework.authtoken',
     'users',
     'test_records',
+    'crispy_forms',
     'user_operation',
 )
 
@@ -133,6 +135,7 @@ REST_FRAMEWORK = {
     #     'rest_framework.authentication.BasicAuthentication',
     #     'rest_framework.authentication.SessionAuthentication',
     # ),
+    'DEFAULT_FILTER_BACKENDS': ('django_filters.rest_framework.DjangoFilterBackend',),
     'DEFAULT_PAGINATION_CLASS': 'rest_framework.pagination.LimitOffsetPagination',
     'PAGE_SIZE': 20
 }