Siddhesh.More/SSA-Admin-Panel
1
0
Fork 0
Code Issues Pull Requests 3 Packages Projects Releases Wiki Activity

Working on subadmin update and add post

Browse Source
This commit is contained in:
rockyeverlast
2025-03-17 20:31:52 +05:30
parent 940c2a11d0
commit 2d15461f86
13 changed files with 608 additions and 289 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
dev-dist/sw.js
View File

@@ -82,7 +82,7 @@ define(['./workbox-54d0af47'], (function (workbox) { 'use strict';
"revision": "3ca0b8505b4bec776b69afdba2768812"
}, {
"url": "index.html",
"revision": "0.n8f1c1adqh8"
"revision": "0.7aakaijcn38"
}], {});
workbox.cleanupOutdatedCaches();
workbox.registerRoute(new workbox.NavigationRoute(workbox.createHandlerBoundToURL("index.html"), {

46
src/Pages/ManageCMS/FAQ/FAQ.tsx
View File

@@ -12,6 +12,7 @@ import { useEffect, useState } from "react";
import { FaqData, useDeleteFaqPostMutation, useFaqToggleMutation, useGetFaqQuery } from "../../../Redux/Service/faqs.service";
import SearchComponent from "../../../components/SearchComponent";
import NoData from "../../../components/NoData";
import { Toaster, toaster } from "../../../components/ui/toaster";
// table data
@@ -56,6 +57,7 @@ const FAQ = () => {
const [faqToggle] = useFaqToggleMutation()
const [deleteFaqPost] = useDeleteFaqPostMutation()
const [searchTerm, setSearchTerm] = useState("");
const [deleteModal, setDeleteModal] = useState(true)
// console.log('DATA', data?.data);
@@ -89,11 +91,23 @@ const FAQ = () => {
const handleDeleteFaq = async (faqId: number) => {
try {
const response = await deleteFaqPost(faqId).unwrap();
refetch()
console.log("FAQ deleted successfully:", response);
if (response.success) {
toaster.create({
title: "Success",
description: "FAQ deleted successfully",
type: "success",
});
refetch()
console.log("FAQ deleted successfully:", response);
}
// Optionally, refetch data or update state after deletion
} catch (error) {
console.error("Error deleting FAQ:", error);
toaster.create({
title: "Error",
description: "Something went wrong",
type: "error",
});
}
};
@@ -113,12 +127,15 @@ const FAQ = () => {
<EditDetails rowData={{ id: agency.id, question: agency.question, answer: agency.answer }} refetch={refetch} />
<AlertDailog
AltertTiggerIcon={() => <Delete />}
alertText="Delete Users"
isOpen={deleteModal}
AltertTiggerIcon={() => <Delete onClick={() => setDeleteModal(true)} />}
alertText="Delete FAQ"
alertIcon={<Image src={"DeleteIcon"} h={"39px"} />}
alertCaption="are you sure you want to delete ?"
onClose={() => setDeleteModal(false)}
onConfirm={() => {
// console.log("User deleted:", index + 1);
setDeleteModal(false);
handleDeleteFaq(agency.id)
}}
/>
@@ -156,26 +173,6 @@ const FAQ = () => {
</Text>
<HStack >
{/* <InputGroup
startElement={
<LuSearch fontSize={"xs"} style={{ position: 'relative', left: '10px' }} />
}
color={"#000"}
>
<Input
p={3}
w={300}
bg={"#fff"}
colorPalette={"blue"}
_focus={{ border: "1px solid #02A0A0" }}
rounded={"md"}
size={"xs"}
fontSize={"2sm"}
placeholder="Search..."
bgColor={'#EEEEEE'}
ps={8}
/>
</InputGroup> */}
<SearchComponent
value={searchTerm}
onChange={setSearchTerm}
@@ -194,6 +191,7 @@ const FAQ = () => {
refetch={refetch}
/>}
</Box>
<Toaster />
</MainFrame>
)
}

12
src/Pages/ManageGroups/ManageGroups.tsx
View File

@@ -1,14 +1,16 @@
import { Box, HStack, Image, Input, Text } from "@chakra-ui/react";
import { Box, HStack,
// Image,
Input, Text } from "@chakra-ui/react";
import MainFrame from "../../components/MainFrame";
import { InputGroup } from "../../components/ui/input-group";
import { LuSearch } from "react-icons/lu";
import DataTable from "../../components/DataTable";
import AlertDailog from "../../components/AlertDailog";
// import AlertDailog from "../../components/AlertDailog";
// import { RiDeleteBin5Line } from "react-icons/ri";
import ViewManageGroup from "./ViewManageGroup";
import EditDetailGroups from "./EditDetailGroup";
import AddGroup from "./AddGroup";
import Delete from "../../components/ActionIcons/Delete";
// import Delete from "../../components/ActionIcons/Delete";
// import ViewSubAdmin from "./ViewSubAdmin"
// table data
@@ -33,7 +35,7 @@ const managepost: any[] = [
<HStack justifyContent="center">
<ViewManageGroup />
<EditDetailGroups />
<AlertDailog
{/* <AlertDailog
AltertTiggerIcon={() => <Delete />}
alertText="Delete Users"
alertIcon={<Image src={"DeleteIcon"} h={"39px"} />}
@@ -41,7 +43,7 @@ const managepost: any[] = [
onConfirm={() => {
console.log("User deleted:", i + 1);
}}
/>
/> */}
</HStack>
),
})),

12
src/Pages/ManageJobs/ManageJobs.tsx
View File

@@ -1,13 +1,15 @@
import { Box, HStack, Image, Input, Text } from "@chakra-ui/react";
import { Box, HStack,
// Image,
Input, Text } from "@chakra-ui/react";
import { LuSearch } from "react-icons/lu";
// import { RiDeleteBin5Line } from "react-icons/ri";
import AlertDailog from "../../components/AlertDailog";
// import AlertDailog from "../../components/AlertDailog";
import DataTable from "../../components/DataTable";
import MainFrame from "../../components/MainFrame";
import { InputGroup } from "../../components/ui/input-group";
import ManageJobsAdd from "./ManageJobsAdd";
import ViewManageJob from "./ViewManageJob";
import Delete from "../../components/ActionIcons/Delete";
// import Delete from "../../components/ActionIcons/Delete";
// table data
@@ -33,7 +35,7 @@ const managepost: any[] = [
<HStack justifyContent="center">
<ViewManageJob />
<ManageJobsAdd />
<AlertDailog
{/* <AlertDailog
AltertTiggerIcon={() => <Delete />}
alertText="Delete Users"
alertIcon={<Image src={"DeleteIcon"} h={"39px"} />}
@@ -41,7 +43,7 @@ const managepost: any[] = [
onConfirm={() => {
console.log("User deleted:", i + 1);
}}
/>
/> */}
</HStack>
),
})),

