wibu/sistem-desa-mandiri
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

upd

Browse Source 
: modal konfirmasi

Deskripsi:
- button ya warna abu
- button ya pindah ke kiri

No Issues
This commit is contained in:
amel
2025-01-15 14:42:49 +08:00
parent 772c58a1c2
commit 09e7a6c4f7
1 changed files with 5 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/module/_global/layout/layout_modal_new.tsx
View File

@@ -1,6 +1,6 @@
import { Button, Flex, Modal, SimpleGrid, Text } from '@mantine/core'; import { Button, Flex, Modal, SimpleGrid, Text } from '@mantine/core';
import { useMediaQuery } from '@mantine/hooks'; import { useMediaQuery } from '@mantine/hooks';
import { BsQuestionCircleFill } from 'react-icons/bs'; import { IoIosWarning } from 'react-icons/io';
export default function LayoutModalNew({ opened, onClose, description, onYes, loading, onCheck }: { opened: boolean, onClose: () => void, loading?: boolean, description: string, onYes: (val: boolean) => void, onCheck: (val: boolean) => void }) { export default function LayoutModalNew({ opened, onClose, description, onYes, loading, onCheck }: { opened: boolean, onClose: () => void, loading?: boolean, description: string, onYes: (val: boolean) => void, onCheck: (val: boolean) => void }) {
const isMobile = useMediaQuery('(max-width: 768px)'); const isMobile = useMediaQuery('(max-width: 768px)');
@@ -15,24 +15,20 @@ export default function LayoutModalNew({ opened, onClose, description, onYes, lo
} }
}} opened={opened} onClose={onClose} withCloseButton={false} centered closeOnClickOutside={false}> }} opened={opened} onClose={onClose} withCloseButton={false} centered closeOnClickOutside={false}>
<Flex justify={"center"} align={"center"} direction={"column"}> <Flex justify={"center"} align={"center"} direction={"column"}>
<BsQuestionCircleFill size={100} color="red" /> <IoIosWarning size={130} color="red" />
<Text mt={30} ta={"center"} fw={"bold"} fz={18}>{description}</Text> <Text mt={20} ta={"center"} fw={"bold"} fz={18}>{description}</Text>
</Flex> </Flex>
<Button mt={30} fullWidth size="lg" radius={'xl'} bg={'blue'} onClick={() => onCheck(true)}>Lihat Data</Button> <Button mt={30} fullWidth size="lg" radius={'xl'} bg={'blue'} onClick={() => onCheck(true)}>Lihat Data</Button>
<SimpleGrid mt={10} cols={{ base: 1, sm: 2, lg: 2 }}> <SimpleGrid mt={10} cols={{ base: 1, sm: 2, lg: 2 }}>
{isMobile ? {isMobile ?
<> <>
<Button loading={loading} fullWidth size="lg" radius={'xl'} bg={'green'} onClick={() => { <Button loading={loading} fullWidth size="lg" radius={'xl'} bg={'#dcdcdc'} c={'#858e96'} onClick={() => { onYes(true) }}>YA</Button>
onYes(true)
}}>YA</Button>
<Button fullWidth size="lg" radius={'xl'} bg={'#F1C1CF'} c={'#D30B30'} onClick={() => onYes(false)}>TIDAK</Button> <Button fullWidth size="lg" radius={'xl'} bg={'#F1C1CF'} c={'#D30B30'} onClick={() => onYes(false)}>TIDAK</Button>
</> </>
: :
<> <>
<Button loading={loading} fullWidth size="lg" radius={'xl'} bg={'#dcdcdc'} c={'#858e96'} onClick={() => { onYes(true) }}>YA</Button>
<Button fullWidth size="lg" radius={'xl'} bg={'#F1C1CF'} c={'#D30B30'} onClick={() => onYes(false)}>TIDAK</Button> <Button fullWidth size="lg" radius={'xl'} bg={'#F1C1CF'} c={'#D30B30'} onClick={() => onYes(false)}>TIDAK</Button>
<Button loading={loading} fullWidth size="lg" radius={'xl'} bg={'green'} onClick={() => {
onYes(true)
}}>YA</Button>
</> </>
} }