{getPageTitle('View payment')}

import React, { ReactElement, useEffect } from 'react'; import Head from 'next/head'; import DatePicker from 'react-datepicker'; import 'react-datepicker/dist/react-datepicker.css'; import dayjs from 'dayjs'; import { useAppDispatch, useAppSelector } from '../../stores/hooks'; import { useRouter } from 'next/router'; import { fetch } from '../../stores/payment/paymentSlice'; import { saveFile } from '../../helpers/fileSaver'; import dataFormatter from '../../helpers/dataFormatter'; import ImageField from '../../components/ImageField'; import LayoutAuthenticated from '../../layouts/Authenticated'; import { getPageTitle } from '../../config'; import SectionTitleLineWithButton from '../../components/SectionTitleLineWithButton'; import SectionMain from '../../components/SectionMain'; import CardBox from '../../components/CardBox'; import BaseButton from '../../components/BaseButton'; import BaseDivider from '../../components/BaseDivider'; import { mdiChartTimelineVariant } from '@mdi/js'; import { SwitchField } from '../../components/SwitchField'; import FormField from '../../components/FormField'; const PaymentView = () => { const router = useRouter(); const dispatch = useAppDispatch(); const { payment } = useAppSelector((state) => state.payment); const { id } = router.query; function removeLastCharacter(str) { console.log(str, `str`); return str.slice(0, -1); } useEffect(() => { dispatch(fetch({ id })); }, [dispatch, id]); return ( <> {getPageTitle('View payment')}

Student

{payment?.student?.first_name ?? 'No data'}

Invoice

{payment?.invoice?.amount ?? 'No data'}

Amountpaid

{payment?.amountpaid || 'No data'}

Paymentmode

{payment?.paymentmode ?? 'No data'}

Chequeno

{payment?.chequeno}

Bankname

{payment?.bankname}

Transactionid

{payment?.transactionid}

Ddnumber

{payment?.ddnumber}

Ddissuingbank

{payment?.ddissuingbank}

Receiptnumber

{payment?.receiptnumber}

Discountpercentage

{payment?.discountpercentage || 'No data'}

Discountamount

{payment?.discountamount || 'No data'}

Discountreason

{payment?.discountreason}

{payment.ddissuedate ? ( ) : (

No Ddissuedate

)}

Remainingbalance

{payment?.remainingbalance || 'No data'}

{payment.paymentdate ? ( ) : (

No Paymentdate

)} router.push('/payment/payment-list')} /> ); }; PaymentView.getLayout = function getLayout(page: ReactElement) { return ( {page} ); }; export default PaymentView;