button and single learning

This commit is contained in:
hamid zarghami
2025-02-25 15:13:27 +03:30
parent 221bcc052c
commit 01f233248b
17 changed files with 156 additions and 21 deletions
+4 -1
View File
@@ -25,7 +25,10 @@ export const Pages = {
detail: "/announcement/",
},
criticisms: "/criticisms",
learning: "/learning",
learning: {
list: "/learning",
detail: "/learning/detail/",
},
setting: "/setting",
wallet: "/wallet",
callback: "/wallet/callback/",
+10 -4
View File
@@ -4,7 +4,7 @@ import Input from '../../components/Input'
import Textarea from '../../components/Textarea'
import UploadBox from '../../components/UploadBox'
import Button from '../../components/Button'
import { TickSquare } from 'iconsax-react'
import { TickCircle, TickSquare } from 'iconsax-react'
import { useMultiUpload } from '../ticket/hooks/useTicketData'
import { useFormik } from 'formik'
import { CreateCriticismsTypes } from './types/CriticismsTypes'
@@ -109,11 +109,17 @@ const AddCriticisms: FC = () => {
<div className='mt-20 flex justify-end'>
<Button
label={t('ticket.send')}
className='max-w-[100px]'
className='xl:max-w-[100px]'
onClick={() => formik.handleSubmit()}
isLoading={createCriticisms.isPending || multiUpload.isPending}
/>
>
<div className='flex gap-2 items-center'>
<TickCircle size={20} color='white' />
<div>
{t('ticket.send')}
</div>
</div>
</Button>
</div>
</div>
+1 -1
View File
@@ -198,7 +198,7 @@ const Legal: FC = () => {
<div className='mt-8 flex justify-end'>
<Button
disabled={isReadOnly}
className='w-fit px-7'
className='xl:w-fit xl:px-7'
onClick={() => formik.handleSubmit()}
isLoading={createLegalUser.isPending}
>
+1 -1
View File
@@ -230,7 +230,7 @@ const Personal: FC = () => {
<div className='mt-8 flex justify-end'>
<Button
className='w-fit px-7'
className='xl:w-fit px-7'
onClick={() => formik.handleSubmit()}
isLoading={createRealUser.isPending}
disabled={isReadOnly}
+87
View File
@@ -0,0 +1,87 @@
import { FC } from 'react'
import { useParams } from 'react-router-dom'
import { useGetLearningDetail } from './hooks/useLearningData'
import PageLoading from '../../components/PageLoading'
import DanakLearning from '../home/components/DanakLearning'
import { Calendar2, Clock, Element3 } from 'iconsax-react'
import moment from 'moment-jalaali'
const LearningDetail: FC = () => {
const { id } = useParams()
const getLearningDetail = useGetLearningDetail(id ? id : '')
return (
<div className='mt-4'>
{
getLearningDetail.isPending ?
<PageLoading />
:
<div className='xl:mt-9 mt-4 flex flex-wrap xl:gap-8 gap-6 text-sm'>
<div className='flex-1'>
<div className='text-lg'>
{
getLearningDetail.data?.data?.learning?.title
}
</div>
<div className='mt-10 bg-white p-8 rounded-3xl'>
<video className='w-full rounded-3xl' controls>
<source src={getLearningDetail.data?.data?.learning?.videoUrl} />
</video>
<div className='mt-7 flex justify-between'>
<div className='text-lg'>
{getLearningDetail.data?.data?.learning?.title}
</div>
<div className='flex max-h-5 gap-3 text-description text-xs'>
<div className='flex gap-2 items-center'>
<Clock
size={18}
color={'#888888'}
/>
<div>
{getLearningDetail.data?.data?.learning?.videoDuration + ' دقیقه'}
</div>
</div>
<div className='flex gap-2 items-center border-r pr-3 border-description'>
<Element3
size={18}
color={'#888888'}
/>
<div>
{getLearningDetail.data?.data?.learning?.category?.name}
</div>
</div>
<div className='flex gap-2 items-center border-r pr-3 border-description'>
<Calendar2
size={18}
color={'#888888'}
/>
<div>
{moment(getLearningDetail.data?.data?.learning?.createdAt).format('jYYYY-jMM-jDD')}
</div>
</div>
</div>
</div>
<div className='mt-6 text-description'>
{getLearningDetail.data?.data?.learning.description}
</div>
</div>
</div>
<DanakLearning />
</div>
}
</div>
)
}
export default LearningDetail
+4 -2
View File
@@ -6,6 +6,8 @@ import { useGetLearnings } from './hooks/useLearningData'
import PageLoading from '../../components/PageLoading'
import { LearningItemType } from './types/LearningTypes'
import moment from 'moment-jalaali'
import { Link } from 'react-router-dom'
import { Pages } from '../../config/Pages'
const LearningList: FC = () => {
@@ -52,7 +54,7 @@ const LearningList: FC = () => {
{
getLearnings.data?.data?.learnings?.map((item: LearningItemType) => {
return (
<div className='bg-white p-4 rounded-3xl xl:min-w-[30%] min-w-full flex-1'>
<Link to={Pages.learning.detail + item.id} className='bg-white p-4 rounded-3xl xl:min-w-[30%] min-w-full flex-1'>
<img src={item.coverUrl} className='w-full rounded-[20px]' />
<div className='mt-4'>
{item.title}
@@ -65,7 +67,7 @@ const LearningList: FC = () => {
<div className='mt-3 text-xs text-description'>
{moment(item.createdAt).format('jYYYY/jMM/jDD')}
</div>
</div>
</Link>
)
})
}
@@ -7,3 +7,11 @@ export const useGetLearnings = (search: string) => {
queryFn: () => api.getLearnings(search),
});
};
export const useGetLearningDetail = (id: string) => {
return useQuery({
queryKey: ["learning", id],
queryFn: () => api.getLearningDetail(id),
enabled: !!id,
});
};
@@ -4,3 +4,8 @@ export const getLearnings = async (search: string) => {
const { data } = await axios.get(`/learnings?q=${search}`);
return data;
};
export const getLearningDetail = async (id: string) => {
const { data } = await axios.get(`/learnings/${id}`);
return data;
};
+1 -1
View File
@@ -243,7 +243,7 @@ const Profile: FC = () => {
<div className='flex justify-end mt-5'>
<Button
className='w-fit px-10'
className='xl:w-fit px-10'
onClick={() => formik.handleSubmit()}
isLoading={updateProfile.isPending}
>
+2 -2
View File
@@ -46,7 +46,7 @@ const MyServices: FC = () => {
</div> */}
</div>
<div className='flex flex-wrap xl:gap-6 gap-4 items-center mt-8'>
<div className='flex items-stretch flex-wrap xl:gap-6 gap-4 xl:items-center mt-8'>
{
getServices.data?.data?.subscriptions?.map((item: MyServicesItem) => {
@@ -57,7 +57,7 @@ const MyServices: FC = () => {
author: item.plan.service.author,
createDate: item.plan?.service?.createDate,
createdAt: item.createdAt,
description: item.plan?.service?.description,
description: item.plan?.service?.title,
icon: item.plan?.service.icon,
id: item.plan.service.id,
isActive: item.plan.isActive,
@@ -8,6 +8,7 @@ import * as Yup from 'yup'
import { toast } from 'react-toastify'
import { useChangePassword } from '../hooks/useSettingData'
import { ErrorType } from '../../../helpers/types'
import { TickCircle } from 'iconsax-react'
const ChangePassword: FC = () => {
@@ -114,6 +115,21 @@ const ChangePassword: FC = () => {
onClick={() => formik.handleSubmit()}
/>
</div>
<div className='justify-end xl:hidden flex'>
<Button
className='xl:w-fit px-10'
onClick={() => formik.handleSubmit()}
isLoading={changePassword.isPending}
>
<div className='flex gap-2 items-center'>
<TickCircle size={20} color='white' />
<div>
{t('setting.save_change')}
</div>
</div>
</Button>
</div>
</div>
<div className='h-14'></div>
+10 -4
View File
@@ -5,7 +5,7 @@ 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'
import { TickCircle, TickSquare } from 'iconsax-react'
import { useCreateTicket, useGetCategoriesTicket, useMultiUpload } from './hooks/useTicketData'
import { useGetProfile } from '../profile/hooks/useProfileData'
import PageLoading from '../../components/PageLoading'
@@ -193,11 +193,17 @@ const CreateTicket: FC = () => {
<div className='mt-8 flex justify-end'>
<Button
label={t('ticket.send')}
className='max-w-[100px]'
className='xl:max-w-[100px]'
onClick={() => formik.handleSubmit()}
isLoading={createTicket.isPending || multiUpload.isPending}
/>
>
<div className='flex gap-2 items-center'>
<TickCircle size={20} color='white' />
<div>
{t('ticket.send')}
</div>
</div>
</Button>
</div>
</div>
+1 -1
View File
@@ -99,7 +99,7 @@ const CardtoCard: FC = () => {
<div className='mt-10 flex justify-end'>
<Button
className='w-[180px]'
className='xl:w-[180px]'
onClick={() => formik.handleSubmit()}
isLoading={depositTransfer.isPending || upload.isPending}
>
+1 -1
View File
@@ -104,7 +104,7 @@ const Online: FC = () => {
<div className='mt-10 flex justify-end'>
<Button
className='w-[180px]'
className='xl:w-[180px]'
onClick={handlePay}
isLoading={payment.isPending}
>
+1 -1
View File
@@ -100,7 +100,7 @@ const CardtoCard: FC = () => {
<div className='mt-10 flex justify-end'>
<Button
className='w-[180px]'
className='xl:w-[180px]'
onClick={() => formik.handleSubmit()}
isLoading={depositTransfer.isPending || upload.isPending}
>
+3 -1
View File
@@ -27,6 +27,7 @@ import TicketDetail from '../pages/ticket/Detail'
import Financial from '../pages/financial/Financial'
import CallBack from '../pages/wallet/CallBack'
import MyDiscountList from '../pages/discounts/List'
import LearningDetail from '../pages/learning/Detail'
const MainRouter: FC = () => {
return (
@@ -50,7 +51,8 @@ const MainRouter: FC = () => {
<Route path={Pages.announcement.list} element={<AnnouncementtList />} />
<Route path={Pages.announcement.detail + ':id'} element={<AnnouncementDetail />} />
<Route path={Pages.criticisms} element={<AddCriticisms />} />
<Route path={Pages.learning} element={<LearningList />} />
<Route path={Pages.learning.list} element={<LearningList />} />
<Route path={Pages.learning.detail + ':id'} element={<LearningDetail />} />
<Route path={Pages.setting} element={<Setting />} />
<Route path={Pages.wallet} element={<Wallet />} />
<Route path={Pages.callback + ':id'} element={<CallBack />} />
+1 -1
View File
@@ -106,7 +106,7 @@ const SideBar: FC = () => {
icon={<Teacher variant={isActive('learning') ? 'Bold' : 'Outline'} color={isActive('learning') ? 'black' : '#8C90A3'} size={iconSizeSideBar} />}
title={t('sidebar.learning')}
isActive={isActive('learning')}
link={Pages.learning}
link={Pages.learning.list}
/>
</div>