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