80 lines
4.6 KiB
TypeScript
80 lines
4.6 KiB
TypeScript
import { Button } from "./ui/button"
|
|
import { DialogBody, DialogCloseTrigger, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTitle, DialogTrigger } from "./ui/dialog"
|
|
import { Field, Grid, Heading, Input, Stack, Text } from "@chakra-ui/react"
|
|
import { Checkbox } from "./ui/checkbox"
|
|
import { FaRegEdit } from "react-icons/fa";
|
|
function EditSubAdmin() {
|
|
return (
|
|
|
|
<DialogRoot placement="center">
|
|
<DialogTrigger asChild>
|
|
<Button bg={"transparent"} size="sm">
|
|
<FaRegEdit 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">Edit 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">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 EditSubAdmin |