wibu/desa-darmasaba
1
0
Fork 0
Code Issues Pull Requests 5 Actions Packages Projects Releases Wiki Activity

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

Browse Source
This commit is contained in:
nico
2025-11-12 17:42:31 +08:00
parent 417a8937f5
commit 9622eb5a9a
354 changed files with 11444 additions and 4012 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
src/app/admin/(dashboard)/lingkungan/gotong-royong/kategori-kegiatan/[id]/page.tsx
View File

@@ -3,7 +3,7 @@
import gotongRoyongState from '@/app/admin/(dashboard)/_state/lingkungan/gotong-royong';
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';
@@ -15,8 +15,10 @@ function EditKategoriKegiatan() {
const params = useParams();
const id = params?.id as string;
const stateKategori = useProxy(gotongRoyongState.kategoriKegiatan);
const [isSubmitting, setIsSubmitting] = useState(false);
const [formData, setFormData] = useState({ nama: '' });
const [originalData, setOriginalData] = useState({ nama: '' });
const [loading, setLoading] = useState(true);
// Load data once
@@ -29,6 +31,7 @@ function EditKategoriKegiatan() {
if (data) {
stateKategori.edit.id = id;
setFormData({ nama: data.nama || '' });
setOriginalData({ nama: data.nama || '' });
}
} catch (err) {
console.error('Error loading kategori kegiatan:', err);
@@ -53,6 +56,7 @@ function EditKategoriKegiatan() {
}
try {
setIsSubmitting(true);
stateKategori.edit.form = { nama: trimmedNama };
if (!stateKategori.edit.id) stateKategori.edit.id = id;
@@ -64,9 +68,18 @@ function EditKategoriKegiatan() {
} catch (err) {
console.error('Error updating kategori kegiatan:', err);
toast.error('Gagal memperbarui kategori kegiatan');
} finally {
setIsSubmitting(false);
}
};
const handleResetForm = () => {
setFormData({
nama: originalData.nama,
});
toast.info('Form dikembalikan ke data awal');
};
if (loading) return <Text>Loading...</Text>;
return (
@@ -98,6 +111,17 @@ function EditKategoriKegiatan() {
/>
<Group justify="right">
<Button
variant="outline"
color="gray"
radius="md"
size="md"
onClick={handleResetForm}
>
Batal
</Button>
{/* Tombol Simpan */}
<Button
onClick={handleSubmit}
radius="md"
@@ -108,7 +132,7 @@ function EditKategoriKegiatan() {
boxShadow: '0 4px 15px rgba(79, 172, 254, 0.4)',
}}
>
Simpan
{isSubmitting ? <Loader size="sm" color="white" /> : 'Simpan'}
</Button>
</Group>
</Stack>

35
src/app/admin/(dashboard)/lingkungan/gotong-royong/kategori-kegiatan/create/page.tsx
View File

@@ -1,16 +1,18 @@
/* eslint-disable react-hooks/exhaustive-deps */
'use client'
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 { useRouter } from 'next/navigation';
import { useEffect } from 'react';
import { useEffect, useState } from 'react';
import { useProxy } from 'valtio/utils';
import gotongRoyongState from '../../../../_state/lingkungan/gotong-royong';
import { toast } from 'react-toastify';
function CreateKategoriKegiatan() {
const router = useRouter();
const stateKategori = useProxy(gotongRoyongState.kategoriKegiatan)
const [isSubmitting, setIsSubmitting] = useState(false);
useEffect(() => {
stateKategori.findMany.load();
@@ -23,9 +25,17 @@ function CreateKategoriKegiatan() {
}
const handleSubmit = async () => {
await stateKategori.create.create();
resetForm();
router.push("/admin/lingkungan/gotong-royong/kategori-kegiatan")
try {
setIsSubmitting(true);
await stateKategori.create.create();
resetForm();
router.push("/admin/lingkungan/gotong-royong/kategori-kegiatan")
} catch (error) {
console.error('Error creating kategori kegiatan:', error);
toast.error('Terjadi kesalahan saat menambahkan kategori kegiatan');
} finally {
setIsSubmitting(false);
}
}
return (
@@ -51,7 +61,7 @@ function CreateKategoriKegiatan() {
>
<Stack gap="md">
<TextInput
defaultValue={stateKategori.create.form.nama}
value={stateKategori.create.form.nama}
onChange={(val) => (stateKategori.create.form.nama = val.target.value)}
label={<Text fw="bold" fz="sm">Nama Kategori Kegiatan</Text>}
placeholder="Masukkan nama kategori kegiatan"
@@ -59,6 +69,17 @@ function CreateKategoriKegiatan() {
/>
<Group justify="right">
<Button
variant="outline"
color="gray"
radius="md"
size="md"
onClick={resetForm}
>
Reset
</Button>
{/* Tombol Simpan */}
<Button
onClick={handleSubmit}
radius="md"
@@ -69,7 +90,7 @@ function CreateKategoriKegiatan() {
boxShadow: '0 4px 15px rgba(79, 172, 254, 0.4)',
}}
>
Simpan
{isSubmitting ? <Loader size="sm" color="white" /> : 'Simpan'}
</Button>
</Group>
</Stack>

86
src/app/admin/(dashboard)/lingkungan/gotong-royong/kegiatan-desa/[id]/edit/page.tsx
View File

@@ -5,10 +5,12 @@ import gotongRoyongState from '@/app/admin/(dashboard)/_state/lingkungan/gotong-
import colors from '@/con/colors';
import ApiFetch from '@/lib/api-fetch';
import {
ActionIcon,
Box,
Button,
Group,
Image,
Loader,
Paper,
Select,
Stack,
@@ -38,6 +40,7 @@ export default function EditKegiatanDesa() {
const kegiatanDesaState = useProxy(gotongRoyongState.kegiatanDesa);
const params = useParams();
const router = useRouter();
const [isSubmitting, setIsSubmitting] = useState(false);
const [formData, setFormData] = useState<FormKegiatanDesa>({
judul: '',
@@ -49,6 +52,18 @@ export default function EditKegiatanDesa() {
imageId: '',
kategoriKegiatanId: '',
});
const [originalData, setOriginalData] = useState({
judul: '',
deskripsiSingkat: '',
deskripsiLengkap: '',
tanggal: '',
lokasi: '',
partisipan: 0,
imageId: '',
imageUrl: '',
kategoriKegiatanId: '',
});
const [file, setFile] = useState<File | null>(null);
const [previewImage, setPreviewImage] = useState<string | null>(null);
@@ -77,10 +92,18 @@ export default function EditKegiatanDesa() {
imageId: data.imageId || '',
kategoriKegiatanId: data.kategoriKegiatanId || '',
});
if (data.imageId) {
// Optional: bisa fetch URL image dari backend
setPreviewImage(`/api/file/${data.imageId}`);
}
setOriginalData({
judul: data.judul || '',
deskripsiSingkat: data.deskripsiSingkat || '',
deskripsiLengkap: data.deskripsiLengkap || '',
tanggal: data.tanggal || '',
lokasi: data.lokasi || '',
partisipan: data.partisipan || 0,
imageId: data.imageId || '',
kategoriKegiatanId: data.kategoriKegiatanId || '',
imageUrl: data.image?.link || "",
});
setPreviewImage(data.image?.link || null);
}
} catch (error) {
console.error(error);
@@ -90,8 +113,24 @@ export default function EditKegiatanDesa() {
loadData();
}, [params?.id]);
const handleResetForm = () => {
setFormData({
judul: originalData.judul,
deskripsiSingkat: originalData.deskripsiSingkat,
deskripsiLengkap: originalData.deskripsiLengkap,
tanggal: originalData.tanggal,
lokasi: originalData.lokasi,
partisipan: originalData.partisipan,
imageId: originalData.imageId,
kategoriKegiatanId: originalData.kategoriKegiatanId,
});
setPreviewImage(originalData.imageUrl || null);
setFile(null);
};
const handleSubmit = async () => {
try {
setIsSubmitting(true);
let imageId = formData.imageId;
if (file) {
const res = await ApiFetch.api.fileStorage.create.post({ file, name: file.name });
@@ -117,6 +156,8 @@ export default function EditKegiatanDesa() {
} catch (error) {
console.error(error);
toast.error('Terjadi kesalahan saat memperbarui kegiatan desa');
} finally {
setIsSubmitting(false);
}
};
@@ -203,7 +244,7 @@ export default function EditKegiatanDesa() {
}}
onReject={() => toast.error('File tidak valid.')}
maxSize={5 * 1024 ** 2}
accept={{ 'image/*': [] }}
accept={{ 'image/*': ['.jpeg', '.jpg', '.png', '.webp'] }}
radius="md"
p="xl"
>
@@ -219,13 +260,13 @@ export default function EditKegiatanDesa() {
</Dropzone.Idle>
<Stack gap="xs" align="center">
<Text size="md" fw={500}>Drag gambar atau klik untuk pilih file</Text>
<Text size="sm" c="dimmed">Maksimal 5MB, format gambar wajib</Text>
<Text size="sm" c="dimmed">Maksimal 5MB, format gambar .png, .jpg, .jpeg, webp</Text>
</Stack>
</Group>
</Dropzone>
{previewImage && (
<Box mt="sm" style={{ display: 'flex', justifyContent: 'center' }}>
<Box pos={"relative"} mt="sm" style={{ display: 'flex', justifyContent: 'center' }}>
<Image
src={previewImage}
alt="Preview"
@@ -233,11 +274,40 @@ export default function EditKegiatanDesa() {
style={{ maxHeight: 220, objectFit: 'contain', border: `1px solid ${colors['blue-button']}` }}
loading="lazy"
/>
<ActionIcon
variant="filled"
color="red"
radius="xl"
size="sm"
pos="absolute"
top={5}
right={5}
onClick={() => {
setPreviewImage(null);
setFile(null);
}}
style={{
boxShadow: '0 2px 6px rgba(0,0,0,0.15)',
}}
>
<IconX size={14} />
</ActionIcon>
</Box>
)}
</Box>
<Group justify="right">
<Button
variant="outline"
color="gray"
radius="md"
size="md"
onClick={handleResetForm}
>
Batal
</Button>
{/* Tombol Simpan */}
<Button
onClick={handleSubmit}
radius="md"
@@ -248,7 +318,7 @@ export default function EditKegiatanDesa() {
boxShadow: '0 4px 15px rgba(79, 172, 254, 0.4)',
}}
>
Simpan
{isSubmitting ? <Loader size="sm" color="white" /> : 'Simpan'}
</Button>
</Group>
</Stack>

95
src/app/admin/(dashboard)/lingkungan/gotong-royong/kegiatan-desa/create/page.tsx
View File

@@ -5,10 +5,12 @@ import gotongRoyongState from '@/app/admin/(dashboard)/_state/lingkungan/gotong-
import colors from '@/con/colors';
import ApiFetch from '@/lib/api-fetch';
import {
ActionIcon,
Box,
Button,
Group,
Image,
Loader,
Paper,
Select,
Stack,
@@ -34,6 +36,8 @@ function CreateKegiatanDesa() {
gotongRoyongState.kategoriKegiatan.findMany.load();
}, []);
const [isSubmitting, setIsSubmitting] = useState(false);
const resetForm = () => {
stateKegiatanDesa.create.form = {
judul: '',
@@ -50,27 +54,35 @@ function CreateKegiatanDesa() {
};
const handleSubmit = async () => {
if (!file) {
return toast.warn('Silakan pilih file gambar terlebih dahulu');
try {
setIsSubmitting(true);
if (!file) {
return toast.warn('Silakan pilih file gambar terlebih dahulu');
}
const res = await ApiFetch.api.fileStorage.create.post({
file,
name: file.name,
});
const uploaded = res.data?.data;
if (!uploaded?.id) {
return toast.error('Gagal mengunggah gambar, silakan coba lagi');
}
stateKegiatanDesa.create.form.imageId = uploaded.id;
await stateKegiatanDesa.create.create();
resetForm();
router.push('/admin/lingkungan/gotong-royong/kegiatan-desa');
} catch (error) {
console.error('Error creating kegiatan desa:', error);
toast.error('Gagal membuat kegiatan desa');
} finally {
setIsSubmitting(false);
}
const res = await ApiFetch.api.fileStorage.create.post({
file,
name: file.name,
});
const uploaded = res.data?.data;
if (!uploaded?.id) {
return toast.error('Gagal mengunggah gambar, silakan coba lagi');
}
stateKegiatanDesa.create.form.imageId = uploaded.id;
await stateKegiatanDesa.create.create();
resetForm();
router.push('/admin/lingkungan/gotong-royong/kegiatan-desa');
};
return (
@@ -115,7 +127,7 @@ function CreateKegiatanDesa() {
}}
onReject={() => toast.error('File tidak valid, gunakan format gambar')}
maxSize={5 * 1024 ** 2}
accept={{ 'image/*': [] }}
accept={{ 'image/*': ['.jpeg', '.jpg', '.png', '.webp'] }}
radius="md"
p="xl"
>
@@ -136,7 +148,7 @@ function CreateKegiatanDesa() {
</Dropzone>
{previewImage && (
<Box mt="sm" style={{ textAlign: 'center' }}>
<Box pos={"relative"} mt="sm" style={{ textAlign: 'center' }}>
<Image
src={previewImage}
alt="Preview Gambar"
@@ -144,6 +156,24 @@ function CreateKegiatanDesa() {
style={{ maxHeight: 200, objectFit: 'contain', border: '1px solid #ddd' }}
loading="lazy"
/>
<ActionIcon
variant="filled"
color="red"
radius="xl"
size="sm"
pos="absolute"
top={5}
right={5}
onClick={() => {
setPreviewImage(null);
setFile(null);
}}
style={{
boxShadow: '0 2px 6px rgba(0,0,0,0.15)',
}}
>
<IconX size={14} />
</ActionIcon>
</Box>
)}
</Box>
@@ -152,7 +182,7 @@ function CreateKegiatanDesa() {
<TextInput
label="Judul Kegiatan"
placeholder="Masukkan judul kegiatan"
defaultValue={stateKegiatanDesa.create.form.judul}
value={stateKegiatanDesa.create.form.judul}
onChange={(e) => (stateKegiatanDesa.create.form.judul = e.target.value)}
required
/>
@@ -168,7 +198,7 @@ function CreateKegiatanDesa() {
<TextInput
type="number"
min={0}
defaultValue={stateKegiatanDesa.create.form.partisipan}
value={stateKegiatanDesa.create.form.partisipan}
onChange={(e) => {
const value = Number(e.target.value);
if (value >= 0) {
@@ -183,7 +213,7 @@ function CreateKegiatanDesa() {
label="Tanggal"
type="date"
placeholder="Contoh: 2022-01-01"
defaultValue={
value={
stateKegiatanDesa.create.form.tanggal
? stateKegiatanDesa.create.form.tanggal.toISOString().split('T')[0]
: ''
@@ -197,7 +227,7 @@ function CreateKegiatanDesa() {
<TextInput
label="Lokasi"
placeholder="Masukkan lokasi kegiatan"
defaultValue={stateKegiatanDesa.create.form.lokasi}
value={stateKegiatanDesa.create.form.lokasi}
onChange={(e) => (stateKegiatanDesa.create.form.lokasi = e.target.value)}
required
/>
@@ -228,6 +258,17 @@ function CreateKegiatanDesa() {
{/* Submit */}
<Group justify="right">
<Button
variant="outline"
color="gray"
radius="md"
size="md"
onClick={resetForm}
>
Reset
</Button>
{/* Tombol Simpan */}
<Button
onClick={handleSubmit}
radius="md"
@@ -238,7 +279,7 @@ function CreateKegiatanDesa() {
boxShadow: '0 4px 15px rgba(79, 172, 254, 0.4)',
}}
>
Simpan
{isSubmitting ? <Loader size="sm" color="white" /> : 'Simpan'}
</Button>
</Group>
</Stack>