12
src/Pages/ManagePost/ManagePost.tsx
View File

@@ -1,14 +1,16 @@
import { Box, HStack, Image, Input, Span, Text } from "@chakra-ui/react";
import { Box, HStack, Image, Input,
// Span,
Text } from "@chakra-ui/react";
import MainFrame from "../../components/MainFrame";
import { InputGroup } from "../../components/ui/input-group";
import { LuSearch } from "react-icons/lu";
import DataTable from "../../components/DataTable";
import AlertDailog from "../../components/AlertDailog";
// import AlertDailog from "../../components/AlertDailog";
import { Switch } from "../../components/ui/switch";
import img from "../../assets/waterfall.jpg";
// import { RiDeleteBin5Line } from "react-icons/ri";
import ViewDailog from "./ViewDailog";
import Delete from "../../components/ActionIcons/Delete";
// import Delete from "../../components/ActionIcons/Delete";
// import ViewDailog from './ViewDailog'
// table data
@@ -46,7 +48,7 @@ const managepost: any[] = [
Action: (
<HStack justifyContent="center">
<ViewDailog />
<AlertDailog
{/* <AlertDailog
AltertTiggerIcon={() => <Span><Delete /> </Span>}
alertText="Delete Users"
alertIcon={<Image src={"DeleteIcon"} h={"39px"} />}
@@ -54,7 +56,7 @@ const managepost: any[] = [
onConfirm={() => {
console.log("User deleted:", i + 1);
}}
/>
/> */}
</HStack>
),
})),

12
src/Pages/ManageUsers/RegisterUsers/RegisterUsers.tsx
View File

@@ -1,6 +1,8 @@
import { Box, HStack, Image, Input, Text } from "@chakra-ui/react";
import { Box, HStack,
// Image,
Input, Text } from "@chakra-ui/react";
import MainFrame from "../../../components/MainFrame";
import AlertDailog from "../../../components/AlertDailog";
// import AlertDailog from "../../../components/AlertDailog";
// import { RiDeleteBin5Line } from "react-icons/ri";
import DataTable from "../../../components/DataTable";
import { Switch } from "../../../components/ui/switch";
@@ -9,7 +11,7 @@ import { LuSearch } from "react-icons/lu";
import ViewRegisterUsers from "./ViewRegisterUsers";
import EditRegisterUsers from "./EditRegisterUsers";
import AddRegisterUsers from "./AddRegisterUsers";
import Delete from "../../../components/ActionIcons/Delete";
// import Delete from "../../../components/ActionIcons/Delete";
const tableHeadRow = [
"Sr. No",
@@ -42,7 +44,7 @@ const registerUser: any[] = [
<ViewRegisterUsers />
<EditRegisterUsers />
{/* <RiDeleteBin5Line style={{ cursor: "pointer" }} /> */}
<AlertDailog
{/* <AlertDailog
AltertTiggerIcon={() =><Delete /> } // Pass as function
alertText="Delete Users"
alertIcon={<Image src={"DeleteIcon"} h={"39px"} />}
@@ -50,7 +52,7 @@ const registerUser: any[] = [
onConfirm={() => {
console.log("User deleted:", i + 1);
}}
/>
/> */}
</HStack>
),
})),

31
src/Pages/MasterModule/TemplateMaster/EditTemplateModel.tsx
View File

