SURVET LAYANAN MASYARAKAT - EKO SUBIANTORO'S BLOG

SURVET LAYANAN MASYARAKAT

import React, { useState } from 'react'; const App = () => { const [formData, setFormData] = useState({ nama: '', whatsapp: '', instansi: '', layanan: '', lainnyaText: '', }); const [responses, setResponses] = useState({}); const [isSubmitting, setIsSubmitting] = useState(false); const [isSubmitted, setIsSubmitted] = useState(false); // --- PENTING: GANTI TEKS DI BAWAH INI DENGAN URL WEB APP DARI GOOGLE APPS SCRIPT --- // Contoh: https://script.google.com/macros/s/AKfy.../exec const scriptURL = 'URL_WEB_APP_ANDA_DI_SINI'; const options = [ { value: 1, label: 'Sangat Tidak Puas' }, { value: 2, label: 'Tidak Puas' }, { value: 3, label: 'Cukup' }, { value: 4, label: 'Puas' }, { value: 5, label: 'Sangat Puas' } ]; const questions = { 'Legalisir Ijazah': [ 'Kemudahan dalam proses pengajuan legalisir ijazah', 'Kejelasan persyaratan legalisir ijazah', 'Kecepatan penyelesaian legalisir ijazah', 'Ketepatan hasil legalisir (tidak ada kesalahan dokumen)', 'Pelayanan petugas selama proses legalisir' ], 'Mutasi Murid': [ 'Kemudahan prosedur mutasi murid', 'Kejelasan informasi terkait persyaratan mutasi', 'Kecepatan proses administrasi mutasi', 'Bantuan petugas dalam proses mutasi', 'Kelancaran komunikasi selama proses mutasi' ], 'Pelayanan PIP': [ 'Kejelasan informasi mengenai PIP', 'Kemudahan dalam proses pengajuan PIP', 'Ketepatan data yang digunakan dalam pengajuan', 'Kecepatan pelayanan terkait PIP', 'Transparansi informasi penerima PIP' ] }; const handleInputChange = (e) => { const { name, value } = e.target; setFormData({ ...formData, [name]: value }); if (name === 'layanan') setResponses({}); }; const handleResponseChange = (questionIndex, value) => { setResponses({ ...responses, [questionIndex]: value }); }; const handleSubmit = async (e) => { if (e) e.preventDefault(); // 1. Validasi Input if (!formData.nama.trim() || !formData.whatsapp.trim() || !formData.instansi.trim() || !formData.layanan) { alert('Mohon lengkapi bagian Identitas dan pilih Jenis Layanan.'); return; } if (formData.layanan !== 'Lainnya') { const totalQuestions = questions[formData.layanan].length; if (Object.keys(responses).length < totalQuestions) { alert('Mohon berikan penilaian untuk semua poin pertanyaan.'); return; } } else if (!formData.lainnyaText.trim()) { alert('Mohon isi keterangan untuk layanan lainnya.'); return; } setIsSubmitting(true); // --- SIMULASI PENGIRIMAN UNTUK DEMO / PRATINJAU --- // Jika URL belum diganti, kita jalankan simulasi agar tombol terlihat bekerja if (scriptURL === 'https://script.google.com/macros/s/AKfycbzbeae9FCXKl5XilzXBpZ2t8Ji4v8fSjGHar9ScvoBv4xSCLFkfAL6p_Wn-9il_FiAn/exec' || !scriptURL.includes('script.google.com')) { console.log('Menjalankan simulasi pengiriman karena URL belum diatur...'); setTimeout(() => { setIsSubmitting(false); setIsSubmitted(true); window.scrollTo({ top: 0, behavior: 'smooth' }); }, 1500); // Simulasi delay jaringan 1.5 detik return; } // --- PENGIRIMAN ASLI KE GOOGLE APPS SCRIPT --- try { // Menggunakan URLSearchParams agar format data sesuai dengan yang diharapkan Google Apps Script (POST form) const params = new URLSearchParams(); params.append('nama', formData.nama); params.append('whatsapp', formData.whatsapp); params.append('instansi', formData.instansi); params.append('layanan', formData.layanan); params.append('lainnyaText', formData.lainnyaText); // Menambahkan skor pertanyaan Object.keys(responses).forEach(key => { params.append(`skor_${parseInt(key) + 1}`, responses[key]); }); // Pengiriman data await fetch(scriptURL, { method: 'POST', mode: 'no-cors', // Penting untuk Apps Script headers: { 'Content-Type': 'application/x-www-form-urlencoded', }, body: params.toString(), }); // Jika menggunakan no-cors, kita tidak bisa membaca response sukses, // jadi kita asumsikan sukses jika tidak masuk ke catch. setIsSubmitting(false); setIsSubmitted(true); window.scrollTo({ top: 0, behavior: 'smooth' }); } catch (error) { console.error('Error pengiriman:', error); setIsSubmitting(false); alert('Gagal mengirim data. Pastikan Apps Script sudah di-deploy sebagai "Web App" dan akses diatur ke "Anyone".'); } }; if (isSubmitted) { return (

BERHASIL!

Terima kasih. Hasil survei Anda telah kami simpan dengan aman di sistem SD NEGERI 1 SUMBERBARU.

); } return (
{/* CSS Khusus untuk animasi fadeIn */}