39 } |
39 } |
40 |
40 |
41 renderErrorMessage(errorMessages, fieldname) { |
41 renderErrorMessage(errorMessages, fieldname) { |
42 if (errorMessages && fieldname in errorMessages) { |
42 if (errorMessages && fieldname in errorMessages) { |
43 return errorMessages[fieldname].map((message, key) => |
43 return errorMessages[fieldname].map((message, key) => |
44 <p className="help-block" key={ key }>{ message }</p> |
44 <p className="form-text" key={ key }>{ message }</p> |
45 ); |
45 ); |
46 } |
46 } |
47 } |
47 } |
48 |
48 |
49 renderNonFieldErrors(errorMessages) { |
49 renderNonFieldErrors(errorMessages) { |
73 return ( |
73 return ( |
74 <div> |
74 <div> |
75 <Navbar history={this.props.history} /> |
75 <Navbar history={this.props.history} /> |
76 <div className="container-fluid"> |
76 <div className="container-fluid"> |
77 <div className="row"> |
77 <div className="row"> |
78 <div className="col-md-6 col-md-offset-3"> |
78 <div className="col-lg-6 offset-md-3"> |
79 <div className="panel-login panel panel-default"> |
79 <div className="panel-login panel panel-default"> |
80 <div className="panel-heading"> |
80 <div className="card-header"> |
81 <h4 className="text-uppercase text-center">New Group</h4> |
81 <h4 className="text-center">Créer un groupe</h4> |
82 <form onSubmit={this.submit}> |
82 <form onSubmit={this.submit}> |
83 <div className="form-group" validationState={ errorMessages && ('name' in errorMessages) ? 'error' : null }> |
83 <div className="form-group" validationState={ errorMessages && ('name' in errorMessages) ? 'error' : null }> |
84 <label className="control-label">Nom</label> |
84 <label className="col-from-label">Nom</label> |
85 <input className="form-control" type="text" onChange={this.handleInputChange} name="name" placeholder="Group name..."/> |
85 <input className="form-control" type="text" onChange={this.handleInputChange} name="name" placeholder="Nom du groupe..."/> |
86 { this.renderErrorMessage(errorMessages, 'name') } |
86 { this.renderErrorMessage(errorMessages, 'name') } |
87 </div> |
87 </div> |
88 <div className="form-group" validationState={ errorMessages && ('description' in errorMessages) ? 'error' : null }> |
88 <div className="form-group" validationState={ errorMessages && ('description' in errorMessages) ? 'error' : null }> |
89 <label className="control-label">Password</label> |
89 <label className="col-form-label">Description</label> |
90 <input className="form-control" type="textarea" onChange={this.handleInputChange} name="description" placeholder="Description..."/> |
90 <input className="form-control" type="textarea" onChange={this.handleInputChange} name="description" placeholder="Description..."/> |
91 { this.renderErrorMessage(errorMessages, 'description') } |
91 { this.renderErrorMessage(errorMessages, 'description') } |
92 </div> |
92 </div> |
93 { this.renderNonFieldErrors(errorMessages) } |
93 { this.renderNonFieldErrors(errorMessages) } |
94 <div className="row"> |
94 <div className="row"> |
95 <div className="col-md-6"><button type="submit" className="btn btn-primary btn-lg btn-block" disabled={okDisabled}>Ok</button></div> |
95 <div className="col-md-6"><button type="submit" className="btn btn-primary btn-lg btn-block" disabled={okDisabled}>Ok</button></div> |
96 <div className="col-md-6"><button type="button" className="btn btn-default btn-lg btn-block" onClick={this.cancel}>Annuler</button></div> |
96 <div className="col-md-6"><button type="button" className="btn btn-secondary btn-lg btn-block" onClick={this.cancel}>Annuler</button></div> |
97 </div> |
97 </div> |
98 </form> |
98 </form> |
99 </div> |
99 </div> |
100 </div> |
100 </div> |
101 </div> |
101 </div> |