diff --git a/src/components/Expenses/PreviewDocument.jsx b/src/components/Expenses/PreviewDocument.jsx index 9c0f5c49..7ea0c3ec 100644 --- a/src/components/Expenses/PreviewDocument.jsx +++ b/src/components/Expenses/PreviewDocument.jsx @@ -1,27 +1,53 @@ -import { useState } from 'react'; +import { useState } from "react"; const PreviewDocument = ({ imageUrl }) => { const [loading, setLoading] = useState(true); + const [rotation, setRotation] = useState(0); return ( -
+ <> +
+ setRotation((prev) => prev + 90)} + > +
+
+ {loading && ( -
- Loading... -
+
Loading...
)} - Full View setLoading(false)} - /> + +
+ Full View setLoading(false)} + /> +
+ +
+ +
+ ); }; diff --git a/src/components/collections/CollectionSkeleton.jsx b/src/components/collections/CollectionSkeleton.jsx new file mode 100644 index 00000000..82878454 --- /dev/null +++ b/src/components/collections/CollectionSkeleton.jsx @@ -0,0 +1,211 @@ +import React from "react"; + +const SkeletonLine = ({ height = 20, width = "100%", className = "" }) => ( +
+); + +export const PaymentHistorySkeleton = ({ count = 2 }) => { + return ( +
+ {[...Array(count)].map((_, idx) => ( +
+
+ {/* Top Row: Date + Amount */} +
+ {/* Date */} + {/* Amount */} +
+ +
+ {/* Transaction ID */} +
+ +
+ + {/* Received By (Avatar + Name) */} +
+ {" "} + {/* Avatar */} + {/* Name */} +
+
+
+
+ ))} +
+ ); +}; + +export const CollectionDetailsSkeleton = () => { + return ( +
+ {/* Title */} + + + {/* Header Row */} +
+
+ +
+
+ +
+
+ + {/* Project */} +
+
+ +
+
+ + {/* Invoice & E-Invoice */} +
+
+ +
+
+ +
+
+ + {/* Invoice Date & Client Submitted */} +
+
+ +
+
+ +
+
+ + {/* Expected Payment & Mark as Completed */} +
+
+ +
+
+ +
+
+ + {/* Basic & Tax Amount */} +
+
+ +
+
+ +
+
+ + {/* Balance & Created At */} +
+
+ +
+
+ +
+
+ + {/* Created By */} +
+
+ + +
+
+ + {/* Description */} +
+
+ +
+
+ + {/* Attachments */} +
+
+ {[...Array(3)].map((_, idx) => ( + + ))} +
+
+ + {/* Tabs */} +
+
+ + +
+
+ + {/* Tab Content (Comments / Payments) */} + +
+ ); +}; + +export const CollectionTableSkeleton = () => { + const columnCount = 8; + + return ( +
+
+
+ + + + {[...Array(columnCount - 1)].map((_, i) => ( + + ))} + + + + + {[...Array(8)].map((_, rowIdx) => ( + + {[...Array(columnCount - 1)].map((_, colIdx) => ( + + ))} + + + ))} + +
+ + + +
+ + + +
+ + {/* Pagination Skeleton */} +
+ +
+
+
+
+ ); +}; diff --git a/src/components/master/MasterModal.jsx b/src/components/master/MasterModal.jsx index 44d2af60..0eab1b08 100644 --- a/src/components/master/MasterModal.jsx +++ b/src/components/master/MasterModal.jsx @@ -16,6 +16,7 @@ import ManageDocumentCategory from "./ManageDocumentCategory"; import ManageDocumentType from "./ManageDocumentType"; import ManageServices from "./Services/ManageServices"; import ServiceGroups from "./Services/ServicesGroups"; +import ManagePaymentHead from "./paymentAdjustmentHead/ManagePaymentHead"; const MasterModal = ({ modaldata, closeModal }) => { if (!modaldata?.modalType || modaldata.modalType === "delete") { @@ -67,6 +68,8 @@ const MasterModal = ({ modaldata, closeModal }) => { "Manage-Services": ( ), + "Payment Adjustment Head": , + "Edit-Payment Adjustment Head": }; return ( diff --git a/src/components/master/paymentAdjustmentHead/ManagePaymentHead.jsx b/src/components/master/paymentAdjustmentHead/ManagePaymentHead.jsx new file mode 100644 index 00000000..1afba4ab --- /dev/null +++ b/src/components/master/paymentAdjustmentHead/ManagePaymentHead.jsx @@ -0,0 +1,107 @@ +import React, { useEffect } from "react"; +import { z } from "zod"; +import { useForm } from "react-hook-form"; +import { zodResolver } from "@hookform/resolvers/zod"; +import Label from "../../common/Label"; +import { useCreatePaymentAjustmentHead, useUpdatePaymentAjustmentHead } from "../../../hooks/masterHook/useMaster"; + +export const simpleFormSchema = z.object({ + name: z.string().min(1, "Name is required"), + description: z.string().min(1, "Description is required"), +}); + +const ManagePaymentHead = ({ data, onClose }) => { + const { + register, + handleSubmit, + reset, + formState: { errors }, + } = useForm({ + resolver: zodResolver(simpleFormSchema), + defaultValues: { + name: "", + description: "", + }, + }); + + const {mutate:CreateAjustmentHead,isPending} = useCreatePaymentAjustmentHead(()=>{ + handleClose?.() + }); + const {mutate:UpdateAjustmentHead,isPending:isUpdating} = useUpdatePaymentAjustmentHead(()=>{ + handleClose?.() + }) + const onSubmit = (formData) => { + if(data){ + let id = data?.id; + const payload = { + ...formData, + id:id, + } + UpdateAjustmentHead({id:id,payload:payload}) + }else{ + let payload={ + ...formData + } + CreateAjustmentHead(payload) + } + }; + + useEffect(() => { + if (data) { + reset({ + name: data.name, + description: data.description, + }); + } + }, [data]); + const handleClose = () => { + reset(); + onClose(); + }; + return ( +
+
+
+ + + {errors.name && ( +
{errors.name.message}
+ )} +
+ +
+ +