Skip to content

2
2021-049
Commit 68edea86 authored by Gihan76's avatar Gihan76
Browse files
Options

Financial Details view, update, delete with DB done!

parent de1104f4
Hide whitespace changes
Inline Side-by-side
Showing with 292 additions and 0 deletions
WebFrontEnd/smartcoach-frontend/src/Components/Admin/edit_financial_details.js 0 → 100644
View file @ 68edea86
import React, {Component} from "react";
import axios from "axios";
export default class EditFinancialDetails extends Component{
constructor(props) {
super(props);
this.state = {
account_month : '',
direct_income : '',
indirect_income : '',
total_income : '',
direct_expenses : '',
indirect_expenses : '',
total_expenses : '',
gross_revenue : ''
};
}
onChangeHandler = e => {
this.setState({
[e.target.name]: e.target.value
})
}
onSubmitHandler = e => {
e.preventDefault();
const financialDetails = {
account_month : this.state.account_month,
direct_income : this.state.direct_income,
indirect_income : this.state.indirect_income,
total_income : this.state.total_income,
direct_expenses : this.state.direct_expenses,
indirect_expenses : this.state.indirect_expenses,
total_expenses : this.state.total_expenses,
gross_revenue : this.state.gross_revenue
}
console.log(`Form submitted:`);
console.log(`account_month: ${this.state.account_month}`);
console.log(`direct_income: ${this.state.direct_income}`);
console.log(`indirect_income: ${this.state.indirect_income}`);
console.log(`total_income: ${this.state.total_income}`);
console.log(`direct_expenses: ${this.state.direct_expenses}`);
console.log(`indirect_expenses: ${this.state.indirect_expenses}`);
console.log(`total_expenses: ${this.state.total_expenses}`);
console.log(`gross_revenue: ${this.state.gross_revenue}`);
axios.post('http://localhost:5000/admin/finance/update/'+this.props.match.params.id,financialDetails)
.then(res => console.log(res.data));
window.location = '/admin';
}
componentDidMount() {
axios.get('http://localhost:5000/admin/finance/'+this.props.match.params.id)
.then(response =>{
this.setState({
account_month: response.data.account_month,
direct_income : response.data.direct_income,
indirect_income : response.data.indirect_income,
total_income : response.data.total_income,
direct_expenses : response.data.direct_expenses,
indirect_expenses : response.data.indirect_expenses,
total_expenses : response.data.total_expenses,
gross_revenue : response.data.gross_revenue
},()=>{
})
console.log(response.data);
})
.catch(function (error) {
console.log(error);
});
}
// calctot(){
// let dinc = parseInt(document.getElementById('dirIncome').value, 10);
// let indinc = parseInt(document.getElementById('indIncome').value, 10);
// document.getElementById('sincome').innerHTML = dinc + indinc;
//
// let totincusd = parseFloat((dinc + indinc) / 199.56).toFixed(2);
// document.getElementById('totIncomeUSD').value = totincusd;
//
// let dexp = parseInt(document.getElementById('dirExpenses').value, 10);
// let indexp = parseInt(document.getElementById('indExpenses').value, 10);
// document.getElementById('sexpenses').innerHTML = dexp + indexp;
//
// let totexpusd = parseFloat((dexp + indexp) / 199.56).toFixed(2);
// document.getElementById('totExpensesUSD').value = totexpusd;
//
// let totincome = dinc + indinc;
// let totexpense = dexp + indexp;
// let totrev = totincome - totexpense;
// document.getElementById('srevenue').innerHTML = totrev;
//
// let totrevusd = parseFloat((totincome - totexpense) / 199.56).toFixed(2);
// document.getElementById('totRevenueUSD').value = totrevusd;
// }
placeHolders() {
document.getElementById("dirIncome").placeholder = "Direct Income";
document.getElementById("indIncome").placeholder = "Indirect Income";
document.getElementById("dirExpenses").placeholder = "Direct Expenses";
document.getElementById("indExpenses").placeholder = "Indirect Expenses";
}
render() {
return (
<div>
<div className="app-page-title">
<div className="page-title-wrapper">
<div className="page-title-heading">
<div className="page-title-icon">
<i className="pe-7s-display1 fa fa-line-chart"></i>
</div>
<div>
Edit Financial Details
</div>
</div>
</div>
</div>
<div className="main-card mb-3 card">
<div className="card-body">
<form onSubmit={this.onSubmitHandler}>
<div className="position-relative row form-group">
<label htmlFor="accMonth" className="col-sm-2 col-form-label">Account Month</label>
<div className="col-sm-3">
<input type="month" name="account_month" id="accMonth" className="form-control" value={this.state.account_month} onChange={this.onChangeHandler} />
</div>
</div>
<div className="position-relative row form-group">
<label htmlFor="dirIncome" className="col-sm-2 col-form-label">Direct Income<span style={{fontWeight:"bold"}}>(Rs.)</span><span style={{color:"red"}}>*</span></label>
<div className="col-sm-4">
<input onClick={this.placeHolders} type="number" min="0.00" step="1" name="direct_income" id="dirIncome" className="form-control" value={this.state.direct_income} onChange={this.onChangeHandler} />
</div>
<label htmlFor="indIncome" className="col-sm-2 col-form-label">Indirect Income<span style={{fontWeight:"bold"}}>(Rs.)</span><span style={{color:"red"}}>*</span></label>
<div className="col-sm-4">
<input onBlur={this.calctot} onClick={this.placeHolders} type="number" min="0.00" step="1" name="indirect_income" id="indIncome" className="form-control" value={this.state.indirect_income} onChange={this.onChangeHandler} />
</div>
</div>
<div className="position-relative row form-group">
<label htmlFor="totIncome" className="col-sm-2 col-form-label">Total Income<span style={{fontWeight:"bold"}}>(Rs.)</span><span style={{color:"red"}}>*</span></label>
<div className="col-sm-4">
<input type="number" min="0.00" name="total_income" id="totIncome" className="form-control" style={{backgroundColor: "#e7ebcc", color: "black"}} value={this.state.total_income} onChange={this.onChangeHandler}/>
</div>
</div>
<div className="position-relative row form-group">
<label htmlFor="dirExpenses" className="col-sm-2 col-form-label">Direct Expenses<span style={{fontWeight:"bold"}}>(Rs.)</span><span style={{color:"red"}}>*</span></label>
<div className="col-sm-4">
<input onClick={this.placeHolders} type="number" min="0.00" step="1" id="dirExpenses" name="direct_expenses" className="form-control" value={this.state.direct_expenses} onChange={this.onChangeHandler} />
</div>
<label htmlFor="indExpenses" className="col-sm-2 col-form-label">Indirect Expenses<span style={{fontWeight:"bold"}}>(Rs.)</span><span style={{color:"red"}}>*</span></label>
<div className="col-sm-4">
<input onBlur={this.calctot} onClick={this.placeHolders} type="number" min="0.00" step="1" id="indExpenses" name="indirect_expenses" className="form-control" value={this.state.indirect_expenses} onChange={this.onChangeHandler} />
</div>
</div>
<div className="position-relative row form-group">
<label htmlFor="totExpenses" className="col-sm-2 col-form-label">Total Expenses<span style={{fontWeight:"bold"}}>(Rs.)</span><span style={{color:"red"}}>*</span></label>
<div className="col-sm-4">
<input type="number" min="0.00" name="total_expenses" id="totExpenses" className="form-control" style={{backgroundColor: "#e7ebcc", color: "black"}} value={this.state.total_expenses} onChange={this.onChangeHandler} />
</div>
</div>
<div className="position-relative row form-group">
<label htmlFor="totRevenue" className="col-sm-2 col-form-label">Gross Revenue<span style={{fontWeight: "bold"}}>(Rs.)</span></label>
<div className="col-sm-4">
<input type="number" min="0.00" name="gross_revenue" id="totRevenue" className="form-control" style={{backgroundColor: "#e7ebcc", color: "black"}} value={this.state.gross_revenue} onChange={this.onChangeHandler}/>
</div>
</div>
<div className="position-relative row form-group">
<div className="col-sm-12">
<button className="btn btn-primary" style={{width:"150px"}} type="submit">Update Details</button>
</div>
</div>
</form>
</div>
</div>
</div>
);
}
}
\ No newline at end of file
WebFrontEnd/smartcoach-frontend/src/Components/Admin/view_financial_details.js 0 → 100644
View file @ 68edea86
import React, {Component} from "react";
import {Link} from "react-router-dom";
import axios from "axios";
const Finance = props => (
<tr>
<td>{props.finance.account_month}</td>
<td>Rs.{props.finance.total_income}</td>
<td>Rs.{props.finance.total_expenses}</td>
<td>Rs.{props.finance.gross_revenue}</td>
<td>
<Link style={{color:"black"}} to={"/admin/finance/edit/"+props.finance._id}><button style={{paddingRight:"20px",width:"auto"}} className="btn btn-warning mr-1"><i className="fa fa-pencil"> Edit</i></button></Link>
<button style={{width:"auto",color:"black"}} className="btn btn-danger" onClick={() => {props.deleteFinance(props.finance._id)}}><i className="fa fa-trash"> Delete</i></button>
</td>
</tr>
);
export default class ViewFinancialDetails extends Component{
constructor(props) {
super(props);
this.deleteFinance = this.deleteFinance.bind(this);
this.state = {
finance : []
};
}
componentDidMount() {
axios.get('http://localhost:5000/admin/finance/')
.then(response => {
this.setState({ finance : response.data})
// console.log(this.state);
})
.catch(error =>{
console.log(error);
})
}
deleteFinance(id){
axios.delete('http://localhost:5000/admin/finance/'+id)
.then(res => console.log(res.data));
this.setState({
finance : this.state.finance.filter(el => el._id !== id)
})
}
financialList(){
return this.state.finance.map(currentdetails => {
return <Finance finance={currentdetails} deleteFinance={this.deleteFinance} key={currentdetails._id} />;
})
}
render() {
return(
<div>
<div className="app-page-title">
<div className="page-title-wrapper">
<div className="page-title-heading">
<div className="page-title-icon">
<i className="pe-7s-display1 fa fa-line-chart"></i>
</div>
<div>
Financial Details
</div>
</div>
</div>
</div>
<div className="col-lg-12">
<div className="main-card mb-3 card">
<div className="card-body">
<table className="mb-0 table table-striped">
<thead>
<tr>
{/*<th>#</th>*/}
<th>Account Month</th>
<th>Gross Income</th>
<th>Gross Expenses</th>
<th>Gross Revenue</th>
<th>Actions</th>
</tr>
</thead>
<tbody>
{this.financialList()}
</tbody>
</table>
</div>
</div>
</div>
</div>
);
}
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment