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

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>