louiscklaw/HKSingleParty
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

"feat: enhance invoice management with schema updates, seed data, and new APIs"

Browse Source
This commit is contained in:
louiscklaw
2025-05-30 16:48:54 +08:00
parent 5a707427c6
commit fd20a3531b
48 changed files with 1541 additions and 179 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
03_source/frontend/src/sections/invoice/invoice-details.tsx
View File

@@ -1,4 +1,4 @@
import type { IInvoice } from 'src/types/invoice';
import type { IInvoiceItem } from 'src/types/invoice';
import { useState, useCallback } from 'react';
@@ -23,18 +23,32 @@ import { Scrollbar } from 'src/components/scrollbar';
import { InvoiceToolbar } from './invoice-toolbar';
import { InvoiceTotalSummary } from './invoice-total-summary';
import { useTranslation } from 'react-i18next';
import { changeStatus } from 'src/actions/invoice';
import { toast } from 'src/components/snackbar';
// ----------------------------------------------------------------------
type Props = {
invoice?: IInvoice;
invoice: IInvoiceItem;
};
export function InvoiceDetails({ invoice }: Props) {
const { t } = useTranslation();
const [currentStatus, setCurrentStatus] = useState(invoice?.status);
const handleChangeStatus = useCallback((event: React.ChangeEvent<HTMLInputElement>) => {
setCurrentStatus(event.target.value);
// setCurrentStatus(event.target.value);
try {
changeStatus(invoice.id, event.target.value);
setCurrentStatus(event.target.value);
toast.success('status changed!');
} catch (error) {
console.error(error);
toast.warning('error during changing status');
}
}, []);
const renderFooter = () => (
@@ -172,7 +186,7 @@ export function InvoiceDetails({ invoice }: Props) {
<Typography variant="subtitle2" sx={{ mb: 1 }}>
Date create
</Typography>
{fDate(invoice?.createDate)}
{fDate(invoice?.createdDate)}
</Stack>
<Stack sx={{ typography: 'body2' }}>

81
03_source/frontend/src/sections/invoice/invoice-new-edit-form.tsx
View File

@@ -1,16 +1,4 @@
import type { IInvoice } from 'src/types/invoice';
import { z as zod } from 'zod';
import { useForm } from 'react-hook-form';
import { useBoolean } from 'minimal-shared/hooks';
import { zodResolver } from '@hookform/resolvers/zod';
import Box from '@mui/material/Box';
import Card from '@mui/material/Card';
import Button from '@mui/material/Button';
import { paths } from 'src/routes/paths';
import { useRouter } from 'src/routes/hooks';
// src/sections/invoice/invoice-new-edit-form.tsx
import { today, fIsAfter } from 'src/utils/format-time';
@@ -21,18 +9,37 @@ import { Form, schemaHelper } from 'src/components/hook-form';
import { InvoiceNewEditAddress } from './invoice-new-edit-address';
import { InvoiceNewEditStatusDate } from './invoice-new-edit-status-date';
import { defaultItem, InvoiceNewEditDetails } from './invoice-new-edit-details';
import { useTranslation } from 'react-i18next';
import { useForm } from 'react-hook-form';
import { useBoolean } from 'minimal-shared/hooks';
import { zodResolver } from '@hookform/resolvers/zod';
import Box from '@mui/material/Box';
import Button from '@mui/material/Button';
import Card from '@mui/material/Card';
import { toast } from 'src/components/snackbar';
import { useRouter } from 'src/routes/hooks';
import { paths } from 'src/routes/paths';
import type { IInvoiceItem } from 'src/types/invoice';
import { fileToBase64 } from 'src/utils/file-to-base64';
import { z as zod } from 'zod';
import { saveInvoice } from 'src/actions/invoice';
// ----------------------------------------------------------------------
export type NewInvoiceSchemaType = zod.infer<typeof NewInvoiceSchema>;
export const NewInvoiceSchema = zod
.object({
invoiceTo: schemaHelper.nullableInput(zod.custom<IInvoice['invoiceTo']>(), {
message: 'Invoice to is required!',
}),
createDate: schemaHelper.date({ message: { required: 'Create date is required!' } }),
dueDate: schemaHelper.date({ message: { required: 'Due date is required!' } }),
id: zod.string(),
taxes: zod.number(),
status: zod.string(),
discount: zod.number(),
shipping: zod.number(),
subtotal: zod.number(),
totalAmount: zod.number(),
items: zod.array(
zod.object({
title: zod.string().min(1, { message: 'Title is required!' }),
@@ -44,17 +51,18 @@ export const NewInvoiceSchema = zod
description: zod.string(),
})
),
// Not required
taxes: zod.number(),
status: zod.string(),
discount: zod.number(),
shipping: zod.number(),
subtotal: zod.number(),
totalAmount: zod.number(),
invoiceNumber: zod.string(),
invoiceFrom: zod.custom<IInvoice['invoiceFrom']>().nullable(),
invoiceFrom: zod.custom<IInvoiceItem['invoiceFrom']>().nullable(),
invoiceTo: schemaHelper.nullableInput(zod.custom<IInvoiceItem['invoiceTo']>(), {
message: 'Invoice to is required!',
}),
sent: zod.number().default(0),
createdDate: schemaHelper.date({ message: { required: 'Create date is required!' } }),
dueDate: schemaHelper.date({ message: { required: 'Due date is required!' } }),
// Not required
})
.refine((data) => !fIsAfter(data.createDate, data.dueDate), {
.refine((data) => !fIsAfter(data.createdDate, data.dueDate), {
message: 'Due date cannot be earlier than create date!',
path: ['dueDate'],
});
@@ -62,18 +70,19 @@ export const NewInvoiceSchema = zod
// ----------------------------------------------------------------------
type Props = {
currentInvoice?: IInvoice;
currentInvoice?: IInvoiceItem;
};
export function InvoiceNewEditForm({ currentInvoice }: Props) {
const router = useRouter();
const { t } = useTranslation();
const loadingSave = useBoolean();
const loadingSend = useBoolean();
const defaultValues: NewInvoiceSchemaType = {
invoiceNumber: 'INV-1990',
createDate: today(),
createdDate: today(),
dueDate: null,
taxes: 0,
shipping: 0,
@@ -105,6 +114,7 @@ export function InvoiceNewEditForm({ currentInvoice }: Props) {
try {
await new Promise((resolve) => setTimeout(resolve, 500));
reset();
loadingSave.onFalse();
router.push(paths.dashboard.invoice.root);
console.info('DATA', JSON.stringify(data, null, 2));
@@ -118,10 +128,15 @@ export function InvoiceNewEditForm({ currentInvoice }: Props) {
loadingSend.onTrue();
try {
await new Promise((resolve) => setTimeout(resolve, 500));
reset();
if (currentInvoice) {
await saveInvoice(currentInvoice.id, data);
}
loadingSend.onFalse();
toast.success(currentInvoice ? 'Update success!' : 'Create success!');
router.push(paths.dashboard.invoice.root);
console.info('DATA', JSON.stringify(data, null, 2));
} catch (error) {
console.error(error);
@@ -151,6 +166,7 @@ export function InvoiceNewEditForm({ currentInvoice }: Props) {
color="inherit"
size="large"
variant="outlined"
disabled={loadingSave.value && isSubmitting}
loading={loadingSave.value && isSubmitting}
onClick={handleSaveAsDraft}
>
@@ -160,6 +176,7 @@ export function InvoiceNewEditForm({ currentInvoice }: Props) {
<Button
size="large"
variant="contained"
disabled={loadingSend.value && isSubmitting}
loading={loadingSend.value && isSubmitting}
onClick={handleCreateAndSend}
>

4
03_source/frontend/src/sections/invoice/invoice-new-edit-status-date.tsx
View File

@@ -4,11 +4,13 @@ import Box from '@mui/material/Box';
import MenuItem from '@mui/material/MenuItem';
import { Field } from 'src/components/hook-form';
import { useTranslation } from 'react-i18next';
// ----------------------------------------------------------------------
export function InvoiceNewEditStatusDate() {
const { watch } = useFormContext();
const { t } = useTranslation();
const values = watch();
@@ -37,7 +39,7 @@ export function InvoiceNewEditStatusDate() {
>
{['paid', 'pending', 'overdue', 'draft'].map((option) => (
<MenuItem key={option} value={option} sx={{ textTransform: 'capitalize' }}>
{option}
{t(option)}
</MenuItem>
))}
</Field.Select>

10
03_source/frontend/src/sections/invoice/invoice-pdf.tsx
View File

@@ -1,4 +1,4 @@
import type { IInvoice } from 'src/types/invoice';
import type { IInvoiceItem } from 'src/types/invoice';
import { useMemo } from 'react';
import {
@@ -25,7 +25,7 @@ import { Iconify } from 'src/components/iconify';
// ----------------------------------------------------------------------
type InvoicePDFProps = {
invoice?: IInvoice;
invoice?: IInvoiceItem;
currentStatus: string;
};
@@ -126,7 +126,7 @@ const useStyles = () =>
);
type InvoicePdfDocumentProps = {
invoice?: IInvoice;
invoice?: IInvoiceItem;
currentStatus: string;
};
@@ -139,7 +139,7 @@ function InvoicePdfDocument({ invoice, currentStatus }: InvoicePdfDocumentProps)
shipping,
subtotal,
invoiceTo,
createDate,
createdDate,
totalAmount,
invoiceFrom,
invoiceNumber,
@@ -197,7 +197,7 @@ function InvoicePdfDocument({ invoice, currentStatus }: InvoicePdfDocumentProps)
<View style={[styles.container, styles.mb40]}>
<View style={{ width: '50%' }}>
<Text style={[styles.text1Bold, styles.mb4]}>Date create</Text>
<Text style={[styles.text2]}>{fDate(createDate)}</Text>
<Text style={[styles.text2]}>{fDate(createdDate)}</Text>
</View>
<View style={{ width: '50%' }}>
<Text style={[styles.text1Bold, styles.mb4]}>Due date</Text>

19
03_source/frontend/src/sections/invoice/invoice-table-row.tsx
View File

@@ -1,4 +1,5 @@
import type { IInvoice } from 'src/types/invoice';
// src/sections/invoice/invoice-table-row.tsx
import type { IInvoiceItem } from 'src/types/invoice';
import { useBoolean, usePopover } from 'minimal-shared/hooks';
@@ -24,11 +25,12 @@ import { Label } from 'src/components/label';
import { Iconify } from 'src/components/iconify';
import { ConfirmDialog } from 'src/components/custom-dialog';
import { CustomPopover } from 'src/components/custom-popover';
import { useTranslation } from 'react-i18next';
// ----------------------------------------------------------------------
type Props = {
row: IInvoice;
row: IInvoiceItem;
selected: boolean;
editHref: string;
detailsHref: string;
@@ -44,6 +46,7 @@ export function InvoiceTableRow({
onDeleteRow,
detailsHref,
}: Props) {
const { t } = useTranslation();
const menuActions = usePopover();
const confirmDialog = useBoolean();
@@ -58,14 +61,14 @@ export function InvoiceTableRow({
<li>
<MenuItem component={RouterLink} href={detailsHref} onClick={menuActions.onClose}>
<Iconify icon="solar:eye-bold" />
View
{t('View')}
</MenuItem>
</li>
<li>
<MenuItem component={RouterLink} href={editHref} onClick={menuActions.onClose}>
<Iconify icon="solar:pen-bold" />
Edit
{t('Edit')}
</MenuItem>
</li>
@@ -79,7 +82,7 @@ export function InvoiceTableRow({
sx={{ color: 'error.main' }}
>
<Iconify icon="solar:trash-bin-trash-bold" />
Delete
{t('Delete')}
</MenuItem>
</MenuList>
</CustomPopover>
@@ -93,7 +96,7 @@ export function InvoiceTableRow({
content="Are you sure want to delete?"
action={
<Button variant="contained" color="error" onClick={onDeleteRow}>
Delete
{t('Delete')}
</Button>
}
/>
@@ -138,8 +141,8 @@ export function InvoiceTableRow({
<TableCell>
<ListItemText
primary={fDate(row.createDate)}
secondary={fTime(row.createDate)}
primary={fDate(row.createdDate)}
secondary={fTime(row.createdDate)}
slotProps={{
primary: { noWrap: true, sx: { typography: 'body2' } },
secondary: { sx: { mt: 0.5, typography: 'caption' } },

29
03_source/frontend/src/sections/invoice/invoice-table-toolbar.tsx
View File

@@ -1,3 +1,5 @@
// src/sections/invoice/invoice-table-toolbar.tsx
import type { IDatePickerControl } from 'src/types/common';
import type { IInvoiceTableFilters } from 'src/types/invoice';
import type { SelectChangeEvent } from '@mui/material/Select';
@@ -22,6 +24,7 @@ import { formHelperTextClasses } from '@mui/material/FormHelperText';
import { Iconify } from 'src/components/iconify';
import { CustomPopover } from 'src/components/custom-popover';
import { useTranslation } from 'react-i18next';
// ----------------------------------------------------------------------
@@ -34,7 +37,14 @@ type Props = {
};
};
export function InvoiceTableToolbar({ filters, options, dateError, onResetPage }: Props) {
export function InvoiceTableToolbar({
//
filters,
options,
dateError,
onResetPage,
}: Props) {
const { t } = useTranslation();
const menuActions = usePopover();
const { state: currentFilters, setState: updateFilters } = filters;
@@ -84,17 +94,17 @@ export function InvoiceTableToolbar({ filters, options, dateError, onResetPage }
<MenuList>
<MenuItem onClick={() => menuActions.onClose()}>
<Iconify icon="solar:printer-minimalistic-bold" />
Print
{t('Print')}
</MenuItem>
<MenuItem onClick={() => menuActions.onClose()}>
<Iconify icon="solar:import-bold" />
Import
{t('Import')}
</MenuItem>
<MenuItem onClick={() => menuActions.onClose()}>
<Iconify icon="solar:export-bold" />
Export
{t('Export')}
</MenuItem>
</MenuList>
</CustomPopover>
@@ -113,7 +123,7 @@ export function InvoiceTableToolbar({ filters, options, dateError, onResetPage }
}}
>
<FormControl sx={{ flexShrink: 0, width: { xs: 1, md: 180 } }}>
<InputLabel htmlFor="filter-service-select">Service</InputLabel>
<InputLabel htmlFor="filter-service-select">{t('Service')}</InputLabel>
<Select
multiple
value={currentFilters.service}
@@ -143,7 +153,7 @@ export function InvoiceTableToolbar({ filters, options, dateError, onResetPage }
</FormControl>
<DatePicker
label="Start date"
label={t('Start date')}
value={currentFilters.endDate}
onChange={handleFilterStartDate}
slotProps={{ textField: { fullWidth: true } }}
@@ -151,14 +161,14 @@ export function InvoiceTableToolbar({ filters, options, dateError, onResetPage }
/>
<DatePicker
label="End date"
label={t('End date')}
value={currentFilters.endDate}
onChange={handleFilterEndDate}
slotProps={{
textField: {
fullWidth: true,
error: dateError,
helperText: dateError ? 'End date must be later than start date' : null,
helperText: dateError ? t('End date must be later than start date') : null,
},
}}
sx={{
@@ -183,7 +193,7 @@ export function InvoiceTableToolbar({ filters, options, dateError, onResetPage }
fullWidth
value={currentFilters.name}
onChange={handleFilterName}
placeholder="Search customer or invoice number..."
placeholder={t('Search customer or invoice number...')}
slotProps={{
input: {
startAdornment: (
@@ -194,7 +204,6 @@ export function InvoiceTableToolbar({ filters, options, dateError, onResetPage }
},
}}
/>
<IconButton onClick={menuActions.onOpen}>
<Iconify icon="eva:more-vertical-fill" />
</IconButton>

23
03_source/frontend/src/sections/invoice/invoice-toolbar.tsx
View File

@@ -1,4 +1,4 @@
import type { IInvoice } from 'src/types/invoice';
import type { IInvoiceItem } from 'src/types/invoice';
import { useBoolean } from 'minimal-shared/hooks';
@@ -17,19 +17,25 @@ import { RouterLink } from 'src/routes/components';
import { Iconify } from 'src/components/iconify';
import { InvoicePDFViewer, InvoicePDFDownload } from './invoice-pdf';
import { useTranslation } from 'react-i18next';
import { useState } from 'react';
import { set } from 'nprogress';
// ----------------------------------------------------------------------
type Props = {
invoice?: IInvoice;
invoice?: IInvoiceItem;
currentStatus: string;
statusOptions: { value: string; label: string }[];
onChangeStatus: (event: React.ChangeEvent<HTMLInputElement>) => void;
};
export function InvoiceToolbar({ invoice, currentStatus, statusOptions, onChangeStatus }: Props) {
const { t } = useTranslation();
const { value: open, onFalse: onClose, onTrue: onOpen } = useBoolean();
const [disable, setDisable] = useState<boolean>(false);
const renderDownloadButton = () =>
invoice ? <InvoicePDFDownload invoice={invoice} currentStatus={currentStatus} /> : null;
@@ -38,7 +44,7 @@ export function InvoiceToolbar({ invoice, currentStatus, statusOptions, onChange
<Box sx={{ height: 1, display: 'flex', flexDirection: 'column' }}>
<DialogActions sx={{ p: 1.5 }}>
<Button color="inherit" variant="contained" onClick={onClose}>
Close
{t('Close')}
</Button>
</DialogActions>
<Box sx={{ flexGrow: 1, height: 1, overflow: 'hidden' }}>
@@ -104,11 +110,16 @@ export function InvoiceToolbar({ invoice, currentStatus, statusOptions, onChange
</Box>
<TextField
disabled={disable}
fullWidth
select
label="Status"
label={t('Status')}
value={currentStatus}
onChange={onChangeStatus}
onChange={(e) => {
setDisable(true);
onChangeStatus(e);
setDisable(false);
}}
sx={{ maxWidth: 160 }}
slotProps={{
htmlInput: { id: 'status-select' },
@@ -117,7 +128,7 @@ export function InvoiceToolbar({ invoice, currentStatus, statusOptions, onChange
>
{statusOptions.map((option) => (
<MenuItem key={option.value} value={option.value}>
{option.label}
{t(option.label)}
</MenuItem>
))}
</TextField>

20
03_source/frontend/src/sections/invoice/view/invoice-details-view.tsx
View File

@@ -1,4 +1,6 @@
import type { IInvoice } from 'src/types/invoice';
// src/sections/invoice/view/invoice-details-view.tsx
import type { IInvoiceItem } from 'src/types/invoice';
import { paths } from 'src/routes/paths';
@@ -7,22 +9,30 @@ import { DashboardContent } from 'src/layouts/dashboard';
import { CustomBreadcrumbs } from 'src/components/custom-breadcrumbs';
import { InvoiceDetails } from '../invoice-details';
import { useTranslation } from 'react-i18next';
// ----------------------------------------------------------------------
type Props = {
invoice?: IInvoice;
invoice?: IInvoiceItem;
loading?: boolean;
error?: any;
};
export function InvoiceDetailsView({ invoice }: Props) {
export function InvoiceDetailsView({ invoice, error, loading }: Props) {
const { t } = useTranslation();
if (!invoice) return <>loading</>;
if (loading) return <>loading</>;
return (
<DashboardContent>
<CustomBreadcrumbs
heading={invoice?.invoiceNumber}
backHref={paths.dashboard.invoice.root}
links={[
{ name: 'Dashboard', href: paths.dashboard.root },
{ name: 'Invoice', href: paths.dashboard.invoice.root },
{ name: t('Dashboard'), href: paths.dashboard.root },
{ name: t('Invoice'), href: paths.dashboard.invoice.root },
{ name: invoice?.invoiceNumber },
]}
sx={{ mb: 3 }}

6
03_source/frontend/src/sections/invoice/view/invoice-edit-view.tsx
View File

@@ -1,4 +1,4 @@
import type { IInvoice } from 'src/types/invoice';
import type { IInvoiceItem } from 'src/types/invoice';
import { paths } from 'src/routes/paths';
@@ -11,10 +11,12 @@ import { InvoiceNewEditForm } from '../invoice-new-edit-form';
// ----------------------------------------------------------------------
type Props = {
invoice?: IInvoice;
invoice?: IInvoiceItem;
};
export function InvoiceEditView({ invoice }: Props) {
if (!invoice) return <>loading</>;
return (
<DashboardContent>
<CustomBreadcrumbs

81
03_source/frontend/src/sections/invoice/view/invoice-list-view.tsx
View File

@@ -1,8 +1,10 @@
// src/sections/invoice/view/invoice-list-view.tsx
import type { TableHeadCellProps } from 'src/components/table';
import type { IInvoice, IInvoiceTableFilters } from 'src/types/invoice';
import type { IInvoiceItem, IInvoiceTableFilters } from 'src/types/invoice';
import { sumBy } from 'es-toolkit';
import { useState, useCallback } from 'react';
import { useState, useCallback, useEffect } from 'react';
import { varAlpha } from 'minimal-shared/utils';
import { useBoolean, useSetState } from 'minimal-shared/hooks';
@@ -33,6 +35,8 @@ import { Iconify } from 'src/components/iconify';
import { Scrollbar } from 'src/components/scrollbar';
import { ConfirmDialog } from 'src/components/custom-dialog';
import { CustomBreadcrumbs } from 'src/components/custom-breadcrumbs';
import { deleteInvoice, useGetInvoices } from 'src/actions/invoice';
import {
useTable,
emptyRows,
@@ -59,12 +63,6 @@ export function InvoiceListView() {
const theme = useTheme();
const { t } = useTranslation();
const table = useTable({ defaultOrderBy: 'createDate' });
const confirmDialog = useBoolean();
const [tableData, setTableData] = useState<IInvoice[]>(_invoices);
const TABLE_HEAD: TableHeadCellProps[] = [
{ id: 'invoiceNumber', label: t('Customer') },
{ id: 'createDate', label: t('Create') },
@@ -75,6 +73,13 @@ export function InvoiceListView() {
{ id: '' },
];
const table = useTable({ defaultOrderBy: 'createDate' });
const confirmDeleteMultiItemsDialog = useBoolean();
const { invoices, invoicesLoading, mutate } = useGetInvoices();
const [tableData, setTableData] = useState<IInvoiceItem[]>(invoices);
const filters = useSetState<IInvoiceTableFilters>({
name: '',
service: [],
@@ -86,6 +91,12 @@ export function InvoiceListView() {
const dateError = fIsAfter(currentFilters.startDate, currentFilters.endDate);
useEffect(() => {
if (invoices.length) {
setTableData(invoices);
}
}, [invoices]);
const dataFiltered = applyFilter({
inputData: tableData,
comparator: getComparator(table.order, table.orderBy),
@@ -179,11 +190,11 @@ export function InvoiceListView() {
[updateFilters, table]
);
const renderConfirmDialog = () => (
const renderDeleteMultipleItemsConfirmDialog = () => (
<ConfirmDialog
open={confirmDialog.value}
onClose={confirmDialog.onFalse}
title="Delete"
open={confirmDeleteMultiItemsDialog.value}
onClose={confirmDeleteMultiItemsDialog.onFalse}
title={t('Delete multiple invoices')}
content={
<>
Are you sure want to delete <strong> {table.selected.length} </strong> items?
@@ -195,24 +206,30 @@ export function InvoiceListView() {
color="error"
onClick={() => {
handleDeleteRows();
confirmDialog.onFalse();
confirmDeleteMultiItemsDialog.onFalse();
}}
>
Delete
{t('Delete')}
</Button>
}
/>
);
useEffect(() => {
mutate();
}, []);
if (invoicesLoading) return <>loading</>;
return (
<>
<DashboardContent>
<CustomBreadcrumbs
heading="List"
heading={t('Invoice List')}
links={[
{ name: 'Dashboard', href: paths.dashboard.root },
{ name: 'Invoice', href: paths.dashboard.invoice.root },
{ name: 'List' },
{ name: t('Dashboard'), href: paths.dashboard.root },
{ name: t('Invoice'), href: paths.dashboard.invoice.root },
{ name: t('List') },
]}
action={
<Button
@@ -221,7 +238,7 @@ export function InvoiceListView() {
variant="contained"
startIcon={<Iconify icon="mingcute:add-line" />}
>
New invoice
{t('New invoice')}
</Button>
}
sx={{ mb: { xs: 3, md: 5 } }}
@@ -234,7 +251,7 @@ export function InvoiceListView() {
sx={{ py: 2, flexDirection: 'row' }}
>
<InvoiceAnalytic
title="Total"
title={t('Total')}
total={tableData.length}
percent={100}
price={sumBy(tableData, (invoice) => invoice.totalAmount)}
@@ -243,7 +260,7 @@ export function InvoiceListView() {
/>
<InvoiceAnalytic
title="Paid"
title={t('Paid')}
total={getInvoiceLength('paid')}
percent={getPercentByStatus('paid')}
price={getTotalAmount('paid')}
@@ -252,7 +269,7 @@ export function InvoiceListView() {
/>
<InvoiceAnalytic
title="Pending"
title={t('Pending')}
total={getInvoiceLength('pending')}
percent={getPercentByStatus('pending')}
price={getTotalAmount('pending')}
@@ -261,7 +278,7 @@ export function InvoiceListView() {
/>
<InvoiceAnalytic
title="Overdue"
title={t('Overdue')}
total={getInvoiceLength('overdue')}
percent={getPercentByStatus('overdue')}
price={getTotalAmount('overdue')}
@@ -270,7 +287,7 @@ export function InvoiceListView() {
/>
<InvoiceAnalytic
title="Draft"
title={t('Draft')}
total={getInvoiceLength('draft')}
percent={getPercentByStatus('draft')}
price={getTotalAmount('draft')}
@@ -294,7 +311,7 @@ export function InvoiceListView() {
<Tab
key={tab.value}
value={tab.value}
label={tab.label}
label={t(tab.label)}
iconPosition="end"
icon={
<Label
@@ -340,26 +357,26 @@ export function InvoiceListView() {
}}
action={
<Box sx={{ display: 'flex' }}>
<Tooltip title="Sent">
<Tooltip title={t('Sent')}>
<IconButton color="primary">
<Iconify icon="custom:send-fill" />
</IconButton>
</Tooltip>
<Tooltip title="Download">
<Tooltip title={t('Download')}>
<IconButton color="primary">
<Iconify icon="solar:download-bold" />
</IconButton>
</Tooltip>
<Tooltip title="Print">
<Tooltip title={t('Print')}>
<IconButton color="primary">
<Iconify icon="solar:printer-minimalistic-bold" />
</IconButton>
</Tooltip>
<Tooltip title="Delete">
<IconButton color="primary" onClick={confirmDialog.onTrue}>
<Tooltip title={t('Delete')}>
<IconButton color="primary" onClick={confirmDeleteMultiItemsDialog.onTrue}>
<Iconify icon="solar:trash-bin-trash-bold" />
</IconButton>
</Tooltip>
@@ -425,7 +442,7 @@ export function InvoiceListView() {
</Card>
</DashboardContent>
{renderConfirmDialog()}
{renderDeleteMultipleItemsConfirmDialog()}
</>
);
}
@@ -434,7 +451,7 @@ export function InvoiceListView() {
type ApplyFilterProps = {
dateError: boolean;
inputData: IInvoice[];
inputData: IInvoiceItem[];
filters: IInvoiceTableFilters;
comparator: (a: any, b: any) => number;
};