98 lines
3.3 KiB
TypeScript
98 lines
3.3 KiB
TypeScript
import { type FC, useMemo, useState } from 'react';
|
||
import { useTranslation } from 'react-i18next';
|
||
import { DocumentDownload } from 'iconsax-react';
|
||
import Table from '@/components/Table';
|
||
import Filters from '@/components/Filters';
|
||
import Button from '@/components/Button';
|
||
import PageLoading from '@/components/PageLoading';
|
||
import { usePermissions } from '@/hooks/usePermissions';
|
||
import { PermissionEnum } from '@/pages/roles/enum/Enum';
|
||
import { useGetDailyOrderReport } from './hooks/useDailyOrderReportData';
|
||
import { useDailyOrderReportFilters } from './hooks/useDailyOrderReportFilters';
|
||
import { getDailyOrderReportTableColumns } from './components/DailyOrderReportTableColumns';
|
||
import { useDailyOrderReportFiltersFields } from './components/DailyOrderReportFiltersFields';
|
||
import { getDailyOrderReport } from './service/OrderService';
|
||
import { exportDailyOrderReportExcel } from './utils/exportDailyOrderReportExcel';
|
||
import type { DailyOrderReportItem } from './types/Types';
|
||
import type { RowDataType } from '@/components/types/TableTypes';
|
||
|
||
const DailyOrderReport: FC = () => {
|
||
const { t } = useTranslation('global');
|
||
const { checkPermission, isLoading: isPermissionsLoading } = usePermissions();
|
||
const { filters, apiParams, handleFiltersChange } = useDailyOrderReportFilters();
|
||
const { data: reportData, isLoading } = useGetDailyOrderReport(apiParams);
|
||
const [isExporting, setIsExporting] = useState(false);
|
||
|
||
const columns = getDailyOrderReportTableColumns();
|
||
const filterFields = useDailyOrderReportFiltersFields();
|
||
|
||
const reportItems = useMemo(() => {
|
||
return (reportData?.data || []).map((item) => ({
|
||
...item,
|
||
id: item.date,
|
||
}));
|
||
}, [reportData?.data]);
|
||
|
||
const handleExportExcel = async () => {
|
||
setIsExporting(true);
|
||
try {
|
||
const response = await getDailyOrderReport(apiParams);
|
||
const items = (response?.data || []).map((item) => ({
|
||
...item,
|
||
id: item.date,
|
||
}));
|
||
exportDailyOrderReportExcel(items);
|
||
} finally {
|
||
setIsExporting(false);
|
||
}
|
||
};
|
||
|
||
if (isPermissionsLoading) {
|
||
return <PageLoading />;
|
||
}
|
||
|
||
if (!checkPermission(PermissionEnum.VIEW_ORDER_REPORTS)) {
|
||
return (
|
||
<div className='mt-5 text-sm text-gray-500'>
|
||
شما دسترسی مشاهده این گزارش را ندارید.
|
||
</div>
|
||
);
|
||
}
|
||
|
||
return (
|
||
<div className='mt-5'>
|
||
<div className='flex justify-between items-center'>
|
||
<h1 className='text-lg font-light'>{t('submenu.orders_daily_report')}</h1>
|
||
<Button
|
||
className='w-fit px-4'
|
||
isloading={isExporting}
|
||
disabled={isLoading}
|
||
onClick={handleExportExcel}
|
||
>
|
||
<div className='flex items-center gap-2'>
|
||
<DocumentDownload size={18} color='#fff' />
|
||
<span>خروجی Excel</span>
|
||
</div>
|
||
</Button>
|
||
</div>
|
||
|
||
<div className='mt-8'>
|
||
<Filters
|
||
fields={filterFields}
|
||
onChange={handleFiltersChange}
|
||
initialValues={filters}
|
||
showClearButton
|
||
/>
|
||
</div>
|
||
|
||
<Table<DailyOrderReportItem & RowDataType>
|
||
columns={columns}
|
||
data={reportItems as (DailyOrderReportItem & RowDataType)[]}
|
||
isloading={isLoading}
|
||
/>
|
||
</div>
|
||
);
|
||
};
|
||
|
||
export default DailyOrderReport;
|