seperate upload and report screens

client/src/constants/menuItems.js

@@ -1,4 +1,4 @@
-import DoorLockCharges from "../scenes/DoorLockCharges";
+import UploadDLockData from "../scenes/UploadDLockData";
 import Home from "../scenes/Home";
 
 export const mainMenuItems = [
@@ -9,9 +9,9 @@ export const mainMenuItems = [
         component: Home,
     },
     {
-        id: 'doorLockCharges',
+        id: 'uploadDLockData',
-        title: 'Door Lock Charges',
+        title: 'Upload DLock Data',
-        url: '/door-lock-charges',
+        url: '/upload-dlock-data',
-        component: DoorLockCharges,
+        component: UploadDLockData,
     },
 ];

client/src/scenes/DoorLockCharges/index.js

@@ -1,59 +0,0 @@
-import React, { Component } from 'react';
-import { connect } from 'react-redux';
-
-import { Container, Form, Loader } from "semantic-ui-react";
-
-import MainMenu from '../../components/MainMenu';
-import { fetchDoorLockCharges } from "../../store/actions";
-
-class DoorLockCharges extends Component {
-
-    render () {
-        const { pending } = this.props.pending;
-        return (
-            <Container>
-                <MainMenu/>
-                <h3>Door Lock Charges</h3>
-                <hr/>
-                <Form>
-                    <Form.Group widths="equal">
-                        <Form.Input
-                            fluid
-                            required
-                            label="Start date"
-                            type="date"
-                        />
-                        <Form.Input
-                            fluid
-                            required
-                            label="End date"
-                            type="date"
-                        />
-                    </Form.Group>
-                    <Form.Input
-                        fluid
-                        required
-                        label="Select DLock file"
-                        type="file"
-                    />
-                    <Form.Button onClick={this.props.fetchDoorLockCharges}>Generate Report</Form.Button>
-                </Form>
-                {
-                    pending && <Loader active />
-                }
-            </Container>
-        );
-    }
-}
-
-const mapStateToProps = state => ({
-    incidents: state.doorLockCharges.incidents,
-    pending: state.doorLockCharges.pending,
-    error: state.doorLockCharges.error,
-});
-
-const mapDispatchToProps = (dispatch) => ({
-    fetchDoorLockCharges: () => fetchDoorLockCharges(dispatch),
-});
-
-export default connect(mapStateToProps, mapDispatchToProps)(DoorLockCharges);

client/src/scenes/Home/index.js

@@ -1,37 +1,34 @@
 import React, { Component } from 'react';
 
