Merge pull request #25 from highideas/develop

Develop

app/App.js

@@ -6,11 +6,13 @@ import 'style-loader!css-loader!less-loader!font-awesome-webpack/font-awesome-st
 
 import iClientComponent from 'components/IClient/IClient'
 import HomeComponent from 'components/Home/Home'
-import AreaComponent from 'components/Area/Area'
+import AreaComponent from 'components/Area/List/Area'
+import LastVisitsComponent from 'components/Area/Area'
 import ListClientComponent from 'components/Client/List/Client'
 import ProfileClientComponent from 'components/Client/Profile/Client'
 import SaveClientComponent from 'components/Client/Save/Client'
 import CreateVisitComponent from 'components/Visit/Create/Visit'
+import ShowVisitComponent from 'components/Visit/Show/Visit'
 import CreateAreaComponent from 'components/Area/Create/Area'
 
 ReactDOM.render(
@@ -24,7 +26,8 @@ ReactDOM.render(
             <Route path="areas" component={AreaComponent} />
             <Route path="area" component={CreateAreaComponent} />
             <Route path="visit/:clientId/" component={CreateVisitComponent} />
-            <Route path="visit/:id" component={AreaComponent} />
+            <Route path="visit/:id" component={ShowVisitComponent} />
+            <Route path="lastVisits" component={LastVisitsComponent} />
         </Route>
     </Router>,
     document.getElementById('app')

app/components/Area/Area.js

@@ -57,19 +57,6 @@ class Area extends React.Component
         }
         return (
             <div className="container hello">
-                <div className="level header">
-                    <div className="level-left">
-                        <h2 className="title is-2">iClient</h2>
-                    </div>
-                    <div className="level-right">
-                        <Link to='/area' className="button is-info is-medium">
-                            <span className="icon">
-                                <i className="fa fa-plus"></i>
-                            </span>
-                            <span>New Area</span>
-                        </Link>
-                    </div>
-                </div>
                 { this.state.areas }
             </div>
         );

app/components/Area/List/Area.js

@@ -0,0 +1,75 @@
+import React from 'react';
+import { Link } from 'react-router'
+
+import AreaService from 'services/Area'
+
+import Error from 'components/Error/Error'
+
+class Area extends React.Component
+{
+    constructor(props) {
+        super(props);
+        this.state = {
+            areas : null,
+            error : ''
+        };
+        this.getAreas();
+    }
+
+    getAreas() {
+        AreaService.getAll().then((response) => {
+            this.setState({areas: response.data.areas});
+        }).catch((error) => {
+            this.setState({error: 'Error Found: Trying get area'});
+            if (typeof error.response.data.error !== 'undefined') {
+                this.setState({error: error.response.data.error});
+            }
+        });
+    }
+
+    render() {
+        if (this.state.error) {
+            return (<Error error={this.state.error} />);
+        }
+        if (!this.state.areas) {
+            return <div>Loading...</div>;
+        }
+        const areaList = this.state.areas.map((area, key) => {
+            let line = ((key % 2) ? 'is-success' : 'is-info');
+            return (
+                <tr key={key}>
+                    <td>
+                        { area._id }
+                    </td>
+                </tr>
+            );
+        });
+
+        return (
+            <section className="">
+                <div className="container hello">
+                    <div className="level header">
+                        <div className="level-left">
+                            <h2 className="title is-2">Areas</h2>
+                        </div>
+                        <div className="level-right">
+                            <Link to='/area' className="button is-info is-medium">
+                                <span className="icon">
+                                    <i className="fa fa-plus"></i>
+                                </span>
+                                <span>New Area</span>
+                            </Link>
+                        </div>
+                    </div>
+                    <table className="table">
+                        <tbody>
+                            { areaList }
+                        </tbody>
+                    </table>
+                </div>
+            </section>
+        );
+    }
+}
+
+export default Area;

app/components/Menu/Menu.js

@@ -14,6 +14,7 @@ class Menu extends React.Component{
             links: [
                 [ '/', 'Home'],
                 ['/clients', 'Clients'],
+                ['/lastVisits', 'Last Visits'],
                 ['/areas', 'Areas']
             ]
         };

app/components/Visit/Show/Visit.js

@@ -0,0 +1,78 @@
+import React from 'react';
+import { Link } from 'react-router'
+
+import VisitService from 'services/Visit'
+import Error from 'components/Error/Error'
+import styles from 'components/Visit/Show/styles.css'
+import DateHelper from 'helpers/DateHelper'
+
+class Visit extends React.Component
+{
+    constructor(props) {
+        super(props);
+        this.state = {
+            visit : null,
+            error: ''
+        };
+        this.getVisit(this.props.params.id);
+    }
+
+    getVisit(id) {
+        VisitService.find(id).then((response) => {
+            this.setState({visit: response.data.visit.shift()});
+        }).catch((error) => {
+            this.setState({error: 'Error Found: Trying get visit'});
+            let isValidResponse = typeof error.response.data !== 'undefined'
+            if (typeof error.response.data.error !== 'undefined') {
+                this.setState({error: error.response.data.error});
+            }
+        });
+    }
+
+    render() {
+        if (this.state.error) {
+            return (<Error error={this.state.error} />);
+        }
+        if (!this.state.visit) {
+            return <div>Loading...</div>;
+        }
+
+        return (
+            <div className="container column is-12">
+                <div className="section profile-heading profile-heading-color profile-visit">
+                    <div className="columns">
+                        <div className="column is-4">
+                            <div className="image is-2by1">
+                                <img src="https://placehold.it/256x256" />
+                            </div>
+                        </div>
+                        <div className="column is-4 name">
+                                <h3 className="title is-3 color-black">
+                                    <strong>{this.state.visit.client.name}</strong>
+                                </h3>
+                            <p className="tagline">
+                                <strong>Visit Date: </strong>{DateHelper.formateDate(this.state.visit.visit_date)}
+                            </p>
+                            <p className="tagline">
+                                <strong>Address: </strong>{this.state.visit.client.address}
+                            </p>
+                            <p className="tagline">
+                                <strong>Area: </strong>{this.state.visit.client.area._id}
+                            </p>
+                        </div>
+                        <div className="column is-2 followers has-text-centered">
+                            <p className="stat-val"><strong>R$ {this.state.visit.value_received}</strong></p>
+                            <p className="stat-key">Value Received</p>
+                        </div>
+                        <div className="column is-2 likes has-text-centered">
+                            <p className="stat-val"><strong>{this.state.visit.sales_quantity}</strong></p>
+                            <p className="stat-key">Sales Quantity</p>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        );
+    }
+}
+
+export default Visit;

app/components/Visit/Show/styles.css

@@ -0,0 +1,90 @@
+body {
+  font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
+}
+.container.profile {
+  margin-top:50px;
+}
+.section.profile-visit {
+  padding-bottom: 50px!important;
+}
+.section.profile-visit .stat-key{
+  font-weight: normal!important;
+  font-size: 14px!important;
+}
+.section.profile-visit .tagline {
+    padding: 20px 0;
+    line-height: 0.1;
+  font-size: 14px!important;
+}
+
+.profile-heading .followers, .profile-heading .following {
+    border-right: 1px solid #f1f1f1;
+    margin: -30px 0;
+    padding: 70px 30px;
+}
+.profile-heading .likes {
+    margin: -30px 0;
+    padding: 70px 30px;
+    border-right:none!important;
+}
+.profile-heading .name {
+  border-right: 1px solid #f1f1f1;
+  margin:-30px 0;
+  padding: 40px 30px 0 30px;
+}
+.profile-heading .followers, .profile-heading .following {
+  border-right: 1px solid #f1f1f1;
+  margin:-30px 0;
+  padding: 70px 30px;
+}
+.profile-heading .likes {
+  margin:-30px 0;
+  padding: 70px 30px;
+}
+.profile-heading .stat-key {
+  font-size: 20px;
+  font-weight: 200;
+}
+.profile-heading .stat-val {
+  font-size: 35px;
+  font-weight: bold;
+}
+.profile-options {
+  background-color: #f1f1f1;
+  margin:-20px 0 20px 0;
+}
+.profile-options .link a {
+  padding:18px;
+  font-size: 18px;
+}
+.profile-options .link .icon {
+  font-size: 16px;
+  padding-top:2px;
+}
+.tagline {
+  padding:20px 0;
+  font-size: 16px;
+  line-height: 1.4;
+}
+.avatar {
+  float: right;
+}
+.follow {
+  float: right;
+}
+.avatar img {
+  border-radius: 200px;
+}
+p.title.is-bold {
+  font-weight: bold;
+}
+.card .timestamp {
+  float:right;
+  color:#bbb;
+}
+.profile-heading-color {
+    color: #333;
+}
+.color-black {
+    color: black !important;
+}

app/helpers/DateHelper.js

@@ -0,0 +1,13 @@
+const DateHelper = {
+    formateDate(date) {
+        let dateObj = new Date(date);
+        let options = {
+            day: '2-digit',
+            month: '2-digit',
+            year: 'numeric'
+        }
+        return dateObj.toLocaleDateString("en-US", options);
+    }
+}
+
+export default DateHelper;

app/services/Visit.js

@@ -22,6 +22,13 @@ const Visit = {
 
     save(data) {
         return axios.post(this.getEntryPoint().join('/'), data, this.getConfig());
+    },
+
+    find(id) {
+        let url = this.getEntryPoint();
+        url.push(id);
+
+        return axios.get(url.join('/'), this.getConfig());
     }
 };
 

codecov.yml

@@ -4,7 +4,7 @@ codecov:
         require_ci_to_pass: true
 comment:
     behavior: default
-    layout: header, diff
+    layout: header, diff, sunburst
     require_changes: false
 coverage:
     precision: 2
@@ -26,3 +26,14 @@ parsers:
     javascript:
         enable_partials: false
 
+status:
+    project:
+        default:
+            enabled: yes
+            target: auto
+            branches: null
+            threshold: null
+            if_no_uploads: error
+            if_not_found: success
+            if_ci_failed: error
+