Fix QC Kak Inno Admin, Fix QC Keano UI User, Fix QC Pak jun tabel apbdes

2025-11-12 17:42:31 +08:00
parent 417a8937f5
commit 9622eb5a9a
354 changed files with 11444 additions and 4012 deletions
--- a/src/app/admin/(dashboard)/kesehatan/data-kesehatan-warga/jadwal_kegiatan/[id]/edit/page.tsx
+++ b/src/app/admin/(dashboard)/kesehatan/data-kesehatan-warga/jadwal_kegiatan/[id]/edit/page.tsx
@@ -4,7 +4,7 @@
 import EditEditor from '@/app/admin/(dashboard)/_com/editEditor';
 import jadwalKegiatanState from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/jadwalKegiatan';
 import colors from '@/con/colors';
-import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
+import { Box, Button, Group, Loader, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
 import { IconArrowBack } from '@tabler/icons-react';
 import { useParams, useRouter } from 'next/navigation';
 import { useEffect, useState } from 'react';
@@ -39,7 +39,10 @@ function EditJadwalKegiatan() {
  const router = useRouter();
  const params = useParams();

+  const [isSubmitting, setIsSubmitting] = useState(false);
  const [formData, setFormData] = useState<JadwalKegiatanFormBase>(emptyForm());
+  const [originalData, setOriginalData] = useState<JadwalKegiatanFormBase>(emptyForm());
+

  // Helper untuk update nested state
  const updateNested = <
@@ -85,6 +88,19 @@ function EditJadwalKegiatan() {
            syaratKetentuanJadwalKegiatan: { content: form.syaratKetentuanJadwalKegiatan?.content || '' },
            dokumenJadwalKegiatan: { content: form.dokumenJadwalKegiatan?.content || '' },
          });
+          setOriginalData({
+            content: form.content || '',
+            informasiJadwalKegiatan: {
+              name: form.informasiJadwalKegiatan?.name || '',
+              tanggal: form.informasiJadwalKegiatan?.tanggal || '',
+              waktu: form.informasiJadwalKegiatan?.waktu || '',
+              lokasi: form.informasiJadwalKegiatan?.lokasi || '',
+            },
+            deskripsiJadwalKegiatan: { deskripsi: form.deskripsiJadwalKegiatan?.deskripsi || '' },
+            layananJadwalKegiatan: { content: form.layananJadwalKegiatan?.content || '' },
+            syaratKetentuanJadwalKegiatan: { content: form.syaratKetentuanJadwalKegiatan?.content || '' },
+            dokumenJadwalKegiatan: { content: form.dokumenJadwalKegiatan?.content || '' },
+          });
        }
      } catch (error) {
        console.error("Error loading jadwal kegiatan:", error);
@@ -94,8 +110,26 @@ function EditJadwalKegiatan() {
    loadJadwalKegiatan();
  }, [params?.id]);

