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

arrange Expense Details columns

Browse Source
This commit is contained in:
pramod mahajan 2025-07-30 12:07:29 +05:30
parent 1e6603cc7c
commit 2cf7db394d
1 changed files with 22 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
src/components/Expenses/ViewExpense.jsx
View File

@ -74,14 +74,14 @@ const ViewExpense = ({ ExpenseId }) => {
return (
<form className="container px-3" onSubmit={handleSubmit(onSubmit)}>
<div className="row mb-3">
<div className="row mb-3">
<div className="col-12 mb-3">
<h5 className="fw-semibold">Expense Details</h5>
<hr />
</div>
{/* Expense Info Rows */}
<div className="col-12 col-md-6 mb-3">
{/* Each info block below now has h-100 to stretch */}
<div className="col-12 col-md-6 mb-3 h-100">
<div className="d-flex">
<label className="form-label me-2 mb-0 fw-semibold">
Transaction Date :
@ -92,7 +92,7 @@ const ViewExpense = ({ ExpenseId }) => {
</div>
</div>
<div className="col-12 col-md-6 mb-3">
<div className="col-12 col-md-6 mb-3 h-100">
<div className="d-flex">
<label className="form-label me-2 mb-0 fw-semibold">
Expense Type :
@ -101,7 +101,7 @@ const ViewExpense = ({ ExpenseId }) => {
</div>
</div>
<div className="col-12 col-md-4 mb-3">
<div className="col-12 col-md-4 mb-3 h-100">
<div className="d-flex">
<label className="form-label me-2 mb-0 fw-semibold">
Supplier :
@ -110,14 +110,14 @@ const ViewExpense = ({ ExpenseId }) => {
</div>
</div>
<div className="col-12 col-md-4 mb-3">
<div className="col-12 col-md-4 mb-3 h-100">
<div className="d-flex">
<label className="form-label me-2 mb-0 fw-semibold">Amount :</label>
<div className="text-muted">₹ {data.amount}</div>
</div>
</div>
<div className="col-12 col-md-4 mb-3">
<div className="col-12 col-md-4 mb-3 h-100">
<div className="d-flex">
<label className="form-label me-2 mb-0 fw-semibold">
Payment Mode :
@ -126,8 +126,8 @@ const ViewExpense = ({ ExpenseId }) => {
</div>
</div>
<div className="col-12 col-md-4 mb-3">
<div className="d-flex">
<div className="col-12 col-md-4 mb-3 h-100">
<div className="d-flex ">
<label className="form-label me-2 mb-0 fw-semibold">
Paid By :
</label>
@ -137,9 +137,8 @@ const ViewExpense = ({ ExpenseId }) => {
</div>
</div>
<div className="col-12 text-start col-md-4 mb-3">
<div className="col-12 col-md-4 mb-3 h-100 text-start">
<label className="form-label me-2 mb-0 fw-semibold">Status :</label>
<span
className={`badge bg-label-${
getColorNameFromHex(data?.status?.color) || "secondary"
@ -149,14 +148,16 @@ const ViewExpense = ({ ExpenseId }) => {
</span>
</div>
<div className="col-12 text-start d-flex col-md-4 mb-3">
<label className="form-label me-2 mb-0 fw-semibold">
Pre-Approved :
</label>
<div className="text-muted">{data.preApproved ? "Yes" : "No"}</div>
<div className="col-12 col-md-4 mb-3 h-100">
<div className="d-flex">
<label className="form-label me-2 mb-0 fw-semibold">
Pre-Approved :
</label>
<div className="text-muted">{data.preApproved ? "Yes" : "No"}</div>
</div>
</div>
<div className="col-12 col-md-4 mb-3">
<div className="col-12 col-md-auto mb-3 h-100">
<div className="d-flex">
<label className="form-label me-2 mb-0 fw-semibold">
Project :
@ -165,7 +166,7 @@ const ViewExpense = ({ ExpenseId }) => {
</div>
</div>
<div className="col-12 col-md-4 mb-3">
<div className="col-12 col-md-auto mb-3 h-100">
<div className="d-flex">
<label className="form-label me-2 mb-0 fw-semibold">
Created By :
@ -176,7 +177,7 @@ const ViewExpense = ({ ExpenseId }) => {
</div>
</div>
<div className="col-12 col-md-4 mb-3">
<div className="col-12 col-md-auto mb-3 h-100">
<div className="d-flex">
<label className="form-label me-2 mb-0 fw-semibold">
Created At :
@ -219,7 +220,7 @@ const ViewExpense = ({ ExpenseId }) => {
>
<div
className="rounded me-1 d-flex align-items-center justify-content-center cursor-pointer"
style={{ height: "50px", width: "80px", position: "relative" }}
style={{ height: "50px", width: "60px", position: "relative" }}
onClick={() => {
if (isImage) {
setDocumentView({
@ -233,7 +234,7 @@ const ViewExpense = ({ ExpenseId }) => {
className={`bx ${getIconByType(
doc.contentType
)} text-primary`}
style={{ fontSize: "45px" }}
style={{ fontSize: "35px" }}
></i>
</div>