Merge pull request 'nico/5-mar-26/fix-musik-fix-apbdes' (#75) from nico/5-mar-26/fix-musik-fix-apbdes into staggingweb
Reviewed-on: #75
This commit is contained in:
@@ -5,13 +5,17 @@ import { toast } from "react-toastify";
|
||||
import { proxy } from "valtio";
|
||||
import { z } from "zod";
|
||||
|
||||
// --- Zod Schema untuk APBDes Item (tanpa field kalkulasi) ---
|
||||
// --- Zod Schema untuk APBDes Item (dengan field kalkulasi) ---
|
||||
const ApbdesItemSchema = z.object({
|
||||
kode: z.string().min(1, "Kode wajib diisi"),
|
||||
uraian: z.string().min(1, "Uraian wajib diisi"),
|
||||
anggaran: z.number().min(0, "Anggaran tidak boleh negatif"),
|
||||
level: z.number().int().min(1).max(3),
|
||||
tipe: z.enum(['pendapatan', 'belanja', 'pembiayaan']).nullable().optional(),
|
||||
// Field kalkulasi dari realisasiItems (auto-calculated di backend)
|
||||
realisasi: z.number().min(0).default(0),
|
||||
selisih: z.number().default(0),
|
||||
persentase: z.number().default(0),
|
||||
});
|
||||
|
||||
const ApbdesFormSchema = z.object({
|
||||
@@ -19,8 +23,9 @@ const ApbdesFormSchema = z.object({
|
||||
name: z.string().optional(),
|
||||
deskripsi: z.string().optional(),
|
||||
jumlah: z.string().optional(),
|
||||
imageId: z.string().min(1, "Gambar wajib diunggah"),
|
||||
fileId: z.string().min(1, "File wajib diunggah"),
|
||||
// Image dan file opsional (bisa kosong)
|
||||
imageId: z.string().optional(),
|
||||
fileId: z.string().optional(),
|
||||
items: z.array(ApbdesItemSchema).min(1, "Minimal ada 1 item"),
|
||||
});
|
||||
|
||||
@@ -35,7 +40,7 @@ const defaultApbdesForm = {
|
||||
items: [] as z.infer<typeof ApbdesItemSchema>[],
|
||||
};
|
||||
|
||||
// --- Helper: Normalize item (tanpa kalkulasi, backend yang hitung) ---
|
||||
// --- Helper: Normalize item (dengan field kalkulasi) ---
|
||||
function normalizeItem(item: Partial<z.infer<typeof ApbdesItemSchema>>): z.infer<typeof ApbdesItemSchema> {
|
||||
return {
|
||||
kode: item.kode || "",
|
||||
@@ -43,6 +48,9 @@ function normalizeItem(item: Partial<z.infer<typeof ApbdesItemSchema>>): z.infer
|
||||
anggaran: item.anggaran ?? 0,
|
||||
level: item.level || 1,
|
||||
tipe: item.tipe ?? null,
|
||||
realisasi: item.realisasi ?? 0,
|
||||
selisih: item.selisih ?? 0,
|
||||
persentase: item.persentase ?? 0,
|
||||
};
|
||||
}
|
||||
|
||||
@@ -248,6 +256,9 @@ const apbdes = proxy({
|
||||
kode: item.kode,
|
||||
uraian: item.uraian,
|
||||
anggaran: item.anggaran,
|
||||
realisasi: item.totalRealisasi || 0,
|
||||
selisih: item.selisih || 0,
|
||||
persentase: item.persentase || 0,
|
||||
level: item.level,
|
||||
tipe: item.tipe || 'pendapatan',
|
||||
})),
|
||||
@@ -275,11 +286,24 @@ const apbdes = proxy({
|
||||
try {
|
||||
this.loading = true;
|
||||
// Include the ID in the request body
|
||||
// Omit realisasi, selisih, persentase karena itu calculated fields di backend
|
||||
const requestData = {
|
||||
...parsed.data,
|
||||
id: this.id, // Add the ID to the request body
|
||||
tahun: parsed.data.tahun,
|
||||
name: parsed.data.name,
|
||||
deskripsi: parsed.data.deskripsi,
|
||||
jumlah: parsed.data.jumlah,
|
||||
imageId: parsed.data.imageId,
|
||||
fileId: parsed.data.fileId,
|
||||
id: this.id,
|
||||
items: parsed.data.items.map(item => ({
|
||||
kode: item.kode,
|
||||
uraian: item.uraian,
|
||||
anggaran: item.anggaran,
|
||||
level: item.level,
|
||||
tipe: item.tipe ?? null,
|
||||
})),
|
||||
};
|
||||
|
||||
|
||||
const res = await (ApiFetch.api.landingpage.apbdes as any)[this.id].put(requestData);
|
||||
|
||||
if (res.data?.success) {
|
||||
|
||||
@@ -44,6 +44,9 @@ type ItemForm = {
|
||||
anggaran: number;
|
||||
level: number;
|
||||
tipe: 'pendapatan' | 'belanja' | 'pembiayaan';
|
||||
realisasi?: number;
|
||||
selisih?: number;
|
||||
persentase?: number;
|
||||
};
|
||||
|
||||
function EditAPBDes() {
|
||||
@@ -72,6 +75,9 @@ function EditAPBDes() {
|
||||
anggaran: 0,
|
||||
level: 1,
|
||||
tipe: 'pendapatan',
|
||||
realisasi: 0,
|
||||
selisih: 0,
|
||||
persentase: 0,
|
||||
});
|
||||
|
||||
// Simpan data original untuk reset form
|
||||
@@ -125,9 +131,9 @@ function EditAPBDes() {
|
||||
kode: item.kode,
|
||||
uraian: item.uraian,
|
||||
anggaran: item.anggaran,
|
||||
realisasi: item.realisasi,
|
||||
selisih: item.selisih,
|
||||
persentase: item.persentase,
|
||||
realisasi: item.totalRealisasi || 0,
|
||||
selisih: item.selisih || 0,
|
||||
persentase: item.persentase || 0,
|
||||
level: item.level,
|
||||
tipe: item.tipe || 'pendapatan',
|
||||
})),
|
||||
@@ -155,7 +161,7 @@ function EditAPBDes() {
|
||||
};
|
||||
|
||||
const handleAddItem = () => {
|
||||
const { kode, uraian, anggaran, level, tipe } = newItem;
|
||||
const { kode, uraian, anggaran, level, tipe, realisasi, selisih, persentase } = newItem;
|
||||
if (!kode || !uraian) {
|
||||
return toast.warn('Kode dan uraian wajib diisi');
|
||||
}
|
||||
@@ -166,6 +172,9 @@ function EditAPBDes() {
|
||||
kode,
|
||||
uraian,
|
||||
anggaran,
|
||||
realisasi: realisasi || 0,
|
||||
selisih: selisih || 0,
|
||||
persentase: persentase || 0,
|
||||
level,
|
||||
tipe: finalTipe,
|
||||
});
|
||||
@@ -176,6 +185,9 @@ function EditAPBDes() {
|
||||
anggaran: 0,
|
||||
level: 1,
|
||||
tipe: 'pendapatan',
|
||||
realisasi: 0,
|
||||
selisih: 0,
|
||||
persentase: 0,
|
||||
});
|
||||
};
|
||||
|
||||
@@ -193,7 +205,6 @@ function EditAPBDes() {
|
||||
|
||||
// Upload file baru jika ada perubahan
|
||||
if (imageFile) {
|
||||
// Hapus file lama dari form jika ada file baru
|
||||
const res = await ApiFetch.api.fileStorage.create.post({
|
||||
file: imageFile,
|
||||
name: imageFile.name,
|
||||
@@ -205,7 +216,6 @@ function EditAPBDes() {
|
||||
}
|
||||
|
||||
if (docFile) {
|
||||
// Hapus file lama dari form jika ada file baru
|
||||
const res = await ApiFetch.api.fileStorage.create.post({
|
||||
file: docFile,
|
||||
name: docFile.name,
|
||||
@@ -216,15 +226,7 @@ function EditAPBDes() {
|
||||
}
|
||||
}
|
||||
|
||||
// Jika tidak ada file baru, gunakan ID lama (sudah ada di form)
|
||||
// Pastikan imageId dan fileId tetap ada
|
||||
if (!apbdesState.edit.form.imageId) {
|
||||
return toast.warn('Gambar wajib diunggah');
|
||||
}
|
||||
if (!apbdesState.edit.form.fileId) {
|
||||
return toast.warn('Dokumen wajib diunggah');
|
||||
}
|
||||
|
||||
// Image dan file sekarang opsional, tidak perlu validasi
|
||||
const success = await apbdesState.edit.update();
|
||||
if (success) {
|
||||
router.push('/admin/landing-page/apbdes');
|
||||
@@ -264,6 +266,9 @@ function EditAPBDes() {
|
||||
anggaran: 0,
|
||||
level: 1,
|
||||
tipe: 'pendapatan',
|
||||
realisasi: 0,
|
||||
selisih: 0,
|
||||
persentase: 0,
|
||||
});
|
||||
|
||||
toast.info('Form dikembalikan ke data awal');
|
||||
@@ -328,11 +333,11 @@ function EditAPBDes() {
|
||||
required
|
||||
/>
|
||||
|
||||
{/* Gambar & Dokumen */}
|
||||
{/* Gambar & Dokumen (Opsional) */}
|
||||
<Stack gap="xs">
|
||||
<Box>
|
||||
<Text fw="bold" fz="sm" mb={6}>
|
||||
Gambar APBDes
|
||||
Gambar APBDes (Opsional)
|
||||
</Text>
|
||||
<Dropzone
|
||||
onDrop={handleDrop('image')}
|
||||
@@ -372,6 +377,7 @@ function EditAPBDes() {
|
||||
onClick={() => {
|
||||
setPreviewImage(null);
|
||||
setImageFile(null);
|
||||
apbdesState.edit.form.imageId = ''; // Clear imageId from form
|
||||
}}
|
||||
>
|
||||
<IconX size={14} />
|
||||
@@ -382,7 +388,7 @@ function EditAPBDes() {
|
||||
|
||||
<Box>
|
||||
<Text fw="bold" fz="sm" mb={6}>
|
||||
Dokumen APBDes
|
||||
Dokumen APBDes (Opsional)
|
||||
</Text>
|
||||
<Dropzone
|
||||
onDrop={handleDrop('doc')}
|
||||
@@ -431,6 +437,7 @@ function EditAPBDes() {
|
||||
onClick={() => {
|
||||
setPreviewDoc(null);
|
||||
setDocFile(null);
|
||||
apbdesState.edit.form.fileId = ''; // Clear fileId from form
|
||||
}}
|
||||
>
|
||||
<IconX size={14} />
|
||||
@@ -527,6 +534,9 @@ function EditAPBDes() {
|
||||
<th>Kode</th>
|
||||
<th>Uraian</th>
|
||||
<th>Anggaran</th>
|
||||
<th>Realisasi</th>
|
||||
<th>Selisih</th>
|
||||
<th>%</th>
|
||||
<th>Level</th>
|
||||
<th>Tipe</th>
|
||||
<th style={{ width: '50px' }}>Aksi</th>
|
||||
@@ -542,6 +552,11 @@ function EditAPBDes() {
|
||||
</td>
|
||||
<td>{item.uraian}</td>
|
||||
<td>{item.anggaran.toLocaleString('id-ID')}</td>
|
||||
<td>{item.realisasi?.toLocaleString('id-ID') || '0'}</td>
|
||||
<td style={{ color: item.selisih && item.selisih > 0 ? 'red' : 'green' }}>
|
||||
{item.selisih?.toLocaleString('id-ID') || '0'}
|
||||
</td>
|
||||
<td>{item.persentase?.toFixed(2) || '0'}%</td>
|
||||
<td>
|
||||
<Badge size="sm" color={item.level === 1 ? 'blue' : item.level === 2 ? 'green' : 'grape'}>
|
||||
L{item.level}
|
||||
|
||||
@@ -46,13 +46,9 @@ function CreateAPBDes() {
|
||||
const [docFile, setDocFile] = useState<File | null>(null);
|
||||
const [isSubmitting, setIsSubmitting] = useState(false);
|
||||
|
||||
// Check if form is valid
|
||||
// Check if form is valid - hanya cek items, gambar dan file opsional
|
||||
const isFormValid = () => {
|
||||
return (
|
||||
imageFile !== null &&
|
||||
docFile !== null &&
|
||||
stateAPBDes.create.form.items.length > 0
|
||||
);
|
||||
return stateAPBDes.create.form.items.length > 0;
|
||||
};
|
||||
|
||||
// Form sementara untuk input item baru
|
||||
@@ -84,28 +80,34 @@ function CreateAPBDes() {
|
||||
};
|
||||
|
||||
const handleSubmit = async () => {
|
||||
if (!imageFile || !docFile) {
|
||||
return toast.warn("Pilih gambar dan dokumen terlebih dahulu");
|
||||
}
|
||||
if (stateAPBDes.create.form.items.length === 0) {
|
||||
return toast.warn("Minimal tambahkan 1 item APBDes");
|
||||
}
|
||||
|
||||
try {
|
||||
setIsSubmitting(true);
|
||||
const [uploadImageRes, uploadDocRes] = await Promise.all([
|
||||
ApiFetch.api.fileStorage.create.post({ file: imageFile, name: imageFile.name }),
|
||||
ApiFetch.api.fileStorage.create.post({ file: docFile, name: docFile.name }),
|
||||
]);
|
||||
|
||||
const imageId = uploadImageRes?.data?.data?.id;
|
||||
const fileId = uploadDocRes?.data?.data?.id;
|
||||
// Upload files hanya jika ada file yang dipilih
|
||||
let imageId = '';
|
||||
let fileId = '';
|
||||
|
||||
if (!imageId || !fileId) {
|
||||
return toast.error("Gagal mengupload file");
|
||||
if (imageFile) {
|
||||
const uploadImageRes = await ApiFetch.api.fileStorage.create.post({
|
||||
file: imageFile,
|
||||
name: imageFile.name,
|
||||
});
|
||||
imageId = uploadImageRes?.data?.data?.id || '';
|
||||
}
|
||||
|
||||
// Update form dengan ID file
|
||||
if (docFile) {
|
||||
const uploadDocRes = await ApiFetch.api.fileStorage.create.post({
|
||||
file: docFile,
|
||||
name: docFile.name,
|
||||
});
|
||||
fileId = uploadDocRes?.data?.data?.id || '';
|
||||
}
|
||||
|
||||
// Update form dengan ID file (bisa kosong)
|
||||
stateAPBDes.create.form.imageId = imageId;
|
||||
stateAPBDes.create.form.fileId = fileId;
|
||||
|
||||
@@ -174,12 +176,16 @@ function CreateAPBDes() {
|
||||
style={{ border: '1px solid #e0e0e0' }}
|
||||
>
|
||||
<Stack gap="md">
|
||||
{/* Gambar & Dokumen (dipendekkan untuk fokus pada items) */}
|
||||
{/* Info: File opsional */}
|
||||
<Text fz="sm" c="dimmed" mb="xs">
|
||||
* Upload gambar dan dokumen bersifat opsional. Bisa dikosongkan jika belum ada.
|
||||
</Text>
|
||||
|
||||
<Stack gap={"xs"}>
|
||||
{/* Gambar APBDes */}
|
||||
<Box>
|
||||
<Text fw="bold" fz="sm" mb={6}>
|
||||
Gambar APBDes
|
||||
Gambar APBDes (Opsional)
|
||||
</Text>
|
||||
<Dropzone
|
||||
onDrop={(files) => {
|
||||
@@ -249,10 +255,10 @@ function CreateAPBDes() {
|
||||
)}
|
||||
</Box>
|
||||
|
||||
{/* Dokumen APBDes */}
|
||||
{/* Dokumen APBDes (Opsional) */}
|
||||
<Box>
|
||||
<Text fw="bold" fz="sm" mb={6}>
|
||||
Dokumen APBDes
|
||||
Dokumen APBDes (Opsional)
|
||||
</Text>
|
||||
<Dropzone
|
||||
onDrop={(files) => {
|
||||
|
||||
Reference in New Issue
Block a user