changed Expense view u
This commit is contained in:
parent
081b042308
commit
d82f405e08
@ -127,7 +127,10 @@ const ViewExpense = ({ ExpenseId }) => {
|
||||
<div className="col-12 col-lg-7 col-xl-7 mb-3">
|
||||
<div className="row">
|
||||
<div className="col-12 d-flex justify-content-between text-start fw-semibold my-2">
|
||||
<span>{data?.expenseUId}</span>
|
||||
<div className="d-flex flex-row gap-2">
|
||||
<span className="fw-semibold">Expense No:</span>
|
||||
<span>{data?.expenseUId}</span>
|
||||
</div>{" "}
|
||||
<span
|
||||
className={`badge bg-label-${
|
||||
getColorNameFromHex(data?.status?.color) || "secondary"
|
||||
@ -139,91 +142,114 @@ const ViewExpense = ({ ExpenseId }) => {
|
||||
</div>
|
||||
|
||||
{/* Row 1 */}
|
||||
<div className="col-md-6 mb-3">
|
||||
<div className="d-flex">
|
||||
<div className="row text-start">
|
||||
<div className="col-md-6 mb-3">
|
||||
<label
|
||||
className="form-label me-2 mb-0 fw-semibold text-start"
|
||||
style={{ minWidth: "130px" }}
|
||||
>
|
||||
Transaction Date :
|
||||
Project :
|
||||
</label>
|
||||
<div className="text-muted">
|
||||
{formatUTCToLocalTime(data?.transactionDate)}
|
||||
</div>
|
||||
<div className="col-md-6 mb-3">
|
||||
<small className="text-muted">{data?.project?.name}</small>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row text-start">
|
||||
<div className="col-md-6 mb-3">
|
||||
<div className="d-flex">
|
||||
<label className="form-label me-2 mb-0 fw-semibold text-start">
|
||||
Transaction Date :
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-6 mb-3">
|
||||
<small>{formatUTCToLocalTime(data?.transactionDate)}</small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="col-md-6 mb-3">
|
||||
<div className="d-flex">
|
||||
<label
|
||||
className="form-label me-2 mb-0 fw-semibold text-start"
|
||||
style={{ minWidth: "130px" }}
|
||||
>
|
||||
Expense Category :
|
||||
</label>
|
||||
<div className="text-muted">{data?.expenseCategory?.name}</div>
|
||||
<div className="row text-start">
|
||||
<div className="col-md-6 mb-3">
|
||||
<div className="d-flex">
|
||||
<label className="form-label me-2 mb-0 fw-semibold text-start">
|
||||
Expense Category :
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-6 mb-3">
|
||||
<small className="text-muted">
|
||||
{data?.expenseCategory?.name}
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Row 2 */}
|
||||
<div className="col-md-6 mb-3">
|
||||
<div className="d-flex">
|
||||
<label
|
||||
className="form-label me-2 mb-0 fw-semibold text-start"
|
||||
style={{ minWidth: "130px" }}
|
||||
>
|
||||
<div className="row text-start">
|
||||
<div className="col-md-6 mb-3">
|
||||
<label className="form-label me-2 mb-0 fw-semibold text-start">
|
||||
Supplier :
|
||||
</label>
|
||||
<div className="text-muted">{data?.supplerName}</div>
|
||||
</div>
|
||||
|
||||
<div className="col-md-6 mb-3">
|
||||
<small className="text-muted">{data?.supplerName}</small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="col-md-6 mb-3">
|
||||
<div className="d-flex">
|
||||
<div className="row text-start">
|
||||
<div className="col-md-6 mb-3">
|
||||
<label
|
||||
className="form-label me-2 mb-0 fw-semibold text-start"
|
||||
style={{ minWidth: "130px" }}
|
||||
>
|
||||
Amount :
|
||||
</label>
|
||||
<div className="text-muted">
|
||||
</div>
|
||||
|
||||
<div className="col-md-6 mb-3">
|
||||
<small className="text-muted">
|
||||
{" "}
|
||||
{formatFigure(data?.amount, {
|
||||
type: "currency",
|
||||
currency: data?.currency?.currencyCode ?? "INR",
|
||||
})}
|
||||
</div>
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Row 3 */}
|
||||
<div className="col-md-6 mb-3">
|
||||
<div className="d-flex">
|
||||
<label
|
||||
className="form-label me-2 mb-0 fw-semibold text-start"
|
||||
style={{ minWidth: "130px" }}
|
||||
>
|
||||
<div className="row text-start">
|
||||
<div className="col-md-6 mb-3">
|
||||
<label className="form-label me-2 mb-0 fw-semibold text-start">
|
||||
Payment Mode :
|
||||
</label>
|
||||
<div className="text-muted">{data?.paymentMode?.name}</div>
|
||||
</div>
|
||||
<div className="col-md-6 mb-3">
|
||||
<div className="d-flex">
|
||||
<small className="text-muted">
|
||||
{data?.paymentMode?.name}
|
||||
</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{data?.gstNumber && (
|
||||
<div className="col-md-6 mb-3">
|
||||
<div className="d-flex">
|
||||
<div className="row text-start">
|
||||
<div className="col-md-6 mb-3">
|
||||
<label
|
||||
className="form-label me-2 mb-0 fw-semibold text-start"
|
||||
style={{ minWidth: "130px" }}
|
||||
>
|
||||
GST Number :
|
||||
</label>
|
||||
</div>
|
||||
<div className="col-md-6 mb-3">
|
||||
<div className="text-muted">{data?.gstNumber}</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="col-md-6 mb-3">
|
||||
{/* <div className="col-md-6 mb-3">
|
||||
<div className="d-flex">
|
||||
<label
|
||||
className="form-label me-2 mb-0 fw-semibold text-start"
|
||||
@ -235,61 +261,62 @@ const ViewExpense = ({ ExpenseId }) => {
|
||||
{data.preApproved ? "Yes" : "No"}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
|
||||
{/* Row 5 */}
|
||||
<div className="col-md-6 mb-3">
|
||||
<div className="d-flex">
|
||||
<label
|
||||
className="form-label me-2 mb-0 fw-semibold text-start"
|
||||
style={{ minWidth: "130px" }}
|
||||
>
|
||||
Project :
|
||||
</label>
|
||||
<div className="text-muted">{data?.project?.name}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<div className="col-md-6 mb-3">
|
||||
<div className="d-flex">
|
||||
<div className="row text-start">
|
||||
<div className="col-md-6 mb-3">
|
||||
|
||||
<label
|
||||
className="form-label me-2 mb-0 fw-semibold text-start"
|
||||
style={{ minWidth: "130px" }}
|
||||
>
|
||||
Created At :
|
||||
</label>
|
||||
<div className="text-muted">
|
||||
{formatUTCToLocalTime(data?.createdAt, true)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
<div className="col-md-6 mb-3">
|
||||
|
||||
<small className="text-muted">
|
||||
{formatUTCToLocalTime(data?.createdAt, true)}
|
||||
</small>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Created & Paid By */}
|
||||
{data.createdBy && (
|
||||
<div className="col-md-6 text-start mb-3">
|
||||
<div className="d-flex align-items-center">
|
||||
<div className="row text-start">
|
||||
<div className="col-md-6 text-start mb-3">
|
||||
<label
|
||||
className="form-label me-2 mb-0 fw-semibold"
|
||||
style={{ minWidth: "130px" }}
|
||||
>
|
||||
Created By :
|
||||
</label>
|
||||
<Avatar
|
||||
size="xs"
|
||||
classAvatar="m-0 me-1"
|
||||
firstName={data.createdBy?.firstName}
|
||||
lastName={data.createdBy?.lastName}
|
||||
/>
|
||||
<span className="text-muted">
|
||||
{`${data.createdBy?.firstName ?? ""} ${
|
||||
data.createdBy?.lastName ?? ""
|
||||
}`.trim() || "N/A"}
|
||||
</span>
|
||||
</div>
|
||||
<div className="col-md-6 text-start mb-3">
|
||||
<div className="d-flex align-items-center">
|
||||
<Avatar
|
||||
size="xs"
|
||||
classAvatar="m-0 me-1"
|
||||
firstName={data.createdBy?.firstName}
|
||||
lastName={data.createdBy?.lastName}
|
||||
/>
|
||||
<span className="text-muted">
|
||||
{`${data.createdBy?.firstName ?? ""} ${
|
||||
data.createdBy?.lastName ?? ""
|
||||
}`.trim() || "N/A"}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="col-md-6 text-start mb-3">
|
||||
{/* <div className="col-md-6 text-start mb-3">
|
||||
<div className="d-flex align-items-center">
|
||||
<label
|
||||
className="form-label me-2 mb-0 fw-semibold"
|
||||
@ -309,7 +336,32 @@ const ViewExpense = ({ ExpenseId }) => {
|
||||
}`.trim() || "N/A"}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
<div className="row text-start">
|
||||
<div className="col-md-6 text-start mb-3">
|
||||
<label
|
||||
className="form-label me-2 mb-0 fw-semibold"
|
||||
style={{ minWidth: "130px" }}
|
||||
>
|
||||
Paid By :
|
||||
</label>
|
||||
</div>
|
||||
<div className="col-md-6 text-start mb-3">
|
||||
<div className="d-flex align-items-center">
|
||||
<Avatar
|
||||
size="xs"
|
||||
classAvatar="m-0 me-1"
|
||||
firstName={data.paidBy?.firstName}
|
||||
lastName={data.paidBy?.lastName}
|
||||
/>
|
||||
<span className="text-muted">
|
||||
{`${data.paidBy?.firstName ?? ""} ${
|
||||
data.paidBy?.lastName ?? ""
|
||||
}`.trim() || "N/A"}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Description */}
|
||||
<div className="col-12 text-start mb-2">
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user