diff --git a/src/components/UploadBox.tsx b/src/components/UploadBox.tsx index b23f0d3..7f7cc7a 100644 --- a/src/components/UploadBox.tsx +++ b/src/components/UploadBox.tsx @@ -9,6 +9,7 @@ type Props = { isMultiple?: boolean, onChange?: (file: File[]) => void; isReset?: boolean; + disabled?: boolean; } const UploadBox: FC = (props: Props) => { @@ -17,6 +18,9 @@ const UploadBox: FC = (props: Props) => { const [files, setFiles] = useState([]) const onDrop = useCallback((acceptedFiles: File[]) => { + if (props.disabled) { + return + } if (props.isMultiple) { const array = [...files] array.push(acceptedFiles[0]) @@ -31,8 +35,8 @@ const UploadBox: FC = (props: Props) => { } } // eslint-disable-next-line react-hooks/exhaustive-deps - }, [files]) - const { getRootProps, getInputProps } = useDropzone({ onDrop }) + }, [files, props.disabled, props.isMultiple, props.onChange]) + const { getRootProps, getInputProps } = useDropzone({ onDrop, disabled: props.disabled }) const handleRemove = (index: number) => { const array = [...files] diff --git a/src/pages/setting/Banners.tsx b/src/pages/setting/Banners.tsx index eb7c46e..d6eff7c 100644 --- a/src/pages/setting/Banners.tsx +++ b/src/pages/setting/Banners.tsx @@ -1,14 +1,14 @@ import { useState, type FC } from 'react' -import PageTitle from '../../components/PageTitle' -import { useDeleteBanner, useGetBanners, useUpdateBanner } from './hooks/useSettingData' -import { type BannerItem, type UpdateBannerType } from './types/Types' -import PageLoading from '../../components/PageLoading' -import Error from '../../components/Error' -import Td from '../../components/Td' +import PageTitle from '@/components/PageTitle' +import PageLoading from '@/components/PageLoading' +import Error from '@/components/Error' +import Td from '@/components/Td' +import Button from '@/components/Button' +import TrashWithConfrim from '@/components/TrashWithConfrim' +import Switch from '@/components/Switch' +import { useDeleteBanner, useGetBanners, useUpdateBanner } from '@/pages/setting/hooks/useSettingData' +import { type BannerItem, type UpdateBannerType } from '@/pages/setting/types/Types' import { Calendar, Add, Edit, Eye } from 'iconsax-react' -import Button from '../../components/Button' -import TrashWithConfrim from '../../components/TrashWithConfrim' -import Switch from '../../components/Switch' import CreateBannerModal from './components/CreateBannerModal' import EditBannerModal from './components/EditBannerModal' @@ -55,7 +55,8 @@ const Banners: FC = () => { title: banner.title, linkUrl: banner.linkUrl, isActive: !banner.isActive, - order: banner.order + order: banner.order, + displayLocation: banner.displayLocation } updateBanner.mutate({ id: banner._id, params: updateData }) @@ -87,6 +88,7 @@ const Banners: FC = () => { + @@ -96,7 +98,7 @@ const Banners: FC = () => { {banners.length === 0 ? ( - + هیچ بنری یافت نشد @@ -137,6 +139,11 @@ const Banners: FC = () => { + + + {banner.displayLocation === 'desktop' ? 'دسکتاپ' : 'موبایل'} + + void } +type CreateBannerFormState = Omit & { + displayLocation: '' | 'desktop' | 'mobile' +} + +const displayLocationOptions: ItemsSelectType[] = [ + { value: 'desktop', label: 'دسکتاپ' }, + { value: 'mobile', label: 'موبایل' } +] + const CreateBannerModal: FC = ({ isOpen, onClose }) => { - const [formData, setFormData] = useState({ + const [formData, setFormData] = useState({ imageUrl: '', altText: '', title: '', linkUrl: '', isActive: true, order: 1, + displayLocation: '', }) const [imageFile, setImageFile] = useState([]) @@ -40,6 +51,11 @@ const CreateBannerModal: FC = ({ isOpen, onClose }) => { return } + if (!formData.displayLocation) { + toast.error('لطفا محل نمایش بنر را مشخص کنید') + return + } + if (imageFile.length === 0) { toast.error('لطفا تصویر بنر را انتخاب کنید') return @@ -68,6 +84,7 @@ const CreateBannerModal: FC = ({ isOpen, onClose }) => { linkUrl: formData.linkUrl, isActive: formData.isActive, order: formData.order, + displayLocation: formData.displayLocation, }, { onError: (error) => { toast.error(extractErrorMessage(error)) @@ -89,6 +106,7 @@ const CreateBannerModal: FC = ({ isOpen, onClose }) => { linkUrl: '', isActive: true, order: 1, + displayLocation: '', }) setImageFile([]) onClose() @@ -97,12 +115,25 @@ const CreateBannerModal: FC = ({ isOpen, onClose }) => { return (
+ {/* محل نمایش */} +
+ setFormData(prev => ({ ...prev, displayLocation: e.target.value as UpdateBannerType['displayLocation'] }))} + required + /> +
+ {/* تصویر بنر */}
diff --git a/src/pages/setting/types/Types.ts b/src/pages/setting/types/Types.ts index 527df77..f0a3bdf 100644 --- a/src/pages/setting/types/Types.ts +++ b/src/pages/setting/types/Types.ts @@ -220,6 +220,7 @@ export interface BannerItem { linkUrl: string; isActive: boolean; order: number; + displayLocation: "desktop" | "mobile"; createdAt: string; updatedAt: string; } @@ -241,6 +242,7 @@ export interface CreateBannerType { linkUrl: string; isActive: boolean; order: number; + displayLocation: "desktop" | "mobile"; } export interface UpdateBannerType { @@ -250,6 +252,7 @@ export interface UpdateBannerType { linkUrl: string; isActive: boolean; order: number; + displayLocation: "desktop" | "mobile"; } export interface SliderItem {