Skip to content

Commit

Permalink
Merge pull request #15 from marcoaraujojunior/develop
Browse files Browse the repository at this point in the history
Update Client
  • Loading branch information
GabrielDeveloper authored Dec 2, 2016
2 parents 1dfdcbe + 5ee014a commit 0badef4
Show file tree
Hide file tree
Showing 8 changed files with 368 additions and 74 deletions.
5 changes: 3 additions & 2 deletions app/App.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ import HomeComponent from 'components/Home/Home'
import AreaComponent from 'components/Area/Area'
import ListClientComponent from 'components/Client/List/Client'
import ProfileClientComponent from 'components/Client/Profile/Client'
import CreateClientComponent from 'components/Client/Create/Client'
import SaveClientComponent from 'components/Client/Save/Client'
import CreateVisitComponent from 'components/Visit/Create/Visit'
import CreateAreaComponent from 'components/Area/Create/Area'

Expand All @@ -18,7 +18,8 @@ ReactDOM.render(
<Route path="/" component={iClientComponent} >
<IndexRoute component={HomeComponent} />
<Route path="clients" component={ListClientComponent} />
<Route path="client" component={ CreateClientComponent } />
<Route path="client" component={ SaveClientComponent } />
<Route path="client/:id/update" component={ SaveClientComponent } />
<Route path="client/:id" component={ProfileClientComponent} />
<Route path="areas" component={AreaComponent} />
<Route path="area" component={CreateAreaComponent} />
Expand Down
27 changes: 8 additions & 19 deletions app/components/Client/Profile/Client.js
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ class Client extends React.Component
this.setState({client: response.data.client.shift()});
}).catch((error) => {
this.setState({error: 'Error Found: Trying get client'});
let isValidResponse = typeof error.response.data !== 'undefined'
if (typeof error.response.data.error !== 'undefined') {
this.setState({error: error.response.data.error});
}
Expand Down Expand Up @@ -71,32 +72,20 @@ class Client extends React.Component
<nav className="nav">
<div className="nav-center nav-menu is-active">
<span className="nav-item">
<a className="button" >
<Link to={ `/visit/${this.state.client._id}/` } className='button'>
<span className="icon">
<i className="fa fa-check"></i>
<i className="fa fa-calendar-check-o"></i>
</span>
<span>Visited</span>
</a>
<a className="button" href="#">
<span className="icon">
<i className="fa fa-pencil"></i>
</span>
<span>Update</span>
</a>
</Link>
</span>
<span className="nav-item">
<a className="button" >
<Link to={ `/client/${this.state.client._id}/update` } className='button'>
<span className="icon">
<i className="fa fa-calendar"></i>
</span>
<span>Schedule</span>
</a>
<a className="button is-danger" href="#">
<span className="icon">
<i className="fa fa-close"></i>
<i className="fa fa-pencil"></i>
</span>
<span>Delete</span>
</a>
<span>Update</span>
</Link>
</span>
</div>
</nav>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -4,23 +4,45 @@ import { Link, Router } from 'react-router'
import Error from 'components/Error/Error'
import AreaService from 'services/Area'
import ClientService from 'services/Client'
import styles from 'components/Client/Create/styles.css'
import styles from 'components/Client/Save/styles.css'

class Client extends React.Component
{
constructor(props, context) {
super(props, context);
this.handleSubmit = this.handleSubmit.bind(this);
this.formatFormData = this.formatFormData.bind(this);
this.loadClient = this.loadClient.bind(this);
this.handleChange = this.handleChange.bind(this);
this.state = {
error : '',
areas : null,
client: {}
};
}

loadClient(id) {
ClientService.find(id).then((response) => {
let client = response.data.client.shift();
client.createdAt = ''
client.updatedAt = ''
client.area = client.area._id
this.setState({client: client})
}).catch((error) => {
this.setState({error: 'Error Found: Trying get client ' + id});
let isValidResponse = typeof error.response.data !== 'undefined'
if (isValidResponse && typeof error.response.data.error !== 'undefined') {
this.setState({error: error.response.data.error});
}
});
}

componentWillMount() {

if (typeof this.props.params !== 'undefined' && typeof this.props.params.id !== 'undefined') {
this.loadClient(this.props.params.id);
}

AreaService.getAll().then((response) => {
this.setState({areas: response.data.areas});
}).catch((error) => {
Expand All @@ -31,35 +53,39 @@ class Client extends React.Component
});
}

formatFormData(data) {
let client = {}
for (let i in data) {
client[i] = data[i].value;
}
handleChange(event) {
let client = this.state.client;
client[event.target.name] = event.target.value;
this.setState({client : client});
}

client.area = this.state.areas.filter( (area) => client['area'] == area._id ).shift();
formatFormData() {
let client = this.state.client;
client.area = this.state.areas.filter( (area) => client.area == area._id ).shift();
return client;
}

handleSubmit(e) {
e.preventDefault();

let client = this.formatFormData(this.refs);
handleSubmit(event) {

this.setState({client: client});
let client = this.formatFormData();
let id;
if (typeof client._id !== 'undefined') {
id = client._id;
}

ClientService.save(client).then((response) => {
ClientService.save(client, id).then((response) => {
this.context.router.push("/clients");
}).catch((error) => {

this.setState({error: 'Error trying create client'});
this.setState({error: 'Error trying save client'});

let responseValid = typeof error.response.data !== 'undefined';

if (responseValid && typeof error.response.data.error !== 'undefined') {
this.setState({error: error.response.data.error});
}
});
event.preventDefault();
}

render() {
Expand All @@ -75,59 +101,70 @@ class Client extends React.Component
<div className="columns is-vcentered">
<div className="column is-4 is-offset-4">
<h1 className="title">
Register a Client
Save Client
</h1>
<form onSubmit={this.handleSubmit}>
<div className="box">
<label className="label">Name</label>
<p className="control has-icon">
<input
required='required'
ref='name'
className="input marco"
className="input"
type="text"
placeholder="John Smith"
name='name'
value={ this.state.client.name }
onChange={this.handleChange}
/>
<i className="fa fa-id-card-o" aria-hidden="true" />
</p>
<label className="label">Phone</label>
<p className="control has-icon">
<input
required='required'
pattern="[\(]\d{2}[\)]\d{4,5}[\-]\d{4}"
ref='phone'
className="input"
type="text"
placeholder="(21)99999-00000"
name='phone'
value={ this.state.client.phone }
onChange={this.handleChange}
/>
<i className="fa fa-phone" aria-hidden="true" />
</p>
<label className="label">Address</label>
<p className="control has-icon">
<input
required='required'
ref='address'
className="input"
type="text"
placeholder="Street 32 - Nº 23"
name='address'
value={ this.state.client.address }
onChange={this.handleChange}
/>
<i className="fa fa-address-card" aria-hidden="true" />
</p>
<label className="label">City</label>
<p className="control has-icon">
<input
required='required'
ref='city'
className="input"
type="text"
placeholder="London"
name='city'
value={ this.state.client.city }
onChange={this.handleChange}
/>
<i className="fa fa-address-book" aria-hidden="true" />
</p>
<label className="label">Area</label>
<p className="control has-icon">
<span className="select">
<select ref='area' >
<select
name='area'
value={ this.state.client.area }
onChange={this.handleChange}
>
{
this.state.areas.map((area, key) => (
<option value={ area._id } key={ key }>{ area._id}</option>
Expand All @@ -141,21 +178,25 @@ class Client extends React.Component
<p className="control has-icon">
<input
required='required'
ref='frequency'
className="input"
type="number"
placeholder="10"
name='frequency'
value={ this.state.client.frequency }
onChange={this.handleChange}
/>
<i className="fa fa-refresh" aria-hidden="true" />
</p>
<label className="label">Ability</label>
<p className="control has-icon">
<input
required='required'
ref='ability'
className="input"
type="number"
placeholder="200"
name='ability'
value={ this.state.client.ability }
onChange={this.handleChange}
/>
<i className="fa fa-shopping-basket" aria-hidden="true" />
</p>
Expand Down
File renamed without changes.
3 changes: 1 addition & 2 deletions app/components/Visit/Create/Visit.js
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@ import { Link, Router } from 'react-router'
import Error from 'components/Error/Error'
import VisitService from 'services/Visit'
import ClientService from 'services/Client'
import styles from 'components/Client/Create/styles.css'

class Visit extends React.Component
{
Expand Down Expand Up @@ -73,7 +72,7 @@ class Visit extends React.Component
<div className="columns is-vcentered">
<div className="column is-4 is-offset-4">
<h1 className="title">
Create a Visit
Create Visit
</h1>
<form onSubmit={this.handleSubmit}>
<center>
Expand Down
7 changes: 6 additions & 1 deletion app/services/Client.js
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,12 @@ const Client = {
return axios.get(url.join('/'), this.getConfig());
},

save(client) {
save(client, id = undefined) {
if (id !== undefined) {
let url = this.getEntryPoint();
url.push(id);
return axios.put(url.join('/'), client, this.getConfig());
}
return axios.post(this.getEntryPoint().join('/'), client, this.getConfig());
}
};
Expand Down
30 changes: 17 additions & 13 deletions tests/Profile.Client.test.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ jest.enableAutomock();
jest.dontMock('components/Client/Profile/Client');
jest.dontMock('components/Error/Error');
jest.dontMock('react');
jest.dontMock('react-router');
jest.dontMock('axios');
jest.dontMock('axios-mock-adapter');
jest.dontMock('enzyme');
Expand All @@ -13,6 +14,7 @@ describe('Test Client', () => {
const React = require('react');
const Enzyme = require('enzyme');
const shallow = Enzyme.shallow;
const mount = Enzyme.mount;

let axios = require('axios');
let MockAdapter = require('axios-mock-adapter');
Expand Down Expand Up @@ -44,24 +46,26 @@ describe('Test Client', () => {

Client = require('components/Client/Profile/Client').default;

component = shallow(
component = mount(
<Client params={ { id: id} }/>
);

setTimeout(() => {

expect(component.find('.name p').at(0).text()).toEqual('Jon Snow');
expect(component.find('.name p').at(1).text()).toEqual('Address: 7 Street - Winterfell');
expect(component.find('.name p').at(2).text()).toEqual('Area: Center');
expect(component.find('.followers p').at(0).text()).toEqual('10');
expect(component.find('.followers p').at(1).text()).toEqual('Frequency');
expect(component.find('.followers p').at(2).text()).toEqual('200');
expect(component.find('.followers p').at(3).text()).toEqual('Ability');
expect(component.find('.nav-menu span a').at(0).text()).toEqual('Visited');
expect(component.find('.nav-menu span a').at(1).text()).toEqual('Update');
expect(component.find('.nav-menu span a').at(2).text()).toEqual('Schedule');
expect(component.find('.nav-menu span a').at(3).text()).toEqual('Delete');
done();
try {
expect(component.find('.name p').at(0).text()).toEqual('Jon Snow');
expect(component.find('.name p').at(1).text()).toEqual('Address: 7 Street - Winterfell');
expect(component.find('.name p').at(2).text()).toEqual('Area: Center');
expect(component.find('.followers p').at(0).text()).toEqual('10');
expect(component.find('.followers p').at(1).text()).toEqual('Frequency');
expect(component.find('.followers p').at(2).text()).toEqual('200');
expect(component.find('.followers p').at(3).text()).toEqual('Ability');
expect(component.find('.nav-menu span a').at(0).text()).toEqual('Visited');
expect(component.find('.nav-menu span a').at(1).text()).toEqual('Update');
done();
} catch(e) {
console.log(e);
}
}, 0);
});

Expand Down
Loading

0 comments on commit 0badef4

Please sign in to comment.