mirror of
https://github.com/WDI-Ideas/rubix-admin-panel.git
synced 2026-04-28 04:25:50 +00:00
Events crud done
This commit is contained in:
@@ -776,7 +776,7 @@ const EditBlogsAndArticles = () => {
|
||||
size="sm"
|
||||
rounded={"sm"}
|
||||
>
|
||||
Create blog
|
||||
Save edit
|
||||
</Button>
|
||||
</Box>
|
||||
</Box>
|
||||
|
||||
572
src/Pages/Events/EditEvents.jsx
Normal file
572
src/Pages/Events/EditEvents.jsx
Normal file
@@ -0,0 +1,572 @@
|
||||
import React, { useEffect, useState } from "react";
|
||||
import {
|
||||
useGetEventsByIdQuery,
|
||||
useUpdateEventsMutation,
|
||||
} from "../../Services/api.service";
|
||||
import fallbackImage from "../../assets/ultp-fallback-img.webp";
|
||||
import { useNavigate, useParams } from "react-router-dom";
|
||||
import {
|
||||
Box,
|
||||
Button,
|
||||
Divider,
|
||||
FormControl,
|
||||
FormHelperText,
|
||||
FormLabel,
|
||||
Heading,
|
||||
Image,
|
||||
Input,
|
||||
Stack,
|
||||
Tag,
|
||||
useToast,
|
||||
} from "@chakra-ui/react";
|
||||
import { addEvents } from "../../Validations/Validations";
|
||||
import { useForm } from "react-hook-form";
|
||||
import { yupResolver } from "@hookform/resolvers/yup";
|
||||
import FullscreenLoaders from "../../Components/Loaders/FullscreenLoaders";
|
||||
import { OPACITY_ON_LOAD } from "../../Layout/animations";
|
||||
import Header from "../../Components/Header";
|
||||
import { TiWarning } from "react-icons/ti";
|
||||
import { motion } from "framer-motion";
|
||||
import Loader01 from "../../Components/Loaders/Loader01";
|
||||
import ToastBox from "../../Components/ToastBox";
|
||||
|
||||
const EditEvents = () => {
|
||||
const { id } = useParams();
|
||||
const toast = useToast();
|
||||
const navigate = useNavigate();
|
||||
const { data, error, isLoading } = useGetEventsByIdQuery(id);
|
||||
const [isLoadingEdit, setIsLoadingEdit] = useState(false);
|
||||
const [selectedImage, setSelectedImage] = useState(fallbackImage);
|
||||
const [largeImageData, setLargeImageData] = useState(null);
|
||||
const [updateEvents] = useUpdateEventsMutation();
|
||||
|
||||
const {
|
||||
register,
|
||||
handleSubmit,
|
||||
reset,
|
||||
formState: { errors },
|
||||
setValue,
|
||||
} = useForm({
|
||||
resolver: yupResolver(addEvents),
|
||||
defaultValues: {
|
||||
title: "",
|
||||
content: "",
|
||||
location: "",
|
||||
organizer_name: "",
|
||||
organizer_mobile_number: "",
|
||||
eventDates:[],
|
||||
organizer_email: "",
|
||||
banner_image: null,
|
||||
},
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
if (data?.data) {
|
||||
setSelectedImage(
|
||||
`https://rubix.betadelivery.com/${data?.data?.banner_image}`
|
||||
);
|
||||
setValue("title", data?.data?.title);
|
||||
setValue("content", data?.data?.content);
|
||||
setValue("location", data?.data?.location);
|
||||
setValue("organizer_name", data?.data?.organizer_name);
|
||||
setValue("organizer_mobile_number", data?.data?.organizer_mobile_number);
|
||||
setValue("organizer_email", data?.data?.organizer_email);
|
||||
setValue("content", data?.data?.content);
|
||||
setValue("eventDates", data?.data?.eventDates);
|
||||
setValue("banner_image", data?.data?.banner_image);
|
||||
|
||||
setValue("eventDates", data?.data?.eventDates);
|
||||
}
|
||||
}, [data, setValue]);
|
||||
|
||||
console.log(selectedImage);
|
||||
|
||||
|
||||
|
||||
const handleImageChange = (e) => {
|
||||
const file = e.target.files[0];
|
||||
setLargeImageData(file);
|
||||
if (file) {
|
||||
const reader = new FileReader();
|
||||
reader.onloadend = () => {
|
||||
setSelectedImage(reader.result);
|
||||
};
|
||||
reader.readAsDataURL(file);
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
|
||||
|
||||
const onSubmit = (data) => {
|
||||
console.log(data);
|
||||
setIsLoadingEdit(true);
|
||||
const formData = new FormData();
|
||||
formData.append("title", data.title);
|
||||
formData.append("content", data.content);
|
||||
formData.append("location", data.location);
|
||||
formData.append("organizer_name", data.organizer_name);
|
||||
formData.append("organizer_mobile_number", data.organizer_mobile_number);
|
||||
formData.append("organizer_email", data.organizer_email);
|
||||
formData.append("dates[0]", "2024-05-08T08:19:27.264Z");
|
||||
if (data.banner_image[0]) {
|
||||
formData.append("banner_image", data.banner_image[0]);
|
||||
}
|
||||
|
||||
// for (const [key, value] of formData.entries()) {
|
||||
// console.log(`${key}: ${value}`);
|
||||
// }
|
||||
|
||||
// Trigger the mutationconst
|
||||
const res = updateEvents({id: id, data: formData})
|
||||
.then((response) => {
|
||||
// Handle the response here
|
||||
console.log("Mutation response:", response?.data?.statusCode);
|
||||
console.log("Mutation response:", response?.data?.message);
|
||||
|
||||
if (response?.data?.statusCode === 201) {
|
||||
setIsLoadingEdit(false);
|
||||
toast({
|
||||
render: () => (
|
||||
<ToastBox status={"success"} message={response?.data?.message} />
|
||||
),
|
||||
});
|
||||
reset();
|
||||
navigate("/events");
|
||||
} else if (response?.data?.statusCode === 500) {
|
||||
setIsLoadingEdit(false);
|
||||
toast({
|
||||
render: () => (
|
||||
<ToastBox status={"error"} message={response?.data?.message} />
|
||||
),
|
||||
});
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
// Handle errors
|
||||
console.error("Error creating community:", error?.message);
|
||||
setIsLoadingEdit(false);
|
||||
// Handle error notification if needed
|
||||
});
|
||||
|
||||
console.log(res);
|
||||
};
|
||||
|
||||
|
||||
|
||||
|
||||
console.log(errors);
|
||||
|
||||
return isLoading ? (
|
||||
<FullscreenLoaders />
|
||||
) : (
|
||||
<Box
|
||||
{...OPACITY_ON_LOAD}
|
||||
overflowY={"scroll"}
|
||||
paddingBottom={50}
|
||||
height={"100vh"}
|
||||
>
|
||||
<Header title={"Events"} />
|
||||
|
||||
<Box display={"flex"}>
|
||||
|
||||
|
||||
<form className="w-100"
|
||||
onSubmit={handleSubmit(onSubmit)}
|
||||
>
|
||||
<Box display={"flex"}>
|
||||
<Box className="col-5 d-flex flex-column gap-2 pt-4">
|
||||
<span className="web-text-large fw-bold rubix-text-dark">
|
||||
Events Info
|
||||
</span>
|
||||
<span className="web-text-medium text-secondary">
|
||||
Select the platform for which you need to create this campaign.
|
||||
</span>
|
||||
|
||||
<Divider />
|
||||
|
||||
<span className="web-text-large fw-bold rubix-text-dark">
|
||||
Display image
|
||||
</span>
|
||||
<span className="web-text-medium text-secondary mb-4">
|
||||
Below is the profile that will be displayed on the events page.
|
||||
</span>
|
||||
|
||||
<Box
|
||||
boxSize="sm"
|
||||
className="d-flex w-100 justify-content-center flex-column align-items-center gap-3"
|
||||
>
|
||||
<Image
|
||||
shadow={"md"}
|
||||
rounded={8}
|
||||
w={"100%"}
|
||||
h={240}
|
||||
src={selectedImage}
|
||||
alt="Selected Image"
|
||||
/>
|
||||
{selectedImage === fallbackImage || largeImageData === null ? (
|
||||
""
|
||||
) : (
|
||||
<Box display={"flex"} flexDirection={"column"} w={"100%"}>
|
||||
<span className="web-text-small">
|
||||
{largeImageData && largeImageData?.name}
|
||||
</span>
|
||||
<span className="web-text-small text-secondary fst-italic">
|
||||
{largeImageData &&
|
||||
(largeImageData?.size / (1024 * 1024)).toFixed(2)}{" "}
|
||||
mb
|
||||
</span>
|
||||
</Box>
|
||||
)}
|
||||
<Button
|
||||
onClick={() => setSelectedImage(fallbackImage)}
|
||||
backgroundColor="red.400"
|
||||
color={"whitesmoke"}
|
||||
transition={"0.5s"}
|
||||
_hover={{
|
||||
backgroundColor: "red.500",
|
||||
}}
|
||||
size="xs"
|
||||
>
|
||||
Remove
|
||||
</Button>
|
||||
</Box>
|
||||
</Box>
|
||||
|
||||
<Box
|
||||
className="col-7 pt-4 overflow-auto p-4"
|
||||
// onSubmit={handleSubmit(onSubmit)}
|
||||
>
|
||||
<Box className="web-text-large fw-bold mb-2 rubix-text-dark">
|
||||
Status
|
||||
</Box>
|
||||
{data?.data?.status ? (
|
||||
<Tag
|
||||
position={"sticky"}
|
||||
right={10}
|
||||
size={"sm"}
|
||||
variant="solid"
|
||||
colorScheme="teal"
|
||||
>
|
||||
Active
|
||||
</Tag>
|
||||
) : (
|
||||
<Tag
|
||||
position={"sticky"}
|
||||
right={10}
|
||||
size={"sm"}
|
||||
variant="solid"
|
||||
colorScheme="red"
|
||||
>
|
||||
Inactive
|
||||
</Tag>
|
||||
)}
|
||||
|
||||
<FormControl isRequired className="mb-3">
|
||||
<FormLabel className="web-text-large fw-bold rubix-text-dark">
|
||||
Title
|
||||
</FormLabel>
|
||||
<Input
|
||||
{...register("title")}
|
||||
placeholder="Name"
|
||||
className="web-text-medium"
|
||||
size="sm"
|
||||
name="title"
|
||||
type="text"
|
||||
id="title"
|
||||
/>
|
||||
{errors.title && (
|
||||
<span className="text-danger web-text-small fw-bold ps-2 d-flex align-items-center gap-1 mt-1">
|
||||
<TiWarning className="fw-bold fs-5 " /> {errors.title.message}
|
||||
</span>
|
||||
)}
|
||||
</FormControl>
|
||||
|
||||
<FormControl isRequired className="mb-3">
|
||||
<FormLabel className="web-text-large fw-bold rubix-text-dark">
|
||||
Content
|
||||
</FormLabel>
|
||||
<Input
|
||||
{...register("content")}
|
||||
placeholder="Name"
|
||||
className="web-text-medium"
|
||||
size="sm"
|
||||
name="content"
|
||||
type="text"
|
||||
id="content"
|
||||
/>
|
||||
{errors.content && (
|
||||
<span className="text-danger web-text-small fw-bold ps-2 d-flex align-items-center gap-1 mt-1">
|
||||
<TiWarning className="fw-bold fs-5 " /> {errors.content.message}
|
||||
</span>
|
||||
)}
|
||||
</FormControl>
|
||||
|
||||
<FormControl isRequired className="mb-3">
|
||||
<FormLabel className="web-text-large fw-bold rubix-text-dark">
|
||||
Location
|
||||
</FormLabel>
|
||||
<Input
|
||||
{...register("location")}
|
||||
placeholder="Name"
|
||||
className="web-text-medium"
|
||||
size="sm"
|
||||
name="location"
|
||||
type="text"
|
||||
id="location"
|
||||
/>
|
||||
{errors.location && (
|
||||
<span className="text-danger web-text-small fw-bold ps-2 d-flex align-items-center gap-1 mt-1">
|
||||
<TiWarning className="fw-bold fs-5 " />{" "}
|
||||
{errors.location.message}
|
||||
</span>
|
||||
)}
|
||||
</FormControl>
|
||||
|
||||
|
||||
<FormControl className="mb-3">
|
||||
<FormLabel className="web-text-large fw-bold rubix-text-dark">
|
||||
Event dates
|
||||
</FormLabel>
|
||||
<Input
|
||||
{...register("eventDates")}
|
||||
placeholder="Dates"
|
||||
className="web-text-medium"
|
||||
size="sm"
|
||||
name="eventDates"
|
||||
type="text"
|
||||
id="eventDates"
|
||||
/>
|
||||
{errors.eventDates && (
|
||||
<span className="text-danger web-text-small fw-bold ps-2 d-flex align-items-center gap-1 mt-1">
|
||||
<TiWarning className="fw-bold fs-5 " />{" "}
|
||||
{errors.eventDates.message}
|
||||
</span>
|
||||
)}
|
||||
</FormControl>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<FormControl className="mb-3">
|
||||
<FormLabel className="web-text-large fw-bold rubix-text-dark">
|
||||
Banner image
|
||||
</FormLabel>
|
||||
{/* <ImageDropBox /> */}
|
||||
|
||||
<Box
|
||||
borderColor="gray.300"
|
||||
borderStyle="dashed"
|
||||
borderWidth="2px"
|
||||
rounded="md"
|
||||
shadow="sm"
|
||||
role="group"
|
||||
transition="all 150ms ease-in-out"
|
||||
_hover={{
|
||||
shadow: "md",
|
||||
}}
|
||||
as={motion.div}
|
||||
initial="rest"
|
||||
animate="rest"
|
||||
whileHover="hover"
|
||||
height={"105px"}
|
||||
className="pointer"
|
||||
>
|
||||
<Box position="relative" height="100%" width="100%">
|
||||
<Box
|
||||
position="absolute"
|
||||
top="0"
|
||||
left="0"
|
||||
height="100%"
|
||||
width="100%"
|
||||
display="flex"
|
||||
flexDirection="column"
|
||||
>
|
||||
<Stack
|
||||
height="100%"
|
||||
width="100%"
|
||||
display="flex"
|
||||
alignItems="center"
|
||||
justify="center"
|
||||
>
|
||||
<span
|
||||
className="d-flex flex-column align-items-center pointer"
|
||||
spacing="1"
|
||||
>
|
||||
<Heading
|
||||
fontSize="lg"
|
||||
color="gray.700"
|
||||
fontWeight="bold"
|
||||
cursor={"pointer"}
|
||||
>
|
||||
Drop images here
|
||||
</Heading>
|
||||
<span
|
||||
fontWeight="light"
|
||||
className="web-text-large text-secondary text-center pointer"
|
||||
>
|
||||
or click to upload
|
||||
</span>
|
||||
</span>
|
||||
</Stack>
|
||||
</Box>
|
||||
<Input
|
||||
{...register("banner_image")}
|
||||
type="file"
|
||||
height="100%"
|
||||
width="100%"
|
||||
position="absolute"
|
||||
top="0"
|
||||
left="0"
|
||||
opacity="0"
|
||||
aria-hidden="true"
|
||||
accept="image/*"
|
||||
onChange={handleImageChange}
|
||||
onDrop={handleImageChange}
|
||||
// onDragEnter={startAnimation}
|
||||
// onDragLeave={stopAnimation}
|
||||
/>
|
||||
</Box>
|
||||
</Box>
|
||||
|
||||
{errors.banner_image && (
|
||||
<span className="text-danger web-text-small fw-bold ps-2 d-flex align-items-center gap-1 mt-1">
|
||||
<TiWarning className="fw-bold fs-5 " />{" "}
|
||||
{errors.banner_image.message}
|
||||
</span>
|
||||
)}
|
||||
<FormHelperText className="web-text-small">
|
||||
Maximum limit of image should be 1mb to protect website from slow loading.
|
||||
</FormHelperText>
|
||||
</FormControl>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</Box>
|
||||
|
||||
|
||||
</Box>
|
||||
<Divider />
|
||||
|
||||
<Box display={"flex"}>
|
||||
|
||||
|
||||
<Box className="col-5 d-flex flex-column gap-2 pt-4">
|
||||
|
||||
<span className="web-text-large fw-bold rubix-text-dark">
|
||||
Orgainsation info
|
||||
</span>
|
||||
<span className="web-text-medium text-secondary mb-0">
|
||||
Lorem ipsum dolor sit amet consectetur adipisicing elit. Tenetur dicta exercitationem laboriosam fugit vel ipsam hic, consectetur eum nesciunt adipisci?
|
||||
</span>
|
||||
</Box>
|
||||
|
||||
|
||||
|
||||
<Box className="col-7 pt-4 p-4">
|
||||
|
||||
|
||||
|
||||
|
||||
<FormControl isRequired className="mb-3">
|
||||
<FormLabel className="web-text-large fw-bold rubix-text-dark">
|
||||
Organisation name
|
||||
</FormLabel>
|
||||
<Input
|
||||
{...register("organizer_name")}
|
||||
placeholder="Name"
|
||||
className="web-text-medium"
|
||||
size="sm"
|
||||
name="organizer_name"
|
||||
type="text"
|
||||
id="organizer_name"
|
||||
/>
|
||||
{errors.organizer_name && (
|
||||
<span className="text-danger web-text-small fw-bold ps-2 d-flex align-items-center gap-1 mt-1">
|
||||
<TiWarning className="fw-bold fs-5 " />{" "}
|
||||
{errors.organizer_name.message}
|
||||
</span>
|
||||
)}
|
||||
</FormControl>
|
||||
|
||||
<FormControl isRequired className="mb-3">
|
||||
<FormLabel className="web-text-large fw-bold rubix-text-dark">
|
||||
Organisation number
|
||||
</FormLabel>
|
||||
<Input
|
||||
{...register("organizer_mobile_number")}
|
||||
placeholder="Name"
|
||||
className="web-text-medium"
|
||||
size="sm"
|
||||
name="organizer_mobile_number"
|
||||
type="text"
|
||||
id="organizer_mobile_number"
|
||||
/>
|
||||
{errors.organizer_mobile_number && (
|
||||
<span className="text-danger web-text-small fw-bold ps-2 d-flex align-items-center gap-1 mt-1">
|
||||
<TiWarning className="fw-bold fs-5 " />{" "}
|
||||
{errors.organizer_mobile_number.message}
|
||||
</span>
|
||||
)}
|
||||
</FormControl>
|
||||
|
||||
<FormControl isRequired className="mb-3">
|
||||
<FormLabel className="web-text-large fw-bold rubix-text-dark">
|
||||
Organisation email
|
||||
</FormLabel>
|
||||
<Input
|
||||
{...register("organizer_email")}
|
||||
placeholder="Name"
|
||||
className="web-text-medium"
|
||||
size="sm"
|
||||
name="organizer_email"
|
||||
type="text"
|
||||
id="organizer_email"
|
||||
/>
|
||||
{errors.organizer_email && (
|
||||
<span className="text-danger web-text-small fw-bold ps-2 d-flex align-items-center gap-1 mt-1">
|
||||
<TiWarning className="fw-bold fs-5 " />{" "}
|
||||
{errors.organizer_email.message}
|
||||
</span>
|
||||
)}
|
||||
</FormControl>
|
||||
|
||||
<Box className=" d-flex justify-content-end">
|
||||
<Button
|
||||
isLoading={isLoadingEdit}
|
||||
spinner={<Loader01 />}
|
||||
color={"whitesmoke"}
|
||||
backgroundColor={"purple.700"}
|
||||
_hover={{
|
||||
backgroundColor: "purple.800",
|
||||
}}
|
||||
type="submit"
|
||||
size="sm"
|
||||
rounded={"sm"}
|
||||
>
|
||||
Save edit
|
||||
</Button>
|
||||
</Box>
|
||||
|
||||
|
||||
</Box>
|
||||
|
||||
</Box>
|
||||
|
||||
|
||||
</form>
|
||||
|
||||
|
||||
</Box>
|
||||
</Box>
|
||||
);
|
||||
};
|
||||
|
||||
export default EditEvents;
|
||||
179
src/Pages/Events/ViewEvents.jsx
Normal file
179
src/Pages/Events/ViewEvents.jsx
Normal file
@@ -0,0 +1,179 @@
|
||||
import React from 'react'
|
||||
import { useGetEventsByIdQuery } from '../../Services/api.service';
|
||||
import { useNavigate, useParams } from 'react-router-dom';
|
||||
import { Box, Divider, Image, Tag, useToast } from '@chakra-ui/react';
|
||||
import FullscreenLoaders from '../../Components/Loaders/FullscreenLoaders';
|
||||
import { OPACITY_ON_LOAD } from '../../Layout/animations';
|
||||
import Header from '../../Components/Header';
|
||||
import { formatDate } from '../../Components/Functions/UTCConvertor';
|
||||
|
||||
const ViewEvents = () => {
|
||||
const { id } = useParams();
|
||||
const toast = useToast();
|
||||
const navigate = useNavigate();
|
||||
const { data, error, isLoading } = useGetEventsByIdQuery(id);
|
||||
const events = data?.data;
|
||||
console.log(events);
|
||||
if (isLoading) {
|
||||
return <FullscreenLoaders />;
|
||||
}
|
||||
return(
|
||||
<Box
|
||||
{...OPACITY_ON_LOAD}
|
||||
w={"100%"}
|
||||
h={"100vh"}
|
||||
className="overflow-auto "
|
||||
display={"flex"}
|
||||
flexDirection={"column"}
|
||||
>
|
||||
<Header
|
||||
title={"Events"}
|
||||
btnTitle={'Edit events'}
|
||||
link={`/events/edit/${id}`}
|
||||
/>
|
||||
|
||||
|
||||
|
||||
<Box display={"flex"}>
|
||||
<Box className="col-5 d-flex flex-column gap-2 pt-4">
|
||||
<span className="web-text-large fw-bold rubix-text-dark">
|
||||
Events Info
|
||||
</span>
|
||||
<span className="web-text-medium text-secondary">
|
||||
Select the platform for which you need to create this campaign.
|
||||
</span>
|
||||
|
||||
<Divider />
|
||||
|
||||
<span className="web-text-large fw-bold rubix-text-dark">
|
||||
Events banner image
|
||||
</span>
|
||||
<span className="web-text-medium text-secondary mb-4">
|
||||
Below is the profile that will be displayed on the community page.
|
||||
</span>
|
||||
|
||||
<Box
|
||||
boxSize="sm"
|
||||
className="d-flex h-auto w-100 justify-content-start flex-column align-items-center gap-3"
|
||||
>
|
||||
<Image
|
||||
shadow={"md"}
|
||||
rounded={8}
|
||||
objectFit='cover'
|
||||
w={500}
|
||||
h={240}
|
||||
src={`https://rubix.betadelivery.com/${events?.banner_image}`}
|
||||
alt="Selected Image"
|
||||
/>
|
||||
</Box>
|
||||
</Box>
|
||||
|
||||
|
||||
|
||||
<Box className="col-7 pt-4 p-4">
|
||||
<Box>
|
||||
<Box className="web-text-large fw-bold mb-1 rubix-text-dark">
|
||||
Status
|
||||
</Box>
|
||||
{events?.status ? (
|
||||
<Tag size={"sm"} borderRadius="full" colorScheme="teal">
|
||||
Active
|
||||
</Tag>
|
||||
) : (
|
||||
<Tag size={"sm"} borderRadius="full" colorScheme="red">
|
||||
Inactive
|
||||
</Tag>
|
||||
)}
|
||||
</Box>
|
||||
|
||||
<Box className="mb-3">
|
||||
<Box className="web-text-large fw-bold rubix-text-dark">Title</Box>
|
||||
<Box className="web-text-medium text-secondary">{events?.title}</Box>
|
||||
</Box>
|
||||
|
||||
|
||||
<Box className="mb-3">
|
||||
<Box className="web-text-large fw-bold rubix-text-dark">
|
||||
Content
|
||||
</Box>
|
||||
<Box className="web-text-medium text-secondary">
|
||||
{events?.content}
|
||||
</Box>
|
||||
</Box>
|
||||
|
||||
|
||||
|
||||
<Box className="mb-3">
|
||||
<Box className="web-text-large fw-bold rubix-text-dark">
|
||||
Location
|
||||
</Box>
|
||||
<Box className="web-text-medium text-secondary">
|
||||
{events?.location}
|
||||
</Box>
|
||||
</Box>
|
||||
|
||||
|
||||
|
||||
|
||||
<Box className="mb-3">
|
||||
<Box className="web-text-large fw-bold rubix-text-dark">
|
||||
Organisation name
|
||||
</Box>
|
||||
<Box className="web-text-medium text-secondary">
|
||||
{events?.organizer_name}
|
||||
</Box>
|
||||
</Box>
|
||||
|
||||
|
||||
<Box className="mb-3">
|
||||
<Box className="web-text-large fw-bold rubix-text-dark">
|
||||
Organisation number
|
||||
</Box>
|
||||
<Box className="web-text-medium text-secondary">
|
||||
{events?.organizer_mobile_number}
|
||||
</Box>
|
||||
</Box>
|
||||
|
||||
|
||||
<Box className="mb-3">
|
||||
<Box className="web-text-large fw-bold rubix-text-dark">
|
||||
Organisation email
|
||||
</Box>
|
||||
<Box className="web-text-medium text-secondary">
|
||||
{events?.organizer_email}
|
||||
</Box>
|
||||
</Box>
|
||||
|
||||
|
||||
|
||||
<Box className="mb-3">
|
||||
<Box className="web-text-large fw-bold rubix-text-dark">
|
||||
Created at
|
||||
</Box>
|
||||
<Box className="web-text-medium text-secondary">
|
||||
{formatDate(events?.createdAt)}
|
||||
</Box>
|
||||
</Box>
|
||||
|
||||
<Box className="mb-3">
|
||||
<Box className="web-text-large fw-bold rubix-text-dark">
|
||||
Updated at
|
||||
</Box>
|
||||
<Box className="web-text-medium text-secondary">
|
||||
{formatDate(events?.updatedAt)}
|
||||
</Box>
|
||||
</Box>
|
||||
</Box>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</Box>
|
||||
</Box>)
|
||||
}
|
||||
|
||||
export default ViewEvents
|
||||
@@ -41,6 +41,8 @@ import BannerLearnEdit from "../Pages/Banners/BannerLearn/BannerLearnEdit";
|
||||
import BannerBuildEdit from "../Pages/Banners/BannerBuild/BannerBuildEdit";
|
||||
import BannerNewsEdit from "../Pages/Banners/BannerNews/BannerNewsEdit";
|
||||
import BannerHomeEdit from "../Pages/Banners/HomeBanner/HomeBannerEdit";
|
||||
import ViewEvents from "../Pages/Events/ViewEvents";
|
||||
import EditEvents from "../Pages/Events/EditEvents";
|
||||
|
||||
export const RouteLink = [
|
||||
{ path: "/", Component: Home },
|
||||
@@ -110,6 +112,6 @@ export const RouteLink = [
|
||||
// =============[ events ]================
|
||||
{ path: "/events", Component: Events },
|
||||
{ path: "/events/add-events", Component: AddEvents },
|
||||
{ path: "/events/view/:id", Component: UnderConstruction }, // TODO EVENT VIEW
|
||||
{ path: "/events/edit/:id", Component: UnderConstruction }, // TODO EVENT EDIT
|
||||
{ path: "/events/view/:id", Component: ViewEvents },
|
||||
{ path: "/events/edit/:id", Component: EditEvents },
|
||||
];
|
||||
|
||||
@@ -340,8 +340,20 @@ export const rubixApi = createApi({
|
||||
}),
|
||||
invalidatesTags: ["getEvents"],
|
||||
}),
|
||||
getEventsById: builder.query({
|
||||
query: (id) => `/admin/events/${id}`,
|
||||
providesTags: ["getEvents"],
|
||||
}),
|
||||
updateEvents: builder.mutation({
|
||||
query: ({ id, data }) => ({
|
||||
url: `/admin/events/${id}`,
|
||||
method: "PUT",
|
||||
body: data, // Include the data you want to send in the request body
|
||||
}),
|
||||
invalidatesTags: ["getEvents"],
|
||||
}),
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// ===============[ Home Banners endpoints ]=======================
|
||||
@@ -522,6 +534,8 @@ export const {
|
||||
useCreateEventsMutation,
|
||||
useUpdateEventsStatusMutation,
|
||||
useDeleteEventsMutation,
|
||||
useUpdateEventsMutation,
|
||||
useGetEventsByIdQuery,
|
||||
|
||||
|
||||
useGetVideosQuery,
|
||||
|
||||
@@ -189,6 +189,7 @@ export const addEvents = Yup.object().shape({
|
||||
content: Yup.string().required("content is required"),
|
||||
location: Yup.string().required("location is required"),
|
||||
organizer_name: Yup.string().required("Org name date is required"),
|
||||
eventDates:Yup.string(),
|
||||
organizer_mobile_number: Yup.string().required("Org contact is required")
|
||||
.matches(/^[0-9]{10}$/, "Mobile number must be 10 digits"),
|
||||
organizer_email: Yup.string().required("Org email is required").email("Please enter valid email"),
|
||||
@@ -198,21 +199,21 @@ export const addEvents = Yup.object().shape({
|
||||
if (files) return true;
|
||||
return false;
|
||||
})
|
||||
.test(
|
||||
"fileSize",
|
||||
" The maximum size of profile picture is 15MB.",
|
||||
(files) => {
|
||||
//if u want to allow only certain file sizes
|
||||
try {
|
||||
if (files.length !== 0) {
|
||||
return files[0].size <= 15000000;
|
||||
}
|
||||
return true;
|
||||
} catch (error) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
)
|
||||
// .test(
|
||||
// "fileSize",
|
||||
// " The maximum size of profile picture is 15MB.",
|
||||
// (files) => {
|
||||
// //if u want to allow only certain file sizes
|
||||
// try {
|
||||
// if (files.length !== 0) {
|
||||
// return files[0].size <= 15000000;
|
||||
// }
|
||||
// return true;
|
||||
// } catch (error) {
|
||||
// return false;
|
||||
// }
|
||||
// }
|
||||
// )
|
||||
// .test("file_formate", "Image file has unsupported format.", (files) => {
|
||||
// // // console.log(files[0].type)
|
||||
|
||||
|
||||
Reference in New Issue
Block a user