Ivan - Create Ticket Form - Add optional create ticket without login [skip ci]

This commit is contained in:
ivan 2016-08-18 23:04:35 -03:00
parent ef20687f1a
commit 97a35862fe
2 changed files with 33 additions and 0 deletions

View File

@ -12,6 +12,14 @@ import FormField from 'core-components/form-field';
class CreateTicketForm extends React.Component {
static propTypes = {
userLogged: React.PropTypes.boolean
};
static defaultProps ={
userLogged: true
};
constructor(props) {
super(props);
@ -26,6 +34,7 @@ class CreateTicketForm extends React.Component {
<div className="create-ticket-form">
<h2>Create Ticket</h2>
<Form loading={this.state.loading} onSubmit={this.onSubmit.bind(this)}>
{(!this.props.userLogged) ? this.renderEmailAndName() : null}
<div className="row">
<FormField className="col-md-7" label="Title" name="title" validation="TITLE" required field="input" fieldProps={{size: 'large'}}/>
<FormField className="col-md-5" label="Department" name="departmentId" field="select" fieldProps={{
@ -38,6 +47,7 @@ class CreateTicketForm extends React.Component {
}} />
</div>
<FormField label="Content" name="content" validation="TEXT_AREA" required field="textarea" />
{(!this.props.userLogged) ? this.renderCaptcha() : null}
<SubmitButton>Create Ticket</SubmitButton>
</Form>
{this.renderMessage()}
@ -45,6 +55,23 @@ class CreateTicketForm extends React.Component {
);
}
renderEmailAndName() {
return (
<div className="row">
<FormField className="col-md-6" label="Email" name="email" validation="EMAIL" required field="input" fieldProps={{size: 'large'}}/>
<FormField className="col-md-6" label="Full Name" name="name" validation="NAME" required field="input" fieldProps={{size: 'large'}}/>
</div>
);
}
renderCaptcha() {
return (
<div className="create-ticket-form__captcha">
<ReCAPTCHA sitekey="6LfM5CYTAAAAAGLz6ctpf-hchX2_l0Ge-Bn-n8wS" onChange={function () {}}/>
</div>
);
}
renderMessage() {
switch (this.state.message) {
case 'success':

View File

@ -3,4 +3,10 @@
&__message {
margin-top: 20px;
}
&__captcha {
margin: 0 auto 20px;
height: 78px;
width: 304px;
}
}