ticket and annoncement
This commit is contained in:
hamid zarghami
+4
-2
@@ -168,7 +168,8 @@
|
||||
"HIGH": "بالا",
|
||||
"PENDING": "در انتظار",
|
||||
"ANSWERED": "پاسخ داده شده",
|
||||
"CLOSED": "بسته شده"
|
||||
"CLOSED": "بسته شده",
|
||||
"service": "سرویس"
|
||||
},
|
||||
"date": "تاریخ",
|
||||
"receip": {
|
||||
@@ -373,7 +374,8 @@
|
||||
"enter_address": " آدرس خود را با دقت وارد کنید.",
|
||||
"state": "استان",
|
||||
"city": "شهر",
|
||||
"notice_cannot_edit": "ویرایش مشخصات فردی بعد از تکمیل اطلاعات امکان پذیر نیست"
|
||||
"notice_cannot_edit": "ویرایش مشخصات فردی بعد از تکمیل اطلاعات امکان پذیر نیست",
|
||||
"notice_cannot_edit_legal": "ویرایش مشخصات حقوقی بعد از تکمیل اطلاعات امکان پذیر نیست"
|
||||
},
|
||||
"man": "مرد",
|
||||
"woman": "زن",
|
||||
|
||||
@@ -1,13 +1,17 @@
|
||||
import { FC } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import StatusWithText from '../../components/StatusWithText'
|
||||
import { useNavigate } from 'react-router-dom'
|
||||
import { useNavigate, useParams } from 'react-router-dom'
|
||||
import { ArrowLeft2 } from 'iconsax-react'
|
||||
import { useGetAnnoncementDetail } from './hooks/useAnnoncementData'
|
||||
import PageLoading from '../../components/PageLoading'
|
||||
|
||||
const AnnouncementDetail: FC = () => {
|
||||
|
||||
const { id } = useParams()
|
||||
const { t } = useTranslation('global')
|
||||
const navigate = useNavigate()
|
||||
const getAnnoncementDetail = useGetAnnoncementDetail(id ? id : '')
|
||||
|
||||
return (
|
||||
<div className='mt-4'>
|
||||
@@ -21,21 +25,29 @@ const AnnouncementDetail: FC = () => {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='flex-1 mt-4 bg-white py-6 px-4 rounded-2xl'>
|
||||
<div className='flex justify-between items-start'>
|
||||
<div className='text-sm max-w-[70%] leading-67'>
|
||||
لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ
|
||||
</div>
|
||||
<StatusWithText
|
||||
variant='success'
|
||||
text={t('announcement.new')}
|
||||
/>
|
||||
</div>
|
||||
{
|
||||
getAnnoncementDetail.isPending ?
|
||||
<PageLoading />
|
||||
:
|
||||
<div className='flex-1 mt-4 bg-white py-6 px-4 rounded-2xl'>
|
||||
<div className='flex justify-between items-start'>
|
||||
<div className='text-sm max-w-[70%] leading-67'>
|
||||
{getAnnoncementDetail.data?.data?.announcement?.title}
|
||||
</div>
|
||||
{
|
||||
getAnnoncementDetail.data?.data?.announcement.isImportant &&
|
||||
<StatusWithText
|
||||
variant='error'
|
||||
text={t('announcement.important')}
|
||||
/>
|
||||
}
|
||||
</div>
|
||||
|
||||
<div className='mt-5 leading-7 text-xs font-light'>
|
||||
لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد، کتابهای زیادی در شصت و سه درصد گذشته حال و آینده، شناخت فراوان جامعه و متخصصان را می طلبد، تا با نرم افزارها شناخت بیشتری را برای طراحان رایانه ای علی الخصوص طراحان خلاقی، و فرهنگ پیشرو در زبان فارسی ایجاد کرد، در این صورت می توان امید داشت که تمام و دشواری موجود در ارائه راهکارها، و شرایط سخت تایپ به پایان رسد و زمان مورد نیاز شامل حروفچینی دستاوردهای اصلی، و جوابگوی سوالات پیوسته اهل دنیای موجود طراحی اساسا مورد استفاده قرار گیرد.
|
||||
</div>
|
||||
</div>
|
||||
<div dangerouslySetInnerHTML={{ __html: getAnnoncementDetail.data?.data?.announcement?.content }} className='mt-5 leading-7 text-xs font-light'>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -1,23 +1,28 @@
|
||||
import { FC, Fragment } from 'react'
|
||||
import { FC, Fragment, useState } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import Input from '../../components/Input'
|
||||
import Select from '../../components/Select'
|
||||
import StatusWithText from '../../components/StatusWithText'
|
||||
import { clx } from '../../helpers/utils'
|
||||
import { useNavigate } from 'react-router-dom'
|
||||
import { Pages } from '../../config/Pages'
|
||||
import { useGetAnnoncement } from './hooks/useAnnoncementData'
|
||||
import PageLoading from '../../components/PageLoading'
|
||||
import { AnnoncementItemType } from './types/AnnoncementTypes'
|
||||
import moment from 'moment-jalaali'
|
||||
|
||||
const AnnouncementtList: FC = () => {
|
||||
|
||||
const getAnnoncements = useGetAnnoncement()
|
||||
const { t } = useTranslation('global')
|
||||
const navigate = useNavigate()
|
||||
const { t } = useTranslation('global')
|
||||
const [search, setSearch] = useState<string>('')
|
||||
const [itemSelected, setItemSelected] = useState<AnnoncementItemType>()
|
||||
const getAnnoncements = useGetAnnoncement(search)
|
||||
|
||||
const handleChange = () => {
|
||||
const handleChange = (item: AnnoncementItemType) => {
|
||||
if (window.innerWidth < 1280) {
|
||||
navigate(Pages.announcement.detail + '1')
|
||||
navigate(Pages.announcement.detail + item.id)
|
||||
} else {
|
||||
setItemSelected(item)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -35,10 +40,11 @@ const AnnouncementtList: FC = () => {
|
||||
variant='search'
|
||||
placeholder={t('announcement.search')}
|
||||
className='-mt-1'
|
||||
onChangeSearchFinal={(value) => setSearch(value)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
{/* <div>
|
||||
<Select
|
||||
items={[
|
||||
{ value: '1', label: 'همه' },
|
||||
@@ -47,98 +53,86 @@ const AnnouncementtList: FC = () => {
|
||||
]}
|
||||
className='bg-[#EEF0F7] w-[68px]'
|
||||
/>
|
||||
</div>
|
||||
</div> */}
|
||||
</div>
|
||||
|
||||
{
|
||||
getAnnoncements.isPending ?
|
||||
<PageLoading />
|
||||
<div className='mt-8'>
|
||||
<PageLoading />
|
||||
</div>
|
||||
:
|
||||
<Fragment>
|
||||
<div className='mt-8'>
|
||||
<div onClick={handleChange} className={clx(
|
||||
'p-4 rounded-2xl',
|
||||
'bg-[#F8F9FB]'
|
||||
)}>
|
||||
<div className='flex justify-between'>
|
||||
<div className='leading-6 text-xs xl:text-[12.5px] max-w-[70%]'>
|
||||
لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ
|
||||
</div>
|
||||
{
|
||||
getAnnoncements.data?.data?.announcements?.map((item: AnnoncementItemType) => {
|
||||
return (
|
||||
<div onClick={() => handleChange(item)} className={clx(
|
||||
'p-4 rounded-2xl',
|
||||
item.id === itemSelected?.id && 'bg-[#F8F9FB]'
|
||||
)}>
|
||||
<div className='flex justify-between'>
|
||||
<div className='leading-6 text-xs xl:text-[12.5px] max-w-[70%]'>
|
||||
{item.title}
|
||||
</div>
|
||||
|
||||
<div className='flex gap-1'>
|
||||
<StatusWithText
|
||||
variant='error'
|
||||
text={t('announcement.important')}
|
||||
/>
|
||||
<StatusWithText
|
||||
variant='success'
|
||||
text={t('announcement.new')}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className='flex gap-1'>
|
||||
{
|
||||
item.isImportant &&
|
||||
<StatusWithText
|
||||
variant='error'
|
||||
text={t('announcement.important')}
|
||||
/>
|
||||
}
|
||||
{/* <StatusWithText
|
||||
variant='success'
|
||||
text={t('announcement.new')}
|
||||
/> */}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='m-2 flex justify-between items-center text-[11px]'>
|
||||
<div className='max-w-[70%] truncate text-description'>
|
||||
لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ
|
||||
</div>
|
||||
<div className='text-description'>
|
||||
۱۴۰۳/۰۹/۲۴
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div onClick={handleChange} className={clx(
|
||||
'p-4 rounded-2xl',
|
||||
)}>
|
||||
<div className='flex justify-between'>
|
||||
<div className='leading-6 text-xs xl:text-[12.5px] max-w-[70%]'>
|
||||
لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ
|
||||
</div>
|
||||
<div className='m-2 flex justify-between items-center text-[11px]'>
|
||||
<div dangerouslySetInnerHTML={{ __html: item.content }} className='max-w-[70%] truncate text-description'>
|
||||
</div>
|
||||
<div className='text-description'>
|
||||
{moment(item.publishAt, 'jYYYY/jMM/jDD').format('jYYYY/jMM/jDD')}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
}
|
||||
|
||||
<div className='flex gap-1'>
|
||||
<StatusWithText
|
||||
variant='error'
|
||||
text={t('announcement.important')}
|
||||
/>
|
||||
<StatusWithText
|
||||
variant='success'
|
||||
text={t('announcement.new')}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='m-2 flex justify-between items-center text-[11px]'>
|
||||
<div className='max-w-[70%] truncate text-description'>
|
||||
لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ
|
||||
</div>
|
||||
<div className='text-description'>
|
||||
۱۴۰۳/۰۹/۲۴
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Fragment>
|
||||
}
|
||||
</div>
|
||||
|
||||
<div className='flex-1 hidden xl:block bg-white py-7 px-5 rounded-2xl'>
|
||||
<div className='flex justify-between items-center'>
|
||||
<div className='text-lg'>
|
||||
متن اطلاعیه
|
||||
{
|
||||
itemSelected &&
|
||||
<div className='flex-1 hidden xl:block bg-white py-7 px-5 rounded-2xl'>
|
||||
<div className='flex justify-between items-center'>
|
||||
<div className='text-lg'>
|
||||
متن اطلاعیه
|
||||
</div>
|
||||
{
|
||||
itemSelected.isImportant &&
|
||||
<StatusWithText
|
||||
variant='error'
|
||||
text={t('announcement.important')}
|
||||
/>
|
||||
}
|
||||
</div>
|
||||
<StatusWithText
|
||||
variant='success'
|
||||
text={t('announcement.new')}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className='mt-8'>
|
||||
لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ
|
||||
</div>
|
||||
<div className='mt-8'>
|
||||
{itemSelected.title}
|
||||
</div>
|
||||
|
||||
<div className='mt-5 leading-7 text-xs font-light'>
|
||||
لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد، کتابهای زیادی در شصت و سه درصد گذشته حال و آینده، شناخت فراوان جامعه و متخصصان را می طلبد، تا با نرم افزارها شناخت بیشتری را برای طراحان رایانه ای علی الخصوص طراحان خلاقی، و فرهنگ پیشرو در زبان فارسی ایجاد کرد، در این صورت می توان امید داشت که تمام و دشواری موجود در ارائه راهکارها، و شرایط سخت تایپ به پایان رسد و زمان مورد نیاز شامل حروفچینی دستاوردهای اصلی، و جوابگوی سوالات پیوسته اهل دنیای موجود طراحی اساسا مورد استفاده قرار گیرد.
|
||||
<div dangerouslySetInnerHTML={{ __html: itemSelected.content }} className='mt-5 leading-7 text-xs font-light'>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
@@ -1,9 +1,17 @@
|
||||
import * as api from "../service/AnnoncementService";
|
||||
import { useQuery } from "@tanstack/react-query";
|
||||
|
||||
export const useGetAnnoncement = () => {
|
||||
export const useGetAnnoncement = (search: string) => {
|
||||
return useQuery({
|
||||
queryKey: ["announcements"],
|
||||
queryFn: () => api.getAnnoncements(),
|
||||
queryKey: ["announcements", search],
|
||||
queryFn: () => api.getAnnoncements(search),
|
||||
});
|
||||
};
|
||||
|
||||
export const useGetAnnoncementDetail = (id: string) => {
|
||||
return useQuery({
|
||||
queryKey: ["announcement", id],
|
||||
queryFn: () => api.getAnnoncementDetail(id),
|
||||
enabled: !!id,
|
||||
});
|
||||
};
|
||||
|
||||
@@ -1,6 +1,11 @@
|
||||
import axios from "../../../config/axios";
|
||||
|
||||
export const getAnnoncements = async () => {
|
||||
const { data } = await axios.get(`/announcements/user`);
|
||||
export const getAnnoncements = async (search: string) => {
|
||||
const { data } = await axios.get(`/announcements/user?q=${search}`);
|
||||
return data;
|
||||
};
|
||||
|
||||
export const getAnnoncementDetail = async (id: string) => {
|
||||
const { data } = await axios.get(`/announcements/${id}`);
|
||||
return data;
|
||||
};
|
||||
|
||||
@@ -0,0 +1,16 @@
|
||||
export type AnnoncementItemType = {
|
||||
content: string;
|
||||
createdAt: string;
|
||||
id: string;
|
||||
isImportant: boolean;
|
||||
isPublic: boolean;
|
||||
isRead: boolean;
|
||||
publishAt: string;
|
||||
service: {
|
||||
id: string;
|
||||
name: string;
|
||||
};
|
||||
targetGroups: any[];
|
||||
title: string;
|
||||
updatedAt: string;
|
||||
};
|
||||
@@ -191,7 +191,7 @@ const Legal: FC = () => {
|
||||
size={18}
|
||||
color='#DB0105'
|
||||
/>
|
||||
<div>{t('financial.notice_cannot_edit')}</div>
|
||||
<div>{t('financial.notice_cannot_edit_legal')}</div>
|
||||
</div>
|
||||
|
||||
{
|
||||
|
||||
+226
-218
@@ -1,15 +1,20 @@
|
||||
import { FC } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import { Edit } from 'iconsax-react'
|
||||
import StatusCircle from '../../components/StatusCircle'
|
||||
import SamanImage from '../../assets/images/saman.png'
|
||||
import { useParams } from 'react-router-dom'
|
||||
import { useGetInvoiceDetail } from './hooks/useReceiptData'
|
||||
import { useGetFinancialInfo } from '../financial/hooks/useFinancialData'
|
||||
import { ReceiptDetailItemType } from './types/ReceiptTypes'
|
||||
import { NumberFormat } from '../../config/func'
|
||||
import moment from 'moment-jalaali'
|
||||
import PageLoading from '../../components/PageLoading'
|
||||
|
||||
const ReceiptsDetail: FC = () => {
|
||||
|
||||
const { id } = useParams()
|
||||
const { t } = useTranslation('global')
|
||||
const getProfile = useGetFinancialInfo()
|
||||
const getInvoce = useGetInvoiceDetail(id ? id : '')
|
||||
|
||||
return (
|
||||
@@ -19,241 +24,244 @@ const ReceiptsDetail: FC = () => {
|
||||
۱۲۳۱۲
|
||||
</div>
|
||||
|
||||
<div className='flex xl:flex-row flex-col mt-8 gap-6'>
|
||||
<div className='flex-1'>
|
||||
<div className='w-full bg-white rounded-3xl p-8'>
|
||||
<div className='flex justify-between items-center'>
|
||||
<div>
|
||||
{t('receip.personal_information')}
|
||||
{
|
||||
getInvoce.isPending || getProfile.isPending ?
|
||||
<PageLoading />
|
||||
:
|
||||
<div className='flex xl:flex-row flex-col mt-8 gap-6'>
|
||||
<div className='flex-1'>
|
||||
<div className='w-full bg-white rounded-3xl p-8'>
|
||||
<div className='flex justify-between items-center'>
|
||||
<div>
|
||||
{t('receip.personal_information')}
|
||||
</div>
|
||||
<div className='flex gap-1 items-center text-xs text-[#0047FF]'>
|
||||
<Edit size={16} color='#0047FF' />
|
||||
<div>
|
||||
{t('edit')}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='mt-8 flex xl:flex-row flex-col xl:gap-16 gap-4 xl:items-center text-xs'>
|
||||
<div className='flex gap-2'>
|
||||
<div className='text-description'>
|
||||
{t('receip.type_person')}
|
||||
</div>
|
||||
<div>
|
||||
{t('receip.company')}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='flex gap-2'>
|
||||
<div className='text-description'>
|
||||
{t('receip.representativeـname')}
|
||||
</div>
|
||||
<div>
|
||||
مهرداد مظفری
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='flex gap-2'>
|
||||
<div className='text-description'>
|
||||
{t('receip.company_name')}
|
||||
</div>
|
||||
<div>
|
||||
داناک
|
||||
</div>
|
||||
</div>
|
||||
<div className='flex gap-2'>
|
||||
<div className='text-description'>
|
||||
{t('receip.registration_number')}
|
||||
</div>
|
||||
<div>
|
||||
۱۲۳۴
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='mt-8 border-t pt-7 flex xl:flex-row flex-col xl:gap-16 gap-4 xl:items-center text-xs'>
|
||||
<div className='flex gap-2'>
|
||||
<div className='text-description'>
|
||||
{t('receip.tel_company')}
|
||||
</div>
|
||||
<div>
|
||||
۰۰۱۲۳۴۵۶۷۸
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='flex gap-2'>
|
||||
<div className='text-description'>
|
||||
{t('receip.national_code')}
|
||||
</div>
|
||||
<div>
|
||||
۰۰۱۲۳۴۵۶۷۸
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='flex gap-2'>
|
||||
<div className='text-description'>
|
||||
{t('receip.postal_code')}
|
||||
</div>
|
||||
<div>
|
||||
۳۸۲۱۳۵۸۸۹۲
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div className='mt-6 flex xl:flex-row flex-col xl:gap-16 gap-4 xl:items-center text-xs'>
|
||||
<div className='flex gap-2'>
|
||||
<div className='text-description'>
|
||||
{t('receip.state')}
|
||||
</div>
|
||||
<div>
|
||||
مرکزی
|
||||
</div>
|
||||
</div>
|
||||
<div className='flex gap-2'>
|
||||
<div className='text-description'>
|
||||
{t('receip.state')}
|
||||
</div>
|
||||
<div>
|
||||
مرکزی
|
||||
</div>
|
||||
</div>
|
||||
<div className='flex gap-2'>
|
||||
<div className='text-description'>
|
||||
{t('receip.city')}
|
||||
</div>
|
||||
<div>
|
||||
اراک
|
||||
</div>
|
||||
</div>
|
||||
<div className='flex gap-2'>
|
||||
<div className='text-description'>
|
||||
{t('receip.address')}
|
||||
</div>
|
||||
<div>
|
||||
اراک -خیابان شریعتی-خیابان جنت
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div className='flex gap-1 items-center text-xs text-[#0047FF]'>
|
||||
<Edit size={16} color='#0047FF' />
|
||||
<div>
|
||||
{t('edit')}
|
||||
|
||||
<div className='w-full bg-white rounded-3xl mt-8 p-8'>
|
||||
<div className='flex justify-between items-center'>
|
||||
<div>
|
||||
{t('receip.detail_receip')}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='mt-7 text-sm'>
|
||||
<div className='flex justify-between items-center text-description h-14'>
|
||||
<div>
|
||||
{t('receip.description')}
|
||||
</div>
|
||||
<div>
|
||||
{t('receip.price')}
|
||||
</div>
|
||||
</div>
|
||||
{
|
||||
getInvoce.data?.data?.invoice?.items?.map((item: ReceiptDetailItemType) => {
|
||||
return (
|
||||
<div key={item.id} className='flex justify-between items-center text-xs border-t border-[#EAEDF5] h-14'>
|
||||
<div className='flex gap-0.5'>
|
||||
<span>{item.name}</span>
|
||||
<span>{item.count}</span>
|
||||
<span>عدد</span>
|
||||
</div>
|
||||
<div>
|
||||
<span>{NumberFormat(item.totalPrice)}</span> ریال
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
}
|
||||
|
||||
<div className='flex justify-between items-center text-xs border-t border-[#EAEDF5] h-14'>
|
||||
<div>
|
||||
۱۰٪ ارزش افزوده
|
||||
</div>
|
||||
<div>
|
||||
<span>{NumberFormat(getInvoce.data?.data?.invoice?.tax)}</span> ریال
|
||||
</div>
|
||||
</div>
|
||||
<div className='flex justify-between items-center text-xs border-t border-[#EAEDF5] h-14'>
|
||||
<div>
|
||||
جمع کل
|
||||
</div>
|
||||
<div>
|
||||
<span>{NumberFormat(getInvoce.data?.data?.invoice?.totalPrice)}</span> ریال
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='mt-8 flex xl:flex-row flex-col xl:gap-16 gap-4 xl:items-center text-xs'>
|
||||
<div className='flex gap-2'>
|
||||
<div className='text-description'>
|
||||
{t('receip.type_person')}
|
||||
</div>
|
||||
<div className='bg-white xl:w-sidebar text-sm h-fit rounded-3xl p-8'>
|
||||
<div className='flex justify-between items-center'>
|
||||
<div>
|
||||
{t('receip.company')}
|
||||
{t('receip.receip_information')}
|
||||
</div>
|
||||
<div className='border border-orange-400 text-orange-400 rounded-lg text-[9px] h-6 flex items-center px-1'>
|
||||
<div>پرداخت نشده</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='flex gap-2'>
|
||||
<div className='text-description'>
|
||||
{t('receip.representativeـname')}
|
||||
<div className='mt-6 text-xs font-extralight'>
|
||||
<div className='flex justify-between h-12 border-b items-center'>
|
||||
<div className='text-description'>
|
||||
{t('receip.date_factor')}
|
||||
</div>
|
||||
<div>
|
||||
{moment(getInvoce.data?.data?.invoice?.createdAt).format('jYYYY-jMM-jDD')}
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
مهرداد مظفری
|
||||
<div className='flex justify-between h-12 border-b items-center'>
|
||||
<div className='text-description'>
|
||||
{t('receip.due_date')}
|
||||
</div>
|
||||
<div>
|
||||
{moment(getInvoce.data?.data?.invoice?.dueDate).format('jYYYY-jMM-jDD')}
|
||||
</div>
|
||||
</div>
|
||||
<div className='flex justify-between h-12 border-b items-center'>
|
||||
<div className='text-description'>
|
||||
{t('receip.factor_number')}
|
||||
</div>
|
||||
<div>
|
||||
{getInvoce.data?.data?.invoice.id}
|
||||
</div>
|
||||
</div>
|
||||
<div className='flex justify-between h-12 border-b items-center'>
|
||||
<div className='text-description'>
|
||||
{t('receip.status_factor')}
|
||||
</div>
|
||||
<div>
|
||||
{t(`receip.${getInvoce.data?.data?.invoice?.status}`)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='flex gap-2'>
|
||||
<div className='text-description'>
|
||||
{t('receip.company_name')}
|
||||
<div className='mt-5 flex justify-center gap-2'>
|
||||
<div className='border size-[72px] flex-col text-[10px] justify-center items-center rounded-xl border-border flex'>
|
||||
<img src={SamanImage} alt='saman' className='w-8 h-8' />
|
||||
<div className='mt-2'>
|
||||
بانک سامان
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
داناک
|
||||
</div>
|
||||
</div>
|
||||
<div className='flex gap-2'>
|
||||
<div className='text-description'>
|
||||
{t('receip.registration_number')}
|
||||
</div>
|
||||
<div>
|
||||
۱۲۳۴
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='mt-8 border-t pt-7 flex xl:flex-row flex-col xl:gap-16 gap-4 xl:items-center text-xs'>
|
||||
<div className='flex gap-2'>
|
||||
<div className='text-description'>
|
||||
{t('receip.tel_company')}
|
||||
</div>
|
||||
<div>
|
||||
۰۰۱۲۳۴۵۶۷۸
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='flex gap-2'>
|
||||
<div className='text-description'>
|
||||
{t('receip.national_code')}
|
||||
</div>
|
||||
<div>
|
||||
۰۰۱۲۳۴۵۶۷۸
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='flex gap-2'>
|
||||
<div className='text-description'>
|
||||
{t('receip.postal_code')}
|
||||
</div>
|
||||
<div>
|
||||
۳۸۲۱۳۵۸۸۹۲
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div className='mt-6 flex xl:flex-row flex-col xl:gap-16 gap-4 xl:items-center text-xs'>
|
||||
<div className='flex gap-2'>
|
||||
<div className='text-description'>
|
||||
{t('receip.state')}
|
||||
</div>
|
||||
<div>
|
||||
مرکزی
|
||||
</div>
|
||||
</div>
|
||||
<div className='flex gap-2'>
|
||||
<div className='text-description'>
|
||||
{t('receip.state')}
|
||||
</div>
|
||||
<div>
|
||||
مرکزی
|
||||
</div>
|
||||
</div>
|
||||
<div className='flex gap-2'>
|
||||
<div className='text-description'>
|
||||
{t('receip.city')}
|
||||
</div>
|
||||
<div>
|
||||
اراک
|
||||
</div>
|
||||
</div>
|
||||
<div className='flex gap-2'>
|
||||
<div className='text-description'>
|
||||
{t('receip.address')}
|
||||
</div>
|
||||
<div>
|
||||
اراک -خیابان شریعتی-خیابان جنت
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div className='w-full bg-white rounded-3xl mt-8 p-8'>
|
||||
<div className='flex justify-between items-center'>
|
||||
<div>
|
||||
{t('receip.detail_receip')}
|
||||
</div>
|
||||
<div className='flex gap-2 text-xs items-center'>
|
||||
<StatusCircle
|
||||
color='#FF7B00'
|
||||
/>
|
||||
<div>
|
||||
{t('receip.not_paid')}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='mt-7 text-sm'>
|
||||
<div className='flex justify-between items-center text-description h-14'>
|
||||
<div>
|
||||
{t('receip.description')}
|
||||
</div>
|
||||
<div>
|
||||
{t('receip.price')}
|
||||
</div>
|
||||
</div>
|
||||
<div className='flex justify-between items-center text-xs border-t border-[#EAEDF5] h-14'>
|
||||
<div>
|
||||
اکانت یکساله با دسترسی
|
||||
</div>
|
||||
<div>
|
||||
۱۰,۰۰۰,۰۰۰ ریال
|
||||
</div>
|
||||
</div>
|
||||
<div className='flex justify-between items-center text-xs border-t border-[#EAEDF5] h-14'>
|
||||
<div>
|
||||
۱۰٪ ارزش افزوده
|
||||
</div>
|
||||
<div>
|
||||
۱۰,۰۰۰,۰۰۰ ریال
|
||||
</div>
|
||||
</div>
|
||||
<div className='flex justify-between items-center text-xs border-t border-[#EAEDF5] h-14'>
|
||||
<div>
|
||||
جمع کل
|
||||
</div>
|
||||
<div>
|
||||
۱۰,۰۰۰,۰۰۰ ریال
|
||||
<div className='border size-[72px] flex-col text-[10px] justify-center items-center rounded-xl border-border flex'>
|
||||
<img src={SamanImage} alt='saman' className='w-8 h-8' />
|
||||
<div className='mt-2'>
|
||||
بانک سامان
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='bg-white xl:w-sidebar text-sm h-fit rounded-3xl p-8'>
|
||||
<div className='flex justify-between items-center'>
|
||||
<div>
|
||||
{t('receip.receip_information')}
|
||||
</div>
|
||||
<div className='flex gap-2 text-xs items-center'>
|
||||
<StatusCircle
|
||||
color='#FF7B00'
|
||||
/>
|
||||
<div>پرداخت نشده</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='mt-6 text-xs font-extralight'>
|
||||
<div className='flex justify-between h-12 border-b items-center'>
|
||||
<div className='text-description'>
|
||||
{t('receip.date_factor')}
|
||||
</div>
|
||||
<div>
|
||||
۱۴۰۲/۱۰/۰۴
|
||||
</div>
|
||||
</div>
|
||||
<div className='flex justify-between h-12 border-b items-center'>
|
||||
<div className='text-description'>
|
||||
{t('receip.due_date')}
|
||||
</div>
|
||||
<div>
|
||||
۱۴۰۲/۱۰/۰۴
|
||||
</div>
|
||||
</div>
|
||||
<div className='flex justify-between h-12 border-b items-center'>
|
||||
<div className='text-description'>
|
||||
{t('receip.factor_number')}
|
||||
</div>
|
||||
<div>
|
||||
۱۲۳۱
|
||||
</div>
|
||||
</div>
|
||||
<div className='flex justify-between h-12 border-b items-center'>
|
||||
<div className='text-description'>
|
||||
{t('receip.status_factor')}
|
||||
</div>
|
||||
<div>
|
||||
تایید شده
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='mt-5 flex justify-center gap-2'>
|
||||
<div className='border size-[72px] flex-col text-[10px] justify-center items-center rounded-xl border-border flex'>
|
||||
<img src={SamanImage} alt='saman' className='w-8 h-8' />
|
||||
<div className='mt-2'>
|
||||
بانک سامان
|
||||
</div>
|
||||
</div>
|
||||
<div className='border size-[72px] flex-col text-[10px] justify-center items-center rounded-xl border-border flex'>
|
||||
<img src={SamanImage} alt='saman' className='w-8 h-8' />
|
||||
<div className='mt-2'>
|
||||
بانک سامان
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
|
||||
</div>
|
||||
)
|
||||
|
||||
@@ -17,3 +17,15 @@ export type ReceiptItemType = {
|
||||
status: "PENDING" | "PAID" | "CANCELED" | "EXPIRED";
|
||||
paidAt: string;
|
||||
};
|
||||
|
||||
export type ReceiptDetailItemType = {
|
||||
id: string;
|
||||
createdAt: string;
|
||||
updatedAt: string;
|
||||
name: string;
|
||||
count: string | number;
|
||||
unitPrice: string | number;
|
||||
discount: string | number;
|
||||
totalPrice: number;
|
||||
subscriptionPlan?: string | null;
|
||||
};
|
||||
|
||||
@@ -16,6 +16,8 @@ import { toast } from 'react-toastify'
|
||||
import { ErrorType } from '../../helpers/types'
|
||||
import { useNavigate } from 'react-router-dom'
|
||||
import { Pages } from '../../config/Pages'
|
||||
import { useGetMyServices } from '../service/hooks/useServiceData'
|
||||
import { MyServicesItem } from '../service/types/ServiecTypes'
|
||||
|
||||
const CreateTicket: FC = () => {
|
||||
|
||||
@@ -26,6 +28,7 @@ const CreateTicket: FC = () => {
|
||||
const getCategories = useGetCategoriesTicket()
|
||||
const multiUpload = useMultiUpload()
|
||||
const createTicket = useCreateTicket()
|
||||
const getMyservice = useGetMyServices('')
|
||||
|
||||
const formik = useFormik<CreateTicketType>({
|
||||
initialValues: {
|
||||
@@ -143,15 +146,16 @@ const CreateTicket: FC = () => {
|
||||
<div className='mt-6 rowTwoInput'>
|
||||
<Select
|
||||
label={t('ticket.select_your_service')}
|
||||
items={[
|
||||
{
|
||||
label: '',
|
||||
value: ''
|
||||
}
|
||||
]}
|
||||
placeholder={t('ticket.not_once')}
|
||||
className='border'
|
||||
name='danakServiceId'
|
||||
items={getMyservice.data?.data?.subscriptions?.map((item: MyServicesItem) => ({
|
||||
label: item.plan?.service?.name,
|
||||
value: item.plan?.service.id
|
||||
})
|
||||
)}
|
||||
onChange={formik.handleChange}
|
||||
error_text={formik.touched.danakServiceId && formik.errors.danakServiceId ? formik.errors.danakServiceId : ''}
|
||||
/>
|
||||
<Select
|
||||
label={t('ticket.category')}
|
||||
|
||||
@@ -71,7 +71,8 @@ const TicketList: FC = () => {
|
||||
<tr>
|
||||
<Td text={t('ticket.number')} />
|
||||
<Td text={t('ticket.title')} />
|
||||
<Td text={t('ticket.team')} />
|
||||
<Td text={t('ticket.category')} />
|
||||
<Td text={t('ticket.service')} />
|
||||
<Td text={t('ticket.date')} />
|
||||
<Td text={t('ticket.status')} />
|
||||
<Td text={t('ticket.priority')} />
|
||||
@@ -86,6 +87,7 @@ const TicketList: FC = () => {
|
||||
<Td text={item.numericId} />
|
||||
<Td text={item.subject} />
|
||||
<Td text={item?.category?.title} />
|
||||
<Td text={item?.danakService?.name} />
|
||||
<Td text={''}>
|
||||
<div className='dltr text-right'>
|
||||
{moment(item.updatedAt).format('jYYYY-jMM-jDD HH:mm')}
|
||||
|
||||
Reference in New Issue
Block a user