HOME

import React, { Component } from "react";	
import axios from 'axios'; 	
import Script from "@gumgum/react-script-tag";  
import Copyright from "../basic/Copyright";  
import Preloader from "../basic/Preloader";
import HeaderPart from "../layout/HeaderPart";

class StudentAdd extends Component {
  constructor() {
    super();
    this.state = {
		showError: false,
		showSuccess:false,
		messgae:'',
		stateData:[],
		courseList:[],   
		classList:[],   
		districtData:[],
		images:[],   		
		staff_no:'',   
		totalfare:'',
		transconcession_amount:'',
		busfare:'',
		bus_no:'',
		route_id:'',
		tab_id:'personal_detail',      
		station_id:'',
		class_first:'',
		course_first:'',
		board_roll:'',
		registration_no:'',
		roll_no:'',
		section_id:'',
		class_id:'',
		course_id:'',
		admission_no:'',
		admission_date:'',
		residence_no:'',
		f_email:'',
		f_mobile:'',
		f_designation:'',
		f_income:'',
		f_occupation:'',
		mother_name:'',
		father_name:'',
		branch_address:'',
		ifsc:'',
		account_no:'',
		pincode:'',
		district_id:'',
		state_id:'',
		temporary_address:'',
		permanent_address:'',
		aadhar_no:'',
		blood_group:'',
		email:'',
		mobile:'',
		marital_status:'',
		religion:'',  
		caste:'',
		dob:'',
		student_name:'',
		insert_id:''   	
    };
    this.formSubmit = this.formSubmit.bind(this);
    this.handleChange = this.handleChange.bind(this);
	this.handleFileUpload = this.handleFileUpload.bind(this);  
    this.changeDistrict = this.changeDistrict.bind(this);
	this.handleTab = this.handleTab.bind(this);   
	this.input = React.createRef();    	
  
  }
  handleChange(event){
    event.preventDefault();
    this.setState({ [event.target.name]: event.target.value });   
}
handleTab = (event,param) => { 
	console.log(param);  	  			
   this.setState({tab_id:param,showError:false,showSuccess:false});  					
}    
handleFileUpload(e) {
	
    const imagesArray = [];     

	for (let i=0;i<this.state.images.length;i++) {		      
	  imagesArray.push(this.state.images[i]);  	
    }  	

    for (let i=0;i<e.target.files.length;i++) {      
      imagesArray.push(e.target.files[i]);
    }
    this.setState({
      images: imagesArray,  
    });
   
}   

changeDistrict(e){
    
	this.setState({
			state_id: e.target.value			
		});	
		
	   const id = e.target.value;  			
	   
	   if(id >0)
	   {
		   axios.get(`/studentregister/getdistrict/${id}`).then(response => {   					 
				this.setState({   
					districtData: response.data.data ? response.data.data :[]	 
				}); 
			})
			.catch(error => {  	   
			   console.log(error.message); 	
			})    
	   }
	   else
	   {
		   this.setState({   
					districtData:[]	 
				}); 
	   }
	
  }

