"Added src/components/ViewDailog.tsx"
This commit is contained in:
YasinShaikh123
67
src/Pages/ManageGroups/AddGroup.tsx
Normal file
67
src/Pages/ManageGroups/AddGroup.tsx
Normal file
@@ -0,0 +1,67 @@
|
||||
import { Button } from "../../components/ui/button"
|
||||
import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog"
|
||||
import { Avatar, Box, Field, Heading, Input, Stack, Text } from "@chakra-ui/react"
|
||||
import { Switch } from "../../components/ui/switch";
|
||||
import { IoMdAdd } from "react-icons/io";
|
||||
function AddGroup() {
|
||||
return (
|
||||
|
||||
<DialogRoot placement="center" >
|
||||
<DialogTrigger asChild>
|
||||
<Button bgColor={'#EEEEEE'} pl={3} pr={3} size={'xs'} color={'#000'}><IoMdAdd /> <Text>Add</Text></Button>
|
||||
|
||||
</DialogTrigger>
|
||||
|
||||
<DialogContent
|
||||
bg={"#fff"}
|
||||
// w={{ lg: "60%", md: "230px" }}
|
||||
w={{ base: '90%', md: '400px' }}
|
||||
|
||||
|
||||
// height={'80vh'}
|
||||
overflow={'scroll'}
|
||||
p={2} // Reduced padding
|
||||
bgSize={'md'}
|
||||
>
|
||||
<DialogHeader bg="white" pt={1} pb={2}>
|
||||
<DialogTitle alignSelf="center" color="black" fontSize="14px">Add</DialogTitle>
|
||||
</DialogHeader>
|
||||
|
||||
<DialogBody bg="white">
|
||||
<Stack p={2} >
|
||||
|
||||
<Field.Root>
|
||||
<Field.Label color="black" pt={1} fontSize="xs">Group Name</Field.Label>
|
||||
<Input bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
|
||||
<Field.Label color="black" pt={1} fontSize="xs">Group Introduction</Field.Label>
|
||||
<Input bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
</Field.Root>
|
||||
|
||||
<Button w="30%" size={'xs'} bg="#02A0A0" mt={3} color={"#fff"}>
|
||||
Add Member
|
||||
</Button>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<Heading color="black" pt={1} fontSize="12px">public/Private</Heading>
|
||||
<Switch />
|
||||
</Stack>
|
||||
</DialogBody>
|
||||
<DialogFooter display="flex" justifyContent="center">
|
||||
<Button w="100%" bg="#02A0A0" color={"#fff"}>
|
||||
Save
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
<DialogCloseTrigger color="black" />
|
||||
</DialogContent>
|
||||
</DialogRoot >
|
||||
|
||||
)
|
||||
}
|
||||
|
||||
export default AddGroup
|
||||
85
src/Pages/ManageGroups/EditDetailGroup.tsx
Normal file
85
src/Pages/ManageGroups/EditDetailGroup.tsx
Normal file
@@ -0,0 +1,85 @@
|
||||
import { Button } from "../../components/ui/button"
|
||||
import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog"
|
||||
import { Avatar, Box, Field, Heading, Input, Stack, Text } from "@chakra-ui/react"
|
||||
import { Switch } from "../../components/ui/switch";
|
||||
import { FaRegEdit } from "react-icons/fa";
|
||||
import { AvatarGroup } from "../../components/ui/avatar";
|
||||
function EditDetailGroups() {
|
||||
return (
|
||||
|
||||
<DialogRoot placement="center" >
|
||||
<DialogTrigger asChild>
|
||||
<Button bg={"transparent"} size="sm">
|
||||
<FaRegEdit style={{ cursor: "pointer", }} />
|
||||
</Button>
|
||||
{/* <Button><FaRegEdit /></Button> */}
|
||||
|
||||
</DialogTrigger>
|
||||
|
||||
<DialogContent
|
||||
bg={"#fff"}
|
||||
w={{ base: '90%', md: '400px' }}
|
||||
overflow={'scroll'}
|
||||
p={2} // Reduced padding
|
||||
>
|
||||
<DialogHeader bg="white" pt={1} pb={2}>
|
||||
<DialogTitle alignSelf="center" color="black" fontSize="14px">Edit details</DialogTitle>
|
||||
</DialogHeader>
|
||||
|
||||
<DialogBody bg="white">
|
||||
<Stack p={2} >
|
||||
|
||||
<Field.Root>
|
||||
<Field.Label color="black" pt={1} fontSize="12px">Group Name</Field.Label>
|
||||
<Input value="Priyanka" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" readOnly />
|
||||
|
||||
<Field.Label color="black" pt={1} fontSize="12px">Description</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">Members</Field.Label>
|
||||
|
||||
<Box
|
||||
bgColor="#EEEEEE"
|
||||
border="none"
|
||||
w="100%"
|
||||
display="flex"
|
||||
p={1}
|
||||
rounded={4}
|
||||
>
|
||||
<AvatarGroup gap="0" spaceX="-3" size={"xs"} >
|
||||
<Avatar.Root border={'none'}>
|
||||
<Avatar.Fallback />
|
||||
<Avatar.Image src="https://cdn.myanimelist.net/r/84x124/images/characters/9/131317.webp?s=d4b03c7291407bde303bc0758047f6bd" />
|
||||
</Avatar.Root>
|
||||
|
||||
<Avatar.Root border={'none'}>
|
||||
<Avatar.Fallback />
|
||||
<Avatar.Image src="https://cdn.myanimelist.net/r/84x124/images/characters/7/284129.webp?s=a8998bf668767de58b33740886ca571c" />
|
||||
</Avatar.Root>
|
||||
|
||||
<Avatar.Root border={'none'}>
|
||||
<Avatar.Fallback />
|
||||
<Avatar.Image src="https://cdn.myanimelist.net/r/84x124/images/characters/9/105421.webp?s=269ff1b2bb9abe3ac1bc443d3a76e863" />
|
||||
</Avatar.Root>
|
||||
<Avatar.Root variant="solid" border={'none'} backgroundColor={'transparent'} >
|
||||
<Avatar.Fallback ml={5}>+3</Avatar.Fallback>
|
||||
</Avatar.Root>
|
||||
</AvatarGroup>
|
||||
</Box>
|
||||
</Field.Root>
|
||||
<Heading color="black" pt={1} fontSize="12px">public/Private</Heading>
|
||||
<Switch />
|
||||
</Stack>
|
||||
</DialogBody>
|
||||
<DialogFooter display="flex" justifyContent="center">
|
||||
<Button size={'xs'} w="100%" bg="#02A0A0" color={"#fff"}>
|
||||
Save
|
||||
</Button>
|
||||
</DialogFooter> <DialogCloseTrigger color="black" />
|
||||
</DialogContent>
|
||||
</DialogRoot >
|
||||
|
||||
)
|
||||
}
|
||||
|
||||
export default EditDetailGroups
|
||||
@@ -1,11 +1,107 @@
|
||||
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 { RiDeleteBin5Line } from "react-icons/ri";
|
||||
import AddModel from "../SubAdmin/AddModel"
|
||||
import EditSubAdmin from "../../components/EditSubAdmin"
|
||||
import ViewManageGroup from "./ViewManageGroup"
|
||||
import EditDetailGroups from "./EditDetailGroup"
|
||||
import AddGroup from "./AddGroup"
|
||||
// import ViewSubAdmin from "./ViewSubAdmin"
|
||||
|
||||
|
||||
// table data
|
||||
|
||||
const tableHeadRow = [
|
||||
"Sr. No",
|
||||
"Group Name",
|
||||
"Description",
|
||||
"Date",
|
||||
"Group type",
|
||||
"Action",
|
||||
];
|
||||
|
||||
const managepost: any[] = [
|
||||
...Array.from({ length: 12 }, (_, i) => ({
|
||||
"Sr. No": i + 1,
|
||||
"Group Name": "ABC",
|
||||
"Description": "Lorem ipsum",
|
||||
"Date": "12/01/1987",
|
||||
"Group type": "Private",
|
||||
"Action": (
|
||||
<HStack justifyContent="center">
|
||||
|
||||
{/* <MdOutlineRemoveRedEye
|
||||
style={{ cursor: "pointer", fontSize: "16px" }}
|
||||
/> */}
|
||||
<ViewManageGroup />
|
||||
<EditDetailGroups />
|
||||
|
||||
{/* <RiDeleteBin5Line style={{ cursor: "pointer" }} /> */}
|
||||
<AlertDailog
|
||||
AltertTiggerIcon={RiDeleteBin5Line}
|
||||
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 ManageGroups = () => {
|
||||
return (
|
||||
|
||||
<MainFrame >
|
||||
ManageGroups
|
||||
</MainFrame>
|
||||
<Box>
|
||||
<HStack
|
||||
w={"100%"}
|
||||
justifyContent={"space-between"}
|
||||
mb={4}
|
||||
py={0}
|
||||
px={3}
|
||||
>
|
||||
<Text as={"span"} fontSize={"sm"} fontWeight={500} color={"#000"}>
|
||||
Manage Groups
|
||||
</Text>
|
||||
|
||||
<HStack gap={4}>
|
||||
<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={"2xs"}
|
||||
fontSize={"2sm"}
|
||||
placeholder="Search..."
|
||||
bgColor={'#EEEEEE'}
|
||||
ps={8}
|
||||
border={'none'}
|
||||
/>
|
||||
</InputGroup>
|
||||
{/* <Button bgColor={'#EEEEEE'} pl={3} pr={3}><IoMdAdd /> <Text>Add</Text></Button> */}
|
||||
<AddGroup />
|
||||
</HStack>
|
||||
</HStack>
|
||||
<DataTable
|
||||
sortableColumns={["Name", "Registration Date "]}
|
||||
tableHeadRow={tableHeadRow}
|
||||
data={managepost}
|
||||
/>
|
||||
</Box> </MainFrame>
|
||||
)
|
||||
}
|
||||
|
||||
export default ManageGroups
|
||||
93
src/Pages/ManageGroups/ViewManageGroup.tsx
Normal file
93
src/Pages/ManageGroups/ViewManageGroup.tsx
Normal file
@@ -0,0 +1,93 @@
|
||||
import { Button } from "../../components/ui/button"
|
||||
import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog"
|
||||
import { Avatar, Box, Field, Grid, Heading, Input, Stack, Text } from "@chakra-ui/react"
|
||||
import { Checkbox } from "../../components/ui/checkbox"
|
||||
import { MdOutlineRemoveRedEye } from "react-icons/md";
|
||||
import { Switch } from "../../components/ui/switch";
|
||||
import { AvatarGroup } from "../../components/ui/avatar";
|
||||
function ViewManageGroup() {
|
||||
return (
|
||||
|
||||
<DialogRoot placement="center" >
|
||||
<DialogTrigger asChild>
|
||||
<Button bg={"transparent"} size="sm">
|
||||
<MdOutlineRemoveRedEye style={{ cursor: "pointer", }} />
|
||||
</Button>
|
||||
{/* <Button><FaRegEdit /></Button> */}
|
||||
|
||||
</DialogTrigger>
|
||||
|
||||
<DialogContent
|
||||
bg={"#fff"}
|
||||
// w={{ lg: "60%", md: "230px" }}
|
||||
w={{ base: '90%', md: '400px' }}
|
||||
|
||||
|
||||
// height={'80vh'}
|
||||
overflow={'scroll'}
|
||||
p={2} // Reduced padding
|
||||
bgSize={'md'}
|
||||
>
|
||||
<DialogHeader bg="white" pt={1} pb={2}>
|
||||
<DialogTitle alignSelf="center" color="black" fontSize="14px">View details</DialogTitle>
|
||||
</DialogHeader>
|
||||
|
||||
<DialogBody bg="white">
|
||||
<Stack p={2} >
|
||||
|
||||
<Field.Root>
|
||||
<Field.Label color="black" pt={1} fontSize="12px">Group Name</Field.Label>
|
||||
<Input value="Priyanka" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" readOnly />
|
||||
|
||||
<Field.Label color="black" pt={1} fontSize="12px">Description</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">Members</Field.Label>
|
||||
|
||||
<Box
|
||||
bgColor="#EEEEEE"
|
||||
border="none"
|
||||
w="100%"
|
||||
display="flex"
|
||||
p={1}
|
||||
rounded={4}
|
||||
>
|
||||
<AvatarGroup gap="0" spaceX="-3" size={"xs"} >
|
||||
<Avatar.Root border={'none'}>
|
||||
<Avatar.Fallback />
|
||||
<Avatar.Image src="https://cdn.myanimelist.net/r/84x124/images/characters/9/131317.webp?s=d4b03c7291407bde303bc0758047f6bd" />
|
||||
</Avatar.Root>
|
||||
|
||||
<Avatar.Root border={'none'}>
|
||||
<Avatar.Fallback />
|
||||
<Avatar.Image src="https://cdn.myanimelist.net/r/84x124/images/characters/7/284129.webp?s=a8998bf668767de58b33740886ca571c" />
|
||||
</Avatar.Root>
|
||||
|
||||
<Avatar.Root border={'none'}>
|
||||
<Avatar.Fallback />
|
||||
<Avatar.Image src="https://cdn.myanimelist.net/r/84x124/images/characters/9/105421.webp?s=269ff1b2bb9abe3ac1bc443d3a76e863" />
|
||||
</Avatar.Root>
|
||||
<Avatar.Root variant="solid" border={'none'} backgroundColor={'transparent'} >
|
||||
<Avatar.Fallback ml={5}>+3</Avatar.Fallback>
|
||||
</Avatar.Root>
|
||||
</AvatarGroup>
|
||||
</Box>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</Field.Root>
|
||||
<Heading color="black" pt={1} fontSize="12px">public/Private</Heading>
|
||||
<Switch />
|
||||
</Stack>
|
||||
</DialogBody>
|
||||
|
||||
<DialogCloseTrigger color="black" />
|
||||
</DialogContent>
|
||||
</DialogRoot >
|
||||
|
||||
)
|
||||
}
|
||||
|
||||
export default ViewManageGroup
|
||||
@@ -1,13 +1,16 @@
|
||||
import { Box, HStack, Image, Input, Text } from "@chakra-ui/react";
|
||||
import { Box, createListCollection, HStack, Image, Input, Text } from "@chakra-ui/react";
|
||||
import MainFrame from "../../components/MainFrame"
|
||||
import ViewSubAdmin from "../../components/ViewSubAdmin";
|
||||
import ViewSubAdmin from "../SubAdmin/ViewSubAdmin";
|
||||
import EditSubAdmin from "../../components/EditSubAdmin";
|
||||
import AlertDailog from "../../components/AlertDailog";
|
||||
import { InputGroup } from "../../components/ui/input-group";
|
||||
import { LuSearch } from "react-icons/lu";
|
||||
import AddModel from "../../components/AddModel";
|
||||
import AddModel from "../SubAdmin/AddModel";
|
||||
import DataTable from "../../components/DataTable";
|
||||
import { RiDeleteBin5Line } from "react-icons/ri";
|
||||
import ManageJobsAdd from "./ManageJobsAdd";
|
||||
import { SelectContent, SelectItem, SelectLabel, SelectRoot, SelectTrigger, SelectValueText } from "../../components/ui/select";
|
||||
import ViewManageJob from "./ViewManageJob";
|
||||
|
||||
|
||||
// table data
|
||||
@@ -37,9 +40,8 @@ const managepost: any[] = [
|
||||
style={{ cursor: "pointer", fontSize: "16px" }}
|
||||
/> */}
|
||||
{/* <ViewDailog /> */}
|
||||
<ViewSubAdmin />
|
||||
<EditSubAdmin />
|
||||
|
||||
<ViewManageJob />
|
||||
<ManageJobsAdd />
|
||||
{/* <RiDeleteBin5Line style={{ cursor: "pointer" }} /> */}
|
||||
<AlertDailog
|
||||
AltertTiggerIcon={RiDeleteBin5Line}
|
||||
|
||||
109
src/Pages/ManageJobs/ManageJobsAdd.tsx
Normal file
109
src/Pages/ManageJobs/ManageJobsAdd.tsx
Normal file
@@ -0,0 +1,109 @@
|
||||
import { Button } from "../../components/ui/button"
|
||||
import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog"
|
||||
import { createListCollection, Field, Input, SelectValueText, Stack } from "@chakra-ui/react"
|
||||
|
||||
import { FaRegEdit } from "react-icons/fa"
|
||||
import { SelectContent, SelectItem, SelectLabel, SelectRoot, SelectTrigger } from "../../components/ui/select"
|
||||
|
||||
const frameworks = createListCollection({
|
||||
items: [
|
||||
{ label: "React.js", value: "react" },
|
||||
{ label: "Vue.js", value: "vue" },
|
||||
{ label: "Angular", value: "angular" },
|
||||
{ label: "Svelte", value: "svelte" },
|
||||
],
|
||||
})
|
||||
function ManageJobsAdd() {
|
||||
return (
|
||||
|
||||
|
||||
<DialogRoot placement="center">
|
||||
<DialogTrigger asChild>
|
||||
<Button bg={"transparent"} size="sm">
|
||||
<FaRegEdit style={{ cursor: "pointer", fontSize: "14px" }} />
|
||||
</Button>
|
||||
</DialogTrigger>
|
||||
|
||||
<DialogContent
|
||||
bg={"#fff"}
|
||||
// w={{ lg: "60%", md: "230px" }}
|
||||
w={{ base: '90%', md: '400px' }}
|
||||
|
||||
height={'80vh'}
|
||||
overflow={'scroll'}
|
||||
p={2} // Reduced padding
|
||||
bgSize={'md'}
|
||||
>
|
||||
<DialogHeader bg="white" p={2}>
|
||||
<DialogTitle alignSelf="center" color="black" fontSize="14px">Add Details</DialogTitle>
|
||||
</DialogHeader>
|
||||
|
||||
<DialogBody bg="white">
|
||||
<Stack p={2}>
|
||||
<Field.Root>
|
||||
<Field.Label color="black" pt={1} fontSize="12px">Job title</Field.Label>
|
||||
<Input placeholder="Enter the Job Title" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
|
||||
<Field.Label color="black" pt={1} fontSize="12px">Workspace mode</Field.Label>
|
||||
<Input placeholder="Enter the Workspace Mode" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
|
||||
<Field.Label pt={1} color="black" fontSize="12px">Category</Field.Label>
|
||||
<Input placeholder="Enter the Category" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
|
||||
<Field.Label pt={1} color="black" fontSize="12px">Sub-Category</Field.Label>
|
||||
<Input placeholder="Enter the Sub-Category" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
|
||||
<Field.Label pt={1} color="black" fontSize="12px">Salary</Field.Label>
|
||||
<Input placeholder="Enter the Salary" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
|
||||
<Field.Label pt={1} color="black" fontSize="12px">Experience</Field.Label>
|
||||
<Input placeholder="Enter the Experience" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
|
||||
<Field.Label pt={1} color="black" fontSize="12px">Job Location</Field.Label>
|
||||
<Input placeholder="Enter the Job Location" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
|
||||
{/* <Field.Label pt={1} color="black" fontSize="12px">Country Selection</Field.Label>
|
||||
<Input placeholder="Enter the Country Selection" /> */}
|
||||
<SelectRoot collection={frameworks} size="sm" w={'100%'}>
|
||||
<SelectLabel pt={1} color="black" fontSize="12px">Country Selection</SelectLabel>
|
||||
<SelectTrigger bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px"
|
||||
borderRadius={"5px"}>
|
||||
<SelectValueText placeholder="Enter the Country Selection" pb={"6px"} fontSize={"12px"} />
|
||||
</SelectTrigger>
|
||||
<SelectContent position={'relative'} zIndex={'9999'} bg={"#fff"}>
|
||||
{frameworks.items.map((movie) => (
|
||||
<SelectItem item={movie} key={movie.value} color={"black"} pl={2} p={1} _hover={{ bg: "#F0F0F0" }} // Light grey background on hover
|
||||
fontSize="12px" >
|
||||
{movie.label}
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</SelectRoot>
|
||||
|
||||
|
||||
<Field.Label pt={1} color="black" fontSize="12px">Job type</Field.Label>
|
||||
<Input placeholder="Enter the Job Type" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
|
||||
<Field.Label pt={1} color="black" fontSize="12px">Skills required</Field.Label>
|
||||
<Input placeholder="Enter the Skills Required" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
|
||||
<Field.Label pt={1} color="black" fontSize="12px">Job Description*</Field.Label>
|
||||
<Input placeholder="Enter the Job Description" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
</Field.Root>
|
||||
</Stack>
|
||||
</DialogBody>
|
||||
<DialogFooter display="flex" justifyContent="center">
|
||||
<Button w="100%" bg="#02A0A0" color={"#fff"} fontSize="12px" height="30px">
|
||||
Save
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
|
||||
<DialogCloseTrigger color="black" />
|
||||
</DialogContent>
|
||||
</DialogRoot>
|
||||
|
||||
|
||||
)
|
||||
}
|
||||
|
||||
export default ManageJobsAdd
|
||||
112
src/Pages/ManageJobs/ViewManageJob.tsx
Normal file
112
src/Pages/ManageJobs/ViewManageJob.tsx
Normal file
@@ -0,0 +1,112 @@
|
||||
import { Button } from "../../components/ui/button"
|
||||
import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog"
|
||||
import { createListCollection, Field, Input, SelectValueText, Stack, } from "@chakra-ui/react"
|
||||
|
||||
import { FaRegEdit } from "react-icons/fa"
|
||||
import { SelectContent, SelectItem, SelectLabel, SelectRoot, SelectTrigger } from "../../components/ui/select"
|
||||
import { MdOutlineRemoveRedEye } from "react-icons/md"
|
||||
|
||||
const frameworks = createListCollection({
|
||||
items: [
|
||||
{ label: "React.js", value: "react" },
|
||||
{ label: "Vue.js", value: "vue" },
|
||||
{ label: "Angular", value: "angular" },
|
||||
{ label: "Svelte", value: "svelte" },
|
||||
],
|
||||
})
|
||||
function ViewManageJob() {
|
||||
return (
|
||||
|
||||
|
||||
<DialogRoot placement="center">
|
||||
<DialogTrigger asChild>
|
||||
<Button bg={"transparent"} size="sm">
|
||||
<MdOutlineRemoveRedEye style={{ cursor: "pointer", fontSize: "14px" }} />
|
||||
</Button>
|
||||
</DialogTrigger>
|
||||
|
||||
<DialogContent
|
||||
bg={"#fff"}
|
||||
// w={{ lg: "60%", md: "230px" }}
|
||||
w={{ base: '90%', md: '400px' }}
|
||||
|
||||
height={'80vh'}
|
||||
overflow={'scroll'}
|
||||
p={2} // Reduced padding
|
||||
bgSize={'md'}
|
||||
>
|
||||
<DialogHeader bg="white" p={2}>
|
||||
<DialogTitle alignSelf="center" color="black" fontSize="14px">Add Details</DialogTitle>
|
||||
</DialogHeader>
|
||||
|
||||
<DialogBody bg="white">
|
||||
<Stack p={2}>
|
||||
<Field.Root>
|
||||
<Field.Label color="black" pt={1} fontSize="12px">Job title</Field.Label>
|
||||
<Input placeholder="Enter the Job Title" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
|
||||
<Field.Label color="black" pt={1} fontSize="12px">Workspace mode</Field.Label>
|
||||
<Input placeholder="Enter the Workspace Mode" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
|
||||
<Field.Label pt={1} color="black" fontSize="12px">Category</Field.Label>
|
||||
<Input placeholder="Enter the Category" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
|
||||
<Field.Label pt={1} color="black" fontSize="12px">Sub-Category</Field.Label>
|
||||
<Input placeholder="Enter the Sub-Category" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
|
||||
<Field.Label pt={1} color="black" fontSize="12px">Salary</Field.Label>
|
||||
<Input placeholder="Enter the Salary" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
|
||||
<Field.Label pt={1} color="black" fontSize="12px">Experience</Field.Label>
|
||||
<Input placeholder="Enter the Experience" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
|
||||
<Field.Label pt={1} color="black" fontSize="12px">Job Location</Field.Label>
|
||||
<Input placeholder="Enter the Job Location" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
|
||||
{/* <Field.Label pt={1} color="black" fontSize="12px">Country Selection</Field.Label>
|
||||
<Input placeholder="Enter the Country Selection" /> */}
|
||||
<SelectRoot collection={frameworks} size="sm" w={'100%'}>
|
||||
<SelectLabel pt={1} color="black" fontSize="12px">Country Selection</SelectLabel>
|
||||
<SelectTrigger bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px"
|
||||
borderRadius={"5px"}>
|
||||
<SelectValueText placeholder="Enter the Country Selection" pb={"6px"} fontSize={"12px"} />
|
||||
</SelectTrigger>
|
||||
<SelectContent position={'relative'} zIndex={'9999'} bg={"#fff"}>
|
||||
{frameworks.items.map((movie) => (
|
||||
<SelectItem item={movie} key={movie.value} color={"black"} pl={2} p={1} _hover={{ bg: "#F0F0F0" }} // Light grey background on hover
|
||||
fontSize="12px" >
|
||||
{movie.label}
|
||||
</SelectItem>
|
||||
))}
|
||||
</SelectContent>
|
||||
</SelectRoot>
|
||||
|
||||
|
||||
<Field.Label pt={1} color="black" fontSize="12px">Job type</Field.Label>
|
||||
<Input placeholder="Enter the Job Type" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
|
||||
<Field.Label pt={1} color="black" fontSize="12px">Skills required</Field.Label>
|
||||
<Input placeholder="Enter the Skills Required" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
|
||||
<Field.Label pt={1} color="black" fontSize="12px">Job Description*</Field.Label>
|
||||
<Input placeholder="Enter the Job Description" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
<Field.Label pt={1} color="black" fontSize="12px">Upload Image</Field.Label>
|
||||
<Input placeholder="Upload Image" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
</Field.Root>
|
||||
</Stack>
|
||||
</DialogBody>
|
||||
<DialogFooter display="flex" justifyContent="center">
|
||||
<Button w="100%" bg="#02A0A0" color={"#fff"} fontSize="12px" height="30px">
|
||||
Save
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
|
||||
<DialogCloseTrigger color="black" />
|
||||
</DialogContent>
|
||||
</DialogRoot>
|
||||
|
||||
|
||||
)
|
||||
}
|
||||
|
||||
export default ViewManageJob
|
||||
@@ -8,7 +8,8 @@ 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 '../../components/ViewDailog'
|
||||
import ViewDailog from './ViewDailog'
|
||||
// import ViewDailog from './ViewDailog'
|
||||
|
||||
// table data
|
||||
|
||||
|
||||
51
src/Pages/ManagePost/ViewDailog.tsx
Normal file
51
src/Pages/ManagePost/ViewDailog.tsx
Normal file
@@ -0,0 +1,51 @@
|
||||
import { MdOutlineRemoveRedEye } from "react-icons/md"
|
||||
import { Button } from "../../components/ui/button"
|
||||
import { DialogBody, DialogCloseTrigger, DialogContent, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog"
|
||||
import { Field, Image, Input, Stack } from "@chakra-ui/react"
|
||||
import img from "../../assets/waterfall.jpg"
|
||||
function ViewDailog() {
|
||||
return (
|
||||
|
||||
<DialogRoot placement="center">
|
||||
<DialogTrigger asChild>
|
||||
<Button bg={"transparent"} size="sm">
|
||||
<MdOutlineRemoveRedEye style={{ cursor: "pointer", fontSize: "16px" }} />
|
||||
</Button>
|
||||
</DialogTrigger>
|
||||
|
||||
<DialogContent
|
||||
w={{ base: '90%', md: '400px' }}
|
||||
bg={"#fff"}
|
||||
h="auto"
|
||||
p={2} // Reduced padding
|
||||
>
|
||||
<DialogHeader bg="white" p={2}>
|
||||
<DialogTitle alignSelf="center" color="black" fontSize="14px">View Details</DialogTitle>
|
||||
</DialogHeader>
|
||||
|
||||
<DialogBody bg="white">
|
||||
<Stack p={2} >
|
||||
<Field.Root>
|
||||
<Field.Label color="black" pt={1} fontSize="12px">Title</Field.Label>
|
||||
<Input placeholder="Enter the Title" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" readOnly />
|
||||
|
||||
<Field.Label color="black" pt={1} fontSize="12px">Subtitle</Field.Label>
|
||||
<Input placeholder="Enter the Subtitle" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" readOnly />
|
||||
|
||||
<Field.Label color="black" pt={1} fontSize="12px">Description</Field.Label>
|
||||
<Input placeholder="Enter the Description" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" readOnly />
|
||||
|
||||
<Field.Label color="black" pt={1} fontSize="12px">Image</Field.Label>
|
||||
<Image src={img} w="100%" maxH="150px" objectFit="contain" />
|
||||
</Field.Root>
|
||||
</Stack>
|
||||
</DialogBody>
|
||||
|
||||
<DialogCloseTrigger color="black" />
|
||||
</DialogContent>
|
||||
</DialogRoot>
|
||||
|
||||
)
|
||||
}
|
||||
|
||||
export default ViewDailog
|
||||
80
src/Pages/SubAdmin/AddModel.tsx
Normal file
80
src/Pages/SubAdmin/AddModel.tsx
Normal file
@@ -0,0 +1,80 @@
|
||||
import { Button } from "../../components/ui/button"
|
||||
import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog"
|
||||
import { Field, Grid, Heading, Input, Stack, Text } from "@chakra-ui/react"
|
||||
import { IoMdAdd } from "react-icons/io"
|
||||
import { Checkbox } from "../../components/ui/checkbox"
|
||||
|
||||
function AddModel() {
|
||||
return (
|
||||
|
||||
<DialogRoot placement="center">
|
||||
<DialogTrigger asChild>
|
||||
{/* <Button bg={"transparent"} size="sm">
|
||||
<MdOutlineRemoveRedEye style={{ cursor: "pointer", fontSize: "16px" }} />
|
||||
</Button> */}
|
||||
<Button bgColor={'#EEEEEE'} pl={3} pr={3}><IoMdAdd /> <Text>Add</Text></Button>
|
||||
|
||||
</DialogTrigger>
|
||||
|
||||
<DialogContent
|
||||
bg={"#fff"}
|
||||
// w={{ lg: "60%", md: "230px" }}
|
||||
w={{ base: '90%', md: '400px' }}
|
||||
|
||||
height={'80vh'}
|
||||
overflow={'scroll'}
|
||||
p={2} // Reduced padding
|
||||
bgSize={'md'}
|
||||
>
|
||||
<DialogHeader bg="white" pt={1} pb={2}>
|
||||
<DialogTitle alignSelf="center" color="black" fontSize="14px"
|
||||
>Add Sub Admin Account</DialogTitle>
|
||||
</DialogHeader>
|
||||
|
||||
<DialogBody bg="white">
|
||||
<Stack p={2} >
|
||||
|
||||
<Field.Root>
|
||||
<Field.Label color="black" pt={1} fontSize="12px">First Name</Field.Label>
|
||||
<Input placeholder="Enter the First Name" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
|
||||
<Field.Label color="black" pt={1} fontSize="12px">Last Name</Field.Label>
|
||||
<Input placeholder="Enter the Last Name" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
|
||||
<Field.Label color="black" pt={1} fontSize="12px">DOB</Field.Label>
|
||||
<Input placeholder="Enter the DOB" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
|
||||
<Field.Label color="black" pt={1} fontSize="12px">Gender</Field.Label>
|
||||
<Input placeholder="Enter the Gender" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
<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">
|
||||
<Button w="100%" bg="#02A0A0" color={"#fff"}>
|
||||
Save
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
|
||||
<DialogCloseTrigger color="black" />
|
||||
</DialogContent>
|
||||
</DialogRoot >
|
||||
|
||||
)
|
||||
}
|
||||
|
||||
export default AddModel
|
||||
@@ -3,12 +3,11 @@ import MainFrame from "../../components/MainFrame"
|
||||
import { InputGroup } from "../../components/ui/input-group"
|
||||
import { LuSearch } from "react-icons/lu"
|
||||
import DataTable from "../../components/DataTable"
|
||||
import ViewDailog from "../../components/ViewDailog"
|
||||
import AlertDailog from "../../components/AlertDailog"
|
||||
import { RiDeleteBin5Line } from "react-icons/ri";
|
||||
import AddModel from "../../components/AddModel"
|
||||
import AddModel from "./AddModel"
|
||||
import EditSubAdmin from "../../components/EditSubAdmin"
|
||||
import ViewSubAdmin from "../../components/ViewSubAdmin"
|
||||
import ViewSubAdmin from "./ViewSubAdmin"
|
||||
|
||||
|
||||
// table data
|
||||
|
||||
84
src/Pages/SubAdmin/ViewSubAdmin.tsx
Normal file
84
src/Pages/SubAdmin/ViewSubAdmin.tsx
Normal file
@@ -0,0 +1,84 @@
|
||||
import { Button } from "../../components/ui/button"
|
||||
import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "../../components/ui/dialog"
|
||||
import { Field, Grid, Heading, Input, Stack, Text } from "@chakra-ui/react"
|
||||
import { Checkbox } from "../../components/ui/checkbox"
|
||||
import { MdOutlineRemoveRedEye } from "react-icons/md";
|
||||
function ViewSubAdmin() {
|
||||
return (
|
||||
|
||||
<DialogRoot placement="center" >
|
||||
<DialogTrigger asChild>
|
||||
<Button bg={"transparent"} size="sm">
|
||||
<MdOutlineRemoveRedEye style={{ cursor: "pointer", }} />
|
||||
</Button>
|
||||
{/* <Button><FaRegEdit /></Button> */}
|
||||
|
||||
</DialogTrigger>
|
||||
|
||||
<DialogContent
|
||||
bg={"#fff"}
|
||||
// w={{ lg: "60%", md: "230px" }}
|
||||
w={{ base: '90%', md: '400px' }}
|
||||
|
||||
|
||||
|
||||
height={'80vh'}
|
||||
overflow={'scroll'}
|
||||
p={2} // Reduced padding
|
||||
bgSize={'md'}
|
||||
>
|
||||
<DialogHeader bg="white" pt={1} pb={2}>
|
||||
<DialogTitle alignSelf="center" color="black" fontSize="14px">View Sub Admin Account</DialogTitle>
|
||||
</DialogHeader>
|
||||
|
||||
<DialogBody bg="white">
|
||||
<Stack p={2} >
|
||||
|
||||
<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 />
|
||||
|
||||
<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">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">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">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">
|
||||
<Button w="100%" bg="#02A0A0" color={"#fff"}>
|
||||
Save
|
||||
</Button>
|
||||
</DialogFooter> */}
|
||||
|
||||
<DialogCloseTrigger color="black" />
|
||||
</DialogContent>
|
||||
</DialogRoot >
|
||||
|
||||
)
|
||||
}
|
||||
|
||||
export default ViewSubAdmin
|
||||
@@ -1,76 +0,0 @@
|
||||
import { Button } from "./ui/button"
|
||||
import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "./ui/dialog"
|
||||
import { Field, Grid, Input, Stack, Text } from "@chakra-ui/react"
|
||||
import { IoMdAdd } from "react-icons/io"
|
||||
import { Checkbox } from "./ui/checkbox"
|
||||
|
||||
function AddModel() {
|
||||
return (
|
||||
|
||||
<DialogRoot placement="center">
|
||||
<DialogTrigger asChild>
|
||||
{/* <Button bg={"transparent"} size="sm">
|
||||
<MdOutlineRemoveRedEye style={{ cursor: "pointer", fontSize: "16px" }} />
|
||||
</Button> */}
|
||||
<Button bgColor={'#EEEEEE'} pl={3} pr={3}><IoMdAdd /> <Text>Add</Text></Button>
|
||||
|
||||
</DialogTrigger>
|
||||
|
||||
<DialogContent
|
||||
bg={"#fff"}
|
||||
w={{ base: "90%", md: "400px" }}
|
||||
maxW="90vw"
|
||||
h="auto"
|
||||
p={4}
|
||||
>
|
||||
<DialogHeader bg="white" p={3}>
|
||||
<DialogTitle alignSelf="center" color="black">Add Sub Admin Account</DialogTitle>
|
||||
</DialogHeader>
|
||||
|
||||
<DialogBody bg="white">
|
||||
<Stack p={4} >
|
||||
|
||||
<Field.Root>
|
||||
<Field.Label color="black" pt={2}>First Name</Field.Label>
|
||||
<Input placeholder="Enter the First Name" bgColor="#EEEEEE" color="black" border="none" pl={2} />
|
||||
|
||||
<Field.Label color="black" pt={2}>Last Name</Field.Label>
|
||||
<Input placeholder="Enter the Last Name" bgColor="#EEEEEE" color="black" border="none" pl={2} />
|
||||
|
||||
<Field.Label pt={2} color="black">DOB</Field.Label>
|
||||
<Input placeholder="Enter the DOB" bgColor="#EEEEEE" color="black" border="none" pl={2} />
|
||||
|
||||
<Field.Label pt={2} color="black">Gender</Field.Label>
|
||||
<Input placeholder="Enter the Gender" bgColor="#EEEEEE" color="black" border="none" pl={2} />
|
||||
<Field.Label pt={2} color="black">permission</Field.Label>
|
||||
</Field.Root>
|
||||
<Grid templateColumns="repeat(2, 1fr)" gap={4} maxH={"100px"} overflowY={"auto"}>
|
||||
<Checkbox color={"black"} ><Text fontSize={12}>Dashboard</Text></Checkbox>
|
||||
<Checkbox color={"black"}> <Text fontSize={12}>Manage contact us</Text></Checkbox>
|
||||
<Checkbox color={"black"}> <Text fontSize={12}>manage User</Text></Checkbox>
|
||||
<Checkbox color={"black"}> <Text fontSize={12}>Manage CMS</Text></Checkbox>
|
||||
<Checkbox color={"black"}> <Text fontSize={12}>Manage Post</Text></Checkbox>
|
||||
<Checkbox color={"black"}> <Text fontSize={12}>Manage Reports</Text></Checkbox>
|
||||
<Checkbox color={"black"}> <Text fontSize={12}>manage Sub-Admin</Text></Checkbox>
|
||||
<Checkbox color={"black"}> <Text fontSize={12}>My profile</Text></Checkbox>
|
||||
<Checkbox color={"black"}><Text fontSize={12}>Manage Jobs</Text> </Checkbox>
|
||||
<Checkbox color={"black"}><Text fontSize={12}> manage feedbacks</Text></Checkbox>
|
||||
<Checkbox color={"black"}><Text fontSize={12}>Manage community</Text> </Checkbox>
|
||||
<Checkbox color={"black"}><Text fontSize={12}> Notification</Text></Checkbox>
|
||||
</Grid>
|
||||
</Stack>
|
||||
</DialogBody>
|
||||
<DialogFooter display="flex" justifyContent="center">
|
||||
<Button w="100%" bg="#02A0A0" color={"#fff"}>
|
||||
Save
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
|
||||
<DialogCloseTrigger color="black" />
|
||||
</DialogContent>
|
||||
</DialogRoot >
|
||||
|
||||
)
|
||||
}
|
||||
|
||||
export default AddModel
|
||||
@@ -55,7 +55,7 @@ const AlertDailog: React.FC<DeleteConfirmationDialogProps> = ({
|
||||
</DialogTrigger>
|
||||
<DialogContent bgColor="#fff">
|
||||
{/* <DialogHeader display="flex" justifyContent="center"> */}
|
||||
{/* <Image src={alertIcon} h={"39px"} /> */}
|
||||
{/* <Image src={alertIcon} h={"39px"} /> */}
|
||||
|
||||
{/* </DialogHeader> */}
|
||||
<DialogBody
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import { Button } from "./ui/button"
|
||||
import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "./ui/dialog"
|
||||
import { Field, Grid, Input, Stack, Text } from "@chakra-ui/react"
|
||||
import { Field, Grid, Heading, Input, Stack, Text } from "@chakra-ui/react"
|
||||
import { Checkbox } from "./ui/checkbox"
|
||||
import { FaRegEdit } from "react-icons/fa";
|
||||
function EditSubAdmin() {
|
||||
@@ -17,45 +17,47 @@ function EditSubAdmin() {
|
||||
|
||||
<DialogContent
|
||||
bg={"#fff"}
|
||||
w={{ base: "90%", md: "400px" }}
|
||||
maxW="90vw"
|
||||
h="auto"
|
||||
p={4}
|
||||
w={{ lg: "60%", md: "230px" }}
|
||||
height={'80vh'}
|
||||
overflow={'scroll'}
|
||||
p={2} // Reduced padding
|
||||
bgSize={'md'}
|
||||
>
|
||||
<DialogHeader bg="white" p={3}>
|
||||
<DialogTitle alignSelf="center" color="black">Edit Sub Admin Account</DialogTitle>
|
||||
<DialogHeader bg="white" pt={1} pb={2}>
|
||||
<DialogTitle alignSelf="center" color="black" fontSize="14px">Edit Sub Admin Account</DialogTitle>
|
||||
</DialogHeader>
|
||||
|
||||
<DialogBody bg="white">
|
||||
<Stack p={4} >
|
||||
<Stack p={2} >
|
||||
|
||||
<Field.Root>
|
||||
<Field.Label color="black" pt={2}>First Name</Field.Label>
|
||||
<Input placeholder="Enter the First Name" bgColor="#EEEEEE" color="black" border="none" pl={2} />
|
||||
<Field.Label color="black" pt={1} fontSize="12px">First Name</Field.Label>
|
||||
<Input placeholder="Enter the First Name" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
|
||||
<Field.Label color="black" pt={2}>Last Name</Field.Label>
|
||||
<Input placeholder="Enter the Last Name" bgColor="#EEEEEE" color="black" border="none" pl={2} />
|
||||
<Field.Label color="black" pt={1} fontSize="12px">Last Name</Field.Label>
|
||||
<Input placeholder="Enter the Last Name" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
|
||||
<Field.Label pt={2} color="black">DOB</Field.Label>
|
||||
<Input placeholder="Enter the DOB" bgColor="#EEEEEE" color="black" border="none" pl={2} />
|
||||
<Field.Label color="black" pt={1} fontSize="12px">DOB</Field.Label>
|
||||
<Input placeholder="Enter the DOB" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
|
||||
<Field.Label color="black" pt={1} fontSize="12px">Gender</Field.Label>
|
||||
<Input placeholder="Enter the Gender" bgColor="#EEEEEE" color="black" border="none" pl={1} fontSize="12px" height="30px" />
|
||||
<Heading mt={5} color={'#000'} fontSize={'sm'}>Permissions</Heading>
|
||||
|
||||
<Field.Label pt={2} color="black">Gender</Field.Label>
|
||||
<Input placeholder="Enter the Gender" bgColor="#EEEEEE" color="black" border="none" pl={2} />
|
||||
<Field.Label pt={2} color="black">permission</Field.Label>
|
||||
</Field.Root>
|
||||
<Grid templateColumns="repeat(2, 1fr)" gap={4} maxH={"100px"} overflowY={"auto"}>
|
||||
<Checkbox color={"black"} ><Text fontSize={12}>Dashboard</Text></Checkbox>
|
||||
<Checkbox color={"black"}> <Text fontSize={12}>Manage contact us</Text></Checkbox>
|
||||
<Checkbox color={"black"}> <Text fontSize={12}>manage User</Text></Checkbox>
|
||||
<Checkbox color={"black"}> <Text fontSize={12}>Manage CMS</Text></Checkbox>
|
||||
<Checkbox color={"black"}> <Text fontSize={12}>Manage Post</Text></Checkbox>
|
||||
<Checkbox color={"black"}> <Text fontSize={12}>Manage Reports</Text></Checkbox>
|
||||
<Checkbox color={"black"}> <Text fontSize={12}>manage Sub-Admin</Text></Checkbox>
|
||||
<Checkbox color={"black"}> <Text fontSize={12}>My profile</Text></Checkbox>
|
||||
<Checkbox color={"black"}><Text fontSize={12}>Manage Jobs</Text> </Checkbox>
|
||||
<Checkbox color={"black"}><Text fontSize={12}> manage feedbacks</Text></Checkbox>
|
||||
<Checkbox color={"black"}><Text fontSize={12}>Manage community</Text> </Checkbox>
|
||||
<Checkbox color={"black"}><Text fontSize={12}> Notification</Text></Checkbox>
|
||||
<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>
|
||||
|
||||
@@ -1,125 +0,0 @@
|
||||
import { MdOutlineRemoveRedEye } from "react-icons/md";
|
||||
import { Button } from "./ui/button";
|
||||
import {
|
||||
DialogBody,
|
||||
DialogCloseTrigger,
|
||||
DialogContent,
|
||||
DialogFooter,
|
||||
DialogHeader,
|
||||
DialogRoot,
|
||||
DialogTitle,
|
||||
DialogTrigger,
|
||||
} from "./ui/dialog";
|
||||
import { Field, Image, Input, Stack } from "@chakra-ui/react";
|
||||
import img from "../assets/waterfall.jpg";
|
||||
function ViewDailog() {
|
||||
return (
|
||||
// <DialogRoot placement={"center"}
|
||||
// >
|
||||
// <DialogTrigger asChild>
|
||||
// <Button variant="outline" size="sm">
|
||||
// <MdOutlineRemoveRedEye
|
||||
// style={{ cursor: "pointer", fontSize: "16px" }}
|
||||
// /> </Button>
|
||||
// </DialogTrigger>
|
||||
// <DialogContent w={"700px"} h={"346px"}>
|
||||
// <DialogHeader bg={'#fff'} p={3}>
|
||||
// <DialogTitle alignSelf={"center"} color={"black"}>View Details</DialogTitle>
|
||||
// </DialogHeader>
|
||||
// <DialogBody bg={"#fff"}>
|
||||
// <Stack p={4}>
|
||||
// <Field.Root>
|
||||
// <Field.Label color={"black"}>Title</Field.Label>
|
||||
// <Input placeholder="Enter the Title" bgColor={'#EEEEEE'} color={"black"} border={"none"} pl={2} />
|
||||
// <Field.Label color={"black"}>Title</Field.Label>
|
||||
// <Input placeholder="Enter the Title" bgColor={'#EEEEEE'} color={"black"} border={"none"} pl={2} />
|
||||
// <Field.Label color={"black"}>Title</Field.Label>
|
||||
// <Input placeholder="Enter the Title" bgColor={'#EEEEEE'} color={"black"} border={"none"} pl={2} />
|
||||
// <Field.Label color={"black"}>Image</Field.Label>
|
||||
// <Image src={img} />
|
||||
// </Field.Root>
|
||||
|
||||
// </Stack>
|
||||
// </DialogBody>
|
||||
// {/* <DialogFooter>
|
||||
// <DialogActionTrigger asChild>
|
||||
// <Button variant="outline">Cancel</Button>
|
||||
// </DialogActionTrigger>
|
||||
// <Button>Save</Button>
|
||||
// </DialogFooter> */}
|
||||
// <DialogCloseTrigger color={'black'} />
|
||||
// </DialogContent>
|
||||
// </DialogRoot>
|
||||
<DialogRoot placement="center">
|
||||
<DialogTrigger asChild>
|
||||
<Button bg={"transparent"} size="sm">
|
||||
<MdOutlineRemoveRedEye
|
||||
style={{ cursor: "pointer", fontSize: "16px" }}
|
||||
/>
|
||||
</Button>
|
||||
</DialogTrigger>
|
||||
|
||||
<DialogContent
|
||||
bg={"#fff"}
|
||||
w={{ base: "90%", md: "400px" }}
|
||||
maxW="90vw"
|
||||
h="auto"
|
||||
p={4}
|
||||
>
|
||||
<DialogHeader bg="white" p={3}>
|
||||
<DialogTitle alignSelf="center" color="black">
|
||||
View Details
|
||||
</DialogTitle>
|
||||
</DialogHeader>
|
||||
|
||||
<DialogBody bg="white">
|
||||
<Stack p={4}>
|
||||
<Field.Root>
|
||||
<Field.Label color="black" pt={2}>
|
||||
Title
|
||||
</Field.Label>
|
||||
<Input
|
||||
placeholder="Enter the Title"
|
||||
bgColor="#EEEEEE"
|
||||
color="black"
|
||||
border="none"
|
||||
pl={2}
|
||||
/>
|
||||
|
||||
<Field.Label color="black" pt={2}>
|
||||
Subtitle
|
||||
</Field.Label>
|
||||
<Input
|
||||
placeholder="Enter the Subtitle"
|
||||
bgColor="#EEEEEE"
|
||||
color="black"
|
||||
border="none"
|
||||
pl={2}
|
||||
/>
|
||||
|
||||
<Field.Label pt={2} color="black">
|
||||
Description
|
||||
</Field.Label>
|
||||
<Input
|
||||
placeholder="Enter the Description"
|
||||
bgColor="#EEEEEE"
|
||||
color="black"
|
||||
border="none"
|
||||
pl={2}
|
||||
/>
|
||||
|
||||
<Field.Label pt={2} color="black">
|
||||
Image
|
||||
</Field.Label>
|
||||
<Image src={img} w="100%" maxH="150px" objectFit="contain" />
|
||||
</Field.Root>
|
||||
</Stack>
|
||||
</DialogBody>
|
||||
|
||||
<DialogCloseTrigger color="black" />
|
||||
</DialogContent>
|
||||
</DialogRoot>
|
||||
);
|
||||
}
|
||||
|
||||
export default ViewDailog;
|
||||
@@ -1,76 +0,0 @@
|
||||
import { Button } from "./ui/button"
|
||||
import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "./ui/dialog"
|
||||
import { Field, Grid, Input, Stack, Text } from "@chakra-ui/react"
|
||||
import { Checkbox } from "./ui/checkbox"
|
||||
import { FaRegEdit } from "react-icons/fa";
|
||||
import { MdOutlineRemoveRedEye } from "react-icons/md";
|
||||
function ViewSubAdmin() {
|
||||
return (
|
||||
|
||||
<DialogRoot placement="center">
|
||||
<DialogTrigger asChild>
|
||||
<Button bg={"transparent"} size="sm">
|
||||
<MdOutlineRemoveRedEye style={{ cursor: "pointer", }} />
|
||||
</Button>
|
||||
{/* <Button><FaRegEdit /></Button> */}
|
||||
|
||||
</DialogTrigger>
|
||||
|
||||
<DialogContent
|
||||
bg={"#fff"}
|
||||
w={{ base: "90%", md: "400px" }}
|
||||
maxW="90vw"
|
||||
h="auto"
|
||||
p={4}
|
||||
>
|
||||
<DialogHeader bg="white" p={3}>
|
||||
<DialogTitle alignSelf="center" color="black">View Sub Admin Account</DialogTitle>
|
||||
</DialogHeader>
|
||||
|
||||
<DialogBody bg="white">
|
||||
<Stack p={4} >
|
||||
|
||||
<Field.Root>
|
||||
<Field.Label color="black" pt={2}>First Name</Field.Label>
|
||||
<Input placeholder="Enter the First Name" bgColor="#EEEEEE" color="black" border="none" pl={2} />
|
||||
|
||||
<Field.Label color="black" pt={2}>Last Name</Field.Label>
|
||||
<Input placeholder="Enter the Last Name" bgColor="#EEEEEE" color="black" border="none" pl={2} />
|
||||
|
||||
<Field.Label pt={2} color="black">DOB</Field.Label>
|
||||
<Input placeholder="Enter the DOB" bgColor="#EEEEEE" color="black" border="none" pl={2} />
|
||||
|
||||
<Field.Label pt={2} color="black">Gender</Field.Label>
|
||||
<Input placeholder="Enter the Gender" bgColor="#EEEEEE" color="black" border="none" pl={2} />
|
||||
<Field.Label pt={2} color="black">permission</Field.Label>
|
||||
</Field.Root>
|
||||
<Grid templateColumns="repeat(2, 1fr)" gap={4} maxH={"100px"} overflowY={"auto"}>
|
||||
<Checkbox color={"black"} ><Text fontSize={12}>Dashboard</Text></Checkbox>
|
||||
<Checkbox color={"black"}> <Text fontSize={12}>Manage contact us</Text></Checkbox>
|
||||
<Checkbox color={"black"}> <Text fontSize={12}>manage User</Text></Checkbox>
|
||||
<Checkbox color={"black"}> <Text fontSize={12}>Manage CMS</Text></Checkbox>
|
||||
<Checkbox color={"black"}> <Text fontSize={12}>Manage Post</Text></Checkbox>
|
||||
<Checkbox color={"black"}> <Text fontSize={12}>Manage Reports</Text></Checkbox>
|
||||
<Checkbox color={"black"}> <Text fontSize={12}>manage Sub-Admin</Text></Checkbox>
|
||||
<Checkbox color={"black"}> <Text fontSize={12}>My profile</Text></Checkbox>
|
||||
<Checkbox color={"black"}><Text fontSize={12}>Manage Jobs</Text> </Checkbox>
|
||||
<Checkbox color={"black"}><Text fontSize={12}> manage feedbacks</Text></Checkbox>
|
||||
<Checkbox color={"black"}><Text fontSize={12}>Manage community</Text> </Checkbox>
|
||||
<Checkbox color={"black"}><Text fontSize={12}> Notification</Text></Checkbox>
|
||||
</Grid>
|
||||
</Stack>
|
||||
</DialogBody>
|
||||
{/* <DialogFooter display="flex" justifyContent="center">
|
||||
<Button w="100%" bg="#02A0A0" color={"#fff"}>
|
||||
Save
|
||||
</Button>
|
||||
</DialogFooter> */}
|
||||
|
||||
<DialogCloseTrigger color="black" />
|
||||
</DialogContent>
|
||||
</DialogRoot >
|
||||
|
||||
)
|
||||
}
|
||||
|
||||
export default ViewSubAdmin
|
||||
@@ -3,7 +3,7 @@
|
||||
|
||||
|
||||
|
||||
*{
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
@@ -16,8 +16,8 @@ body {
|
||||
font-family: "Roboto", serif;
|
||||
}
|
||||
|
||||
.Oxygen{
|
||||
font-family: "Oxygen", serif
|
||||
.Oxygen {
|
||||
font-family: "Oxygen", serif
|
||||
}
|
||||
|
||||
|
||||
@@ -39,12 +39,12 @@ body {
|
||||
|
||||
|
||||
|
||||
.linkChild:hover{
|
||||
.linkChild:hover {
|
||||
color: #02A0A0 !important;
|
||||
transition: all 0.5s;
|
||||
}
|
||||
|
||||
.activeChild{
|
||||
.activeChild {
|
||||
|
||||
color: #02A0A0 !important;
|
||||
/* border: 1px solid #02A0A0 !important; */
|
||||
@@ -52,7 +52,7 @@ body {
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.link{
|
||||
.link {
|
||||
transition: all 0.5s;
|
||||
}
|
||||
|
||||
@@ -69,8 +69,8 @@ body {
|
||||
|
||||
/* ✅ Red Spheres */
|
||||
.red-sphere-1,
|
||||
.red-sphere-2,
|
||||
.red-sphere-3{
|
||||
.red-sphere-2,
|
||||
.red-sphere-3 {
|
||||
position: absolute;
|
||||
border-radius: 50%;
|
||||
background-color: #D90B2E46;
|
||||
@@ -81,7 +81,7 @@ body {
|
||||
/* ✅ Blue Spheres */
|
||||
.blue-sphere-1,
|
||||
.blue-sphere-2,
|
||||
.blue-sphere-3{
|
||||
.blue-sphere-3 {
|
||||
position: absolute;
|
||||
border-radius: 50%;
|
||||
background-color: #009DAB46;
|
||||
@@ -125,7 +125,7 @@ body {
|
||||
left: 40%;
|
||||
}
|
||||
|
||||
.blue-sphere-3{
|
||||
.blue-sphere-3 {
|
||||
width: 300px;
|
||||
height: 300px;
|
||||
bottom: 10%;
|
||||
@@ -135,8 +135,10 @@ body {
|
||||
|
||||
/* Style the scrollbar */
|
||||
::-webkit-scrollbar {
|
||||
width: 6px; /* Width of the vertical scrollbar */
|
||||
height: 12px; /* Height of the horizontal scrollbar */
|
||||
width: 6px;
|
||||
/* Width of the vertical scrollbar */
|
||||
height: 12px;
|
||||
/* Height of the horizontal scrollbar */
|
||||
}
|
||||
|
||||
/* Style the scrollbar track (the background area) */
|
||||
@@ -150,14 +152,20 @@ body {
|
||||
background-color: #c8c8c8cf;
|
||||
/* Gray color for the thumb */
|
||||
border-radius: 10px;
|
||||
border: 1px solid #f1f1f1; /* Border around the thumb */
|
||||
border: 1px solid #f1f1f1;
|
||||
/* Border around the thumb */
|
||||
}
|
||||
|
||||
/* Style the scrollbar thumb on hover */
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background-color: #555; /* Darker gray when hovered */
|
||||
background-color: #555;
|
||||
/* Darker gray when hovered */
|
||||
}
|
||||
|
||||
input:focus-visible {
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
.css-1ilznyv {
|
||||
border: none;
|
||||
}
|
||||
Reference in New Issue
Block a user