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)/lingkungan/program-penghijauan/[id]/edit/page.tsx
+++ b/src/app/admin/(dashboard)/lingkungan/program-penghijauan/[id]/edit/page.tsx
@@ -9,6 +9,7 @@ import {
  Box,
  Button,
  Group,
+  Loader,
  Paper,
  Stack,
  Text,
@@ -47,6 +48,7 @@ function EditProgramPenghijauan() {
  const stateProgramPenghijauan = useProxy(programPenghijauanState);
  const params = useParams();
  const router = useRouter();
+  const [isSubmitting, setIsSubmitting] = useState(false);

  const [formData, setFormData] = useState<FormProgramPenghijauan>({
    name: '',
@@ -55,6 +57,13 @@ function EditProgramPenghijauan() {
    icon: '',
  });

+  const [originalData, setOriginalData] = useState<FormProgramPenghijauan>({
+    name: '',
+    judul: '',
+    deskripsi: '',
+    icon: '',
+  });
+
  // Load data program penghijauan
  useEffect(() => {
    const loadProgram = async () => {
@@ -71,6 +80,12 @@ function EditProgramPenghijauan() {
            deskripsi: data.deskripsi,
            icon: data.icon,
          });
+          setOriginalData({
+            name: data.name,
+            judul: data.judul,
+            deskripsi: data.deskripsi,
+            icon: data.icon,
+          });
        }
      } catch (error) {
        console.error('Error loading program penghijauan:', error);
@@ -81,9 +96,20 @@ function EditProgramPenghijauan() {
    loadProgram();
  }, [params?.id]);

+  const handleResetForm = () => {
+    setFormData({
+      name: originalData.name,
+      judul: originalData.judul,
+      deskripsi: originalData.deskripsi,
+      icon: originalData.icon,
+    });
+    toast.info('Form dikembalikan ke data awal');
+  };
+
  // Hanya update global state saat submit
  const handleSubmit = async () => {
    try {
+      setIsSubmitting(true);
      stateProgramPenghijauan.update.form = {
        name: formData.name.trim(),
        judul: formData.judul.trim(),
@@ -97,6 +123,8 @@ function EditProgramPenghijauan() {
    } catch (error) {
      console.error('Error updating program penghijauan:', error);
      toast.error('Gagal memperbarui program penghijauan');
+    } finally {
+      setIsSubmitting(false);
    }
  };

@@ -173,6 +201,17 @@ function EditProgramPenghijauan() {

          {/* Tombol simpan */}
          <Group justify="flex-end">
+            <Button
+              variant="outline"
+              color="gray"
+              radius="md"
+              size="md"
+              onClick={handleResetForm}
+            >
+              Batal
+            </Button>
+
+            {/* Tombol Simpan */}
            <Button
              onClick={handleSubmit}
              radius="md"
@@ -183,7 +222,7 @@ function EditProgramPenghijauan() {
                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)/lingkungan/program-penghijauan/[id]/page.tsx
+++ b/src/app/admin/(dashboard)/lingkungan/program-penghijauan/[id]/page.tsx
@@ -4,9 +4,13 @@ import colors from '@/con/colors';
 import { Box, Button, Group, Paper, Skeleton, Stack, Text } from '@mantine/core';
 import { useShallowEffect } from '@mantine/hooks';
 import {
-  IconArrowBack, IconChartLine, IconChristmasTreeFilled, IconClipboard,
-  IconEdit, IconHomeEco, IconLeaf, IconRecycle, IconScale,
-  IconShieldFilled, IconTent, IconTrash, IconTrendingUp,
+  IconAlertTriangle,
+  IconAmbulance,
+  IconArrowBack, IconBuilding, IconCash, IconChartLine, IconChristmasTreeFilled, IconClipboard,
+  IconDroplet,
+  IconEdit, IconFiretruck, IconHome, IconHomeEco, IconHospital, IconLeaf, IconRecycle, IconScale,
+  IconSchool,
+  IconShieldFilled, IconShoppingCart, IconTent, IconTrash, IconTree, IconTrendingUp,
  IconTrophy, IconTruck
 } from '@tabler/icons-react';
 import { useParams, useRouter } from 'next/navigation';
@@ -24,18 +28,31 @@ function DetailProgramPenghijauan() {

  const iconMap: Record<string, React.FC<any>> = {
    ekowisata: IconLeaf,
-    kompetisi: IconTrophy,
-    wisata: IconTent,
-    ekonomi: IconChartLine,
-    sampah: IconRecycle,
-    truck: IconTruck,
-    scale: IconScale,
-    clipboard: IconClipboard,
-    trash: IconTrash,
-    lingkunganSehat: IconHomeEco,
-    sumberOksigen: IconChristmasTreeFilled,
-    ekonomiBerkelanjutan: IconTrendingUp,
-    mencegahBencana: IconShieldFilled,
+  kompetisi: IconTrophy,
+  wisata: IconTent,
+  ekonomi: IconChartLine,
+  sampah: IconRecycle,
+  truck: IconTruck,
+  scale: IconScale,
+  clipboard: IconClipboard,
+  trash: IconTrash,
+  lingkunganSehat: IconHomeEco,
+  sumberOksigen: IconChristmasTreeFilled,
+  ekonomiBerkelanjutan: IconTrendingUp,
+  mencegahBencana: IconShieldFilled,
+  rumah: IconHome,
+  pohon: IconTree,
+  air: IconDroplet,
+  bantuan: IconCash,
+  pelatihan: IconSchool,
+  subsidi: IconShoppingCart,
+  layananKesehatan: IconHospital,
+  polisi: IconShieldFilled,
+  ambulans: IconAmbulance,
+  pemadam: IconFiretruck,
+  rumahSakit: IconHospital,
+  bangunan: IconBuilding,
+  darurat: IconAlertTriangle
  };

  useShallowEffect(() => {
@@ -96,7 +113,7 @@ function DetailProgramPenghijauan() {

              <Box>
                <Text fz="lg" fw="bold">Ikon Program</Text>
-                {iconMap[data?.icon] ? (
+                {iconMap[data?.icon]  ? (
                  <Box title={data?.icon}>
                    {React.createElement(iconMap[data.icon], { size: 28, color: colors['blue-button'] })}
                  </Box>
--- a/src/app/admin/(dashboard)/lingkungan/program-penghijauan/create/page.tsx
+++ b/src/app/admin/(dashboard)/lingkungan/program-penghijauan/create/page.tsx
@@ -4,6 +4,7 @@ import {
  Box,
  Button,
  Group,
+  Loader,
  Paper,
  Stack,
  Text,
@@ -16,10 +17,13 @@ import { useProxy } from 'valtio/utils';
 import CreateEditor from '../../../_com/createEditor';
 import SelectIconProgram from '../../../_com/selectIcon';
 import programPenghijauanState from '../../../_state/lingkungan/program-penghijauan';
+import { toast } from 'react-toastify';
+import { useState } from 'react';

 function CreateProgramPenghijauan() {
  const stateCreate = useProxy(programPenghijauanState);
  const router = useRouter();
+  const [isSubmitting, setIsSubmitting] = useState(false);

  const resetForm = () => {
    stateCreate.create.form = {
@@ -31,9 +35,17 @@ function CreateProgramPenghijauan() {
  };

  const handleSubmit = async () => {
-    await stateCreate.create.create();
-    resetForm();
-    router.push('/admin/lingkungan/program-penghijauan');
+    try {
+      setIsSubmitting(true);
+      await stateCreate.create.create();
+      resetForm();
+      router.push('/admin/lingkungan/program-penghijauan');
+    } catch (error) {
+      console.error(error);
+      toast.error(error instanceof Error ? error.message : 'Gagal menambahkan program penghijauan');
+    } finally {
+      setIsSubmitting(false);
+    }
  };

  return (
@@ -66,7 +78,7 @@ function CreateProgramPenghijauan() {
          <TextInput
            label={<Text fz="sm" fw="bold">Nama Program Penghijauan</Text>}
            placeholder="Masukkan nama program penghijauan"
-            defaultValue={stateCreate.create.form.name || ''}
+            value={stateCreate.create.form.name || ''}
            onChange={(e) => (stateCreate.create.form.name = e.target.value)}
            required
          />
@@ -83,7 +95,7 @@ function CreateProgramPenghijauan() {
          <TextInput
            label={<Text fz="sm" fw="bold">Judul Deskripsi Program Penghijauan</Text>}
            placeholder="Masukkan judul deskripsi program penghijauan"
-            defaultValue={stateCreate.create.form.judul || ''}
+            value={stateCreate.create.form.judul || ''}
            onChange={(e) => (stateCreate.create.form.judul = e.target.value)}
            required
          />
@@ -101,6 +113,17 @@ function CreateProgramPenghijauan() {
          </Box>

          <Group justify="right" mt="sm">
+            <Button
+              variant="outline"
+              color="gray"
+              radius="md"
+              size="md"
+              onClick={resetForm}
+            >
+              Reset
+            </Button>
+
+            {/* Tombol Simpan */}
            <Button
              onClick={handleSubmit}
              radius="md"
@@ -111,7 +134,7 @@ function CreateProgramPenghijauan() {
                boxShadow: '0 4px 15px rgba(79, 172, 254, 0.4)',
              }}
            >
-              Simpan
+              {isSubmitting ? <Loader size="sm" color="white" /> : 'Simpan'}
            </Button>
          </Group>
        </Stack>