seti-ramesesv1/dist/templates/OnlineTxnFormPage.js

Reusable components and context for Next.js apps

import { jsxs, jsx } from 'react/jsx-runtime';
import { loadPage } from 'loader-lib';
import { ChevronLeft } from 'lucide-react';
import { useState, useEffect } from 'react';
import ContentPanel from '../components/common/ContentPanel.js';
import { IconButton } from '../components/common/IconButton.js';
import Button from '../components/ui/Button.js';
import { Modal } from '../components/ui/Modal.js';
import Panel from '../components/ui/Panel.js';
import Spacer from '../components/ui/Spacer.js';
import { useContent } from '../context/ContentContext.js';

const OnlineTxnFormPage = (props) => {
    const title = props.title;
    const page = props.params.prevPage;
    const itemid = props.params.itemid;
    const component = props.attr.component;
    const { setContent } = useContent();
    const [loading, setLoading] = useState(true);
    const [acceptModal, setAcceptModal] = useState(false);
    const [returnModal, setReturnModal] = useState(false);
    const onBack = async () => {
        const templ = await loadPage({
            page: page,
            target: "main",
        });
        setContent("main", () => templ);
    };
    const onAccept = () => {
        setAcceptModal(!acceptModal);
    };
    const onReturn = () => {
        setReturnModal(!returnModal);
    };
    useEffect(() => {
        const loadTemplate = async () => {
            setLoading(true);
            const templ = await loadPage({
                page: component,
                target: "onlinetxnformpage",
                params: { itemid: itemid },
            });
            setContent("onlinetxnformpage", () => templ);
            setLoading(false);
        };
        loadTemplate();
    }, []);
    return (jsxs("div", { className: "m-4", children: [jsxs("div", { className: "flex justify-between", children: [jsxs("div", { className: "flex items-center gap-x-2", children: [jsx(IconButton, { onClick: onBack, children: jsx(ChevronLeft, {}) }), jsx("p", { className: "font-bold text-[1rem]", children: title })] }), jsxs("div", { className: "flex gap-x-2", children: [jsx(Button, { variant: "text", onClick: onReturn, children: "Return to Sender" }), jsx(Button, { variant: "contained", onClick: onAccept, children: "Accept for Processing" })] })] }), jsx(Spacer, { height: 20 }), loading ? (jsx("div", { className: "flex items-center justify-center pt-40", children: jsx("img", { src: "/assets/elipsisloading.gif", alt: "Loading..." }) })) : (jsx(Panel, { className: "px-12 text-[0.875rem] text-gray-700 max-h-[40rem] overflow-y-auto", children: jsx(ContentPanel, { id: "onlinetxnformpage" }) })), jsx(Modal, { open: acceptModal, onClose: () => setAcceptModal(false), children: jsxs("div", { className: "flex flex-col justify-center items-center gap-y-4", children: [jsx("img", { src: "/assets/approved.png", alt: "", className: "h-32" }), jsx("p", { className: "text-center text-[0.875rem] font-medium text-gray-600", children: "The application has been accepted for processing. It will now move to your Task section." }), jsx(Button, { variant: "outlined", onClick: () => setAcceptModal(false), children: "OK" })] }) }), jsx(Modal, { open: returnModal, onClose: () => setReturnModal(false), children: jsxs("div", { className: "flex flex-col justify-center items-center gap-y-4", children: [jsx("img", { src: "/assets/return.gif", alt: "", className: "h-32" }), jsx("p", { className: "text-center text-[0.875rem] font-medium text-gray-600", children: "The application was returned to the applicant and will be notified by email." }), jsx(Button, { variant: "outlined", onClick: () => setReturnModal(false), children: "OK" })] }) })] }));
};

export { OnlineTxnFormPage as default };
//# sourceMappingURL=OnlineTxnFormPage.js.map