import React, { useEffect, useState } from "react"; import Box from "@app-emos/layout/Box"; import { TableView } from "@amxchange/grid-view-web-client"; import ContentWrapper from "@app-emos/layout/ContentWrapper"; import { PAYMENT_VOUCHER_INQUIRY_VIEW_NAME } from "./constants"; import {FETCH_BRANCH_HEADER_DATA, BRANCH_ID} from "../PaymentVoucherCreation/constants" import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import approvedReject from "@app-emos/assets/utils/svgs/approved.svg"; import printVoucher from "@app-emos/assets/utils/svgs/print.svg"; import editIcon from "@app-emos/assets/utils/svgs/edit.svg"; import bankChequekIcon from "@app-emos/assets/utils/svgs/bank-check.svg"; import viewIconsvg from "@app-emos/assets/utils/svgs/view.svg"; import disbursementIcon from "@app-emos/assets/utils/svgs/refresh.svg"; import cancelIcon from "@app-emos/assets/utils/svgs/cancel.svg"; import { downloadPdf } from "../../PettyCash/utils/downloadPdf"; import { useHistory } from "react-router-dom/cjs/react-router-dom.min"; import moment from "moment"; import DataService from "@common-services/DataService"; import { faEye, faPenToSquare, faCircleXmark, faPrint, faMoneyCheck, faArrowRightArrowLeft, faCircleCheck } from "@fortawesome/free-solid-svg-icons"; import ToastUtil from "@common-utils/ToastUtil"; import { FETCH_PRINT_DOCUMENT_DATA } from "../PaymentVoucherCreation/constants"; import { AuthService } from "@common-services/AuthService"; function index() { const [vatApplicable, setVatApplicabe] = useState(false); const [success, setSuccess] = useState(false); const [rotate, setRotate] = useState(false); const [isVatApplicable, setIsVatApplicable] = useState(false); const handleSuccess = () => { setSuccess(true); }; const reloadPage = () => { // Rotate the button setRotate(true); // After 2 seconds, reload the page setTimeout(() => { window.location.reload(); }, 2000); }; // const handleCLickPrintCPVPVoucher = async voucherId => { // if (!voucherId) return; // const docData = await fetchPrintDataCPVP(voucherId, "CPV"); // console.log({ docData: docData }); // docData && downloadPdf(docData, "CPV"); // }; // const fetchPrintDataCPVP = async (voucherId, documentType) => { // let docData = null; // console.log(voucherId, "fetchPrintDataCPVP"); // try { // const response = await DataService.post(FETCH_PRINT_DOCUMENT_DATA, { // pettyCashHeaderId: voucherId, // documentType: documentType // }); // if (response.status === "200") { // const docTypes = { // CPV: "cpvDocument" // }; // docData = response.results[0][docTypes[documentType]]; // ToastUtil.success(`${documentType} Document Downloaded Successfully`); // } else if (res.response?.data.messageKey) { // ToastUtil.error(res.response?.data.message, res.response?.data.messageKey); // } // console.log(response.data.results[0], "voucher id"); // } catch (e) { // console.log(e, "Error fetching print data"); // } finally { // return docData; // } // }; const fetchHeaderData = async () => { try { const res = await DataService.get(`${FETCH_BRANCH_HEADER_DATA}?branchId=${BRANCH_ID}`); setIsVatApplicable(res.data.results[0].vatApplicable); } catch (err) { console.error("Error while fetching header Data ", err); } }; useEffect(() => { fetchHeaderData(); }, []); const handleCLickPrintCPVPVoucher = async (voucherId, docType) => { if (AuthService.isActionAllowed("PAYMENT_VOUCHER.INQUIRY", ["DOWNLOAD"])) { if (!voucherId) return; const docTypes = { CPVP: "CPVP" }; const docData = await fetchPrintDataCPVP(voucherId, "CPVP"); docData && downloadPdf(docData, docTypes[docType], isVatApplicable); } else { ToastUtil.error("Permission for this action is not present!!", "ACTION_NOT_ALLOWED"); } }; const fetchPrintDataCPVP = async voucherId => { let docData = null; console.log(voucherId, "fetchPrintData"); try { const response = await DataService.post(`/api/paymentvoucher/print-voucher`, { voucherId: voucherId }); if (response.status === "200") { // console.log({ response: response.results[0] }, "auaauauau"); docData = response.results[0]; ToastUtil.success(`Document Downloaded Successfully`); } console.log(response.data.results[0], "voucher id"); } catch (e) { console.log(e, "Error fetching print data"); } finally { return docData; } }; const handleCLickPrintVoucher = async (voucherId, docType) => { const permission = "PAYMENT_VOUCHER.INQUIRY"; const actions = ["DOWNLOAD"]; if (AuthService.isActionAllowed(permission, actions)) { if (!voucherId) return; const docTypes = { BC: "BCV", BW: "BWV" }; const docData = await fetchPrintData(voucherId, "BCWC"); docData && downloadPdf(docData, docTypes[docType],isVatApplicable); } else { ToastUtil.error("You are not authorized to download this document"); } }; const fetchPrintData = async voucherId => { let docData = null; console.log(voucherId, "fetchPrintData"); try { const response = await DataService.post(`/api/paymentvoucher/print-voucher`, { voucherId: voucherId }); if (response.status === "200") { // console.log({ response: response.results[0] }, "auaauauau"); docData = response.results[0]; ToastUtil.success(`Document Downloaded Successfully`); } console.log(response.data.results[0], "voucher id"); } catch (e) { console.log(e, "Error fetching print data"); } finally { return docData; } }; const getParticularDayOfMonth = (dayFlag = "F") => { const date = new Date(); const currYear = date.getFullYear(); const currMonth = date.getMonth(); if (dayFlag === "L") { const lastDayOfMonth = new Date(currYear, currMonth + 1, 0); return lastDayOfMonth.valueOf(); //timestamp } else if (dayFlag === "F") { const firstDayOfMonth = new Date(currYear, currMonth, 1); return firstDayOfMonth.valueOf(); //timestamp } else { return date.valueOf(); // Return current date timestamp if dayFlag is not "F" or "L" } }; const history = useHistory(); const handleClick = voucherId => { console.log("Payment View"); const permission = "PAYMENT_VOUCHER.INQUIRY"; const actions = ["VIEW"]; if (AuthService.isActionAllowed(permission, actions)) { history.push(`/emos/app/payment-voucher/view/voucherId=${voucherId}`); } else { ToastUtil.error("You are not authorized to perform this action"); } }; const handleEditClick = voucherId => { const permission = "PAYMENT_VOUCHER.INQUIRY"; const actions = ["EDIT"]; if (AuthService.isActionAllowed(permission, actions)) { history.push(`/emos/app/payment-voucher/edit/voucherId=${voucherId}`); } else { ToastUtil.error("You are not authorized to perform this action"); } }; const handleApproveClick = pvHeaderId => { const permission = "PAYMENT_VOUCHER.INQUIRY"; const actions = ["APPROVE"]; if (AuthService.isActionAllowed(permission, actions)) { history.push(`/emos/app/payment-voucher/approve-reject/pvHeaderId=${pvHeaderId}`); } else { ToastUtil.error("You are not authorized to perform this action"); } }; const handleDisbursementClick = pvHeaderId => { const permission = "PAYMENT_VOUCHER.INQUIRY"; const actions = ["DISBURSEMENT"]; if (AuthService.isActionAllowed(permission, actions)) { history.push(`/emos/app/payment-voucher/disbursement/pvHeaderId=${pvHeaderId}`); } else { ToastUtil.error("You are not authorized to perform this action"); } }; const handlePrintChequeClick = pvHeaderId => { const permission = "PAYMENT_VOUCHER.INQUIRY"; const actions = ["DOWNLOAD_CHEQUE"]; if (AuthService.isActionAllowed(permission, actions)) { history.push(`/emos/app/payment-voucher/print-cheque/pvHeaderId=${pvHeaderId}`); } else { ToastUtil.error("You are not authorized to perform this action"); } }; const handlePrintCancellationClick = pvHeaderId => { const permission = "PAYMENT_VOUCHER.INQUIRY"; const actions = ["CANCEL_VOUCHER"]; if (AuthService.isActionAllowed(permission, actions)) { history.push(`/emos/app/payment-voucher/cancellation/pvHeaderId=${pvHeaderId}`); } else { ToastUtil.error("You are not authorized to perform this action"); } }; return (
{ const { DOCUMENT_STATUS } = row.original; const { VOUCHER_TYPE_DESC } = row.original; // const {DISBURSEMENT_REF} = row.original const { VCHTYP } = row.original; // const { STATUS_DESC } = row.original; const showSpecificIcons = DOCUMENT_STATUS === "Y"; const viewIcon = DOCUMENT_STATUS === "C"; const unApprovedIcons = DOCUMENT_STATUS === "U"; const rejectIcons = DOCUMENT_STATUS === "R"; const showPrintVoucehr = VOUCHER_TYPE_DESC === "Bank Payment With Cheque"; // const disbursementCancelIcon = DISBURSEMENT_REF === !null; // const showDisbursement const printCashPayment = VOUCHER_TYPE_DESC === "Cash Payment"; // console.log(DOC_STATUS.status); return (
{viewIcon && ( handleClick(row.original.PV_HEADER_ID)} onMouseEnter={e => { e.target.style.opacity = 1; e.target.style.backgroundColor = "none"; }} onMouseLeave={e => { e.target.style.opacity = 1; e.target.style.backgroundColor = "white"; }} /> )} {showSpecificIcons && !viewIcon && ( <> handleClick(row.original.PV_HEADER_ID)} onMouseEnter={e => { e.target.style.opacity = 1; e.target.style.backgroundColor = "none"; }} onMouseLeave={e => { e.target.style.opacity = 1; e.target.style.backgroundColor = "white"; }} /> handleDisbursementClick(row.original.PV_HEADER_ID)} onMouseEnter={e => { e.target.style.opacity = 1; e.target.style.backgroundColor = "none"; }} onMouseLeave={e => { e.target.style.opacity = 1; e.target.style.backgroundColor = "white"; }} /> printCashPayment ? handleCLickPrintCPVPVoucher( row.original.PV_HEADER_ID, "CPVP" ) : handleCLickPrintVoucher( row.original.PV_HEADER_ID, row.original.VCHTYP ) } onMouseEnter={e => { e.target.style.opacity = 1; e.target.style.backgroundColor = "none"; }} onMouseLeave={e => { e.target.style.opacity = 1; e.target.style.backgroundColor = "white"; }} /> handlePrintCancellationClick(row.original.PV_HEADER_ID) } onMouseEnter={e => { e.target.style.opacity = 1; e.target.style.backgroundColor = "none"; }} onMouseLeave={e => { e.target.style.opacity = 1; e.target.style.backgroundColor = "white"; }} /> )} {unApprovedIcons && ( <> handleClick(row.original.PV_HEADER_ID)} onMouseEnter={e => { e.target.style.opacity = 1; e.target.style.backgroundColor = "none"; }} onMouseLeave={e => { e.target.style.opacity = 1; e.target.style.backgroundColor = "white"; }} /> handleEditClick(row.original.PV_HEADER_ID)} onMouseEnter={e => { e.target.style.opacity = 1; e.target.style.backgroundColor = "none"; }} onMouseLeave={e => { e.target.style.opacity = 1; e.target.style.backgroundColor = "white"; }} /> printCashPayment ? handleCLickPrintCPVPVoucher( row.original.PV_HEADER_ID, "CPVP" ) : handleCLickPrintVoucher( row.original.PV_HEADER_ID, row.original.VCHTYP ) } onMouseEnter={e => { e.target.style.opacity = 1; e.target.style.backgroundColor = "none"; }} onMouseLeave={e => { e.target.style.opacity = 1; e.target.style.backgroundColor = "white"; }} /> Approve Reject handleApproveClick(row.original.PV_HEADER_ID)} onMouseEnter={e => { e.target.style.opacity = 1; e.target.style.backgroundColor = "none"; }} onMouseLeave={e => { e.target.style.opacity = 1; e.target.style.backgroundColor = "white"; }} /> {showPrintVoucehr && ( handlePrintChequeClick(row.original.PV_HEADER_ID) } onMouseEnter={e => { e.target.style.opacity = 1; e.target.style.backgroundColor = "none"; }} onMouseLeave={e => { e.target.style.opacity = 1; e.target.style.backgroundColor = "white"; }} /> )} )} {rejectIcons && ( <> handleClick(row.original.PV_HEADER_ID)} onMouseEnter={e => { e.target.style.opacity = 1; e.target.style.backgroundColor = "none"; }} onMouseLeave={e => { e.target.style.opacity = 1; e.target.style.backgroundColor = "white"; }} /> )}
); } } ]} overrideColumns={[ { accessor: "DOCUMENT_DATE", Cell: row => {moment(row.original.DOCUMENT_DATE).format("DD-MM-YYYY")}, Header: "DATE", width: 200 }, { accessor: "VOUCHER_TYPE_DESC", Header: "VOUCHER TYPE", width: 300 }, { Header: "VAT AMOUNT", accessor: "VAT_AMOUNT", show: isVatApplicable, Cell: row => { return
{row.value}
; } } ]} filterConfig={{ /* Setting default Vals for Status, from date and to date*/ FROM_DATE_FILTER: { defaultValue: getParticularDayOfMonth("F") }, TO_DATE_FILTER: { defaultValue: new Date().valueOf(), disableFuture: true } }} defaultPageSize={5} extraConfig={{ sortColumn: "DOCUMENT_DATE" && "PV_HEADER_ID", sortOrder: "DESC" }} /> ); } export default index;