receip and ticket and ...

2024-12-29 16:27:07 +03:30
parent 7756e20a9f
commit 7a5d9d6447
15 changed files with 589 additions and 15 deletions
@@ -0,0 +1,131 @@
+import { FC } from 'react'
+import { useTranslation } from 'react-i18next'
+import { SIDEBAR_SIZE_LEFT } from '../../config/Const'
+import Input from '../../components/Input'
+import Select from '../../components/Select'
+import Textarea from '../../components/Textarea'
+import UploadBox from '../../components/UploadBox'
+import Button from '../../components/Button'
+import { TickSquare } from 'iconsax-react'
+
+const CreateTicket: FC = () => {
+
+    const { t } = useTranslation('global')
+
+    return (
+        <div className='mt-4'>
+            <div>
+                {t('ticket.new_ticket')}
+            </div>
+
+            <div className='flex gap-6 mt-8'>
+                <div className='flex-1 bg-white py-8 px-10 rounded-3xl'>
+                    <div>
+                        {t('ticket.submit_your_message')}
+                    </div>
+
+                    <div className='mt-6 rowTwoInput'>
+                        <Input
+                            label={t('ticket.name')}
+                            readOnly
+                            placeholder='مهرداد مظفری'
+                        />
+                        <Input
+                            label={t('ticket.email')}
+                            readOnly
+                            placeholder='Info@example.com'
+                        />
+                    </div>
+
+
+                    <div className='mt-6 rowTwoInput'>
+                        <Input
+                            label={t('ticket.subject')}
+                            placeholder={t('ticket.enter_your_subject')}
+                        />
+                        <Select
+                            label={t('ticket.subject')}
+                            items={[
+                                {
+                                    label: '',
+                                    value: ''
+                                }
+                            ]}
+                            placeholder={t('ticket.priority')}
+                            className='border'
+                        />
+                    </div>
+
+                    <div className='mt-6'>
+                        <Select
+                            label={t('ticket.select_your_service')}
+                            items={[
+                                {
+                                    label: '',
+                                    value: ''
+                                }
+                            ]}
+                            placeholder={t('ticket.not_once')}
+                            className='border'
+                        />
+                    </div>
+                    <div className='mt-6'>
+                        <Textarea
+                            label={t('description')}
+                            placeholder={t('ticket.your_description')}
+                        />
+                    </div>
+
+                    <div className='mt-6'>
+                        <UploadBox
+                            label={t('ticket.attachment')}
+                        />
+                    </div>
+
+                    <div className='mt-8 flex justify-end'>
+                        <Button
+                            label={t('ticket.send')}
+                            className='max-w-[100px]'
+                        />
+                    </div>
+                </div>
+
+                <div style={{ width: SIDEBAR_SIZE_LEFT }} className='bg-white 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'>
+                            <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'>
+                            <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'>
+                            <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 CreateTicket