  formSubmit(event){
    event.preventDefault();    

const { student_name,dob,gender,nationality,caste,religion,marital_status,mobile,email,blood_group,aadhar_no,permanent_address,
temporary_address,state_id,district_id,pincode,account_no,ifsc,branch_address,father_name,mother_name,f_occupation,f_income,
f_designation,f_mobile,f_email,residence_no,admission_date,admission_no,course_id,class_id,section_id,roll_no,registration_no,
board_roll,leaving_certificate,course_first,class_first,compulsory_subject,elective_subject,additional_subject,transportation,
station_id,route_id,bus_no,transport_concession,busfare,transconcession_amount,totalfare,staffchild,staff_no,management_concession,applicable } = event.target; 

	let s_name=(student_name)?student_name.value:'';  	
	let s_dob=(dob)?dob.value:''; 
	let s_gender=(gender)?gender.value:'';  	
	let s_nationality=(nationality)?nationality.value:'';     
	let s_caste=(caste)?caste.value:'';  	
	let s_religion=(religion)?religion.value:''; 
	let s_marital_status=(marital_status)?marital_status.value:'';  	
	let s_mobile=(mobile)?mobile.value:''; 
	let s_email=(email)?email.value:''; 
	let s_blood_group=(blood_group)?blood_group.value:'';  	
	let s_aadhar_no=(aadhar_no)?aadhar_no.value:'';     
	let s_permanent_address=(permanent_address)?permanent_address.value:'';  	
	let s_temporary_address=(temporary_address)?temporary_address.value:'';    
	let s_state_id=(state_id)?state_id.value:'';  	
	let s_district_id=(district_id)?district_id.value:''; 
	let s_pincode=(pincode)?pincode.value:'';  	
	let s_account_no=(account_no)?account_no.value:''; 
	let s_ifsc=(ifsc)?ifsc.value:'';  	
	let s_branch_address=(branch_address)?branch_address.value:'';     
	let s_father_name=(father_name)?father_name.value:'';  
	
	let s_mother_name=(mother_name)?mother_name.value:''; 
	let s_f_occupation=(f_occupation)?f_occupation.value:'';    	
	let s_f_income=(f_income)?f_income.value:''; 
	let s_f_designation=(f_designation)?f_designation.value:''; 
	let s_f_mobile=(f_mobile)?f_mobile.value:'';  	
	let s_f_email=(f_email)?f_email.value:'';     
	let s_residence_no=(residence_no)?residence_no.value:'';  	
	let s_admission_date=(admission_date)?admission_date.value:'';    
	let s_admission_no=(admission_no)?admission_no.value:'';  	
	let s_course_id=(course_id)?course_id.value:'';    	
	let s_class_id=(class_id)?class_id.value:'';  	
	let s_section_id=(section_id)?section_id.value:''; 
	let s_roll_no=(roll_no)?roll_no.value:'';  	
	let s_registration_no=(registration_no)?registration_no.value:'';     
	let s_board_roll=(board_roll)?board_roll.value:'';  	
	let s_leaving_certificate=(leaving_certificate)?leaving_certificate.value:''; 
	let s_course_first=(course_first)?course_first.value:'';  	
	let s_class_first=(class_first)?class_first.value:''; 
	let s_compulsory_subject=(compulsory_subject)?compulsory_subject.value:''; 
	let s_elective_subject=(elective_subject)?elective_subject.value:'';  	
	let s_additional_subject=(additional_subject)?additional_subject.value:'';     
	let s_transportation=(transportation)?transportation.value:'';  	
	let s_station_id=(station_id)?station_id.value:'';    
	let s_route_id=(route_id)?route_id.value:'';  	
	let s_bus_no=(bus_no)?bus_no.value:''; 
	let s_transport_concession=(transport_concession)?transport_concession.value:'';  	
	let s_busfare=(busfare)?busfare.value:''; 
	let s_transconcession_amount=(transconcession_amount)?transconcession_amount.value:'';  	
	let s_totalfare=(totalfare)?totalfare.value:'';     
	let s_staffchild=(staffchild)?staffchild.value:'';  	
	let s_staff_no=(staff_no)?staff_no.value:''; 
	let s_management_concession=(management_concession)?management_concession.value:'';    	
	let f_applicable=(applicable)?applicable.value:'';     
	  	
    let fd = new FormData()
    
	fd.append("student_name",s_name);	 
	fd.append("dob",s_dob);	
	fd.append("gender",s_gender);	  
	fd.append("nationality",s_nationality);	
	fd.append("caste",s_caste);	 
	fd.append("religion",s_religion);	 
	fd.append("marital_status",s_marital_status);	
	fd.append("mobile",s_mobile);	  
	fd.append("email",s_email);	
	fd.append("blood_group",s_blood_group);	 
	fd.append("aadhar_no",s_aadhar_no);	 
	fd.append("permanent_address",s_permanent_address);	
	fd.append("temporary_address",s_temporary_address);	  
	fd.append("state_id",s_state_id);	
	fd.append("district_id",s_district_id);	 
	fd.append("pincode",s_pincode);	   
	fd.append("account_no",s_account_no);	
	fd.append("ifsc",s_ifsc);	  
	fd.append("branch_address",s_branch_address);
	fd.append("father_name",s_father_name);	 
	fd.append("mother_name",s_mother_name);	
	fd.append("f_occupation",s_f_occupation);	  
	fd.append("f_income",s_f_income);	
	fd.append("f_designation",s_f_designation);	 
	fd.append("f_mobile",s_f_mobile);	 
	fd.append("f_email",s_f_email);	
	fd.append("residence_no",s_residence_no);	  
	fd.append("admission_date",s_admission_date);
	fd.append("admission_no",s_admission_no);	 
	fd.append("course_id",s_course_id);	
	fd.append("class_id",s_class_id);	  
	fd.append("section_id",s_section_id);	
	fd.append("roll_no",s_roll_no);	 
	fd.append("registration_no",s_registration_no);	   
	fd.append("board_roll",s_board_roll);	
	fd.append("leaving_certificate",s_leaving_certificate);	  
	fd.append("course_first",s_course_first);
	fd.append("class_first",s_class_first);	 
	fd.append("compulsory_subject",s_compulsory_subject);	
	fd.append("elective_subject",s_elective_subject);	  
	fd.append("additional_subject",s_additional_subject);	
	fd.append("transportation",s_transportation);	 
	fd.append("station_id",s_station_id);	 
	fd.append("route_id",s_route_id);	
	fd.append("bus_no",s_bus_no);	  
	fd.append("transport_concession",s_transport_concession);
	fd.append("sbusfare",s_busfare);  	 
	fd.append("transconcession_amount",s_transconcession_amount);	
	fd.append("totalfare",s_totalfare);	  
	fd.append("staffchild",s_staffchild);	
	fd.append("staff_no",s_staff_no);	 
	fd.append("management_concession",s_management_concession);	 
	fd.append("applicable",f_applicable);	
	fd.append("insert_id",this.state.insert_id);	
	fd.append("tab",this.state.tab_id);	
	
	for (let i=0;i<this.state.images.length;i++) {		
		fd.append("images[]",this.state.images[i]);	  	  
    }  
	
	axios.post('/studentregister/add',fd)			
    .then(response => {   
		
		if (response.data.status === 'successed')   
		{		
			this.setState({ showError:false,showSuccess:true,message:response.data.message,insert_id:response.data.data});  	
				
		}
		else
		{
			this.setState({ showError: true, showSuccess: false, message: response.data.message});	 			   
		}
    })
    .catch(err => {  	   
	   console.log(err.message); 	
	   console.log(err.response.data);  
    })

	
	
    /* this.setState({ showError: false, showSuccess:false });		

    axios.post(`http://127.0.0.1:8000/api/add_student_process`, {
        studentName: this.state.studentName,
        email:this.state.email,
        bloodGroup:this.state.bloodGroup,
        mobile:this.state.mobile,
        aadhar:this.state.aadhar,
        perm_addr:this.state.perm_addr,
        temp_addr:this.state.temp_addr,
        pincode:this.state.pincode,
        accountNo:this.state.accountNo,
        ifsc:this.state.ifsc,
        branch_addr:this.state.branch_addr


      })  
    .then(res => {  
     console.log(res);

     if(res.data.errors){
        this.setState({ errors: res.data.errors, showError: true});
      //  window.location.href = "http://127.0.0.1:8000/course_list";
     
     }
     console.log(this);
     if(res.data.status == true){
        this.setState({ showError: false,showSuccess:true,message:res.data.message});
      //  window.location.href = "http://127.0.0.1:8000/course_list";
     }
    
     if(res.data.status == false){
        this.setState({ showError: true,showSuccess:false,message:res.data.message});
     }
    }).catch(
        function (error) {
          console.log(error);
          console.log(error.response);		
         
        } )      */
    
}
componentDidMount() {     

    axios.get('/studentregister/getstates').then(response => {     		
	this.setState({  			
			stateData: response.data.data ? response.data.data : [],	
		});
	})
	.catch(error => {  	   
	   console.log(error.message); 	
    })      
    
  }
  render() {
	  
	const stateArr = (this.state.stateData.length>0)?this.state.stateData:[];  
	const districtArr = (this.state.districtData.length>0)?this.state.districtData:[];    
	
	const stateList = stateArr.map((item, index) => {  
		  return (
				<option key={index} value={item.id}>{item.name}</option>   		
		  );  
	});
	
	const districtList = districtArr.map((item, index) => {  
		  return (
				<option key={index} value={item.id}>{item.name}</option>   		
		  );  
	});
	
    
    return (
    
      <div>   
            
      {/********************
        Preloader Start
        *********************/} 

<Preloader />

{/********************
Preloader end
*********************/}

{/***********************************
Main wrapper start
************************************/}

<div id="main-wrapper">



{/***********************************
HeaderPart start
************************************/}




<HeaderPart />


{/***********************************
HaderPart end
************************************/}	

        {/***********************************
          Content body start
      ************************************/}
      <div className="content-body">
        <div className="container-fluid">
          <div className="row page-titles mx-0">
            <div className="col-sm-6 p-md-0">
              <div className="welcome-text">
                <h4>Add Student</h4>
              </div>
            </div>
            <div className="col-sm-6 p-md-0 justify-content-sm-end mt-2 mt-sm-0 d-flex">
              <ol className="breadcrumb">                 
				<li><a href={`/student_list`} className="btn bg-blue-soft text-blue"><i className="fa fa-angle-double-left"></i> Back to Admitted Student List</a></li>	  
              </ol>
            </div>
          </div>
          {/* row */}
          <div className="row">
            <div className="col-xl-12 col-lg-12 col-md-12">
              <div className="profile-tab">
                <div className="custom-tab-1">
                  <ul className="nav nav-tabs">
                    <li className="nav-item"><a href="#personal-details" onClick={(e) => this.handleTab(e,'personal_detail')} data-toggle="tab" className="nav-link active show">Personal Details</a></li>	
                    <li className="nav-item"><a href="#parents-details" onClick={(e) => this.handleTab(e,'parents_detail')}  data-toggle="tab" className="nav-link">Parents Details</a></li>
                    <li className="nav-item"><a href="#admission-details" onClick={(e) => this.handleTab(e,'admission_detail')} data-toggle="tab" className="nav-link">Admission Details</a></li>
                    <li className="nav-item"><a href="#subjects-details" onClick={(e) => this.handleTab(e,'subject_detail')} data-toggle="tab" className="nav-link">Subjects Details</a></li>
                    <li className="nav-item"><a href="#settings" onClick={(e) => this.handleTab(e,'setting_detail')} data-toggle="tab" className="nav-link">Misc. Settings</a></li>				
                  </ul>
                  <div className="tab-content">
                    <div id="personal-details" className="tab-pane fade active show">
                      <div className="pt-3">
                        <div className="settings-form">
                          <div className="row">
                            <div className="col-xl-4 col-lg-4 col-md-4">
                              <div className="card">
                                <div className="card-header"><h4 className="card-title">Upload Student Photo</h4></div>
                                <div className="card-body text-center account-profile">
                                  <img className="img-account-profile rounded-circle mb-2 img-thumbnail" src="./images/student.jpg" alt="" />
                                  <div className="small font-italic text-muted mb-4">JPG or PNG not larger than 100 KB</div>
                                  <div className="upload-grid">
                                    <img src="./images/upload-icon.png" alt="" />
                                    <input type="file" id="upload" name="myfile" className="btn btn-primary" placeholder="Upload new image" onChange={this.handleFileUpload} />
                                    <label htmlFor="forDesign">Upload new image</label>
                                  </div>
                                </div>
                              </div>{/*/ card */}
                            </div>{/*/ col-4 */}
                            <div className="col-xl-8 col-lg-8 col-md-8">
                              <div className="card">
                                <div className="card-body">
                                  <div className="basic-form form-own">
                                    <form onSubmit={this.formSubmit}>		
									<div className="text-center">
										{this.state.showError ?   
										 <div className="alert alert-danger" style={{color:"brown"}}>  
											<strong>{this.state.message}</strong>       	  					   
										  </div>
										 : null}   
										{this.state.showSuccess ?   
										 <div className="alert alert-success" style={{color:"green"}}>    
											{this.state.message}    
										  </div>
										 : null}   		 
									</div>  
                                      <div className="form-row">
                                        <div className="form-group col-md-6">
                                          <label>Student Name</label>
                                          <input type="text" className="form-control" name="student_name" value={(this.state.student_name)?this.state.student_name:''} onChange={this.handleChange}/>
                                        </div>  
                                        <div className="form-group col-md-6">		
                                          <label>Date of Birth</label>
                                          <div className="example">  
                                            <input type="date" className="form-control input-daterange-timepicker" name="dob" value="10/10/2022 2:00 PM" value={(this.state.dob)?this.state.dob:''} onChange={this.handleChange} />  
                                          </div>
                                        </div>
                                        <div className="form-group col-md-6">
                                          <label>Gender</label>
                                          <div className="form-check settings-form-radio">  
                                            <input className="form-check-input" type="radio" name="gender" value="male" ref={this.input} defaultChecked/> 
                                            <label className="form-check-label">Male</label>  
                                            <input className="form-check-input" type="radio" name="gender" value="female" ref={this.input} />  		
                                            <label className="form-check-label">Female</label>  
                                          </div>
                                        </div>
                                        <div className="form-group col-md-6">
                                          <label>Nationality</label>
                                          <div className="form-check settings-form-radio">
                                            <input className="form-check-input" type="radio" name="nationality" value="indian" ref={this.input} defaultChecked />
                                            <label className="form-check-label">Indian</label>
                                            <input className="form-check-input" type="radio" name="nationality" value="non-indian" ref={this.input}  />  
                                            <label className="form-check-label">Non-Indian</label>
                                          </div>
                                        </div>
                                        <div className="form-group col-md-6">
                                          <label>Caste</label>
                                          <select className="form-control" id="caste" name="caste" value={(this.state.caste)?this.state.caste:''} onChange={this.handleChange}>   
											  <option value="">--Select--</option>  
											  <option value="general">General</option>  
											  <option value="obc">OBC</option>		
											  <option value="sc">SC</option>
											  <option value="st">ST</option>
											  <option value="other">Other</option>  
										  </select>
                                        </div>
                                        <div className="form-group col-md-6">
                                          <label>Religion</label>
                                          <select className="form-control" id="religion" name="religion" value={(this.state.religion)?this.state.religion:''} onChange={this.handleChange}>
											  <option value="">--Select--</option>			  
											  <option value="hindu">Hindu</option>
											  <option value="muslim">Muslim</option>  
											  <option value="sikh">Sikh</option>	
											  <option value="christian">Christian</option> 
											  <option value="jain">Jain</option> 
											  <option value="buddh">Buddh</option>    
										  </select>
                                        </div>
                                        <div className="form-group col-md-6">
                                          <label>Maritial Status</label>
                                          <select className="form-control" name="marital_status" value={(this.state.marital_status)?this.state.marital_status:''} onChange={this.handleChange}>
											  <option value="">--Select--</option>    
											  <option value="un-married">Un-Married</option>  
											  <option value="married">Married</option>
										  </select>
                                        </div>
                                        <div className="form-group col-md-6">		
                                          <label>Mobile No.</label>
                                          <input type="number" className="form-control" placeholder="" value={(this.state.mobile)?this.state.mobile:''} name="mobile" onChange={this.handleChange} />
                                        </div>
                                        <div className="form-group col-md-4">
                                          <label>Email</label>
                                          <input type="text" className="form-control" placeholder="" value={(this.state.email)?this.state.email:''} name="email" onChange={this.handleChange} />
                                        </div>
                                        <div className="form-group col-md-4">
                                          <label>Blood Group</label>
                                          <input type="text" className="form-control" placeholder="" value={(this.state.blood_group)?this.state.blood_group:''} name="blood_group" onChange={this.handleChange} />
                                        </div>
                                        <div className="form-group col-md-4">
                                          <label>Aadhar No.</label>
                                          <input type="text" className="form-control" placeholder="" value={(this.state.aadhar_no)?this.state.aadhar_no:''} name="aadhar_no" onChange={this.handleChange} />
                                        </div>		
                                        <div className="form-group col-md-6">
                                          <label>Permanent Address</label>
                                          <textarea className="form-control" placeholder="" value={(this.state.permanent_address)?this.state.permanent_address:''} name="permanent_address" onChange={this.handleChange} />	
                                        </div>
                                        <div className="form-group col-md-6">
                                          <label>Temporary Address</label>
                                          <textarea className="form-control" placeholder="" value={(this.state.temporary_address)?this.state.temporary_address:''} name="temporary_address" onChange={this.handleChange} />   		
                                        </div>
                                        <div className="form-group col-md-6">
                                          <label>State</label>
                                          <select className="form-control" name="state_id" value={(this.state.state_id)?this.state.state_id:''} onChange={this.changeDistrict}>  
										  <option value="">--Select--</option>  
										  {stateList}  
										  </select>
                                        </div>
                                        <div className="form-group col-md-6">
                                          <label>District</label>
                                          <select className="form-control" name="district_id" value={(this.state.district_id)?this.state.district_id:''} onChange={this.handleChange}>
											<option value="">--Select--</option>	
											{districtList}						
										  </select>
                                        </div>
                                        <div className="form-group col-md-4">
                                          <label>Pincode</label>
                                          <input className="form-control" type="number" value={(this.state.pincode)?this.state.pincode:''} name="pincode" onChange={this.handleChange} />
                                        </div>
                                        <div className="form-group col-md-4">     
                                          <label>Account No.</label>
                                          <input className="form-control" type="text" value={(this.state.account_no)?this.state.account_no:''} name="account_no" onChange={this.handleChange} />
                                        </div>  
                                        <div className="form-group col-md-4">
                                          <label>IFSC Code</label>
                                          <input className="form-control" type="text" value={(this.state.ifsc)?this.state.ifsc:''} name="ifsc" onChange={this.handleChange}  />
                                        </div>
                                        <div className="form-group col-md-12">
                                          <label>Branch Address</label>
                                          <textarea className="form-control" placeholder="" value={(this.state.branch_address)?this.state.branch_address:''} name="branch_address" onChange={this.handleChange} />
                                        </div>  		
                                      </div>{/*/ form-row */}
									   <div className="profile-tab-btn text-right">
										  <input type="button" className="btn btn-primary" value="Save & Pay" />  
										  <input type="submit" className="btn btn-primary" value="Save Details" />		
										  <input type="button" className="btn btn-primary" value="Save & Print Admission Form" />
									   </div>		
                                    </form>
                                  </div>
                                </div>{/*/ card-body */}
                              </div>{/*/ card */}
                            </div>{/*/ col-8 */}
                          </div>{/*/ row */}
                        </div>{/*/ settings-form */}
                      </div>
                    </div>{/*/ tab-pane */}
                    <div id="parents-details" className="tab-pane fade">
                      <div className="pt-3">
                        <div className="settings-form">
                          <div className="row">
                            <div className="col-xl-4 col-lg-4 col-md-4">
                              <div className="card">
                                <div className="card-header"><h4 className="card-title">Upload Father Image</h4></div>
                                <div className="card-body text-center account-profile">
                                  <img className="img-account-profile rounded-circle mb-2 img-thumbnail" src="./images/male.jpg" alt="" />
                                  <div className="small font-italic text-muted mb-4">JPG or PNG not larger than 100 KB</div>
                                  <div className="upload-grid">
                                    <img src="./images/upload-icon.png" alt="" />
                                    <input type="file" id="upload" name="father_image" className="btn btn-primary" placeholder="Upload new image" onChange={this.handleFileUpload}/>
                                    <label htmlFor="forDesign">Upload new image</label>
                                  </div>
                                </div>
                              </div>{/*/ card */}
                              <div className="card">
                                <div className="card-header"><h4 className="card-title">Upload Mother Image</h4></div>
                                <div className="card-body text-center account-profile">
                                  <img className="img-account-profile rounded-circle mb-2 img-thumbnail" src="./images/female.jpg" alt="" />
                                  <div className="small font-italic text-muted mb-4">JPG or PNG not larger than 100 KB</div>
                                  <div className="upload-grid">
                                    <img src="./images/upload-icon.png" alt="" />   
                                    <input type="file" id="upload" name="mother_image" className="btn btn-primary" placeholder="Upload new image" onChange={this.handleFileUpload}/>		
                                    <label htmlFor="forDesign">Upload new image</label>
                                  </div>
                                </div>
                              </div>{/*/ card */}
                            </div>{/*/ col-4 */}
                            <div className="col-xl-8 col-lg-8 col-md-8">
                              <div className="card">
                                <div className="card-body">
                                  <div className="basic-form form-own">
                                    <form onSubmit={this.formSubmit}>
									  <div className="text-center">      
										{this.state.showError ? <div className="error">{this.state.message}</div> : null}
										{this.state.showSuccess ? <div className="success">{this.state.message}</div> : null} 
									  </div>  	
                                      <div className="form-row">
                                        <div className="form-group col-md-12">
                                          <label>Father Name</label>
                                          <input type="text" className="form-control" placeholder="" name="father_name" value={(this.state.father_name)?this.state.father_name:''} onChange={this.handleChange} />
                                        </div>
                                        <div className="form-group col-md-12">
                                          <label>Mother Name</label>
                                          <input type="text" className="form-control" placeholder="" name="mother_name" value={(this.state.mother_name)?this.state.mother_name:''} onChange={this.handleChange} />
                                        </div>
                                        <div className="form-group col-md-12">		
                                          <label>Father's Occupation</label>
                                          <input type="text" className="form-control" placeholder="" name="f_occupation" value={(this.state.f_occupation)?this.state.f_occupation:''} onChange={this.handleChange} />
                                        </div>
                                        <div className="form-group col-md-12"> 
                                          <label>Father's Annual Income</label>
                                          <input type="text" className="form-control" placeholder="" name="f_income" value={(this.state.f_income)?this.state.f_income:''} onChange={this.handleChange} />  
                                        </div>		
                                        <div className="form-group col-md-12">		
                                          <label>Designation</label>
                                          <input type="text" className="form-control" placeholder="" name="f_designation" value={(this.state.f_designation)?this.state.f_designation:''} onChange={this.handleChange} />  
                                        </div>
                                        <div className="form-group col-md-12">
                                          <label>Mobile No (For SMS)</label>
                                          <input type="number" className="form-control" placeholder="" name="f_mobile" value={(this.state.f_mobile)?this.state.f_mobile:''} onChange={this.handleChange} />
                                        </div>
                                        <div className="form-group col-md-12">
                                          <label>E-Mail ID</label>
                                          <input type="text" className="form-control" placeholder="" name="f_email" value={(this.state.f_email)?this.state.f_email:''} onChange={this.handleChange} />
                                        </div>
                                        <div className="form-group col-md-12">
                                          <label>Phone(Office/Res.)</label>
                                          <input type="number" className="form-control" name="residence_no" value={(this.state.residence_no)?this.state.residence_no:''} onChange={this.handleChange}  />
                                        </div>
                                      </div>{/*/ form-row */}   
									  <div className="profile-tab-btn text-right">
										  <input type="button" className="btn btn-primary" value="Save & Pay" />  
										  <input type="submit" className="btn btn-primary" value="Save Details" />		
										  <input type="button" className="btn btn-primary" value="Save & Print Admission Form" />
									   </div>  
                                    </form>
                                  </div>
                                </div>{/*/ card-body */}
                              </div>{/*/ card */}
                            </div>{/*/ col-8 */}
                          </div>{/*/ row */}
                        </div>{/*/ settings-form */}
                      </div>
                    </div>{/*/ tab-pane */}
                    <div id="admission-details" className="tab-pane fade">
                      <div className="pt-3">
                        <div className="settings-form">
                          <div className="row">
                            <div className="col-md-12">
                              <div className="card">
                                <div className="card-body">
                                  <div className="basic-form form-own">
                                    <form onSubmit={this.formSubmit}>
									  <div className="text-center">      
										{this.state.showError ? <div className="error">{this.state.message}</div> : null}
										{this.state.showSuccess ? <div className="success">{this.state.message}</div> : null} 
									  </div>  	  	
                                      <div className="form-row">
                                        <div className="form-group col-md-6">
                                          <label>Date of Admission</label>		
                                          <input type="date" className="form-control" placeholder="10-October-2022 name" name="admission_date" value={(this.state.admission_date)?this.state.admission_date:''} onChange={this.handleChange} />  
                                        </div>
                                        <div className="form-group col-md-6">
                                          <label>Admission No.</label>
                                          <input type="text" className="form-control" placeholder="" name="admission_no" value={(this.state.admission_no)?this.state.admission_no:''} onChange={this.handleChange} />  
                                        </div>
                                        <div className="form-group col-md-4">
                                          <label>Course Name</label>
                                          <select className="form-control" id="course_id" name="course_id" onChange={this.handleChange} value={(this.state.course_id)?this.state.course_id:''}>
											  <option value="">Select Course</option>
											  {this.state.courseList.map( (item, key) => {
												return (
											  <option value={item.courseId}>{item.courseName}</option>
											  )
											})}
										  </select>   
										</div>
                                        <div className="form-group col-md-4">
                                          <label>Class Name</label>
                                          <select className="form-control" id="classid" name="class_id" onChange={this.handleChange} value={(this.state.class_id)?this.state.class_id:''}>
										  <option value="">Select Class</option>
											  {this.state.classList.map( (item, key) => {
												return (
											  <option value={item.classId}>{item.className}</option>
											  )  
											})}
											</select>
                                        </div>
                                        <div className="form-group col-md-4">
                                          <label>Section Name</label>
                                          <select className="form-control valid" id="section_id" name="section_id" onChange={this.handleChange} value={(this.state.section_id)?this.state.section_id:''}>
										  <option value="">--Select--</option></select>     
                                        </div>
                                        <div className="form-group col-md-4">
                                          <label>Student Roll No.</label>
                                          <input type="text" className="form-control" name="roll_no" value={(this.state.roll_no)?this.state.roll_no:''} onChange={this.handleChange} placeholder="" />	
                                        </div>
                                        <div className="form-group col-md-4">		
                                          <label>Registration No.</label>
                                          <input type="text" className="form-control" name="registration_no" value={(this.state.registration_no)?this.state.registration_no:''} onChange={this.handleChange} placeholder="" />  
                                        </div>
                                        <div className="form-group col-md-4">
                                          <label>Board Roll No.</label>
                                          <input type="text" className="form-control" name="board_roll" value={(this.state.board_roll)?this.state.board_roll:''} onChange={this.handleChange} placeholder="" />
                                        </div>		
                                        <div className="form-group col-md-6">
                                          <label>Whether Submitted Original School Leaving Certificate(S.L.C)</label>
                                          <div className="form-check settings-form-radio">
                                            <input className="form-check-input" type="radio" name="leaving_certificate" value="yes" ref={this.input} defaultChecked />  
                                            <label className="form-check-label">Yes</label>
                                            <input className="form-check-input" type="radio" name="leaving_certificate" value="no" ref={this.input} />   
                                            <label className="form-check-label">No</label>
                                          </div>
                                        </div>
                                        <div className="form-group col-md-6">
                                          <label>Class of Student at the time of Admission*</label>
                                          <div className="form-row">
                                            <div className="form-group col-md-6">
                                              <select className="form-control" id="course_first" name="course_first" value={(this.state.course_first)?this.state.course_first:''} onChange={this.handleChange}>
											  <option value="">--Select--</option><option value="C001">Pre - Primary</option><option value="C002">Primary</option><option value="C003">Middle</option><option value="C0037">High</option><option value="C00102">adta</option><option value="C00110">Test</option><option value="C004150">JBT</option>  
											  </select>
                                            </div>
                                            <div className="form-group col-md-6">
                                              <select className="form-control" id="class_first" name="class_first" value={(this.state.class_first)?this.state.class_first:''} onChange={this.handleChange}>
											  <option value="">--Select--</option></select>   
                                            </div>
                                          </div>
                                        </div>
                                      </div>{/*/ form-row */}
									  <div className="profile-tab-btn text-right">
										  <input type="button" className="btn btn-primary" value="Save & Pay" />  
										  <input type="submit" className="btn btn-primary" value="Save Details" />		
										  <input type="button" className="btn btn-primary" value="Save & Print Admission Form" />
									   </div>   
                                    </form>
                                  </div>
                                </div>{/*/ card-body */}
                              </div>{/*/ card */}
                            </div>{/*/ col-8 */}
                          </div>{/*/ row */}
                        </div>{/*/ settings-form */}
                      </div>
                    </div>{/*/ tab-pane */}
                    <div id="subjects-details" className="tab-pane fade">
                      <div className="pt-3">
                        <div className="settings-form">
                          <div className="row">
                            <div className="col-md-12">
                              <div className="card">
                                <div className="card-body">
                                  <div className="basic-form form-own subjects-checkbox">
                                    <form onSubmit={this.formSubmit}> 
									  <div className="text-center">      
										{this.state.showError ? <div className="error">{this.state.message}</div> : null}
										{this.state.showSuccess ? <div className="success">{this.state.message}</div> : null} 
									  </div>  	  	
                                      <div className="form-row">
                                        <div className="form-group col-md-4 sc-red">		
                                          <h4>Compulsory Subjects</h4>
                                          <div className="form-check form-checkbox">
                                            <div className="bg-padd">
                                              <input type="checkbox" className="form-check-input" name="compulsory_subject" ref={this.input}/>  
                                              <label className="form-check-label" htmlFor="check1">English</label>
                                            </div>
                                          </div>
                                          <div className="form-check form-checkbox">
                                            <div className="bg-padd">
                                              <input type="checkbox" className="form-check-input" name="compulsory_subject" ref={this.input}/>
                                              <label className="form-check-label" htmlFor="check1">Hindi</label>
                                            </div>
                                          </div>
                                          <div className="form-check form-checkbox">
                                            <div className="bg-padd">
                                              <input type="checkbox" className="form-check-input" name="compulsory_subject" ref={this.input}/>  
                                              <label className="form-check-label" htmlFor="check1">Maths</label>
                                            </div>
                                          </div>
                                          <div className="form-check form-checkbox">
                                            <div className="bg-padd">
                                              <input type="checkbox" className="form-check-input" name="compulsory_subject" ref={this.input}/>
                                              <label className="form-check-label" htmlFor="check1">Maths</label>
                                            </div>
                                          </div>
                                          <div className="form-check form-checkbox">
                                            <div className="bg-padd">
                                              <input type="checkbox" className="form-check-input" name="compulsory_subject" ref={this.input}/>
                                              <label className="form-check-label" htmlFor="check1">Social Science </label>
                                            </div>
                                          </div>
                                          <div className="form-check form-checkbox">
                                            <div className="bg-padd">
                                              <input type="checkbox" className="form-check-input" name="compulsory_subject" ref={this.input}/>
                                              <label className="form-check-label" htmlFor="check1">Physical Education</label>
                                            </div>
                                          </div>
                                        </div>{/*/ form-group */}
                                        <div className="form-group col-md-4 sc-green">
                                          <h4>Elective Subjects</h4>
                                          <div className="form-check form-checkbox">
                                            <div className="bg-padd">
                                              <input type="checkbox" className="form-check-input" name="elective_subject" ref={this.input}/>  
                                              <label className="form-check-label" htmlFor="check1">I.T</label>
                                            </div>
                                          </div>
                                        </div>{/*/ form-group */}
                                        <div className="form-group col-md-4 sc-purple">
                                          <h4>Additional Subjects</h4>
                                          <div className="form-check form-checkbox">
                                            <div className="bg-padd">
                                              <input type="checkbox" className="form-check-input" name="additional_subject" ref={this.input}/>  
                                              <label className="form-check-label" htmlFor="check1"> Physical Education </label>
                                            </div>
                                          </div>
                                        </div>{/*/ form-group */}
                                      </div>{/*/ form-row */}
									  <div className="profile-tab-btn text-right">
										  <input type="button" className="btn btn-primary" value="Save & Pay" />  
										  <input type="submit" className="btn btn-primary" value="Save Details" />		
										  <input type="button" className="btn btn-primary" value="Save & Print Admission Form" />
									   </div>   
                                    </form>
                                  </div>
                                </div>{/*/ card-body */}
                              </div>{/*/ card */}
                            </div>{/*/ col-8 */}
                          </div>{/*/ row */}
                        </div>{/*/ settings-form */}
                      </div>
                    </div>{/*/ tab-pane */}
                    <div id="settings" className="tab-pane fade">
                      <div className="pt-3">
                        <div className="settings-form">
                          <div className="row">
                            <div className="col-md-12">
                              <div className="card">
                                <div className="card-body">
                                  <div className="basic-form form-own">
                                    <form onSubmit={this.formSubmit}> 
									 <div className="text-center">      
										{this.state.showError ? <div className="error">{this.state.message}</div> : null}
										{this.state.showSuccess ? <div className="success">{this.state.message}</div> : null} 
									  </div>  	  	
                                      <div className="form-row">
                                        <div className="form-group col-md-12">
                                          <h5>Transportation Required</h5>
                                          <div className="form-check settings-form-radio mrb-15">
                                            <input className="form-check-input" type="radio" name="transportation" value="yes" ref={this.input} defaultChecked/>
                                            <label className="form-check-label">Yes</label>
                                            <input className="form-check-input" type="radio" name="transportation" value="no" ref={this.input} />   
                                            <label className="form-check-label">No</label>
                                          </div>
                                          <div className="form-row"> 
                                            <div className="form-group col-md-4">
                                              <select className="form-control selectpicker" id="station_id" name="station_id" value={(this.state.station_id)?this.state.station_id:''} onChange={this.handleChange}>       
											  <option value="">Select Station</option><option value={2405}>Bilaspur</option><option value={1359}>Chandigarh</option><option value={5861}>Darlaghat</option><option value={1358}>Kharar</option><option value={1360}>Mohali</option><option value={5859}>Secto 70</option></select>
                                            </div>{/*/ form-group */}
                                            <div className="form-group col-md-4">
                                              <select className="form-control valid" id="route_id" name="route_id" value={(this.state.route_id)?this.state.route_id:''} onChange={this.handleChange}>       
											  <option value="">--Select Route--</option><option value="R002047">Route 1</option><option value="R001032">Route 2</option></select>   
                                            </div>{/*/ form-group */}
                                            <div className="form-group col-md-4">
                                              <select className="form-control valid" id="bus_no" name="bus_no" value={(this.state.bus_no)?this.state.bus_no:''} onChange={this.handleChange}> 
											  <option value="">--Select Bus No--</option><option value={1035}>HP23C9700</option><option value={1034}>PB-9700</option></select>    
                                            </div>{/*/ form-group */}
                                          </div>{/*/ form-row */}
                                        </div>
                                        <div className="form-group col-md-12">
                                          <h5>Transportation Concession</h5>
                                          <div className="form-check settings-form-radio mrb-15">
                                            <input className="form-check-input" type="radio" name="transport_concession" value="yes" ref={this.input} defaultChecked/>  
                                            <label className="form-check-label">Yes</label>
                                            <input className="form-check-input" type="radio" name="transport_concession" value="no" ref={this.input} />  
                                            <label className="form-check-label">No</label>	
                                          </div>
                                          <div className="form-row"> 
                                            <div className="form-group col-md-4">
                                              <input type="text" id="busfare" name="busfare" className="form-control text-box single-line valid" placeholder="Station Fare" value={(this.state.busfare)?this.state.busfare:''} onChange={this.handleChange}/>  
                                            </div>{/*/ form-group */}
                                            <div className="form-group col-md-4">
                                              <input className="form-control text-box single-line" data-val="true" data-val-number="The field TransConcessionAmount must be a number." id="TransConcessionAmount" type="text" name="transconcession_amount" placeholder="Enter Concession Amount" value={(this.state.transconcession_amount)?this.state.transconcession_amount:''} onChange={this.handleChange} />
                                            </div>{/*/ form-group */}  
                                            <div className="form-group col-md-4">
                                              <input type="text" id="totfare" name="totalfare" className="form-control text-box single-line" placeholder="After Concession" value={(this.state.totalfare)?this.state.totalfare:''} onChange={this.handleChange} />
                                            </div>{/*/ form-group */}   
                                          </div>{/*/ form-row */}
                                        </div>
                                        <div className="form-group col-md-12">
                                          <h5>Staff Child</h5>
                                          <div className="form-check settings-form-radio mrb-15">
                                            <input className="form-check-input" type="radio" name="staffchild" value="yes" ref={this.input} defaultChecked />
                                            <label className="form-check-label">Yes</label>
                                            <input className="form-check-input" type="radio" name="staffchild" value="no" ref={this.input} />		
                                            <label className="form-check-label">No</label>  
                                          </div>
                                          <div className="form-row"> 
                                            <div className="form-group col-md-4">
                                              <select className="form-control valid" data-val="true" data-val-number="The field Select Child must be a number." id="staffChildNo" name="staff_no" aria-invalid="false" aria-describedby="staffChildNo-error" value={(this.state.staff_no)?this.state.staff_no:''} onChange={this.handleChange}>
											  <option value="">Select Child</option><option value={1}>1st Child</option><option value={2}>2nd Child</option>  
											  </select>
                                            </div>{/*/ form-group */}
                                          </div>{/*/ form-row */}
                                        </div>
                                        <div className="form-group col-md-12">
                                          <h5>Management Concession</h5>
                                          <div className="form-check settings-form-radio">
                                            <input className="form-check-input" type="radio" name="management_concession" value="yes" ref={this.input} defaultChecked />
                                            <label className="form-check-label">Yes</label>
                                            <input className="form-check-input" type="radio" name="management_concession" value="no" ref={this.input}/>     
                                            <label className="form-check-label">No</label>
                                          </div>
                                        </div>
                                        <div className="form-group col-md-12">
                                          <h5>Applicable</h5>
                                          <div className="form-check settings-form-radio">
                                            <input className="form-check-input" type="radio" name="applicable" value="yes" ref={this.input} defaultChecked />
                                            <label className="form-check-label">Yes</label>
                                            <input className="form-check-input" type="radio" name="applicable" value="no" ref={this.input}/>   
                                            <label className="form-check-label">No</label>		
                                          </div>
                                        </div>
                                      </div>{/*/ form-row */}
									  <div className="profile-tab-btn text-right">
										  <input type="button" className="btn btn-primary" value="Save & Pay" />  
										  <input type="submit" className="btn btn-primary" value="Save Details" />		
										  <input type="button" className="btn btn-primary" value="Save & Print Admission Form" />
									   </div>   
                                    </form>
                                  </div>
                                </div>{/*/ card-body */}
                              </div>{/*/ card */}
                            </div>{/*/ col-8 */}
                          </div>{/*/ row */}
                        </div>{/*/ settings-form */}
                      </div>
                    </div>{/*/ tab-pane */}		
                    {/*/ tab-content */}		
                  </div>{/*/ tab-content */}
                </div>{/*/ custom-tab-1 */}
              </div>{/*/ profile-tab */}
            </div>
          </div>{/*/ row */}
        </div>
      </div>
        {/***********************************
          Content body end      

          {/***********************************
            Footer Copyright start
        ************************************/}

<Copyright />

{/***********************************
  Footer Copyright end
************************************/}  

</div>
{/***********************************
Main wrapper end
************************************/}
</div>
    );
  }
}  
export default StudentAdd;