22 } |
22 } |
23 this.doSomething = this.doSomething.bind(this); |
23 this.doSomething = this.doSomething.bind(this); |
24 this.toggleShow = this.toggleShow.bind(this); |
24 this.toggleShow = this.toggleShow.bind(this); |
25 this.hide = this.hide.bind(this); |
25 this.hide = this.hide.bind(this); |
26 } |
26 } |
|
27 |
|
28 componentWillMount() { |
|
29 Modal.setAppElement('body'); |
|
30 } |
27 |
31 |
28 doSomething(e){ |
32 doSomething(e){ |
29 e.preventDefault(); |
33 e.preventDefault(); |
30 console.log(e.target.innerHTML); |
34 console.log(e.target.innerHTML); |
31 } |
35 } |
100 } |
104 } |
101 |
105 |
102 render() { |
106 render() { |
103 return ( |
107 return ( |
104 <div> |
108 <div> |
105 <button id="session-button" type="button" className="btn btn-primary btn-lg" onClick={this.createSession}>Créer une nouvelle session</button> |
|
106 <Navbar history={this.props.history} /> |
109 <Navbar history={this.props.history} /> |
107 <div className="top-fade"></div> |
110 <div className="top-fade"></div> |
|
111 <button id="session-button" type="button" className="btn btn-primary btn-lg text-secondary" onClick={ this.createSession}>Créer une nouvelle session</button> |
108 <div className="container-fluid"> |
112 <div className="container-fluid"> |
109 <div className="row"> |
113 <div className="row"> |
110 {this.props.sessions.map((session) => |
114 {this.props.sessions.map((session) => |
111 <div> |
115 <div> |
112 <div className="col-md-4 session" key={session.get('_id')}> |
116 <div className="col-lg-4 session" key={session.get('_id')}> |
113 <a className="sessions" href="#session" onClick={() => this.props.history.push('/sessions/' + session.get('_id'))}> |
117 <a className="sessions" onClick={() => this.props.history.push('/sessions/' + session.get('_id'))}> |
114 <span className="session-title">{session.title || 'Session sans titre'}<br /></span> |
118 <span className="session-title text-primary">{session.title || 'Session sans titre'}<br /></span> |
115 <span className="session-date text-muted">{moment(session.get('date')).format('DD/MM/YYYY')}<br /></span> |
119 <span className="session-date text-muted">{moment(session.get('date')).format('DD/MM/YYYY')}<br /></span> |
116 <span className="session-description">{session.description}<br /></span> |
120 <span className="session-description text-dark">{session.description}<br /></span> |
117 </a> |
121 </a> |
118 <button className="btn btn-link pull-left" key={session.get('_id')} id="toggle-edit" type="button" onClick={this.toggleShow} onBlur={this.hide}> |
122 <button className="btn btn-link float-left" key={session.get('_id')} id="toggle-edit" type="button" onClick={this.toggleShow} onBlur={this.hide}> |
119 <span className="material-icons edit">edit</span> |
123 <span className="material-icons edit">edit</span> |
120 </button> |
124 </button> |
121 { |
125 { |
122 this.state.show && |
126 this.state.show && |
123 ( |
127 ( |
124 <button type="button" className="btn btn-link pull-left" style={{display: 'block'}} onClick={ this.onClickDelete.bind(this, session) }> |
128 <button type="button" className="btn btn-link float-left" style={{display: 'block'}} onClick={ this.onClickDelete.bind(this, session) }> |
125 <span className="material-icons delete">delete</span> |
129 <span className="material-icons delete text-dark">delete</span> |
126 </button> |
130 </button> |
127 ) |
131 ) |
128 } |
132 } |
129 </div> |
133 </div> |
130 </div> |
134 </div> |
136 // closeTimeoutMS={150} |
140 // closeTimeoutMS={150} |
137 isOpen={this.state.modalIsOpen} |
141 isOpen={this.state.modalIsOpen} |
138 onRequestClose={this.handleModalCloseRequest} |
142 onRequestClose={this.handleModalCloseRequest} |
139 > |
143 > |
140 <div id="delete-session-modal" className="modal-content text-center"> |
144 <div id="delete-session-modal" className="modal-content text-center"> |
141 <button type="button" id="delete-session-close-modal-button" className="btn btn-default pull-right" onClick={ this.handleModalCloseRequest }><span className="material-icons">close</span></button> |
145 <button type="button" id="delete-session-close-modal-button" className="btn btn-secondary float-right" onClick={ this.handleModalCloseRequest }><span className="material-icons">close</span></button> |
142 {/* <div className="modal-body"> */} |
|
143 <span className="modal-text">Êtes-vous sûr(e) de vouloir supprimer cette session ?</span> |
146 <span className="modal-text">Êtes-vous sûr(e) de vouloir supprimer cette session ?</span> |
144 {/* </div> */} |
147 <div className="modal-footer text-center"> |
145 <div className="modal-footer"> |
148 <button type="button" className="btn btn-primary text-secondary" id="delete-session-modal-button" onClick={ this.deleteSession }>Confirmer</button> |
146 <button type="button" className="btn btn-primary" id="delete-session-modal-button" onClick={ this.deleteSession }>Confirmer</button> |
|
147 </div> |
149 </div> |
148 </div> |
150 </div> |
149 </Modal> |
151 </Modal> |
150 </div> |
152 </div> |
151 ); |
153 ); |