fix tampilan admin menu inovasi, sisa menu lingkungan
This commit is contained in:
@@ -3,55 +3,23 @@ import jadwalkegiatanState from '@/app/admin/(dashboard)/_state/kesehatan/data_k
|
||||
import BackButton from '@/app/darmasaba/(pages)/desa/layanan/_com/BackButto';
|
||||
import colors from '@/con/colors';
|
||||
import {
|
||||
ActionIcon,
|
||||
Box,
|
||||
Button,
|
||||
Combobox,
|
||||
ComboboxChevron,
|
||||
ComboboxOption,
|
||||
ComboboxOptions,
|
||||
ComboboxTarget,
|
||||
Divider,
|
||||
Group,
|
||||
InputBase,
|
||||
InputPlaceholder,
|
||||
Paper,
|
||||
Skeleton,
|
||||
Stack,
|
||||
Text,
|
||||
Textarea,
|
||||
TextInput,
|
||||
useCombobox
|
||||
Text
|
||||
} from '@mantine/core';
|
||||
import { DateInput } from '@mantine/dates';
|
||||
import { useShallowEffect } from '@mantine/hooks';
|
||||
import { IconCalendar, IconDownload, IconPhone, IconMail, IconUser } from '@tabler/icons-react';
|
||||
import { IconDownload, IconMail, IconPhone, IconUser } from '@tabler/icons-react';
|
||||
import { useParams } from 'next/navigation';
|
||||
import { useState } from 'react';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import CreatePendaftaran from '../create/page';
|
||||
|
||||
const layanan = [
|
||||
'Penimbangan',
|
||||
'Imunisasi',
|
||||
'Vitamin A',
|
||||
'Konsultasi Gizi',
|
||||
'Pemeriksaan Kesehatan'
|
||||
];
|
||||
|
||||
function Page() {
|
||||
const combobox = useCombobox({
|
||||
onDropdownClose: () => combobox.resetSelectedOption(),
|
||||
onDropdownOpen: (eventSource) => {
|
||||
if (eventSource === 'keyboard') {
|
||||
combobox.selectActiveOption();
|
||||
} else {
|
||||
combobox.updateSelectedOptionIndex('active');
|
||||
}
|
||||
},
|
||||
});
|
||||
|
||||
const [value, setValue] = useState<string | null>('');
|
||||
const [dateInputOpened, setDateInputOpened] = useState(false);
|
||||
const params = useParams();
|
||||
const state = useProxy(jadwalkegiatanState);
|
||||
|
||||
@@ -59,20 +27,7 @@ function Page() {
|
||||
state.findUnique.load(params?.id as string);
|
||||
}, []);
|
||||
|
||||
const options = layanan.map((item) => (
|
||||
<ComboboxOption value={item} key={item} active={item === value}>
|
||||
<Group gap="xs">
|
||||
{item === value && <IconUser size={14} stroke={2} />}
|
||||
<span>{item}</span>
|
||||
</Group>
|
||||
</ComboboxOption>
|
||||
));
|
||||
|
||||
const pickerControl = (
|
||||
<ActionIcon onClick={() => setDateInputOpened(true)} variant="light" color="blue">
|
||||
<IconCalendar size={18} />
|
||||
</ActionIcon>
|
||||
);
|
||||
|
||||
if (!state.findUnique.data) {
|
||||
return (
|
||||
@@ -133,56 +88,7 @@ function Page() {
|
||||
<Text ta="justify" fz="md" dangerouslySetInnerHTML={{ __html: state.findUnique.data.dokumenjadwalkegiatan.content }} />
|
||||
</Stack>
|
||||
|
||||
<Stack gap="sm">
|
||||
<Text fz="lg" fw="bold">Formulir Pendaftaran</Text>
|
||||
<Divider />
|
||||
<Stack gap="md">
|
||||
<TextInput label="Nama Balita" placeholder="Masukkan nama balita" size="md" />
|
||||
<DateInput
|
||||
label="Tanggal Lahir"
|
||||
placeholder="dd/mm/yyyy"
|
||||
size="md"
|
||||
w={{ base: '100%', md: '85%', lg: '75%', xl: '50%' }}
|
||||
popoverProps={{ opened: dateInputOpened, onChange: setDateInputOpened }}
|
||||
rightSection={pickerControl}
|
||||
/>
|
||||
<TextInput label="Nama Orang Tua / Wali" placeholder="Masukkan nama orang tua / wali" size="md" />
|
||||
<TextInput label="Nomor Telepon" placeholder="Masukkan nomor telepon" size="md" />
|
||||
<TextInput label="Alamat" placeholder="Masukkan alamat lengkap" size="md" />
|
||||
<Box w={{ base: '100%', md: '85%', lg: '75%', xl: '50%' }}>
|
||||
<Text fz="sm" fw="bold" pb={4}>Pilih Layanan</Text>
|
||||
<Combobox
|
||||
store={combobox}
|
||||
resetSelectionOnOptionHover
|
||||
withinPortal={false}
|
||||
onOptionSubmit={(val) => {
|
||||
setValue(val);
|
||||
combobox.updateSelectedOptionIndex('active');
|
||||
}}
|
||||
>
|
||||
<ComboboxTarget targetType="button">
|
||||
<InputBase
|
||||
component="button"
|
||||
type="button"
|
||||
pointer
|
||||
rightSection={<ComboboxChevron />}
|
||||
rightSectionPointerEvents="none"
|
||||
onClick={() => combobox.toggleDropdown()}
|
||||
>
|
||||
{value || <InputPlaceholder>Pilih layanan</InputPlaceholder>}
|
||||
</InputBase>
|
||||
</ComboboxTarget>
|
||||
<Combobox.Dropdown>
|
||||
<ComboboxOptions>{options}</ComboboxOptions>
|
||||
</Combobox.Dropdown>
|
||||
</Combobox>
|
||||
</Box>
|
||||
<Textarea label="Catatan Khusus (Opsional)" placeholder="Masukkan catatan jika ada" size="md" />
|
||||
<Button size="md" radius="lg" bg={colors['blue-button']}>
|
||||
Daftar Sekarang
|
||||
</Button>
|
||||
</Stack>
|
||||
</Stack>
|
||||
<CreatePendaftaran />
|
||||
|
||||
<Paper p="lg" radius="md" bg={colors['blue-button-trans']} shadow="sm">
|
||||
<Stack gap="xs">
|
||||
|
||||
Reference in New Issue
Block a user