diff --git a/client/src/Components/Student(User)/student-page.jsx b/client/src/Components/Student(User)/student-page.jsx new file mode 100644 index 0000000000000000000000000000000000000000..56fb74c27e157cac0f70c19c104e4f4dc2d5dde8 --- /dev/null +++ b/client/src/Components/Student(User)/student-page.jsx @@ -0,0 +1,107 @@ +import React, { Component,Fragment } from 'react' +import { Redirect } from 'react-router-dom' +import * as Forms from '../Admin-forms' +import '../pages.css' +import icon from './icon.png' +import axios from 'axios' +import borrow from './borrow-book.png' + +class Student extends Component { + constructor(props) { + super(props) + + this.state = { + user_id:'', + user_name:'', + s_form: '', + logout: false, + currbook:'no book borrowed' + } + this.clickHandler=this.clickHandler.bind(this); + + } + componentWillMount(){ + this.setState({user_id:this.props.match.params.uid,user_name:this.props.match.params.uname}) + + axios.get('http://localhost:5000/borrower/'+this.props.match.params.uid) + .then(responsee => { + if(responsee.data===null){ + console.log('undefined') + } + else + {this.setState({currbook:responsee.data.book_id})} + }) + } + + clickHandler(){ + return( + <div style={{position:"absolute",top:"30%",left:"3.5%"}}> + <p style={{fontFamily:"sans-serif",color:"#0ff517",fontSize:"20px",marginLeft:"100px"}}><b>SELECT FORM</b></p> + + <div style={{marginLeft:"20px"}}><button className="fbutton" style={{backgroundColor:"red"}} onClick={(e) => {this.setState({s_form: 'borrow'})}}>Borrow book</button></div> + <div style={{marginLeft:"20px"}}><button className="fbutton" onClick={(e) => {this.setState({s_form: 'bsearch'})}}>Search book</button></div> + </div> + ) + } + + renderform(s_form){ + + if(!s_form) + { + return(<h2 align="center">Form renders here!</h2>) + } + else if(s_form==='borrow') + { + const Fm = Forms[s_form]; + return <Fm uid={this.state.user_id} uname={this.state.user_name}/> + } + const Fm = Forms[s_form]; + return <Fm /> + + + } + book(){ + if(this.state.s_form!='borrow'){ + return <h3>Current book borrowed: {this.state.currbook}</h3> + } + else return <img src={borrow} style={{width:"200px",height:"200px"}}></img> + } + + + render() { + if(this.state.logout) + return <Redirect to='/slogin'/> + else + return ( + <Fragment> + <div style={{width:"fill",height:"53px",backgroundColor:" #333"}}> + <img src={icon} width="53px" height="53px"/> + <div style={{position:"absolute",left:"55px",top:"0px",color:"#f2f2f2",fontSize:"30px"}}><b>BMS</b></div> + <div class="topnav"> + <a onClick={(e) =>{this.setState({logout:true})}} style={{position:"absolute",right:"3px",top:"0px",color:'white'}}><b>Logout</b></a> + </div> + </div> + <div> + <div> + <h1 style={{color:"#fff",fontFamily:"serif",marginLeft:"1%"}}><b>Hello {this.state.user_name}</b></h1> + <h1 style={{color:"red",fontFamily:"serif",marginLeft:"40%",position:"absolute",top:"10%"}}><b>FUNCTIONALITIES</b></h1> + </div> + + + <section> + {this.clickHandler()} + <div style={{position:"absolute",right:"5%",top:"30%",width:"600px",backgroundColor:"#fed000",color:"#242424",borderRadius:"30px",fontFamily:"serif"}}> + {} + {this.renderform(this.state.s_form)} + </div> + </section> + <div style={{color:'white',position:'absolute',marginLeft:'2.5%',top:'65%'}}> + {this.book()} + </div> + </div> + </Fragment> + ) + } +} + +export default Student;