+  const handleResetForm = () => {
+    setFormData({
+      content: originalData.content || '',
+      informasiJadwalKegiatan: {
+        name: originalData.informasiJadwalKegiatan?.name || '',
+        tanggal: originalData.informasiJadwalKegiatan?.tanggal || '',
+        waktu: originalData.informasiJadwalKegiatan?.waktu || '',
+        lokasi: originalData.informasiJadwalKegiatan?.lokasi || '',
+      },
+      deskripsiJadwalKegiatan: { deskripsi: originalData.deskripsiJadwalKegiatan?.deskripsi || '' },
+      layananJadwalKegiatan: { content: originalData.layananJadwalKegiatan?.content || '' },
+      syaratKetentuanJadwalKegiatan: { content: originalData.syaratKetentuanJadwalKegiatan?.content || '' },
+      dokumenJadwalKegiatan: { content: originalData.dokumenJadwalKegiatan?.content || '' },
+    });
+    toast.info("Form dikembalikan ke data awal");
+  };
+
  const handleSubmit = async () => {
    try {
+      setIsSubmitting(true);
      stateJadwalKegiatan.edit.form = { ...stateJadwalKegiatan.edit.form, ...formData };
      const success = await stateJadwalKegiatan.edit.submit();
      if (success) {
@@ -105,6 +139,8 @@ function EditJadwalKegiatan() {
    } catch (error) {
      console.error("Error updating jadwal kegiatan:", error);
      toast.error(error instanceof Error ? error.message : "Gagal memperbarui data jadwal kegiatan");
+    } finally {
+      setIsSubmitting(false);
    }
  };

@@ -190,6 +226,17 @@ function EditJadwalKegiatan() {

          {/* Submit */}
          <Group justify="right">
+            <Button
+              variant="outline"
+              color="gray"
+              radius="md"
+              size="md"
+              onClick={handleResetForm}
+            >
+              Batal
+            </Button>
+
+            {/* Tombol Simpan */}
            <Button
              onClick={handleSubmit}
              radius="md"
@@ -200,7 +247,7 @@ function EditJadwalKegiatan() {
                boxShadow: '0 4px 15px rgba(79, 172, 254, 0.4)',
              }}
            >
-              Simpan
+              {isSubmitting ? <Loader size="sm" color="white" /> : 'Simpan'}
            </Button>
          </Group>
        </Stack>
--- a/src/app/admin/(dashboard)/kesehatan/data-kesehatan-warga/jadwal_kegiatan/create/page.tsx
+++ b/src/app/admin/(dashboard)/kesehatan/data-kesehatan-warga/jadwal_kegiatan/create/page.tsx
@@ -6,6 +6,7 @@ import {
  Box,
  Button,
  Group,
+  Loader,
  Paper,
  Stack,
  Text,
@@ -14,12 +15,14 @@ import {
 } from '@mantine/core';
 import { IconArrowBack } from '@tabler/icons-react';
 import { useRouter } from 'next/navigation';
+import { useState } from 'react';
 import { toast } from 'react-toastify';
 import { useProxy } from 'valtio/utils';

 function CreateJadwalKegiatan() {
  const stateJadwalKegiatan = useProxy(jadwalKegiatanState);
  const router = useRouter();
+  const [isSubmitting, setIsSubmitting] = useState(false);

  const resetForm = () => {
    stateJadwalKegiatan.create.form = {
@@ -47,11 +50,18 @@ function CreateJadwalKegiatan() {

  const handleSubmit = async (e: React.FormEvent) => {
    e.preventDefault();
-    await stateJadwalKegiatan.create.submit();
-
-    toast.success('Data berhasil disimpan');
-    resetForm();
-    router.push('/admin/kesehatan/data-kesehatan-warga/jadwal_kegiatan');
+    try {
+      setIsSubmitting(true);
+      await stateJadwalKegiatan.create.submit();
+      toast.success('Data berhasil disimpan');
+      resetForm();
+      router.push('/admin/kesehatan/data-kesehatan-warga/jadwal_kegiatan');
+    } catch (error) {
+      console.error(error);
+      toast.error('Gagal menyimpan data jadwal kegiatan');
+    } finally {
+      setIsSubmitting(false);
+    }
  };

  return (
@@ -84,7 +94,7 @@ function CreateJadwalKegiatan() {
          <TextInput
            label="Nama Jadwal Kegiatan"
            placeholder="Masukkan nama jadwal kegiatan"
-            defaultValue={stateJadwalKegiatan.create.form.content}
+            value={stateJadwalKegiatan.create.form.content}
            onChange={(e) => {
              stateJadwalKegiatan.create.form.content = e.target.value;
            }}
@@ -107,7 +117,7 @@ function CreateJadwalKegiatan() {
              label="Nama"
              required
              placeholder="Masukkan nama"
-              defaultValue={stateJadwalKegiatan.create.form.informasiJadwalKegiatan.name}
+              value={stateJadwalKegiatan.create.form.informasiJadwalKegiatan.name}
              onChange={(e) => {
                stateJadwalKegiatan.create.form.informasiJadwalKegiatan.name = e.target.value;
              }}
@@ -116,7 +126,7 @@ function CreateJadwalKegiatan() {
              type="date"
              required
              label="Tanggal"
-              defaultValue={stateJadwalKegiatan.create.form.informasiJadwalKegiatan.tanggal}
+              value={stateJadwalKegiatan.create.form.informasiJadwalKegiatan.tanggal}
              onChange={(e) => {
                stateJadwalKegiatan.create.form.informasiJadwalKegiatan.tanggal = e.target.value;
              }}
@@ -125,7 +135,7 @@ function CreateJadwalKegiatan() {
              label="Waktu"
              required
              placeholder="Masukkan waktu"
-              defaultValue={stateJadwalKegiatan.create.form.informasiJadwalKegiatan.waktu}
+              value={stateJadwalKegiatan.create.form.informasiJadwalKegiatan.waktu}
              onChange={(e) => {
                stateJadwalKegiatan.create.form.informasiJadwalKegiatan.waktu = e.target.value;
              }}
@@ -134,7 +144,7 @@ function CreateJadwalKegiatan() {
              label="Lokasi"
              required
              placeholder="Masukkan lokasi"
-              defaultValue={stateJadwalKegiatan.create.form.informasiJadwalKegiatan.lokasi}
+              value={stateJadwalKegiatan.create.form.informasiJadwalKegiatan.lokasi}
              onChange={(e) => {
                stateJadwalKegiatan.create.form.informasiJadwalKegiatan.lokasi = e.target.value;
              }}
@@ -172,8 +182,20 @@ function CreateJadwalKegiatan() {
          </Box>
          {/* Save Button */}
          <Group justify="right">
+            {/* Tombol Batal */}
            <Button
-              type="submit"
+              variant="outline"
+              color="gray"
+              radius="md"
+              size="md"
+              onClick={resetForm}
+            >
+              Reset
+            </Button>
+
+            {/* Tombol Simpan */}
+            <Button
+              onClick={handleSubmit}
              radius="md"
              size="md"
              style={{
@@ -182,7 +204,7 @@ function CreateJadwalKegiatan() {
                boxShadow: '0 4px 15px rgba(79, 172, 254, 0.4)',
              }}
            >
-              Simpan
+              {isSubmitting ? <Loader size="sm" color="white" /> : 'Simpan'}
            </Button>
          </Group>
        </Stack>
--- a/src/app/admin/(dashboard)/kesehatan/data-kesehatan-warga/jadwal_kegiatan/page.tsx
+++ b/src/app/admin/(dashboard)/kesehatan/data-kesehatan-warga/jadwal_kegiatan/page.tsx
@@ -19,7 +19,7 @@ import {
  Title
 } from '@mantine/core';
 import { useShallowEffect } from '@mantine/hooks';
-import { IconArrowBack, IconDeviceImacCog, IconPlus, IconSearch } from '@tabler/icons-react';
+import { IconDeviceImacCog, IconPlus, IconSearch } from '@tabler/icons-react';
 import { useRouter } from 'next/navigation';
 import { useState } from 'react';
 import { useProxy } from 'valtio/utils';
@@ -27,18 +27,10 @@ import HeaderSearch from '../../../_com/header';
 import jadwalKegiatanState from '../../../_state/kesehatan/data_kesehatan_warga/jadwalKegiatan';

 function JadwalKegiatan() {
-  const router = useRouter();
  const [search, setSearch] = useState("");

  return (
    <Box>
-      {/* Tombol Back */}
-      <Box mb={10}>
-        <Button variant="subtle" onClick={() => router.back()}>
-          <IconArrowBack color={colors["blue-button"]} size={25} />
-        </Button>
-      </Box>
-
      {/* Header Search */}
      <HeaderSearch
        title="Jadwal Kegiatan"