add machine page

15 files changed, 134 insertions, 24 deletions

diff --git a/front-end/src/app.jsx b/front-end/src/app.jsx
index 6606564..cf10cfc 100644
--- a/front-end/src/app.jsx
+++ b/front-end/src/app.jsx
@@ -9,9 +9,10 @@ import Layout from 'component/layout/index.jsx'
 // page
 import Login from './page/login/index.jsx'
 import Home from './page/home/index.jsx'
-
 import Status from './page/status/index.jsx'
+import Machine from './page/machine/index.jsx'
 import PPolicy from './page/ppolicy/index.jsx'
+
 import DetailInfo from './page/detailInfo/index.jsx'
 import MachinelInfo from './page/machineInfo/index.jsx'
 
@@ -66,6 +67,7 @@ class App extends React.Component {
 
                     <Route exact path="/home/" component={Home}/>
                     <Route exact path="/status/" component={Status}/>
+                    <Route exact path="/machine/" component={Machine}/>
                     <Route exact path="/ppolicy/" component={PPolicy}/>
 
                     <Route exact path="/portal/" component={Portal}/>
diff --git a/front-end/src/component/farmer-card/index.css b/front-end/src/component/farmer-card/index.css
new file mode 100644
index 0000000..cd3a3a8
--- /dev/null
+++ b/front-end/src/component/farmer-card/index.css
@@ -0,0 +1,5 @@
+.flex-box{
+    display: flex;
+    justify-content:center;
+    align-items:center;
+}
\ No newline at end of file
diff --git a/front-end/src/component/farmer-card/index.jsx b/front-end/src/component/farmer-card/index.jsx
index d4c8638..e226e4f 100644
--- a/front-end/src/component/farmer-card/index.jsx
+++ b/front-end/src/component/farmer-card/index.jsx
@@ -1,5 +1,5 @@
 import React from 'react';
-
+import {Link}     from 'react-router-dom';
 import NavTop from 'component/nav-top/index.jsx';
 // import './index.css';
 import {Image, Card, Button, List, Icon} from 'semantic-ui-react'
@@ -32,12 +32,16 @@ class FarmerCard extends React.Component {
                             </List>
                         </Card.Description>
                     </Card.Content>
-                    <Card.Content extra>
+                    <Card.Content extra className='flex-box'>
                         <div className='ui buttons'>
                             {/*todo link to machine page*/}
-                            <Button basic color='blue'>
-                                Other records
-                            </Button>
+
+                                <Link color='linkedin' to={'/machineInfo/' + machine.machine_sn}>
+                                    <Button basic color='blue'>
+                                    Other records
+                                    </Button>
+                                </Link>
+
                         </div>
                     </Card.Content>
                 </Card>
diff --git a/front-end/src/component/farmer-detail-card/index.css b/front-end/src/component/farmer-detail-card/index.css
new file mode 100644
index 0000000..cd3a3a8
--- /dev/null
+++ b/front-end/src/component/farmer-detail-card/index.css
@@ -0,0 +1,5 @@
+.flex-box{
+    display: flex;
+    justify-content:center;
+    align-items:center;
+}
\ No newline at end of file
diff --git a/front-end/src/component/farmer-detail-card/index.jsx b/front-end/src/component/farmer-detail-card/index.jsx
index bee5456..6fb4ff1 100644
--- a/front-end/src/component/farmer-detail-card/index.jsx
+++ b/front-end/src/component/farmer-detail-card/index.jsx
@@ -1,7 +1,7 @@
 import React from 'react';
 
 import NavTop from 'component/nav-top/index.jsx';
-// import './index.css';
+import './index.css';
 import {Image, Card, Button, List, Icon} from 'semantic-ui-react'
 class FarmerDetailCard extends React.Component {
     constructor(props){
@@ -33,13 +33,13 @@ class FarmerDetailCard extends React.Component {
                             </List>
                         </Card.Description>
                     </Card.Content>
-                    <Card.Content extra>
+                    <Card.Content extra className='flex-box'>
 
                         <div className='ui buttons'>
                             {/*todo link to machine page*/}
-                            <Button basic mini color='grey'>
-                                {branch_num} branches involved
-                            </Button>
+                                <Button basic mini color='grey'>
+                                    {branch_num} branches involved
+                                </Button>
                         </div>
                     </Card.Content>
                 </Card>
diff --git a/front-end/src/component/history-records-pane1/index.jsx b/front-end/src/component/history-records-pane1/index.jsx
index bd92ac2..608b3d0 100644
--- a/front-end/src/component/history-records-pane1/index.jsx
+++ b/front-end/src/component/history-records-pane1/index.jsx
@@ -32,9 +32,15 @@ class HistoryRecordPane1 extends React.Component {
         this.loadMachineRecordListByBranch()
     }
     componentWillReceiveProps(nextProps) {
+        let _this = this
         this.setState({
             branches: nextProps.branches,
             machine_sn: nextProps.machine_sn,
+        },() => {
+            if(this.state.branches.length > 0) {
+                _this.handleBranchTagClick(_this.state.branches[0].value)
+            }
+
         });
     }
     handleBranchTagClick(branch_id){
@@ -96,6 +102,9 @@ class HistoryRecordPane1 extends React.Component {
             <div>
                 <div className="branch-tags-container">
                     {branch_tags}
+                    <div>
+                        current num: {this.state.currentTotal}
+                    </div>
                 </div>
 
                     <MachineRecordTable list={this.state.currentList} total={this.state.currentTotal} current={this.state.currentPage} loadfunc={this.loadMachineRecordListByBranch}/>
diff --git a/front-end/src/component/nav-top/index.jsx b/front-end/src/component/nav-top/index.jsx
index 2fa02a2..08a4e8d 100644
--- a/front-end/src/component/nav-top/index.jsx
+++ b/front-end/src/component/nav-top/index.jsx
@@ -87,9 +87,8 @@ class NavTop extends React.Component {
                     </li>
                     <li><Link to="/status"><span className="glyphicon glyphicon-tasks" aria-hidden="true"></span>Status</Link>
                     </li>
-                    {/*<li><Link to="/classifiedDisplay">分类展示</Link><a href="/https/git.postgresql.org/status"> <span className="glyphicon glyphicon-tasks" aria-hidden="true"></span> Status</a>*/}
-                    {/*</li>*/}
-                    <li><a href="#"> <span className="glyphicon glyphicon-blackboard" aria-hidden="true"></span>Machine</a>
+
+                    <li><Link to="/machine"> <span className="glyphicon glyphicon-blackboard" aria-hidden="true"></span>Machine</Link>
                     </li>
 
                     <li className="dropdown">
diff --git a/front-end/src/page/detailInfo/index.jsx b/front-end/src/page/detailInfo/index.jsx
index 419c70f..612331b 100644
--- a/front-end/src/page/detailInfo/index.jsx
+++ b/front-end/src/page/detailInfo/index.jsx
@@ -219,7 +219,7 @@ class DetailInfo extends React.Component {
                     <Segment vertical>Farmer Info</Segment>
                     <FarmerCard machine={machine}></FarmerCard>
                     {/*//todo add a catalog*/}
-                    <div className="affix">aaaa</div>
+                    {/*<div className="affix">aaaa</div>*/}
                 </div>
 
                 <div className="col-md-9">
diff --git a/front-end/src/page/machine/index.css b/front-end/src/page/machine/index.css
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/front-end/src/page/machine/index.css
diff --git a/front-end/src/page/machine/index.jsx b/front-end/src/page/machine/index.jsx
new file mode 100644
index 0000000..be5914f
--- /dev/null
+++ b/front-end/src/page/machine/index.jsx
@@ -0,0 +1,60 @@
+import React from 'react';
+// import './index.css';
+import ResultFilter from 'component/result-filter/index.jsx';
+import RecordTable    from 'util/record-table/index.jsx';
+import MachineService      from 'service/machine-service.jsx'
+import MachineTable    from 'util/machine-table/index.jsx';
+import PGUtil        from 'util/util.jsx'
+
+const _util = new PGUtil();
+const _machine = new MachineService();
+class Machine extends React.Component {
+    constructor(props) {
+        super(props);
+        this.state = {
+            isLoading: false,
+            currentPage: 1,
+            total: 3,
+            machines: [],
+        },
+
+        // this.onPageChange = this.onPageChange.bind(this);
+
+        this.loadMachineList = this.loadMachineList.bind(this);
+    }
+
+    componentDidMount(){
+        this.loadMachineList();
+    }
+
+    loadMachineList(page=1){
+        _machine.getMachineList().then(res => {
+            this.setState({
+                machines: res.results,
+                total: res.count,
+                isLoading: false
+            });
+        }, errMsg => {
+            _util.errorTips(errMsg);
+        });
+    }
+
+
+    render() {
+        return (
+            <div id="page-wrapper">
+                <h1>machine page</h1>
+                <p>
+                    Shown here is the latest status of each farm member for each branch it has reported on in the last
+                    30 days.
+                    Use the farm member link for history of that member on the relevant branch.
+                </p>
+
+                <MachineTable list={this.state.machines} total={this.state.total} current={this.state.currentPage} loadfunc={this.loadRecordList}/>
+
+            </div>
+        )
+    }
+}
+
+export default Machine;
\ No newline at end of file
diff --git a/front-end/src/page/portal/index.jsx b/front-end/src/page/portal/index.jsx
index 9e292c6..e6c968b 100644
--- a/front-end/src/page/portal/index.jsx
+++ b/front-end/src/page/portal/index.jsx
@@ -68,11 +68,6 @@ class Portal extends React.Component {
     }
 
     render() {
-        let show = this.state.isLoading ? "none" : "block";
-        let style = {
-            display: show
-        };
-
         return (
             <div className="container-fluid detail-container">
 
diff --git a/front-end/src/service/machine-service.jsx b/front-end/src/service/machine-service.jsx
new file mode 100644
index 0000000..9b5188b
--- /dev/null
+++ b/front-end/src/service/machine-service.jsx
@@ -0,0 +1,19 @@
+import PGUtil    from 'util/util.jsx'
+import PGConstant from 'util/constant.jsx'
+// const _const = new PGConstant();
+const _util       = new PGUtil();
+
+class MachineService{
+    getMachineList(pageNum){
+        let url = PGConstant.base_url + '/machines';
+        return _util.request({
+            type    : 'get',
+            url     : url,
+            data    : {
+                pageNum : pageNum
+            }
+        });
+    }
+}
+
+export default MachineService;
\ No newline at end of file
diff --git a/front-end/src/util/machine-table/index.jsx b/front-end/src/util/machine-table/index.jsx
index a5154bc..e18001f 100644
--- a/front-end/src/util/machine-table/index.jsx
+++ b/front-end/src/util/machine-table/index.jsx
@@ -63,10 +63,14 @@ class MachineTable extends React.Component {
             return (
                 <Table.Row key={index} className={color}>
                     {/*alias*/}
-                    <Table.Cell><a href="#">{machine.alias}</a></Table.Cell>
+                    <Table.Cell>
+                        <Link color='linkedin' to={'machineInfo/' + machine.machine_sn}>
+                            {machine.alias}
+                        </Link>
+                    </Table.Cell>
 
                     {/*system*/}
-                    <Table.Cell><a href="#">{system}</a></Table.Cell>
+                    <Table.Cell>{system}</Table.Cell>
 
                     {/*State*/}
                     <Table.Cell>
diff --git a/web/apps/user_operation/views.py b/web/apps/user_operation/views.py
index 03aa40a..ab38fc0 100644
--- a/web/apps/user_operation/views.py
+++ b/web/apps/user_operation/views.py
@@ -46,6 +46,13 @@ class UserMachineListViewSet(mixins.ListModelMixin, viewsets.GenericViewSet):
     serializer_class = UserMachineManageSerializer
     # pagination_class = StandardResultsSetPagination
 
+class PublicMachineListViewSet(mixins.ListModelMixin, viewsets.GenericViewSet):
+    """
+    List all machines
+    """
+    queryset = UserMachine.objects.all().order_by('add_time')
+    serializer_class = UserMachineManageSerializer
+
 class UserPortalInfoViewSet(mixins.ListModelMixin, mixins.RetrieveModelMixin, viewsets.GenericViewSet):
     """
      user info
diff --git a/web/pgperffarm/urls.py b/web/pgperffarm/urls.py
index 904d055..fac3b6d 100644
--- a/web/pgperffarm/urls.py
+++ b/web/pgperffarm/urls.py
@@ -31,11 +31,12 @@ from test_records.auth import MachineAuthToken
 #     'get': 'list',
 #     'post': 'create'
 # })
-from user_operation.views import UserMachineListViewSet, UserPortalInfoViewSet, UserMachineRecordByBranchListViewSet
+from user_operation.views import UserMachineListViewSet, UserPortalInfoViewSet, UserMachineRecordByBranchListViewSet, \
+    PublicMachineListViewSet
 
 router = DefaultRouter()
 router.register(r'records', TestRecordListViewSet, base_name="records")
-
+router.register(r'machines', PublicMachineListViewSet, base_name="machines")
 router.register(r'branches', TestBranchListViewSet, base_name="branches")
 router.register(r'records-by-branch', TestRecordListByBranchViewSet, base_name="records-by-branch")
 # router.register(r'status-records', TestStatusRecordListViewSet, base_name="status-records")