akashbhome/web-page
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add excel upload or design the front end

Browse Source
This commit is contained in:
Akash Bhome
2026-02-21 17:39:39 +05:30
parent 20da415294
commit 592ddab03a
9 changed files with 268 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

114
src/admin/Reaportdetail.jsx Normal file
View File

@@ -0,0 +1,114 @@
import React from 'react'
function Reaportdetail() {
return (
<>
<div className='container-fluid'>
<div className="container w-75 bg-light mt-5 p-3 border">
<center><h3 className="text-primary">Search Contractor Report</h3></center>
<div className="form border p-3">
<div className="d-flex mt-2 gap-2 w-100">
<div className="w-50">
<label htmlFor="" className="label-control">Subcontractor Name:</label>
<input type="text" className="form-control" />
</div>
<div className="w-50">
<label htmlFor="" className="label-control">PMC No:</label>
<input type="text" className="form-control" />
</div>
</div>
<div className="d-flex gap-2 mt-2 w-100">
<div className="w-50">
<label htmlFor="" className="label-control">State:</label>
<input type="text" className="form-control" />
</div>
<div className="w-50">
<label htmlFor="" className="label-control">District:</label>
<input type="text" className="form-control" />
</div>
</div>
<div className="d-flex gap-2 mt-2 w-100">
<div className="w-50">
<label htmlFor="" className="label-control">Block:</label>
<input type="text" className="form-control" />
</div>
<div className="w-50">
<label htmlFor="" className="label-control">Village:</label>
<input type="text" className="form-control" />
</div>
</div>
<div className="d-flex gap-2 mt-2 w-100">
<div className="w-50">
<label htmlFor="" className="label-control">Year From:</label>
<input type="date" className="form-control" />
</div>
<div className="w-50">
<label htmlFor="" className="label-control">Year To:</label>
<input type="date" className="form-control" />
</div>
</div>
</div>
</div>
<div className="container w-100 mt-5 border p-3">
<center><h3 className="text-primary">Contractor List</h3></center>
<div className="table-responsive p-3 border rounded rounded-4 bg-light">
<table className="table table-striped table-bordered table-hover mb-0">
<thead className="table-dark">
<tr>
<th>Contractor Name</th>
<th>PMC No</th>
<th>State</th>
<th>District</th>
<th>Block</th>
<th>Village</th>
</tr>
</thead>
<tbody>
<tr>
<td>Laxmi Builders</td>
<td>PMC001</td>
<td>Maharashtra</td>
<td>Pune</td>
<td>Haveli</td>
<td>Kothrud</td>
</tr>
<tr>
<td>ABC Constructions</td>
<td>PMC002</td>
<td>Gujarat</td>
<td>Ahmedabad</td>
<td>City</td>
<td>Maninagar</td>
</tr>
<tr>
<td>XYZ Infra</td>
<td>PMC003</td>
<td>Tamil Nadu</td>
<td>Chennai</td>
<td>North</td>
<td>Thiruvanmiyur</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</>
)
}
export default Reaportdetail

32
src/admin/admin.jsx
View File

@@ -1,28 +1,32 @@
import React from 'react' import React from 'react'
import Dashbord from './dashbord' import Dashbord from './dashbord'
import Importexcel from './importExcel'
import Reaportdetail from './Reaportdetail'
import { Routes,Route } from 'react-router-dom' import { Routes,Route } from 'react-router-dom'
import Adminside from './adminSide' import Adminside from './adminSide'
import Adminnav from './adminNav'
function Admin() { function Admin() {
return (<> return (<>
<div className='container-fluid w-100 col-12 d-flex flex-row m-0 p-0' style={{ height: '100vh' }}> <div className='container-fluid w-100 col-12 d-flex flex-row m-0 p-0' style={{ height: '100vh' }}>
<div className='col-2'> <div className='col-2'>
<Adminside/> <Adminside/>
</div> </div>
<div className='col-10 border'> <div className='col-10 border'>
<div className='w-100 p-0 m-0 bg-light'>
<Routes> <Adminnav/>
<Route path="/" element={<Dashbord/>}></Route> </div>
</Routes> <div className='bg-light m-0 p-1 flex-grow-1 overflow-auto' style={{height:'90vh'}}>
</div> <Routes>
<Route path="/" element={<Dashbord/>}></Route>
<Route path="/importexcel" element={<Importexcel/>}></Route>
<Route path="/reportdetail" element={<Reaportdetail/>}></Route>
</Routes>
</div>
</div>
</div> </div>
</> </>
) )
} }

11
src/admin/adminNav.jsx Normal file
View File

@@ -0,0 +1,11 @@
import React from 'react'
function Adminnav() {
return (
<div className="scrolling-text w-100 p-2">
<h2>Laxmi Civil Engineering Services Pvt. Ltd.</h2>
</div>
)
}
export default Adminnav;

12
src/admin/adminSide.jsx
View File

