// ** React Imports import { useEffect, useState } from 'react' // ** Next Import import Link from 'next/link' // ** MUI Imports import Grid from '@mui/material/Grid' import Alert from '@mui/material/Alert' import Table from '@mui/material/Table' import Divider from '@mui/material/Divider' import TableRow from '@mui/material/TableRow' import TableHead from '@mui/material/TableHead' import TableBody from '@mui/material/TableBody' import Typography from '@mui/material/Typography' import Box, { BoxProps } from '@mui/material/Box' import { styled, useTheme } from '@mui/material/styles' import TableCell, { TableCellBaseProps } from '@mui/material/TableCell' // ** Types import { SingleInvoiceType, InvoiceLayoutProps } from 'src/types/apps/invoiceTypes' // ** Third Party Components import axios from 'axios' // ** Configs import themeConfig from 'src/configs/themeConfig' const CalcWrapper = styled(Box)(({ theme }) => ({ display: 'flex', alignItems: 'center', justifyContent: 'space-between', '&:not(:last-of-type)': { marginBottom: theme.spacing(2) } })) const MUITableCell = styled(TableCell)(({ theme }) => ({ borderBottom: 0, padding: `${theme.spacing(1, 0)} !important` })) const InvoicePrint = ({ id }: InvoiceLayoutProps) => { // ** State const [error, setError] = useState(false) const [data, setData] = useState(null) // ** Hooks const theme = useTheme() useEffect(() => { setTimeout(() => { window.print() }, 100) }, []) useEffect(() => { axios .get('/apps/invoice/single-invoice', { params: { id } }) .then(res => { setData(res.data) setError(false) }) .catch(() => { setData(null) setError(true) }) }, [id]) if (data) { const { invoice, paymentDetails } = data return ( {themeConfig.templateName}
Office 149, 450 South Brand Brooklyn San Diego County, CA 91905, USA +1 (123) 456 7891, +44 (876) 543 2198
{`Invoice #${invoice.id}`} Date Issued: {invoice.issuedDate} Date Due: {invoice.dueDate}
`${theme.spacing(6)} !important` }} /> Invoice To: {invoice.name} {invoice.company} {invoice.address} {invoice.contact} {invoice.companyEmail} Bill To: Total Due: {paymentDetails.totalDue} Bank name: {paymentDetails.bankName} Country: {paymentDetails.country} IBAN: {paymentDetails.iban} SWIFT code: {paymentDetails.swiftCode}
`${theme.spacing(6)} !important`, mb: '0 !important' }} /> Item Description hours qty Total Premium Branding Package Branding & Promotion 48 1 $32 Social Media Social media templates 42 1 $28 Web Design Web designing package 46 1 $24 SEO Search engine optimization 40 1 $22
Salesperson: Tommy Shelby Thanks for your business Subtotal: $1800 Discount: $28 Tax: 21% Total: $1690 Note: It was a pleasure working with you and your team. We hope you will keep us in mind for future freelance projects. Thank You!
) } else if (error) { return ( Invoice with the id: {id} does not exist. Please check the list of invoices:{' '} Invoice List ) } else { return null } } export default InvoicePrint