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

Fixed pagination and Master module country updated

Browse Source
This commit is contained in:
rockyeverlast
2025-04-10 20:13:14 +05:30
parent 8acc9430b3
commit a1781ade46
18 changed files with 771 additions and 282 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/Pages/MasterModule/AgencyMaster/AgencyMaster.tsx
View File

@@ -47,7 +47,8 @@ const tableHeadRow = [
// ];
const AgencyMaster = () => {
const { data, refetch } = useGetAgencyMasterQuery()
const [currentPage, setCurrentPage] = useState(1);
const { data, refetch } = useGetAgencyMasterQuery(currentPage)
const [agencyMasterToggle] = useAgencyMasterToggleMutation()
const [localData, setLocalData] = useState<any[]>([]);
const [searchTerm, setSearchTerm] = useState("");
@@ -72,13 +73,17 @@ const AgencyMaster = () => {
}
};
const handlePageChange = (page: number) => {
setCurrentPage(page);
};
const filteredData = localData?.filter((agency) =>
agency?.name.toLowerCase().includes(searchTerm.toLowerCase())
);
const managepost = filteredData?.map((agency: any, index: number) => ({
'id': agency.id,
"Sr. No": index + 1,
"Sr. No": (currentPage - 1) * (data?.data.per_page ?? 0) + index + 1,
"Agency Name": agency.name,
"RC no.": agency.rc_number,
"State": agency.state,
@@ -162,8 +167,13 @@ const AgencyMaster = () => {
sortableColumns={["Name", "Registration Date "]}
tableHeadRow={tableHeadRow}
data={managepost || []}
paginationData={data?.data.data}
refetch={refetch}
paginationData={{
current_page: data?.data.current_page || 1,
last_page: data?.data.last_page || 1,
per_page: data?.data.per_page || 10,
total: data?.data.total || 0
}}
onPageChange={handlePageChange}
/>
</Box>
</MainFrame>

113
src/Pages/MasterModule/Country/Country.tsx
View File

@@ -1,11 +1,12 @@
import { Box, HStack, Input, Text } from "@chakra-ui/react";
import { Box, HStack, 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 { Switch } from "../../../components/ui/switch";
import CountryAddModel from "./CountryAddModel";
import EditCountryModel from "./EditCountryModel";
import { CountryData, useCountryToggleMutation, useGetCountryMasterQuery } from "../../../Redux/Service/country.master";
import { useEffect, useState } from "react";
import SearchComponent from "../../../components/SearchComponent";
@@ -15,25 +16,89 @@ const tableHeadRow = [
"Sr. No",
"Title",
"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",
// "Action": (
// <HStack justifyContent="center">
// <EditCountryModel />
// <Box>
// <Switch colorPalette={'teal'} size={"xs"} />
// </Box>
// </HStack>
// ),
// })),
// ];
const Country = () => {
const [currentPage, setCurrentPage] = useState(1);
const { data, refetch } = useGetCountryMasterQuery(currentPage)
const [countryToggle] = useCountryToggleMutation()
const [localData, setLocalData] = useState<any[]>([]);
const [searchTerm, setSearchTerm] = useState("");
console.log("Country Data", data?.data.data)
useEffect(() => {
if (data) {
setLocalData(data?.data.data);
}
}, [data]);
const handlePageChange = (page: number) => {
setCurrentPage(page);
};
const filteredData = localData?.filter((agency) => {
const searchLower = searchTerm.toLowerCase();
const countryName = agency.en_name?.toLowerCase().includes(searchLower);
const capitalName = agency.capital?.toLowerCase().includes(searchLower);
return countryName || capitalName;
});
const handleToggle = async (agencyId: number, currentStatus: string) => {
const newStatus = currentStatus === '1' ? '0' : '1';
setLocalData((prevData) =>
prevData.map((agency) =>
agency.id === agencyId ? { ...agency, is_active: newStatus } : agency
)
);
try {
await countryToggle({ 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 = filteredData?.flatMap((agency: CountryData, index: number) => ({
"Sr. No": (currentPage - 1) * (data?.data.per_page ?? 0) + index + 1,
"Title": agency.en_name,
"Action": (
<HStack justifyContent="center">
<EditCountryModel />
<EditCountryModel rowData={{ id: agency.id, en_name: agency.en_name, country_code: agency.country_code, phonecode: agency.phonecode, capital: agency.capital, currency: agency.currency, currency_name: agency.currency_name, currency_symbol: agency.currency_symbol }} refetch={refetch} />
<Box>
<Switch colorPalette={'teal'} size={"xs"}/>
<Switch
colorPalette={'teal'}
size={"xs"}
checked={agency.is_active === '1'}
onChange={() => handleToggle(agency.id, agency.is_active)}
/>
</Box>
</HStack>
),
})),
];
}))
const Country = () => {
return (
<MainFrame>
@@ -46,11 +111,11 @@ const Country = () => {
px={3}
>
<Text as={"span"} fontSize={"sm"} fontWeight={500} color={"#000"}>
Country
Country
</Text>
<HStack >
<InputGroup
{/* <InputGroup
startElement={
<LuSearch fontSize={"xs"} style={{ position: 'relative', left: '10px' }} />
}
@@ -69,7 +134,14 @@ const Country = () => {
bgColor={'#EEEEEE'}
ps={8}
/>
</InputGroup>
</InputGroup> */}
<SearchComponent
value={searchTerm}
onChange={(value) => {
setSearchTerm(value);
setCurrentPage(1);
}}
/>
{/* <Button bgColor={'#EEEEEE'} pl={3} pr={3}><IoMdAdd /> <Text>Add</Text></Button> */}
<CountryAddModel />
</HStack>
@@ -78,8 +150,15 @@ const Country = () => {
sortableColumns={["Name", "Registration Date "]}
tableHeadRow={tableHeadRow}
data={managepost}
paginationData={{
current_page: data?.data.current_page || 1,
last_page: data?.data.last_page || 1,
per_page: data?.data.per_page || 10,
total: data?.data.total || 0
}}
onPageChange={handlePageChange}
/>
</Box>
</Box>
</MainFrame>
)
}

230
src/Pages/MasterModule/Country/CountryAddModel.tsx
View File

@@ -2,55 +2,201 @@ import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHead
import { Field, Input, Stack, Text } from "@chakra-ui/react"
import { IoMdAdd } from "react-icons/io"
import { Button } from "../../../components/ui/button"
import { useState } from "react";
import { PostCountry, useCreateCountryPostMutation } from "../../../Redux/Service/country.master";
import { Toaster, toaster } from "../../../components/ui/toaster";
function CountryAddModel() {
return (
const [createCountryPost] = useCreateCountryPostMutation()
const [isOpen, setIsOpen] = useState(false);
const [countryName, setCountryName] = useState<PostCountry>({
en_name: '',
country_code: '',
phonecode: '',
capital: '',
currency: '',
currency_name: '',
currency_symbol: '',
});
<DialogRoot placement="center">
<DialogTrigger asChild>
{/* <Button bg={"transparent"} size="sm">
const handleOpenModal = () => {
setIsOpen(true); // Open modal when clicking "Add"
};
const handleSubmit = async () => {
if (countryName.en_name === "") {
toaster.create({
title: "Error",
description: "Input fields cannot be empty",
type: "error",
});
return;
}
const payload: PostCountry = {
en_name: countryName.en_name,
country_code: countryName.country_code,
phonecode: countryName.phonecode,
capital: countryName.capital,
currency: countryName.currency,
currency_name: countryName.currency_name,
currency_symbol: countryName.currency_symbol,
};
try {
const response = await createCountryPost(payload).unwrap();
if (response) {
toaster.create({
title: "Success",
description: "Country added successfully",
type: "success",
});
setIsOpen(false);
} else {
toaster.create({
title: "Error",
description: "Failed to add Country",
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>
{/* <Button bg={"transparent"} size="sm">
<MdOutlineRemoveRedEye style={{ cursor: "pointer", fontSize: "16px" }} />
</Button> */}
<Button px={5} size={"xs"} bg={"#02A0A0"}>
<IoMdAdd /> <Text>Add</Text>
</Button>
</DialogTrigger>
<DialogContent
bg={"#fff"}
// w={{ lg: "60%", md: "230px" }}
w={{ base: '90%', md: '400px' }}
height={'auto'}
overflowX="hidden"
p={3} // Reduced padding
bgSize={'md'}
>
<DialogHeader bg="white" >
<DialogTitle alignSelf="center" color="black" fontSize="14px">Add</DialogTitle>
</DialogHeader>
<DialogBody bg="white">
<Stack py={3}>
<Field.Root>
<Field.Label color="black" pt={1} fontSize="12px">Country</Field.Label>
<Input placeholder="" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
</Field.Root>
</Stack>
</DialogBody>
<DialogFooter display="flex" justifyContent="center" pt={"2"}>
<Button w="100%" bg="#02A0A0" color={"#fff"}>
Save
<Button px={5} size={"xs"} bg={"#02A0A0"} onClick={handleOpenModal}>
<IoMdAdd /> <Text>Add</Text>
</Button>
</DialogFooter>
<DialogCloseTrigger color="black" />
</DialogContent>
</DialogRoot >
</DialogTrigger>
<DialogContent
bg={"#fff"}
// w={{ lg: "60%", md: "230px" }}
w={{ base: '90%', md: '400px' }}
height={'auto'}
overflowX="hidden"
p={3} // Reduced padding
bgSize={'md'}
>
<DialogHeader bg="white" >
<DialogTitle alignSelf="center" color="black" fontSize="14px">Add</DialogTitle>
</DialogHeader>
<DialogBody bg="white">
<Stack py={3}>
<Field.Root>
<Field.Label color="black" pt={1} fontSize="12px">Country</Field.Label>
<Input
placeholder=""
bgColor="#EEEEEE"
color="black"
border="none"
pl={1}
fontSize="12px"
height="30px"
value={countryName.en_name}
onChange={(e) => setCountryName({ ...countryName, en_name: e.target.value })}
/>
<Field.Label color="black" pt={1} fontSize="12px">Country Code</Field.Label>
<Input
placeholder=""
bgColor="#EEEEEE"
color="black"
border="none"
pl={1}
fontSize="12px"
height="30px"
value={countryName.country_code}
onChange={(e) => setCountryName({ ...countryName, country_code: e.target.value })}
/>
<Field.Label color="black" pt={1} fontSize="12px">Phone Code</Field.Label>
<Input
placeholder=""
bgColor="#EEEEEE"
color="black"
border="none"
pl={1}
fontSize="12px"
height="30px"
value={countryName.phonecode}
onChange={(e) => setCountryName({ ...countryName, phonecode: e.target.value })}
/>
<Field.Label color="black" pt={1} fontSize="12px">Capital</Field.Label>
<Input
placeholder=""
bgColor="#EEEEEE"
color="black"
border="none"
pl={1}
fontSize="12px"
height="30px"
value={countryName.capital}
onChange={(e) => setCountryName({ ...countryName, capital: e.target.value })}
/>
<Field.Label color="black" pt={1} fontSize="12px">Currency</Field.Label>
<Input
placeholder=""
bgColor="#EEEEEE"
color="black"
border="none"
pl={1}
fontSize="12px"
height="30px"
value={countryName.currency}
onChange={(e) => setCountryName({ ...countryName, currency: e.target.value })}
/>
<Field.Label color="black" pt={1} fontSize="12px">Currency name</Field.Label>
<Input
placeholder=""
bgColor="#EEEEEE"
color="black"
border="none"
pl={1}
fontSize="12px"
height="30px"
value={countryName.currency_name}
onChange={(e) => setCountryName({ ...countryName, currency_name: e.target.value })}
/>
<Field.Label color="black" pt={1} fontSize="12px">Currency Symbol</Field.Label>
<Input
placeholder=""
bgColor="#EEEEEE"
color="black"
border="none"
pl={1}
fontSize="12px"
height="30px"
value={countryName.currency_symbol}
onChange={(e) => setCountryName({ ...countryName, currency_symbol: e.target.value })}
/>
</Field.Root>
</Stack>
</DialogBody>
<DialogFooter display="flex" justifyContent="center" pt={"2"}>
<Button w="100%" bg="#02A0A0" color={"#fff"} onClick={handleSubmit}>
Save
</Button>
</DialogFooter>
<DialogCloseTrigger color="black" />
</DialogContent>
</DialogRoot >
<Toaster />
</>
)
}

188
src/Pages/MasterModule/Country/EditCountryModel.tsx
View File

@@ -8,59 +8,153 @@ import {
DialogTitle,
DialogTrigger,
} from "../../../components/ui/dialog";
import { Field, Input, Span, Stack } from "@chakra-ui/react";
import { Field, Input, Stack } from "@chakra-ui/react";
import { Button } from "../../../components/ui/button";
import Edit from "../../../components/ActionIcons/Edit";
import { useUpdateCountryMutation } from "../../../Redux/Service/country.master";
import { Toaster, toaster } from "../../../components/ui/toaster";
import { useEffect, useState } from "react";
export interface EditCountryModelProps {
id?: number;
en_name?: string;
hi_name?: string;
mr_name?: string;
te_name?: string;
ta_name?: string;
bn_name?: string;
or_name?: string;
country_code?: string;
phonecode?: string;
capital?: string;
currency?: string;
currency_name?: string;
currency_symbol?: string;
}
function EditCountryModel({ rowData, refetch }: { rowData: EditCountryModelProps, refetch: VoidFunction }) {
const [updateCountry] = useUpdateCountryMutation()
const [editData, setEditData] = useState(rowData)
const [isOpen, setIsOpen] = useState(false);
useEffect(() => {
if(rowData){
setEditData(rowData)
}
}, [rowData])
const handleOpenModal = () => {
setIsOpen(true);
};
const handleSubmit = async () => {
if (editData?.en_name === '') {
toaster.create({
title: "Error",
description: "Input fields cannot be empty",
type: "error",
});
return;
}
// Only en_name is editable, so we only need to send that in the payload.
const payload = {
id: rowData?.id,
en_name: editData?.en_name,
country_code: rowData?.country_code,
phonecode: rowData?.phonecode,
capital: rowData?.capital,
currency: rowData?.currency,
currency_name: rowData?.currency_name,
currency_symbol: rowData?.currency_symbol,
};
// console.log('payload', payload)
try {
const response = await updateCountry(payload).unwrap();
if (response?.status === "success") {
toaster.create({
title: "Success",
description: "Country updated successfully",
type: "success",
});
setIsOpen(false);
refetch()
} else {
toaster.create({
title: "Error",
description: "Failed to update Country",
type: "error",
});
}
} catch (error) {
console.error("Error updating template:", error);
// alert("Failed to update template");
toaster.create({
title: "Error",
description: "Something went wrong",
type: "error",
});
}
};
function EditCountryModel() {
return (
<DialogRoot placement="center">
<DialogTrigger asChild>
<Span><Edit /></Span>
</DialogTrigger>
<>
<DialogRoot placement="center" key={editData.id} open={isOpen} onOpenChange={({ open }) => setIsOpen(open)}>
<DialogTrigger asChild>
<Button bg="transparent" color={"black"} h={"18px"} onClick={handleOpenModal}><Edit /></Button>
</DialogTrigger>
<DialogContent
bg={"#fff"}
// w={{ lg: "60%", md: "230px" }}
w={{ base: "90%", md: "400px" }}
height={"auto"}
overflowX="hidden"
p={3} // Reduced padding
bgSize={"md"}
>
<DialogHeader bg="white">
<DialogTitle alignSelf="center" color="black" fontSize="14px">
Edit
</DialogTitle>
</DialogHeader>
<DialogContent
bg={"#fff"}
// w={{ lg: "60%", md: "230px" }}
w={{ base: "90%", md: "400px" }}
height={"auto"}
overflowX="hidden"
p={3} // Reduced padding
bgSize={"md"}
>
<DialogHeader bg="white">
<DialogTitle alignSelf="center" color="black" fontSize="14px">
Edit
</DialogTitle>
</DialogHeader>
<DialogBody bg="white">
<Stack py={3}>
<Field.Root>
<Field.Label color="black" pt={1} fontSize="12px">
Country
</Field.Label>
<Input
value={editData.en_name}
onChange={(e) => setEditData({ ...editData, en_name: e.target.value })}
bgColor="#EEEEEE"
color="black"
border="none"
pl={1}
fontSize="12px"
height="30px"
/>
</Field.Root>
</Stack>
</DialogBody>
<DialogFooter display="flex" justifyContent="center" pt={"2"}>
<Button w="100%" bg="#02A0A0" color={"#fff"} onClick={handleSubmit}>
Save
</Button>
</DialogFooter>
<DialogBody bg="white">
<Stack py={3}>
<Field.Root>
<Field.Label color="black" pt={1} fontSize="12px">
Country
</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"}>
<Button w="100%" bg="#02A0A0" color={"#fff"}>
Save
</Button>
</DialogFooter>
<DialogCloseTrigger color="black" />
</DialogContent>
</DialogRoot>
<DialogCloseTrigger color="black" />
</DialogContent>
</DialogRoot>
<Toaster />
</>
);
}

73
src/Pages/MasterModule/IndustryMaster/IndustryMasterList.tsx
View File

@@ -1,13 +1,14 @@
import { Box, HStack, Input, Text } from "@chakra-ui/react";
import { Box, HStack, Text } from "@chakra-ui/react";
import MainFrame from "../../../components/MainFrame"
import { InputGroup } from "../../../components/ui/input-group";
import { LuSearch } from "react-icons/lu";
// 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 { useEffect, useState } from "react";
import { useGetIndustryMasterQuery, useIndustryMasterToggleMutation } from "../../../Redux/Service/industry.master.service";
import EditIndustryMaster from "./EditIndustryMaster";
import AddIndustryMaster from "./AddIndustryMaster";
import SearchComponent from "../../../components/SearchComponent";
// table data
@@ -42,9 +43,11 @@ const tableHeadRow = [
// ];
const IndustryMasterList = () => {
const { data, refetch } = useGetIndustryMasterQuery()
const [currentPage, setCurrentPage] = useState(1);
const { data, refetch } = useGetIndustryMasterQuery(currentPage)
const [industryMasterToggle] = useIndustryMasterToggleMutation()
const [localData, setLocalData] = useState<any[]>([]);
const [searchTerm, setSearchTerm] = useState("");
useEffect(() => {
if (data?.data?.data) {
@@ -52,6 +55,10 @@ const IndustryMasterList = () => {
}
}, [data]);
const handlePageChange = (page: number) => {
setCurrentPage(page);
};
const handleToggle = async (agencyId: string, currentStatus: number) => {
const newStatus = currentStatus ? 0 : 1;
setLocalData((prevData) =>
@@ -72,9 +79,15 @@ const IndustryMasterList = () => {
}
};
const managepost = localData?.map((agency: any, index: number) => ({
const filteredData = localData?.filter((agency) => {
const searchLower = searchTerm.toLowerCase();
const title = agency.en_name?.toLowerCase().includes(searchLower);
return title;
});
const managepost = filteredData?.map((agency: any, index: number) => ({
'id': agency.id,
"Sr. No": index + 1,
"Sr. No": (currentPage - 1) * (data?.data.per_page ?? 0) + index + 1,
"Title": agency.en_name,
"is_active": agency.is_active,
"Action": (
@@ -93,11 +106,11 @@ const IndustryMasterList = () => {
),
}));
useEffect(() => {
console.log("Fetched data:", data);
console.log("Local data:", localData);
console.log("Managepost data:", managepost);
}, [data, localData, managepost]);
// useEffect(() => {
// console.log("Fetched data:", data);
// console.log("Local data:", localData);
// console.log("Managepost data:", managepost);
// }, [data, localData, managepost]);
return (
@@ -115,37 +128,29 @@ const IndustryMasterList = () => {
</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={"sm"}
placeholder="Search..."
bgColor={'#EEEEEE'}
ps={8}
/>
</InputGroup>
<SearchComponent
value={searchTerm}
onChange={(value) => {
setSearchTerm(value);
setCurrentPage(1);
}}
/>
{/* <Button bgColor={'#EEEEEE'} pl={3} pr={3}><IoMdAdd /> <Text>Add</Text></Button> */}
{/* <ViewAgencyAddModel /> */}
<AddIndustryMaster refetch={refetch}/>
<AddIndustryMaster refetch={refetch} />
</HStack>
</HStack>
<DataTable
sortableColumns={["Name"]}
tableHeadRow={tableHeadRow}
data={managepost || []}
paginationData={data?.data}
refetch={refetch}
paginationData={{
current_page: data?.data.current_page || 1,
last_page: data?.data.last_page || 1,
per_page: data?.data.per_page || 10,
total: data?.data.total || 0
}}
onPageChange={handlePageChange}
/>
</Box>
</MainFrame>

61
src/Pages/MasterModule/JobType/JobType.tsx
View File

@@ -1,13 +1,14 @@
import { Box, HStack, Input, Text } from "@chakra-ui/react";
import { Box, HStack, Text } from "@chakra-ui/react";
import MainFrame from "../../../components/MainFrame"
import { InputGroup } from "../../../components/ui/input-group";
import { LuSearch } from "react-icons/lu";
// 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 JobAddModel from "./JobAddModel";
import EditJobeModel from "./EditJobModel";
import { JobTypeData, useGetJobTypeQuery } from "../../../Redux/Service/job.type.service";
import { useEffect, useState } from "react";
import SearchComponent from "../../../components/SearchComponent";
@@ -36,8 +37,10 @@ const tableHeadRow = [
// ];
const JobType = () => {
const { data, refetch } = useGetJobTypeQuery()
const [currentPage, setCurrentPage] = useState(1);
const { data, refetch } = useGetJobTypeQuery(currentPage)
const [localData, setLocalData] = useState<any[]>([]);
const [searchTerm, setSearchTerm] = useState("");
// const [templateMasterToggle] = useTemplateMasterToggleMutation()
console.log('DATA', data?.data.data);
@@ -48,6 +51,16 @@ const JobType = () => {
}
}, [data]);
const handlePageChange = (page: number) => {
setCurrentPage(page);
};
const filteredData = localData?.filter((agency) => {
const searchLower = searchTerm.toLowerCase();
const title = agency.en_name?.toLowerCase().includes(searchLower);
return title;
});
// const handleToggle = async (agencyId: string, currentStatus: number) => {
// const newStatus = currentStatus ? 0 : 1;
// setLocalData((prevData) =>
@@ -69,8 +82,8 @@ const JobType = () => {
// };
const managepost = localData?.map((agency: JobTypeData, index: number) => ({
'id': agency.id,
const managepost = filteredData?.map((agency: JobTypeData, index: number) => ({
'id': (currentPage - 1) * (data?.data.per_page ?? 0) + index + 1,
"Sr. No": index + 1,
"Title": agency.en_name,
@@ -106,26 +119,13 @@ const JobType = () => {
</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={"sm"}
placeholder="Search..."
bgColor={'#EEEEEE'}
ps={8}
/>
</InputGroup>
<SearchComponent
value={searchTerm}
onChange={(value) => {
setSearchTerm(value);
setCurrentPage(1);
}}
/>
{/* <Button bgColor={'#EEEEEE'} pl={3} pr={3}><IoMdAdd /> <Text>Add</Text></Button> */}
<JobAddModel refetch={refetch} />
</HStack>
@@ -134,8 +134,13 @@ const JobType = () => {
sortableColumns={["Name", "Registration Date "]}
tableHeadRow={tableHeadRow}
data={managepost}
paginationData={data?.data}
refetch={refetch}
paginationData={{
current_page: data?.data.current_page || 1,
last_page: data?.data.last_page || 1,
per_page: data?.data.per_page || 10,
total: data?.data.total || 0
}}
onPageChange={handlePageChange}
/>
</Box>
</MainFrame>

18
src/Pages/MasterModule/TemplateMaster/TemplateMaster.tsx
View File

@@ -45,7 +45,8 @@ const tableHeadRow = [
// ];
const TemplateMaster = () => {
const { data, refetch } = useGetTemplateMasterQuery()
const [currentPage, setCurrentPage] = useState(1);
const { data, refetch } = useGetTemplateMasterQuery(currentPage)
const [localData, setLocalData] = useState<any[]>([]);
const [templateMasterToggle] = useTemplateMasterToggleMutation();
const [searchTerm, setSearchTerm] = useState("");
@@ -57,6 +58,10 @@ const TemplateMaster = () => {
}
}, [data]);
const handlePageChange = (page: number) => {
setCurrentPage(page);
};
const handleToggle = async (agencyId: string, currentStatus: number) => {
const newStatus = currentStatus ? 0 : 1;
setLocalData((prevData) =>
@@ -83,7 +88,7 @@ const TemplateMaster = () => {
const managepost = filteredData?.map((agency: Template, index: number) => ({
'id': agency.id,
"Sr. No": index + 1,
"Sr. No": (currentPage - 1) * (data?.data.per_page ?? 0) + index + 1,
"Title": agency.post_template_translate.length > 0
? agency.post_template_translate[0].title
: "N/A",
@@ -160,8 +165,13 @@ const TemplateMaster = () => {
sortableColumns={["Name", "Registration Date "]}
tableHeadRow={tableHeadRow}
data={managepost}
paginationData={data?.data.data}
refetch={refetch}
paginationData={{
current_page: data?.data.current_page || 1,
last_page: data?.data.last_page || 1,
per_page: data?.data.per_page || 10,
total: data?.data.total || 0
}}
onPageChange={handlePageChange}
/>
</Box>
</MainFrame>