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

Merge pull request 'Fix Edit di Admin APbdes, dan fix data real di apbdes user' (#13) from nico/18-nov-25 into staging

Browse Source 
Reviewed-on: http://wibugit.wibudev.com/wibu/desa-darmasaba/pulls/13

Fix Edit di Admin APbdes, dan fix data real di apbdes user
This commit is contained in:
nicoarya20
2025-11-18 16:26:59 +08:00
parent fb010bd05a 2608a5ffdd
commit afe8c70cef
7 changed files with 56 additions and 163 deletions
Download Patch File Download Diff File Expand all files Collapse all files

65
src/app/admin/(dashboard)/_state/landing-page/apbdes.ts
View File

@@ -7,14 +7,14 @@ import { z } from "zod";
// --- Zod Schema ---
const ApbdesItemSchema = z.object({
kode: z.string().min(1),
uraian: z.string().min(1),
kode: z.string().min(1, "Kode wajib diisi"),
uraian: z.string().min(1, "Uraian wajib diisi"),
anggaran: z.number().min(0),
realisasi: z.number().min(0),
selisih: z.number(),
persentase: z.number().min(0).max(1000), // allow >100% if overbudget
persentase: z.number(),
level: z.number().int().min(1).max(3),
tipe: z.string().min(1), // "pendapatan" | "belanja"
tipe: z.enum(['pendapatan', 'belanja', 'pembiayaan']).nullable().optional(),
});
const ApbdesFormSchema = z.object({
@@ -37,6 +37,9 @@ const defaultApbdesForm = {
function normalizeItem(item: Partial<z.infer<typeof ApbdesItemSchema>>): z.infer<typeof ApbdesItemSchema> {
const anggaran = item.anggaran ?? 0;
const realisasi = item.realisasi ?? 0;
// ✅ Formula yang benar
const selisih = anggaran - realisasi; // positif = sisa anggaran, negatif = over budget
@@ -56,58 +59,6 @@ function normalizeItem(item: Partial<z.infer<typeof ApbdesItemSchema>>): z.infer
// --- State Utama ---
const apbdes = proxy({
// create: {
// form: { ...defaultApbdesForm },
// loading: false,
// addItem(item: Partial<z.infer<typeof ApbdesItemSchema>>) {
// const normalized = normalizeItem(item);
// this.form.items.push(normalized);
// },
// removeItem(index: number) {
// this.form.items.splice(index, 1);
// },
// updateItem(index: number, updates: Partial<z.infer<typeof ApbdesItemSchema>>) {
// const current = this.form.items[index];
// if (current) {
// const updated = normalizeItem({ ...current, ...updates });
// this.form.items[index] = updated;
// }
// },
// reset() {
// this.form = { ...defaultApbdesForm };
// },
// async create() {
// const parsed = ApbdesFormSchema.safeParse(this.form);
// if (!parsed.success) {
// const errors = parsed.error.issues.map((issue) => `${issue.path.join(".")} - ${issue.message}`);
// toast.error(`Validasi gagal:\n${errors.join("\n")}`);
// return;
// }
// try {
// this.loading = true;
// const res = await ApiFetch.api.landingpage.apbdes["create"].post(parsed.data);
// if (res.data?.success) {
// toast.success("APBDes berhasil dibuat");
// apbdes.findMany.load();
// this.reset();
// } else {
// toast.error(res.data?.message || "Gagal membuat APBDes");
// }
// } catch (error: any) {
// console.error("Create APBDes error:", error);
// toast.error(error?.message || "Terjadi kesalahan saat membuat APBDes");
// } finally {
// this.loading = false;
// }
// },
// },
create: {
form: { ...defaultApbdesForm },
loading: false,
@@ -305,7 +256,7 @@ const apbdes = proxy({
selisih: item.selisih,
persentase: item.persentase,
level: item.level,
tipe: item.tipe,
tipe: item.tipe || 'pendapatan',
})),
};
return data;

37
src/app/admin/(dashboard)/landing-page/apbdes/[id]/edit/page.tsx
View File

@@ -115,20 +115,22 @@ function EditAPBDes() {
if (!kode || !uraian) {
return toast.warn('Kode dan uraian wajib diisi');
}
const finalTipe = level === 1 ? 'pendapatan' : tipe; // Berikan default
const selisih = realisasi - anggaran;
const persentase = anggaran > 0 ? (realisasi / anggaran) * 100 : 0;
const selisih = realisasi - anggaran;
const persentase = anggaran > 0 ? (realisasi / anggaran) * 100 : 0;
apbdesState.edit.addItem({
kode,
uraian,
anggaran,
realisasi,
selisih,
persentase,
level,
tipe: finalTipe, // ✅ Tidak akan undefined
});
apbdesState.edit.addItem({
kode,
uraian,
anggaran,
realisasi,
selisih,
persentase,
level,
tipe,
});
setNewItem({
kode: '',
@@ -374,6 +376,7 @@ function EditAPBDes() {
data={[
{ value: 'pendapatan', label: 'Pendapatan' },
{ value: 'belanja', label: 'Belanja' },
{ value: 'pembiayaan', label: 'Pembiayaan' },
]}
value={newItem.tipe}
onChange={(val) => setNewItem({ ...newItem, tipe: (val as any) || 'pendapatan' })}
@@ -447,9 +450,13 @@ function EditAPBDes() {
</Badge>
</td>
<td>
<Badge size="sm" color={item.tipe === 'pendapatan' ? 'teal' : 'red'}>
{item.tipe}
</Badge>
{item.tipe ? (
<Badge color={item.tipe === 'pendapatan' ? 'teal' : 'red'} size="sm">
{item.tipe}
</Badge>
) : (
'-'
)}
</td>
<td>
<ActionIcon color="red" onClick={() => handleRemoveItem(idx)}>

4
src/app/admin/(dashboard)/landing-page/apbdes/create/page.tsx
View File

@@ -123,6 +123,8 @@ function CreateAPBDes() {
return toast.warn("Kode dan uraian wajib diisi");
}
const finalTipe = level === 1 ? 'pendapatan' : tipe; // Berikan default
const selisih = realisasi - anggaran;
const persentase = anggaran > 0 ? (realisasi / anggaran) * 100 : 0;
@@ -134,7 +136,7 @@ function CreateAPBDes() {
selisih,
persentase,
level,
tipe,
tipe: finalTipe,
});
// Reset form input

2
src/app/api/[[...slugs]]/_lib/landing_page/apbdes/create.ts
View File

@@ -12,7 +12,7 @@ type APBDesItemInput = {
selisih: number;
persentase: number;
level: number;
tipe: string;
tipe?: string | null;
};
type FormCreate = {

2
src/app/api/[[...slugs]]/_lib/landing_page/apbdes/index.ts
View File

@@ -15,7 +15,7 @@ const ApbdesItemSchema = t.Object({
selisih: t.Number(),
persentase: t.Number(),
level: t.Number(),
tipe: t.String(), // misal: "pendapatan" atau "belanja"
tipe: t.Optional(t.Union([t.String(), t.Null()])) // misal: "pendapatan" atau "belanja"
});
const APBDes = new Elysia({

4
src/app/api/[[...slugs]]/_lib/landing_page/apbdes/updt.ts
View File

@@ -10,7 +10,7 @@ type APBDesItemInput = {
selisih: number;
persentase: number;
level: number;
tipe: string;
tipe?: string | null;
};
type FormUpdateBody = {
@@ -54,7 +54,7 @@ export default async function apbdesUpdate(context: Context) {
selisih: item.anggaran - item.realisasi,
persentase: item.anggaran > 0 ? (item.realisasi / item.anggaran) * 100 : 0,
level: item.level,
tipe: item.tipe,
tipe: item.tipe || null,
isActive: true,
})),
});

105
src/app/darmasaba/_com/main-page/apbdes/index.tsx
View File

@@ -1,25 +1,15 @@
/* eslint-disable @typescript-eslint/no-explicit-any */
/* eslint-disable react-hooks/exhaustive-deps */
'use client'
import apbdes from '@/app/admin/(dashboard)/_state/landing-page/apbdes'
import APBDesProgress from '@/app/darmasaba/(tambahan)/apbdes/lib/apbDesaProgress'
import colors from '@/con/colors'
import { BarChart } from '@mantine/charts'
import { ActionIcon, BackgroundImage, Box, Button, Center, Flex, Group, Loader, Paper, SimpleGrid, Stack, Text, Title } from '@mantine/core'
import { ActionIcon, BackgroundImage, Box, Button, Center, Flex, Group, Loader, SimpleGrid, Stack, Text } from '@mantine/core'
import { IconDownload } from '@tabler/icons-react'
import Link from 'next/link'
import { useEffect, useState } from 'react'
import { useProxy } from 'valtio/utils'
import parseJumlah from './lib/convert'
function Apbdes() {
type APBDes = {
id: string
name: string
jumlah: number
};
const [chartData, setChartData] = useState<APBDes[]>([])
const [mounted, setMounted] = useState(false);
const state = useProxy(apbdes)
const [loading, setLoading] = useState(false)
@@ -28,22 +18,9 @@ function Apbdes() {
des: 'Transparansi APBDes Darmasaba adalah langkah nyata menuju tata kelola desa yang bersih, terbuka, dan bertanggung jawab.'
}
useEffect(() => {
if (state.findMany.data) {
setChartData(
state.findMany.data.map((item: any) => ({
id: item.id,
name: item.name,
jumlah: parseJumlah(item.jumlah),
}))
);
}
}, [state.findMany.data]);
useEffect(() => {
const loadData = async () => {
try {
setMounted(true);
setLoading(true)
await state.findMany.load()
} catch (error) {
@@ -70,56 +47,23 @@ function Apbdes() {
</Stack>
</Box>
{/* Chart */}
<Box mt={30} style={{ width: '100%', minHeight: 400 }}>
<Paper bg={colors['white-1']} py={50} px={90} mb={"xl"} radius="md" withBorder>
<Stack gap={"xs"}>
<Title ta={"center"} pb={10} order={2}>
Grafik APBDes
</Title>
{mounted && chartData.length > 0 ? (
<BarChart
orientation="vertical"
h={450}
barProps={{ radius: 50 }}
data={chartData}
dataKey="name"
type="stacked"
valueFormatter={(value: number) => {
if (value >= 1_000_000_000_000)
return `Rp ${(value / 1_000_000_000_000).toFixed(1)} T`;
if (value >= 1_000_000_000)
return `Rp ${(value / 1_000_000_000).toFixed(1)} M`;
if (value >= 1_000_000)
return `Rp ${(value / 1_000_000).toFixed(1)} JT`;
if (value >= 1_000)
return `Rp ${(value / 1_000).toFixed(1)} RB`;
return `Rp ${value}`;
}}
series={[
{
name: 'jumlah',
color: colors['blue-button'],
label: 'Jumlah',
},
]}
/>
) : (
<Text c="dimmed">Belum ada data untuk ditampilkan dalam grafik</Text>
)}
<Box py={10}>
<Group justify='center'>
<Flex align="center" gap={10}>
<Box bg={colors['blue-button']} w={20} h={20} />
<Text>Jumlah</Text>
</Flex>
</Group>
</Box>
</Stack>
</Paper>
</Box>
<Group justify="center">
<Button
component={Link}
href="/darmasaba/apbdes"
radius="xl"
size="lg"
variant="gradient"
gradient={{ from: "#26667F", to: "#124170" }}
>
Lihat Semua Data
</Button>
</Group>
<SimpleGrid cols={{ base: 1, sm: 3 }} spacing="lg">
{/* Chart */}
<APBDesProgress />
<SimpleGrid mx={{ base: 'md', md: 100 }} cols={{ base: 1, sm: 3 }} spacing="lg" pb={"xl"}>
{loading ? (
<Center mih={200}>
<Loader size="lg" color="blue" />
@@ -185,18 +129,7 @@ function Apbdes() {
)}
</SimpleGrid>
<Group justify="center" pb={"xl"}>
<Button
component={Link}
href="/darmasaba/apbdes"
radius="xl"
size="lg"
variant="gradient"
gradient={{ from: "#26667F", to: "#124170" }}
>
Lihat Semua Data
</Button>
</Group>
</Stack>
)
}