131 lines
5.8 KiB
JavaScript
131 lines
5.8 KiB
JavaScript
import React, {Component} from 'react';
|
|
import {Form, FormGroup, Label, Input} from 'reactstrap';
|
|
import {profileTexts} from '../../../constants/profileSettingsConstants';
|
|
|
|
class AddEditBillingAddress extends Component {
|
|
constructor(props){
|
|
super(props);
|
|
|
|
const address = this.props.params.address;
|
|
this.state = {
|
|
id: address.id,
|
|
firstName: address.firstName || '',
|
|
lastName: address.lastName || '',
|
|
invoiceMail: address.invoiceMail || '',
|
|
idCountrySelected: address.idCountrySelected || this.props.params.countries[0].idCountry,
|
|
city: address.city || '',
|
|
detailedAddress: address.detailedAddress || '',
|
|
zipCode: address.zipCode || ''
|
|
};
|
|
this.props.params.onAddressChange(this.state);
|
|
|
|
this.handleChange = this.handleChange.bind(this);
|
|
}
|
|
|
|
handleChange(event) {
|
|
const field = event.target.name;
|
|
const address = Object.assign({}, this.state);
|
|
address[field] = event.target.value;
|
|
this.setState(address);
|
|
this.props.params.onAddressChange(address);
|
|
}
|
|
|
|
render() {
|
|
const {idCountrySelected, city, detailedAddress, zipCode, firstName, lastName, invoiceMail} = this.state;
|
|
const {countries} = this.props.params;
|
|
|
|
return (
|
|
<div className="address-add-edit-content">
|
|
<Form className="address-edit-content">
|
|
<h5>{profileTexts.labels.DELEGATE}</h5>
|
|
<FormGroup>
|
|
<Label for="address-first-name">{profileTexts.labels.FIRST_NAME}</Label>
|
|
<Input value={firstName}
|
|
autoComplete="nope"
|
|
onChange={this.handleChange}
|
|
type="text"
|
|
name="firstName"
|
|
id="address-first-name"
|
|
placeholder={profileTexts.labels.FIRST_NAME} />
|
|
</FormGroup>
|
|
|
|
<FormGroup>
|
|
<Label for="address-last-name">{profileTexts.labels.LAST_NAME}</Label>
|
|
<Input value={lastName}
|
|
autoComplete="nope"
|
|
onChange={this.handleChange}
|
|
type="text"
|
|
name="lastName"
|
|
id="address-last-name"
|
|
placeholder={profileTexts.labels.LAST_NAME} />
|
|
</FormGroup>
|
|
|
|
<FormGroup>
|
|
<Label for="address-invoice-mail">{profileTexts.labels.INVOICE_MAIL}</Label>
|
|
<Input value={invoiceMail}
|
|
autoComplete="nope"
|
|
onChange={this.handleChange}
|
|
type="text"
|
|
name="invoiceMail"
|
|
id="address-invoice-mail"
|
|
placeholder={profileTexts.labels.INVOICE_MAIL} />
|
|
</FormGroup>
|
|
|
|
<h5>{profileTexts.labels.BILLING_ADDRESSES}</h5>
|
|
<FormGroup>
|
|
<Label for="address-country">{profileTexts.labels.ADDRESS_COUNTRY}<span className="required-icon">*</span></Label>
|
|
<Input value={idCountrySelected}
|
|
type="select"
|
|
autoComplete="nope"
|
|
onChange={this.handleChange}
|
|
name="idCountrySelected"
|
|
id="address-country"
|
|
placeholder={profileTexts.labels.ADDRESS_COUNTRY}>
|
|
{
|
|
countries.map((country) =>
|
|
<option key={'country-' + country.idCountry} value={country.idCountry}>{country.countryName}</option>
|
|
)
|
|
}
|
|
</Input>
|
|
</FormGroup>
|
|
|
|
<FormGroup>
|
|
<Label for="address-city">{profileTexts.labels.ADDRESS_CITY}<span className="required-icon">*</span></Label>
|
|
<Input value={city}
|
|
autoComplete="nope"
|
|
onChange={this.handleChange}
|
|
type="text"
|
|
name="city"
|
|
id="address-city"
|
|
placeholder={profileTexts.labels.ADDRESS_CITY} />
|
|
</FormGroup>
|
|
|
|
<FormGroup>
|
|
<Label for="address-details">{profileTexts.labels.ADDRESS_DETAILS}<span className="required-icon">*</span></Label>
|
|
<Input value={detailedAddress}
|
|
autoComplete="nope"
|
|
onChange={this.handleChange}
|
|
type="textarea"
|
|
name="detailedAddress"
|
|
id="address-details"
|
|
placeholder={profileTexts.labels.ADDRESS_DETAILS} />
|
|
</FormGroup>
|
|
|
|
<FormGroup>
|
|
<Label for="address-zip">{profileTexts.labels.ADDRESS_ZIP}<span className="required-icon">*</span></Label>
|
|
<Input value={zipCode}
|
|
autoComplete="nope"
|
|
onChange={this.handleChange}
|
|
type="text"
|
|
name="zipCode"
|
|
id="address-zip"
|
|
placeholder={profileTexts.labels.ADDRESS_ZIP} />
|
|
</FormGroup>
|
|
</Form>
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default AddEditBillingAddress;
|