admin/marco.pms.web
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

UI changes in Expense Weidget and Attendance weidget.

Browse Source
This commit is contained in:
Kartik Sharma 2025-10-31 16:42:07 +05:30
parent 72eb64177f
commit 7b1ed97452
2 changed files with 13 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
src/components/Dashboard/AttendanceChart.jsx
View File

@ -118,18 +118,16 @@ const AttendanceOverview = () => {
<option value={30}>Last 30 Days</option>
</select>
<button
className={`btn btn-sm p-1 ${
view === "chart" ? "btn-primary" : "btn-outline-primary"
}`}
className={`btn btn-sm p-1 ${view === "chart" ? "btn-primary" : "btn-outline-primary"
}`}
onClick={() => setView("chart")}
title="Chart View"
>
<i className="bx bx-bar-chart-alt-2"></i>
</button>
<button
className={`btn btn-sm p-1 ${
view === "table" ? "btn-primary" : "btn-outline-primary"
}`}
className={`btn btn-sm p-1 ${view === "table" ? "btn-primary" : "btn-outline-primary"
}`}
onClick={() => setView("table")}
title="Table View"
>
@ -144,6 +142,9 @@ const AttendanceOverview = () => {
<SpinnerLoader />
) : error ? (
<p className="text-danger">{error}</p>
) : attendanceOverviewData.length === 0 ||
attendanceOverviewData.every((item) => item.present === 0) ? (
<div className="text-center text-dark">No data found</div>
) : view === "chart" ? (
<div className="w-100">
<ReactApexChart
@ -164,9 +165,7 @@ const AttendanceOverview = () => {
style={{ position: "sticky", top: 0, zIndex: 1 }}
>
<tr>
<th style={{ background: "#f8f9fa", textTransform: "none" }}>
Role
</th>
<th style={{ background: "#f8f9fa", textTransform: "none" }}>Role</th>
{dates.map((date, idx) => (
<th
key={idx}
@ -177,15 +176,13 @@ const AttendanceOverview = () => {
))}
</tr>
</thead>
<tbody>
{roles.map((role) => (
<tr key={role}>
<td>{role}</td>
{tableData.map((row, idx) => {
const value = row[role];
const cellStyle =
value > 0 ? { backgroundColor: "#d5d5d5" } : {};
const cellStyle = value > 0 ? { backgroundColor: "#d5d5d5" } : {};
return (
<td key={idx} style={cellStyle}>
{value}

8
src/components/Dashboard/ExpenseByProject.jsx
View File

@ -86,12 +86,12 @@ const ExpenseByProject = () => {
<div className="card shadow-sm h-100 rounded ">
{/* Header */}
<div className="card-header">
<div className="d-flex justify-content-start align-items-center mb-3 mt-3">
<div className="d-flex justify-content-start align-items-center mb-1 mt-1">
<div className="text-start">
<h5 className="mb-1 me-6 card-title">Monthly Expense -</h5>
<p className="card-subtitle m-0">{projectName}</p>
</div>
<div className="btn-group mb-4 ms-n8">
<div className="btn-group mb-5 ms-n8">
<button
className="btn btn-sm dropdown-toggle fs-5"
type="button"
@ -162,13 +162,13 @@ const ExpenseByProject = () => {
</div>
{/* Chart */}
<div className="card-body bg-white text-dark p-3 rounded" style={{ minHeight: "210px" }}>
<div className="card-body bg-white text-dark p-3 rounded" style={{ minHeight: "210px" }}>
{isLoading ? (
<div className="d-flex justify-content-center align-items-center py-5">
<SpinnerLoader />
</div>
) : !expenseApiData || expenseApiData.length === 0 ? (
<div className="text-center text-muted py-5">No data found</div>
<div className="text-center text-muted py-12">No data found</div>
) : (
<Chart options={options} series={series} type="bar" height={235} />
)}