danak/danak-admin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add receipt

Browse Source
This commit is contained in:
hamid zarghami
2025-01-21 11:42:34 +03:30
parent 88245257e4
commit 73a385a031
10 changed files with 302 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/Select.tsx
+4 -1
View File
@@ -42,7 +42,10 @@ const Select: FC<Props> = (props: Props) => {
})
}
</select>
<ArrowDown2 size={16} color='black' className='absolute z-0 top-3 left-2' />
<ArrowDown2 size={16} color='black' className={clx(
'absolute z-0 top-3 left-2',
props.label && 'top-10'
)} />
{
props.error_text && props.error_text !== '' ?
<div className='text-xs text-right text-red-600 mt-2 mr-2 font-medium'>
src/config/Pages.ts
+3 -2
View File
@@ -12,8 +12,9 @@ export const Pages = {
},
transactions: "/transactions",
receipts: {
index: "/receipts",
detail: "/receipts/",
index: "/receipts/list",
detail: "/receipts/detail/",
create: "/receipts/create",
},
ticket: {
list: "/tickets",
src/config/SideBarSubMenu.ts
+1 -1
View File
@@ -1,7 +1,7 @@
export const SideBarItemHasSubMenu = [
"services",
"customers",
"receipt",
"receipts",
"users",
"transactions",
];
src/langs/fa.json
+15 -1
View File
@@ -162,7 +162,9 @@
"update_sms": "به روزرسانی این تیکت از طریق پیامک اطلاع داده میشود"
},
"receip": {
"receips": "صورتحساب ها",
"receip_list": "لیست صورتحساب ها",
"add_receip": "افزودن صورتحساب",
"dont_pay": "پرداخت نشده",
"dont_confrim": "تایید نشده",
"paid": "پرداخت شده",
@@ -191,7 +193,19 @@
"date_factor": "تاریخ صدور فاکتور",
"due_date": "تاریخ سررسید فاکتور",
"factor_number": "شماره فاکتور",
"status_factor": "وضعیت فاکتور"
"status_factor": "وضعیت فاکتور",
"submit_receip": "ثبت صورتحساب",
"customer_information": "اطلاعات مشتری",
"customer": "مشتری",
"receipt_information": "اطلاعات صورتحساب",
"number": "شماره",
"product_name": "نام کالا",
"count": "تعداد",
"unit_amount": "مبلغ واحد",
"discount": "تخفیف(٪)",
"total_amount": "مبلغ کل(ریال)",
"tax": "مالیات بر ارزش افزوده (۰.۹ درصد)",
"total": "جمع"
},
"edit": "ویرایش",
"transaction": {
src/pages/receipts/Create.tsx
+224
View File
@@ -0,0 +1,224 @@
import { FC } from 'react'
import { useTranslation } from 'react-i18next'
import Button from '../../components/Button'
import { Add, TickCircle, TickSquare } from 'iconsax-react'
import Select from '../../components/Select'
import Input from '../../components/Input'
const CreateReceipt: FC = () => {
const { t } = useTranslation('global')
return (
<div className='mt-4'>
<div className='flex justify-between items-center'>
<div>
{t('receip.add_receip')}
</div>
<div>
<Button
className='px-5'
>
<div className='flex gap-2 items-center'>
<TickCircle size={20} color='white' />
<div>
{t('receip.submit_receip')}
</div>
</div>
</Button>
</div>
</div>
<div className='flex gap-6 xl:mt-8 mt-4'>
<div className='flex-1 bg-white py-8 xl:px-10 px-4 rounded-3xl'>
<div>
{t('receip.customer_information')}
</div>
<div className='mt-8'>
<div className='w-full xl:w-1/2'>
<Select
label={t('receip.customer')}
items={[
{ label: 'محمد', value: 'mohammad' },
{ label: 'علی', value: 'ali' },
{ label: 'حسین', value: 'hossein' },
]}
/>
</div>
</div>
<div className='mt-10 bg-[#F6F7FB] p-8 rounded-3xl text-sm'>
<div className='flex justify-between items-center border-b border-border border-dashed pb-7'>
<div className='flex items-center gap-2'>
<div className='text-description'>{t('receip.type_person')}</div>
<div>حقوقی</div>
</div>
<div className='flex items-center gap-2'>
<div className='text-description'>{t('receip.representativeـname')}</div>
<div>مهرداد مظفری</div>
</div>
<div className='flex items-center gap-2'>
<div className='text-description'>{t('receip.company_name')}</div>
<div>راوک</div>
</div>
<div className='flex items-center gap-2'>
<div className='text-description'>{t('receip.registration_number')}</div>
<div>۱۲۳۴</div>
</div>
</div>
<div className='flex justify-between items-center mt-7'>
<div className='flex items-center gap-2 flex-1'>
<div className='text-description'>{t('receip.tel_company')}</div>
<div>۰۸۶۹۱۰۰۹۱۰۰۱</div>
</div>
<div className='flex items-center gap-2 flex-1'>
<div className='text-description'>{t('receip.national_code')}</div>
<div>۰۰۱۲۳۴۵۶۷۸</div>
</div>
<div className='flex items-center gap-2 flex-1'>
<div className='text-description'>{t('receip.postal_code')}</div>
<div>۰۰۱۲۳۴۵۶۷۸</div>
</div>
</div>
<div className='flex justify-between items-center mt-7'>
<div className='flex items-center gap-2 flex-1'>
<div className='text-description'>{t('receip.state')}</div>
<div>مرکزی </div>
</div>
<div className='flex items-center gap-2 flex-1'>
<div className='text-description'>{t('receip.city')}</div>
<div>اراک </div>
</div>
<div className='flex items-center gap-2 flex-1'>
<div className='text-description'>{t('receip.address')}</div>
<div>اراک -خیابان شریعتی-خیابان جنت</div>
</div>
</div>
</div>
<div className='mt-10'>
<div>{t('receip.receipt_information')}</div>
</div>
<div className='mt-8 border-b border-dashed border-border pb-7 flex items-end justify-between text-xs text-description'>
<div className='flex flex-col gap-2 items-center'>
<div>
{t('receip.number')}
</div>
<div className='size-10 bg-[#EBEDF5] rounded-xl flex justify-center items-center'>
1
</div>
</div>
<div className='flex flex-col gap-2 items-center'>
<div>
{t('receip.product_name')}
</div>
<Input
className='text-center'
/>
</div>
<div className='flex flex-col gap-2 items-center'>
<div>
{t('receip.count')}
</div>
<Input
type='number'
className='w-16 text-center'
/>
</div>
<div className='flex flex-col gap-2 items-center'>
<div>
{t('receip.unit_amount')}
</div>
<Input
className='text-center'
/>
</div>
<div className='flex flex-col gap-2 items-center'>
<div>
{t('receip.discount')}
</div>
<Input
type='number'
className='w-16 text-center'
/>
</div>
<div className='flex flex-col gap-2 items-center'>
<div>
{t('receip.total_amount')}
</div>
<Input
className='text-center bg-[#EBEDF5]'
/>
</div>
<div className='size-10 border border-border rounded-xl flex justify-center items-center'>
<Add size={20} color='black' />
</div>
</div>
<div className='mt-8 flex flex-col gap-4 items-end'>
<div className='xl:w-1/2 h-12 w-full rounded-xl flex px-4 bg-[#EBEDF5] text-sm text-description justify-between items-center'>
<div>
{t('receip.tax')}
</div>
<div className='text-black'>
100,000
</div>
</div>
<div className='xl:w-1/2 h-12 w-full rounded-xl flex px-4 bg-[#EBEDF5] text-sm text-description justify-between items-center'>
<div>
{t('receip.total')}
</div>
<div className='text-black'>
100,000
</div>
</div>
</div>
</div>
<div className='bg-white w-sidebar xl:block hidden py-10 px-5 h-fit rounded-3xl'>
<div className='text-sm'>
{t('ticket.title_hint')}
</div>
<div className='mt-6'>
<div className='flex items-start gap-2 border-b pb-5'>
<div>
<TickSquare size={20} color='black' variant='Bold' />
</div>
<div className='text-description text-xs leading-5'>
سوالات - مشکلاتی که به یک موضوع مربوط میشوند را در یک درخواست پشتیبانی پیگیر باشید و چند درخواست برای یک موضوع باز نکنید.
</div>
</div>
<div className='flex items-start gap-2 mt-6 border-b pb-5'>
<div>
<TickSquare size={20} color='black' variant='Bold' />
</div>
<div className='text-description text-xs leading-5'>
لطفاً برای بررسی و رفع مشکلات احتمالی صبور باشید بررسی و رفع مشکلات در برخی موارد زمان گیر است.
</div>
</div>
<div className='flex items-start gap-2 mt-6'>
<div>
<TickSquare size={20} color='black' variant='Bold' />
</div>
<div className='text-description text-xs leading-5'>
پاسخگویی 24 ساعته تلفنی را تنها از میهن وب هاست می توانید انتظار داشته باشید .بخش پشتیبانی در هر ساعتی حتی در روز های تعطیل آماده پیگیری سریع مشکلات کاربران است.
</div>
</div>
</div>
</div>
</div>
</div>
)
}
export default CreateReceipt
src/router/Main.tsx
+2
View File
@@ -23,6 +23,7 @@ import AnnouncementDetail from '../pages/annoncement/Detail'
import DetailService from '../pages/service/DetailService'
import { clx } from '../helpers/utils'
import { useSharedStore } from '../shared/store/sharedStore'
import CreateReceipt from '../pages/receipts/Create'
const MainRouter: FC = () => {
@@ -51,6 +52,7 @@ const MainRouter: FC = () => {
<Route path={Pages.transactions} element={<TransactionList />} />
<Route path={Pages.receipts.index} element={<ReceiptsList />} />
<Route path={Pages.receipts.detail + ':id'} element={<ReceiptsDetail />} />
<Route path={Pages.receipts.create} element={<CreateReceipt />} />
<Route path={Pages.announcement.list} element={<AnnouncementtList />} />
<Route path={Pages.announcement.detail + ':id'} element={<AnnouncementDetail />} />
<Route path={Pages.criticisms} element={<AddCriticisms />} />
src/shared/Header.tsx
+1 -1
View File
@@ -14,7 +14,7 @@ const Header: FC = () => {
const { setOpenSidebar, openSidebar } = useSharedStore()
return (
<div className='fixed z-10 right-4 left-4 xl:right-[285px] top-4 xl:h-16 h-12 flex items-center px-6 bg-white justify-between rounded-[32px] xl:w-[calc(100%-305px)]'>
<div className='fixed z-10 right-4 left-4 xl:right-[317px] top-4 xl:h-16 h-12 flex items-center px-6 bg-white justify-between rounded-[32px] xl:w-[calc(100%-335px)]'>
<div className='min-w-[270px] hidden xl:block'>
<Input
src/shared/SideBar.tsx
+4 -3
View File
@@ -11,6 +11,7 @@ import { clx } from '../helpers/utils'
import ServicesSubMenu from './components/ServicesSubMenu'
import { SideBarItemHasSubMenu } from '../config/SideBarSubMenu'
import TransactionsSubMenu from './components/TransactionsSubMenu'
import ReceiptSubMenu from './components/ReceiptSubMenu'
const SideBar: FC = () => {
@@ -43,8 +44,6 @@ const SideBar: FC = () => {
const iconSizeSideBar = 20
console.log(openSidebar);
return (
<>
@@ -252,7 +251,9 @@ const SideBar: FC = () => {
:
subMenuName === 'transactions' ?
<TransactionsSubMenu />
: null
: subMenuName === 'receipts' ?
<ReceiptSubMenu />
: null
}
</div>
}
src/shared/components/ReceiptSubMenu.tsx
+46
View File
@@ -0,0 +1,46 @@
import { Receipt21 } from 'iconsax-react'
import { FC } from 'react'
import { useTranslation } from 'react-i18next'
import SubMenuItem from './SubMenuItem'
import { useLocation } from 'react-router-dom'
import { Pages } from '../../config/Pages'
const ReceiptSubMenu: FC = () => {
const location = useLocation()
const { t } = useTranslation('global')
const isActive = (name: string) => {
return location.pathname.includes(name)
}
return (
<div className='py-12'>
<div className='flex gap-3 items-center border-b pb-10 px-6'>
<Receipt21
size={24}
color='#000'
variant='Bold'
/>
<div className='text-xs'>
{t('receip.receips')}
</div>
</div>
<div className='flex flex-col mt-10 gap-4'>
<SubMenuItem
title={t('receip.receip_list')}
isActive={isActive('list')}
link={Pages.receipts.index}
/>
<SubMenuItem
title={t('receip.add_receip')}
isActive={isActive('create')}
link={Pages.receipts.create}
/>
</div>
</div>
)
}
export default ReceiptSubMenu
src/shared/components/SubMenuItem.tsx
+2 -2
View File
@@ -12,14 +12,14 @@ type Props = {
const SubMenuItem: FC<Props> = (props: Props) => {
return (
<Link to={props.link} className={clx(
'flex text-xs gap-6 mt-4',
'flex text-xs gap-6 mt-1',
)}>
<div className={clx(
'w-1 bg-black h-6',
!props.isActive && 'invisible',
)}></div>
<div className={clx(
'flex gap-3 items-center',
'flex gap-3 items-center mt-1',
)}>
<div className={props.isActive ? 'text-black' : 'text-description'}>
{props.title}