@@ -1,10 +1,18 @@
import React from 'react' import React from 'react'
import lcepl from '../images/lcepl.jpg' import lcepl from '../images/lcepl.jpg'
import { Link ,useNavigate} from 'react-router-dom'
function Adminside() { function Adminside() {
let navigate=useNavigate();
return ( return (
<div className='w-100 bg-light border border-black m-0 p-0 h-100' > <div className='w-100 bg-light border border-black m-0 p-0 h-100' >
<div className='w-100 border px-5 d-flex justify-content-center align-items-center' style={{minHeight:'100px'}}> <div className='w-100 px-5 d-flex justify-content-center align-items-center' style={{minHeight:'100px'}}>
<img src={lcepl} alt="image not found" className='w-25 h-50 border border-danger'/> <img src={lcepl} alt="image not found" className='w-50 mt-5 h-50 border border-danger'/>
</div>
<div className='form mt-5'>
<button className='form-control p-3 btn btn-light buttoncolor border' onClick={()=>navigate("/admin/")}>Dashboard</button>
<button className='form-control p-3 btn btn-light buttoncolor border' onClick={()=>navigate("/admin/importexcel")}>Emport Excel</button>
<button className='form-control p-3 btn btn-light buttoncolor border' onClick={()=>navigate("/admin/reportdetail")}>Report Details</button>
<button className='form-control p-3 btn btn-light buttoncolor border' onClick={()=>navigate("/admin/")}>Logs</button>
</div> </div>
</div> </div>
) )

65
src/admin/dashbord.jsx
View File

@@ -2,7 +2,70 @@ import React from 'react'
function Dashbord() { function Dashbord() {
return ( return (
<div>dashbord</div> <>
<div className='container-fluid w-100 p-3 px-4 bg-light' style={{height:'90vh'}}>
<center><h3 className='text-primary'>Payment Reconciliation</h3></center>
<div className=" d-flex gap-4 flex-row mt-4 flex-wrap">
<div className="block border bg-white gap-3 p-2 d-flex flex-column">
<h4 className='m-auto'>Profile</h4>
<button className='btn m-auto w-25 btn-primary'>Go</button>
</div>
<div className="block border bg-white gap-3 p-2 d-flex flex-column">
<h4 className='m-auto'>States</h4>
<button className='btn m-auto w-25 btn-primary'>Go</button>
</div>
<div className="block border bg-white gap-3 p-2 d-flex flex-column">
<h4 className='m-auto'>District</h4>
<button className='btn m-auto w-25 btn-primary'>Go</button>
</div>
<div className="block border bg-white gap-3 p-2 d-flex flex-column">
<h4 className='m-auto'>Blocks</h4>
<button className='btn m-auto w-25 btn-primary'>Go</button>
</div>
<div className="block border bg-white gap-3 p-2 d-flex flex-column">
<h4 className='m-auto'>Village</h4>
<button className='btn m-auto w-25 btn-primary'>Go</button>
</div>
<div className="block border bg-white gap-3 p-2 d-flex flex-column">
<h4 className='m-auto'>Sub-Contractor</h4>
<button className='btn m-auto w-25 btn-primary'>Go</button>
</div>
<div className="block border bg-white gap-3 p-2 d-flex flex-column">
<h4 className='m-auto'>Invoice</h4>
<button className='btn m-auto w-25 btn-primary'>Go</button>
</div>
<div className="block border bg-white gap-3 p-2 d-flex flex-column">
<h4 className='m-auto'>Payment</h4>
<button className='btn m-auto w-25 btn-primary'>Go</button>
</div>
<div className="block border bg-white gap-3 p-2 d-flex flex-column">
<h4 className='m-auto'>GST Release</h4>
<button className='btn m-auto w-25 btn-primary'>Go</button>
</div>
<div className="block border bg-white gap-3 p-2 d-flex flex-column">
<h4 className='m-auto'>Hold Types</h4>
<button className='btn m-auto w-25 btn-primary'>Go</button>
</div>
<div className="block border bg-white gap-3 p-2 d-flex flex-column">
<h4 className='m-auto'>Work Order</h4>
<button className='btn m-auto w-25 btn-primary'>Go</button>
</div>
</div>
</div>
</>
) )
} }

21
src/admin/importExcel.jsx Normal file
View File

@@ -0,0 +1,21 @@
import React from 'react'
function Importexcel() {
return (
<>
<div className='w-50 border border rounded rounded-4 bg-white m-auto mt-5 p-3'>
<center><h3 className='text-primary'>Uplaod Excel File</h3></center>
<div className='form mt-3'>
<div className='form-control p-3'>
<input type="file" className='form-control' />
<button className='btn btn-primary form-control mt-3'>Upload</button>
</div>
</div>
</div>
</>
)
}
export default Importexcel

24
src/adminSide.css Normal file
View File

@@ -0,0 +1,24 @@
.buttoncolor:hover{
background-color: rgb(153, 220, 239);
color:red;
}
.scrolling-text {
overflow: hidden; /* hide text outside container */
white-space: nowrap; /* keep text in one line */
}
.scrolling-text h2 {
display: inline-block;
color:rgb(32, 143, 228);
padding-left: 100%; /* start from outside left */
animation: moveRight 30s linear infinite;
}
@keyframes moveRight {
0% {
transform: translateX(0);
}
100% {
transform: translateX(-100%);
}
}

5
src/index.css
View File

@@ -28,3 +28,8 @@
background-size: 100% 100%; background-size: 100% 100%;
background-repeat: no-repeat; background-repeat: no-repeat;
} }
.block{
width: 30%;
border-radius: 11px;
}

1
src/main.jsx
View File

@@ -1,6 +1,7 @@
import { StrictMode } from 'react' import { StrictMode } from 'react'
import { createRoot } from 'react-dom/client' import { createRoot } from 'react-dom/client'
import './index.css' import './index.css'
import './adminSide.css'
import App from './App.jsx' import App from './App.jsx'
createRoot(document.getElementById('root')).render( createRoot(document.getElementById('root')).render(