change list invoce and tickets + pwa + ...

This commit is contained in:
hamid zarghami
2025-03-05 16:44:11 +03:30
parent 0084aefae4
commit b346481267
19 changed files with 8624 additions and 188 deletions
+2 -1
View File
@@ -427,7 +427,8 @@
"approved": "تایید شده",
"APPROVED": "تایید شده",
"pending": "در انتظار",
"since": "از تاریخ"
"since": "از تاریخ",
"to": "تا تاریخ"
},
"edit": "ویرایش",
"transaction": {
+6
View File
@@ -3,6 +3,7 @@ import { useTranslation } from 'react-i18next'
import { Element3, Messages3, NotificationStatus, People, Receipt2 } from 'iconsax-react'
import ItemDashboard from './components/ItemDashboard'
import { useGetDashboard } from './hooks/useHomeData'
import { Pages } from '../../config/Pages'
const Home: FC = () => {
@@ -21,6 +22,7 @@ const Home: FC = () => {
color='#00D16C'
count={getDashboard.data?.data?.danakServicesCount}
description={t('home.service')}
to={Pages.services.list}
/>
<ItemDashboard
@@ -29,6 +31,7 @@ const Home: FC = () => {
color='#00D16C'
count={getDashboard.data?.data?.customersCount}
description={t('home.customer')}
to={Pages.customers.list}
/>
<ItemDashboard
@@ -37,6 +40,7 @@ const Home: FC = () => {
color='#FF7B00'
count={getDashboard.data?.data?.unreadTickets}
description={t('home.unread_messages')}
to={Pages.ticket.list}
/>
<ItemDashboard
@@ -45,6 +49,7 @@ const Home: FC = () => {
color='#FF0000'
count={getDashboard.data?.data?.adsCount}
description={t('home.active_ads')}
to={Pages.ads.list}
/>
<ItemDashboard
@@ -53,6 +58,7 @@ const Home: FC = () => {
color='#0047FF'
count={getDashboard.data?.data?.invoicesCount}
description={t('home.new_invoice')}
to={Pages.receipts.index}
/>
</div>
+5 -3
View File
@@ -1,17 +1,19 @@
import { FC, ReactNode } from 'react'
import { Link } from 'react-router-dom'
type Props = {
title: string
icon: ReactNode,
color: string,
count: number,
description: string
description: string,
to?: string
}
const ItemDashboard: FC<Props> = (props: Props) => {
return (
<div className='p-6 min-w-[40%] xl:min-w-[15%] flex flex-col items-center xl:items-start flex-1 h-[178px] bg-white rounded-3xl'>
<Link to={props.to ? props.to : ''} className='p-6 min-w-[40%] xl:min-w-[15%] flex flex-col items-center xl:items-start flex-1 h-[178px] bg-white rounded-3xl'>
<div className='size-10 rounded-full bg-[#EEF0F7] flex justify-center items-center'>
{props.icon}
</div>
@@ -28,7 +30,7 @@ const ItemDashboard: FC<Props> = (props: Props) => {
</div>
</div>
</div>
</div>
</Link>
)
}
+1
View File
@@ -93,6 +93,7 @@ const CreateReceipt: FC = () => {
<Button
className='px-5'
onClick={handleSubmit}
isLoading={createInvoice.isPending}
>
<div className='flex gap-2 items-center'>
<TickCircle size={20} color='white' />
+16 -6
View File
@@ -13,22 +13,25 @@ import Input from '../../components/Input'
import { CustomerItemType } from '../customer/types/CustomerTypes'
import DatePickerComponent from '../../components/DatePicker'
import { useSearchParams } from 'react-router-dom'
import moment from 'moment-jalaali'
const ReceiptsList: FC = () => {
const { t } = useTranslation('global')
const [searchParams] = useSearchParams()
const [activeTab, setActiveTab] = useState<"PENDING" | "PAID" | "CANCELED" | "EXPIRED">('PENDING')
const [activeTab, setActiveTab] = useState<"PENDING" | "PAID" | "CANCELLED" | "EXPIRED" | ''>('PENDING')
const [customerId, setCustomerId] = useState<string>('')
const [search, setSearch] = useState<string>('')
const [date, setDate] = useState<string>('')
const getInvoices = useGetInvoices(activeTab, customerId, search, date)
const [endDate, setEndDate] = useState<string>('')
const getInvoices = useGetInvoices(activeTab, customerId, search, date, endDate)
const getCustomers = useGetCustomers()
useEffect(() => {
const urlCustomerId = searchParams.get('user')
if (urlCustomerId) {
setCustomerId(urlCustomerId)
setActiveTab('')
}
}, [searchParams])
@@ -55,12 +58,19 @@ const ReceiptsList: FC = () => {
/>
<DatePickerComponent
onChange={(date) => setDate(date)}
onChange={(date) => setDate(moment(date, 'jYYYY-jMM-jDD').format('YYYY-MM-DD'))}
label={t('receip.since')}
className='min-w-40'
placeholder={t('select')}
/>
<DatePickerComponent
onChange={(date) => setEndDate(moment(date, 'jYYYY-jMM-jDD').format('YYYY-MM-DD'))}
label={t('receip.to')}
className='min-w-40'
placeholder={t('select')}
/>
</div>
<div>
<Input
@@ -87,9 +97,9 @@ const ReceiptsList: FC = () => {
value: 'PAID'
},
{
icon: <CloseCircle color={activeTab === 'CANCELED' ? 'black' : '#8C90A3'} size={22} />,
icon: <CloseCircle color={activeTab === 'CANCELLED' ? 'black' : '#8C90A3'} size={22} />,
label: t('receip.canceled'),
value: 'CANCELED'
value: 'CANCELLED'
},
{
icon: <FolderOpen color={activeTab === 'EXPIRED' ? 'black' : '#8C90A3'} size={22} />,
@@ -97,7 +107,7 @@ const ReceiptsList: FC = () => {
value: 'EXPIRED'
},
]}
onChange={(value) => setActiveTab(value as "PENDING" | "PAID" | "CANCELED" | "EXPIRED")}
onChange={(value) => setActiveTab(value as "PENDING" | "PAID" | "CANCELLED" | "EXPIRED")}
/>
</div>
+4 -3
View File
@@ -6,11 +6,12 @@ export const useGetInvoices = (
status: string,
customerId: string,
search: string,
date: string
date: string,
endDate: string
) => {
return useQuery({
queryKey: ["invoices", status, customerId, search, date],
queryFn: () => api.getInvoces(status, customerId, search, date),
queryKey: ["invoices", status, customerId, search, date, endDate],
queryFn: () => api.getInvoces(status, customerId, search, date, endDate),
});
};
+9 -5
View File
@@ -5,12 +5,16 @@ export const getInvoces = async (
status: string,
customerId: string,
search: string,
date: string
date: string,
endDate: string
) => {
let query = `status=${status}`;
if (customerId) query += `&userId=${customerId}`;
if (search) query += `&q=${search}`;
if (date) query += `&date=${date}`;
const params = new URLSearchParams();
if (status) params.append("status", status);
if (customerId) params.append("userId", customerId);
if (search) params.append("q", search);
if (date) params.append("since", date);
if (endDate) params.append("to", endDate);
const query = params.toString();
const { data } = await axios.get(`/invoices?${query}`);
return data;
};
+1 -1
View File
@@ -26,6 +26,6 @@ export type ReceiptItemType = {
lastName: string;
};
dueDate: string;
status: "PENDING" | "PAID" | "CANCELED" | "EXPIRED" | "APPROVED";
status: "PENDING" | "PAID" | "CANCELLED" | "EXPIRED" | "APPROVED";
paidAt: string;
};
+2 -1
View File
@@ -14,13 +14,14 @@ const TicketList: FC = () => {
const { t } = useTranslation('global')
const [searchParams] = useSearchParams()
const [customerId, setCustomerId] = useState<string>('')
const [activeTab, setActiveTab] = useState<'ANSWERED' | 'PENDING' | 'CLOSED'>('PENDING')
const [activeTab, setActiveTab] = useState<'ANSWERED' | 'PENDING' | 'CLOSED' | ''>('PENDING')
const getTicket = useGetTickets(activeTab, customerId)
useEffect(() => {
const urlCustomerId = searchParams.get('user')
if (urlCustomerId) {
setCustomerId(urlCustomerId)
setActiveTab('')
}
}, [searchParams])
+5 -5
View File
@@ -2,11 +2,11 @@ import axios from "../../../config/axios";
import { AddMessageTicketType, CreateCategoryType } from "../types/TicketTypes";
export const getTickets = async (status: string, customerId?: string) => {
let query = `/tickets/admin?status=${status}`;
if (customerId) {
query += `&userId=${customerId}`;
}
const { data } = await axios.get(query);
const params = new URLSearchParams();
if (status) params.append("status", status);
if (customerId) params.append("userId", customerId);
const query = params.toString();
const { data } = await axios.get(`/tickets/admin?${query}`);
return data;
};