Commit e277faafa49eaaea41b5bbea47e4ba9baf97e00e

Authored by Deepak
1 parent c84a4ec94c
Exists in master

added different users view

Showing 57 changed files with 3448 additions and 3240 deletions   Show diff stats
imports/client/app/routes.js
1 /* eslint-disable max-len */ 1 /* eslint-disable max-len */
2 2
3 import React from 'react'; 3 import React from 'react';
4 import { render } from 'react-dom'; 4 import { render } from 'react-dom';
5 import { Router, Route, 5 import { Router, Route,
6 IndexRoute, browserHistory } from 'react-router'; 6 IndexRoute, browserHistory } from 'react-router';
7 import { Meteor } from 'meteor/meteor'; 7 import { Meteor } from 'meteor/meteor';
8 import { Users } from '/imports/collections/users/index'; 8 import { Users } from '/imports/collections/users/index';
9 9
10 /** 10 /**
11 * General Components 11 * General Components
12 */ 12 */
13 import NotFound from '/imports/client/views/org/NotFound'; 13 import NotFound from '/imports/client/views/org/NotFound';
14 14
15 /** 15 /**
16 * Org Components 16 * Org Components
17 */ 17 */
18 import { EnterModule } from '/imports/client/views/org/enter/module/index'; 18 import { EnterModule } from '/imports/client/views/org/enter/module/index';
19 19
20 20
21 import { AdminAppModule } from '/imports/client/views/org/admin/app/module/Index'; 21 import { AdminAppModule } from '/imports/client/views/org/admin/app/module/Index';
22 import { DashboardController } from '/imports/client/views/org/admin/dashboard/index'; 22 import { DashboardController } from '/imports/client/views/org/admin/dashboard/index';
23 import { Orgs } from '/imports/collections/orgs/index'; 23 import { Orgs } from '/imports/collections/orgs/index';
24 import { importCsvController } from '/imports/client/views/org/importCsv/index' 24 import { importCsvController } from '/imports/client/views/org/importCsv/index'
25 25
26 /** 26 /**
27 Admin 27 Admin
28 **/ 28 **/
29 import { StudentDataController } from '/imports/client/views/org/admin/settings/students/index'
30 import { staffViewController } from '/imports/client/views/org/admin/settings/staff/index'
31 import { ParentViewController } from '/imports/client/views/org/admin/settings/parents/index'
32 import { AdminSettingsController } from '/imports/client/views/org/admin/settings/index' 29 import { AdminSettingsController } from '/imports/client/views/org/admin/settings/index'
30 //
31 import { AdminUsersModule } from '/imports/client/views/org/admin/users/module/index'
32 import { AdminUsersListController } from '/imports/client/views/org/admin/users/list/index'
33 import { StudentDataController } from '/imports/client/views/org/admin/users/students/index'
34 import { staffViewController } from '/imports/client/views/org/admin/users/staff/index'
35 import { ParentViewController } from '/imports/client/views/org/admin/users/parents/index'
36
33 //Admin mail 37 //Admin mail
34 import { AdminMailModule } from '/imports/client/views/org/admin/mailbox/module/index' 38 import { AdminMailModule } from '/imports/client/views/org/admin/mailbox/module/index'
35 import { AdminInboxController } from '/imports/client/views/org/admin/mailbox/inbox/index' 39 import { AdminInboxController } from '/imports/client/views/org/admin/mailbox/inbox/index'
36 import { AdminComposeMailController } from '/imports/client/views/org/admin/mailbox/compose/index' 40 import { AdminComposeMailController } from '/imports/client/views/org/admin/mailbox/compose/index'
37 import { AdminSentMailController } from '/imports/client/views/org/admin/mailbox/sent/index' 41 import { AdminSentMailController } from '/imports/client/views/org/admin/mailbox/sent/index'
38 import { AdminImportantMailController } from '/imports/client/views/org/admin/mailbox/important/index' 42 import { AdminImportantMailController } from '/imports/client/views/org/admin/mailbox/important/index'
39 43
40 44
41 //students 45 //students
42 46
43 //teachers 47 //teachers
44 48
45 //parents 49 //parents
46 50
47 /** 51 /**
48 * Invalid Org Components 52 * Invalid Org Components
49 */ 53 */
50 54
51 /** 55 /**
52 There are three types of routes 56 There are three types of routes
53 1)getOrgRoutes: all the routes that should be present for a registered org 57 1)getOrgRoutes: all the routes that should be present for a registered org
54 2)getInvalidOrgRoute: all the routes where someone tries to enter a subdomain which hasn't been registered yet (404 mostly :D) 58 2)getInvalidOrgRoute: all the routes where someone tries to enter a subdomain which hasn't been registered yet (404 mostly :D)
55 3)getNonOrgRoutes: all routes linked to normal site, ie signing up a new org. CHeking out demo and everything internal 59 3)getNonOrgRoutes: all routes linked to normal site, ie signing up a new org. CHeking out demo and everything internal
56 **/ 60 **/
57 const getOrgAdminRoutes = () => ( 61 const getOrgAdminRoutes = () => (
58 <Router history={ browserHistory }> 62 <Router history={ browserHistory }>
59 <Route path="/" component={ AdminAppModule } > 63 <Route path="/" component = { AdminAppModule } >
60 <IndexRoute name="index" component={ DashboardController } /> 64 <IndexRoute name="index" component = { DashboardController } />
61 <Route name="import" path="/import" component={ importCsvController } /> 65 <Route name="import" path="/import" component = { importCsvController } />
62 <Route name="student" path="/students" component={ StudentDataController } /> 66 <Route name="settings" path="/settings" component = { AdminSettingsController } />
63 <Route name="staff" path="/staff" component={ staffViewController } /> 67 <Route name="users" path = "/users" component = {AdminUsersModule}>
64 <Route name="parent" path="/parents" component={ ParentViewController } /> 68 <IndexRoute component = {AdminUsersListController} />
65 <Route name="settings" path="/settings" component={ AdminSettingsController } /> 69 <Route name="students" path = "/users/students" component = {StudentDataController} />
70 <Route name="staff" path = "/users/staff" component = {staffViewController} />
71 <Route name="parents" path = "/users/parents" component = {ParentViewController} />
72 </Route>
66 <Route name="mail" path = "/mail" component = {AdminMailModule}> 73 <Route name="mail" path = "/mail" component = {AdminMailModule}>
67 <IndexRoute component = {AdminInboxController} /> 74 <IndexRoute component = {AdminInboxController} />
68 <Route name="mail-compose" path = "/mail/compose" component = {AdminComposeMailController} /> 75 <Route name="mail-compose" path = "/mail/compose" component = {AdminComposeMailController} />
69 <Route name="mail-sent" path = "/mail/sent" component = {AdminSentMailController} /> 76 <Route name="mail-sent" path = "/mail/sent" component = {AdminSentMailController} />
70 <Route name="mail-important" path = "/mail/important" component = {AdminImportantMailController} /> 77 <Route name="mail-important" path = "/mail/important" component = {AdminImportantMailController} />
71 </Route> 78 </Route>
72 <Route path="*" component={ NotFound } /> 79 <Route path="*" component = { NotFound } />
73 </Route> 80 </Route>
74 </Router> 81 </Router>
75 ) 82 )
76 const getOrgNonLoggedInRoutes = () => ( 83 const getOrgNonLoggedInRoutes = () => (
77 <Router history={ browserHistory }> 84 <Router history={ browserHistory }>
78 <Route path="/" component={ EnterModule }> 85 <Route path="/" component={ EnterModule }>
79 <Route path="*" component={ NotFound } /> 86 <Route path="*" component={ NotFound } />
80 </Route> 87 </Route>
81 </Router> 88 </Router>
82 ) 89 )
83 90
84 const getInvalidOrgRoute = () => ( 91 const getInvalidOrgRoute = () => (
85 <Router history={ browserHistory }> 92 <Router history={ browserHistory }>
86 <Route path="/" component={ App }> 93 <Route path="/" component={ App }>
87 <IndexRoute name="index" component={ NotFound } /> 94 <IndexRoute name="index" component={ NotFound } />
88 <Route path="*" component={ NotFound } /> 95 <Route path="*" component={ NotFound } />
89 </Route> 96 </Route>
90 </Router> 97 </Router>
91 ) 98 )
92 99
93 100
94 /** 101 /**
95 * NonOrg Components 102 * NonOrg Components
96 */ 103 */
97 import Signup from '/imports/client/views/nonOrg/enter/SignupView'; 104 import Signup from '/imports/client/views/nonOrg/enter/SignupView';
98 import { NonOrgApp } from '/imports/client/layouts/NonOrgApp'; 105 import { NonOrgApp } from '/imports/client/layouts/NonOrgApp';
99 import {NonOrgAppModule} from '/imports/client/views/nonOrg/app/module/Index'; 106 import {NonOrgAppModule} from '/imports/client/views/nonOrg/app/module/Index';
100 107
101 const getNonOrgRoutes = () => ( 108 const getNonOrgRoutes = () => (
102 <Router history={ browserHistory }> 109 <Router history={ browserHistory }>
103 <Route path="/" component={ NonOrgApp }> 110 <Route path="/" component={ NonOrgApp }>
104 <IndexRoute name="index" component={ NonOrgAppModule } /> 111 <IndexRoute name="index" component={ NonOrgAppModule } />
105 <Route name="signup" path="/signup" component={ Signup } /> 112 <Route name="signup" path="/signup" component={ Signup } />
106 <Route path="*" component={ NotFound } /> 113 <Route path="*" component={ NotFound } />
107 </Route> 114 </Route>
108 </Router> 115 </Router>
109 ) 116 )
110 117
111 //Authenticate function to give access to users only 118 //Authenticate function to give access to users only
112 const authenticate = (nextState, replace) => { 119 const authenticate = (nextState, replace) => {
113 if (!Meteor.loggingIn() && !Meteor.userId()) { 120 if (!Meteor.loggingIn() && !Meteor.userId()) {
114 replace({ 121 replace({
115 pathname: '/login', 122 pathname: '/login',
116 state: { nextPathname: nextState.location.pathname }, 123 state: { nextPathname: nextState.location.pathname },
117 }); 124 });
118 } 125 }
119 }; 126 };
120 127
121 128
122 /** 129 /**
123 130
124 **/ 131 **/
125 const detectOrg = () => { 132 const detectOrg = () => {
126 orgSlug = ""; 133 orgSlug = "";
127 //www.app.ydapp.in 134 //www.app.ydapp.in
128 // 135 //
129 var hostnameArray = document.location.hostname.split( "." ); 136 var hostnameArray = document.location.hostname.split( "." );
130 //['www','app', 'ydapp','in']; 137 //['www','app', 'ydapp','in'];
131 if(hostnameArray[0] !== "www"){ 138 if(hostnameArray[0] !== "www"){
132 if((hostnameArray[1]==='localhost'||hostnameArray[1]==='ydapp')){ 139 if((hostnameArray[1]==='localhost'||hostnameArray[1]==='ydapp')){
133 orgSlug = hostnameArray[0]; 140 orgSlug = hostnameArray[0];
134 } 141 }
135 }else{ 142 }else{
136 if((hostnameArray[2]==='localhost'||hostnameArray[2]==='ydapp')){ 143 if((hostnameArray[2]==='localhost'||hostnameArray[2]==='ydapp')){
137 orgSlug = hostnameArray[1]; 144 orgSlug = hostnameArray[1];
138 } 145 }
139 } 146 }
140 147
141 if(orgSlug!==""){ 148 if(orgSlug!==""){
142 console.log(orgSlug); 149 console.log(orgSlug);
143 Meteor.call('checkExistingOrg', {slug:orgSlug}, function(err, res) { 150 Meteor.call('checkExistingOrg', {slug:orgSlug}, function(err, res) {
144 console.log(err); 151 console.log(err);
145 console.log(res); 152 console.log(res);
146 153
147 if(res){ 154 if(res){
148 Session.set('orgId', res._id); 155 Session.set('orgId', res._id);
149 Session.set('orgSlug', orgSlug); 156 Session.set('orgSlug', orgSlug);
150 if(Meteor.loggingIn() || Meteor.userId()){ 157 if(Meteor.loggingIn() || Meteor.userId()){
151 userRole = _.find(res.users, {userId: Meteor.user()._id}).role; 158 userRole = _.find(res.users, {userId: Meteor.user()._id}).role;
152 Session.set('userRole', userRole); 159 Session.set('userRole', userRole);
153 if(userRole=='ADMIN'){ 160 if(userRole=='ADMIN'){
154 render(getOrgAdminRoutes(),document.getElementById('app')); 161 render(getOrgAdminRoutes(),document.getElementById('app'));
155 }else{ 162 }else{
156 163
157 } 164 }
158 }else{ 165 }else{
159 render(getOrgNonLoggedInRoutes(),document.getElementById('app')); 166 render(getOrgNonLoggedInRoutes(),document.getElementById('app'));
160 } 167 }
161 }else{ 168 }else{
162 render(getInvalidOrgRoute(),document.getElementById('app')); 169 render(getInvalidOrgRoute(),document.getElementById('app'));
163 } 170 }
164 }); 171 });
165 }else{ 172 }else{
166 render(getNonOrgRoutes(),document.getElementById('app')); 173 render(getNonOrgRoutes(),document.getElementById('app'));
167 } 174 }
168 } 175 }
169 const checkSlug = (nextState, replace) => { 176 const checkSlug = (nextState, replace) => {
170 orgId = Session.get('orgId'); 177 orgId = Session.get('orgId');
171 } 178 }
172 179
173 180
174 Meteor.startup(() => { 181 Meteor.startup(() => {
imports/client/views/org/admin/settings/Header.js
1 import _ from 'lodash'; File was deleted
2 import { Meteor } from 'meteor/meteor';
3
4 import React, { Component } from 'react';
5 import { Link,browserHistory } from 'react-router';
6 import { FormGroup,
7 FormControl,Glyphicon,Button } from 'react-bootstrap';
8 import './header.css';
9
10
11 export class Header extends Component {
12
13 constructor(props) {
14 super(props);
15 this.state = {
16
17 };
18 this.onUpdate = this.onUpdate.bind(this);
19 };
20
21 onUpdate(key, value) {
22 this.setState({[key]: value});
23 };
24
25 render() {
26 return (
27 <div className = "enterPane-box">
28 <div className="row">
29
30 <div className="col-lg-4 col-md-8">
31 <Link to="/students" >
32 <div className="panel panel-body">
33 <div className="media">
34 <div className="media-left">
35 <img src="assets/images/download2.png" className="img-circle" alt=""/>
36 </div>
37
38 <div className="media-body">
39 <h6 className="media-heading">Students</h6>
40 <p className="text-muted">Click to view</p>
41 </div>
42 </div>
43 </div>
44 </Link>
45 </div>
46 <div className="col-lg-4 col-md-8">
47 <Link to="/staff" >
48 <div className="panel panel-body">
49 <div className="media">
50 <div className="media-left">
51 <img src="assets/images/download.png" className="img-circle" alt=""/>
52 </div>
53
54 <div className="media-body">
55 <h6 className="media-heading">Teachers</h6>
56 <p className="text-muted">Click to view</p>
57 </div>
58 </div>
59 </div>
60 </Link>
61 </div>
62
63 <div className="col-lg-4 col-md-8">
64 <Link to="/parents" >
65 <div className="panel panel-body">
66 <div className="media">
67 <div className="media-left">
68 <img src="assets/images/download3.png" className="img-circle" alt=""/>
69 </div>
70
71 <div className="media-body">
72 <h6 className="media-heading">Parents</h6>
73 <p className="text-muted">Click to view</p>
74 </div>
75 </div>
76 </div>
77 </Link>
78 </div>
79
80 </div>
81 </div>
82 );
83 };
84
85 };
86 1 import _ from 'lodash';
imports/client/views/org/admin/settings/header.css
1 .img-circle File was deleted
2 {
3 width: 70px;
4 height: 70px;
5 }
6
7 .panel-body
8 {
9 overflow-y:hidden;
10 }
11 1 .img-circle
imports/client/views/org/admin/settings/parents/index.js
1 import _ from 'lodash'; File was deleted
2 import {
3 composeWithTracker,
4 compose,
5 composeAll
6 } from 'react-komposer';
7 import { Loading } from '/imports/client/components/Loading';
8
9 import { Orgs } from '/imports/collections/orgs/index';
10 import { Users } from '/imports/collections/users/index';
11 import { Parents } from '/imports/collections/parents/index';
12 import { ParentsView } from './parentsview';
13
14
15
16 const meteorTick = (props, onData) => {
17 Shelf.layout.set({
18 bulb: 'SETTINGS',
19 subbulb: 'USERS',
20 view: 'PARENTS'
21 });
22 const handles = [
23 Meteor.subscribe('users.current'),
24 Meteor.subscribe('orgs.current'),
25 Meteor.subscribe('users.forMyOrg'),
26 Meteor.subscribe('parent.forMyOrg'),
27 ];
28
29 if(_.every(handles, (handle) => (handle.ready()) )) {
30 const user = Users.current();
31 const org = Orgs.current();
32 console.log("parents");
33 parent = Users.find({"role":"PARENT"}).fetch() ? Users.find({"role":"PARENT"}).fetch() : "";
34 console.log(Users.find({"role":"PARENT"}).fetch());
35 parentData = Parents.find().fetch() ? Parents.find().fetch() : "";
36 console.log("parentData");
37 console.log(parentData);
38 for(var i=0; i< parent.length; i++){
39 for(var j=0; j< parentData.length; j++){
40 if(parent[i]._id == parentData[j].userId){
41 parent[i].relationship = parentData[j].relationship;
42 parent[i].profession = parentData[j].profession;
43 parent[i].relationship = parentData[j].relationship;
44 }
45 }
46 }
47 onData(null, {
48 data: {
49 user: user,
50 org: org,
51 parent: parent
52 },
53 });
54 }
55
56 return () => {
57 _.each(handles, (handle) => handle.stop() );
58 };
59 };
60
61
62 const reduxTick = (props, onData) => {
63 onData(null, {
64 data: {}
65 });
66 };
67
68
69 export const ParentViewController = composeAll(
70 composeWithTracker(meteorTick, Loading),
71 compose(reduxTick, Loading),
72 )(ParentsView);
73 1 import _ from 'lodash';
imports/client/views/org/admin/settings/parents/parentsview.js
1 import _ from 'lodash'; File was deleted
2 import { Meteor } from 'meteor/meteor';
3
4 import React, { Component } from 'react';
5 import { Link,browserHistory } from 'react-router';
6 import { FormGroup,
7 FormControl,Glyphicon,Button } from 'react-bootstrap';
8 import { Header } from '../Header';
9 import { ParentTable } from './view/ParentTable'
10
11
12 export class ParentsView extends Component {
13
14 constructor(props) {
15 super(props);
16 this.state = {
17
18 };
19 this.onUpdate = this.onUpdate.bind(this);
20 };
21
22 onUpdate(key, value) {
23 this.setState({[key]: value});
24 };
25 togglePanel(){
26 this.setState({panleOpen: !this.state.panleOpen});
27 }
28
29 render() {
30 const {user, org, parent} = this.props.data;
31 return (
32 <div className="container-detached">
33 <Header
34 user = {user}
35 org = {org}
36 />
37 <ParentTable
38 data = {this.props.data}
39 parent = {parent}
40 />
41 {/* <AddStaff/>
42 <UploadCsvStaff /> */}
43 </div>
44 );
45 };
46
47
48 };
49 1 import _ from 'lodash';
imports/client/views/org/admin/settings/parents/view/ParentRow.js
1 import _ from 'lodash'; File was deleted
2 import { Meteor } from 'meteor/meteor';
3
4 import React, { Component } from 'react';
5 import { Link,browserHistory } from 'react-router';
6 import { FormGroup,
7 FormControl,Glyphicon,Button } from 'react-bootstrap';
8
9
10 export class ParentRow extends Component {
11
12 constructor(props) {
13 super(props);
14 this.state = {
15
16 };
17 this.onUpdate = this.onUpdate.bind(this);
18 };
19
20 onUpdate(key, value) {
21 this.setState({[key]: value});
22 };
23
24 render() {
25 const {parent} = this.props;
26 if(parent.firstName){
27 return (
28 <tr>
29 <td>{parent.firstName}</td>
30 <td>{parent.relationship}</td> {/* relationship doesnt reflect here */}
31 <td><span className="label label-success">Active</span></td>
32 <td className="text-center">
33 <ul className="icons-list">
34 <li className="dropdown">
35 <a href="#" className="dropdown-toggle" data-toggle="dropdown">
36 <i className="icon-menu9"></i>
37 </a>
38 <ul className="dropdown-menu dropdown-menu-right">
39 <li><a href="#"><i className="icon-file-pdf"></i> Export to .pdf</a></li>
40 <li><a href="#"><i className="icon-file-excel"></i> Export to .csv</a></li>
41 <li><a href="#"><i className="icon-file-word"></i> Export to .doc</a></li>
42 </ul>
43 </li>
44 </ul>
45 </td>
46 </tr>
47 );
48 }else {
49 return null;
50 }
51
52 };
53
54 };
55 1 import _ from 'lodash';
imports/client/views/org/admin/settings/parents/view/ParentTable.js
1 import _ from 'lodash'; File was deleted
2 import { Meteor } from 'meteor/meteor';
3
4 import React, { Component } from 'react';
5 import { Link,browserHistory } from 'react-router';
6 import { FormGroup,Panel,Table,
7 ButtonToolbar,Modal,
8 FormControl,Glyphicon,Button } from 'react-bootstrap';
9 import {moment} from 'meteor/momentjs:moment'
10 import {ParentRow} from './ParentRow'
11 import {BootstrapTable, TableHeaderColumn}from 'react-bootstrap-table';
12 const options = {
13 page: 0, // which page you want to show as default
14 sizePerPageList: [ {
15 text: '5', value: 5
16 }, {
17 text: '10', value: 10
18 }], // you can change the dropdown list for size per page
19 sizePerPage: 5, // which size per page you want to locate as default
20 pageStartIndex: 0, // where to start counting the pages
21 paginationSize: 3, // the pagination bar size.
22 prePage: 'Prev', // Previous page button text
23 nextPage: 'Next', // Next page button text
24 firstPage: 'First', // First page button text
25 lastPage: 'Last', // Last page button text
26 paginationShowsTotal: false, // Accept bool or function
27 paginationPosition: 'bottom' // default is bottom, top and both is all available
28 // hideSizePerPage: true > You can hide the dropdown for sizePerPage
29 // alwaysShowAllBtns: true // Always show next and previous button
30 // withFirstAndLast: false > Hide the going to First and Last page button
31 };
32
33 export class ParentTable extends Component {
34
35 constructor(props) {
36 super(props);
37 this.state = {
38 show: false,
39 panleOpen: true,
40 };
41 this.onUpdate = this.onUpdate.bind(this);
42 };
43 onUpdate(key, value) {
44 this.setState({[key]: value});
45 };
46
47 render() {
48 return (
49 <div className="panel panel-flat">
50 <div className="panel-heading">
51 <h5 className="panel-title">Parent Details</h5>
52 <div className="heading-elements">
53 <ul className="icons-list">
54 <li onClick={this.togglePanel}><a data-action="collapse" className={this.state.panleOpen?"rotate-180":null}></a></li>
55 </ul>
56 </div>
57 </div>
58 <Panel collapsible expanded={this.state.panleOpen}>
59 <BootstrapTable data={ this.props.parent } pagination={ true } options={ options } >
60 <TableHeaderColumn dataField='srno' isKey={ true } dataSort={ true } filter={ { type: 'TextFilter' } }>Sr No</TableHeaderColumn>
61 <TableHeaderColumn dataField='firstName' dataSort={ true } filter={ { type: 'TextFilter' } }>Name</TableHeaderColumn>
62 <TableHeaderColumn dataField='relationship' dataSort={ true } filter={ { type: 'TextFilter' } }>Relationship</TableHeaderColumn>
63 <TableHeaderColumn dataField='profession' dataSort={ true } filter={ { type: 'TextFilter' } }>Profession</TableHeaderColumn>
64 </BootstrapTable>
65 </Panel>
66 </div>
67 );
68 };
69
70 };
71 1 import _ from 'lodash';
imports/client/views/org/admin/settings/staff/StaffView.js
1 import _ from 'lodash'; File was deleted
2 import { Meteor } from 'meteor/meteor';
3
4 import React, { Component } from 'react';
5 import { Link,browserHistory } from 'react-router';
6 import { FormGroup,
7 FormControl,Glyphicon,Button } from 'react-bootstrap';
8 import { Header } from '../Header';
9 import { StaffTable } from './view/StaffTable'
10 import { AddStaff } from './add/addStaff'
11 import { UploadCsvStaff } from './UploadCsvStaff'
12
13 export class StaffView extends Component {
14 constructor(props) {
15 super(props);
16 this.state = {
17
18 };
19 this.onUpdate = this.onUpdate.bind(this);
20 };
21
22 onUpdate(key, value) {
23 this.setState({[key]: value});
24 };
25
26 render() {
27 const {user, org, staff} = this.props.data;
28 return (
29 <div className="container-detached">
30 <Header
31 user = {user}
32 org = {org}
33 />
34 <StaffTable
35 data = {this.props.data}
36 staff = {staff}
37 />
38 <AddStaff/>
39 <UploadCsvStaff />
40 </div>
41 );
42 };
43
44 };
45 1 import _ from 'lodash';
imports/client/views/org/admin/settings/staff/UploadCsvStaff.js
1 // import {UploadCsv } from '/imports/collections/students/UploadCsv' File was deleted
2 import _ from 'lodash';
3 import { Meteor } from 'meteor/meteor';
4
5 import React, { Component } from 'react';
6 import { Link,browserHistory } from 'react-router';
7 import { FormGroup,Panel,Table,
8 ButtonToolbar,Modal,ControlLabel,HelpBlock,
9 FormControl,Glyphicon,Button } from 'react-bootstrap';
10 // import { AddStudentForm } from './addStudentForm';
11 import { FilesCollection } from 'meteor/ostrio:files';
12 const Papa = this.Papa;
13 // console.log(this);
14 const style = {
15 margin: 12,
16 };
17 function FieldGroup({ id, label, help, ...props }) {
18 return (
19 <FormGroup controlId={id}>
20 <ControlLabel>{label}</ControlLabel>
21 <FormControl {...props} />
22 {help && <HelpBlock>{help}</HelpBlock>}
23 </FormGroup>
24 );
25 }
26 export class UploadCsvStaff extends Component {
27 constructor(props) {
28 super(props);
29 this.state = {
30 show: false
31 };
32 this.showModal = this.showModal.bind(this);
33 this.hideModal = this.hideModal.bind(this);
34 this.onUpdate = this.onUpdate.bind(this);
35 };
36
37 showModal() {
38 this.setState({show: true});
39 }
40
41 hideModal() {
42 this.setState({show: false});
43 }
44 onUpdate(key, value) {
45 this.setState({[key]: value});
46 };
47 uploadStaffCsv(e){
48 e.preventDefault();
49 e.persist();
50 var file = $('input[type="file"]').prop("files")[0];
51 Papa.parse(file, {
52 header: true,
53 complete: function(csvData) {
54 console.log("csvData");
55 console.log(csvData);
56 if(csvData){
57 Meteor.call('staff.uploadCsv', csvData, function (error, result) {
58 console.log("error");
59 console.log(error);
60 console.log("result");
61 console.log(result);
62 })
63 }
64 }
65 });
66 }
67
68 render() {
69 console.log(this.props);
70 return (
71 <ButtonToolbar>
72 <Button bsStyle="primary" onClick={this.showModal}>
73 Upload CSV
74 </Button>
75 <Modal
76 {...this.props}
77 show={this.state.show}
78 onHide={this.hideModal}
79 dialogClassName="custom-modal"
80 >
81 <Modal.Header closeButton>
82 <Modal.Title id="contained-modal-title-lg">Upload Csv</Modal.Title>
83 </Modal.Header>
84 <Modal.Body>
85 <form onSubmit={ (e) => this.uploadStaffCsv(e) } >
86 <FieldGroup
87 id="formControlsFile"
88 type="file"
89 label="File"
90 help="Upload you CSV here."
91 />
92 <Button type="submit" bsStyle="default">Upload File</Button>
93 </form>
94 </Modal.Body>
95 <Modal.Footer>
96 <Button onClick={this.hideModal}>Close</Button>
97 </Modal.Footer>
98 </Modal>
99 </ButtonToolbar>
100 );
101 };
102
103 };
104 1 // import {UploadCsv } from '/imports/collections/students/UploadCsv'
imports/client/views/org/admin/settings/staff/add/AddStaffFormContainer.js
1 import React, { Component } from 'react' File was deleted
2 import StaffForm from './StaffForm'
3 import Form from '/imports/client/views/core/Form'
4 import Validator from '/imports/client/views/core/Validator'
5 import { isRequired, isValidEmail } from '/imports/client/views/core/validations'
6
7 export class AddStaffFormContainer extends Component {
8
9 constructor(props) {
10 super(props)
11 this.state = { currentStep: 0 }
12 this.handleNextClick = this.handleNextClick.bind(this)
13 this.handleBackClick = this.handleBackClick.bind(this)
14 this.handleSubmit = this.handleSubmit.bind(this)
15 }
16
17 handleNextClick() {
18 console.log("clicked");
19 this.form.handleSubmit()
20 if (this.validator.getErrors() && Object.keys(this.validator.getErrors()).length > 0) return
21 console.log("after submit");
22 this.setState({ currentStep: this.state.currentStep + 1 })
23 this.form.resetSubmitted()
24 }
25
26 handleBackClick() {
27 this.setState({ currentStep: this.state.currentStep + -1 })
28 }
29
30 handleSubmit() {
31 if (this.state.currentStep === 3) {
32 Meteor.call('staff.addNew', this.form.state.values, (error, result) => {
33 console.log(error);
34 console.log(result);
35 if(!error){
36 this.props.modalState();
37 }
38 });
39 }
40 }
41
42 //render callback
43 render() {
44 return (
45 <Form
46 onSubmit={this.handleSubmit}
47 ref={form => this.form = form}
48 initialValues={{
49 employeeId: '12345',
50 firstName: 'Test',
51 lastName: 'Last',
52
53 martialStatus: 'single',
54 gender: 'male',
55 dob: '07/03/1993',
56
57 email: 'deepak125.dk+400@gmail.com',
58 phone: '9876543210',
59 address: '123',
60
61 teaching: "yes",
62 type: 'permanent',
63 doj: '07/03/2016',
64
65 qualifaication: 'Phd',
66 specialization: 'Maths',
67 university: 'Pune University',
68
69 degreeFrom: '07/03/2009',
70 degreeEnded: '07/03/2013',
71 }}
72 >
73 {({ values, setValue, getValue, isSubmitted, isDirty }) => (
74 <Validator
75 values={values}
76 ref={validator => this.validator = validator}
77 validations={{
78 employeeId: [(value) => isRequired('Admission id', value)],
79 firstName: [(value) => isRequired('First name', value)],
80 lastName: [(value) => isRequired('Last name', value)],
81
82 gender: [(value) => isRequired('Gender', value)],
83 martialStatus: [(value) => isRequired('martialStatus', value)],
84 dob: [(value) => isRequired('Date of birth', value)],
85
86 teaching: [(value) => this.state.currentStep === 1 && isRequired('teaching', value)],
87 type: [(value) => this.state.currentStep === 1 && isRequired('type', value)],
88 doj: [(value) => this.state.currentStep === 1 && isRequired('doj', value)],
89 desgnation: [(value) => this.state.currentStep === 1 && isRequired('desgnation', value)],
90
91 qualifaication: [(value) => this.state.currentStep === 2 && isRequired('qualifaication', value)],
92 specialization: [(value) => this.state.currentStep === 2 && isRequired('specialization', value)],
93 university: [(value) => this.state.currentStep === 2 && isRequired('university', value)],
94
95 degreeFrom: [(value) => this.state.currentStep === 2 && isRequired('degreeFrom', value)],
96 degreeEnded: [(value) => this.state.currentStep === 2 && isRequired('degreeEnded', value)],
97
98 email: [(value) => this.state.currentStep === 3 && isRequired('Email', value), (value) => this.state.currentStep === 1 && isValidEmail(value)],
99 phone: [(value) => this.state.currentStep === 3 && isRequired('Phone', value)],
100 address: [(value) => this.state.currentStep === 3 && isRequired('Address', value)],
101 city: [(value) => this.state.currentStep === 3 && isRequired('City', value)],
102 state: [(value) => this.state.currentStep === 3 && isRequired('State', value)],
103
104 }}
105 >
106 {({ errors }) => (
107 <StaffForm
108 isDirty={isDirty}
109 setValue={setValue}
110 getValue={getValue}
111 isSubmitted={isSubmitted}
112 errors={errors}
113 onNextClick={this.handleNextClick}
114 onBackClick={this.handleBackClick}
115 currentStep={this.state.currentStep}
116 />
117 )}
118 </Validator>
119 )}
120 </Form>
121 )
122 }
123 }
124 1 import React, { Component } from 'react'
imports/client/views/org/admin/settings/staff/add/StaffForm.js
1 import React, { PropTypes } from 'react' File was deleted
2 import {
3 Row,
4 Col,
5 FormGroup,
6 FormControl,
7 Button
8 } from 'react-bootstrap'
9 import DatePicker from '/imports/client/views/core/DatePicker'
10 import Label from '/imports/client/views/core/Label'
11 import Stepper from '/imports/client/views/core/Stepper'
12 import ErrorLabel from '/imports/client/views/core/ErrorLabel'
13
14 const StaffForm = props => (
15 <div className="stepy-validation">
16 <Stepper
17 steps={[
18 {
19 label: 'Personal data',
20 active: props.currentStep === 0,
21 },
22 {
23 label: 'Additional Info',
24 active: props.currentStep === 1,
25 },
26 {
27 label: 'Professional Info',
28 active: props.currentStep === 2,
29 },
30 {
31 label: 'Contact Info',
32 active: props.currentStep === 3,
33 },
34 ]}
35 />
36 {props.currentStep === 0 && (
37 <fieldset title="1">
38 <legend className="text-semibold">Personal data</legend>
39 <Row>
40 <Col xs={12} sm={4}>
41 <FormGroup controlId="employeeId">
42 <Label required>Employee ID</Label>
43 <FormControl
44 type="text"
45 value={props.getValue('employeeId')}
46 placeholder="employee Id"
47 onChange={e => props.setValue('employeeId', e.target.value)}
48 />
49 {props.isSubmitted() && props.errors && props.errors.employeeId && (
50 <ErrorLabel> {props.errors.employeeId} </ErrorLabel>
51 )}
52 </FormGroup>
53 </Col>
54
55 <Col xs={12} sm={4}>
56 <FormGroup controlId="firstName">
57 <Label required>First Name</Label>
58 <FormControl
59 type="text"
60 value={props.getValue('firstName')}
61 placeholder="First Name"
62 onChange={e => props.setValue('firstName', e.target.value)}
63 />
64 {props.isSubmitted() && props.errors && props.errors.firstName && (
65 <ErrorLabel> {props.errors.firstName} </ErrorLabel>
66 )}
67 </FormGroup>
68 </Col>
69
70 <Col xs={12} sm={4}>
71 <FormGroup controlId="lastName">
72 <Label required>Last Name</Label>
73 <FormControl
74 type="text"
75 value={props.getValue('lastName')}
76 placeholder="Last Name"
77 onChange={e => props.setValue('lastName', e.target.value)}
78 />
79 {props.isSubmitted() && props.errors && props.errors.lastName && (
80 <ErrorLabel> {props.errors.lastName} </ErrorLabel>
81 )}
82 </FormGroup>
83 </Col>
84 </Row>
85 <Row>
86 <Col xs={12} sm={4}>
87 <FormGroup controlId="formControlsSelect">
88 <Label>Gender</Label>
89 <FormControl componentClass="select"
90 placeholder="select"
91 value={props.getValue('gender')}
92 onChange={e => props.setValue('gender', e.target.value)}
93 >
94 <option value="male">Male</option>
95 <option value="female">Female</option>
96 </FormControl>
97 {props.isSubmitted() && props.errors && props.errors.gender && (
98 <ErrorLabel> {props.errors.gender} </ErrorLabel>
99 )}
100 </FormGroup>
101 </Col>
102
103 <Col xs={12} sm={4}>
104 <FormGroup controlId="formControlsSelect">
105 <Label>martialStatus</Label>
106 <FormControl componentClass="select"
107 placeholder="select"
108 value={props.getValue('martialStatus')}
109 onChange={e => props.setValue('martialStatus', e.target.value)}
110 >
111 <option value="single">Single</option>
112 <option value="married">Married</option>
113 <option value="divorced">Divorced</option>
114 </FormControl>
115 {props.isSubmitted() && props.errors && props.errors.martialStatus && (
116 <ErrorLabel> {props.errors.martialStatus} </ErrorLabel>
117 )}
118 </FormGroup>
119 </Col>
120
121 <Col xs={12} sm={4}>
122 <FormGroup>
123 <Label required>Date of birth</Label>
124 <DatePicker
125 id="dob"
126 setValue = {props.setValue}
127 value={props.getValue('dob')}
128 onChange={(e) => {
129 props.setValue('dob', e.target.value)
130 }}
131 />
132 {props.isSubmitted() && props.errors && props.errors.dob && (
133 <ErrorLabel> {props.errors.dob} </ErrorLabel>
134 )}
135 </FormGroup>
136 </Col>
137 </Row>
138 </fieldset>
139 )}
140 {props.currentStep === 1 && (
141 <fieldset title="Academic">
142 <legend className="text-semibold">Additional Info</legend>
143 <Row>
144 <Col xs={12} sm={4}>
145 <FormGroup controlId="desgnation">
146 <Label required>Desgnation</Label>
147 <FormControl
148 type="text"
149 value={props.getValue('desgnation')}
150 placeholder="Professor"
151 onChange={e => props.setValue('desgnation', e.target.value)}
152 />
153 {props.isSubmitted() && props.errors && props.errors.desgnation && (
154 <ErrorLabel> {props.errors.desgnation} </ErrorLabel>
155 )}
156 </FormGroup>
157 </Col>
158 <Col xs={12} sm={4}>
159 <FormGroup controlId="formControlsSelect">
160 <Label>Teaching Staff?</Label>
161 <FormControl componentClass="select"
162 placeholder="select"
163 value={props.getValue('teaching')}
164 onChange={e => props.setValue('teaching', e.target.value)}
165 >
166 <option value="yes">Yes</option>
167 <option value="no">No</option>
168 </FormControl>
169 {props.isSubmitted() && props.errors && props.errors.teaching && (
170 <ErrorLabel> {props.errors.teaching} </ErrorLabel>
171 )}
172 </FormGroup>
173 </Col>
174 <Col xs={12} sm={4}>
175 <FormGroup controlId="formControlsSelect">
176 <Label>Type</Label>
177 <FormControl componentClass="select"
178 placeholder="select"
179 value={props.getValue('type')}
180 onChange={e => props.setValue('type', e.target.value)}
181 >
182 <option value="permanent">Permanent</option>
183 <option value="temporary">Temporary</option>
184 </FormControl>
185 {props.isSubmitted() && props.errors && props.errors.type && (
186 <ErrorLabel> {props.errors.type} </ErrorLabel>
187 )}
188 </FormGroup>
189 </Col>
190 </Row>
191 <Row>
192 <Col xs={12} sm={4}>
193 <FormGroup>
194 <Label required>Date of Joining</Label>
195 <DatePicker
196 id="doj"
197 setValue = {props.setValue}
198 value={props.getValue('doj')}
199 onChange={(e) => {
200 props.setValue('doj', e.target.value)
201 }}
202 />
203 {props.isSubmitted() && props.errors && props.errors.doj && (
204 <ErrorLabel> {props.errors.doj} </ErrorLabel>
205 )}
206 </FormGroup>
207 </Col>
208 </Row>
209 </fieldset>
210 )}
211 {props.currentStep === 2 && (
212 <fieldset title="Professional Info">
213 <legend className="text-semibold">Professional Info</legend>
214 <Row>
215 <Col xs={12} sm={4}>
216 <FormGroup controlId="qualifaication">
217 <Label required>Qualifaication</Label>
218 <FormControl
219 type="text"
220 value={props.getValue('qualifaication')}
221 placeholder="Ex: Phd"
222 onChange={e => props.setValue('qualifaication', e.target.value)}
223 />
224 {props.isSubmitted() && props.errors && props.errors.qualifaication && (
225 <ErrorLabel> {props.errors.qualifaication} </ErrorLabel>
226 )}
227 </FormGroup>
228 </Col>
229 <Col xs={12} sm={4}>
230 <FormGroup controlId="specialization">
231 <Label required>Specialization</Label>
232 <FormControl
233 type="text"
234 value={props.getValue('specialization')}
235 placeholder="Ex: Maths"
236 onChange={e => props.setValue('specialization', e.target.value)}
237 />
238 {props.isSubmitted() && props.errors && props.errors.specialization && (
239 <ErrorLabel> {props.errors.specialization} </ErrorLabel>
240 )}
241 </FormGroup>
242 </Col>
243 <Col xs={12} sm={4}>
244 <FormGroup controlId="university">
245 <Label required>University</Label>
246 <FormControl
247 type="text"
248 value={props.getValue('university')}
249 placeholder="Ex: Pune University"
250 onChange={e => props.setValue('university', e.target.value)}
251 />
252 {props.isSubmitted() && props.errors && props.errors.university && (
253 <ErrorLabel> {props.errors.university} </ErrorLabel>
254 )}
255 </FormGroup>
256 </Col>
257 </Row>
258 <Row>
259 <Col xs={12} sm={4}>
260 <FormGroup>
261 <Label required>Latest Degree started At</Label>
262 <DatePicker
263 id="degreeFrom"
264 setValue = {props.setValue}
265 value={props.getValue('degreeFrom')}
266 onChange={(e) => {
267 props.setValue('degreeFrom', e.target.value)
268 }}
269 />
270 {props.isSubmitted() && props.errors && props.errors.degreeFrom && (
271 <ErrorLabel> {props.errors.degreeFrom} </ErrorLabel>
272 )}
273 </FormGroup>
274 </Col>
275 <Col xs={12} sm={4}>
276 <FormGroup>
277 <Label required>Latest Degree ended At</Label>
278 <DatePicker
279 id="degreeEnded"
280 setValue = {props.setValue}
281 value={props.getValue('degreeEnded')}
282 onChange={(e) => {
283 props.setValue('degreeEnded', e.target.value)
284 }}
285 />
286 {props.isSubmitted() && props.errors && props.errors.degreeEnded && (
287 <ErrorLabel> {props.errors.degreeEnded} </ErrorLabel>
288 )}
289 </FormGroup>
290 </Col>
291 </Row>
292 </fieldset>
293 )}
294 {props.currentStep === 3 && (
295 <fieldset title="Academic">
296 <legend className="text-semibold">Additional Info</legend>
297 <Row>
298 <Col xs={12} sm={4}>
299 <FormGroup controlId="email">
300 <Label required>Email</Label>
301 <FormControl
302 type="email"
303 value={props.getValue('email')}
304 placeholder="Email"
305 onChange={e => props.setValue('email', e.target.value)}
306 />
307 {props.isSubmitted() && props.errors && props.errors.email && (
308 <ErrorLabel> {props.errors.email} </ErrorLabel>
309 )}
310 </FormGroup>
311 </Col>
312 <Col xs={12} sm={4}>
313 <FormGroup controlId="phone">
314 <Label required>Phone</Label>
315 <FormControl
316 type="text"
317 value={props.getValue('phone')}
318 placeholder="Martial Status"
319 onChange={e => props.setValue('phone', e.target.value)}
320 />
321 {props.isSubmitted() && props.errors && props.errors.phone && (
322 <ErrorLabel> {props.errors.phone} </ErrorLabel>
323 )}
324 </FormGroup>
325 </Col>
326 </Row>
327 <Row>
328 <Col xs={12} sm={4}>
329 <FormGroup controlId="address">
330 <Label required>Address</Label>
331 <FormControl
332 type="text"
333 value={props.getValue('address')}
334 placeholder="#876, Street, town"
335 onChange={e => props.setValue('address', e.target.value)}
336 />
337 {props.isSubmitted() && props.errors && props.errors.address && (
338 <ErrorLabel> {props.errors.address} </ErrorLabel>
339 )}
340 </FormGroup>
341 </Col>
342 <Col xs={12} sm={4}>
343 <FormGroup controlId="city">
344 <Label required>City</Label>
345 <FormControl
346 type="text"
347 value={props.getValue('city')}
348 placeholder="Chennai"
349 onChange={e => props.setValue('city', e.target.value)}
350 />
351 {props.isSubmitted() && props.errors && props.errors.city && (
352 <ErrorLabel> {props.errors.city} </ErrorLabel>
353 )}
354 </FormGroup>
355 </Col>
356 <Col xs={12} sm={4}>
357 <FormGroup controlId="state">
358 <Label required>State</Label>
359 <FormControl
360 type="text"
361 value={props.getValue('state')}
362 placeholder="Tamilnadu"
363 onChange={e => props.setValue('state', e.target.value)}
364 />
365 {props.isSubmitted() && props.errors && props.errors.state && (
366 <ErrorLabel> {props.errors.state} </ErrorLabel>
367 )}
368 </FormGroup>
369 </Col>
370 </Row>
371 </fieldset>
372 )}
373 <div style={{ textAlign: 'left' }}>
374 {props.currentStep > 0 && (
375 <div style={{ display: 'inline-block', marginRight: 10 }}>
376 <Button onClick={props.onBackClick}>
377 <i className="icon-arrow-left13 position-left"></i>
378 BACK
379 </Button>
380
381 </div>
382 )}
383 {props.currentStep < 3 && (
384 <div style={{ display: 'inline-block' }}>
385 <Button
386 bsStyle="primary"
387 onClick={props.onNextClick}
388 >
389 NEXT
390 <i className="icon-arrow-right14 position-right" />
391 </Button>
392 </div>
393 )}
394 {props.currentStep === 3 && (
395 <div style={{ display: 'inline-block' }}>
396 <Button
397 bsStyle="primary"
398 onClick={props.onNextClick}
399 >
400 SAVE
401 <i className="fa fa-check" />
402 </Button>
403 </div>
404 )}
405 </div>
406 </div>
407 )
408
409 StaffForm.propTypes = {
410 currentStep: PropTypes.number.isRequired,
411 onNextClick: PropTypes.func.isRequired,
412 onBackClick: PropTypes.func.isRequired,
413 setValue: PropTypes.func.isRequired,
414 getValue: PropTypes.func.isRequired,
415 }
416
417 export default StaffForm
418 1 import React, { PropTypes } from 'react'
imports/client/views/org/admin/settings/staff/add/addStaff.js
1 import _ from 'lodash'; File was deleted
2 import { Meteor } from 'meteor/meteor';
3 import React, { Component } from 'react';
4 import { Link,browserHistory } from 'react-router';
5 import { FormGroup,Panel,Table,
6 ButtonToolbar,Modal,
7 FormControl,Glyphicon,Button } from 'react-bootstrap';
8 import { AddStaffFormContainer } from './AddStaffFormContainer';
9
10 const style = {
11 margin: 12,
12 };
13 export class AddStaff extends Component {
14 constructor(props) {
15 super(props);
16 this.state = {
17 show: false
18 };
19 this.showModal = this.showModal.bind(this);
20 this.hideModal = this.hideModal.bind(this);
21 this.onUpdate = this.onUpdate.bind(this);
22 };
23
24 showModal() {
25 this.setState({show: true});
26 }
27
28 hideModal() {
29 this.setState({show: false});
30 }
31 onUpdate(key, value) {
32 this.setState({[key]: value});
33 };
34
35 render() {
36 return (
37 <ButtonToolbar>
38 <Button bsStyle="primary" onClick={this.showModal}>
39 Add Staff
40 </Button>
41 <Modal
42 {...this.props}
43 show={this.state.show}
44 onHide={this.hideModal}
45 dialogClassName="custom-modal"
46 bsSize="large"
47 >
48 <Modal.Header closeButton>
49 <Modal.Title id="contained-modal-title-lg">Add New Staff</Modal.Title>
50 </Modal.Header>
51 <Modal.Body>
52 <AddStaffFormContainer
53 modalState = {this.hideModal}
54 />
55 </Modal.Body>
56 {/*
57 <Modal.Footer>
58 <Button onClick={this.hideModal}>Close</Button>
59 </Modal.Footer>
60 */}
61 </Modal>
62 </ButtonToolbar>
63 );
64 };
65
66 };
67 1 import _ from 'lodash';
imports/client/views/org/admin/settings/staff/index.js
1 // import { InviteSignupController } from '/imports/client/views/invite/signup/index' File was deleted
2 import _ from 'lodash';
3 import {
4 composeWithTracker,
5 compose,
6 composeAll
7 } from 'react-komposer';
8 import { Loading } from '/imports/client/components/Loading';
9
10 import { Orgs } from '/imports/collections/orgs/index';
11 import { Users } from '/imports/collections/users/index';
12 import { Staffs } from '/imports/collections/staff/index';
13 import { StaffView } from './StaffView';
14
15 const meteorTick = (props, onData) => {
16 Shelf.layout.set({
17 bulb: 'SETTINGS',
18 subbulb: 'USERS',
19 view: 'STAFF'
20 });
21 const handles = [
22 Meteor.subscribe('users.current'),
23 Meteor.subscribe('orgs.current'),
24 Meteor.subscribe('users.forMyOrg'),
25 Meteor.subscribe('staff.forMyOrg'),
26 ];
27
28 if(_.every(handles, (handle) => (handle.ready()) )) {
29 const user = Users.current();
30 const org = Orgs.current();
31 staff = Users.find({"role":"STAFF"}).fetch() ? Users.find({"role":"STAFF"}).fetch() : "";
32 console.log(Users.find({"role":"STAFF"}).fetch());
33 staffData = Staffs.find().fetch() ? Staffs.find().fetch() : "";
34 console.log("staffData");
35 console.log(staffData);
36 for(var i=0; i< staff.length; i++){
37 for(var j=0; j< staffData.length; j++){
38 if(staff[i]._id == staffData[j].userId){
39 staff[i].type = staffData[j].type;
40 staff[i].employeeId = staffData[j].employeeId;
41 staff[i].dob = staffData[j].dob;
42 }
43 }
44 }
45 onData(null, {
46 data: {
47 user: user,
48 org: org,
49 staff: staff
50 },
51 });
52 }
53
54 return () => {
55 _.each(handles, (handle) => handle.stop() );
56 };
57 };
58
59
60 const reduxTick = (props, onData) => {
61 onData(null, {
62 data: {}
63 });
64 };
65
66
67 export const staffViewController = composeAll(
68 composeWithTracker(meteorTick, Loading),
69 compose(reduxTick, Loading),
70 )(StaffView);
71 1 // import { InviteSignupController } from '/imports/client/views/invite/signup/index'
imports/client/views/org/admin/settings/staff/view/StaffRow.js
1 import _ from 'lodash'; File was deleted
2 import { Meteor } from 'meteor/meteor';
3
4 import React, { Component } from 'react';
5 import { Link,browserHistory } from 'react-router';
6 import { FormGroup,
7 FormControl,Glyphicon,Button } from 'react-bootstrap';
8
9
10 export class StaffRow extends Component {
11
12 constructor(props) {
13 super(props);
14 this.state = {
15
16 };
17 this.onUpdate = this.onUpdate.bind(this);
18 };
19
20 onUpdate(key, value) {
21 this.setState({[key]: value});
22 };
23
24 render() {
25 const {staff} = this.props;
26 if(staff.firstName){
27 return (
28 <tr>
29 <td>{staff.firstName}</td>
30 <td>{staff.lastName}</td>
31 <td>{staff.type}</td>
32 <td>{staff.dob? moment(staff.dob).format("LL") : <span></span>}</td>
33 <td><span className="label label-success">Active</span></td>
34 <td className="text-center">
35 <ul className="icons-list">
36 <li className="dropdown">
37 <a href="#" className="dropdown-toggle" data-toggle="dropdown">
38 <i className="icon-menu9"></i>
39 </a>
40 <ul className="dropdown-menu dropdown-menu-right">
41 <li><a href="#"><i className="icon-file-pdf"></i> Export to .pdf</a></li>
42 <li><a href="#"><i className="icon-file-excel"></i> Export to .csv</a></li>
43 <li><a href="#"><i className="icon-file-word"></i> Export to .doc</a></li>
44 </ul>
45 </li>
46 </ul>
47 </td>
48 </tr>
49 );
50 }else {
51 return null;
52 }
53
54 };
55
56 };
57 1 import _ from 'lodash';
imports/client/views/org/admin/settings/staff/view/StaffTable.js
1 import _ from 'lodash'; File was deleted
2 import { Meteor } from 'meteor/meteor';
3
4 import React, { Component } from 'react';
5 import { Link,browserHistory } from 'react-router';
6 import { FormGroup,Panel,Table,
7 ButtonToolbar,Modal,
8 FormControl,Glyphicon,Button } from 'react-bootstrap';
9 import {moment} from 'meteor/momentjs:moment'
10 import {StaffRow} from './StaffRow'
11 import {BootstrapTable, TableHeaderColumn}from 'react-bootstrap-table';
12 const options = {
13 page: 0, // which page you want to show as default
14 sizePerPageList: [ {
15 text: '5', value: 5
16 }, {
17 text: '10', value: 10
18 }], // you can change the dropdown list for size per page
19 sizePerPage: 5, // which size per page you want to locate as default
20 pageStartIndex: 0, // where to start counting the pages
21 paginationSize: 3, // the pagination bar size.
22 prePage: 'Prev', // Previous page button text
23 nextPage: 'Next', // Next page button text
24 firstPage: 'First', // First page button text
25 lastPage: 'Last', // Last page button text
26 paginationShowsTotal: false, // Accept bool or function
27 paginationPosition: 'bottom' // default is bottom, top and both is all available
28 // hideSizePerPage: true > You can hide the dropdown for sizePerPage
29 // alwaysShowAllBtns: true // Always show next and previous button
30 // withFirstAndLast: false > Hide the going to First and Last page button
31 };
32
33 function dateFormatter(cell, row) {
34 console.log("cell");
35 console.log(cell);
36 if(cell){
37 cell = new Date(cell);
38 console.log(cell);
39 return `${('0' + cell.getDate()).slice(-2)}/${('0' + (cell.getMonth() + 1)).slice(-2)}/${cell.getFullYear()}`;
40 }
41 }
42
43 export class StaffTable extends Component {
44
45 constructor(props) {
46 super(props);
47 this.state = {
48 show: false,
49 panleOpen: true,
50 };
51 this.onUpdate = this.onUpdate.bind(this);
52 };
53 onUpdate(key, value) {
54 this.setState({[key]: value});
55 };
56 togglePanel(){
57 this.setState({panleOpen: !this.state.panleOpen});
58 }
59 render() {
60 console.log("this.props.staff");
61 console.log(this.props.staff);
62 return (
63 <div className="panel panel-flat">
64 <div className="panel-heading">
65 <h5 className="panel-title">Teachers Details</h5>
66 <div className="heading-elements">
67 <ul className="icons-list">
68 <li onClick={this.togglePanel}><a data-action="collapse" className={this.state.panleOpen?"rotate-180":null}></a></li>
69 </ul>
70 </div>
71 </div>
72 <Panel collapsible expanded={this.state.panleOpen}>
73 <BootstrapTable data={ this.props.staff } pagination={ true } options={ options } >
74 <TableHeaderColumn dataField='employeeId' isKey={ true } dataSort={ true } filter={ { type: 'TextFilter' } }>Employee Id</TableHeaderColumn>
75 <TableHeaderColumn dataField='firstName' dataSort={ true } filter={ { type: 'TextFilter' } }>First Name</TableHeaderColumn>
76 <TableHeaderColumn dataField='lastName' dataSort={ true } filter={ { type: 'TextFilter' } }>Last Name</TableHeaderColumn>
77 <TableHeaderColumn dataField='type' dataSort={ true } filter={ { type: 'TextFilter' } }>Type</TableHeaderColumn>
78 <TableHeaderColumn dataField='dob' dataFormat={ dateFormatter } >DOB</TableHeaderColumn>
79 </BootstrapTable>
80 </Panel>
81 </div>
82 );
83 };
84
85 };
86 1 import _ from 'lodash';
imports/client/views/org/admin/settings/students/StudentDataView.js
1 import _ from 'lodash'; File was deleted
2 import { Meteor } from 'meteor/meteor';
3
4 import React, { Component } from 'react';
5 import { Link,browserHistory } from 'react-router';
6 import { FormGroup,Panel,Table,
7 ButtonToolbar,Modal,
8 FormControl,Glyphicon,Button } from 'react-bootstrap';
9 import { AddStudentForm } from './addStudentForm';
10
11 export class StudentDataView extends Component {
12
13 constructor(props) {
14 super(props);
15 this.state = {
16 show: false
17 };
18 this.showModal = this.showModal.bind(this);
19 this.hideModal = this.hideModal.bind(this);
20 this.onUpdate = this.onUpdate.bind(this);
21 };
22
23 showModal() {
24 this.setState({show: true});
25 }
26
27 hideModal() {
28 this.setState({show: false});
29 }
30 onUpdate(key, value) {
31 this.setState({[key]: value});
32 };
33
34 render() {
35 return (
36 <div className="content has-detached-left">
37
38 <div className="container-detached">
39 <div className="content-detached">
40 <div className="row">
41 <div className="col-lg-3 col-md-6">
42 <div className="panel panel-body">
43 <div className="media">
44 <div className="media-left">
45 <a href="assets/images/placeholder.png" data-popup="lightbox">
46 <img src="assets/images/download2.png" className="img-circle img-lg" alt="" />
47 </a>
48 </div>
49
50 <div className="media-body">
51 <h6 className="media-heading">Students</h6>
52 <span className="text-muted">Click to view</span>
53 </div>
54 </div>
55 </div>
56 </div>
57
58 <div className="col-lg-3 col-md-6">
59 <div className="panel panel-body">
60 <div className="media">
61 <div className="media-left">
62 <a href="assets/images/placeholder.jpg" data-popup="lightbox">
63 <img src="assets/images/download.png" className="img-circle img-lg" alt="" />
64 </a>
65 </div>
66
67 <div className="media-body">
68 <h6 className="media-heading">Teachers</h6>
69 <span className="text-muted">Click to view</span>
70 </div>
71 </div>
72 </div>
73 </div>
74
75 <div className="col-lg-3 col-md-6">
76 <div className="panel panel-body">
77 <div className="media">
78 <div className="media-left">
79 <a href="assets/images/placeholder.jpg" data-popup="lightbox">
80 <img src="assets/images/download3.png" className="img-circle img-lg" alt="" />
81 </a>
82 </div>
83
84 <div className="media-body">
85 <h6 className="media-heading">Parents</h6>
86 <span className="text-muted">Click to view</span>
87 </div>
88 </div>
89 </div>
90 </div>
91
92 <div className="col-lg-3 col-md-6">
93 <div className="panel panel-body">
94 <div className="media">
95 <div className="media-left">
96 <a href="assets/images/placeholder.jpg" data-popup="lightbox">
97 <img src="assets/images/download1.png" className="img-circle img-lg" alt="" />
98 </a>
99 </div>
100
101 <div className="media-body">
102 <h6 className="media-heading">Non Teaching Staff</h6>
103 <span className="text-muted">Click to view</span>
104 </div>
105 </div>
106 </div>
107 </div>
108 </div>
109
110 <div className="panel panel-flat">
111 <div className="panel-heading">
112 <h5 className="panel-title">Student Details</h5>
113 <div className="heading-elements">
114 <ul className="icons-list">
115 <li><a data-action="collapse"></a></li>
116 <li><a data-action="reload"></a></li>
117 </ul>
118 </div>
119 </div>
120
121
122 <table className="table datatable-basic table-striped">
123 <thead>
124 <tr>
125 <th>First Name</th>
126 <th>Last Name</th>
127 <th>className</th>
128 <th>DOB</th>
129 <th>Status</th>
130 <th className="text-center">Actions</th>
131 </tr>
132 </thead>
133 <tbody>
134 <tr>
135 <td>Marth</td>
136 <td><a href="#">Enright</a></td>
137 <td>VII</td>
138 <td>22 Jun 1972</td>
139 <td><span className="label label-success">Active</span></td>
140 <td className="text-center">
141 <ul className="icons-list">
142 <li className="dropdown">
143 <a href="#" className="dropdown-toggle" data-toggle="dropdown">
144 <i className="icon-menu9"></i>
145 </a>
146
147 <ul className="dropdown-menu dropdown-menu-right">
148 <li><a href="#"><i className="icon-file-pdf"></i> Export to .pdf</a></li>
149 <li><a href="#"><i className="icon-file-excel"></i> Export to .csv</a></li>
150 <li><a href="#"><i className="icon-file-word"></i> Export to .doc</a></li>
151 </ul>
152 </li>
153 </ul>
154 </td>
155 </tr>
156 <tr>
157 <td>Jackelyn</td>
158 <td>Weible</td>
159 <td><a href="#">XI</a></td>
160 <td>3 Oct 1981</td>
161 <td><span className="label label-default">Inactive</span></td>
162 <td className="text-center">
163 <ul className="icons-list">
164 <li className="dropdown">
165 <a href="#" className="dropdown-toggle" data-toggle="dropdown">
166 <i className="icon-menu9"></i>
167 </a>
168
169 <ul className="dropdown-menu dropdown-menu-right">
170 <li><a href="#"><i className="icon-file-pdf"></i> Export to .pdf</a></li>
171 <li><a href="#"><i className="icon-file-excel"></i> Export to .csv</a></li>
172 <li><a href="#"><i className="icon-file-word"></i> Export to .doc</a></li>
173 </ul>
174 </li>
175 </ul>
176 </td>
177 </tr>
178 </tbody>
179 </table>
180 </div>
181
182
183 <ul className="fab-menu fab-menu-fixed fab-menu-bottom-right" data-fab-toggle="click">
184 <li>
185 <a className="fab-menu-btn btn bg-teal-400 btn-float btn-rounded btn-icon">
186 <i className="fab-icon-open icon-plus3"></i>
187 <i className="fab-icon-close icon-cross2"></i>
188 </a>
189
190 <ul className="fab-menu-inner">
191 <li>
192 <div data-fab-label="Upload bulk data">
193 <a href="#" className="btn btn-default btn-rounded btn-icon btn-float">
194 <i className="icon-file-upload2"></i>
195 </a>
196 </div>
197 </li>
198 <li>
199 <div data-fab-label="Add Student">
200 <a href="#" className="btn btn-default btn-rounded btn-icon btn-float">
201 <i className=" icon-file-plus2"></i>
202 </a>
203 <span className="badge bg-primary-400">5</span>
204 </div>
205 </li>
206 </ul>
207 </li>
208 </ul>
209
210 </div>
211 </div>
212 <div className="sidebar-detached affix-top">
213 <div className="sidebar sidebar-default">
214 <div className="sidebar-content">
215
216 <div className="sidebar-category">
217 <div className="category-title">
218 <span>Advanced Search</span>
219 <ul className="icons-list">
220 <li><a href="#" data-action="collapse"></a></li>
221 </ul>
222 </div>
223
224 <div className="category-content">
225 <form action="#">
226 <div className="has-feedback has-feedback-left">
227 <input type="search" className="form-control" placeholder="First Name" />
228 <div className="form-control-feedback">
229 <i className="icon-search4 text-size-base text-muted"></i>
230 </div>
231 </div>
232 </form>
233 </div>
234 <div className="category-content">
235 <form action="#">
236 <div className="has-feedback has-feedback-left">
237 <input type="search" className="form-control" placeholder="Last Name" />
238 <div className="form-control-feedback">
239 <i className="icon-search4 text-size-base text-muted"></i>
240 </div>
241 </div>
242 </form>
243 </div>
244 <div className="category-content">
245 <form action="#">
246 <div className="has-feedback has-feedback-left">
247 <div className="btn-group">
248 <button type="button" className="dropdown-toggle form-control" data-toggle="dropdown">
249 <span data-bind="label">Select className</span>&nbsp;<span className="caret"></span>
250 </button>
251 <ul className="dropdown-menu" role="menu">
252 <li><a href="#">Item 1</a></li>
253 <li><a href="#">Another item</a></li>
254 <li><a href="#">This is a longer item that will not fit properly</a></li>
255 </ul>
256 </div>
257 <div className="form-control-feedback">
258 <i className="icon-search4 text-size-base text-muted"></i>
259 </div>
260 </div>
261 </form>
262 </div>
263 </div>
264
265
266 </div>
267 </div>
268 </div>
269 </div>
270
271 );
272 };
273
274 };
275 1 import _ from 'lodash';
imports/client/views/org/admin/settings/students/StudentDataView0.js
1 import _ from 'lodash'; File was deleted
2 import { Meteor } from 'meteor/meteor';
3
4 import React, { Component } from 'react';
5 import { Link,browserHistory } from 'react-router';
6 import { FormGroup,Panel,Table,
7 ButtonToolbar,Modal,
8 FormControl,Glyphicon,Button } from 'react-bootstrap';
9 import { AddStudentForm } from './addStudentForm';
10
11 export class StudentDataView extends Component {
12
13 constructor(props) {
14 super(props);
15 this.state = {
16 show: false
17 };
18 this.showModal = this.showModal.bind(this);
19 this.hideModal = this.hideModal.bind(this);
20 this.onUpdate = this.onUpdate.bind(this);
21 };
22
23 showModal() {
24 this.setState({show: true});
25 }
26
27 hideModal() {
28 this.setState({show: false});
29 }
30 onUpdate(key, value) {
31 this.setState({[key]: value});
32 };
33
34 render() {
35 return (
36 <div className = "enterPane-box">
37 <Panel header="Students Info" bsStyle="primary">
38 <Table striped bordered condensed hover>
39 <thead>
40 <tr>
41 <th>#</th>
42 <th>First Name</th>
43 <th>Last Name</th>
44 </tr>
45 </thead>
46 <tbody>
47 {
48 this.props.data.students.map(function(student, i)
49 {
50 return(
51 <tr>
52 <td>{i+1}</td>
53 <td>{student.firstName}</td>
54 <td>{student.lastName}</td>
55 </tr>
56 )
57 })
58 }
59
60 </tbody>
61 </Table>
62 <ButtonToolbar>
63 <Button bsStyle="primary" onClick={this.showModal}>
64 Add Student
65 </Button>
66 <Modal
67 {...this.props}
68 show={this.state.show}
69 onHide={this.hideModal}
70 dialogClassName="custom-modal"
71 >
72 <Modal.Header closeButton>
73 <Modal.Title id="contained-modal-title-lg">New Student</Modal.Title>
74 </Modal.Header>
75 <Modal.Body>
76 <AddStudentForm />
77 </Modal.Body>
78 <Modal.Footer>
79 <Button onClick={this.hideModal}>Close</Button>
80 </Modal.Footer>
81 </Modal>
82 </ButtonToolbar>
83 </Panel>
84 </div>
85 );
86 };
87
88 };
89 1 import _ from 'lodash';
imports/client/views/org/admin/settings/students/StudentView.js
1 import _ from 'lodash'; File was deleted
2 import { Meteor } from 'meteor/meteor';
3
4 import React, { Component } from 'react';
5 import { Link,browserHistory } from 'react-router';
6 import { Navbar,Modal, Nav, NavItem,
7 Glyphicon, Collapse, FormGroup, FormControl, Panel,
8 NavbarToggler, NavbarBrand, Table, ButtonToolbar,
9 NavLink, DropdownItem, DropdownToggle, DropdownMenu,
10 NavDropdown, MenuItem, Breadcrumb, Button } from 'react-bootstrap';
11 import { StudentTable } from './view/StudentTable';
12 import { Header } from '../Header';
13 import { UploadCsv } from './UploadCsv';
14 import { AddStudent } from './add/addStudent';
15 import { Students } from '/imports/collections/students/index';
16 import './student.css'
17
18 export class StudentView extends Component {
19
20 constructor(props) {
21 super(props);
22 this.state = {
23 show: false,
24 firstNameSearch: "",
25 lastNameSearch: "",
26 };
27 this.showModal = this.showModal.bind(this);
28 this.hideModal = this.hideModal.bind(this);
29 this.onUpdate = this.onUpdate.bind(this);
30 };
31
32 showModal() {
33 this.setState({show: true});
34 }
35
36 hideModal() {
37 this.setState({show: false});
38 }
39 onUpdate(key, value) {
40 this.setState({[key]: value});
41 };
42
43 render() {
44 firstNameSearch = this.state.firstNameSearch;
45 lastNameSearch = this.state.lastNameSearch;
46 var students =_.filter(this.props.data.students,function(item){
47 if(item.firstName){
48 return _.includes(item.firstName.toLowerCase(),firstNameSearch.toLowerCase());
49 }
50 });
51 return (
52 <div className="container-detached">
53 <div className="">
54 <Header/>
55 <StudentTable
56 data = {this.props.data}
57 studentData = {studentData}
58 />
59 <AddStudent/>
60 <UploadCsv />
61 </div>
62 </div>
63 );
64 };
65
66 };
67 1 import _ from 'lodash';
imports/client/views/org/admin/settings/students/UploadCsv.js
1 // import {UploadCsv } from '/imports/collections/students/UploadCsv' File was deleted
2 import _ from 'lodash';
3 import { Meteor } from 'meteor/meteor';
4
5 import React, { Component } from 'react';
6 import { Link,browserHistory } from 'react-router';
7 import { FormGroup,Panel,Table,
8 ButtonToolbar,Modal,ControlLabel,HelpBlock,
9 FormControl,Glyphicon,Button } from 'react-bootstrap';
10 // import { AddStudentForm } from './addStudentForm';
11 import { FilesCollection } from 'meteor/ostrio:files';
12 const Papa = this.Papa;
13 // console.log(this);
14 const style = {
15 margin: 12,
16 };
17 function FieldGroup({ id, label, help, ...props }) {
18 return (
19 <FormGroup controlId={id}>
20 <ControlLabel>{label}</ControlLabel>
21 <FormControl {...props} />
22 {help && <HelpBlock>{help}</HelpBlock>}
23 </FormGroup>
24 );
25 }
26 export class UploadCsv extends Component {
27 constructor(props) {
28 super(props);
29 this.state = {
30 show: false
31 };
32 this.showModal = this.showModal.bind(this);
33 this.hideModal = this.hideModal.bind(this);
34 this.onUpdate = this.onUpdate.bind(this);
35 };
36
37 showModal() {
38 this.setState({show: true});
39 }
40
41 hideModal() {
42 this.setState({show: false});
43 }
44 onUpdate(key, value) {
45 this.setState({[key]: value});
46 };
47 uploadStudentCsv(e){
48 e.preventDefault();
49 e.persist();
50 var file = $('input[type="file"]').prop("files")[0];
51 Papa.parse(file, {
52 header: true,
53 complete: function(csvData) {
54 console.log("csvData");
55 console.log(csvData);
56 if(csvData){
57 Meteor.call('student.uploadCsv', csvData, function (error, result) {
58 console.log("error");
59 console.log(error);
60 console.log("result");
61 console.log(result);
62 })
63 }
64 }
65 });
66 }
67
68 render() {
69 console.log(this.props);
70 return (
71 <ButtonToolbar>
72 <Button bsStyle="primary" onClick={this.showModal}>
73 Upload CSV
74 </Button>
75 <Modal
76 {...this.props}
77 show={this.state.show}
78 onHide={this.hideModal}
79 dialogClassName="custom-modal"
80 >
81 <Modal.Header closeButton>
82 <Modal.Title id="contained-modal-title-lg">Upload Csv file</Modal.Title>
83 </Modal.Header>
84 <Modal.Body>
85 <form onSubmit={ (e) => this.uploadStudentCsv(e) } >
86 <FieldGroup
87 id="formControlsFile"
88 type="file"
89 label="File"
90 help="Upload you CSV here."
91 />
92 <Button type="submit" bsStyle="default">Upload File</Button>
93 </form>
94 </Modal.Body>
95 <Modal.Footer>
96 <Button onClick={this.hideModal}>Close</Button>
97 </Modal.Footer>
98 </Modal>
99 </ButtonToolbar>
100 );
101 };
102
103 };
104 1 // import {UploadCsv } from '/imports/collections/students/UploadCsv'
imports/client/views/org/admin/settings/students/add/AddStudentFormContainer.js
1 import React, { Component } from 'react' File was deleted
2 import { AddStudentForm } from './addStudentForm'
3 import StudentForm from './StudentForm'
4 import Form from '/imports/client/views/core/Form'
5 import Validator from '/imports/client/views/core/Validator'
6 import { isRequired, isValidEmail } from '/imports/client/views/core/validations'
7
8
9 export class AddStudentFormContainer extends Component {
10
11 constructor(props) {
12 super(props)
13 this.state = { currentStep: 0 }
14 this.handleNextClick = this.handleNextClick.bind(this)
15 this.handleBackClick = this.handleBackClick.bind(this)
16 this.handleSubmit = this.handleSubmit.bind(this)
17 }
18
19 handleNextClick() {
20 this.form.handleSubmit()
21 if (this.validator.getErrors() && Object.keys(this.validator.getErrors()).length > 0) return
22 this.setState({ currentStep: this.state.currentStep + 1 })
23 this.form.resetSubmitted()
24 }
25
26 handleBackClick() {
27 this.setState({ currentStep: this.state.currentStep + -1 })
28 }
29
30 handleSubmit() {
31 self = this;
32 if (this.state.currentStep === 3) {
33 Meteor.call('student.addManually',this.form.state.values, function(err, result){
34 console.log("err");
35 console.log(err);
36 console.log("result");
37 console.log(result);
38 if(!err){
39 self.props.hideModal();
40 }
41 });
42 }
43 }
44
45 //render callback
46 render() {
47 return (
48 <Form
49 onSubmit={this.handleSubmit}
50 ref={form => this.form = form}
51 initialValues={{
52 gender: 'male',
53 parentGender: 'male',
54 admissionId: "123",
55 firstName: "first",
56 lastName: "last",
57 email: "deepak125.dk+21@gmail.com",
58 dob: "04/04/1989",
59 gender: "male",
60 rollNo: "1",
61 studentClass: "2",
62 section: "B",
63 community: "SC",
64 bloodGroup: "B+",
65 phone: "9876543321",
66 address: "address",
67 city: "chennai",
68 state: "tn",
69 parentName: "parentName",
70 parentEmail: "deepak125.dk+41@gmail.com",
71 relation: "father",
72 profession: "farmer",
73 parentGender: "male",
74 parentPhone: "987655412",
75 parentAddress: "parentAddress",
76 parentCity: "parentCity",
77 parentState: "parentState",
78 parentZipcode: "parentZipcode",
79 }}
80 >
81 {({ values, setValue, getValue, isSubmitted, isDirty }) => (
82 <Validator
83 values={values}
84 ref={validator => this.validator = validator}
85 validations={{
86 admissionId: [(value) => isRequired('Admission id', value)],
87 firstName: [(value) => isRequired('First name', value)],
88 lastName: [(value) => isRequired('Last name', value)],
89 email: [(value) => isRequired('Email', value), isValidEmail],
90 dob: [(value) => isRequired('Date of birth', value)],
91 gender: [(value) => isRequired('Gender', value)],
92 rollNo: [(value) => this.state.currentStep === 1 && isRequired('Roll no', value)],
93 studentClass: [(value) => this.state.currentStep === 1 && isRequired('Class', value)],
94 section: [(value) => this.state.currentStep === 1 && isRequired('Section', value)],
95 community: [(value) => this.state.currentStep === 1 && isRequired('Community', value)],
96 bloodGroup: [(value) => this.state.currentStep === 1 && isRequired('Blood group', value)],
97 phone: [(value) => this.state.currentStep === 1 && isRequired('Phone', value)],
98 address: [(value) => this.state.currentStep === 2 && isRequired('Address', value)],
99 city: [(value) => this.state.currentStep === 2 && isRequired('City', value)],
100 state: [(value) => this.state.currentStep === 2 && isRequired('State', value)],
101 parentName: [(value) => this.state.currentStep === 3 && isRequired('Parent name', value)],
102 parentEmail: [(value) => this.state.currentStep === 3 && isRequired('Parent email', value), (value) => this.state.currentStep === 3 && isValidEmail(value)],
103 relation: [(value) => this.state.currentStep === 3 && isRequired('Relation', value)],
104 profession: [(value) => this.state.currentStep === 3 && isRequired('Profession', value)],
105 parentGender: [(value) => this.state.currentStep === 3 && isRequired('Parent gender', value)],
106 parentPhone: [(value) => this.state.currentStep === 3 && isRequired('Parent phone', value)],
107 parentAddress: [(value) => this.state.currentStep === 3 && isRequired('Parent address', value)],
108 parentCity: [(value) => this.state.currentStep === 3 && isRequired('Parent city', value)],
109 parentState: [(value) => this.state.currentStep === 3 && isRequired('Parent state', value)],
110 parentZipcode: [(value) => this.state.currentStep === 3 && isRequired('Parent zip code', value)],
111 }}
112 >
113 {({ errors }) => (
114 <StudentForm
115 isDirty={isDirty}
116 setValue={setValue}
117 getValue={getValue}
118 isSubmitted={isSubmitted}
119 errors={errors}
120 onNextClick={this.handleNextClick}
121 onBackClick={this.handleBackClick}
122 currentStep={this.state.currentStep}
123 />
124 )}
125 </Validator>
126 )}
127 </Form>
128 )
129 }
130 }
131 1 import React, { Component } from 'react'
imports/client/views/org/admin/settings/students/add/StudentForm.js
1 import React, { PropTypes } from 'react' File was deleted
2 import {
3 Row,
4 Col,
5 FormGroup,
6 FormControl,
7 Button
8 } from 'react-bootstrap'
9 import DatePicker from '/imports/client/views/core/DatePicker'
10 import Label from '/imports/client/views/core/Label'
11 import Stepper from '/imports/client/views/core/Stepper'
12 import ErrorLabel from '/imports/client/views/core/ErrorLabel'
13
14 const StudentForm = props => (
15 <div className="stepy-validation">
16 <Stepper
17 steps={[
18 {
19 label: 'Personal data',
20 active: props.currentStep === 0,
21 },
22 {
23 label: 'Academic',
24 active: props.currentStep === 1,
25 },
26 {
27 label: 'Address',
28 active: props.currentStep === 2,
29 },
30 {
31 label: 'Parent info',
32 active: props.currentStep === 3,
33 }
34 ]}
35 />
36 {props.currentStep === 0 && (
37 <fieldset title="1">
38 <legend className="text-semibold">Personal data</legend>
39 <Row>
40 <Col xs={12} sm={4}>
41 <FormGroup controlId="admissionId">
42 <Label required>Admission Id</Label>
43 <FormControl
44 type="text"
45 value={props.getValue('admissionId')}
46 placeholder="admission Id"
47 onChange={e => props.setValue('admissionId', e.target.value)}
48 />
49 {props.isSubmitted() && props.errors && props.errors.admissionId && (
50 <ErrorLabel> {props.errors.admissionId} </ErrorLabel>
51 )}
52 </FormGroup>
53 </Col>
54 <Col xs={12} sm={4}>
55 <FormGroup controlId="firstName">
56 <Label required>First Name</Label>
57 <FormControl
58 type="text"
59 value={props.getValue('firstName')}
60 placeholder="First Name"
61 onChange={e => props.setValue('firstName', e.target.value)}
62 />
63 {props.isSubmitted() && props.errors && props.errors.firstName && (
64 <ErrorLabel> {props.errors.firstName} </ErrorLabel>
65 )}
66 </FormGroup>
67 </Col>
68 <Col xs={12} sm={4}>
69 <FormGroup controlId="lastName">
70 <Label required>Last Name</Label>
71 <FormControl
72 type="text"
73 value={props.getValue('lastName')}
74 placeholder="Last Name"
75 onChange={e => props.setValue('lastName', e.target.value)}
76 />
77 {props.isSubmitted() && props.errors && props.errors.lastName && (
78 <ErrorLabel> {props.errors.lastName} </ErrorLabel>
79 )}
80 </FormGroup>
81 </Col>
82 </Row>
83 <Row>
84 <Col xs={12} sm={4}>
85 <FormGroup controlId="formControlsSelect">
86 <Label>Gender</Label>
87 <FormControl componentClass="select"
88 placeholder="select"
89 value={props.getValue('gender')}
90 onChange={e => props.setValue('gender', e.target.value)}
91 >
92 <option value="male">Male</option>
93 <option value="female">Female</option>
94 </FormControl>
95 {props.isSubmitted() && props.errors && props.errors.gender && (
96 <ErrorLabel> {props.errors.gender} </ErrorLabel>
97 )}
98 </FormGroup>
99 </Col>
100 <Col xs={12} sm={4}>
101 <FormGroup controlId="email">
102 <Label required>Email</Label>
103 <FormControl
104 type="email"
105 value={props.getValue('email')}
106 placeholder="Email"
107 onChange={e => props.setValue('email', e.target.value)}
108 />
109 {props.isSubmitted() && props.errors && props.errors.email && (
110 <ErrorLabel> {props.errors.email} </ErrorLabel>
111 )}
112 </FormGroup>
113 </Col>
114 <Col xs={12} sm={4}>
115 <FormGroup>
116 <Label required>Date of birth</Label>
117 <DatePicker
118 id="dob"
119 setValue = {props.setValue}
120 value={props.getValue('dob')}
121 onChange={(e) => {
122 props.setValue('dob', e.target.value)
123 }}
124 />
125 {props.isSubmitted() && props.errors && props.errors.dob && (
126 <ErrorLabel> {props.errors.dob} </ErrorLabel>
127 )}
128 </FormGroup>
129 </Col>
130 </Row>
131 </fieldset>
132 )}
133 {props.currentStep === 1 && (
134 <fieldset title="Academic">
135 <legend className="text-semibold">Academic</legend>
136 <Row>
137 <Col xs={12} sm={4}>
138 <FormGroup controlId="rollNo">
139 <Label required>Roll No</Label>
140 <FormControl
141 type="text"
142 value={props.getValue('rollNo')}
143 placeholder="Roll No"
144 onChange={e => props.setValue('rollNo', e.target.value)}
145 />
146 {props.isSubmitted() && props.errors && props.errors.rollNo && (
147 <ErrorLabel> {props.errors.rollNo} </ErrorLabel>
148 )}
149 </FormGroup>
150 </Col>
151 <Col xs={12} sm={4}>
152 <FormGroup controlId="class">
153 <Label required>Class</Label>
154 <FormControl
155 type="text"
156 value={props.getValue('studentClass')}
157 placeholder="7"
158 onChange={e => props.setValue('studentClass', e.target.value)}
159 />
160 {props.isSubmitted() && props.errors && props.errors.studentClass && (
161 <ErrorLabel> {props.errors.studentClass} </ErrorLabel>
162 )}
163 </FormGroup>
164 </Col>
165 <Col xs={12} sm={4}>
166 <FormGroup controlId="section">
167 <Label required>Section</Label>
168 <FormControl
169 type="text"
170 value={props.getValue('section')}
171 placeholder="B"
172 onChange={e => props.setValue('section', e.target.value)}
173 />
174 {props.isSubmitted() && props.errors && props.errors.section && (
175 <ErrorLabel> {props.errors.section} </ErrorLabel>
176 )}
177 </FormGroup>
178 </Col>
179 </Row>
180 <Row>
181 <Col xs={12} sm={4}>
182 <FormGroup controlId="community">
183 <Label required>Community</Label>
184 <FormControl
185 type="text"
186 value={props.getValue('community')}
187 placeholder="General"
188 onChange={e => props.setValue('community', e.target.value)}
189 />
190 {props.isSubmitted() && props.errors && props.errors.community && (
191 <ErrorLabel> {props.errors.community} </ErrorLabel>
192 )}
193 </FormGroup>
194 </Col>
195 <Col xs={12} sm={4}>
196 <FormGroup controlId="bloodGroup">
197 <Label required>bloodGroup</Label>
198 <FormControl
199 type="text"
200 value={props.getValue('bloodGroup')}
201 placeholder="B+"
202 onChange={e => props.setValue('bloodGroup', e.target.value)}
203 />
204 {props.isSubmitted() && props.errors && props.errors.bloodGroup && (
205 <ErrorLabel> {props.errors.bloodGroup} </ErrorLabel>
206 )}
207 </FormGroup>
208 </Col>
209 <Col xs={12} sm={4}>
210 <FormGroup controlId="phone">
211 <Label required>Phone</Label>
212 <FormControl
213 type="text"
214 value={props.getValue('phone')}
215 placeholder="9999999999"
216 onChange={e => props.setValue('phone', e.target.value)}
217 />
218 {props.isSubmitted() && props.errors && props.errors.phone && (
219 <ErrorLabel> {props.errors.phone} </ErrorLabel>
220 )}
221 </FormGroup>
222 </Col>
223 </Row>
224 </fieldset>
225 )}
226 {props.currentStep === 2 && (
227 <fieldset title="Address">
228 <legend className="text-semibold">Address</legend>
229 <Row>
230 <Col xs={12} sm={4}>
231 <FormGroup controlId="address">
232 <Label required>Address</Label>
233 <FormControl
234 type="text"
235 value={props.getValue('address')}
236 placeholder="#876, Street, town"
237 onChange={e => props.setValue('address', e.target.value)}
238 />
239 {props.isSubmitted() && props.errors && props.errors.address && (
240 <ErrorLabel> {props.errors.address} </ErrorLabel>
241 )}
242 </FormGroup>
243 </Col>
244 <Col xs={12} sm={4}>
245 <FormGroup controlId="city">
246 <Label required>City</Label>
247 <FormControl
248 type="text"
249 value={props.getValue('city')}
250 placeholder="Chennai"
251 onChange={e => props.setValue('city', e.target.value)}
252 />
253 {props.isSubmitted() && props.errors && props.errors.city && (
254 <ErrorLabel> {props.errors.city} </ErrorLabel>
255 )}
256 </FormGroup>
257 </Col>
258 <Col xs={12} sm={4}>
259 <FormGroup controlId="state">
260 <Label required>State</Label>
261 <FormControl
262 type="text"
263 value={props.getValue('state')}
264 placeholder="Tamilnadu"
265 onChange={e => props.setValue('state', e.target.value)}
266 />
267 {props.isSubmitted() && props.errors && props.errors.state && (
268 <ErrorLabel> {props.errors.state} </ErrorLabel>
269 )}
270 </FormGroup>
271 </Col>
272 </Row>
273 </fieldset>
274 )}
275 {props.currentStep === 3 && (
276 <fieldset title="2">
277 <legend className="text-semibold">Parent information</legend>
278 <Row>
279 <Col xs={12} sm={4}>
280 <FormGroup controlId="parentName">
281 <Label required>Parent Name</Label>
282 <FormControl
283 type="text"
284 value={props.getValue('parentName')}
285 placeholder="John"
286 onChange={e => props.setValue('parentName', e.target.value)}
287 />
288 {props.isSubmitted() && props.errors && props.errors.parentName && (
289 <ErrorLabel> {props.errors.parentName} </ErrorLabel>
290 )}
291 </FormGroup>
292 </Col>
293 <Col xs={12} sm={4}>
294 <FormGroup controlId="parentEmail">
295 <Label required>Parent Email</Label>
296 <FormControl
297 type="text"
298 value={props.getValue('parentEmail')}
299 placeholder="john@email.com"
300 onChange={e => props.setValue('parentEmail', e.target.value)}
301 />
302 {props.isSubmitted() && props.errors && props.errors.parentEmail && (
303 <ErrorLabel> {props.errors.parentEmail} </ErrorLabel>
304 )}
305 </FormGroup>
306 </Col>
307 <Col xs={12} sm={4}>
308 <FormGroup controlId="relation">
309 <Label required>Relation</Label>
310 <FormControl
311 type="text"
312 value={props.getValue('relation')}
313 placeholder="Father"
314 onChange={e => props.setValue('relation', e.target.value)}
315 />
316 {props.isSubmitted() && props.errors && props.errors.relation && (
317 <ErrorLabel> {props.errors.relation} </ErrorLabel>
318 )}
319 </FormGroup>
320 </Col>
321 </Row>
322 <Row>
323 <Col xs={12} sm={4}>
324 <FormGroup controlId="profession">
325 <Label required>Profession</Label>
326 <FormControl
327 type="text"
328 value={props.getValue('profession')}
329 placeholder="Farmer"
330 onChange={e => props.setValue('profession', e.target.value)}
331 />
332 {props.isSubmitted() && props.errors && props.errors.profession && (
333 <ErrorLabel> {props.errors.profession} </ErrorLabel>
334 )}
335 </FormGroup>
336 </Col>
337 <Col xs={12} sm={4}>
338 <FormGroup controlId="parentGender">
339 <Label>Parent Gender</Label>
340 <FormControl componentClass="select"
341 placeholder="select"
342 value={props.getValue('parentGender')}
343 onChange={e => props.setValue('parentGender', e.target.value)}
344 >
345 <option value="male">Male</option>
346 <option value="female">Female</option>
347 </FormControl>
348 {props.isSubmitted() && props.errors && props.errors.parentGender && (
349 <ErrorLabel> {props.errors.parentGender} </ErrorLabel>
350 )}
351 </FormGroup>
352 </Col>
353 <Col xs={12} sm={4}>
354 <FormGroup controlId="parentPhone">
355 <Label required>Parent Phone</Label>
356 <FormControl
357 type="text"
358 value={props.getValue('parentPhone')}
359 placeholder="9876543210"
360 onChange={e => props.setValue('parentPhone', e.target.value)}
361 />
362 {props.isSubmitted() && props.errors && props.errors.parentPhone && (
363 <ErrorLabel> {props.errors.parentPhone} </ErrorLabel>
364 )}
365 </FormGroup>
366 </Col>
367 </Row>
368 <Row>
369 <Col xs={12} sm={4}>
370 <FormGroup controlId="parentAddress">
371 <Label required>Parent Address</Label>
372 <FormControl
373 type="text"
374 value={props.getValue('parentAddress')}
375 placeholder="#12, street, town"
376 onChange={e => props.setValue('parentAddress', e.target.value)}
377 />
378 {props.isSubmitted() && props.errors && props.errors.parentAddress && (
379 <ErrorLabel> {props.errors.parentAddress} </ErrorLabel>
380 )}
381 </FormGroup>
382 </Col>
383 <Col xs={12} sm={4}>
384 <FormGroup controlId="parentCity">
385 <Label required>Parent City</Label>
386 <FormControl
387 type="text"
388 value={props.getValue('parentCity')}
389 placeholder="Chennai"
390 onChange={e => props.setValue('parentCity', e.target.value)}
391 />
392 {props.isSubmitted() && props.errors && props.errors.parentCity && (
393 <ErrorLabel> {props.errors.parentCity} </ErrorLabel>
394 )}
395 </FormGroup>
396 </Col>
397 <Col xs={12} sm={4}>
398 <FormGroup controlId="parentState">
399 <Label required>Parent State</Label>
400 <FormControl
401 type="text"
402 value={props.getValue('parentState')}
403 placeholder="600031"
404 onChange={e => props.setValue('parentState', e.target.value)}
405 />
406 {props.isSubmitted() && props.errors && props.errors.parentState && (
407 <ErrorLabel> {props.errors.parentState} </ErrorLabel>
408 )}
409 </FormGroup>
410 </Col>
411 </Row>
412 <Row>
413 <Col xs={12} sm={4}>
414 <FormGroup controlId="parentZipcode">
415 <Label required>Parent Zipcode</Label>
416 <FormControl
417 type="text"
418 value={props.getValue('parentZipcode')}
419 placeholder="600031"
420 onChange={e => props.setValue('parentZipcode', e.target.value)}
421 />
422 {props.isSubmitted() && props.errors && props.errors.parentZipcode && (
423 <ErrorLabel> {props.errors.parentZipcode} </ErrorLabel>
424 )}
425 </FormGroup>
426 </Col>
427 </Row>
428 </fieldset>
429 )}
430 <div style={{ textAlign: 'left' }}>
431 {props.currentStep > 0 && (
432 <div style={{ display: 'inline-block', marginRight: 10 }}>
433 <Button onClick={props.onBackClick}>
434 <i className="icon-arrow-left13 position-left"></i>
435 BACK
436 </Button>
437
438 </div>
439 )}
440 {props.currentStep < 3 && (
441 <div style={{ display: 'inline-block' }}>
442 <Button
443 bsStyle="primary"
444 onClick={props.onNextClick}
445 >
446 NEXT
447 <i className="icon-arrow-right14 position-right" />
448 </Button>
449 </div>
450 )}
451 {props.currentStep === 3 && (
452 <div style={{ display: 'inline-block' }}>
453 <Button
454 bsStyle="primary"
455 onClick={props.onNextClick}
456 >
457 SAVE
458 <i className="fa fa-check" />
459 </Button>
460 </div>
461 )}
462 </div>
463 </div>
464 )
465
466 StudentForm.propTypes = {
467 currentStep: PropTypes.number.isRequired,
468 onNextClick: PropTypes.func.isRequired,
469 onBackClick: PropTypes.func.isRequired,
470 setValue: PropTypes.func.isRequired,
471 getValue: PropTypes.func.isRequired,
472 }
473
474 export default StudentForm
475 1 import React, { PropTypes } from 'react'
imports/client/views/org/admin/settings/students/add/addStudent.js
1 import _ from 'lodash'; File was deleted
2 import { Meteor } from 'meteor/meteor';
3 import React, { Component } from 'react';
4 import { Link,browserHistory } from 'react-router';
5 import { FormGroup,Panel,Table,
6 ButtonToolbar,Modal,
7 FormControl,Glyphicon,Button } from 'react-bootstrap';
8 import { AddStudentFormContainer } from './AddStudentFormContainer';
9
10 const style = {
11 margin: 12,
12 };
13 export class AddStudent extends Component {
14 constructor(props) {
15 super(props);
16 this.state = {
17 show: false
18 };
19 this.showModal = this.showModal.bind(this);
20 this.hideModal = this.hideModal.bind(this);
21 this.onUpdate = this.onUpdate.bind(this);
22 };
23
24 showModal() {
25 this.setState({show: true});
26 }
27
28 hideModal() {
29 this.setState({show: false});
30 }
31 onUpdate(key, value) {
32 this.setState({[key]: value});
33 };
34
35 render() {
36 return (
37 <ButtonToolbar>
38 <Button bsStyle="primary" onClick={this.showModal}>
39 Add Student
40 </Button>
41 <Modal
42 {...this.props}
43 show={this.state.show}
44 onHide={this.hideModal}
45 dialogClassName="custom-modal"
46 bsSize="large"
47 >
48 <Modal.Header closeButton>
49 <Modal.Title id="contained-modal-title-lg">Add Student</Modal.Title>
50 </Modal.Header>
51 <Modal.Body>
52 <AddStudentFormContainer
53 hideModal = {this.hideModal}
54 />
55 </Modal.Body>
56 {/*
57 <Modal.Footer>
58 <Button onClick={this.hideModal}>Close</Button>
59 </Modal.Footer>
60 */}
61 </Modal>
62 </ButtonToolbar>
63 );
64 };
65
66 };
67 1 import _ from 'lodash';
imports/client/views/org/admin/settings/students/add/addStudentForm.js
1 import _ from 'lodash'; File was deleted
2 import { Meteor } from 'meteor/meteor';
3
4 import React, { Component } from 'react';
5 import { Link,browserHistory } from 'react-router';
6 import { Form, FormGroup,InputGroup,
7 DropdownButton,MenuItem,ControlLabel,
8 SplitButton,
9 FormControl,Glyphicon,Button } from 'react-bootstrap';
10 import DatePicker from 'react-bootstrap-date-picker'
11 import {addStudentManually} from '/imports/collections/students/methods';
12
13 export class AddStudentForm extends Component {
14
15 constructor(props) {
16 super(props);
17 this.state = {
18 admissionId: "123",
19 firstName: "first",
20 lastName: "last",
21 middleName: "middle",
22 email: "deepak125.dk+21@gmail.com",
23 dob: "",
24 formattedDob: "",
25 gender: "male",
26 rollNo: "1",
27 class: "2",
28 section: "B",
29 community: "SC",
30 bloodGroup: "B+",
31 phone: "9876543321",
32 address: "address",
33 city: "chennai",
34 state: "tn",
35 parentName: "parentName",
36 parentEmail: "deepak125.dk+41@gmail.com",
37 relation: "father",
38 profession: "farmer",
39 parentGender: "male",
40 parentPhone: "987655412",
41 parentAddress: "parentAddress",
42 parentCity: "parentCity",
43 parentState: "parentState",
44 parentZipcode: "parentZipcode",
45 };
46 this.onUpdate = this.onUpdate.bind(this);
47 this.handleDob = this.handleDob.bind(this);
48 };
49
50 onUpdate(key, value) {
51 this.setState({[key]: value});
52 };
53
54 handleDob(value, formattedValue) {
55 this.setState({
56 dob: value, // ISO String, ex: "2016-11-19T12:00:00.000Z"
57 formattedDob: formattedValue // Formatted String, ex: "11/19/2016"
58 });
59 }
60 addStudent(e){
61 e.preventDefault();
62 e.persist();
63 const firstName = this.state.firstName;
64 const middleName = this.state.middleName;
65 const lastName = this.state.lastName;
66 const admissionId = this.state.admissionId;
67 const email = this.state.email;
68 const dob = this.state.dob;
69 const formattedDob = this.state.formattedDob;
70 const gender = this.state.gender;
71 const rollNo = this.state.rollNo;
72 const studentclass = this.state.class;
73 const section = this.state.section;
74 const community = this.state.community;
75 const bloodGroup = this.state.bloodGroup;
76 const phone = this.state.phone;
77 const address = this.state.address;
78 const city = this.state.city;
79 const state = this.state.state;
80 const parentName = this.state.parentName;
81 const parentEmail = this.state.parentEmail;
82 const relation = this.state.relation;
83 const profession = this.state.profession;
84 const parentGender = this.state.parentGender;
85 const parentPhone = this.state.parentPhone;
86 const parentAddress = this.state.parentAddress;
87 const parentCity = this.state.parentCity;
88 const parentState = this.state.parentState;
89 const parentZipcode = this.state.parentZipcode;
90 if(admissionId==""){
91 Bert.alert('Enter Admission Id!', 'danger');
92 }else if(firstName==""){
93 Bert.alert('Enter Fist Name', 'danger');
94 } else if(middleName==""){
95 Bert.alert('Enter Middle name!', 'danger');
96 }else if(lastName==""){
97 Bert.alert('Enter Last name!', 'danger');
98 }else if(email==""){
99 Bert.alert('Enter email!', 'danger');
100 }else if(dob==""){
101 Bert.alert('Enter DOB!', 'danger');
102 }else if(gender==""){
103 Bert.alert('Enter Student Gender!', 'danger');
104 }else if(studentclass==""){
105 Bert.alert('Enter Class!', 'danger');
106 }else if(section==""){
107 Bert.alert('Enter Section!', 'danger');
108 }else if(community==""){
109 Bert.alert('Enter Section!', 'danger');
110 }else if(bloodGroup==""){
111 Bert.alert('Enter Blood Group!', 'danger');
112 }else if(phone==""){
113 Bert.alert('Enter phone!', 'danger');
114 }else if(address==""){
115 Bert.alert('Enter address!', 'danger');
116 }else if(city==""){
117 Bert.alert('Enter city!', 'danger');
118 }else if(state==""){
119 Bert.alert('Enter state!', 'danger');
120 }else if(parentName==""){
121 Bert.alert('Enter Parent name!', 'danger');
122 }else if(parentEmail==""){
123 Bert.alert('Enter Parent Email!', 'danger');
124 }else if(relation==""){
125 Bert.alert('Enter relation!', 'danger');
126 }else if(profession==""){
127 Bert.alert('Enter parent profession!', 'danger');
128 }else if(parentGender==""){
129 Bert.alert("Enter Parent's Gender!", 'danger');
130 }else if(parentPhone==""){
131 Bert.alert("Enter Parent's Phone!", 'danger');
132 }else if(parentAddress==""){
133 Bert.alert("Enter Parent's Address!", 'danger');
134 }else if(parentCity==""){
135 Bert.alert("Enter Parent's City!", 'danger');
136 }else if(parentState==""){
137 Bert.alert("Enter Parent's State!", 'danger');
138 }else if(parentZipcode==""){
139 Bert.alert("Enter Parent's zipcode!", 'danger');
140 }else{
141 addStudentManually.call({
142 admissionId,
143 firstName,
144 middleName,
145 lastName,
146 email,
147 dob,
148 formattedDob,
149 gender,
150 rollNo,
151 studentclass,
152 section,
153 community,
154 bloodGroup,
155 phone,
156 address,
157 city,
158 state,
159 parentName,
160 parentEmail,
161 relation,
162 profession,
163 parentGender,
164 parentPhone,
165 parentAddress,
166 parentCity,
167 parentState,
168 parentZipcode
169 }, function (error, result) {
170 console.log(error);
171 console.log(result);
172 });
173 }
174 }
175 render() {
176 return (
177 <Form className="steps-validation wizard clearfix" onSubmit={ (e) => this.addStudent(e) } inline>
178 <div className="steps clearfix">
179 <ul role="tablist">
180 <li role="tab" className="first current" aria-disabled="false" aria-selected="true">
181 <a id="steps-uid-4-t-0" href="#steps-uid-4-h-0" aria-controls="steps-uid-4-p-0">
182 <span className="current-info audible">current step: </span><span className="number">1</span> Personal data
183 </a>
184 </li>
185 <li role="tab" className="disabled" aria-disabled="true">
186 <a id="steps-uid-4-t-1" href="#steps-uid-4-h-1" aria-controls="steps-uid-4-p-1">
187 <span className="number">2</span> Your education\n\
188 </a>
189 </li>
190 <li role="tab" className="disabled" aria-disabled="true">
191 <a id="steps-uid-4-t-2" href="#steps-uid-4-h-2" aria-controls="steps-uid-4-p-2">
192 <span className="number">3</span> Your experience
193 </a>
194 </li>
195 <li role="tab" className="disabled last" aria-disabled="true">
196 <a id="steps-uid-4-t-3" href="#steps-uid-4-h-3" aria-controls="steps-uid-4-p-3">
197 <span className="number">4</span> Additional info
198 </a>
199 </li>
200 </ul>
201 </div>
202 <div className="content clearfix">
203 <h6 id="steps-uid-4-h-0" tabindex="-1" className="title current">Personal data</h6>
204 <div id="steps-uid-4-p-0" role="tabpanel" aria-labelledby="steps-uid-4-h-0" className="body current">
205 <div className="row">
206 <div className="col-md-6">
207
208 <FormGroup controlId="admissionId">
209 <ControlLabel>Admission Id</ControlLabel>
210 <FormControl
211 type="text"
212 value={this.state.admissionId}
213 placeholder="admission Id"
214 onChange={e=>this.onUpdate('admissionId',e.target.value)}
215 />
216 </FormGroup>
217
218 </div>
219
220 <div className="col-md-6">
221
222 <FormGroup controlId="firstName">
223 <ControlLabel>First Name</ControlLabel>
224 <FormControl
225 type="text"
226 value={this.state.firstName}
227 placeholder="First Name"
228 onChange={e=>this.onUpdate('firstName',e.target.value)}
229 />
230 </FormGroup>
231
232 </div>
233 </div>
234 </div>
235 </div>
236
237
238 <FormGroup controlId="admissionId">
239 <ControlLabel>Admission Id</ControlLabel>
240 <FormControl
241 type="text"
242 value={this.state.admissionId}
243 placeholder="admission Id"
244 onChange={e=>this.onUpdate('admissionId',e.target.value)}
245 />
246 </FormGroup>
247
248 <FormGroup controlId="firstName">
249 <ControlLabel>First Name</ControlLabel>
250 <FormControl
251 type="text"
252 value={this.state.firstName}
253 placeholder="First Name"
254 onChange={e=>this.onUpdate('firstName',e.target.value)}
255 />
256 </FormGroup>
257 <FormGroup controlId="middleName">
258 <ControlLabel>Middle Name</ControlLabel>
259 <FormControl
260 type="text"
261 value={this.state.middleName}
262 placeholder="Middle Name"
263 onChange={e=>this.onUpdate('middleName',e.target.value)}
264 />
265 </FormGroup>
266
267 <FormGroup controlId="lastName">
268 <ControlLabel>Last Name</ControlLabel>
269 <FormControl
270 type="text"
271 value={this.state.lastName}
272 placeholder="Last Name"
273 onChange={e=>this.onUpdate('lastName',e.target.value)}
274 />
275
276 </FormGroup>
277 <FormGroup controlId="email">
278 <ControlLabel>Email</ControlLabel>
279 <FormControl
280 type="email"
281 value={this.state.email}
282 placeholder="Email"
283 onChange={e=>this.onUpdate('email',e.target.value)}
284 />
285 </FormGroup>
286 <FormGroup>
287 <ControlLabel>Date of birth</ControlLabel>
288 <DatePicker id="dob"
289 value={this.state.dob}
290 onChange={this.handleDob}
291 />
292 </FormGroup>
293
294 <FormGroup controlId="formControlsSelect">
295 <ControlLabel>Gender</ControlLabel>
296 <FormControl componentClass="select"
297 placeholder="select"
298 value={this.state.gender}
299 onChange={e=>this.onUpdate('gender',e.target.value)}
300 >
301 <option value="male">Male</option>
302 <option value="female">Female</option>
303 </FormControl>
304 </FormGroup>
305
306 <FormGroup controlId="rollNo">
307 <ControlLabel>Roll No</ControlLabel>
308 <FormControl
309 type="text"
310 value={this.state.rollNo}
311 placeholder="Roll No"
312 onChange={e=>this.onUpdate('rollNo',e.target.value)}
313 />
314 </FormGroup>
315 <FormGroup controlId="class">
316 <ControlLabel>Class</ControlLabel>
317 <FormControl
318 type="text"
319 value={this.state.class}
320 placeholder="7"
321 onChange={e=>this.onUpdate('class',e.target.value)}
322 />
323 </FormGroup>
324 <FormGroup controlId="section">
325 <ControlLabel>Section</ControlLabel>
326 <FormControl
327 type="text"
328 value={this.state.section}
329 placeholder="B"
330 onChange={e=>this.onUpdate('section',e.target.value)}
331 />
332 </FormGroup>
333
334 <FormGroup controlId="community">
335 <ControlLabel>Community</ControlLabel>
336 <FormControl
337 type="text"
338 value={this.state.community}
339 placeholder="General"
340 onChange={e=>this.onUpdate('community',e.target.value)}
341 />
342 </FormGroup>
343
344 <FormGroup controlId="bloodGroup">
345 <ControlLabel>bloodGroup</ControlLabel>
346 <FormControl
347 type="text"
348 value={this.state.bloodGroup}
349 placeholder="B+"
350 onChange={e=>this.onUpdate('bloodGroup',e.target.value)}
351 />
352 </FormGroup>
353
354 <FormGroup controlId="phone">
355 <ControlLabel>Phone</ControlLabel>
356 <FormControl
357 type="text"
358 value={this.state.phone}
359 placeholder="9999999999"
360 onChange={e=>this.onUpdate('phone',e.target.value)}
361 />
362 </FormGroup>
363
364 <FormGroup controlId="address">
365 <ControlLabel>Address</ControlLabel>
366 <FormControl
367 type="text"
368 value={this.state.address}
369 placeholder="#876, Street, town"
370 onChange={e=>this.onUpdate('address',e.target.value)}
371 />
372 </FormGroup>
373
374 <FormGroup controlId="city">
375 <ControlLabel>City</ControlLabel>
376 <FormControl
377 type="text"
378 value={this.state.city}
379 placeholder="Chennai"
380 onChange={e=>this.onUpdate('city',e.target.value)}
381 />
382 </FormGroup>
383
384 <FormGroup controlId="state">
385 <ControlLabel>State</ControlLabel>
386 <FormControl
387 type="text"
388 value={this.state.state}
389 placeholder="Tamilnadu"
390 onChange={e=>this.onUpdate('state',e.target.value)}
391 />
392 </FormGroup>
393
394 <FormGroup controlId="parentName">
395 <ControlLabel>Parent Name</ControlLabel>
396 <FormControl
397 type="text"
398 value={this.state.parentName}
399 placeholder="John"
400 onChange={e=>this.onUpdate('parentName',e.target.value)}
401 />
402 </FormGroup>
403
404 <FormGroup controlId="parentEmail">
405 <ControlLabel>Parent Email</ControlLabel>
406 <FormControl
407 type="text"
408 value={this.state.parentEmail}
409 placeholder="john@email.com"
410 onChange={e=>this.onUpdate('parentEmail',e.target.value)}
411 />
412 </FormGroup>
413
414 <FormGroup controlId="relation">
415 <ControlLabel>Relation</ControlLabel>
416 <FormControl
417 type="text"
418 value={this.state.relation}
419 placeholder="Father"
420 onChange={e=>this.onUpdate('relation',e.target.value)}
421 />
422 </FormGroup>
423
424 <FormGroup controlId="profession">
425 <ControlLabel>Profession</ControlLabel>
426 <FormControl
427 type="text"
428 value={this.state.profession}
429 placeholder="Farmer"
430 onChange={e=>this.onUpdate('profession',e.target.value)}
431 />
432 </FormGroup>
433
434 <FormGroup controlId="parentGender">
435 <ControlLabel>Parent Gender</ControlLabel>
436 <FormControl componentClass="select"
437 placeholder="select"
438 value={this.state.parentGender}
439 onChange={e=>this.onUpdate('parentGender',e.target.value)}
440 >
441 <option value="male">Male</option>
442 <option value="female">Female</option>
443 </FormControl>
444 </FormGroup>
445
446 <FormGroup controlId="parentPhone">
447 <ControlLabel>Parent Phone</ControlLabel>
448 <FormControl
449 type="text"
450 value={this.state.parentPhone}
451 placeholder="9876543210"
452 onChange={e=>this.onUpdate('parentPhone',e.target.value)}
453 />
454 </FormGroup>
455
456 <FormGroup controlId="parentAddress">
457 <ControlLabel>Parent Address</ControlLabel>
458 <FormControl
459 type="text"
460 value={this.state.parentAddress}
461 placeholder="#12, street, town"
462 onChange={e=>this.onUpdate('parentAddress',e.target.value)}
463 />
464 </FormGroup>
465
466 <FormGroup controlId="parentCity">
467 <ControlLabel>Parent City</ControlLabel>
468 <FormControl
469 type="text"
470 value={this.state.parentCity}
471 placeholder="Chennai"
472 onChange={e=>this.onUpdate('parentCity',e.target.value)}
473 />
474 </FormGroup>
475
476 <FormGroup controlId="parentState">
477 <ControlLabel>Parent State</ControlLabel>
478 <FormControl
479 type="text"
480 value={this.state.parentState}
481 placeholder="Tamilnadu"
482 onChange={e=>this.onUpdate('parentState',e.target.value)}
483 />
484 </FormGroup>
485
486 <FormGroup controlId="parentZipcode">
487 <ControlLabel>Parent Zipcode</ControlLabel>
488 <FormControl
489 type="text"
490 value={this.state.parentZipcode}
491 placeholder="600031"
492 onChange={e=>this.onUpdate('parentZipcode',e.target.value)}
493 />
494 </FormGroup>
495 <Button type="submit" bsStyle="default">Add Student</Button>
496 </Form>
497 );
498 };
499
500 };
501 1 import _ from 'lodash';
imports/client/views/org/admin/settings/students/index.js
1 // import { StudentDataController } from '/imports/client/views/org/admin/students/index' File was deleted
2 import _ from 'lodash';
3 import {
4 composeWithTracker,
5 compose,
6 composeAll
7 } from 'react-komposer';
8 import { Loading } from '/imports/client/components/Loading';
9
10 import { Orgs } from '/imports/collections/orgs/index';
11 import { Users } from '/imports/collections/users/index';
12 import { StudentView } from './StudentView';
13 import { Students } from '/imports/collections/students/index';
14
15
16 const meteorTick = (props, onData) => {
17 Shelf.layout.set({
18 bulb: 'SETTINGS',
19 subbulb: 'USERS',
20 view: 'STUDENTS'
21 });
22 const handles = [
23 Meteor.subscribe('users.current'),
24 Meteor.subscribe('orgs.current'),
25 Meteor.subscribe('users.forMyOrg'),
26 Meteor.subscribe('student.forMyOrg'),
27 ];
28
29 if(_.every(handles, (handle) => (handle.ready()) )) {
30 const user = Users.current();
31 const org = Orgs.current();
32 students = Users.find({"role":"STUDENT"}).fetch() ? Users.find({"role":"STUDENT"}).fetch() : "";
33 studentData = Students.find().fetch() ? Students.find().fetch() : "";
34 for(var i=0; i< studentData.length; i++){
35 for(var j=0; j< students.length; j++){
36 if(studentData[i].userId == students[j]._id && studentData[i].admissionId){
37 studentData[i].firstName = students[j].firstName;
38 studentData[i].lastName = students[j].lastName;
39 }else{
40
41 }
42 }
43 }
44 onData(null, {
45 data: {
46 user: user,
47 org: org,
48 studentData: studentData
49 },
50 });
51 }
52
53 return () => {
54 _.each(handles, (handle) => handle.stop() );
55 };
56 };
57
58
59 const reduxTick = (props, onData) => {
60 onData(null, {
61 data: {}
62 });
63 };
64
65
66 export const StudentDataController = composeAll(
67 composeWithTracker(meteorTick, Loading),
68 compose(reduxTick, Loading),
69 )(StudentView);
70 1 // import { StudentDataController } from '/imports/client/views/org/admin/students/index'
imports/client/views/org/admin/settings/students/student.css
1 .btn-toolbar { File was deleted
2 display: inline-block;
3 font-size: 0;
4 margin-right: 12px;
5 }
6 1 .btn-toolbar {
imports/client/views/org/admin/settings/students/view/StudentRow.js
1 import _ from 'lodash'; File was deleted
2 import { Meteor } from 'meteor/meteor';
3
4 import React, { Component } from 'react';
5 import { Link,browserHistory } from 'react-router';
6 import { FormGroup,
7 FormControl,Glyphicon,Button } from 'react-bootstrap';
8
9
10 export class StudentRow extends Component {
11
12 constructor(props) {
13 super(props);
14 this.state = {
15 editOpen: false,
16 };
17 this.onUpdate = this.onUpdate.bind(this);
18 this.toggleEditOpen = this.toggleEditOpen.bind(this);
19 this.deleteStudent = this.deleteStudent.bind(this);
20 };
21
22 onUpdate(key, value) {
23 this.setState({[key]: value});
24 };
25 toggleEditOpen(){
26 this.setState({
27 editOpen : !this.state.editOpen
28 })
29 }
30 deleteStudent(){
31 console.log("Delete");
32 console.log(this.props.student._id);
33 }
34 render() {
35 const {student} = this.props;
36 if(student.firstName){
37 return (
38 <tr>
39 <td>{student.firstName}</td>
40 <td>{student.lastName}</td>
41 <td>{student.class}</td>
42 <td>{student.dob? moment(student.dob).format("LL") : <span></span>}</td>
43 <td><span className="label label-success">Active</span></td>
44 <td className="text-center">
45 <ul className="icons-list">
46 <li className={this.state.editOpen? "dropdown open": "dropdown" }>
47 <span className="dropdown-toggle" onClick={this.toggleEditOpen}>
48 <i className="icon-menu9"></i>
49 </span>
50 <ul className="dropdown-menu dropdown-menu-right">
51 <li onClick={this.viewStudent}><Link to={`/student/${student._id}`}><span><i className="fa fa-binoculars"></i>View </span></Link></li>
52 <li onClick={this.editStudent}><span><i className="fa fa-pencil-square"></i> Edit </span></li>
53 <li onClick={this.deleteStudent}><span><i className="fa fa-exclamation-triangle"></i> Delete</span></li>
54 </ul>
55 </li>
56 </ul>
57 </td>
58 </tr>
59 );
60 }else {
61 return null;
62 }
63
64 };
65
66 };
67 1 import _ from 'lodash';
imports/client/views/org/admin/settings/students/view/StudentTable.js
1 import _ from 'lodash'; File was deleted
2 import { Meteor } from 'meteor/meteor';
3
4 import React, { Component } from 'react';
5 import { Link,browserHistory } from 'react-router';
6 import { FormGroup,Panel,Table,
7 ButtonToolbar,Modal,
8 FormControl,Glyphicon,Button, } from 'react-bootstrap';
9 import {moment} from 'meteor/momentjs:moment'
10 import {StudentRow} from './StudentRow'
11 import {BootstrapTable, TableHeaderColumn}from 'react-bootstrap-table';
12
13 const options = {
14 page: 0, // which page you want to show as default
15 sizePerPageList: [ {
16 text: '5', value: 5
17 }, {
18 text: '10', value: 10
19 }], // you can change the dropdown list for size per page
20 sizePerPage: 5, // which size per page you want to locate as default
21 pageStartIndex: 0, // where to start counting the pages
22 paginationSize: 3, // the pagination bar size.
23 prePage: 'Prev', // Previous page button text
24 nextPage: 'Next', // Next page button text
25 firstPage: 'First', // First page button text
26 lastPage: 'Last', // Last page button text
27 paginationShowsTotal: false, // Accept bool or function
28 paginationPosition: 'bottom' // default is bottom, top and both is all available
29 // hideSizePerPage: true > You can hide the dropdown for sizePerPage
30 // alwaysShowAllBtns: true // Always show next and previous button
31 // withFirstAndLast: false > Hide the going to First and Last page button
32 };
33
34 function dateFormatter(cell, row) {
35 if(cell){
36 cell = new Date(cell);
37 return `${('0' + cell.getDate()).slice(-2)}/${('0' + (cell.getMonth() + 1)).slice(-2)}/${cell.getFullYear()}`;
38 }
39 }
40 export class StudentTable extends Component {
41
42 constructor(props) {
43 super(props);
44 this.state = {
45 show: false,
46 panleOpen: true,
47 };
48 this.onUpdate = this.onUpdate.bind(this);
49 this.togglePanel = this.togglePanel.bind(this);
50 };
51 onUpdate(key, value) {
52 this.setState({[key]: value});
53 };
54 togglePanel(){
55 this.setState({panleOpen: !this.state.panleOpen});
56 }
57
58 render() {
59 studentData = this.props.studentData;
60 console.log("this.props.studentData");
61 console.log(this.props.studentData);
62 return (
63 <div className="panel panel-flat">
64 <div className="panel-heading">
65 <h5 className="panel-title">Student Details</h5>
66 <div className="heading-elements">
67 <ul className="icons-list">
68 <li onClick={this.togglePanel}><a data-action="collapse" className={this.state.panleOpen?"rotate-180":null}></a></li>
69 </ul>
70 </div>
71 </div>
72 <Panel collapsible expanded={this.state.panleOpen}>
73 <BootstrapTable data={ studentData } pagination={ true } options={ options } >
74 <TableHeaderColumn dataField='_id' isKey={ true } dataSort={ true } filter={ { type: 'TextFilter' } }>Admission Id</TableHeaderColumn>
75 <TableHeaderColumn dataField='firstName' dataSort={ true } filter={ { type: 'TextFilter' } }>First Name</TableHeaderColumn>
76 <TableHeaderColumn dataField='lastName' dataSort={ true } filter={ { type: 'TextFilter' } }>Last Name</TableHeaderColumn>
77 <TableHeaderColumn dataField='class' dataSort={ true } filter={ { type: 'TextFilter' } }>Class</TableHeaderColumn>
78 <TableHeaderColumn dataField='dob' dataFormat={ dateFormatter } >DOB</TableHeaderColumn>
79 </BootstrapTable>
80 </Panel>
81 </div>
82 );
83 };
84
85 };
86 1 import _ from 'lodash';
imports/client/views/org/admin/users/list/AdminUsersList.js
File was created 1 import _ from 'lodash';
2 import { Meteor } from 'meteor/meteor';
3 import React, { Component } from 'react';
4 import { Link } from 'react-router';
5 import { Avatar } from '/imports/client/components/Avatar';
6 import { Icon } from '/imports/client/components/Icon';
7 import classNames from 'classnames';
8 import { EnterModule } from '/imports/client/views/org/enter/module/index';
9 // import { VerifyModule } from '/imports/client/views/verify/module/index';
10 import { Navbar,Modal, Nav, NavItem,
11 Glyphicon, Collapse,
12 NavbarToggler, NavbarBrand,
13 NavLink, DropdownItem, DropdownToggle, DropdownMenu,
14 NavDropdown, MenuItem, Breadcrumb } from 'react-bootstrap';
15 import { VerifyModule } from '/imports/client/views/verify/module/index'
16
17 var Accordion = require('react-bootstrap').Accordion;
18 var Panel = require('react-bootstrap').Panel;
19 export class AdminUsersList extends Component {
20 render() {
21 return (
22 <div className="row">
23 <div className="col-lg-3 col-md-6">
24 <div className="thumbnail">
25 <Link to="/students" >
26 <div className="thumb thumb-rounded">
27 <img src="assets/images/download2.png" alt="" />
28 </div>
29 <div className="caption text-center">
30 <h6 className="text-semibold no-margin">Students <small className="display-block">Click to view</small></h6>
31 </div>
32 </Link>
33 </div>
34 </div>
35 <div className="col-lg-3 col-md-6">
36 <div className="thumbnail">
37 <Link to="/staff" >
38 <div className="thumb thumb-rounded">
39 <img src="assets/images/download3.png" alt=""/>
40 </div>
41 <div className="caption text-center">
42 <h6 className="text-semibold no-margin">Teachers <small className="display-block">Click to view</small></h6>
43 </div>
44 </Link>
45 </div>
46 </div>
47 <div className="col-lg-3 col-md-6">
48 <div className="thumbnail">
49 <Link to="/parents" >
50 <div className="thumb thumb-rounded">
51 <img src="assets/images/download3.png" alt=""/>
52 </div>
53 <div className="caption text-center">
54 <h6 className="text-semibold no-margin">Parents <small className="display-block">Click to view</small></h6>
55 </div>
56 </Link>
57 </div>
58 </div>
59 </div>
60 );
61 };
62
63 };
64
imports/client/views/org/admin/users/list/index.js
File was created 1 // import { MailModule } from '/imports/client/views/org/admin/mailbox/module/index'
2 import {
3 composeWithTracker,
4 compose,
5 composeAll
6 } from 'react-komposer';
7 import { AdminUsersList } from './AdminUsersList';
8 import { Loading } from '/imports/client/components/Loading';
9
10 import { Users } from '/imports/collections/users/index';
11 import { Orgs } from '/imports/collections/orgs/index';
12
13
14 const meteorTick = (props, onData) => {
15
16 const handles = [
17 Meteor.subscribe('users.current'),
18 Meteor.subscribe('orgs.current'),
19 ];
20
21 const user = Users.current();
22
23 if(_.every(handles, (handle) => (handle.ready()) ) && user) {
24 onData(null, {
25 layout: Shelf.layout.get(),
26 data: {
27 companyId: props.params.companyId,
28 user: Users.current(),
29 org: Orgs.current(),
30 },
31 });
32 }
33
34 return () => {
35 _.each(handles, (handle) => handle.stop() );
36 };
37 };
38
39
40 const reduxTick = (props, onData) => {
41 onData(null, {
42 data: {}
43 });
44 };
45
46
47 export const AdminUsersListController = composeAll(
48 composeWithTracker(meteorTick, Loading),
49 compose(reduxTick, Loading),
50 )(AdminUsersList);
51
imports/client/views/org/admin/users/module/AdminUserViewLayout.js
File was created 1 import _ from 'lodash';
2 import { Meteor } from 'meteor/meteor';
3
4 import React, { Component } from 'react';
5 import { Link } from 'react-router';
6 import classNames from 'classnames';
7 import { Users } from '/imports/collections/users/index';
8 import { If, Case } from '/imports/client/components/Logic';
9 import {Header} from './Header'
10
11
12 export class AdminUserViewLayout extends Component {
13
14 renderMenuItem(bulb, label, path, auth) {
15 const user = Users.current();
16 return (
17 <If
18 if = {(user.getRole() == "SECRETARY") || auth.indexOf(user.getRole()) !== -1 || auth[0] == "ALL"}
19 then = {() => (
20 <Link
21 to = {path}
22 className = {classNames(
23 "tabsLayout-menuItem",
24 (bulb === this.props.layout.subbulb) && 'active'
25 )}
26 >
27 {label}
28 </Link>
29 )}
30 />
31 );
32 };
33
34 renderSeparator() {
35 return <div className = "tabsLayout-menuSeparator"/>;
36 };
37
38 render() {
39 const user = this.props.data.user;
40 return (
41 <div className = "tabsLayout-box">
42 <Header />
43 <div className = "tabsLayout-content">
44 { this.props.children }
45 </div>
46 </div>
47 );
48 };
49
50 };
51
imports/client/views/org/admin/users/module/Header.js
File was created 1 import _ from 'lodash';
2 import { Meteor } from 'meteor/meteor';
3
4 import React, { Component } from 'react';
5 import { Link,browserHistory } from 'react-router';
6 import { FormGroup,
7 FormControl,Glyphicon,Button } from 'react-bootstrap';
8 import './header.css';
9
10
11 export class Header extends Component {
12
13 constructor(props) {
14 super(props);
15 this.state = {
16
17 };
18 this.onUpdate = this.onUpdate.bind(this);
19 };
20
21 onUpdate(key, value) {
22 this.setState({[key]: value});
23 };
24
25 render() {
26 return (
27 <div className = "enterPane-box">
28 <div className="row">
29
30 <div className="col-lg-4 col-md-8">
31 <Link to="/students" >
32 <div className="panel panel-body">
33 <div className="media">
34 <div className="media-left">
35 <img src="assets/images/download2.png" className="img-circle" alt=""/>
36 </div>
37
38 <div className="media-body">
39 <h6 className="media-heading">Students</h6>
40 <p className="text-muted">Click to view</p>
41 </div>
42 </div>
43 </div>
44 </Link>
45 </div>
46 <div className="col-lg-4 col-md-8">
47 <Link to="/staff" >
48 <div className="panel panel-body">
49 <div className="media">
50 <div className="media-left">
51 <img src="assets/images/download.png" className="img-circle" alt=""/>
52 </div>
53
54 <div className="media-body">
55 <h6 className="media-heading">Teachers</h6>
56 <p className="text-muted">Click to view</p>
57 </div>
58 </div>
59 </div>
60 </Link>
61 </div>
62
63 <div className="col-lg-4 col-md-8">
64 <Link to="/parents" >
65 <div className="panel panel-body">
66 <div className="media">
67 <div className="media-left">
68 <img src="assets/images/download3.png" className="img-circle" alt=""/>
69 </div>
70
71 <div className="media-body">
72 <h6 className="media-heading">Parents</h6>
73 <p className="text-muted">Click to view</p>
74 </div>
75 </div>
76 </div>
77 </Link>
78 </div>
79
80 </div>
81 </div>
82 );
83 };
84
85 };
86
imports/client/views/org/admin/users/module/header.css
File was created 1 .img-circle
2 {
3 width: 70px;
4 height: 70px;
5 }
6
7 .panel-body
8 {
9 overflow-y:hidden;
10 }
11
imports/client/views/org/admin/users/module/index.js
File was created 1 // import { MailModule } from '/imports/client/views/org/admin/mailbox/module/index'
2 import {
3 composeWithTracker,
4 compose,
5 composeAll
6 } from 'react-komposer';
7 import { AdminUserViewLayout } from './AdminUserViewLayout';
8 import { Loading } from '/imports/client/components/Loading';
9
10 import { Users } from '/imports/collections/users/index';
11 import { Orgs } from '/imports/collections/orgs/index';
12
13
14 const meteorTick = (props, onData) => {
15
16 const handles = [
17 Meteor.subscribe('users.current'),
18 Meteor.subscribe('orgs.current'),
19 ];
20
21 const user = Users.current();
22
23 if(_.every(handles, (handle) => (handle.ready()) ) && user) {
24 onData(null, {
25 layout: Shelf.layout.get(),
26 data: {
27 companyId: props.params.companyId,
28 user: Users.current(),
29 org: Orgs.current(),
30 },
31 });
32 }
33
34 return () => {
35 _.each(handles, (handle) => handle.stop() );
36 };
37 };
38
39
40 const reduxTick = (props, onData) => {
41 onData(null, {
42 data: {}
43 });
44 };
45
46
47 export const AdminUsersModule = composeAll(
48 composeWithTracker(meteorTick, Loading),
49 compose(reduxTick, Loading),
50 )(AdminUserViewLayout);
51
imports/client/views/org/admin/users/parents/index.js
File was created 1 import _ from 'lodash';
2 import {
3 composeWithTracker,
4 compose,
5 composeAll
6 } from 'react-komposer';
7 import { Loading } from '/imports/client/components/Loading';
8
9 import { Orgs } from '/imports/collections/orgs/index';
10 import { Users } from '/imports/collections/users/index';
11 import { Parents } from '/imports/collections/parents/index';
12 import { ParentsView } from './parentsview';
13
14
15
16 const meteorTick = (props, onData) => {
17 Shelf.layout.set({
18 bulb: 'SETTINGS',
19 subbulb: 'USERS',
20 view: 'PARENTS'
21 });
22 const handles = [
23 Meteor.subscribe('users.current'),
24 Meteor.subscribe('orgs.current'),
25 Meteor.subscribe('users.forMyOrg'),
26 Meteor.subscribe('parent.forMyOrg'),
27 ];
28
29 if(_.every(handles, (handle) => (handle.ready()) )) {
30 const user = Users.current();
31 const org = Orgs.current();
32 console.log("parents");
33 parent = Users.find({"role":"PARENT"}).fetch() ? Users.find({"role":"PARENT"}).fetch() : "";
34 console.log(Users.find({"role":"PARENT"}).fetch());
35 parentData = Parents.find().fetch() ? Parents.find().fetch() : "";
36 console.log("parentData");
37 console.log(parentData);
38 for(var i=0; i< parent.length; i++){
39 for(var j=0; j< parentData.length; j++){
40 if(parent[i]._id == parentData[j].userId){
41 parent[i].relationship = parentData[j].relationship;
42 parent[i].profession = parentData[j].profession;
43 parent[i].relationship = parentData[j].relationship;
44 }
45 }
46 }
47 onData(null, {
48 data: {
49 user: user,
50 org: org,
51 parent: parent
52 },
53 });
54 }
55
56 return () => {
57 _.each(handles, (handle) => handle.stop() );
58 };
59 };
60
61
62 const reduxTick = (props, onData) => {
63 onData(null, {
64 data: {}
65 });
66 };
67
68
69 export const ParentViewController = composeAll(
70 composeWithTracker(meteorTick, Loading),
71 compose(reduxTick, Loading),
72 )(ParentsView);
73
imports/client/views/org/admin/users/parents/parentsview.js
File was created 1 import _ from 'lodash';
2 import { Meteor } from 'meteor/meteor';
3
4 import React, { Component } from 'react';
5 import { Link,browserHistory } from 'react-router';
6 import { FormGroup,
7 FormControl,Glyphicon,Button } from 'react-bootstrap';
8 import { ParentTable } from './view/ParentTable'
9
10
11 export class ParentsView extends Component {
12
13 constructor(props) {
14 super(props);
15 this.state = {
16
17 };
18 this.onUpdate = this.onUpdate.bind(this);
19 };
20
21 onUpdate(key, value) {
22 this.setState({[key]: value});
23 };
24 togglePanel(){
25 this.setState({panleOpen: !this.state.panleOpen});
26 }
27
28 render() {
29 const {user, org, parent} = this.props.data;
30 return (
31 <div className="container-detached">
32 <ParentTable
33 data = {this.props.data}
34 parent = {parent}
35 />
36 {/* <AddStaff/>
37 <UploadCsvStaff /> */}
38 </div>
39 );
40 };
41
42
43 };
44
imports/client/views/org/admin/users/parents/view/ParentRow.js
File was created 1 import _ from 'lodash';
2 import { Meteor } from 'meteor/meteor';
3
4 import React, { Component } from 'react';
5 import { Link,browserHistory } from 'react-router';
6 import { FormGroup,
7 FormControl,Glyphicon,Button } from 'react-bootstrap';
8
9
10 export class ParentRow extends Component {
11
12 constructor(props) {
13 super(props);
14 this.state = {
15
16 };
17 this.onUpdate = this.onUpdate.bind(this);
18 };
19
20 onUpdate(key, value) {
21 this.setState({[key]: value});
22 };
23
24 render() {
25 const {parent} = this.props;
26 if(parent.firstName){
27 return (
28 <tr>
29 <td>{parent.firstName}</td>
30 <td>{parent.relationship}</td> {/* relationship doesnt reflect here */}
31 <td><span className="label label-success">Active</span></td>
32 <td className="text-center">
33 <ul className="icons-list">
34 <li className="dropdown">
35 <a href="#" className="dropdown-toggle" data-toggle="dropdown">
36 <i className="icon-menu9"></i>
37 </a>
38 <ul className="dropdown-menu dropdown-menu-right">
39 <li><a href="#"><i className="icon-file-pdf"></i> Export to .pdf</a></li>
40 <li><a href="#"><i className="icon-file-excel"></i> Export to .csv</a></li>
41 <li><a href="#"><i className="icon-file-word"></i> Export to .doc</a></li>
42 </ul>
43 </li>
44 </ul>
45 </td>
46 </tr>
47 );
48 }else {
49 return null;
50 }
51
52 };
53
54 };
55
imports/client/views/org/admin/users/parents/view/ParentTable.js
File was created 1 import _ from 'lodash';
2 import { Meteor } from 'meteor/meteor';
3
4 import React, { Component } from 'react';
5 import { Link,browserHistory } from 'react-router';
6 import { FormGroup,Panel,Table,
7 ButtonToolbar,Modal,
8 FormControl,Glyphicon,Button } from 'react-bootstrap';
9 import {moment} from 'meteor/momentjs:moment'
10 import {ParentRow} from './ParentRow'
11 import {BootstrapTable, TableHeaderColumn}from 'react-bootstrap-table';
12 const options = {
13 page: 0, // which page you want to show as default
14 sizePerPageList: [ {
15 text: '5', value: 5
16 }, {
17 text: '10', value: 10
18 }], // you can change the dropdown list for size per page
19 sizePerPage: 5, // which size per page you want to locate as default
20 pageStartIndex: 0, // where to start counting the pages
21 paginationSize: 3, // the pagination bar size.
22 prePage: 'Prev', // Previous page button text
23 nextPage: 'Next', // Next page button text
24 firstPage: 'First', // First page button text
25 lastPage: 'Last', // Last page button text
26 paginationShowsTotal: false, // Accept bool or function
27 paginationPosition: 'bottom' // default is bottom, top and both is all available
28 // hideSizePerPage: true > You can hide the dropdown for sizePerPage
29 // alwaysShowAllBtns: true // Always show next and previous button
30 // withFirstAndLast: false > Hide the going to First and Last page button
31 };
32
33 export class ParentTable extends Component {
34
35 constructor(props) {
36 super(props);
37 this.state = {
38 show: false,
39 panleOpen: true,
40 };
41 this.onUpdate = this.onUpdate.bind(this);
42 };
43 onUpdate(key, value) {
44 this.setState({[key]: value});
45 };
46
47 render() {
48 return (
49 <div className="panel panel-flat">
50 <div className="panel-heading">
51 <h5 className="panel-title">Parent Details</h5>
52 <div className="heading-elements">
53 <ul className="icons-list">
54 <li onClick={this.togglePanel}><a data-action="collapse" className={this.state.panleOpen?"rotate-180":null}></a></li>
55 </ul>
56 </div>
57 </div>
58 <Panel collapsible expanded={this.state.panleOpen}>
59 <BootstrapTable data={ this.props.parent } pagination={ true } options={ options } >
60 <TableHeaderColumn dataField='srno' isKey={ true } dataSort={ true } filter={ { type: 'TextFilter' } }>Sr No</TableHeaderColumn>
61 <TableHeaderColumn dataField='firstName' dataSort={ true } filter={ { type: 'TextFilter' } }>Name</TableHeaderColumn>
62 <TableHeaderColumn dataField='relationship' dataSort={ true } filter={ { type: 'TextFilter' } }>Relationship</TableHeaderColumn>
63 <TableHeaderColumn dataField='profession' dataSort={ true } filter={ { type: 'TextFilter' } }>Profession</TableHeaderColumn>
64 </BootstrapTable>
65 </Panel>
66 </div>
67 );
68 };
69
70 };
71
imports/client/views/org/admin/users/staff/StaffView.js
File was created 1 import _ from 'lodash';
2 import { Meteor } from 'meteor/meteor';
3
4 import React, { Component } from 'react';
5 import { Link,browserHistory } from 'react-router';
6 import { FormGroup,
7 FormControl,Glyphicon,Button } from 'react-bootstrap';
8 import { StaffTable } from './view/StaffTable'
9 import { AddStaff } from './add/addStaff'
10 import { UploadCsvStaff } from './UploadCsvStaff'
11
12 export class StaffView extends Component {
13 constructor(props) {
14 super(props);
15 this.state = {
16
17 };
18 this.onUpdate = this.onUpdate.bind(this);
19 };
20
21 onUpdate(key, value) {
22 this.setState({[key]: value});
23 };
24
25 render() {
26 const {user, org, staff} = this.props.data;
27 return (
28 <div className="container-detached">
29 <StaffTable
30 data = {this.props.data}
31 staff = {staff}
32 />
33 <AddStaff/>
34 <UploadCsvStaff />
35 </div>
36 );
37 };
38
39 };
40
imports/client/views/org/admin/users/staff/UploadCsvStaff.js
File was created 1 // import {UploadCsv } from '/imports/collections/students/UploadCsv'
2 import _ from 'lodash';
3 import { Meteor } from 'meteor/meteor';
4
5 import React, { Component } from 'react';
6 import { Link,browserHistory } from 'react-router';
7 import { FormGroup,Panel,Table,
8 ButtonToolbar,Modal,ControlLabel,HelpBlock,
9 FormControl,Glyphicon,Button } from 'react-bootstrap';
10 // import { AddStudentForm } from './addStudentForm';
11 import { FilesCollection } from 'meteor/ostrio:files';
12 const Papa = this.Papa;
13 // console.log(this);
14 const style = {
15 margin: 12,
16 };
17 function FieldGroup({ id, label, help, ...props }) {
18 return (
19 <FormGroup controlId={id}>
20 <ControlLabel>{label}</ControlLabel>
21 <FormControl {...props} />
22 {help && <HelpBlock>{help}</HelpBlock>}
23 </FormGroup>
24 );
25 }
26 export class UploadCsvStaff extends Component {
27 constructor(props) {
28 super(props);
29 this.state = {
30 show: false
31 };
32 this.showModal = this.showModal.bind(this);
33 this.hideModal = this.hideModal.bind(this);
34 this.onUpdate = this.onUpdate.bind(this);
35 };
36
37 showModal() {
38 this.setState({show: true});
39 }
40
41 hideModal() {
42 this.setState({show: false});
43 }
44 onUpdate(key, value) {
45 this.setState({[key]: value});
46 };
47 uploadStaffCsv(e){
48 e.preventDefault();
49 e.persist();
50 var file = $('input[type="file"]').prop("files")[0];
51 Papa.parse(file, {
52 header: true,
53 complete: function(csvData) {
54 console.log("csvData");
55 console.log(csvData);
56 if(csvData){
57 Meteor.call('staff.uploadCsv', csvData, function (error, result) {
58 console.log("error");
59 console.log(error);
60 console.log("result");
61 console.log(result);
62 })
63 }
64 }
65 });
66 }
67
68 render() {
69 console.log(this.props);
70 return (
71 <ButtonToolbar>
72 <Button bsStyle="primary" onClick={this.showModal}>
73 Upload CSV
74 </Button>
75 <Modal
76 {...this.props}
77 show={this.state.show}
78 onHide={this.hideModal}
79 dialogClassName="custom-modal"
80 >
81 <Modal.Header closeButton>
82 <Modal.Title id="contained-modal-title-lg">Upload Csv</Modal.Title>
83 </Modal.Header>
84 <Modal.Body>
85 <form onSubmit={ (e) => this.uploadStaffCsv(e) } >
86 <FieldGroup
87 id="formControlsFile"
88 type="file"
89 label="File"
90 help="Upload you CSV here."
91 />
92 <Button type="submit" bsStyle="default">Upload File</Button>
93 </form>
94 </Modal.Body>
95 <Modal.Footer>
96 <Button onClick={this.hideModal}>Close</Button>
97 </Modal.Footer>
98 </Modal>
99 </ButtonToolbar>
100 );
101 };
102
103 };
104
imports/client/views/org/admin/users/staff/add/AddStaffFormContainer.js
File was created 1 import React, { Component } from 'react'
2 import StaffForm from './StaffForm'
3 import Form from '/imports/client/views/core/Form'
4 import Validator from '/imports/client/views/core/Validator'
5 import { isRequired, isValidEmail } from '/imports/client/views/core/validations'
6
7 export class AddStaffFormContainer extends Component {
8
9 constructor(props) {
10 super(props)
11 this.state = { currentStep: 0 }
12 this.handleNextClick = this.handleNextClick.bind(this)
13 this.handleBackClick = this.handleBackClick.bind(this)
14 this.handleSubmit = this.handleSubmit.bind(this)
15 }
16
17 handleNextClick() {
18 console.log("clicked");
19 this.form.handleSubmit()
20 if (this.validator.getErrors() && Object.keys(this.validator.getErrors()).length > 0) return
21 console.log("after submit");
22 this.setState({ currentStep: this.state.currentStep + 1 })
23 this.form.resetSubmitted()
24 }
25
26 handleBackClick() {
27 this.setState({ currentStep: this.state.currentStep + -1 })
28 }
29
30 handleSubmit() {
31 if (this.state.currentStep === 3) {
32 Meteor.call('staff.addNew', this.form.state.values, (error, result) => {
33 console.log(error);
34 console.log(result);
35 if(!error){
36 this.props.modalState();
37 }
38 });
39 }
40 }
41
42 //render callback
43 render() {
44 return (
45 <Form
46 onSubmit={this.handleSubmit}
47 ref={form => this.form = form}
48 initialValues={{
49 employeeId: '12345',
50 firstName: 'Test',
51 lastName: 'Last',
52
53 martialStatus: 'single',
54 gender: 'male',
55 dob: '07/03/1993',
56
57 email: 'deepak125.dk+400@gmail.com',
58 phone: '9876543210',
59 address: '123',
60
61 teaching: "yes",
62 type: 'permanent',
63 doj: '07/03/2016',
64
65 qualifaication: 'Phd',
66 specialization: 'Maths',
67 university: 'Pune University',
68
69 degreeFrom: '07/03/2009',
70 degreeEnded: '07/03/2013',
71 }}
72 >
73 {({ values, setValue, getValue, isSubmitted, isDirty }) => (
74 <Validator
75 values={values}
76 ref={validator => this.validator = validator}
77 validations={{
78 employeeId: [(value) => isRequired('Admission id', value)],
79 firstName: [(value) => isRequired('First name', value)],
80 lastName: [(value) => isRequired('Last name', value)],
81
82 gender: [(value) => isRequired('Gender', value)],
83 martialStatus: [(value) => isRequired('martialStatus', value)],
84 dob: [(value) => isRequired('Date of birth', value)],
85
86 teaching: [(value) => this.state.currentStep === 1 && isRequired('teaching', value)],
87 type: [(value) => this.state.currentStep === 1 && isRequired('type', value)],
88 doj: [(value) => this.state.currentStep === 1 && isRequired('doj', value)],
89 desgnation: [(value) => this.state.currentStep === 1 && isRequired('desgnation', value)],
90
91 qualifaication: [(value) => this.state.currentStep === 2 && isRequired('qualifaication', value)],
92 specialization: [(value) => this.state.currentStep === 2 && isRequired('specialization', value)],
93 university: [(value) => this.state.currentStep === 2 && isRequired('university', value)],
94
95 degreeFrom: [(value) => this.state.currentStep === 2 && isRequired('degreeFrom', value)],
96 degreeEnded: [(value) => this.state.currentStep === 2 && isRequired('degreeEnded', value)],
97
98 email: [(value) => this.state.currentStep === 3 && isRequired('Email', value), (value) => this.state.currentStep === 1 && isValidEmail(value)],
99 phone: [(value) => this.state.currentStep === 3 && isRequired('Phone', value)],
100 address: [(value) => this.state.currentStep === 3 && isRequired('Address', value)],
101 city: [(value) => this.state.currentStep === 3 && isRequired('City', value)],
102 state: [(value) => this.state.currentStep === 3 && isRequired('State', value)],
103
104 }}
105 >
106 {({ errors }) => (
107 <StaffForm
108 isDirty={isDirty}
109 setValue={setValue}
110 getValue={getValue}
111 isSubmitted={isSubmitted}
112 errors={errors}
113 onNextClick={this.handleNextClick}
114 onBackClick={this.handleBackClick}
115 currentStep={this.state.currentStep}
116 />
117 )}
118 </Validator>
119 )}
120 </Form>
121 )
122 }
123 }
124
imports/client/views/org/admin/users/staff/add/StaffForm.js
File was created 1 import React, { PropTypes } from 'react'
2 import {
3 Row,
4 Col,
5 FormGroup,
6 FormControl,
7 Button
8 } from 'react-bootstrap'
9 import DatePicker from '/imports/client/views/core/DatePicker'
10 import Label from '/imports/client/views/core/Label'
11 import Stepper from '/imports/client/views/core/Stepper'
12 import ErrorLabel from '/imports/client/views/core/ErrorLabel'
13
14 const StaffForm = props => (
15 <div className="stepy-validation">
16 <Stepper
17 steps={[
18 {
19 label: 'Personal data',
20 active: props.currentStep === 0,
21 },
22 {
23 label: 'Additional Info',
24 active: props.currentStep === 1,
25 },
26 {
27 label: 'Professional Info',
28 active: props.currentStep === 2,
29 },
30 {
31 label: 'Contact Info',
32 active: props.currentStep === 3,
33 },
34 ]}
35 />
36 {props.currentStep === 0 && (
37 <fieldset title="1">
38 <legend className="text-semibold">Personal data</legend>
39 <Row>
40 <Col xs={12} sm={4}>
41 <FormGroup controlId="employeeId">
42 <Label required>Employee ID</Label>
43 <FormControl
44 type="text"
45 value={props.getValue('employeeId')}
46 placeholder="employee Id"
47 onChange={e => props.setValue('employeeId', e.target.value)}
48 />
49 {props.isSubmitted() && props.errors && props.errors.employeeId && (
50 <ErrorLabel> {props.errors.employeeId} </ErrorLabel>
51 )}
52 </FormGroup>
53 </Col>
54
55 <Col xs={12} sm={4}>
56 <FormGroup controlId="firstName">
57 <Label required>First Name</Label>
58 <FormControl
59 type="text"
60 value={props.getValue('firstName')}
61 placeholder="First Name"
62 onChange={e => props.setValue('firstName', e.target.value)}
63 />
64 {props.isSubmitted() && props.errors && props.errors.firstName && (
65 <ErrorLabel> {props.errors.firstName} </ErrorLabel>
66 )}
67 </FormGroup>
68 </Col>
69
70 <Col xs={12} sm={4}>
71 <FormGroup controlId="lastName">
72 <Label required>Last Name</Label>
73 <FormControl
74 type="text"
75 value={props.getValue('lastName')}
76 placeholder="Last Name"
77 onChange={e => props.setValue('lastName', e.target.value)}
78 />
79 {props.isSubmitted() && props.errors && props.errors.lastName && (
80 <ErrorLabel> {props.errors.lastName} </ErrorLabel>
81 )}
82 </FormGroup>
83 </Col>
84 </Row>
85 <Row>
86 <Col xs={12} sm={4}>
87 <FormGroup controlId="formControlsSelect">
88 <Label>Gender</Label>
89 <FormControl componentClass="select"
90 placeholder="select"
91 value={props.getValue('gender')}
92 onChange={e => props.setValue('gender', e.target.value)}
93 >
94 <option value="male">Male</option>
95 <option value="female">Female</option>
96 </FormControl>
97 {props.isSubmitted() && props.errors && props.errors.gender && (
98 <ErrorLabel> {props.errors.gender} </ErrorLabel>
99 )}
100 </FormGroup>
101 </Col>
102
103 <Col xs={12} sm={4}>
104 <FormGroup controlId="formControlsSelect">
105 <Label>martialStatus</Label>
106 <FormControl componentClass="select"
107 placeholder="select"
108 value={props.getValue('martialStatus')}
109 onChange={e => props.setValue('martialStatus', e.target.value)}
110 >
111 <option value="single">Single</option>
112 <option value="married">Married</option>
113 <option value="divorced">Divorced</option>
114 </FormControl>
115 {props.isSubmitted() && props.errors && props.errors.martialStatus && (
116 <ErrorLabel> {props.errors.martialStatus} </ErrorLabel>
117 )}
118 </FormGroup>
119 </Col>
120
121 <Col xs={12} sm={4}>
122 <FormGroup>
123 <Label required>Date of birth</Label>
124 <DatePicker
125 id="dob"
126 setValue = {props.setValue}
127 value={props.getValue('dob')}
128 onChange={(e) => {
129 props.setValue('dob', e.target.value)
130 }}
131 />
132 {props.isSubmitted() && props.errors && props.errors.dob && (
133 <ErrorLabel> {props.errors.dob} </ErrorLabel>
134 )}
135 </FormGroup>
136 </Col>
137 </Row>
138 </fieldset>
139 )}
140 {props.currentStep === 1 && (
141 <fieldset title="Academic">
142 <legend className="text-semibold">Additional Info</legend>
143 <Row>
144 <Col xs={12} sm={4}>
145 <FormGroup controlId="desgnation">
146 <Label required>Desgnation</Label>
147 <FormControl
148 type="text"
149 value={props.getValue('desgnation')}
150 placeholder="Professor"
151 onChange={e => props.setValue('desgnation', e.target.value)}
152 />
153 {props.isSubmitted() && props.errors && props.errors.desgnation && (
154 <ErrorLabel> {props.errors.desgnation} </ErrorLabel>
155 )}
156 </FormGroup>
157 </Col>
158 <Col xs={12} sm={4}>
159 <FormGroup controlId="formControlsSelect">
160 <Label>Teaching Staff?</Label>
161 <FormControl componentClass="select"
162 placeholder="select"
163 value={props.getValue('teaching')}
164 onChange={e => props.setValue('teaching', e.target.value)}
165 >
166 <option value="yes">Yes</option>
167 <option value="no">No</option>
168 </FormControl>
169 {props.isSubmitted() && props.errors && props.errors.teaching && (
170 <ErrorLabel> {props.errors.teaching} </ErrorLabel>
171 )}
172 </FormGroup>
173 </Col>
174 <Col xs={12} sm={4}>
175 <FormGroup controlId="formControlsSelect">
176 <Label>Type</Label>
177 <FormControl componentClass="select"
178 placeholder="select"
179 value={props.getValue('type')}
180 onChange={e => props.setValue('type', e.target.value)}
181 >
182 <option value="permanent">Permanent</option>
183 <option value="temporary">Temporary</option>
184 </FormControl>
185 {props.isSubmitted() && props.errors && props.errors.type && (
186 <ErrorLabel> {props.errors.type} </ErrorLabel>
187 )}
188 </FormGroup>
189 </Col>
190 </Row>
191 <Row>
192 <Col xs={12} sm={4}>
193 <FormGroup>
194 <Label required>Date of Joining</Label>
195 <DatePicker
196 id="doj"
197 setValue = {props.setValue}
198 value={props.getValue('doj')}
199 onChange={(e) => {
200 props.setValue('doj', e.target.value)
201 }}
202 />
203 {props.isSubmitted() && props.errors && props.errors.doj && (
204 <ErrorLabel> {props.errors.doj} </ErrorLabel>
205 )}
206 </FormGroup>
207 </Col>
208 </Row>
209 </fieldset>
210 )}
211 {props.currentStep === 2 && (
212 <fieldset title="Professional Info">
213 <legend className="text-semibold">Professional Info</legend>
214 <Row>
215 <Col xs={12} sm={4}>
216 <FormGroup controlId="qualifaication">
217 <Label required>Qualifaication</Label>
218 <FormControl
219 type="text"
220 value={props.getValue('qualifaication')}
221 placeholder="Ex: Phd"
222 onChange={e => props.setValue('qualifaication', e.target.value)}
223 />
224 {props.isSubmitted() && props.errors && props.errors.qualifaication && (
225 <ErrorLabel> {props.errors.qualifaication} </ErrorLabel>
226 )}
227 </FormGroup>
228 </Col>
229 <Col xs={12} sm={4}>
230 <FormGroup controlId="specialization">
231 <Label required>Specialization</Label>
232 <FormControl
233 type="text"
234 value={props.getValue('specialization')}
235 placeholder="Ex: Maths"
236 onChange={e => props.setValue('specialization', e.target.value)}
237 />
238 {props.isSubmitted() && props.errors && props.errors.specialization && (
239 <ErrorLabel> {props.errors.specialization} </ErrorLabel>
240 )}
241 </FormGroup>
242 </Col>
243 <Col xs={12} sm={4}>
244 <FormGroup controlId="university">
245 <Label required>University</Label>
246 <FormControl
247 type="text"
248 value={props.getValue('university')}
249 placeholder="Ex: Pune University"
250 onChange={e => props.setValue('university', e.target.value)}
251 />
252 {props.isSubmitted() && props.errors && props.errors.university && (
253 <ErrorLabel> {props.errors.university} </ErrorLabel>
254 )}
255 </FormGroup>
256 </Col>
257 </Row>
258 <Row>
259 <Col xs={12} sm={4}>
260 <FormGroup>
261 <Label required>Latest Degree started At</Label>
262 <DatePicker
263 id="degreeFrom"
264 setValue = {props.setValue}
265 value={props.getValue('degreeFrom')}
266 onChange={(e) => {
267 props.setValue('degreeFrom', e.target.value)
268 }}
269 />
270 {props.isSubmitted() && props.errors && props.errors.degreeFrom && (
271 <ErrorLabel> {props.errors.degreeFrom} </ErrorLabel>
272 )}
273 </FormGroup>
274 </Col>
275 <Col xs={12} sm={4}>
276 <FormGroup>
277 <Label required>Latest Degree ended At</Label>
278 <DatePicker
279 id="degreeEnded"
280 setValue = {props.setValue}
281 value={props.getValue('degreeEnded')}
282 onChange={(e) => {
283 props.setValue('degreeEnded', e.target.value)
284 }}
285 />
286 {props.isSubmitted() && props.errors && props.errors.degreeEnded && (
287 <ErrorLabel> {props.errors.degreeEnded} </ErrorLabel>
288 )}
289 </FormGroup>
290 </Col>
291 </Row>
292 </fieldset>
293 )}
294 {props.currentStep === 3 && (
295 <fieldset title="Academic">
296 <legend className="text-semibold">Additional Info</legend>
297 <Row>
298 <Col xs={12} sm={4}>
299 <FormGroup controlId="email">
300 <Label required>Email</Label>
301 <FormControl
302 type="email"
303 value={props.getValue('email')}
304 placeholder="Email"
305 onChange={e => props.setValue('email', e.target.value)}
306 />
307 {props.isSubmitted() && props.errors && props.errors.email && (
308 <ErrorLabel> {props.errors.email} </ErrorLabel>
309 )}
310 </FormGroup>
311 </Col>
312 <Col xs={12} sm={4}>
313 <FormGroup controlId="phone">
314 <Label required>Phone</Label>
315 <FormControl
316 type="text"
317 value={props.getValue('phone')}
318 placeholder="Martial Status"
319 onChange={e => props.setValue('phone', e.target.value)}
320 />
321 {props.isSubmitted() && props.errors && props.errors.phone && (
322 <ErrorLabel> {props.errors.phone} </ErrorLabel>
323 )}
324 </FormGroup>
325 </Col>
326 </Row>
327 <Row>
328 <Col xs={12} sm={4}>
329 <FormGroup controlId="address">
330 <Label required>Address</Label>
331 <FormControl
332 type="text"
333 value={props.getValue('address')}
334 placeholder="#876, Street, town"
335 onChange={e => props.setValue('address', e.target.value)}
336 />
337 {props.isSubmitted() && props.errors && props.errors.address && (
338 <ErrorLabel> {props.errors.address} </ErrorLabel>
339 )}
340 </FormGroup>
341 </Col>
342 <Col xs={12} sm={4}>
343 <FormGroup controlId="city">
344 <Label required>City</Label>
345 <FormControl
346 type="text"
347 value={props.getValue('city')}
348 placeholder="Chennai"
349 onChange={e => props.setValue('city', e.target.value)}
350 />
351 {props.isSubmitted() && props.errors && props.errors.city && (
352 <ErrorLabel> {props.errors.city} </ErrorLabel>
353 )}
354 </FormGroup>
355 </Col>
356 <Col xs={12} sm={4}>
357 <FormGroup controlId="state">
358 <Label required>State</Label>
359 <FormControl
360 type="text"
361 value={props.getValue('state')}
362 placeholder="Tamilnadu"
363 onChange={e => props.setValue('state', e.target.value)}
364 />
365 {props.isSubmitted() && props.errors && props.errors.state && (
366 <ErrorLabel> {props.errors.state} </ErrorLabel>
367 )}
368 </FormGroup>
369 </Col>
370 </Row>
371 </fieldset>
372 )}
373 <div style={{ textAlign: 'left' }}>
374 {props.currentStep > 0 && (
375 <div style={{ display: 'inline-block', marginRight: 10 }}>
376 <Button onClick={props.onBackClick}>
377 <i className="icon-arrow-left13 position-left"></i>
378 BACK
379 </Button>
380
381 </div>
382 )}
383 {props.currentStep < 3 && (
384 <div style={{ display: 'inline-block' }}>
385 <Button
386 bsStyle="primary"
387 onClick={props.onNextClick}
388 >
389 NEXT
390 <i className="icon-arrow-right14 position-right" />
391 </Button>
392 </div>
393 )}
394 {props.currentStep === 3 && (
395 <div style={{ display: 'inline-block' }}>
396 <Button
397 bsStyle="primary"
398 onClick={props.onNextClick}
399 >
400 SAVE
401 <i className="fa fa-check" />
402 </Button>
403 </div>
404 )}
405 </div>
406 </div>
407 )
408
409 StaffForm.propTypes = {
410 currentStep: PropTypes.number.isRequired,
411 onNextClick: PropTypes.func.isRequired,
412 onBackClick: PropTypes.func.isRequired,
413 setValue: PropTypes.func.isRequired,
414 getValue: PropTypes.func.isRequired,
415 }
416
417 export default StaffForm
418
imports/client/views/org/admin/users/staff/add/addStaff.js
File was created 1 import _ from 'lodash';
2 import { Meteor } from 'meteor/meteor';
3 import React, { Component } from 'react';
4 import { Link,browserHistory } from 'react-router';
5 import { FormGroup,Panel,Table,
6 ButtonToolbar,Modal,
7 FormControl,Glyphicon,Button } from 'react-bootstrap';
8 import { AddStaffFormContainer } from './AddStaffFormContainer';
9
10 const style = {
11 margin: 12,
12 };
13 export class AddStaff extends Component {
14 constructor(props) {
15 super(props);
16 this.state = {
17 show: false
18 };
19 this.showModal = this.showModal.bind(this);
20 this.hideModal = this.hideModal.bind(this);
21 this.onUpdate = this.onUpdate.bind(this);
22 };
23
24 showModal() {
25 this.setState({show: true});
26 }
27
28 hideModal() {
29 this.setState({show: false});
30 }
31 onUpdate(key, value) {
32 this.setState({[key]: value});
33 };
34
35 render() {
36 return (
37 <ButtonToolbar>
38 <Button bsStyle="primary" onClick={this.showModal}>
39 Add Staff
40 </Button>
41 <Modal
42 {...this.props}
43 show={this.state.show}
44 onHide={this.hideModal}
45 dialogClassName="custom-modal"
46 bsSize="large"
47 >
48 <Modal.Header closeButton>
49 <Modal.Title id="contained-modal-title-lg">Add New Staff</Modal.Title>
50 </Modal.Header>
51 <Modal.Body>
52 <AddStaffFormContainer
53 modalState = {this.hideModal}
54 />
55 </Modal.Body>
56 {/*
57 <Modal.Footer>
58 <Button onClick={this.hideModal}>Close</Button>
59 </Modal.Footer>
60 */}
61 </Modal>
62 </ButtonToolbar>
63 );
64 };
65
66 };
67
imports/client/views/org/admin/users/staff/index.js
File was created 1 // import { InviteSignupController } from '/imports/client/views/invite/signup/index'
2 import _ from 'lodash';
3 import {
4 composeWithTracker,
5 compose,
6 composeAll
7 } from 'react-komposer';
8 import { Loading } from '/imports/client/components/Loading';
9
10 import { Orgs } from '/imports/collections/orgs/index';
11 import { Users } from '/imports/collections/users/index';
12 import { Staffs } from '/imports/collections/staff/index';
13 import { StaffView } from './StaffView';
14
15 const meteorTick = (props, onData) => {
16 Shelf.layout.set({
17 bulb: 'SETTINGS',
18 subbulb: 'USERS',
19 view: 'STAFF'
20 });
21 const handles = [
22 Meteor.subscribe('users.current'),
23 Meteor.subscribe('orgs.current'),
24 Meteor.subscribe('users.forMyOrg'),
25 Meteor.subscribe('staff.forMyOrg'),
26 ];
27
28 if(_.every(handles, (handle) => (handle.ready()) )) {
29 const user = Users.current();
30 const org = Orgs.current();
31 staff = Users.find({"role":"STAFF"}).fetch() ? Users.find({"role":"STAFF"}).fetch() : "";
32 console.log(Users.find({"role":"STAFF"}).fetch());
33 staffData = Staffs.find().fetch() ? Staffs.find().fetch() : "";
34 console.log("staffData");
35 console.log(staffData);
36 for(var i=0; i< staff.length; i++){
37 for(var j=0; j< staffData.length; j++){
38 if(staff[i]._id == staffData[j].userId){
39 staff[i].type = staffData[j].type;
40 staff[i].employeeId = staffData[j].employeeId;
41 staff[i].dob = staffData[j].dob;
42 }
43 }
44 }
45 onData(null, {
46 data: {
47 user: user,
48 org: org,
49 staff: staff
50 },
51 });
52 }
53
54 return () => {
55 _.each(handles, (handle) => handle.stop() );
56 };
57 };
58
59
60 const reduxTick = (props, onData) => {
61 onData(null, {
62 data: {}
63 });
64 };
65
66
67 export const staffViewController = composeAll(
68 composeWithTracker(meteorTick, Loading),
69 compose(reduxTick, Loading),
70 )(StaffView);
71
imports/client/views/org/admin/users/staff/view/StaffRow.js
File was created 1 import _ from 'lodash';
2 import { Meteor } from 'meteor/meteor';
3
4 import React, { Component } from 'react';
5 import { Link,browserHistory } from 'react-router';
6 import { FormGroup,
7 FormControl,Glyphicon,Button } from 'react-bootstrap';
8
9
10 export class StaffRow extends Component {
11
12 constructor(props) {
13 super(props);
14 this.state = {
15
16 };
17 this.onUpdate = this.onUpdate.bind(this);
18 };
19
20 onUpdate(key, value) {
21 this.setState({[key]: value});
22 };
23
24 render() {
25 const {staff} = this.props;
26 if(staff.firstName){
27 return (
28 <tr>
29 <td>{staff.firstName}</td>
30 <td>{staff.lastName}</td>
31 <td>{staff.type}</td>
32 <td>{staff.dob? moment(staff.dob).format("LL") : <span></span>}</td>
33 <td><span className="label label-success">Active</span></td>
34 <td className="text-center">
35 <ul className="icons-list">
36 <li className="dropdown">
37 <a href="#" className="dropdown-toggle" data-toggle="dropdown">
38 <i className="icon-menu9"></i>
39 </a>
40 <ul className="dropdown-menu dropdown-menu-right">
41 <li><a href="#"><i className="icon-file-pdf"></i> Export to .pdf</a></li>
42 <li><a href="#"><i className="icon-file-excel"></i> Export to .csv</a></li>
43 <li><a href="#"><i className="icon-file-word"></i> Export to .doc</a></li>
44 </ul>
45 </li>
46 </ul>
47 </td>
48 </tr>
49 );
50 }else {
51 return null;
52 }
53
54 };
55
56 };
57
imports/client/views/org/admin/users/staff/view/StaffTable.js
File was created 1 import _ from 'lodash';
2 import { Meteor } from 'meteor/meteor';
3
4 import React, { Component } from 'react';
5 import { Link,browserHistory } from 'react-router';
6 import { FormGroup,Panel,Table,
7 ButtonToolbar,Modal,
8 FormControl,Glyphicon,Button } from 'react-bootstrap';
9 import {moment} from 'meteor/momentjs:moment'
10 import {StaffRow} from './StaffRow'
11 import {BootstrapTable, TableHeaderColumn}from 'react-bootstrap-table';
12 const options = {
13 page: 0, // which page you want to show as default
14 sizePerPageList: [ {
15 text: '5', value: 5
16 }, {
17 text: '10', value: 10
18 }], // you can change the dropdown list for size per page
19 sizePerPage: 5, // which size per page you want to locate as default
20 pageStartIndex: 0, // where to start counting the pages
21 paginationSize: 3, // the pagination bar size.
22 prePage: 'Prev', // Previous page button text
23 nextPage: 'Next', // Next page button text
24 firstPage: 'First', // First page button text
25 lastPage: 'Last', // Last page button text
26 paginationShowsTotal: false, // Accept bool or function
27 paginationPosition: 'bottom' // default is bottom, top and both is all available
28 // hideSizePerPage: true > You can hide the dropdown for sizePerPage
29 // alwaysShowAllBtns: true // Always show next and previous button
30 // withFirstAndLast: false > Hide the going to First and Last page button
31 };
32
33 function dateFormatter(cell, row) {
34 console.log("cell");
35 console.log(cell);
36 if(cell){
37 cell = new Date(cell);
38 console.log(cell);
39 return `${('0' + cell.getDate()).slice(-2)}/${('0' + (cell.getMonth() + 1)).slice(-2)}/${cell.getFullYear()}`;
40 }
41 }
42
43 export class StaffTable extends Component {
44
45 constructor(props) {
46 super(props);
47 this.state = {
48 show: false,
49 panleOpen: true,
50 };
51 this.onUpdate = this.onUpdate.bind(this);
52 };
53 onUpdate(key, value) {
54 this.setState({[key]: value});
55 };
56 togglePanel(){
57 this.setState({panleOpen: !this.state.panleOpen});
58 }
59 render() {
60 console.log("this.props.staff");
61 console.log(this.props.staff);
62 return (
63 <div className="panel panel-flat">
64 <div className="panel-heading">
65 <h5 className="panel-title">Teachers Details</h5>
66 <div className="heading-elements">
67 <ul className="icons-list">
68 <li onClick={this.togglePanel}><a data-action="collapse" className={this.state.panleOpen?"rotate-180":null}></a></li>
69 </ul>
70 </div>
71 </div>
72 <Panel collapsible expanded={this.state.panleOpen}>
73 <BootstrapTable data={ this.props.staff } pagination={ true } options={ options } >
74 <TableHeaderColumn dataField='employeeId' isKey={ true } dataSort={ true } filter={ { type: 'TextFilter' } }>Employee Id</TableHeaderColumn>
75 <TableHeaderColumn dataField='firstName' dataSort={ true } filter={ { type: 'TextFilter' } }>First Name</TableHeaderColumn>
76 <TableHeaderColumn dataField='lastName' dataSort={ true } filter={ { type: 'TextFilter' } }>Last Name</TableHeaderColumn>
77 <TableHeaderColumn dataField='type' dataSort={ true } filter={ { type: 'TextFilter' } }>Type</TableHeaderColumn>
78 <TableHeaderColumn dataField='dob' dataFormat={ dateFormatter } >DOB</TableHeaderColumn>
79 </BootstrapTable>
80 </Panel>
81 </div>
82 );
83 };
84
85 };
86
imports/client/views/org/admin/users/students/StudentDataView.js
File was created 1 import _ from 'lodash';
2 import { Meteor } from 'meteor/meteor';
3
4 import React, { Component } from 'react';
5 import { Link,browserHistory } from 'react-router';
6 import { FormGroup,Panel,Table,
7 ButtonToolbar,Modal,
8 FormControl,Glyphicon,Button } from 'react-bootstrap';
9 import { AddStudentForm } from './addStudentForm';
10
11 export class StudentDataView extends Component {
12
13 constructor(props) {
14 super(props);
15 this.state = {
16 show: false
17 };
18 this.showModal = this.showModal.bind(this);
19 this.hideModal = this.hideModal.bind(this);
20 this.onUpdate = this.onUpdate.bind(this);
21 };
22
23 showModal() {
24 this.setState({show: true});
25 }
26
27 hideModal() {
28 this.setState({show: false});
29 }
30 onUpdate(key, value) {
31 this.setState({[key]: value});
32 };
33
34 render() {
35 return (
36 <div className="content has-detached-left">
37
38 <div className="container-detached">
39 <div className="content-detached">
40 <div className="row">
41 <div className="col-lg-3 col-md-6">
42 <div className="panel panel-body">
43 <div className="media">
44 <div className="media-left">
45 <a href="assets/images/placeholder.png" data-popup="lightbox">
46 <img src="assets/images/download2.png" className="img-circle img-lg" alt="" />
47 </a>
48 </div>
49
50 <div className="media-body">
51 <h6 className="media-heading">Students</h6>
52 <span className="text-muted">Click to view</span>
53 </div>
54 </div>
55 </div>
56 </div>
57
58 <div className="col-lg-3 col-md-6">
59 <div className="panel panel-body">
60 <div className="media">
61 <div className="media-left">
62 <a href="assets/images/placeholder.jpg" data-popup="lightbox">
63 <img src="assets/images/download.png" className="img-circle img-lg" alt="" />
64 </a>
65 </div>
66
67 <div className="media-body">
68 <h6 className="media-heading">Teachers</h6>
69 <span className="text-muted">Click to view</span>
70 </div>
71 </div>
72 </div>
73 </div>
74
75 <div className="col-lg-3 col-md-6">
76 <div className="panel panel-body">
77 <div className="media">
78 <div className="media-left">
79 <a href="assets/images/placeholder.jpg" data-popup="lightbox">
80 <img src="assets/images/download3.png" className="img-circle img-lg" alt="" />
81 </a>
82 </div>
83
84 <div className="media-body">
85 <h6 className="media-heading">Parents</h6>
86 <span className="text-muted">Click to view</span>
87 </div>
88 </div>
89 </div>
90 </div>
91
92 <div className="col-lg-3 col-md-6">
93 <div className="panel panel-body">
94 <div className="media">
95 <div className="media-left">
96 <a href="assets/images/placeholder.jpg" data-popup="lightbox">
97 <img src="assets/images/download1.png" className="img-circle img-lg" alt="" />
98 </a>
99 </div>
100
101 <div className="media-body">
102 <h6 className="media-heading">Non Teaching Staff</h6>
103 <span className="text-muted">Click to view</span>
104 </div>
105 </div>
106 </div>
107 </div>
108 </div>
109
110 <div className="panel panel-flat">
111 <div className="panel-heading">
112 <h5 className="panel-title">Student Details</h5>
113 <div className="heading-elements">
114 <ul className="icons-list">
115 <li><a data-action="collapse"></a></li>
116 <li><a data-action="reload"></a></li>
117 </ul>
118 </div>
119 </div>
120
121
122 <table className="table datatable-basic table-striped">
123 <thead>
124 <tr>
125 <th>First Name</th>
126 <th>Last Name</th>
127 <th>className</th>
128 <th>DOB</th>
129 <th>Status</th>
130 <th className="text-center">Actions</th>
131 </tr>
132 </thead>
133 <tbody>
134 <tr>
135 <td>Marth</td>
136 <td><a href="#">Enright</a></td>
137 <td>VII</td>
138 <td>22 Jun 1972</td>
139 <td><span className="label label-success">Active</span></td>
140 <td className="text-center">
141 <ul className="icons-list">
142 <li className="dropdown">
143 <a href="#" className="dropdown-toggle" data-toggle="dropdown">
144 <i className="icon-menu9"></i>
145 </a>
146
147 <ul className="dropdown-menu dropdown-menu-right">
148 <li><a href="#"><i className="icon-file-pdf"></i> Export to .pdf</a></li>
149 <li><a href="#"><i className="icon-file-excel"></i> Export to .csv</a></li>
150 <li><a href="#"><i className="icon-file-word"></i> Export to .doc</a></li>
151 </ul>
152 </li>
153 </ul>
154 </td>
155 </tr>
156 <tr>
157 <td>Jackelyn</td>
158 <td>Weible</td>
159 <td><a href="#">XI</a></td>
160 <td>3 Oct 1981</td>
161 <td><span className="label label-default">Inactive</span></td>
162 <td className="text-center">
163 <ul className="icons-list">
164 <li className="dropdown">
165 <a href="#" className="dropdown-toggle" data-toggle="dropdown">
166 <i className="icon-menu9"></i>
167 </a>
168
169 <ul className="dropdown-menu dropdown-menu-right">
170 <li><a href="#"><i className="icon-file-pdf"></i> Export to .pdf</a></li>
171 <li><a href="#"><i className="icon-file-excel"></i> Export to .csv</a></li>
172 <li><a href="#"><i className="icon-file-word"></i> Export to .doc</a></li>
173 </ul>
174 </li>
175 </ul>
176 </td>
177 </tr>
178 </tbody>
179 </table>
180 </div>
181
182
183 <ul className="fab-menu fab-menu-fixed fab-menu-bottom-right" data-fab-toggle="click">
184 <li>
185 <a className="fab-menu-btn btn bg-teal-400 btn-float btn-rounded btn-icon">
186 <i className="fab-icon-open icon-plus3"></i>
187 <i className="fab-icon-close icon-cross2"></i>
188 </a>
189
190 <ul className="fab-menu-inner">
191 <li>
192 <div data-fab-label="Upload bulk data">
193 <a href="#" className="btn btn-default btn-rounded btn-icon btn-float">
194 <i className="icon-file-upload2"></i>
195 </a>
196 </div>
197 </li>
198 <li>
199 <div data-fab-label="Add Student">
200 <a href="#" className="btn btn-default btn-rounded btn-icon btn-float">
201 <i className=" icon-file-plus2"></i>
202 </a>
203 <span className="badge bg-primary-400">5</span>
204 </div>
205 </li>
206 </ul>
207 </li>
208 </ul>
209
210 </div>
211 </div>
212 <div className="sidebar-detached affix-top">
213 <div className="sidebar sidebar-default">
214 <div className="sidebar-content">
215
216 <div className="sidebar-category">
217 <div className="category-title">
218 <span>Advanced Search</span>
219 <ul className="icons-list">
220 <li><a href="#" data-action="collapse"></a></li>
221 </ul>
222 </div>
223
224 <div className="category-content">
225 <form action="#">
226 <div className="has-feedback has-feedback-left">
227 <input type="search" className="form-control" placeholder="First Name" />
228 <div className="form-control-feedback">
229 <i className="icon-search4 text-size-base text-muted"></i>
230 </div>
231 </div>
232 </form>
233 </div>
234 <div className="category-content">
235 <form action="#">
236 <div className="has-feedback has-feedback-left">
237 <input type="search" className="form-control" placeholder="Last Name" />
238 <div className="form-control-feedback">
239 <i className="icon-search4 text-size-base text-muted"></i>
240 </div>
241 </div>
242 </form>
243 </div>
244 <div className="category-content">
245 <form action="#">
246 <div className="has-feedback has-feedback-left">
247 <div className="btn-group">
248 <button type="button" className="dropdown-toggle form-control" data-toggle="dropdown">
249 <span data-bind="label">Select className</span>&nbsp;<span className="caret"></span>
250 </button>
251 <ul className="dropdown-menu" role="menu">
252 <li><a href="#">Item 1</a></li>
253 <li><a href="#">Another item</a></li>
254 <li><a href="#">This is a longer item that will not fit properly</a></li>
255 </ul>
256 </div>
257 <div className="form-control-feedback">
258 <i className="icon-search4 text-size-base text-muted"></i>
259 </div>
260 </div>
261 </form>
262 </div>
263 </div>
264
265
266 </div>
267 </div>
268 </div>
269 </div>
270
271 );
272 };
273
274 };
275
imports/client/views/org/admin/users/students/StudentDataView0.js
File was created 1 import _ from 'lodash';
2 import { Meteor } from 'meteor/meteor';
3
4 import React, { Component } from 'react';
5 import { Link,browserHistory } from 'react-router';
6 import { FormGroup,Panel,Table,
7 ButtonToolbar,Modal,
8 FormControl,Glyphicon,Button } from 'react-bootstrap';
9 import { AddStudentForm } from './addStudentForm';
10
11 export class StudentDataView extends Component {
12
13 constructor(props) {
14 super(props);
15 this.state = {
16 show: false
17 };
18 this.showModal = this.showModal.bind(this);
19 this.hideModal = this.hideModal.bind(this);
20 this.onUpdate = this.onUpdate.bind(this);
21 };
22
23 showModal() {
24 this.setState({show: true});
25 }
26
27 hideModal() {
28 this.setState({show: false});
29 }
30 onUpdate(key, value) {
31 this.setState({[key]: value});
32 };
33
34 render() {
35 return (
36 <div className = "enterPane-box">
37 <Panel header="Students Info" bsStyle="primary">
38 <Table striped bordered condensed hover>
39 <thead>
40 <tr>
41 <th>#</th>
42 <th>First Name</th>
43 <th>Last Name</th>
44 </tr>
45 </thead>
46 <tbody>
47 {
48 this.props.data.students.map(function(student, i)
49 {
50 return(
51 <tr>
52 <td>{i+1}</td>
53 <td>{student.firstName}</td>
54 <td>{student.lastName}</td>
55 </tr>
56 )
57 })
58 }
59
60 </tbody>
61 </Table>
62 <ButtonToolbar>
63 <Button bsStyle="primary" onClick={this.showModal}>
64 Add Student
65 </Button>
66 <Modal
67 {...this.props}
68 show={this.state.show}
69 onHide={this.hideModal}
70 dialogClassName="custom-modal"
71 >
72 <Modal.Header closeButton>
73 <Modal.Title id="contained-modal-title-lg">New Student</Modal.Title>
74 </Modal.Header>
75 <Modal.Body>
76 <AddStudentForm />
77 </Modal.Body>
78 <Modal.Footer>
79 <Button onClick={this.hideModal}>Close</Button>
80 </Modal.Footer>
81 </Modal>
82 </ButtonToolbar>
83 </Panel>
84 </div>
85 );
86 };
87
88 };
89
imports/client/views/org/admin/users/students/StudentView.js
File was created 1 import _ from 'lodash';
2 import { Meteor } from 'meteor/meteor';
3
4 import React, { Component } from 'react';
5 import { Link,browserHistory } from 'react-router';
6 import { Navbar,Modal, Nav, NavItem,
7 Glyphicon, Collapse, FormGroup, FormControl, Panel,
8 NavbarToggler, NavbarBrand, Table, ButtonToolbar,
9 NavLink, DropdownItem, DropdownToggle, DropdownMenu,
10 NavDropdown, MenuItem, Breadcrumb, Button } from 'react-bootstrap';
11 import { StudentTable } from './view/StudentTable';
12 import { UploadCsv } from './UploadCsv';
13 import { AddStudent } from './add/addStudent';
14 import { Students } from '/imports/collections/students/index';
15 import './student.css'
16
17 export class StudentView extends Component {
18
19 constructor(props) {
20 super(props);
21 this.state = {
22 show: false,
23 firstNameSearch: "",
24 lastNameSearch: "",
25 };
26 this.showModal = this.showModal.bind(this);
27 this.hideModal = this.hideModal.bind(this);
28 this.onUpdate = this.onUpdate.bind(this);
29 };
30
31 showModal() {
32 this.setState({show: true});
33 }
34
35 hideModal() {
36 this.setState({show: false});
37 }
38 onUpdate(key, value) {
39 this.setState({[key]: value});
40 };
41
42 render() {
43 firstNameSearch = this.state.firstNameSearch;
44 lastNameSearch = this.state.lastNameSearch;
45 var students =_.filter(this.props.data.students,function(item){
46 if(item.firstName){
47 return _.includes(item.firstName.toLowerCase(),firstNameSearch.toLowerCase());
48 }
49 });
50 return (
51 <div className="container-detached">
52 <div className="">
53 <StudentTable
54 data = {this.props.data}
55 studentData = {studentData}
56 />
57 <AddStudent/>
58 <UploadCsv />
59 </div>
60 </div>
61 );
62 };
63
64 };
65
imports/client/views/org/admin/users/students/UploadCsv.js
File was created 1 // import {UploadCsv } from '/imports/collections/students/UploadCsv'
2 import _ from 'lodash';
3 import { Meteor } from 'meteor/meteor';
4
5 import React, { Component } from 'react';
6 import { Link,browserHistory } from 'react-router';
7 import { FormGroup,Panel,Table,
8 ButtonToolbar,Modal,ControlLabel,HelpBlock,
9 FormControl,Glyphicon,Button } from 'react-bootstrap';
10 // import { AddStudentForm } from './addStudentForm';
11 import { FilesCollection } from 'meteor/ostrio:files';
12 const Papa = this.Papa;
13 // console.log(this);
14 const style = {
15 margin: 12,
16 };
17 function FieldGroup({ id, label, help, ...props }) {
18 return (
19 <FormGroup controlId={id}>
20 <ControlLabel>{label}</ControlLabel>
21 <FormControl {...props} />
22 {help && <HelpBlock>{help}</HelpBlock>}
23 </FormGroup>
24 );
25 }
26 export class UploadCsv extends Component {
27 constructor(props) {
28 super(props);
29 this.state = {
30 show: false
31 };
32 this.showModal = this.showModal.bind(this);
33 this.hideModal = this.hideModal.bind(this);
34 this.onUpdate = this.onUpdate.bind(this);
35 };
36
37 showModal() {
38 this.setState({show: true});
39 }
40
41 hideModal() {
42 this.setState({show: false});
43 }
44 onUpdate(key, value) {
45 this.setState({[key]: value});
46 };
47 uploadStudentCsv(e){
48 e.preventDefault();
49 e.persist();
50 var file = $('input[type="file"]').prop("files")[0];
51 Papa.parse(file, {
52 header: true,
53 complete: function(csvData) {
54 console.log("csvData");
55 console.log(csvData);
56 if(csvData){
57 Meteor.call('student.uploadCsv', csvData, function (error, result) {
58 console.log("error");
59 console.log(error);
60 console.log("result");
61 console.log(result);
62 })
63 }
64 }
65 });
66 }
67
68 render() {
69 console.log(this.props);
70 return (
71 <ButtonToolbar>
72 <Button bsStyle="primary" onClick={this.showModal}>
73 Upload CSV
74 </Button>
75 <Modal
76 {...this.props}
77 show={this.state.show}
78 onHide={this.hideModal}
79 dialogClassName="custom-modal"
80 >
81 <Modal.Header closeButton>
82 <Modal.Title id="contained-modal-title-lg">Upload Csv file</Modal.Title>
83 </Modal.Header>
84 <Modal.Body>
85 <form onSubmit={ (e) => this.uploadStudentCsv(e) } >
86 <FieldGroup
87 id="formControlsFile"
88 type="file"
89 label="File"
90 help="Upload you CSV here."
91 />
92 <Button type="submit" bsStyle="default">Upload File</Button>
93 </form>
94 </Modal.Body>
95 <Modal.Footer>
96 <Button onClick={this.hideModal}>Close</Button>
97 </Modal.Footer>
98 </Modal>
99 </ButtonToolbar>
100 );
101 };
102
103 };
104
imports/client/views/org/admin/users/students/add/AddStudentFormContainer.js
File was created 1 import React, { Component } from 'react'
2 import { AddStudentForm } from './addStudentForm'
3 import StudentForm from './StudentForm'
4 import Form from '/imports/client/views/core/Form'
5 import Validator from '/imports/client/views/core/Validator'
6 import { isRequired, isValidEmail } from '/imports/client/views/core/validations'
7
8
9 export class AddStudentFormContainer extends Component {
10
11 constructor(props) {
12 super(props)
13 this.state = { currentStep: 0 }
14 this.handleNextClick = this.handleNextClick.bind(this)
15 this.handleBackClick = this.handleBackClick.bind(this)
16 this.handleSubmit = this.handleSubmit.bind(this)
17 }
18
19 handleNextClick() {
20 this.form.handleSubmit()
21 if (this.validator.getErrors() && Object.keys(this.validator.getErrors()).length > 0) return
22 this.setState({ currentStep: this.state.currentStep + 1 })
23 this.form.resetSubmitted()
24 }
25
26 handleBackClick() {
27 this.setState({ currentStep: this.state.currentStep + -1 })
28 }
29
30 handleSubmit() {
31 self = this;
32 if (this.state.currentStep === 3) {
33 Meteor.call('student.addManually',this.form.state.values, function(err, result){
34 console.log("err");
35 console.log(err);
36 console.log("result");
37 console.log(result);
38 if(!err){
39 self.props.hideModal();
40 }
41 });
42 }
43 }
44
45 //render callback
46 render() {
47 return (
48 <Form
49 onSubmit={this.handleSubmit}
50 ref={form => this.form = form}
51 initialValues={{
52 gender: 'male',
53 parentGender: 'male',
54 admissionId: "123",
55 firstName: "first",
56 lastName: "last",
57 email: "deepak125.dk+21@gmail.com",
58 dob: "04/04/1989",
59 gender: "male",
60 rollNo: "1",
61 studentClass: "2",
62 section: "B",
63 community: "SC",
64 bloodGroup: "B+",
65 phone: "9876543321",
66 address: "address",
67 city: "chennai",
68 state: "tn",
69 parentName: "parentName",
70 parentEmail: "deepak125.dk+41@gmail.com",
71 relation: "father",
72 profession: "farmer",
73 parentGender: "male",
74 parentPhone: "987655412",
75 parentAddress: "parentAddress",
76 parentCity: "parentCity",
77 parentState: "parentState",
78 parentZipcode: "parentZipcode",
79 }}
80 >
81 {({ values, setValue, getValue, isSubmitted, isDirty }) => (
82 <Validator
83 values={values}
84 ref={validator => this.validator = validator}
85 validations={{
86 admissionId: [(value) => isRequired('Admission id', value)],
87 firstName: [(value) => isRequired('First name', value)],
88 lastName: [(value) => isRequired('Last name', value)],
89 email: [(value) => isRequired('Email', value), isValidEmail],
90 dob: [(value) => isRequired('Date of birth', value)],
91 gender: [(value) => isRequired('Gender', value)],
92 rollNo: [(value) => this.state.currentStep === 1 && isRequired('Roll no', value)],
93 studentClass: [(value) => this.state.currentStep === 1 && isRequired('Class', value)],
94 section: [(value) => this.state.currentStep === 1 && isRequired('Section', value)],
95 community: [(value) => this.state.currentStep === 1 && isRequired('Community', value)],
96 bloodGroup: [(value) => this.state.currentStep === 1 && isRequired('Blood group', value)],
97 phone: [(value) => this.state.currentStep === 1 && isRequired('Phone', value)],
98 address: [(value) => this.state.currentStep === 2 && isRequired('Address', value)],
99 city: [(value) => this.state.currentStep === 2 && isRequired('City', value)],
100 state: [(value) => this.state.currentStep === 2 && isRequired('State', value)],
101 parentName: [(value) => this.state.currentStep === 3 && isRequired('Parent name', value)],
102 parentEmail: [(value) => this.state.currentStep === 3 && isRequired('Parent email', value), (value) => this.state.currentStep === 3 && isValidEmail(value)],
103 relation: [(value) => this.state.currentStep === 3 && isRequired('Relation', value)],
104 profession: [(value) => this.state.currentStep === 3 && isRequired('Profession', value)],
105 parentGender: [(value) => this.state.currentStep === 3 && isRequired('Parent gender', value)],
106 parentPhone: [(value) => this.state.currentStep === 3 && isRequired('Parent phone', value)],
107 parentAddress: [(value) => this.state.currentStep === 3 && isRequired('Parent address', value)],
108 parentCity: [(value) => this.state.currentStep === 3 && isRequired('Parent city', value)],
109 parentState: [(value) => this.state.currentStep === 3 && isRequired('Parent state', value)],
110 parentZipcode: [(value) => this.state.currentStep === 3 && isRequired('Parent zip code', value)],
111 }}
112 >
113 {({ errors }) => (
114 <StudentForm
115 isDirty={isDirty}
116 setValue={setValue}
117 getValue={getValue}
118 isSubmitted={isSubmitted}
119 errors={errors}
120 onNextClick={this.handleNextClick}
121 onBackClick={this.handleBackClick}
122 currentStep={this.state.currentStep}
123 />
124 )}
125 </Validator>
126 )}
127 </Form>
128 )
129 }
130 }
131
imports/client/views/org/admin/users/students/add/StudentForm.js
File was created 1 import React, { PropTypes } from 'react'
2 import {
3 Row,
4 Col,
5 FormGroup,
6 FormControl,
7 Button
8 } from 'react-bootstrap'
9 import DatePicker from '/imports/client/views/core/DatePicker'
10 import Label from '/imports/client/views/core/Label'
11 import Stepper from '/imports/client/views/core/Stepper'
12 import ErrorLabel from '/imports/client/views/core/ErrorLabel'
13
14 const StudentForm = props => (
15 <div className="stepy-validation">
16 <Stepper
17 steps={[
18 {
19 label: 'Personal data',
20 active: props.currentStep === 0,
21 },
22 {
23 label: 'Academic',
24 active: props.currentStep === 1,
25 },
26 {
27 label: 'Address',
28 active: props.currentStep === 2,
29 },
30 {
31 label: 'Parent info',
32 active: props.currentStep === 3,
33 }
34 ]}
35 />
36 {props.currentStep === 0 && (
37 <fieldset title="1">
38 <legend className="text-semibold">Personal data</legend>
39 <Row>
40 <Col xs={12} sm={4}>
41 <FormGroup controlId="admissionId">
42 <Label required>Admission Id</Label>
43 <FormControl
44 type="text"
45 value={props.getValue('admissionId')}
46 placeholder="admission Id"
47 onChange={e => props.setValue('admissionId', e.target.value)}
48 />
49 {props.isSubmitted() && props.errors && props.errors.admissionId && (
50 <ErrorLabel> {props.errors.admissionId} </ErrorLabel>
51 )}
52 </FormGroup>
53 </Col>
54 <Col xs={12} sm={4}>
55 <FormGroup controlId="firstName">
56 <Label required>First Name</Label>
57 <FormControl
58 type="text"
59 value={props.getValue('firstName')}
60 placeholder="First Name"
61 onChange={e => props.setValue('firstName', e.target.value)}
62 />
63 {props.isSubmitted() && props.errors && props.errors.firstName && (
64 <ErrorLabel> {props.errors.firstName} </ErrorLabel>
65 )}
66 </FormGroup>
67 </Col>
68 <Col xs={12} sm={4}>
69 <FormGroup controlId="lastName">
70 <Label required>Last Name</Label>
71 <FormControl
72 type="text"
73 value={props.getValue('lastName')}
74 placeholder="Last Name"
75 onChange={e => props.setValue('lastName', e.target.value)}
76 />
77 {props.isSubmitted() && props.errors && props.errors.lastName && (
78 <ErrorLabel> {props.errors.lastName} </ErrorLabel>
79 )}
80 </FormGroup>
81 </Col>
82 </Row>
83 <Row>
84 <Col xs={12} sm={4}>
85 <FormGroup controlId="formControlsSelect">
86 <Label>Gender</Label>
87 <FormControl componentClass="select"
88 placeholder="select"
89 value={props.getValue('gender')}
90 onChange={e => props.setValue('gender', e.target.value)}
91 >
92 <option value="male">Male</option>
93 <option value="female">Female</option>
94 </FormControl>
95 {props.isSubmitted() && props.errors && props.errors.gender && (
96 <ErrorLabel> {props.errors.gender} </ErrorLabel>
97 )}
98 </FormGroup>
99 </Col>
100 <Col xs={12} sm={4}>
101 <FormGroup controlId="email">
102 <Label required>Email</Label>
103 <FormControl
104 type="email"
105 value={props.getValue('email')}
106 placeholder="Email"
107 onChange={e => props.setValue('email', e.target.value)}
108 />
109 {props.isSubmitted() && props.errors && props.errors.email && (
110 <ErrorLabel> {props.errors.email} </ErrorLabel>
111 )}
112 </FormGroup>
113 </Col>
114 <Col xs={12} sm={4}>
115 <FormGroup>
116 <Label required>Date of birth</Label>
117 <DatePicker
118 id="dob"
119 setValue = {props.setValue}
120 value={props.getValue('dob')}
121 onChange={(e) => {
122 props.setValue('dob', e.target.value)
123 }}
124 />
125 {props.isSubmitted() && props.errors && props.errors.dob && (
126 <ErrorLabel> {props.errors.dob} </ErrorLabel>
127 )}
128 </FormGroup>
129 </Col>
130 </Row>
131 </fieldset>
132 )}
133 {props.currentStep === 1 && (
134 <fieldset title="Academic">
135 <legend className="text-semibold">Academic</legend>
136 <Row>
137 <Col xs={12} sm={4}>
138 <FormGroup controlId="rollNo">
139 <Label required>Roll No</Label>
140 <FormControl
141 type="text"
142 value={props.getValue('rollNo')}
143 placeholder="Roll No"
144 onChange={e => props.setValue('rollNo', e.target.value)}
145 />
146 {props.isSubmitted() && props.errors && props.errors.rollNo && (
147 <ErrorLabel> {props.errors.rollNo} </ErrorLabel>
148 )}
149 </FormGroup>
150 </Col>
151 <Col xs={12} sm={4}>
152 <FormGroup controlId="class">
153 <Label required>Class</Label>
154 <FormControl
155 type="text"
156 value={props.getValue('studentClass')}
157 placeholder="7"
158 onChange={e => props.setValue('studentClass', e.target.value)}
159 />
160 {props.isSubmitted() && props.errors && props.errors.studentClass && (
161 <ErrorLabel> {props.errors.studentClass} </ErrorLabel>
162 )}
163 </FormGroup>
164 </Col>
165 <Col xs={12} sm={4}>
166 <FormGroup controlId="section">
167 <Label required>Section</Label>
168 <FormControl
169 type="text"
170 value={props.getValue('section')}
171 placeholder="B"
172 onChange={e => props.setValue('section', e.target.value)}
173 />
174 {props.isSubmitted() && props.errors && props.errors.section && (
175 <ErrorLabel> {props.errors.section} </ErrorLabel>
176 )}
177 </FormGroup>
178 </Col>
179 </Row>
180 <Row>
181 <Col xs={12} sm={4}>
182 <FormGroup controlId="community">
183 <Label required>Community</Label>
184 <FormControl
185 type="text"
186 value={props.getValue('community')}
187 placeholder="General"
188 onChange={e => props.setValue('community', e.target.value)}
189 />
190 {props.isSubmitted() && props.errors && props.errors.community && (
191 <ErrorLabel> {props.errors.community} </ErrorLabel>
192 )}
193 </FormGroup>
194 </Col>
195 <Col xs={12} sm={4}>
196 <FormGroup controlId="bloodGroup">
197 <Label required>bloodGroup</Label>
198 <FormControl
199 type="text"
200 value={props.getValue('bloodGroup')}
201 placeholder="B+"
202 onChange={e => props.setValue('bloodGroup', e.target.value)}
203 />
204 {props.isSubmitted() && props.errors && props.errors.bloodGroup && (
205 <ErrorLabel> {props.errors.bloodGroup} </ErrorLabel>
206 )}
207 </FormGroup>
208 </Col>
209 <Col xs={12} sm={4}>
210 <FormGroup controlId="phone">
211 <Label required>Phone</Label>
212 <FormControl
213 type="text"
214 value={props.getValue('phone')}
215 placeholder="9999999999"
216 onChange={e => props.setValue('phone', e.target.value)}
217 />
218 {props.isSubmitted() && props.errors && props.errors.phone && (
219 <ErrorLabel> {props.errors.phone} </ErrorLabel>
220 )}
221 </FormGroup>
222 </Col>
223 </Row>
224 </fieldset>
225 )}
226 {props.currentStep === 2 && (
227 <fieldset title="Address">
228 <legend className="text-semibold">Address</legend>
229 <Row>
230 <Col xs={12} sm={4}>
231 <FormGroup controlId="address">
232 <Label required>Address</Label>
233 <FormControl
234 type="text"
235 value={props.getValue('address')}
236 placeholder="#876, Street, town"
237 onChange={e => props.setValue('address', e.target.value)}
238 />
239 {props.isSubmitted() && props.errors && props.errors.address && (
240 <ErrorLabel> {props.errors.address} </ErrorLabel>
241 )}
242 </FormGroup>
243 </Col>
244 <Col xs={12} sm={4}>
245 <FormGroup controlId="city">
246 <Label required>City</Label>
247 <FormControl
248 type="text"
249 value={props.getValue('city')}
250 placeholder="Chennai"
251 onChange={e => props.setValue('city', e.target.value)}
252 />
253 {props.isSubmitted() && props.errors && props.errors.city && (
254 <ErrorLabel> {props.errors.city} </ErrorLabel>
255 )}
256 </FormGroup>
257 </Col>
258 <Col xs={12} sm={4}>
259 <FormGroup controlId="state">
260 <Label required>State</Label>
261 <FormControl
262 type="text"
263 value={props.getValue('state')}
264 placeholder="Tamilnadu"
265 onChange={e => props.setValue('state', e.target.value)}
266 />
267 {props.isSubmitted() && props.errors && props.errors.state && (
268 <ErrorLabel> {props.errors.state} </ErrorLabel>
269 )}
270 </FormGroup>
271 </Col>
272 </Row>
273 </fieldset>
274 )}
275 {props.currentStep === 3 && (
276 <fieldset title="2">
277 <legend className="text-semibold">Parent information</legend>
278 <Row>
279 <Col xs={12} sm={4}>
280 <FormGroup controlId="parentName">
281 <Label required>Parent Name</Label>
282 <FormControl
283 type="text"
284 value={props.getValue('parentName')}
285 placeholder="John"
286 onChange={e => props.setValue('parentName', e.target.value)}
287 />
288 {props.isSubmitted() && props.errors && props.errors.parentName && (
289 <ErrorLabel> {props.errors.parentName} </ErrorLabel>
290 )}
291 </FormGroup>
292 </Col>
293 <Col xs={12} sm={4}>
294 <FormGroup controlId="parentEmail">
295 <Label required>Parent Email</Label>
296 <FormControl
297 type="text"
298 value={props.getValue('parentEmail')}
299 placeholder="john@email.com"
300 onChange={e => props.setValue('parentEmail', e.target.value)}
301 />
302 {props.isSubmitted() && props.errors && props.errors.parentEmail && (
303 <ErrorLabel> {props.errors.parentEmail} </ErrorLabel>
304 )}
305 </FormGroup>
306 </Col>
307 <Col xs={12} sm={4}>
308 <FormGroup controlId="relation">
309 <Label required>Relation</Label>
310 <FormControl
311 type="text"
312 value={props.getValue('relation')}
313 placeholder="Father"
314 onChange={e => props.setValue('relation', e.target.value)}
315 />
316 {props.isSubmitted() && props.errors && props.errors.relation && (
317 <ErrorLabel> {props.errors.relation} </ErrorLabel>
318 )}
319 </FormGroup>
320 </Col>
321 </Row>
322 <Row>
323 <Col xs={12} sm={4}>
324 <FormGroup controlId="profession">
325 <Label required>Profession</Label>
326 <FormControl
327 type="text"
328 value={props.getValue('profession')}
329 placeholder="Farmer"
330 onChange={e => props.setValue('profession', e.target.value)}
331 />
332 {props.isSubmitted() && props.errors && props.errors.profession && (
333 <ErrorLabel> {props.errors.profession} </ErrorLabel>
334 )}
335 </FormGroup>
336 </Col>
337 <Col xs={12} sm={4}>
338 <FormGroup controlId="parentGender">
339 <Label>Parent Gender</Label>
340 <FormControl componentClass="select"
341 placeholder="select"
342 value={props.getValue('parentGender')}
343 onChange={e => props.setValue('parentGender', e.target.value)}
344 >
345 <option value="male">Male</option>
346 <option value="female">Female</option>
347 </FormControl>
348 {props.isSubmitted() && props.errors && props.errors.parentGender && (
349 <ErrorLabel> {props.errors.parentGender} </ErrorLabel>
350 )}
351 </FormGroup>
352 </Col>
353 <Col xs={12} sm={4}>
354 <FormGroup controlId="parentPhone">
355 <Label required>Parent Phone</Label>
356 <FormControl
357 type="text"
358 value={props.getValue('parentPhone')}
359 placeholder="9876543210"
360 onChange={e => props.setValue('parentPhone', e.target.value)}
361 />
362 {props.isSubmitted() && props.errors && props.errors.parentPhone && (
363 <ErrorLabel> {props.errors.parentPhone} </ErrorLabel>
364 )}
365 </FormGroup>
366 </Col>
367 </Row>
368 <Row>
369 <Col xs={12} sm={4}>
370 <FormGroup controlId="parentAddress">
371 <Label required>Parent Address</Label>
372 <FormControl
373 type="text"
374 value={props.getValue('parentAddress')}
375 placeholder="#12, street, town"
376 onChange={e => props.setValue('parentAddress', e.target.value)}
377 />
378 {props.isSubmitted() && props.errors && props.errors.parentAddress && (
379 <ErrorLabel> {props.errors.parentAddress} </ErrorLabel>
380 )}
381 </FormGroup>
382 </Col>
383 <Col xs={12} sm={4}>
384 <FormGroup controlId="parentCity">
385 <Label required>Parent City</Label>
386 <FormControl
387 type="text"
388 value={props.getValue('parentCity')}
389 placeholder="Chennai"
390 onChange={e => props.setValue('parentCity', e.target.value)}
391 />
392 {props.isSubmitted() && props.errors && props.errors.parentCity && (
393 <ErrorLabel> {props.errors.parentCity} </ErrorLabel>
394 )}
395 </FormGroup>
396 </Col>
397 <Col xs={12} sm={4}>
398 <FormGroup controlId="parentState">
399 <Label required>Parent State</Label>
400 <FormControl
401 type="text"
402 value={props.getValue('parentState')}
403 placeholder="600031"
404 onChange={e => props.setValue('parentState', e.target.value)}
405 />
406 {props.isSubmitted() && props.errors && props.errors.parentState && (
407 <ErrorLabel> {props.errors.parentState} </ErrorLabel>
408 )}
409 </FormGroup>
410 </Col>
411 </Row>
412 <Row>
413 <Col xs={12} sm={4}>
414 <FormGroup controlId="parentZipcode">
415 <Label required>Parent Zipcode</Label>
416 <FormControl
417 type="text"
418 value={props.getValue('parentZipcode')}
419 placeholder="600031"
420 onChange={e => props.setValue('parentZipcode', e.target.value)}
421 />
422 {props.isSubmitted() && props.errors && props.errors.parentZipcode && (
423 <ErrorLabel> {props.errors.parentZipcode} </ErrorLabel>
424 )}
425 </FormGroup>
426 </Col>
427 </Row>
428 </fieldset>
429 )}
430 <div style={{ textAlign: 'left' }}>
431 {props.currentStep > 0 && (
432 <div style={{ display: 'inline-block', marginRight: 10 }}>
433 <Button onClick={props.onBackClick}>
434 <i className="icon-arrow-left13 position-left"></i>
435 BACK
436 </Button>
437
438 </div>
439 )}
440 {props.currentStep < 3 && (
441 <div style={{ display: 'inline-block' }}>
442 <Button
443 bsStyle="primary"
444 onClick={props.onNextClick}
445 >
446 NEXT
447 <i className="icon-arrow-right14 position-right" />
448 </Button>
449 </div>
450 )}
451 {props.currentStep === 3 && (
452 <div style={{ display: 'inline-block' }}>
453 <Button
454 bsStyle="primary"
455 onClick={props.onNextClick}
456 >
457 SAVE
458 <i className="fa fa-check" />
459 </Button>
460 </div>
461 )}
462 </div>
463 </div>
464 )
465
466 StudentForm.propTypes = {
467 currentStep: PropTypes.number.isRequired,
468 onNextClick: PropTypes.func.isRequired,
469 onBackClick: PropTypes.func.isRequired,
470 setValue: PropTypes.func.isRequired,
471 getValue: PropTypes.func.isRequired,
472 }
473
474 export default StudentForm
475
imports/client/views/org/admin/users/students/add/addStudent.js
File was created 1 import _ from 'lodash';
2 import { Meteor } from 'meteor/meteor';
3 import React, { Component } from 'react';
4 import { Link,browserHistory } from 'react-router';
5 import { FormGroup,Panel,Table,
6 ButtonToolbar,Modal,
7 FormControl,Glyphicon,Button } from 'react-bootstrap';
8 import { AddStudentFormContainer } from './AddStudentFormContainer';
9
10 const style = {
11 margin: 12,
12 };
13 export class AddStudent extends Component {
14 constructor(props) {
15 super(props);
16 this.state = {
17 show: false
18 };
19 this.showModal = this.showModal.bind(this);
20 this.hideModal = this.hideModal.bind(this);
21 this.onUpdate = this.onUpdate.bind(this);
22 };
23
24 showModal() {
25 this.setState({show: true});
26 }
27
28 hideModal() {
29 this.setState({show: false});
30 }
31 onUpdate(key, value) {
32 this.setState({[key]: value});
33 };
34
35 render() {
36 return (
37 <ButtonToolbar>
38 <Button bsStyle="primary" onClick={this.showModal}>
39 Add Student
40 </Button>
41 <Modal
42 {...this.props}
43 show={this.state.show}
44 onHide={this.hideModal}
45 dialogClassName="custom-modal"
46 bsSize="large"
47 >
48 <Modal.Header closeButton>
49 <Modal.Title id="contained-modal-title-lg">Add Student</Modal.Title>
50 </Modal.Header>
51 <Modal.Body>
52 <AddStudentFormContainer
53 hideModal = {this.hideModal}
54 />
55 </Modal.Body>
56 {/*
57 <Modal.Footer>
58 <Button onClick={this.hideModal}>Close</Button>
59 </Modal.Footer>
60 */}
61 </Modal>
62 </ButtonToolbar>
63 );
64 };
65
66 };
67
imports/client/views/org/admin/users/students/add/addStudentForm.js
File was created 1 import _ from 'lodash';
2 import { Meteor } from 'meteor/meteor';
3
4 import React, { Component } from 'react';
5 import { Link,browserHistory } from 'react-router';
6 import { Form, FormGroup,InputGroup,
7 DropdownButton,MenuItem,ControlLabel,
8 SplitButton,
9 FormControl,Glyphicon,Button } from 'react-bootstrap';
10 import DatePicker from 'react-bootstrap-date-picker'
11 import {addStudentManually} from '/imports/collections/students/methods';
12
13 export class AddStudentForm extends Component {
14
15 constructor(props) {
16 super(props);
17 this.state = {
18 admissionId: "123",
19 firstName: "first",
20 lastName: "last",
21 middleName: "middle",
22 email: "deepak125.dk+21@gmail.com",
23 dob: "",
24 formattedDob: "",
25 gender: "male",
26 rollNo: "1",
27 class: "2",
28 section: "B",
29 community: "SC",
30 bloodGroup: "B+",
31 phone: "9876543321",
32 address: "address",
33 city: "chennai",
34 state: "tn",
35 parentName: "parentName",
36 parentEmail: "deepak125.dk+41@gmail.com",
37 relation: "father",
38 profession: "farmer",
39 parentGender: "male",
40 parentPhone: "987655412",
41 parentAddress: "parentAddress",
42 parentCity: "parentCity",
43 parentState: "parentState",
44 parentZipcode: "parentZipcode",
45 };
46 this.onUpdate = this.onUpdate.bind(this);
47 this.handleDob = this.handleDob.bind(this);
48 };
49
50 onUpdate(key, value) {
51 this.setState({[key]: value});
52 };
53
54 handleDob(value, formattedValue) {
55 this.setState({
56 dob: value, // ISO String, ex: "2016-11-19T12:00:00.000Z"
57 formattedDob: formattedValue // Formatted String, ex: "11/19/2016"
58 });
59 }
60 addStudent(e){
61 e.preventDefault();
62 e.persist();
63 const firstName = this.state.firstName;
64 const middleName = this.state.middleName;
65 const lastName = this.state.lastName;
66 const admissionId = this.state.admissionId;
67 const email = this.state.email;
68 const dob = this.state.dob;
69 const formattedDob = this.state.formattedDob;
70 const gender = this.state.gender;
71 const rollNo = this.state.rollNo;
72 const studentclass = this.state.class;
73 const section = this.state.section;
74 const community = this.state.community;
75 const bloodGroup = this.state.bloodGroup;
76 const phone = this.state.phone;
77 const address = this.state.address;
78 const city = this.state.city;
79 const state = this.state.state;
80 const parentName = this.state.parentName;
81 const parentEmail = this.state.parentEmail;
82 const relation = this.state.relation;
83 const profession = this.state.profession;
84 const parentGender = this.state.parentGender;
85 const parentPhone = this.state.parentPhone;
86 const parentAddress = this.state.parentAddress;
87 const parentCity = this.state.parentCity;
88 const parentState = this.state.parentState;
89 const parentZipcode = this.state.parentZipcode;
90 if(admissionId==""){
91 Bert.alert('Enter Admission Id!', 'danger');
92 }else if(firstName==""){
93 Bert.alert('Enter Fist Name', 'danger');
94 } else if(middleName==""){
95 Bert.alert('Enter Middle name!', 'danger');
96 }else if(lastName==""){
97 Bert.alert('Enter Last name!', 'danger');
98 }else if(email==""){
99 Bert.alert('Enter email!', 'danger');
100 }else if(dob==""){
101 Bert.alert('Enter DOB!', 'danger');
102 }else if(gender==""){
103 Bert.alert('Enter Student Gender!', 'danger');
104 }else if(studentclass==""){
105 Bert.alert('Enter Class!', 'danger');
106 }else if(section==""){
107 Bert.alert('Enter Section!', 'danger');
108 }else if(community==""){
109 Bert.alert('Enter Section!', 'danger');
110 }else if(bloodGroup==""){
111 Bert.alert('Enter Blood Group!', 'danger');
112 }else if(phone==""){
113 Bert.alert('Enter phone!', 'danger');
114 }else if(address==""){
115 Bert.alert('Enter address!', 'danger');
116 }else if(city==""){
117 Bert.alert('Enter city!', 'danger');
118 }else if(state==""){
119 Bert.alert('Enter state!', 'danger');
120 }else if(parentName==""){
121 Bert.alert('Enter Parent name!', 'danger');
122 }else if(parentEmail==""){
123 Bert.alert('Enter Parent Email!', 'danger');
124 }else if(relation==""){
125 Bert.alert('Enter relation!', 'danger');
126 }else if(profession==""){
127 Bert.alert('Enter parent profession!', 'danger');
128 }else if(parentGender==""){
129 Bert.alert("Enter Parent's Gender!", 'danger');
130 }else if(parentPhone==""){
131 Bert.alert("Enter Parent's Phone!", 'danger');
132 }else if(parentAddress==""){
133 Bert.alert("Enter Parent's Address!", 'danger');
134 }else if(parentCity==""){
135 Bert.alert("Enter Parent's City!", 'danger');
136 }else if(parentState==""){
137 Bert.alert("Enter Parent's State!", 'danger');
138 }else if(parentZipcode==""){
139 Bert.alert("Enter Parent's zipcode!", 'danger');
140 }else{
141 addStudentManually.call({
142 admissionId,
143 firstName,
144 middleName,
145 lastName,
146 email,
147 dob,
148 formattedDob,
149 gender,
150 rollNo,
151 studentclass,
152 section,
153 community,
154 bloodGroup,
155 phone,
156 address,
157 city,
158 state,
159 parentName,
160 parentEmail,
161 relation,
162 profession,
163 parentGender,
164 parentPhone,
165 parentAddress,
166 parentCity,
167 parentState,
168 parentZipcode
169 }, function (error, result) {
170 console.log(error);
171 console.log(result);
172 });
173 }
174 }
175 render() {
176 return (
177 <Form className="steps-validation wizard clearfix" onSubmit={ (e) => this.addStudent(e) } inline>
178 <div className="steps clearfix">
179 <ul role="tablist">
180 <li role="tab" className="first current" aria-disabled="false" aria-selected="true">
181 <a id="steps-uid-4-t-0" href="#steps-uid-4-h-0" aria-controls="steps-uid-4-p-0">
182 <span className="current-info audible">current step: </span><span className="number">1</span> Personal data
183 </a>
184 </li>
185 <li role="tab" className="disabled" aria-disabled="true">
186 <a id="steps-uid-4-t-1" href="#steps-uid-4-h-1" aria-controls="steps-uid-4-p-1">
187 <span className="number">2</span> Your education\n\
188 </a>
189 </li>
190 <li role="tab" className="disabled" aria-disabled="true">
191 <a id="steps-uid-4-t-2" href="#steps-uid-4-h-2" aria-controls="steps-uid-4-p-2">
192 <span className="number">3</span> Your experience
193 </a>
194 </li>
195 <li role="tab" className="disabled last" aria-disabled="true">
196 <a id="steps-uid-4-t-3" href="#steps-uid-4-h-3" aria-controls="steps-uid-4-p-3">
197 <span className="number">4</span> Additional info
198 </a>
199 </li>
200 </ul>
201 </div>
202 <div className="content clearfix">
203 <h6 id="steps-uid-4-h-0" tabindex="-1" className="title current">Personal data</h6>
204 <div id="steps-uid-4-p-0" role="tabpanel" aria-labelledby="steps-uid-4-h-0" className="body current">
205 <div className="row">
206 <div className="col-md-6">
207
208 <FormGroup controlId="admissionId">
209 <ControlLabel>Admission Id</ControlLabel>
210 <FormControl
211 type="text"
212 value={this.state.admissionId}
213 placeholder="admission Id"
214 onChange={e=>this.onUpdate('admissionId',e.target.value)}
215 />
216 </FormGroup>
217
218 </div>
219
220 <div className="col-md-6">
221
222 <FormGroup controlId="firstName">
223 <ControlLabel>First Name</ControlLabel>
224 <FormControl
225 type="text"
226 value={this.state.firstName}
227 placeholder="First Name"
228 onChange={e=>this.onUpdate('firstName',e.target.value)}
229 />
230 </FormGroup>
231
232 </div>
233 </div>
234 </div>
235 </div>
236
237
238 <FormGroup controlId="admissionId">
239 <ControlLabel>Admission Id</ControlLabel>
240 <FormControl
241 type="text"
242 value={this.state.admissionId}
243 placeholder="admission Id"
244 onChange={e=>this.onUpdate('admissionId',e.target.value)}
245 />
246 </FormGroup>
247
248 <FormGroup controlId="firstName">
249 <ControlLabel>First Name</ControlLabel>
250 <FormControl
251 type="text"
252 value={this.state.firstName}
253 placeholder="First Name"
254 onChange={e=>this.onUpdate('firstName',e.target.value)}
255 />
256 </FormGroup>
257 <FormGroup controlId="middleName">
258 <ControlLabel>Middle Name</ControlLabel>
259 <FormControl
260 type="text"
261 value={this.state.middleName}
262 placeholder="Middle Name"
263 onChange={e=>this.onUpdate('middleName',e.target.value)}
264 />
265 </FormGroup>
266
267 <FormGroup controlId="lastName">
268 <ControlLabel>Last Name</ControlLabel>
269 <FormControl
270 type="text"
271 value={this.state.lastName}
272 placeholder="Last Name"
273 onChange={e=>this.onUpdate('lastName',e.target.value)}
274 />
275
276 </FormGroup>
277 <FormGroup controlId="email">
278 <ControlLabel>Email</ControlLabel>
279 <FormControl
280 type="email"
281 value={this.state.email}
282 placeholder="Email"
283 onChange={e=>this.onUpdate('email',e.target.value)}
284 />
285 </FormGroup>
286 <FormGroup>
287 <ControlLabel>Date of birth</ControlLabel>
288 <DatePicker id="dob"
289 value={this.state.dob}
290 onChange={this.handleDob}
291 />
292 </FormGroup>
293
294 <FormGroup controlId="formControlsSelect">
295 <ControlLabel>Gender</ControlLabel>
296 <FormControl componentClass="select"
297 placeholder="select"
298 value={this.state.gender}
299 onChange={e=>this.onUpdate('gender',e.target.value)}
300 >
301 <option value="male">Male</option>
302 <option value="female">Female</option>
303 </FormControl>
304 </FormGroup>
305
306 <FormGroup controlId="rollNo">
307 <ControlLabel>Roll No</ControlLabel>
308 <FormControl
309 type="text"
310 value={this.state.rollNo}
311 placeholder="Roll No"
312 onChange={e=>this.onUpdate('rollNo',e.target.value)}
313 />
314 </FormGroup>
315 <FormGroup controlId="class">
316 <ControlLabel>Class</ControlLabel>
317 <FormControl
318 type="text"
319 value={this.state.class}
320 placeholder="7"
321 onChange={e=>this.onUpdate('class',e.target.value)}
322 />
323 </FormGroup>
324 <FormGroup controlId="section">
325 <ControlLabel>Section</ControlLabel>
326 <FormControl
327 type="text"
328 value={this.state.section}
329 placeholder="B"
330 onChange={e=>this.onUpdate('section',e.target.value)}
331 />
332 </FormGroup>
333
334 <FormGroup controlId="community">
335 <ControlLabel>Community</ControlLabel>
336 <FormControl
337 type="text"
338 value={this.state.community}
339 placeholder="General"
340 onChange={e=>this.onUpdate('community',e.target.value)}
341 />
342 </FormGroup>
343
344 <FormGroup controlId="bloodGroup">
345 <ControlLabel>bloodGroup</ControlLabel>
346 <FormControl
347 type="text"
348 value={this.state.bloodGroup}
349 placeholder="B+"
350 onChange={e=>this.onUpdate('bloodGroup',e.target.value)}
351 />
352 </FormGroup>
353
354 <FormGroup controlId="phone">
355 <ControlLabel>Phone</ControlLabel>
356 <FormControl
357 type="text"
358 value={this.state.phone}
359 placeholder="9999999999"
360 onChange={e=>this.onUpdate('phone',e.target.value)}
361 />
362 </FormGroup>
363
364 <FormGroup controlId="address">
365 <ControlLabel>Address</ControlLabel>
366 <FormControl
367 type="text"
368 value={this.state.address}
369 placeholder="#876, Street, town"
370 onChange={e=>this.onUpdate('address',e.target.value)}
371 />
372 </FormGroup>
373
374 <FormGroup controlId="city">
375 <ControlLabel>City</ControlLabel>
376 <FormControl
377 type="text"
378 value={this.state.city}
379 placeholder="Chennai"
380 onChange={e=>this.onUpdate('city',e.target.value)}
381 />
382 </FormGroup>
383
384 <FormGroup controlId="state">
385 <ControlLabel>State</ControlLabel>
386 <FormControl
387 type="text"
388 value={this.state.state}
389 placeholder="Tamilnadu"
390 onChange={e=>this.onUpdate('state',e.target.value)}
391 />
392 </FormGroup>
393
394 <FormGroup controlId="parentName">
395 <ControlLabel>Parent Name</ControlLabel>
396 <FormControl
397 type="text"
398 value={this.state.parentName}
399 placeholder="John"
400 onChange={e=>this.onUpdate('parentName',e.target.value)}
401 />
402 </FormGroup>
403
404 <FormGroup controlId="parentEmail">
405 <ControlLabel>Parent Email</ControlLabel>
406 <FormControl
407 type="text"
408 value={this.state.parentEmail}
409 placeholder="john@email.com"
410 onChange={e=>this.onUpdate('parentEmail',e.target.value)}
411 />
412 </FormGroup>
413
414 <FormGroup controlId="relation">
415 <ControlLabel>Relation</ControlLabel>
416 <FormControl
417 type="text"
418 value={this.state.relation}
419 placeholder="Father"
420 onChange={e=>this.onUpdate('relation',e.target.value)}
421 />
422 </FormGroup>
423
424 <FormGroup controlId="profession">
425 <ControlLabel>Profession</ControlLabel>
426 <FormControl
427 type="text"
428 value={this.state.profession}
429 placeholder="Farmer"
430 onChange={e=>this.onUpdate('profession',e.target.value)}
431 />
432 </FormGroup>
433
434 <FormGroup controlId="parentGender">
435 <ControlLabel>Parent Gender</ControlLabel>
436 <FormControl componentClass="select"
437 placeholder="select"
438 value={this.state.parentGender}
439 onChange={e=>this.onUpdate('parentGender',e.target.value)}
440 >
441 <option value="male">Male</option>
442 <option value="female">Female</option>
443 </FormControl>
444 </FormGroup>
445
446 <FormGroup controlId="parentPhone">
447 <ControlLabel>Parent Phone</ControlLabel>
448 <FormControl
449 type="text"
450 value={this.state.parentPhone}
451 placeholder="9876543210"
452 onChange={e=>this.onUpdate('parentPhone',e.target.value)}
453 />
454 </FormGroup>
455
456 <FormGroup controlId="parentAddress">
457 <ControlLabel>Parent Address</ControlLabel>
458 <FormControl
459 type="text"
460 value={this.state.parentAddress}
461 placeholder="#12, street, town"
462 onChange={e=>this.onUpdate('parentAddress',e.target.value)}
463 />
464 </FormGroup>
465
466 <FormGroup controlId="parentCity">
467 <ControlLabel>Parent City</ControlLabel>
468 <FormControl
469 type="text"
470 value={this.state.parentCity}
471 placeholder="Chennai"
472 onChange={e=>this.onUpdate('parentCity',e.target.value)}
473 />
474 </FormGroup>
475
476 <FormGroup controlId="parentState">
477 <ControlLabel>Parent State</ControlLabel>
478 <FormControl
479 type="text"
480 value={this.state.parentState}
481 placeholder="Tamilnadu"
482 onChange={e=>this.onUpdate('parentState',e.target.value)}
483 />
484 </FormGroup>
485
486 <FormGroup controlId="parentZipcode">
487 <ControlLabel>Parent Zipcode</ControlLabel>
488 <FormControl
489 type="text"
490 value={this.state.parentZipcode}
491 placeholder="600031"
492 onChange={e=>this.onUpdate('parentZipcode',e.target.value)}
493 />
494 </FormGroup>
495 <Button type="submit" bsStyle="default">Add Student</Button>
496 </Form>
497 );
498 };
499
500 };
501
imports/client/views/org/admin/users/students/index.js
File was created 1 // import { StudentDataController } from '/imports/client/views/org/admin/students/index'
2 import _ from 'lodash';
3 import {
4 composeWithTracker,
5 compose,
6 composeAll
7 } from 'react-komposer';
8 import { Loading } from '/imports/client/components/Loading';
9
10 import { Orgs } from '/imports/collections/orgs/index';
11 import { Users } from '/imports/collections/users/index';
12 import { StudentView } from './StudentView';
13 import { Students } from '/imports/collections/students/index';
14
15
16 const meteorTick = (props, onData) => {
17 Shelf.layout.set({
18 bulb: 'SETTINGS',
19 subbulb: 'USERS',
20 view: 'STUDENTS'
21 });
22 const handles = [
23 Meteor.subscribe('users.current'),
24 Meteor.subscribe('orgs.current'),
25 Meteor.subscribe('users.forMyOrg'),
26 Meteor.subscribe('student.forMyOrg'),
27 ];
28
29 if(_.every(handles, (handle) => (handle.ready()) )) {
30 const user = Users.current();
31 const org = Orgs.current();
32 students = Users.find({"role":"STUDENT"}).fetch() ? Users.find({"role":"STUDENT"}).fetch() : "";
33 studentData = Students.find().fetch() ? Students.find().fetch() : "";
34 for(var i=0; i< studentData.length; i++){
35 for(var j=0; j< students.length; j++){
36 if(studentData[i].userId == students[j]._id && studentData[i].admissionId){
37 studentData[i].firstName = students[j].firstName;
38 studentData[i].lastName = students[j].lastName;
39 }else{
40
41 }
42 }
43 }
44 onData(null, {
45 data: {
46 user: user,
47 org: org,
48 studentData: studentData
49 },
50 });
51 }
52
53 return () => {
54 _.each(handles, (handle) => handle.stop() );
55 };
56 };
57
58
59 const reduxTick = (props, onData) => {
60 onData(null, {
61 data: {}
62 });
63 };
64
65
66 export const StudentDataController = composeAll(
67 composeWithTracker(meteorTick, Loading),
68 compose(reduxTick, Loading),
69 )(StudentView);
70
imports/client/views/org/admin/users/students/student.css
File was created 1 .btn-toolbar {
2 display: inline-block;
3 font-size: 0;
4 margin-right: 12px;
5 }
6
imports/client/views/org/admin/users/students/view/StudentRow.js
File was created 1 import _ from 'lodash';
2 import { Meteor } from 'meteor/meteor';
3
4 import React, { Component } from 'react';
5 import { Link,browserHistory } from 'react-router';
6 import { FormGroup,
7 FormControl,Glyphicon,Button } from 'react-bootstrap';
8
9
10 export class StudentRow extends Component {
11
12 constructor(props) {
13 super(props);
14 this.state = {
15 editOpen: false,
16 };
17 this.onUpdate = this.onUpdate.bind(this);
18 this.toggleEditOpen = this.toggleEditOpen.bind(this);
19 this.deleteStudent = this.deleteStudent.bind(this);
20 };
21
22 onUpdate(key, value) {
23 this.setState({[key]: value});
24 };
25 toggleEditOpen(){
26 this.setState({
27 editOpen : !this.state.editOpen
28 })
29 }
30 deleteStudent(){
31 console.log("Delete");
32 console.log(this.props.student._id);
33 }
34 render() {
35 const {student} = this.props;
36 if(student.firstName){
37 return (
38 <tr>
39 <td>{student.firstName}</td>
40 <td>{student.lastName}</td>
41 <td>{student.class}</td>
42 <td>{student.dob? moment(student.dob).format("LL") : <span></span>}</td>
43 <td><span className="label label-success">Active</span></td>
44 <td className="text-center">
45 <ul className="icons-list">
46 <li className={this.state.editOpen? "dropdown open": "dropdown" }>
47 <span className="dropdown-toggle" onClick={this.toggleEditOpen}>
48 <i className="icon-menu9"></i>
49 </span>
50 <ul className="dropdown-menu dropdown-menu-right">
51 <li onClick={this.viewStudent}><Link to={`/student/${student._id}`}><span><i className="fa fa-binoculars"></i>View </span></Link></li>
52 <li onClick={this.editStudent}><span><i className="fa fa-pencil-square"></i> Edit </span></li>
53 <li onClick={this.deleteStudent}><span><i className="fa fa-exclamation-triangle"></i> Delete</span></li>
54 </ul>
55 </li>
56 </ul>
57 </td>
58 </tr>
59 );
60 }else {
61 return null;
62 }
63
64 };
65
66 };
67
imports/client/views/org/admin/users/students/view/StudentTable.js
File was created 1 import _ from 'lodash';
2 import { Meteor } from 'meteor/meteor';
3
4 import React, { Component } from 'react';
5 import { Link,browserHistory } from 'react-router';
6 import { FormGroup,Panel,Table,
7 ButtonToolbar,Modal,
8 FormControl,Glyphicon,Button, } from 'react-bootstrap';
9 import {moment} from 'meteor/momentjs:moment'
10 import {StudentRow} from './StudentRow'
11 import {BootstrapTable, TableHeaderColumn}from 'react-bootstrap-table';
12
13 const options = {
14 page: 0, // which page you want to show as default
15 sizePerPageList: [ {
16 text: '5', value: 5
17 }, {
18 text: '10', value: 10
19 }], // you can change the dropdown list for size per page
20 sizePerPage: 5, // which size per page you want to locate as default
21 pageStartIndex: 0, // where to start counting the pages
22 paginationSize: 3, // the pagination bar size.
23 prePage: 'Prev', // Previous page button text
24 nextPage: 'Next', // Next page button text
25 firstPage: 'First', // First page button text
26 lastPage: 'Last', // Last page button text
27 paginationShowsTotal: false, // Accept bool or function
28 paginationPosition: 'bottom' // default is bottom, top and both is all available
29 // hideSizePerPage: true > You can hide the dropdown for sizePerPage
30 // alwaysShowAllBtns: true // Always show next and previous button
31 // withFirstAndLast: false > Hide the going to First and Last page button
32 };
33
34 function dateFormatter(cell, row) {
35 if(cell){
36 cell = new Date(cell);
37 return `${('0' + cell.getDate()).slice(-2)}/${('0' + (cell.getMonth() + 1)).slice(-2)}/${cell.getFullYear()}`;
38 }
39 }
40 export class StudentTable extends Component {
41
42 constructor(props) {
43 super(props);
44 this.state = {
45 show: false,
46 panleOpen: true,
47 };
48 this.onUpdate = this.onUpdate.bind(this);
49 this.togglePanel = this.togglePanel.bind(this);
50 };
51 onUpdate(key, value) {
52 this.setState({[key]: value});
53 };
54 togglePanel(){
55 this.setState({panleOpen: !this.state.panleOpen});
56 }
57
58 render() {
59 studentData = this.props.studentData;
60 console.log("this.props.studentData");
61 console.log(this.props.studentData);
62 return (
63 <div className="panel panel-flat">
64 <div className="panel-heading">
65 <h5 className="panel-title">Student Details</h5>
66 <div className="heading-elements">
67 <ul className="icons-list">
68 <li onClick={this.togglePanel}><a data-action="collapse" className={this.state.panleOpen?"rotate-180":null}></a></li>
69 </ul>
70 </div>
71 </div>
72 <Panel collapsible expanded={this.state.panleOpen}>
73 <BootstrapTable data={ studentData } pagination={ true } options={ options } >
74 <TableHeaderColumn dataField='_id' isKey={ true } dataSort={ true } filter={ { type: 'TextFilter' } }>Admission Id</TableHeaderColumn>
75 <TableHeaderColumn dataField='firstName' dataSort={ true } filter={ { type: 'TextFilter' } }>First Name</TableHeaderColumn>
76 <TableHeaderColumn dataField='lastName' dataSort={ true } filter={ { type: 'TextFilter' } }>Last Name</TableHeaderColumn>
77 <TableHeaderColumn dataField='class' dataSort={ true } filter={ { type: 'TextFilter' } }>Class</TableHeaderColumn>
78 <TableHeaderColumn dataField='dob' dataFormat={ dateFormatter } >DOB</TableHeaderColumn>
79 </BootstrapTable>
80 </Panel>
81 </div>
82 );
83 };
84
85 };
86