101 lines
3.3 KiB
TypeScript
101 lines
3.3 KiB
TypeScript
'use client'
|
|
import { Button } from '@nextui-org/button';
|
|
import { Textarea } from '@nextui-org/input';
|
|
import { useState } from 'react';
|
|
|
|
export default function FormReport() {
|
|
|
|
const [formData, setFormData] = useState({
|
|
date: '',
|
|
location: '',
|
|
attachment: '',
|
|
complaint: '',
|
|
complaintLink: '',
|
|
voiceNote: '',
|
|
});
|
|
|
|
const handleChange = (e: any) => {
|
|
const { name, value } = e.target;
|
|
setFormData((prevData) => ({
|
|
...prevData,
|
|
[name]: value,
|
|
}));
|
|
}
|
|
|
|
const handleDateChange = (e: any) => {
|
|
const { value } = e.target;
|
|
setFormData((prevData) => ({
|
|
...prevData,
|
|
date: value,
|
|
}));
|
|
};
|
|
|
|
const handleSubmit = () => {
|
|
// Lakukan apa pun yang diperlukan dengan data formulir
|
|
console.log('Data formulir yang dikirim:', formData);
|
|
console.log('Tanggal yang dipilih:', formData.date);
|
|
// Contoh: Kirim data ke server atau lakukan tindakan lainnya
|
|
};
|
|
|
|
return (
|
|
<div className=''>
|
|
<div className='text-[#1A328E] font-bold text-center'>
|
|
<p className='text-3xl pt-3'>Lapor Pelanggan Pemilu</p>
|
|
<p className='text-sm pt-5'>Portal Laporan Pengaduan Online Pelanggaran Pemilu</p>
|
|
</div>
|
|
<div className='space-y-5 container mx-auto pt-10'>
|
|
<div>
|
|
<p>Tanggal</p>
|
|
<input
|
|
className='w-full border-2 rounded-md p-1 mt-2 bg-transparent'
|
|
type="date"
|
|
name='date'
|
|
value={formData.date}
|
|
onChange={handleDateChange}
|
|
/>
|
|
</div>
|
|
{/* <div>
|
|
<p>Lokasi Kejadian</p>
|
|
</div> */}
|
|
<div>
|
|
<p>Lampiran Aduan</p>
|
|
<input className='border-2 w-full mt-2' type="file" accept="image/*, text/*" name="file" />
|
|
</div>
|
|
<div>
|
|
<p>Isi Aduan</p>
|
|
<Textarea
|
|
placeholder="Masukkan Link Pendukung"
|
|
className="w-full mt-2"
|
|
variant='bordered'
|
|
name='complaint'
|
|
value={formData.complaint}
|
|
onChange={handleChange}
|
|
/>
|
|
</div>
|
|
<div>
|
|
<p>Link Pengaduan</p>
|
|
<Textarea
|
|
placeholder="Masukkan Link Pendukung"
|
|
className="w-full mt-2"
|
|
variant='bordered'
|
|
name='complaintLink'
|
|
value={formData.complaintLink}
|
|
onChange={handleChange}
|
|
/>
|
|
</div>
|
|
{/* <div>
|
|
<p>Voice Note</p>
|
|
</div> */}
|
|
<div>
|
|
<Button
|
|
className='bg-[#1A328E] w-full my-4 text-white'
|
|
onClick={handleSubmit}
|
|
>
|
|
Kirim
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|