@@ -22,10 +22,10 @@ import { Toaster, toaster } from "../../../components/ui/toaster";
import { Template } from "../../../Redux/Service/template.master.service";
import axios from "axios";
// const IMGURL = import.meta.env.VITE_IMG_TEMPLATES
const IMGURL = import.meta.env.VITE_IMG_TEMPLATES
const APIURL = import.meta.env.VITE_API_URL
function EditTemplateModel({ id, localData, refetch }: { id: number, localData: any, refetch:VoidFunction }) {
function EditTemplateModel({ id, localData, refetch }: { id: number, localData: any, refetch: VoidFunction }) {
const [title, setTitle] = useState("");
const [subTitle, setSubTitle] = useState("");
const [userType, setUserType] = useState<number | "">("");
@@ -63,8 +63,8 @@ function EditTemplateModel({ id, localData, refetch }: { id: number, localData:
setUserType(template.principle_type_xid?.toString() || "");
// Convert image URLs to File objects if needed
// const templateImages = template.post_template_image.map((img: any) => `${IMGURL}${img.image_name}`);
// setImages(templateImages);
const templateImages = template.post_template_image.map((img: any) => `${IMGURL}${img.image_name}`);
setImages(templateImages);
setIsOpen(true);
}
@@ -90,7 +90,9 @@ function EditTemplateModel({ id, localData, refetch }: { id: number, localData:
return;
}
if (images.length === 0) {
const newImages = images.filter((image) => image instanceof File);
if (newImages.length === 0) {
toaster.create({
title: "Error",
description: "Please upload at least one image.",
@@ -105,14 +107,8 @@ function EditTemplateModel({ id, localData, refetch }: { id: number, localData:
formData.append("title", title);
formData.append("sub_title", subTitle);
images.forEach((image, index) => {
if (typeof image === "string") {
// Append existing image URLs
formData.append(`existing_images[${index}]`, image);
} else {
// Append new image files
formData.append(`new_images[${index}]`, image, image.name);
}
newImages.forEach((image, index) => {
formData.append(`image_name[${index}]`, image, image.name);
});
try {
@@ -130,7 +126,11 @@ function EditTemplateModel({ id, localData, refetch }: { id: number, localData:
refetch()
} catch (error) {
console.error("Error updating template:", error);
alert("Failed to update template");
toaster.create({
title: "Error",
description: "Failed to update template. Please try again.",
type: "error",
});
}
};
@@ -283,6 +283,9 @@ function EditTemplateModel({ id, localData, refetch }: { id: number, localData:
</Box>
<FiUpload color="#000" />
</Box>
<Box>
</Box>
{/* <Input placeholder="" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" /> */}

156
src/Pages/SubAdmin/SubAdmin.tsx
View File

@@ -3,14 +3,15 @@ import MainFrame from "../../components/MainFrame"
import { InputGroup } from "../../components/ui/input-group"
import { LuSearch } from "react-icons/lu"
import DataTable from "../../components/DataTable"
import AlertDailog from "../../components/AlertDailog"
import AlertDailog from "../../components/AlertDailog";
// import { RiDeleteBin5Line } from "react-icons/ri";
import AddModel from "./AddModel"
import EditSubAdmin from "../../components/EditSubAdmin"
import ViewSubAdmin from "./ViewSubAdmin"
import Delete from "../../components/ActionIcons/Delete"
// import { useGetSubAdminQuery } from "../../Redux/Service/manage.subadmin.service"
// import { useEffect, useState } from "react"
import { useDeleteSubAdminPostMutation, useGetSubAdminQuery } from "../../Redux/Service/manage.subadmin.service"
import { useEffect, useState } from "react"
import { toaster } from "../../components/ui/toaster"
// table data
@@ -25,73 +26,110 @@ const tableHeadRow = [
"Action",
];
const managepost: any[] = [
...Array.from({ length: 12 }, (_, i) => ({
"Sr. No": i + 1,
"Id": 12565,
"First Name": "Kamlesh",
"last Name": "Pandey",
"DOB": "12/01/1987",
"Gender": "Male",
// const managepost: any[] = [
// ...Array.from({ length: 12 }, (_, i) => ({
// "Sr. No": i + 1,
// "Id": 12565,
// "First Name": "Kamlesh",
// "last Name": "Pandey",
// "DOB": "12/01/1987",
// "Gender": "Male",
// "Action": (
// <HStack justifyContent="center">
// <ViewSubAdmin />
// <EditSubAdmin />
// <AlertDailog
// AltertTiggerIcon={() => <Delete />}
// alertText="Delete Users"
// alertIcon={<Image src={"DeleteIcon"} h={"39px"} />}
// alertCaption="are you sure you want to delete ?"
// onConfirm={() => {
// console.log("User deleted:", i + 1);
// }}
// />
// </HStack>
// ),
// })),
// ];
const SubAdmin = () => {
const { data, refetch } = useGetSubAdminQuery()
const [localData, setLocalData] = useState<any[]>([]);
const [deleteModal, setDeleteModal] = useState(false)
const [deleteSubAdminPost] = useDeleteSubAdminPostMutation()
useEffect(() => {
if (data?.data.data) {
setLocalData(data?.data.data);
}
}, [data]);
console.log('localData', localData);
const handleDeleteFaq = async (faqId: number) => {
try {
const response = await deleteSubAdminPost(faqId).unwrap();
if (response.success) {
toaster.create({
title: "Success",
description: "FAQ deleted successfully",
type: "success",
});
refetch()
console.log("FAQ deleted successfully:", response);
}
// Optionally, refetch data or update state after deletion
} catch (error) {
console.error("Error deleting FAQ:", error);
toaster.create({
title: "Error",
description: "Something went wrong",
type: "error",
});
}
};
const formatDateOfBirth = (dob: string): string => {
return new Date(dob).toLocaleDateString("en-GB", {
day: "2-digit",
month: "2-digit",
year: "numeric",
});
};
const managepost = localData?.map((agency: any, index: number) => ({
'id': agency.id,
"Sr. No": index + 1,
"Id": agency.unique_id,
"First Name": agency.first_name,
"last Name": agency.last_name,
"DOB": formatDateOfBirth(agency.date_of_birth),
"Gender": agency.gender,
"Action": (
<HStack justifyContent="center">
<ViewSubAdmin />
<EditSubAdmin />
{/* <EditDetails rowData={{ id: agency.id, question: agency.question, answer: agency.answer }} refetch={refetch} /> */}
<ViewSubAdmin id={agency.id}/>
<EditSubAdmin id={agency.id} refetch={refetch} />
<AlertDailog
AltertTiggerIcon={() => <Delete />}
alertText="Delete Users"
isOpen={deleteModal}
AltertTiggerIcon={() => <Delete onClick={() => setDeleteModal(prev => !prev)} />}
alertText="Delete FAQ"
alertIcon={<Image src={"DeleteIcon"} h={"39px"} />}
alertCaption="are you sure you want to delete ?"
onClose={() => setDeleteModal(false)}
onConfirm={() => {
console.log("User deleted:", i + 1);
// console.log("User deleted:", index + 1);
setDeleteModal(false);
handleDeleteFaq(agency.id)
}}
/>
</HStack>
),
})),
];
const SubAdmin = () => {
// const { data, refetch } = useGetSubAdminQuery()
// const [localData, setLocalData] = useState<any[]>([]);
// useEffect(() => {
// if (data?.data) {
// setLocalData(data?.data);
// }
// }, [data]);
// const managepost = localData?.map((agency: any, index: number) => ({
// 'id': agency.id,
// "Sr. No": index + 1,
// "Id": 12565,
// "First Name": "Kamlesh",
// "last Name": "Pandey",
// "DOB": "12/01/1987",
// "Gender": "Male",
// "Action": (
// <HStack justifyContent="center">
// {/* <EditDetails rowData={{ id: agency.id, question: agency.question, answer: agency.answer }} refetch={refetch} /> */}
// <ViewSubAdmin />
// <EditSubAdmin />
// <AlertDailog
// AltertTiggerIcon={() => <Delete />}
// alertText="Delete Users"
// alertIcon={<Image src={"DeleteIcon"} h={"39px"} />}
// alertCaption="are you sure you want to delete ?"
// onConfirm={() => {
// // console.log("User deleted:", index + 1);
// // handleDeleteFaq(agency.id)
// }}
// />
// </HStack>
// ),
// }));
}));
return (

322
src/Pages/SubAdmin/ViewSubAdmin.tsx
View File

@@ -14,7 +14,6 @@ import {
Grid,
Heading,
Input,
Span,
Stack,
Text,
} from "@chakra-ui/react";
@@ -22,164 +21,195 @@ import { Checkbox } from "../../components/ui/checkbox";
// import { MdOutlineRemoveRedEye } from "react-icons/md";
// import { FaRegEdit } from "react-icons/fa";
import View from "../../components/ActionIcons/View";
import { useGetSubAdminQuery } from "../../Redux/Service/manage.subadmin.service";
function ViewSubAdmin() {
const { data} = useGetSubAdminQuery();
console.log('data', data);
import { Button } from "../../components/ui/button";
import { useLazyViewSubAdminQuery } from "../../Redux/Service/manage.subadmin.service";
function ViewSubAdmin({ id }: { id: number }) {
const [trigger, { data }] = useLazyViewSubAdminQuery();
const handleView = () => {
trigger(id)
}
const viewSubAdmin = data?.data
const formatDateOfBirth = (dob: string): string => {
return new Date(dob).toLocaleDateString("en-GB", {
day: "2-digit",
month: "2-digit",
year: "numeric",
});
};
console.log('data', data?.data);
return (
<DialogRoot placement="center">
<DialogTrigger asChild>
<Span><View /></Span>
<Button
onClick={handleView}
bg={'transparent'}
color={"black"}
>
<View />
</Button>
</DialogTrigger>
<DialogContent
bg={"#fff"}
// w={{ lg: "60%", md: "230px" }}
w={{ base: "90%", md: "400px" }}
height={"80vh"}
overflow={"scroll"}
overflowX="hidden"
p={3} // Reduced padding
bgSize={"md"}
>
<DialogHeader bg="white">
<DialogTitle alignSelf="center" color="black" fontSize="14px">
View Sub Admin Account
</DialogTitle>
</DialogHeader>
{viewSubAdmin?.map((data: any) => (
<DialogContent
bg={"#fff"}
// w={{ lg: "60%", md: "230px" }}
w={{ base: "90%", md: "400px" }}
height={"80vh"}
overflow={"scroll"}
overflowX="hidden"
p={3} // Reduced padding
bgSize={"md"}
>
<DialogHeader bg="white">
<DialogTitle alignSelf="center" color="black" fontSize="14px">
View Sub Admin Account
</DialogTitle>
</DialogHeader>
<DialogBody bg="white">
<Stack py={3}>
<Field.Root>
<Field.Label color="black" pt={1} fontSize="12px">
First Name
</Field.Label>
<Input
value="Priyanka"
bgColor="#EEEEEE"
color="black"
border="none"
pl={1}
fontSize="12px"
height="30px"
readOnly
/>
<DialogBody bg="white">
<Stack py={3}>
<Field.Root>
<Field.Label color="black" pt={1} fontSize="12px">
First Name
</Field.Label>
<Input
value={data.first_name}
bgColor="#EEEEEE"
color="black"
border="none"
pl={1}
fontSize="12px"
height="30px"
readOnly
/>
<Field.Label color="black" pt={1} fontSize="12px">
Last Name
</Field.Label>
<Input
value="Joshi"
bgColor="#EEEEEE"
color="black"
border="none"
pl={1}
fontSize="12px"
height="30px"
readOnly
/>
<Field.Label color="black" pt={1} fontSize="12px">
Last Name
</Field.Label>
<Input
value={data.last_name}
bgColor="#EEEEEE"
color="black"
border="none"
pl={1}
fontSize="12px"
height="30px"
readOnly
/>
<Field.Label color="black" pt={1} fontSize="12px">
ID
</Field.Label>
<Input
value="ID"
bgColor="#EEEEEE"
color="black"
border="none"
pl={1}
fontSize="12px"
height="30px"
readOnly
/>
<Field.Label color="black" pt={1} fontSize="12px">
ID
</Field.Label>
<Input
value={data.unique_id}
bgColor="#EEEEEE"
color="black"
border="none"
pl={1}
fontSize="12px"
height="30px"
readOnly
/>
<Field.Label color="black" pt={1} fontSize="12px">
DOB
</Field.Label>
<Input
value="11/02/1989"
bgColor="#EEEEEE"
color="black"
border="none"
pl={1}
fontSize="12px"
height="30px"
readOnly
/>
<Field.Label color="black" pt={1} fontSize="12px">
DOB
</Field.Label>
<Input
value={formatDateOfBirth(data.date_of_birth)}
bgColor="#EEEEEE"
color="black"
border="none"
pl={1}
fontSize="12px"
height="30px"
readOnly
/>
<Field.Label color="black" pt={1} fontSize="12px">
Gender
</Field.Label>
<Input
value="Male"
bgColor="#EEEEEE"
color="black"
border="none"
pl={1}
fontSize="12px"
height="30px"
readOnly
/>
<Heading mt={5} color={"#000"} fontSize={"sm"}>
Permissions
</Heading>
</Field.Root>
<Grid templateColumns="repeat(2, 1fr)" gap={4}>
<Checkbox size={"sm"} color={"black"}>
<Text fontSize={12}>Dashboard</Text>
</Checkbox>
<Checkbox size={"sm"} color={"black"}>
{" "}
<Text fontSize={12}>Manage contact us</Text>
</Checkbox>
<Checkbox size={"sm"} color={"black"}>
{" "}
<Text fontSize={12}>manage User</Text>
</Checkbox>
<Checkbox size={"sm"} color={"black"}>
{" "}
<Text fontSize={12}>Manage CMS</Text>
</Checkbox>
<Checkbox size={"sm"} color={"black"}>
{" "}
<Text fontSize={12}>Manage Post</Text>
</Checkbox>
<Checkbox size={"sm"} color={"black"}>
{" "}
<Text fontSize={12}>Manage Reports</Text>
</Checkbox>
<Checkbox size={"sm"} color={"black"}>
{" "}
<Text fontSize={12}>manage Sub-Admin</Text>
</Checkbox>
<Checkbox size={"sm"} color={"black"}>
{" "}
<Text fontSize={12}>My profile</Text>
</Checkbox>
<Checkbox size={"sm"} color={"black"}>
<Text fontSize={12}>Manage Jobs</Text>{" "}
</Checkbox>
<Checkbox size={"sm"} color={"black"}>
<Text fontSize={12}> manage feedbacks</Text>
</Checkbox>
<Checkbox size={"sm"} color={"black"}>
<Text fontSize={12}>Manage community</Text>{" "}
</Checkbox>
<Checkbox size={"sm"} color={"black"}>
<Text fontSize={12}> Notification</Text>
</Checkbox>
</Grid>
</Stack>
</DialogBody>
<DialogFooter display="flex" justifyContent="center" pt={"2"}>
{/* <Button w="100%" bg="#02A0A0" color={"#fff"}>
<Field.Label color="black" pt={1} fontSize="12px">
Gender
</Field.Label>
<Input
value={data.gender}
bgColor="#EEEEEE"
color="black"
border="none"
pl={1}
fontSize="12px"
height="30px"
readOnly
/>
<Heading mt={5} color={"#000"} fontSize={"sm"}>
Permissions
</Heading>
</Field.Root>
<Grid templateColumns="repeat(2, 1fr)" gap={4}>
{data.get_resource_action_link.map((check: any) => (
<Checkbox size={"sm"} color={"black"} checked={check.is_active}>
<Text fontSize={12}>{check.app_resource_xid}</Text>
</Checkbox>
// <>
// <Checkbox size={"sm"} color={"black"}>
// <Text fontSize={12}>Dashboard</Text>
// </Checkbox>
// <Checkbox size={"sm"} color={"black"}>
// {" "}
// <Text fontSize={12}>Manage contact us</Text>
// </Checkbox>
// <Checkbox size={"sm"} color={"black"}>
// {" "}
// <Text fontSize={12}>manage User</Text>
// </Checkbox>
// <Checkbox size={"sm"} color={"black"}>
// {" "}
// <Text fontSize={12}>Manage CMS</Text>
// </Checkbox>
// <Checkbox size={"sm"} color={"black"}>
// {" "}
// <Text fontSize={12}>Manage Post</Text>
// </Checkbox>
// <Checkbox size={"sm"} color={"black"}>
// {" "}
// <Text fontSize={12}>Manage Reports</Text>
// </Checkbox>
// <Checkbox size={"sm"} color={"black"}>
// {" "}
// <Text fontSize={12}>manage Sub-Admin</Text>
// </Checkbox>
// <Checkbox size={"sm"} color={"black"}>
// {" "}
// <Text fontSize={12}>My profile</Text>
// </Checkbox>
// <Checkbox size={"sm"} color={"black"}>
// <Text fontSize={12}>Manage Jobs</Text>{" "}
// </Checkbox>
// <Checkbox size={"sm"} color={"black"}>
// <Text fontSize={12}> manage feedbacks</Text>
// </Checkbox>
// <Checkbox size={"sm"} color={"black"}>
// <Text fontSize={12}>Manage community</Text>{" "}
// </Checkbox>
// <Checkbox size={"sm"} color={"black"}>
// <Text fontSize={12}> Notification</Text>
// </Checkbox>
// </>
))}
</Grid>
</Stack>
</DialogBody>
<DialogFooter display="flex" justifyContent="center" pt={"2"}>
{/* <Button w="100%" bg="#02A0A0" color={"#fff"}>
Save
</Button> */}
</DialogFooter>
</DialogFooter>
<DialogCloseTrigger color="black" />
</DialogContent>
<DialogCloseTrigger color="black" />
</DialogContent>
))}
</DialogRoot>
);
}

103
src/Redux/Service/manage.subadmin.service.ts
View File

@@ -1,17 +1,86 @@
import { createApi } from "@reduxjs/toolkit/query/react";
import { baseQueryWithReauth } from "./apiSlice";
export type SubAdminPost = {
id: number;
first_name: string,
last_name: string,
unique_id: string,
date_of_birth: string,
gender: string,
interface PaginationLink {
url: string | null;
label: string;
active: boolean;
}
interface UserData {
id: number;
unique_id: string;
user_name: string;
first_name: string;
last_name: string;
date_of_birth: string;
gender: string;
}
interface PaginatedData {
current_page: number;
data: UserData[];
first_page_url: string;
from: number;
last_page: number;
last_page_url: string;
links: PaginationLink[];
next_page_url: string | null;
path: string;
per_page: number;
prev_page_url: string | null;
to: number;
total: number;
}
interface ApiResponse {
status: string;
status_code: number;
message: string;
data: PaginatedData;
}
// export type SubAdminPost = {
// id: number;
// first_name: string,
// last_name: string,
// unique_id: string,
// date_of_birth: string,
// gender: string,
// }
interface ResourceActionLink {
id: number;
principal_xid: number;
role_xid: number;
app_resource_xid: number;
is_active: boolean;
created_by: number | null;
modified_by: number | null;
deleted_at: string | null;
created_at: string;
updated_at: string;
}
interface SubAdmin {
id: number;
first_name: string;
last_name: string;
unique_id: string;
date_of_birth: string;
gender: string;
get_resource_action_link: ResourceActionLink[];
}
interface SubAdminView {
status: string;
status_code: number;
message: string;
data: SubAdmin[];
}
export const manageSubAdmin = createApi({
reducerPath: "manageSubAdmin",
baseQuery: baseQueryWithReauth, // Use enhanced baseQuery with error handling
@@ -24,12 +93,17 @@ export const manageSubAdmin = createApi({
body: data,
}),
}),
getSubAdmin: builder.query<SubAdminPost[], void>({
getSubAdmin: builder.query<ApiResponse, void>({
query: () => `/sub-admin`
}),
updateFaq: builder.mutation({
viewSubAdmin: builder.query<SubAdminView, number>({
query: (id) => `/sub-admin-view/${id}`
}),
updateSubAdmin: builder.mutation({
query: (updatedData) => ({
url: "/faq-update",
url: "/sub-admin-update",
method: "POST",
body: updatedData,
}),
@@ -43,7 +117,7 @@ export const manageSubAdmin = createApi({
}),
}),
deleteFaqPost: builder.mutation<{ success: boolean }, number>({
deleteSubAdminPost: builder.mutation<{ success: boolean }, number>({
query: (id) => ({
url: `/faq-delete/${id}`,
method: "DELETE",
@@ -54,6 +128,9 @@ export const manageSubAdmin = createApi({
export const {
useGetSubAdminQuery,
useLazyViewSubAdminQuery,
useUpdateSubAdminMutation,
useDeleteSubAdminPostMutation,
} = manageSubAdmin;
export type Post = {

3
src/components/ActionIcons/Delete.tsx
View File

@@ -2,7 +2,7 @@ import { Icon } from "@chakra-ui/react";
import { Tooltip } from "../ui/tooltip";
import { RiDeleteBin5Line } from "react-icons/ri";
const Delete = () => {
const Delete = ({onClick}:{onClick: VoidFunction}) => {
return (
<Tooltip
content="Delete"
@@ -24,6 +24,7 @@ const Delete = () => {
h={"24px"}
w={"24px"}
// color={iconColor && iconColor}
onClick={onClick}
>
<RiDeleteBin5Line />
</Icon>

7
src/components/AlertDailog.tsx
View File

@@ -19,6 +19,8 @@ interface DeleteConfirmationDialogProps {
AltertTiggerIcon?: any;
button?: any;
iconColor?: string;
isOpen: boolean;
onClose: VoidFunction;
}
const AlertDailog: React.FC<DeleteConfirmationDialogProps> = ({
@@ -28,6 +30,8 @@ const AlertDailog: React.FC<DeleteConfirmationDialogProps> = ({
AltertTiggerIcon,
button,
iconColor,
isOpen,
onClose
}) => {
return (
<DialogRoot
@@ -35,6 +39,7 @@ const AlertDailog: React.FC<DeleteConfirmationDialogProps> = ({
motionPreset="slide-in-bottom"
size={"xs"}
role="alertdialog"
open={isOpen}
>
<DialogTrigger asChild>
{button ? (
@@ -97,6 +102,7 @@ const AlertDailog: React.FC<DeleteConfirmationDialogProps> = ({
borderRadius="sm"
border="1px solid black"
size={"xs"}
onClick={onClose}
>
No
</Button>
@@ -120,6 +126,7 @@ const AlertDailog: React.FC<DeleteConfirmationDialogProps> = ({
_hover={{ bg: "#00000010" }}
color={"#000"}
colorPalette={"bg"}
onClick={onClose}
/>
</DialogContent>
</DialogRoot>

179
src/components/EditSubAdmin.tsx
View File

@@ -1,4 +1,4 @@
import { Field, Grid, Heading, Input, Span, Stack, Text } from "@chakra-ui/react";
import { Field, Grid, Heading, Input, Stack, Text } from "@chakra-ui/react";
// import { TbEdit } from "react-icons/tb";
import { Button } from "./ui/button";
import { Checkbox } from "./ui/checkbox";
@@ -13,13 +13,143 @@ import {
DialogTrigger,
} from "./ui/dialog";
import Edit from "./ActionIcons/Edit";
function EditSubAdmin() {
return (
<DialogRoot placement="center">
<DialogTrigger asChild>
{/* <FaRegEdit style={{ cursor: "pointer" }} color="#000" /> */}
import { useLazyViewSubAdminQuery, useUpdateSubAdminMutation } from "../Redux/Service/manage.subadmin.service";
import { useEffect, useState } from "react";
import { toaster } from "./ui/toaster";
<Span><Edit /></Span>
const resourceIdToLabel: { [key: number]: string } = {
1: 'Dashboard',
2: 'Manage contact us',
3: 'Manage User',
4: 'Manage CMS',
5: 'Manage Post',
6: 'Manage Reports',
7: 'Manage Sub-Admin',
8: 'My profile',
9: 'Manage Jobs',
10: 'Manage feedbacks',
11: 'Manage community',
12: 'Notification',
};
interface ResourceActionLink {
id: number;
app_resource_xid: number;
is_active: boolean;
}
function EditSubAdmin({ id, refetch }: { id: number, refetch: VoidFunction }) {
const [trigger, { data }] = useLazyViewSubAdminQuery();
const [updateSubAdmin] = useUpdateSubAdminMutation()
const [isOpen, setIsOpen] = useState(false);
const [editData, setEditData] = useState<{
id: string;
unique_id?: string,
first_name: string;
last_name: string;
date_of_birth: string;
gender?: string,
permission: ResourceActionLink[];
}>({
id: '',
unique_id: '',
first_name: '',
last_name: '',
date_of_birth: '',
gender: '',
permission: [],
})
useEffect(() => {
if (data?.data && data.data.length > 0) {
const subAdmin = data.data[0]; // Extract the first item from the array
// Map the API response to editData
setEditData({
id: subAdmin.id.toString(),
unique_id: subAdmin.unique_id,
first_name: subAdmin.first_name,
last_name: subAdmin.last_name,
date_of_birth: formatDateOfBirth(subAdmin.date_of_birth),
gender: subAdmin.gender,
permission: subAdmin.get_resource_action_link,
});
}
}, [data]);
const formatDateOfBirth = (dob: string): string => {
// Convert the date to the desired format with slashes
const formattedDate = new Date(dob).toLocaleDateString("en-GB", {
day: "2-digit",
month: "2-digit",
year: "numeric",
});
// Replace slashes with hyphens
return formattedDate.replace(/\//g, '-');
};
const handleOpenModal = () => {
trigger(id)
setIsOpen(true);
};
const handleCheckboxToggle = (permissionId: number) => {
setEditData((prevData) => ({
...prevData,
permission: prevData.permission.map((permission) =>
permission.id === permissionId
? { ...permission, is_active: !permission.is_active }
: permission
),
}));
};
const handleSubmit = async () => {
console.log('Updated Data:', editData);
// Call your API here with the updated editData
const payload = {
id: Number(editData.id),
unique_id: editData.unique_id,
first_name: editData.first_name,
last_name: editData.last_name,
date_of_birth: editData.date_of_birth,
gender: editData.gender,
permission: editData.permission
};
try {
const response = await updateSubAdmin(payload).unwrap();
if (response?.status === "success") {
toaster.create({
title: "Success",
description: "FAQ updated successfully",
type: "success",
});
refetch()
setIsOpen(false);
} else {
toaster.create({
title: "Error",
description: "Failed to update FAQ",
type: "error",
});
}
} catch (error) {
console.error("Error updating template:", error);
// alert("Failed to update template");
}
};
return (
<DialogRoot placement="center" open={isOpen} onOpenChange={({ open }) => setIsOpen(open)}>
<DialogTrigger asChild>
{/* <FaRegEdit style={{ cursor: "pointer" }} color="#000" /> */}
<Button bg="transparent" color={"black"} h={"18px"} onClick={handleOpenModal}><Edit /></Button>
{/* <Button><FaRegEdit /></Button> */}
</DialogTrigger>
@@ -42,7 +172,7 @@ function EditSubAdmin() {
<Stack py={3}>
<Field.Root>
<Field.Label color="black" pt={1} fontSize="12px">
First Name
ID
</Field.Label>
<Input
placeholder="Enter the First Name"
@@ -52,7 +182,10 @@ function EditSubAdmin() {
pl={1}
fontSize="12px"
height="30px"
value={editData.unique_id}
onChange={(e) => setEditData({ ...editData, unique_id: e.target.value })}
/>
<Field.Label color="black" pt={1} fontSize="12px">
First Name
</Field.Label>
@@ -64,6 +197,8 @@ function EditSubAdmin() {
pl={1}
fontSize="12px"
height="30px"
value={editData.first_name}
onChange={(e) => setEditData({ ...editData, first_name: e.target.value })}
/>
<Field.Label color="black" pt={1} fontSize="12px">
Last Name
@@ -76,6 +211,8 @@ function EditSubAdmin() {
pl={1}
fontSize="12px"
height="30px"
value={editData.last_name}
onChange={(e) => setEditData({ ...editData, last_name: e.target.value })}
/>
<Field.Label color="black" pt={1} fontSize="12px">
@@ -89,6 +226,8 @@ function EditSubAdmin() {
pl={1}
fontSize="12px"
height="30px"
value={editData.date_of_birth}
onChange={(e) => setEditData({ ...editData, date_of_birth: e.target.value })}
/>
<Field.Label color="black" pt={1} fontSize="12px">
@@ -102,12 +241,14 @@ function EditSubAdmin() {
pl={1}
fontSize="12px"
height="30px"
value={editData.gender}
onChange={(e) => setEditData({ ...editData, gender: e.target.value })}
/>
<Heading mt={5} color={"#000"} fontSize={"sm"}>
Permissions
</Heading>
</Field.Root>
<Grid templateColumns="repeat(2, 1fr)" gap={4}>
{/* <Grid templateColumns="repeat(2, 1fr)" gap={4}>
<Checkbox size={"sm"} color={"black"}>
<Text fontSize={12}>Dashboard</Text>
</Checkbox>
@@ -144,15 +285,31 @@ function EditSubAdmin() {
<Checkbox size={"sm"} color={"black"}>
<Text fontSize={12}> Notification</Text>
</Checkbox>
</Grid> */}
<Grid templateColumns="repeat(2, 1fr)" gap={4}>
{editData.permission.map((permission) => {
const label = resourceIdToLabel[permission.app_resource_xid];
return (
<Checkbox
key={permission.id}
size="sm"
color="black"
checked={permission.is_active}
onChange={() => handleCheckboxToggle(permission.id)}
>
<Text fontSize={12}>{label}</Text>
</Checkbox>
);
})}
</Grid>
</Stack>
</DialogBody>
<DialogFooter display="flex" justifyContent="center" pt={"2"}>
<Button size={"xs"} w="100%" bg="#02A0A0" color={"#fff"}>
<Button size={"xs"} w="100%" bg="#02A0A0" color={"#fff"} onClick={handleSubmit}>
Save
</Button>
</DialogFooter>
<DialogCloseTrigger color="black" />
<DialogCloseTrigger color="black" onClick={() => setIsOpen(false)} />
</DialogContent>
</DialogRoot>
);