-import { Container } from 'semantic-ui-react';
+import { Container, Form } from "semantic-ui-react";
 
 import MainMenu from '../../components/MainMenu';
 
 class Home extends Component {
-    state = {
-        apiStatus: 'loading',
-    };
-
-    componentDidMount() {
-        fetch('/api')
-            .then(response => response.json())
-            .then(result => {
-                if (result.status === 1) {
-                    this.setState({apiStatus: 'working'});
-                } else {
-                    this.setState({apiStatus: 'NOT WORKING !'});
-                }
-            })
-            .catch(err => {
-                this.setState({apiStatus: `ERROR : ${err}`});
-            })
-    }
 
     render () {
-        const {apiStatus} = this.state;
         return (
             <Container>
                 <MainMenu/>
-                <h3>CRM Integration</h3>
+                <h3>Report</h3>
                 <hr/>
-                <h5>Integration API Status : {apiStatus}</h5>
+                <Form>
+                    <Form.Group widths="equal">
+                        <Form.Input
+                            fluid
+                            required
+                            label="Start date"
+                            type="date"
+                        />
+                        <Form.Input
+                            fluid
+                            required
+                            label="End date"
+                            type="date"
+                        />
+                    </Form.Group>
+                    <Form.Button>Generate Report</Form.Button>
+                </Form>
             </Container>
         );
     }

client/src/scenes/UploadDLockData/index.js

@@ -0,0 +1,39 @@
+import React, { Component } from 'react';
+import { connect } from 'react-redux';
+
+import { Container, Form } from "semantic-ui-react";
+
+import MainMenu from '../../components/MainMenu';
+import { uploadDoorLockData } from "../../store/actions";
+
+class UploadDLockData extends Component {
+
+    render () {
+        return (
+            <Container>
+                <MainMenu/>
+                <h3>DLock Data</h3>
+                <hr/>
+                <Form>
+                    <Form.Input
+                        fluid
+                        required
+                        label="Select DLock file"
+                        type="file"
+                    />
+                    <Form.Button onClick={this.props.uploadDoorLockData}>Upload</Form.Button>
+                </Form>
+            </Container>
+        );
+    }
+}
+
+const mapStateToProps = (state) => ({
+
+});
+
+const mapDispatchToProps = (dispatch) => ({
+    uploadDoorLockData: () => uploadDoorLockData(dispatch),
+});
+
+export default connect(mapStateToProps, mapDispatchToProps)(UploadDLockData);

client/src/store/actions/doorLockActions.js

@@ -1,17 +1,17 @@
 import {
-    FETCH_DOOR_LOCK_CHARGES_PENDING,
+    UPLOAD_DOOR_LOCK_DATA_PENDING,
-    FETCH_DOOR_LOCK_CHARGES_SUCCESS,
+    UPLOAD_DOOR_LOCK_DATA_SUCCESS,
-    FETCH_DOOR_LOCK_CHARGES_FAILED
+    UPLOAD_DOOR_LOCK_DATA_FAILED
 } from "../constants";
 
-export const fetchDoorLockCharges = (dispatch) => {
+export const uploadDoorLockData = (dispatch) => {
-    dispatch({type: FETCH_DOOR_LOCK_CHARGES_PENDING});
+    dispatch({type: UPLOAD_DOOR_LOCK_DATA_PENDING});
-    fetch('/api/doorLockCharges')
+    fetch('/api/doorLockData')
         .then(response => response.json())
         .then(data => {
-            dispatch({type: FETCH_DOOR_LOCK_CHARGES_SUCCESS, payload: data})
+            dispatch({type: UPLOAD_DOOR_LOCK_DATA_SUCCESS, payload: data})
         })
         .catch(err => {
-            dispatch({type: FETCH_DOOR_LOCK_CHARGES_FAILED, payload: err})
+            dispatch({type: UPLOAD_DOOR_LOCK_DATA_FAILED, payload: err})
         })
 };

client/src/store/constants.js

@@ -1,3 +1,3 @@
-export const FETCH_DOOR_LOCK_CHARGES_PENDING = 'FETCH_DOOR_LOCK_CHARGES_PENDING';
+export const UPLOAD_DOOR_LOCK_DATA_PENDING = 'UPLOAD_DOOR_LOCK_DATA_PENDING';
-export const FETCH_DOOR_LOCK_CHARGES_SUCCESS = 'FETCH_DOOR_LOCK_CHARGES_SUCCESS';
+export const UPLOAD_DOOR_LOCK_DATA_SUCCESS = 'UPLOAD_DOOR_LOCK_DATA_SUCCESS';
-export const FETCH_DOOR_LOCK_CHARGES_FAILED = 'FETCH_DOOR_LOCK_CHARGES_FAILED';
+export const UPLOAD_DOOR_LOCK_DATA_FAILED = 'UPLOAD_DOOR_LOCK_DATA_FAILED';

client/src/store/reducers/doorLockReducers.js

@@ -1,30 +1,30 @@
 import {
-    FETCH_DOOR_LOCK_CHARGES_PENDING,
+    UPLOAD_DOOR_LOCK_DATA_PENDING,
-    FETCH_DOOR_LOCK_CHARGES_SUCCESS,
+    UPLOAD_DOOR_LOCK_DATA_SUCCESS,
-    FETCH_DOOR_LOCK_CHARGES_FAILED
+    UPLOAD_DOOR_LOCK_DATA_FAILED
 } from "../constants";
 
 const initialState = {
-    incidents: [],
     pending: false,
+    result: {},
     error: '',
 };
 
-export const doorLockCharges = (state, action) => {
+export const doorLockData = (state, action) => {
   state = state || initialState;
   action = action || {};
 
   switch(action.type){
-      case FETCH_DOOR_LOCK_CHARGES_PENDING:
+      case UPLOAD_DOOR_LOCK_DATA_PENDING:
           return Object.assign({}, state, {
               pending: true,
           });
-      case FETCH_DOOR_LOCK_CHARGES_SUCCESS:
+      case UPLOAD_DOOR_LOCK_DATA_SUCCESS:
           return Object.assign({}, state, {
-              incidents: action.payload,
               pending: false,
+              result: action.payload,
           });
-      case FETCH_DOOR_LOCK_CHARGES_FAILED:
+      case UPLOAD_DOOR_LOCK_DATA_FAILED:
           return Object.assign({}, state, {
               pending: false,
               error: action.payload,

client/src/store/reducers/index.js

@@ -1,8 +1,8 @@
 import { combineReducers } from "redux";
 
-import { doorLockCharges} from "./doorLockReducers";
+import { doorLockData} from "./doorLockReducers";
 
 export const rootReducer = combineReducers({
-    doorLockCharges
+    doorLockData
 });
 

controllers/doorLock.js

@@ -0,0 +1,9 @@
+'use strict';
+
+const uploadDoorLockData = (req, res) => {
+    res.json({status: 'ok'});
+};
+
+module.exports = {
+    uploadDoorLockData,
+};

controllers/doorLockCharges.js

@@ -1,22 +0,0 @@
-'use strict';
-
-const calculateDoorLockCharges = (req, res) => {
-    res.json([
-        {
-            member: 'Dummy Member A',
-            date: new Date(),
-            room: 'Blue room',
-            fee: 10,
-        },
-        {
-            member: 'Dummy Member B',
-            date: new Date(),
-            room: 'White room',
-            fee: 20,
-        }
-    ]);
-};
-
-module.exports = {
-    calculateDoorLockCharges,
-};

routes/index.js

@@ -1,12 +1,12 @@
 'use strict';
 
 const { apiStatusCheck } = require('../controllers/apiStatusCheck');
-const { calculateDoorLockCharges } = require('../controllers/doorLockCharges');
+const { uploadDoorLockData } = require('../controllers/doorLock');
 
 const express = require('express');
 const router = express.Router();
 
 router.get('/', apiStatusCheck);
-router.get('/doorLockCharges', calculateDoorLockCharges);
+router.get('/doorLockData', uploadDoorLockData);
 
 module.exports = router;