props.onChange(props.value)} className='size-4 cursor-pointer rounded-full bg-[#EAEDF5] flex justify-center items-center'>
+ {
+ props.isActive &&
+
+ }
+
+ )
+}
+
+export default Radio
\ No newline at end of file
diff --git a/src/components/RadioGroup.tsx b/src/components/RadioGroup.tsx
new file mode 100644
index 0000000..f68c939
--- /dev/null
+++ b/src/components/RadioGroup.tsx
@@ -0,0 +1,31 @@
+import { FC } from 'react'
+import Radio from './Radio'
+
+
+type Props = {
+ items: {
+ label: string
+ value: 'year' | '3month' | 'month'
+ }[]
+ selected: string
+ onChange: (value: 'year' | '3month' | 'month') => void
+}
+
+const RadioGroup: FC
+ {
+ props.items.map((item, index) => (
+
+ )
+}
+
+export default RadioGroup
\ No newline at end of file
diff --git a/src/config/Pages.ts b/src/config/Pages.ts
index 1973ba4..fd96843 100644
--- a/src/config/Pages.ts
+++ b/src/config/Pages.ts
@@ -8,6 +8,7 @@ export const Pages = {
services: {
mine: "/services",
other: "/other-service",
+ detail: "/services/detail/",
},
transactions: "/transactions",
receipts: {
diff --git a/src/index.css b/src/index.css
index e09ea81..3643380 100644
--- a/src/index.css
+++ b/src/index.css
@@ -114,3 +114,7 @@ tbody tr {
backdrop-filter: blur(44px);
}
+
+.rc-rate-star {
+ margin-right: 3px !important; /* فاصله بین ستارهها */
+}
diff --git a/src/langs/fa.json b/src/langs/fa.json
index 23cd1cc..41674a0 100644
--- a/src/langs/fa.json
+++ b/src/langs/fa.json
@@ -83,7 +83,27 @@
"active_menu": "منو فعال",
"selected_danak": "انتخاب داناک",
"buy": "خرید",
- "other_services": "سایر سرویس ها"
+ "other_services": "سایر سرویس ها",
+ "year": "سالانه",
+ "month3": "۳ ماهه",
+ "month": "ماهیانه",
+ "company_develop": "شرکت توسعه دهنده",
+ "company_danak": "شرکت داناک",
+ "user_count": "تعداد کاربران",
+ "year_make": "سال ساخت",
+ "lang_app": "زبان نرم افزار",
+ "persian": "فارسی",
+ "score": "امتیاز",
+ "compelete_description": "توضیحات تکمیلی",
+ "submit_comment": "ثبت نظر",
+ "hint_comment": "شما پس از خرید این سرویس میتوانید نظر خود را به ثبت برسانید.",
+ "fullName": "نام و نام خانوادگی",
+ "enter_your_name": "نام خود را واردکنید",
+ "title": "عنوان",
+ "enter_title_comment": "عنوان نظر خود را وارد کنید",
+ "your_comment": "نظر شما",
+ "write_your_comment": "نظر خود را راجع به این سرویس بنویسید",
+ "users_comments": "نظرات کاربران"
},
"footer": {
"home": "صفحه اصلی",
diff --git a/src/pages/notification/Notification.tsx b/src/pages/notification/Notification.tsx
index f1c6f60..5682255 100644
--- a/src/pages/notification/Notification.tsx
+++ b/src/pages/notification/Notification.tsx
@@ -19,7 +19,7 @@ const Notifications: FC = () => {
{
showModal && (
-
+
+ ))
+ }
+
+ {item.label}
+
+
+
{t('notif.natification')}
diff --git a/src/pages/service/DetailService.tsx b/src/pages/service/DetailService.tsx
new file mode 100644
index 0000000..5d9850f
--- /dev/null
+++ b/src/pages/service/DetailService.tsx
@@ -0,0 +1,214 @@
+import { FC } from 'react'
+import RobotImage from '../../assets/images/robot.jpeg'
+import { SIDEBAR_SIZE_LEFT } from '../../config/Const'
+import { useTranslation } from 'react-i18next'
+import Button from '../../components/Button'
+import Rate from 'rc-rate'
+import ServiceImages from './components/ServiceImages'
+import Input from '../../components/Input'
+import Textarea from '../../components/Textarea'
+import AvatarImage from '../../assets/images/Avatar.png'
+import ServiceHeader from './components/ServiceHeader'
+
+const DetailService: FC = () => {
+
+ const { t } = useTranslation('global')
+
+ return (
+
+
+
+ )
+}
+
+export default DetailService
\ No newline at end of file
diff --git a/src/pages/service/MyServices.tsx b/src/pages/service/MyServices.tsx
index e62a96e..2d80f82 100644
--- a/src/pages/service/MyServices.tsx
+++ b/src/pages/service/MyServices.tsx
@@ -6,6 +6,8 @@ import Select from '../../components/Select'
import ServiceSection from '../../components/ServiceSection'
import StatusCircle from '../../components/StatusCircle'
import BannerImage from '../../assets/images/banner.png'
+import { Link } from 'react-router-dom'
+import { Pages } from '../../config/Pages'
const MyServices: FC = () => {
@@ -40,16 +42,18 @@ const MyServices: FC = () => {
+
+
+
+
+
+
+
+
+
+ {t('service.company_develop')}
+
+
+ {t('service.company_danak')}
+
+
+
+
+ {t('service.user_count')}
+
+
+ +۵۰۰
+
+
+
+
+ {t('service.year_make')}
+
+
+ ۱۴۰۰
+
+
+
+
+ {t('service.lang_app')}
+
+
+ {t('service.persian')}
+
+
+
+
+ {t('service.score')}
+
+
+
+
+
+
+
+ {t('service.compelete_description')}
+
+ + لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد، کتابهای زیادی در شصت و سه درصد گذشته حال و آینده، شناخت فراوان جامعه و متخصصان را می طلبد، تا با نرم افزارها شناخت بیشتری را برای طراحان رایانه ای علی الخصوص طراحان خلاقی، و فرهنگ پیشرو در زبان فارسی ایجاد کرد، در این صورت می توان امید داشت که تمام و دشواری موجود در ارائه راهکارها، و شرایط سخت تایپ به پایان رسد و زمان مورد نیاز شامل حروفچینی دستاوردهای اصلی، و جوابگوی سوالات پیوسته اهل دنیای موجود طراحی اساسا مورد استفاده قرار گیرد. +
+
+
+
+
+
+ {t('service.submit_comment')}
+
+
+ {t('service.hint_comment')}
+
+
+
+
+
+ {t('service.score')}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {t('service.users_comments')}
+
+
+
+
+
+ 
+
+
+
+ فروغ براتی
+
+
+
+
+
+ لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ
+
+
+ ۳ روز پیش
+
+
+
+
+
+ لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد، کتابهای زیادی در شصت و سه درصد گذشته حال و آینده، شناخت فراوان جامعه و متخصصان را ...
+
+
+
+
+
+
+
+
+ فروغ براتی
+
+
+
+
+
+ لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ
+
+
+ ۳ روز پیش
+
+
+
+
+
+ لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد، کتابهای زیادی در شصت و سه درصد گذشته حال و آینده، شناخت فراوان جامعه و متخصصان را ...
+
+
+ 
+
+
+
+
+
+ سفارش نرمافزار اختصاصی: سرمایهای برای آینده یا فقط هزینهای برای امروز؟
+
+
-
-
-
+
+
+
- 1 {t('service.active_menu')}
+
+
1 {t('service.active_menu')}
+
+
-
+
+
+
+ )
+}
+
+export default ServiceHeader
\ No newline at end of file
diff --git a/src/pages/service/components/ServiceImages.tsx b/src/pages/service/components/ServiceImages.tsx
new file mode 100644
index 0000000..4c17849
--- /dev/null
+++ b/src/pages/service/components/ServiceImages.tsx
@@ -0,0 +1,44 @@
+import { FC } from 'react'
+import { Swiper, SwiperSlide } from 'swiper/react'
+import AppImage from '../../../assets/images/appimage.png'
+
+const SWIPER_SLIDE_STYLE = {
+ overflow: 'visible !important',
+ // width: 220,
+}
+
+const ServiceImages: FC = () => {
+ return (
+
+
+
+
+
+
+
+ دی منو
+
+
+ منوی رستوران
+
+ + دی منو، راهی ساده و هوشمند برای مدیریت منو شما! +
+
+
+
+
+
+ 
+
+
+
+ 2,000,000 تومان {t('service.year')}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ )
+}
+
+export default ServiceImages
\ No newline at end of file
diff --git a/src/pages/wallet/Wallet.tsx b/src/pages/wallet/Wallet.tsx
index 7c0bbcb..486ce39 100644
--- a/src/pages/wallet/Wallet.tsx
+++ b/src/pages/wallet/Wallet.tsx
@@ -52,7 +52,7 @@ const Wallet: FC = () => {
+ 
+
+
+
+
+
+
+
+
+
+
+
+
{t('ticket.title_hint')}
diff --git a/src/pages/wallet/components/Online.tsx b/src/pages/wallet/components/Online.tsx
index 89b5088..b2bde07 100644
--- a/src/pages/wallet/components/Online.tsx
+++ b/src/pages/wallet/components/Online.tsx
@@ -68,7 +68,7 @@ const Online: FC = () => {
setBankSelected(1)} className={clx(
- 'h-16 rounded-xl cursor-pointer flex gap-4 items-center px-4 border border-border w-[240px]',
+ 'xl:h-16 rounded-xl cursor-pointer flex xl:flex-row flex-col gap-4 items-center text-center py-3 xl:py-0 xl:text-right px-4 border border-border xl:w-[240px]',
bankSelected === 1 && 'border-black'
)}>
@@ -82,7 +82,7 @@ const Online: FC = () => {
setBankSelected(2)} className={clx(
- 'h-16 rounded-xl cursor-pointer flex gap-4 items-center px-4 border border-border w-[240px]',
+ 'xl:h-16 rounded-xl cursor-pointer flex xl:flex-row flex-col gap-4 items-center text-center py-3 xl:py-0 xl:text-right px-4 border border-border xl:w-[240px]',
bankSelected === 2 && 'border-black'
)}>
diff --git a/src/router/Main.tsx b/src/router/Main.tsx
index 4edcdf3..2685135 100644
--- a/src/router/Main.tsx
+++ b/src/router/Main.tsx
@@ -20,6 +20,7 @@ import Profile from '../pages/profile/Profile'
import OtherServices from '../pages/service/OtherServices'
import Footer from '../shared/Footer'
import AnnouncementDetail from '../pages/annoncement/Detail'
+import DetailService from '../pages/service/DetailService'
const MainRouter: FC = () => {
return (
@@ -33,6 +34,7 @@ const MainRouter: FC = () => {