API implementation for CMS and Master module
This commit is contained in:
@@ -7,6 +7,8 @@ import { Switch } from "../../../components/ui/switch";
|
||||
import EditAgencyMaster from "./EditAgencyMaster";
|
||||
import ViewAgencyAddModel from "./ViewAgencyAddModel";
|
||||
import ViewAgencyMaster from "./ViewAgencyMaster";
|
||||
import {useAgencyMasterToggleMutation, useGetAgencyMasterQuery } from "../../../Redux/Service/agency.master.module.service";
|
||||
import { useEffect, useState } from "react";
|
||||
|
||||
|
||||
// table data
|
||||
@@ -21,32 +23,95 @@ const tableHeadRow = [
|
||||
"Website/Domain",
|
||||
"GST no.",
|
||||
"Action"
|
||||
|
||||
|
||||
];
|
||||
|
||||
const managepost: any[] = [
|
||||
...Array.from({ length: 12 }, (_, i) => ({
|
||||
"Sr. No": i + 1,
|
||||
"Agency Name": "Lorem Ipsum",
|
||||
"RC no.": "Lorem Ipsum",
|
||||
"State": "Lorem Ipsum",
|
||||
"RC Status": "Active",
|
||||
"Registered Office Address": "Lorem Ipsum",
|
||||
"Website/Domain": "Lorem Ipsum",
|
||||
"GST no.": "Lorem Ipsum",
|
||||
// const managepost: any[] = [
|
||||
// ...Array.from({ length: 12 }, (_, i) => ({
|
||||
// "Sr. No": i + 1,
|
||||
// "Agency Name": "Lorem Ipsum",
|
||||
// "RC no.": "Lorem Ipsum",
|
||||
// "State": "Lorem Ipsum",
|
||||
// "RC Status": "Active",
|
||||
// "Registered Office Address": "Lorem Ipsum",
|
||||
// "Website/Domain": "Lorem Ipsum",
|
||||
// "GST no.": "Lorem Ipsum",
|
||||
// "Action": (
|
||||
// <HStack justifyContent="center">
|
||||
// <ViewAgencyMaster/>
|
||||
// <EditAgencyMaster />
|
||||
// <Box>
|
||||
// <Switch colorPalette={'teal'} size={"xs"}/>
|
||||
// </Box>
|
||||
// </HStack>
|
||||
// ),
|
||||
// })),
|
||||
// ];
|
||||
|
||||
const AgencyMaster = () => {
|
||||
const { data, refetch } = useGetAgencyMasterQuery()
|
||||
const [agencyMasterToggle] = useAgencyMasterToggleMutation()
|
||||
const [localData, setLocalData] = useState<any[]>([]);
|
||||
|
||||
useEffect(() => {
|
||||
if (data?.data?.data) {
|
||||
setLocalData(data?.data.data);
|
||||
}
|
||||
}, [data]);
|
||||
|
||||
const handleToggle = async (agencyId: string, currentStatus: number) => {
|
||||
const newStatus = currentStatus ? 0 : 1;
|
||||
setLocalData((prevData) =>
|
||||
prevData.map((agency) =>
|
||||
agency.id === agencyId ? { ...agency, is_active: newStatus } : agency
|
||||
)
|
||||
);
|
||||
try {
|
||||
await agencyMasterToggle({ id: agencyId, is_active: newStatus }).unwrap();
|
||||
refetch()
|
||||
} catch (error) {
|
||||
console.error("Error updating privacy policy:", error);
|
||||
setLocalData((prevData) =>
|
||||
prevData.map((agency) =>
|
||||
agency.id === agencyId ? { ...agency, is_active: currentStatus } : agency
|
||||
)
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
const managepost = localData?.map((agency: any, index: number) => ({
|
||||
'id': agency.id,
|
||||
"Sr. No": index + 1,
|
||||
"Agency Name": agency.name,
|
||||
"RC no.": agency.rc_number,
|
||||
"State": agency.state,
|
||||
"RC Status": agency.rc_status,
|
||||
"Registered Office Address": agency.registered_office,
|
||||
"Website/Domain": agency.domain_name,
|
||||
"GST no.": agency.gst_number,
|
||||
"is_active": agency.is_active,
|
||||
"Action": (
|
||||
<HStack justifyContent="center">
|
||||
<ViewAgencyMaster/>
|
||||
<ViewAgencyMaster agency={localData} id={agency.id}/>
|
||||
<EditAgencyMaster />
|
||||
<Box>
|
||||
<Switch colorPalette={'teal'} size={"xs"}/>
|
||||
<Switch
|
||||
colorPalette={"teal"}
|
||||
size={"xs"}
|
||||
onChange={() => handleToggle(agency.id, agency.is_active ?? 0)}
|
||||
checked={agency.is_active}
|
||||
/>
|
||||
</Box>
|
||||
</HStack>
|
||||
),
|
||||
})),
|
||||
];
|
||||
}));
|
||||
|
||||
useEffect(() => {
|
||||
console.log("Fetched data:", data);
|
||||
console.log("Local data:", localData);
|
||||
console.log("Managepost data:", managepost);
|
||||
}, [data, localData, managepost]);
|
||||
|
||||
const AgencyMaster = () => {
|
||||
return (
|
||||
|
||||
<MainFrame>
|
||||
@@ -59,11 +124,11 @@ const AgencyMaster = () => {
|
||||
px={3}
|
||||
>
|
||||
<Text as={"span"} fontSize={"sm"} fontWeight={500} color={"#000"}>
|
||||
Agency Master
|
||||
Agency Master
|
||||
</Text>
|
||||
|
||||
<HStack >
|
||||
<InputGroup
|
||||
<InputGroup
|
||||
startElement={
|
||||
<LuSearch fontSize={"xs"} style={{ position: 'relative', left: '10px' }} />
|
||||
}
|
||||
@@ -90,9 +155,9 @@ const AgencyMaster = () => {
|
||||
<DataTable
|
||||
sortableColumns={["Name", "Registration Date "]}
|
||||
tableHeadRow={tableHeadRow}
|
||||
data={managepost}
|
||||
data={managepost || []}
|
||||
/>
|
||||
</Box>
|
||||
</Box>
|
||||
</MainFrame>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -9,7 +9,7 @@ import {
|
||||
DialogTitle,
|
||||
DialogTrigger,
|
||||
} from "../../../components/ui/dialog";
|
||||
import { Field, Icon, Input, Span, Stack } from "@chakra-ui/react";
|
||||
import { Field, Input, Span, Stack } from "@chakra-ui/react";
|
||||
import Edit from "../../../components/ActionIcons/Edit";
|
||||
|
||||
function EditAgencyMaster() {
|
||||
|
||||
@@ -2,18 +2,20 @@ import {
|
||||
DialogBody,
|
||||
DialogCloseTrigger,
|
||||
DialogContent,
|
||||
DialogFooter,
|
||||
// DialogFooter,
|
||||
DialogHeader,
|
||||
DialogRoot,
|
||||
DialogTitle,
|
||||
DialogTrigger,
|
||||
} from "../../../components/ui/dialog";
|
||||
import { Field, Icon, Input, Span, Stack } from "@chakra-ui/react";
|
||||
import { MdOutlineRemoveRedEye } from "react-icons/md";
|
||||
import { Button } from "../../../components/ui/button";
|
||||
import { Field, Input, Span, Stack } from "@chakra-ui/react";
|
||||
// import { MdOutlineRemoveRedEye } from "react-icons/md";
|
||||
// import { Button } from "../../../components/ui/button";
|
||||
import View from "../../../components/ActionIcons/View";
|
||||
import { Agency } from "../../../Redux/Service/agency.master.module.service";
|
||||
|
||||
function ViewAgencyMaster({ agency, id }: { agency: Agency[], id:number }) {
|
||||
|
||||
function ViewAgencyMaster() {
|
||||
return (
|
||||
<DialogRoot placement="center">
|
||||
<DialogTrigger asChild>
|
||||
@@ -32,107 +34,130 @@ function ViewAgencyMaster() {
|
||||
>
|
||||
<DialogHeader bg="white">
|
||||
<DialogTitle alignSelf="center" color="black" fontSize="14px">
|
||||
Add
|
||||
View
|
||||
</DialogTitle>
|
||||
</DialogHeader>
|
||||
{agency.map((data) => (
|
||||
<DialogBody bg="white">
|
||||
{data.id === id && <Stack py={3}>
|
||||
<Field.Root>
|
||||
<Field.Label color="black" pt={1} fontSize="12px">
|
||||
Agency name
|
||||
</Field.Label>
|
||||
<Input
|
||||
value={data.name}
|
||||
bgColor="#EEEEEE"
|
||||
color="black"
|
||||
border="none"
|
||||
pl={1}
|
||||
fontSize="12px"
|
||||
height="30px"
|
||||
disabled
|
||||
/>
|
||||
|
||||
<DialogBody bg="white">
|
||||
<Stack py={3}>
|
||||
<Field.Root>
|
||||
<Field.Label color="black" pt={1} fontSize="12px">
|
||||
Agency name
|
||||
</Field.Label>
|
||||
<Input
|
||||
value="Lorem Ipsum"
|
||||
bgColor="#EEEEEE"
|
||||
color="black"
|
||||
border="none"
|
||||
pl={1}
|
||||
fontSize="12px"
|
||||
height="30px"
|
||||
/>
|
||||
<Field.Label color="black" pt={1} fontSize="12px">
|
||||
RC No.
|
||||
</Field.Label>
|
||||
<Input
|
||||
value={data.rc_number}
|
||||
bgColor="#EEEEEE"
|
||||
color="black"
|
||||
border="none"
|
||||
pl={1}
|
||||
fontSize="12px"
|
||||
height="30px"
|
||||
disabled
|
||||
/>
|
||||
|
||||
<Field.Label color="black" pt={1} fontSize="12px">
|
||||
RC No.
|
||||
</Field.Label>
|
||||
<Input
|
||||
value="Lorem Ipsum"
|
||||
bgColor="#EEEEEE"
|
||||
color="black"
|
||||
border="none"
|
||||
pl={1}
|
||||
fontSize="12px"
|
||||
height="30px"
|
||||
/>
|
||||
<Field.Label color="black" pt={1} fontSize="12px">
|
||||
State
|
||||
</Field.Label>
|
||||
<Input
|
||||
value={data.state}
|
||||
bgColor="#EEEEEE"
|
||||
color="black"
|
||||
border="none"
|
||||
pl={1}
|
||||
fontSize="12px"
|
||||
height="30px"
|
||||
disabled
|
||||
/>
|
||||
|
||||
<Field.Label color="black" pt={1} fontSize="12px">
|
||||
State
|
||||
</Field.Label>
|
||||
<Input
|
||||
value="Lorem Ipsum"
|
||||
bgColor="#EEEEEE"
|
||||
color="black"
|
||||
border="none"
|
||||
pl={1}
|
||||
fontSize="12px"
|
||||
height="30px"
|
||||
/>
|
||||
<Field.Label color="black" pt={1} fontSize="12px">
|
||||
RC Status
|
||||
</Field.Label>
|
||||
<Input
|
||||
value={data.rc_status}
|
||||
bgColor="#EEEEEE"
|
||||
color="black"
|
||||
border="none"
|
||||
pl={1}
|
||||
fontSize="12px"
|
||||
height="30px"
|
||||
disabled
|
||||
/>
|
||||
|
||||
<Field.Label color="black" pt={1} fontSize="12px">
|
||||
Registered Office Address
|
||||
</Field.Label>
|
||||
<Input
|
||||
value="Active"
|
||||
bgColor="#EEEEEE"
|
||||
color="black"
|
||||
border="none"
|
||||
pl={1}
|
||||
fontSize="12px"
|
||||
height="30px"
|
||||
/>
|
||||
<Field.Label color="black" pt={1} fontSize="12px">
|
||||
Registered Office Address
|
||||
</Field.Label>
|
||||
<Input
|
||||
value={data.registered_office}
|
||||
bgColor="#EEEEEE"
|
||||
color="black"
|
||||
border="none"
|
||||
pl={1}
|
||||
fontSize="12px"
|
||||
height="30px"
|
||||
disabled
|
||||
/>
|
||||
|
||||
<Field.Label color="black" pt={1} fontSize="12px">
|
||||
Website/Domain
|
||||
</Field.Label>
|
||||
<Input
|
||||
value="Lorem Ipsum"
|
||||
bgColor="#EEEEEE"
|
||||
color="black"
|
||||
border="none"
|
||||
pl={1}
|
||||
fontSize="12px"
|
||||
height="30px"
|
||||
/>
|
||||
<Field.Label color="black" pt={1} fontSize="12px">
|
||||
Website/Domain
|
||||
</Field.Label>
|
||||
<Input
|
||||
value={data.domain_name}
|
||||
bgColor="#EEEEEE"
|
||||
color="black"
|
||||
border="none"
|
||||
pl={1}
|
||||
fontSize="12px"
|
||||
height="30px"
|
||||
disabled
|
||||
/>
|
||||
|
||||
<Field.Label color="black" pt={1} fontSize="12px">
|
||||
GST no.
|
||||
</Field.Label>
|
||||
<Input
|
||||
value="Lorem Ipsum"
|
||||
bgColor="#EEEEEE"
|
||||
color="black"
|
||||
border="none"
|
||||
pl={1}
|
||||
fontSize="12px"
|
||||
height="30px"
|
||||
/>
|
||||
<Field.Label color="black" pt={1} fontSize="12px">
|
||||
GST no.
|
||||
</Field.Label>
|
||||
<Input
|
||||
value={data.gst_number}
|
||||
bgColor="#EEEEEE"
|
||||
color="black"
|
||||
border="none"
|
||||
pl={1}
|
||||
fontSize="12px"
|
||||
height="30px"
|
||||
disabled
|
||||
/>
|
||||
|
||||
<Field.Label color="black" pt={1} fontSize="12px">
|
||||
Action
|
||||
</Field.Label>
|
||||
<Input
|
||||
value="Lorem Ipsum"
|
||||
bgColor="#EEEEEE"
|
||||
color="black"
|
||||
border="none"
|
||||
pl={1}
|
||||
fontSize="12px"
|
||||
height="30px"
|
||||
/>
|
||||
</Field.Root>
|
||||
</Stack>
|
||||
</DialogBody>
|
||||
<DialogFooter display="flex" justifyContent="center" pt={"2"}>
|
||||
{/* <Field.Label color="black" pt={1} fontSize="12px">
|
||||
Action
|
||||
</Field.Label>
|
||||
<Input
|
||||
value={data}
|
||||
bgColor="#EEEEEE"
|
||||
color="black"
|
||||
border="none"
|
||||
pl={1}
|
||||
fontSize="12px"
|
||||
height="30px"
|
||||
disabled
|
||||
/> */}
|
||||
</Field.Root>
|
||||
</Stack>}
|
||||
</DialogBody>
|
||||
))}
|
||||
|
||||
{/* <DialogFooter display="flex" justifyContent="center" pt={"2"}>
|
||||
<Button
|
||||
w="100%"
|
||||
bg="#02A0A0"
|
||||
@@ -142,7 +167,7 @@ function ViewAgencyMaster() {
|
||||
>
|
||||
Save
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
</DialogFooter> */}
|
||||
|
||||
<DialogCloseTrigger color="black" />
|
||||
</DialogContent>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../../components/ui/dialog"
|
||||
import { Box, Field, IconButton, Input, Stack, Text, Textarea } from "@chakra-ui/react"
|
||||
import { Field, Input, Stack, Text } from "@chakra-ui/react"
|
||||
import { IoMdAdd } from "react-icons/io"
|
||||
import { Button } from "../../../components/ui/button"
|
||||
|
||||
|
||||
@@ -1,30 +1,30 @@
|
||||
import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../../components/ui/dialog"
|
||||
import { Box, Field, IconButton, Input, Span, Stack, Text, Textarea } from "@chakra-ui/react"
|
||||
import { Field, Input, Span, Stack } from "@chakra-ui/react"
|
||||
import { Button } from "../../../components/ui/button"
|
||||
import { FaRegEdit } from "react-icons/fa";
|
||||
// import { FaRegEdit } from "react-icons/fa";
|
||||
import Edit from "../../../components/ActionIcons/Edit";
|
||||
|
||||
|
||||
function EditJobStatusModel() {
|
||||
|
||||
|
||||
|
||||
|
||||
return (
|
||||
|
||||
<DialogRoot placement="center">
|
||||
<DialogTrigger asChild>
|
||||
<Span><Edit /></Span>
|
||||
<Span><Edit /></Span>
|
||||
</DialogTrigger>
|
||||
|
||||
<DialogContent
|
||||
bg={"#fff"}
|
||||
// w={{ lg: "60%", md: "230px" }}
|
||||
w={{ base: '90%', md: '400px' }}
|
||||
bg={"#fff"}
|
||||
// w={{ lg: "60%", md: "230px" }}
|
||||
w={{ base: '90%', md: '400px' }}
|
||||
height={'auto'}
|
||||
|
||||
overflowX="hidden"
|
||||
p={3} // Reduced padding
|
||||
bgSize={'md'}
|
||||
|
||||
overflowX="hidden"
|
||||
p={3} // Reduced padding
|
||||
bgSize={'md'}
|
||||
>
|
||||
<DialogHeader bg="white" >
|
||||
<DialogTitle alignSelf="center" color="black" fontSize="14px">Edit</DialogTitle>
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { Box, HStack, Image, Input, Text } from "@chakra-ui/react";
|
||||
import { Box, HStack, Input, Text } from "@chakra-ui/react";
|
||||
import MainFrame from "../../../components/MainFrame"
|
||||
import { InputGroup } from "../../../components/ui/input-group";
|
||||
import { LuSearch } from "react-icons/lu";
|
||||
@@ -15,7 +15,7 @@ const tableHeadRow = [
|
||||
"Sr. No",
|
||||
"Title",
|
||||
"Action"
|
||||
|
||||
|
||||
];
|
||||
|
||||
const managepost: any[] = [
|
||||
@@ -26,7 +26,7 @@ const managepost: any[] = [
|
||||
<HStack justifyContent="center">
|
||||
<EditJobStatusModel />
|
||||
<Box>
|
||||
<Switch colorPalette={'teal'} size={"xs"}/>
|
||||
<Switch colorPalette={'teal'} size={"xs"} />
|
||||
</Box>
|
||||
</HStack>
|
||||
),
|
||||
@@ -46,11 +46,11 @@ const JobStatus = () => {
|
||||
px={3}
|
||||
>
|
||||
<Text as={"span"} fontSize={"sm"} fontWeight={500} color={"#000"}>
|
||||
Job Status
|
||||
Job Status
|
||||
</Text>
|
||||
|
||||
<HStack >
|
||||
<InputGroup
|
||||
<InputGroup
|
||||
startElement={
|
||||
<LuSearch fontSize={"xs"} style={{ position: 'relative', left: '10px' }} />
|
||||
}
|
||||
@@ -79,7 +79,7 @@ const JobStatus = () => {
|
||||
tableHeadRow={tableHeadRow}
|
||||
data={managepost}
|
||||
/>
|
||||
</Box>
|
||||
</Box>
|
||||
</MainFrame>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../../components/ui/dialog"
|
||||
import { Box, Field, IconButton, Input, Stack, Text, Textarea } from "@chakra-ui/react"
|
||||
import { Field, Input, Stack, Text } from "@chakra-ui/react"
|
||||
import { IoMdAdd } from "react-icons/io"
|
||||
import { Button } from "../../../components/ui/button"
|
||||
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../../components/ui/dialog"
|
||||
import { Box, Field, IconButton, Input, Stack, Text, Textarea } from "@chakra-ui/react"
|
||||
import { Field, Input, Stack, Text } from "@chakra-ui/react"
|
||||
import { IoMdAdd } from "react-icons/io"
|
||||
import { Button } from "../../../components/ui/button"
|
||||
|
||||
|
||||
@@ -1,50 +1,132 @@
|
||||
import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../../components/ui/dialog"
|
||||
import { Box, Field, IconButton, Input, Stack, Text, Textarea } from "@chakra-ui/react"
|
||||
import { Box, Field, Input, Stack, Text } from "@chakra-ui/react"
|
||||
import { IoMdAdd } from "react-icons/io"
|
||||
import { Button } from "../../../components/ui/button"
|
||||
import { FiUpload } from "react-icons/fi";
|
||||
import { useState } from "react";
|
||||
// import { useCreateTemplatePostMutation } from "../../../Redux/Service/template.master.service";
|
||||
import { Toaster, toaster } from "../../../components/ui/toaster"
|
||||
import axios from "axios";
|
||||
|
||||
|
||||
function TemplateAddModel() {
|
||||
function TemplateAddModel({ id }: { id: number }) {
|
||||
const [title, setTitle] = useState("");
|
||||
const [subTitle, setSubTitle] = useState("");
|
||||
const [userType, setUserType] = useState<number | "">("");
|
||||
const [images, setImages] = useState<(File | string)[]>([]);
|
||||
// const [createTemplatePost] = useCreateTemplatePostMutation()
|
||||
const [isOpen, setIsOpen] = useState(false);
|
||||
const token = localStorage.getItem("token");
|
||||
if (!token) {
|
||||
console.error("No token found in localStorage!");
|
||||
return;
|
||||
}
|
||||
|
||||
const [images, setImages] = useState<string[]>([]);
|
||||
|
||||
const handleImageChange = (event: React.ChangeEvent<HTMLInputElement>) => {
|
||||
if (event.target.files) {
|
||||
const selectedFiles = Array.from(event.target.files);
|
||||
|
||||
const newImages = selectedFiles.map((file) => {
|
||||
return URL.createObjectURL(file); // Convert to preview URL
|
||||
});
|
||||
|
||||
setImages((prevImages) => [...prevImages, ...newImages]); // Append new images
|
||||
}
|
||||
const handleOpenModal = () => {
|
||||
setIsOpen(true); // Open modal when clicking "Add"
|
||||
};
|
||||
|
||||
|
||||
|
||||
const handleImageChange = async (event: React.ChangeEvent<HTMLInputElement>) => {
|
||||
if (event.target.files) {
|
||||
const file = event.target.files[0];
|
||||
if (!["image/jpeg", "image/jpg", "image/png"].includes(file.type)) {
|
||||
toaster.create({
|
||||
title: "Error",
|
||||
description: "Only JPEG, JPG, and PNG files are allowed.",
|
||||
type: "error",
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
setImages((prevImages) => [...prevImages, file]);
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
const handleSubmit = async () => {
|
||||
if (!title || !subTitle || !userType || images.length === 0) {
|
||||
toaster.create({
|
||||
title: "Error",
|
||||
description: "Please fill in all required fields and upload at least one image.",
|
||||
type: "error",
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
// const payload = {
|
||||
// id: id,
|
||||
// principle_type_xid: userType,
|
||||
// title,
|
||||
// sub_title: subTitle,
|
||||
// image_name: images.filter((img) => typeof img === "string"), // Send only Base64 strings
|
||||
// };
|
||||
|
||||
|
||||
const formData = new FormData();
|
||||
formData.append("id", `${id}`);
|
||||
formData.append("principle_type_xid", `${userType}`);
|
||||
formData.append("title", title);
|
||||
formData.append("sub_title", subTitle);
|
||||
|
||||
images.forEach((image, index) => {
|
||||
if (image instanceof File) {
|
||||
formData.append(`image_name[${index}]`, image, image.name); // Ensure indexed naming
|
||||
}
|
||||
});
|
||||
|
||||
if (token) {
|
||||
const payload = JSON.parse(atob(token.split(".")[1]));
|
||||
console.log("Token Payload:", payload);
|
||||
}
|
||||
|
||||
try {
|
||||
// await createTemplatePost(formData)
|
||||
if (token) {
|
||||
await axios.post(`https://ssa.betadelivery.com/apia/v1/template-store`, formData, {
|
||||
headers: {
|
||||
'Content-Type': 'multipart/form-data',
|
||||
'access-token': `${token}`,
|
||||
},
|
||||
// withCredentials: true,
|
||||
});
|
||||
}
|
||||
setTitle("");
|
||||
setSubTitle("");
|
||||
setUserType("");
|
||||
setImages([]);
|
||||
setIsOpen(false)
|
||||
} catch (error) {
|
||||
console.error("Error creating template:", error);
|
||||
// alert("Failed to create template");
|
||||
}
|
||||
};
|
||||
|
||||
console.log("Token stored:", window.localStorage.getItem("token"));
|
||||
|
||||
|
||||
return (
|
||||
|
||||
<DialogRoot placement="center">
|
||||
<DialogRoot placement="center" open={isOpen}>
|
||||
<DialogTrigger asChild>
|
||||
{/* <Button bg={"transparent"} size="sm">
|
||||
<MdOutlineRemoveRedEye style={{ cursor: "pointer", fontSize: "16px" }} />
|
||||
</Button> */}
|
||||
<Button px={5} size={"xs"} bg={"#02A0A0"}>
|
||||
<Button px={5} size={"xs"} bg={"#02A0A0"} onClick={handleOpenModal}>
|
||||
<IoMdAdd /> <Text>Add</Text>
|
||||
</Button>
|
||||
|
||||
</DialogTrigger>
|
||||
|
||||
<DialogContent
|
||||
bg={"#fff"}
|
||||
// w={{ lg: "60%", md: "230px" }}
|
||||
w={{ base: '90%', md: '400px' }}
|
||||
bg={"#fff"}
|
||||
// w={{ lg: "60%", md: "230px" }}
|
||||
w={{ base: '90%', md: '400px' }}
|
||||
height={'auto'}
|
||||
|
||||
overflowX="hidden"
|
||||
p={3} // Reduced padding
|
||||
bgSize={'md'}
|
||||
|
||||
overflowX="hidden"
|
||||
p={3} // Reduced padding
|
||||
bgSize={'md'}
|
||||
>
|
||||
<DialogHeader bg="white" >
|
||||
<DialogTitle alignSelf="center" color="black" fontSize="14px">Add</DialogTitle>
|
||||
@@ -54,30 +136,79 @@ function TemplateAddModel() {
|
||||
<Stack py={3}>
|
||||
|
||||
<Field.Root>
|
||||
<Field.Label color="black" pt={1} fontSize="12px">Template Name</Field.Label>
|
||||
<Input placeholder="" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
<Field.Label color="black" pt={1} fontSize="12px">Title</Field.Label>
|
||||
<Input
|
||||
placeholder="Enter Title"
|
||||
bgColor="#EEEEEE"
|
||||
color="black"
|
||||
border="none"
|
||||
pl={1}
|
||||
fontSize="12px"
|
||||
height="30px"
|
||||
value={title}
|
||||
onChange={(e) => setTitle(e.target.value)}
|
||||
/>
|
||||
</Field.Root>
|
||||
|
||||
|
||||
<Field.Root>
|
||||
<Field.Label color="black" pt={1} fontSize="12px">Subtitle</Field.Label>
|
||||
<Input
|
||||
placeholder="Enter subtitle"
|
||||
bgColor="#EEEEEE"
|
||||
color="black"
|
||||
border="none"
|
||||
pl={1}
|
||||
fontSize="12px"
|
||||
height="30px"
|
||||
value={subTitle}
|
||||
onChange={(e) => setSubTitle(e.target.value)}
|
||||
/>
|
||||
</Field.Root>
|
||||
|
||||
<Field.Root>
|
||||
<Field.Label color="black" pt={1} fontSize="12px">Select User Type</Field.Label>
|
||||
<Box bgColor="#EEEEEE" borderRadius="md" p={1}>
|
||||
<select
|
||||
style={{
|
||||
width: "100%",
|
||||
background: "transparent",
|
||||
color: "black",
|
||||
border: "none",
|
||||
fontSize: "12px",
|
||||
height: "30px",
|
||||
outline: "none",
|
||||
}}
|
||||
value={userType}
|
||||
onChange={(e) => setUserType(Number(e.target.value))}
|
||||
>
|
||||
<option value="">Select User Type</option>
|
||||
<option value="2">Recruiter</option>
|
||||
<option value="3">Jobseeker</option>
|
||||
</select>
|
||||
</Box>
|
||||
</Field.Root>
|
||||
|
||||
<Field.Root>
|
||||
<Field.Label color="black" pt={1} fontSize="12px">Images</Field.Label>
|
||||
<Box display="flex" alignItems="center" justifyContent="space-between" px={3} bgColor="#EEEEEE" border="none" width="100%" height="50px" cursor="pointer" position="relative">
|
||||
<Input type="file" accept="image/*" opacity={0} position="absolute" bgColor="#EEEEEE" border="none" pl={1} width="100%" height="100%" cursor="pointer" onChange={handleImageChange}/>
|
||||
<Box display="flex" gap={2} overflow="hidden">
|
||||
{images.length > 0 ? (
|
||||
images.map((img, index) => (
|
||||
<img
|
||||
key={index}
|
||||
src={img}
|
||||
alt={`Uploaded ${index}`}
|
||||
style={{ maxHeight: "40px", maxWidth: "70px", objectFit: "contain" }}
|
||||
/>
|
||||
))
|
||||
) : (
|
||||
<Box width="70px" height="40px" /> // Placeholder to maintain layout
|
||||
)}
|
||||
<Box display="flex" alignItems="center" justifyContent="space-between" px={3} bgColor="#EEEEEE" border="none" width="100%" height="50px" cursor="pointer" position="relative">
|
||||
<Input type="file" accept="image/*" opacity={0} position="absolute" bgColor="#EEEEEE" border="none" pl={1} width="100%" height="100%" cursor="pointer" onChange={handleImageChange} />
|
||||
<Box display="flex" gap={2} overflow="hidden">
|
||||
{images.length > 0 ? (
|
||||
images.map((img, index) => (
|
||||
<img
|
||||
key={index}
|
||||
src={img instanceof File ? URL.createObjectURL(img) : img}
|
||||
alt={`Uploaded ${index}`}
|
||||
style={{ maxHeight: "40px", maxWidth: "70px", objectFit: "contain" }}
|
||||
/>
|
||||
))
|
||||
) : (
|
||||
<Box width="70px" height="40px" /> // Placeholder to maintain layout
|
||||
)}
|
||||
</Box>
|
||||
<FiUpload color="#000" />
|
||||
</Box>
|
||||
<FiUpload color="#000" />
|
||||
</Box>
|
||||
|
||||
|
||||
{/* <Input placeholder="" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" /> */}
|
||||
|
||||
</Field.Root>
|
||||
@@ -85,13 +216,14 @@ function TemplateAddModel() {
|
||||
|
||||
</DialogBody>
|
||||
<DialogFooter display="flex" justifyContent="center" pt={"2"}>
|
||||
<Button w="100%" bg="#02A0A0" color={"#fff"}>
|
||||
<Button w="100%" bg="#02A0A0" color={"#fff"} onClick={handleSubmit}>
|
||||
Save
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
|
||||
<DialogCloseTrigger color="black" />
|
||||
<DialogCloseTrigger color="black" onClick={() => setIsOpen(false)} />
|
||||
</DialogContent>
|
||||
<Toaster />
|
||||
</DialogRoot >
|
||||
|
||||
)
|
||||
|
||||
@@ -4,12 +4,14 @@ import { InputGroup } from "../../../components/ui/input-group";
|
||||
import { LuSearch } from "react-icons/lu";
|
||||
import DataTable from "../../../components/DataTable";
|
||||
import { Switch } from "../../../components/ui/switch";
|
||||
import img from "../../../assets/waterfall.jpg"
|
||||
import Templateimg from "../../../assets/Template_img.png"
|
||||
// import img from "../../../assets/waterfall.jpg"
|
||||
// import Templateimg from "../../../assets/Template_img.png"
|
||||
import TemplateAddModel from "./TemplateAddModel";
|
||||
import EditTemplateModel from "./EditTemplateModel";
|
||||
import { Template, useGetTemplateMasterQuery, useTemplateMasterToggleMutation } from "../../../Redux/Service/template.master.service";
|
||||
import { useEffect, useState } from "react";
|
||||
|
||||
|
||||
const APIURL = import.meta.env.VITE_IMG_TEMPLATES
|
||||
|
||||
// table data
|
||||
|
||||
@@ -18,35 +20,95 @@ const tableHeadRow = [
|
||||
"Title",
|
||||
"Images",
|
||||
"Action"
|
||||
|
||||
];
|
||||
|
||||
const managepost: any[] = [
|
||||
...Array.from({ length: 12 }, (_, i) => ({
|
||||
"Sr. No": i + 1,
|
||||
"Title": "Lorem Ipsum",
|
||||
// const managepost: any[] = [
|
||||
// ...Array.from({ length: 12 }, (_, i) => ({
|
||||
// "Sr. No": i + 1,
|
||||
// "Title": "Lorem Ipsum",
|
||||
// "Images": (
|
||||
// // <Image w={50} src={img} />
|
||||
// <HStack >
|
||||
// <Image rounded={'lg'} w={100} h={50} src={img} />
|
||||
// <Image rounded={'lg'} w={100} h={50} src={Templateimg} />
|
||||
// </HStack>
|
||||
// ),
|
||||
|
||||
// "Action": (
|
||||
// <HStack justifyContent="center">
|
||||
// <EditTemplateModel />
|
||||
// <Box>
|
||||
// <Switch colorPalette={'teal'} size={"xs"} />
|
||||
// </Box>
|
||||
// </HStack>
|
||||
// ),
|
||||
// })),
|
||||
// ];
|
||||
|
||||
const TemplateMaster = () => {
|
||||
const { data, refetch } = useGetTemplateMasterQuery()
|
||||
const [localData, setLocalData] = useState<any[]>([]);
|
||||
const [templateMasterToggle] = useTemplateMasterToggleMutation()
|
||||
console.log('DATA', data?.data.data);
|
||||
|
||||
useEffect(() => {
|
||||
if (data?.data?.data) {
|
||||
setLocalData(data?.data.data);
|
||||
}
|
||||
}, [data]);
|
||||
|
||||
const handleToggle = async (agencyId: string, currentStatus: number) => {
|
||||
const newStatus = currentStatus ? 0 : 1;
|
||||
setLocalData((prevData) =>
|
||||
prevData.map((agency) =>
|
||||
agency.id === agencyId ? { ...agency, is_active: newStatus } : agency
|
||||
)
|
||||
);
|
||||
try {
|
||||
await templateMasterToggle({ id: agencyId, is_active: newStatus }).unwrap();
|
||||
refetch()
|
||||
} catch (error) {
|
||||
console.error("Error updating privacy policy:", error);
|
||||
setLocalData((prevData) =>
|
||||
prevData.map((agency) =>
|
||||
agency.id === agencyId ? { ...agency, is_active: currentStatus } : agency
|
||||
)
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
const managepost = localData?.map((agency: Template, index: number) => ({
|
||||
'id': agency.id,
|
||||
"Sr. No": index + 1,
|
||||
"Title": agency.post_template_translate.length > 0
|
||||
? agency.post_template_translate[0].title
|
||||
: "N/A",
|
||||
"Images": (
|
||||
// <Image w={50} src={img} />
|
||||
<HStack >
|
||||
<Image rounded={'lg'} w={100} h={50} src={img} />
|
||||
<Image rounded={'lg'} w={100} h={50} src={Templateimg} />
|
||||
{agency.post_template_image.map((img) => (
|
||||
<Image rounded={'lg'} w={100} h={50} src={`${APIURL}${img.image_name}`} />
|
||||
))}
|
||||
|
||||
{/* <Image rounded={'lg'} w={100} h={50} src={Templateimg} /> */}
|
||||
</HStack>
|
||||
|
||||
|
||||
),
|
||||
|
||||
|
||||
"Action": (
|
||||
<HStack justifyContent="center">
|
||||
<EditTemplateModel />
|
||||
<EditTemplateModel id={agency.id} localData={localData} />
|
||||
<Box>
|
||||
<Switch colorPalette={'teal'} size={"xs"}/>
|
||||
<Switch
|
||||
colorPalette={'teal'}
|
||||
size={"xs"}
|
||||
onChange={() => handleToggle(agency.id.toString(), Number(agency.is_active ?? 0))}
|
||||
checked={Boolean(Number(agency.is_active))}
|
||||
/>
|
||||
</Box>
|
||||
</HStack>
|
||||
),
|
||||
})),
|
||||
];
|
||||
}));
|
||||
|
||||
const TemplateMaster = () => {
|
||||
return (
|
||||
|
||||
<MainFrame>
|
||||
@@ -59,11 +121,11 @@ const TemplateMaster = () => {
|
||||
px={3}
|
||||
>
|
||||
<Text as={"span"} fontSize={"sm"} fontWeight={500} color={"#000"}>
|
||||
Template Master
|
||||
Template Master
|
||||
</Text>
|
||||
|
||||
<HStack >
|
||||
<InputGroup
|
||||
<InputGroup
|
||||
startElement={
|
||||
<LuSearch fontSize={"xs"} style={{ position: 'relative', left: '10px' }} />
|
||||
}
|
||||
@@ -84,7 +146,9 @@ const TemplateMaster = () => {
|
||||
/>
|
||||
</InputGroup>
|
||||
{/* <Button bgColor={'#EEEEEE'} pl={3} pr={3}><IoMdAdd /> <Text>Add</Text></Button> */}
|
||||
<TemplateAddModel />
|
||||
{localData?.map((item: any) => (
|
||||
<TemplateAddModel id={item.id} />
|
||||
))}
|
||||
</HStack>
|
||||
</HStack>
|
||||
<DataTable
|
||||
@@ -92,7 +156,7 @@ const TemplateMaster = () => {
|
||||
tableHeadRow={tableHeadRow}
|
||||
data={managepost}
|
||||
/>
|
||||
</Box>
|
||||
</Box>
|
||||
</MainFrame>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -9,17 +9,13 @@ import {
|
||||
DialogTrigger,
|
||||
} from "../../../components/ui/dialog";
|
||||
import {
|
||||
Box,
|
||||
Field,
|
||||
IconButton,
|
||||
Input,
|
||||
Span,
|
||||
Stack,
|
||||
Text,
|
||||
Textarea,
|
||||
} from "@chakra-ui/react";
|
||||
import { Button } from "../../../components/ui/button";
|
||||
import { FaRegEdit } from "react-icons/fa";
|
||||
// import { FaRegEdit } from "react-icons/fa";
|
||||
import Edit from "../../../components/ActionIcons/Edit";
|
||||
|
||||
function EditWorkModel() {
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../../components/ui/dialog"
|
||||
import { Box, Field, IconButton, Input, Stack, Text, Textarea } from "@chakra-ui/react"
|
||||
import {Field, Input, Stack, Text } from "@chakra-ui/react"
|
||||
import { IoMdAdd } from "react-icons/io"
|
||||
import { Button } from "../../../components/ui/button"
|
||||
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { Box, HStack, Image, Input, Text } from "@chakra-ui/react";
|
||||
import { Box, HStack, Input, Text } from "@chakra-ui/react";
|
||||
import MainFrame from "../../../components/MainFrame"
|
||||
import { InputGroup } from "../../../components/ui/input-group";
|
||||
import { LuSearch } from "react-icons/lu";
|
||||
|
||||
Reference in New Issue
Block a user