Merge pull request #34 from bipproduction/nico/25-jun-25
Nico/25 jun 25
This commit is contained in:
GitHub
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "desa-darmasaba",
|
||||
"version": "0.1.2",
|
||||
"version": "0.1.3",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "next dev --turbopack",
|
||||
|
||||
139
prisma/migrations/20250624034125_24_jun2025/migration.sql
Normal file
139
prisma/migrations/20250624034125_24_jun2025/migration.sql
Normal file
@@ -0,0 +1,139 @@
|
||||
/*
|
||||
Warnings:
|
||||
|
||||
- The primary key for the `DataKematian_Kelahiran` table will be changed. If it partially fails, the table could be left without primary key constraint.
|
||||
|
||||
*/
|
||||
-- AlterTable
|
||||
ALTER TABLE "DataKematian_Kelahiran" DROP CONSTRAINT "DataKematian_Kelahiran_pkey",
|
||||
ALTER COLUMN "id" DROP DEFAULT,
|
||||
ALTER COLUMN "id" SET DATA TYPE TEXT,
|
||||
ADD CONSTRAINT "DataKematian_Kelahiran_pkey" PRIMARY KEY ("id");
|
||||
DROP SEQUENCE "DataKematian_Kelahiran_id_seq";
|
||||
|
||||
-- AlterTable
|
||||
ALTER TABLE "ProfilePPID" ADD COLUMN "imageUrl" TEXT;
|
||||
|
||||
-- CreateTable
|
||||
CREATE TABLE "Puskesmas" (
|
||||
"id" TEXT NOT NULL,
|
||||
"name" TEXT NOT NULL,
|
||||
"alamat" TEXT NOT NULL,
|
||||
"jamId" TEXT NOT NULL,
|
||||
"imageId" TEXT NOT NULL,
|
||||
"kontakId" TEXT NOT NULL,
|
||||
"createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
|
||||
"updatedAt" TIMESTAMP(3) NOT NULL,
|
||||
"deletedAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
|
||||
"isActive" BOOLEAN NOT NULL DEFAULT true,
|
||||
|
||||
CONSTRAINT "Puskesmas_pkey" PRIMARY KEY ("id")
|
||||
);
|
||||
|
||||
-- CreateTable
|
||||
CREATE TABLE "JamOperasional" (
|
||||
"id" TEXT NOT NULL,
|
||||
"workDays" TEXT NOT NULL,
|
||||
"weekDays" TEXT NOT NULL,
|
||||
"holiday" TEXT NOT NULL,
|
||||
"createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
|
||||
"updatedAt" TIMESTAMP(3) NOT NULL,
|
||||
"deletedAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
|
||||
"isActive" BOOLEAN NOT NULL DEFAULT true,
|
||||
|
||||
CONSTRAINT "JamOperasional_pkey" PRIMARY KEY ("id")
|
||||
);
|
||||
|
||||
-- CreateTable
|
||||
CREATE TABLE "KontakPuskesmas" (
|
||||
"id" TEXT NOT NULL,
|
||||
"kontakPuskesmas" TEXT NOT NULL,
|
||||
"email" TEXT NOT NULL,
|
||||
"facebook" TEXT NOT NULL,
|
||||
"kontakUGD" TEXT NOT NULL,
|
||||
"createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
|
||||
"updatedAt" TIMESTAMP(3) NOT NULL,
|
||||
"deletedAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
|
||||
"isActive" BOOLEAN NOT NULL DEFAULT true,
|
||||
|
||||
CONSTRAINT "KontakPuskesmas_pkey" PRIMARY KEY ("id")
|
||||
);
|
||||
|
||||
-- CreateTable
|
||||
CREATE TABLE "ProgramKesehatan" (
|
||||
"id" TEXT NOT NULL,
|
||||
"name" TEXT NOT NULL,
|
||||
"deskripsiSingkat" TEXT NOT NULL,
|
||||
"deskripsi" TEXT NOT NULL,
|
||||
"imageId" TEXT NOT NULL,
|
||||
"createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
|
||||
"updatedAt" TIMESTAMP(3) NOT NULL,
|
||||
"deletedAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
|
||||
"isActive" BOOLEAN NOT NULL DEFAULT true,
|
||||
|
||||
CONSTRAINT "ProgramKesehatan_pkey" PRIMARY KEY ("id")
|
||||
);
|
||||
|
||||
-- CreateTable
|
||||
CREATE TABLE "PenangananDarurat" (
|
||||
"id" TEXT NOT NULL,
|
||||
"name" TEXT NOT NULL,
|
||||
"deskripsi" TEXT NOT NULL,
|
||||
"imageId" TEXT NOT NULL,
|
||||
"createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
|
||||
"updatedAt" TIMESTAMP(3) NOT NULL,
|
||||
"deletedAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
|
||||
"isActive" BOOLEAN NOT NULL DEFAULT true,
|
||||
|
||||
CONSTRAINT "PenangananDarurat_pkey" PRIMARY KEY ("id")
|
||||
);
|
||||
|
||||
-- CreateTable
|
||||
CREATE TABLE "KontakDarurat" (
|
||||
"id" TEXT NOT NULL,
|
||||
"name" TEXT NOT NULL,
|
||||
"deskripsi" TEXT NOT NULL,
|
||||
"imageId" TEXT NOT NULL,
|
||||
"createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
|
||||
"updatedAt" TIMESTAMP(3) NOT NULL,
|
||||
"deletedAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
|
||||
"isActive" BOOLEAN NOT NULL DEFAULT true,
|
||||
|
||||
CONSTRAINT "KontakDarurat_pkey" PRIMARY KEY ("id")
|
||||
);
|
||||
|
||||
-- CreateTable
|
||||
CREATE TABLE "InfoWabahPenyakit" (
|
||||
"id" TEXT NOT NULL,
|
||||
"name" TEXT NOT NULL,
|
||||
"deskripsiSingkat" TEXT NOT NULL,
|
||||
"deskripsiLengkap" TEXT NOT NULL,
|
||||
"imageId" TEXT NOT NULL,
|
||||
"createdAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
|
||||
"updatedAt" TIMESTAMP(3) NOT NULL,
|
||||
"deletedAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP,
|
||||
"isActive" BOOLEAN NOT NULL DEFAULT true,
|
||||
|
||||
CONSTRAINT "InfoWabahPenyakit_pkey" PRIMARY KEY ("id")
|
||||
);
|
||||
|
||||
-- AddForeignKey
|
||||
ALTER TABLE "Puskesmas" ADD CONSTRAINT "Puskesmas_jamId_fkey" FOREIGN KEY ("jamId") REFERENCES "JamOperasional"("id") ON DELETE RESTRICT ON UPDATE CASCADE;
|
||||
|
||||
-- AddForeignKey
|
||||
ALTER TABLE "Puskesmas" ADD CONSTRAINT "Puskesmas_imageId_fkey" FOREIGN KEY ("imageId") REFERENCES "FileStorage"("id") ON DELETE RESTRICT ON UPDATE CASCADE;
|
||||
|
||||
-- AddForeignKey
|
||||
ALTER TABLE "Puskesmas" ADD CONSTRAINT "Puskesmas_kontakId_fkey" FOREIGN KEY ("kontakId") REFERENCES "KontakPuskesmas"("id") ON DELETE RESTRICT ON UPDATE CASCADE;
|
||||
|
||||
-- AddForeignKey
|
||||
ALTER TABLE "ProgramKesehatan" ADD CONSTRAINT "ProgramKesehatan_imageId_fkey" FOREIGN KEY ("imageId") REFERENCES "FileStorage"("id") ON DELETE RESTRICT ON UPDATE CASCADE;
|
||||
|
||||
-- AddForeignKey
|
||||
ALTER TABLE "PenangananDarurat" ADD CONSTRAINT "PenangananDarurat_imageId_fkey" FOREIGN KEY ("imageId") REFERENCES "FileStorage"("id") ON DELETE RESTRICT ON UPDATE CASCADE;
|
||||
|
||||
-- AddForeignKey
|
||||
ALTER TABLE "KontakDarurat" ADD CONSTRAINT "KontakDarurat_imageId_fkey" FOREIGN KEY ("imageId") REFERENCES "FileStorage"("id") ON DELETE RESTRICT ON UPDATE CASCADE;
|
||||
|
||||
-- AddForeignKey
|
||||
ALTER TABLE "InfoWabahPenyakit" ADD CONSTRAINT "InfoWabahPenyakit_imageId_fkey" FOREIGN KEY ("imageId") REFERENCES "FileStorage"("id") ON DELETE RESTRICT ON UPDATE CASCADE;
|
||||
12
prisma/migrations/20250624061829_24jun2025_2/migration.sql
Normal file
12
prisma/migrations/20250624061829_24jun2025_2/migration.sql
Normal file
@@ -0,0 +1,12 @@
|
||||
/*
|
||||
Warnings:
|
||||
|
||||
- The primary key for the `GrafikKepuasan` table will be changed. If it partially fails, the table could be left without primary key constraint.
|
||||
|
||||
*/
|
||||
-- AlterTable
|
||||
ALTER TABLE "GrafikKepuasan" DROP CONSTRAINT "GrafikKepuasan_pkey",
|
||||
ALTER COLUMN "id" DROP DEFAULT,
|
||||
ALTER COLUMN "id" SET DATA TYPE TEXT,
|
||||
ADD CONSTRAINT "GrafikKepuasan_pkey" PRIMARY KEY ("id");
|
||||
DROP SEQUENCE "GrafikKepuasan_id_seq";
|
||||
96
prisma/migrations/20250625035558_25jun2025_1/migration.sql
Normal file
96
prisma/migrations/20250625035558_25jun2025_1/migration.sql
Normal file
@@ -0,0 +1,96 @@
|
||||
/*
|
||||
Warnings:
|
||||
|
||||
- You are about to drop the `_DokterdanTenagaMedisToFasilitasKesehatan` table. If the table is not empty, all the data it contains will be lost.
|
||||
- You are about to drop the `_FasilitasKesehatanToFasilitasPendukung` table. If the table is not empty, all the data it contains will be lost.
|
||||
- You are about to drop the `_FasilitasKesehatanToInformasiUmum` table. If the table is not empty, all the data it contains will be lost.
|
||||
- You are about to drop the `_FasilitasKesehatanToLayananUnggulan` table. If the table is not empty, all the data it contains will be lost.
|
||||
- You are about to drop the `_FasilitasKesehatanToProsedurPendaftaran` table. If the table is not empty, all the data it contains will be lost.
|
||||
- You are about to drop the `_FasilitasKesehatanToTarifDanLayanan` table. If the table is not empty, all the data it contains will be lost.
|
||||
- Added the required column `dokterdanTenagaMedisId` to the `FasilitasKesehatan` table without a default value. This is not possible if the table is not empty.
|
||||
- Added the required column `fasilitasPendukungId` to the `FasilitasKesehatan` table without a default value. This is not possible if the table is not empty.
|
||||
- Added the required column `informasiUmumId` to the `FasilitasKesehatan` table without a default value. This is not possible if the table is not empty.
|
||||
- Added the required column `layananUnggulanId` to the `FasilitasKesehatan` table without a default value. This is not possible if the table is not empty.
|
||||
- Added the required column `prosedurPendaftaranId` to the `FasilitasKesehatan` table without a default value. This is not possible if the table is not empty.
|
||||
- Added the required column `tarifDanLayananId` to the `FasilitasKesehatan` table without a default value. This is not possible if the table is not empty.
|
||||
|
||||
*/
|
||||
-- DropForeignKey
|
||||
ALTER TABLE "_DokterdanTenagaMedisToFasilitasKesehatan" DROP CONSTRAINT "_DokterdanTenagaMedisToFasilitasKesehatan_A_fkey";
|
||||
|
||||
-- DropForeignKey
|
||||
ALTER TABLE "_DokterdanTenagaMedisToFasilitasKesehatan" DROP CONSTRAINT "_DokterdanTenagaMedisToFasilitasKesehatan_B_fkey";
|
||||
|
||||
-- DropForeignKey
|
||||
ALTER TABLE "_FasilitasKesehatanToFasilitasPendukung" DROP CONSTRAINT "_FasilitasKesehatanToFasilitasPendukung_A_fkey";
|
||||
|
||||
-- DropForeignKey
|
||||
ALTER TABLE "_FasilitasKesehatanToFasilitasPendukung" DROP CONSTRAINT "_FasilitasKesehatanToFasilitasPendukung_B_fkey";
|
||||
|
||||
-- DropForeignKey
|
||||
ALTER TABLE "_FasilitasKesehatanToInformasiUmum" DROP CONSTRAINT "_FasilitasKesehatanToInformasiUmum_A_fkey";
|
||||
|
||||
-- DropForeignKey
|
||||
ALTER TABLE "_FasilitasKesehatanToInformasiUmum" DROP CONSTRAINT "_FasilitasKesehatanToInformasiUmum_B_fkey";
|
||||
|
||||
-- DropForeignKey
|
||||
ALTER TABLE "_FasilitasKesehatanToLayananUnggulan" DROP CONSTRAINT "_FasilitasKesehatanToLayananUnggulan_A_fkey";
|
||||
|
||||
-- DropForeignKey
|
||||
ALTER TABLE "_FasilitasKesehatanToLayananUnggulan" DROP CONSTRAINT "_FasilitasKesehatanToLayananUnggulan_B_fkey";
|
||||
|
||||
-- DropForeignKey
|
||||
ALTER TABLE "_FasilitasKesehatanToProsedurPendaftaran" DROP CONSTRAINT "_FasilitasKesehatanToProsedurPendaftaran_A_fkey";
|
||||
|
||||
-- DropForeignKey
|
||||
ALTER TABLE "_FasilitasKesehatanToProsedurPendaftaran" DROP CONSTRAINT "_FasilitasKesehatanToProsedurPendaftaran_B_fkey";
|
||||
|
||||
-- DropForeignKey
|
||||
ALTER TABLE "_FasilitasKesehatanToTarifDanLayanan" DROP CONSTRAINT "_FasilitasKesehatanToTarifDanLayanan_A_fkey";
|
||||
|
||||
-- DropForeignKey
|
||||
ALTER TABLE "_FasilitasKesehatanToTarifDanLayanan" DROP CONSTRAINT "_FasilitasKesehatanToTarifDanLayanan_B_fkey";
|
||||
|
||||
-- AlterTable
|
||||
ALTER TABLE "FasilitasKesehatan" ADD COLUMN "dokterdanTenagaMedisId" TEXT NOT NULL,
|
||||
ADD COLUMN "fasilitasPendukungId" TEXT NOT NULL,
|
||||
ADD COLUMN "informasiUmumId" TEXT NOT NULL,
|
||||
ADD COLUMN "layananUnggulanId" TEXT NOT NULL,
|
||||
ADD COLUMN "prosedurPendaftaranId" TEXT NOT NULL,
|
||||
ADD COLUMN "tarifDanLayananId" TEXT NOT NULL;
|
||||
|
||||
-- DropTable
|
||||
DROP TABLE "_DokterdanTenagaMedisToFasilitasKesehatan";
|
||||
|
||||
-- DropTable
|
||||
DROP TABLE "_FasilitasKesehatanToFasilitasPendukung";
|
||||
|
||||
-- DropTable
|
||||
DROP TABLE "_FasilitasKesehatanToInformasiUmum";
|
||||
|
||||
-- DropTable
|
||||
DROP TABLE "_FasilitasKesehatanToLayananUnggulan";
|
||||
|
||||
-- DropTable
|
||||
DROP TABLE "_FasilitasKesehatanToProsedurPendaftaran";
|
||||
|
||||
-- DropTable
|
||||
DROP TABLE "_FasilitasKesehatanToTarifDanLayanan";
|
||||
|
||||
-- AddForeignKey
|
||||
ALTER TABLE "FasilitasKesehatan" ADD CONSTRAINT "FasilitasKesehatan_informasiUmumId_fkey" FOREIGN KEY ("informasiUmumId") REFERENCES "InformasiUmum"("id") ON DELETE RESTRICT ON UPDATE CASCADE;
|
||||
|
||||
-- AddForeignKey
|
||||
ALTER TABLE "FasilitasKesehatan" ADD CONSTRAINT "FasilitasKesehatan_layananUnggulanId_fkey" FOREIGN KEY ("layananUnggulanId") REFERENCES "LayananUnggulan"("id") ON DELETE RESTRICT ON UPDATE CASCADE;
|
||||
|
||||
-- AddForeignKey
|
||||
ALTER TABLE "FasilitasKesehatan" ADD CONSTRAINT "FasilitasKesehatan_dokterdanTenagaMedisId_fkey" FOREIGN KEY ("dokterdanTenagaMedisId") REFERENCES "DokterdanTenagaMedis"("id") ON DELETE RESTRICT ON UPDATE CASCADE;
|
||||
|
||||
-- AddForeignKey
|
||||
ALTER TABLE "FasilitasKesehatan" ADD CONSTRAINT "FasilitasKesehatan_fasilitasPendukungId_fkey" FOREIGN KEY ("fasilitasPendukungId") REFERENCES "FasilitasPendukung"("id") ON DELETE RESTRICT ON UPDATE CASCADE;
|
||||
|
||||
-- AddForeignKey
|
||||
ALTER TABLE "FasilitasKesehatan" ADD CONSTRAINT "FasilitasKesehatan_prosedurPendaftaranId_fkey" FOREIGN KEY ("prosedurPendaftaranId") REFERENCES "ProsedurPendaftaran"("id") ON DELETE RESTRICT ON UPDATE CASCADE;
|
||||
|
||||
-- AddForeignKey
|
||||
ALTER TABLE "FasilitasKesehatan" ADD CONSTRAINT "FasilitasKesehatan_tarifDanLayananId_fkey" FOREIGN KEY ("tarifDanLayananId") REFERENCES "TarifDanLayanan"("id") ON DELETE RESTRICT ON UPDATE CASCADE;
|
||||
32
prisma/migrations/20250625085706_25_jun_25_2/migration.sql
Normal file
32
prisma/migrations/20250625085706_25_jun_25_2/migration.sql
Normal file
@@ -0,0 +1,32 @@
|
||||
/*
|
||||
Warnings:
|
||||
|
||||
- The primary key for the `DataKematian_Kelahiran` table will be changed. If it partially fails, the table could be left without primary key constraint.
|
||||
- The `id` column on the `DataKematian_Kelahiran` table would be dropped and recreated. This will lead to data loss if there is data in the column.
|
||||
- The primary key for the `GrafikKepuasan` table will be changed. If it partially fails, the table could be left without primary key constraint.
|
||||
- The `id` column on the `GrafikKepuasan` table would be dropped and recreated. This will lead to data loss if there is data in the column.
|
||||
- A unique constraint covering the columns `[uuid]` on the table `DataKematian_Kelahiran` will be added. If there are existing duplicate values, this will fail.
|
||||
- A unique constraint covering the columns `[uuid]` on the table `GrafikKepuasan` will be added. If there are existing duplicate values, this will fail.
|
||||
- The required column `uuid` was added to the `DataKematian_Kelahiran` table with a prisma-level default value. This is not possible if the table is not empty. Please add this column as optional, then populate it before making it required.
|
||||
- The required column `uuid` was added to the `GrafikKepuasan` table with a prisma-level default value. This is not possible if the table is not empty. Please add this column as optional, then populate it before making it required.
|
||||
|
||||
*/
|
||||
-- AlterTable
|
||||
ALTER TABLE "DataKematian_Kelahiran" DROP CONSTRAINT "DataKematian_Kelahiran_pkey",
|
||||
ADD COLUMN "uuid" TEXT NOT NULL,
|
||||
DROP COLUMN "id",
|
||||
ADD COLUMN "id" SERIAL NOT NULL,
|
||||
ADD CONSTRAINT "DataKematian_Kelahiran_pkey" PRIMARY KEY ("id");
|
||||
|
||||
-- AlterTable
|
||||
ALTER TABLE "GrafikKepuasan" DROP CONSTRAINT "GrafikKepuasan_pkey",
|
||||
ADD COLUMN "uuid" TEXT NOT NULL,
|
||||
DROP COLUMN "id",
|
||||
ADD COLUMN "id" SERIAL NOT NULL,
|
||||
ADD CONSTRAINT "GrafikKepuasan_pkey" PRIMARY KEY ("id");
|
||||
|
||||
-- CreateIndex
|
||||
CREATE UNIQUE INDEX "DataKematian_Kelahiran_uuid_key" ON "DataKematian_Kelahiran"("uuid");
|
||||
|
||||
-- CreateIndex
|
||||
CREATE UNIQUE INDEX "GrafikKepuasan_uuid_key" ON "GrafikKepuasan"("uuid");
|
||||
@@ -70,6 +70,12 @@ model FileStorage {
|
||||
ProfileDesaImage ProfileDesaImage[]
|
||||
ProfilePPID ProfilePPID[]
|
||||
ProfilPerbekel ProfilPerbekel[]
|
||||
Puskesmas Puskesmas[]
|
||||
ProgramKesehatan ProgramKesehatan[]
|
||||
PenangananDarurat PenangananDarurat[]
|
||||
KontakDarurat KontakDarurat[]
|
||||
|
||||
InfoWabahPenyakit InfoWabahPenyakit[]
|
||||
}
|
||||
|
||||
//========================================= MENU PPID ========================================= //
|
||||
@@ -471,12 +477,18 @@ model FasilitasKesehatan {
|
||||
updatedAt DateTime @updatedAt
|
||||
deletedAt DateTime @default(now())
|
||||
isActive Boolean @default(true)
|
||||
InformasiUmum InformasiUmum[]
|
||||
LayananUnggulan LayananUnggulan[]
|
||||
DokterdanTenagaMedis DokterdanTenagaMedis[]
|
||||
FasilitasPendukung FasilitasPendukung[]
|
||||
ProsedurPendaftaran ProsedurPendaftaran[]
|
||||
TarifDanLayanan TarifDanLayanan[]
|
||||
informasiumum InformasiUmum @relation(fields: [informasiUmumId], references: [id])
|
||||
informasiUmumId String
|
||||
layananunggulan LayananUnggulan @relation(fields: [layananUnggulanId], references: [id])
|
||||
layananUnggulanId String
|
||||
dokterdantenagamedis DokterdanTenagaMedis @relation(fields: [dokterdanTenagaMedisId], references: [id])
|
||||
dokterdanTenagaMedisId String
|
||||
fasilitaspendukung FasilitasPendukung @relation(fields: [fasilitasPendukungId], references: [id])
|
||||
fasilitasPendukungId String
|
||||
prosedurpendaftaran ProsedurPendaftaran @relation(fields: [prosedurPendaftaranId], references: [id])
|
||||
prosedurPendaftaranId String
|
||||
tarifdanlayanan TarifDanLayanan @relation(fields: [tarifDanLayananId], references: [id])
|
||||
tarifDanLayananId String
|
||||
}
|
||||
|
||||
model InformasiUmum {
|
||||
@@ -484,10 +496,10 @@ model InformasiUmum {
|
||||
fasilitas String
|
||||
alamat String
|
||||
jamOperasional String
|
||||
FasilitasKesehatan FasilitasKesehatan[]
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
deletedAt DateTime @default(now())
|
||||
FasilitasKesehatan FasilitasKesehatan[]
|
||||
isActive Boolean @default(true)
|
||||
}
|
||||
|
||||
@@ -619,6 +631,7 @@ model PendaftaranJadwalKegiatan {
|
||||
// ========================================= PERSENTASE KELAHIRAN & KEMATIAN ========================================= //
|
||||
model DataKematian_Kelahiran {
|
||||
id Int @id @default(autoincrement())
|
||||
uuid String @default(cuid()) @unique
|
||||
tahun String
|
||||
kematianKasar String
|
||||
kematianBayi String
|
||||
@@ -632,6 +645,7 @@ model DataKematian_Kelahiran {
|
||||
// ========================================= GRAFIK KEPUASAN ========================================= //
|
||||
model GrafikKepuasan {
|
||||
id Int @id @default(autoincrement())
|
||||
uuid String @default(cuid()) @unique
|
||||
label String
|
||||
jumlah String
|
||||
createdAt DateTime @default(now())
|
||||
@@ -723,3 +737,98 @@ model Posyandu {
|
||||
deletedAt DateTime @default(now())
|
||||
isActive Boolean @default(true)
|
||||
}
|
||||
|
||||
// ========================================= PUSKESMAS ========================================= //
|
||||
model Puskesmas {
|
||||
id String @id @default(cuid())
|
||||
name String
|
||||
alamat String
|
||||
jam JamOperasional @relation(fields: [jamId], references: [id])
|
||||
jamId String
|
||||
image FileStorage @relation(fields: [imageId], references: [id])
|
||||
imageId String
|
||||
kontak KontakPuskesmas @relation(fields: [kontakId], references: [id])
|
||||
kontakId String
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
deletedAt DateTime @default(now())
|
||||
isActive Boolean @default(true)
|
||||
}
|
||||
|
||||
model JamOperasional {
|
||||
id String @id @default(cuid())
|
||||
workDays String
|
||||
weekDays String
|
||||
holiday String
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
deletedAt DateTime @default(now())
|
||||
isActive Boolean @default(true)
|
||||
Puskesmas Puskesmas[]
|
||||
}
|
||||
|
||||
model KontakPuskesmas {
|
||||
id String @id @default(cuid())
|
||||
kontakPuskesmas String
|
||||
email String
|
||||
facebook String
|
||||
kontakUGD String
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
deletedAt DateTime @default(now())
|
||||
isActive Boolean @default(true)
|
||||
Puskesmas Puskesmas[]
|
||||
}
|
||||
|
||||
// ========================================= PROGRAM KESSEHATAN ========================================= //
|
||||
model ProgramKesehatan {
|
||||
id String @id @default(cuid())
|
||||
name String
|
||||
deskripsiSingkat String
|
||||
deskripsi String
|
||||
image FileStorage @relation(fields: [imageId], references: [id])
|
||||
imageId String
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
deletedAt DateTime @default(now())
|
||||
isActive Boolean @default(true)
|
||||
}
|
||||
|
||||
// ========================================= PENANGANAN DARURAT ========================================= //
|
||||
model PenangananDarurat {
|
||||
id String @id @default(cuid())
|
||||
name String
|
||||
deskripsi String
|
||||
image FileStorage @relation(fields: [imageId], references: [id])
|
||||
imageId String
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
deletedAt DateTime @default(now())
|
||||
isActive Boolean @default(true)
|
||||
}
|
||||
|
||||
// ========================================= KONTAK DARURAT ========================================= //
|
||||
model KontakDarurat {
|
||||
id String @id @default(cuid())
|
||||
name String
|
||||
deskripsi String
|
||||
image FileStorage @relation(fields: [imageId], references: [id])
|
||||
imageId String
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
deletedAt DateTime @default(now())
|
||||
isActive Boolean @default(true)
|
||||
}
|
||||
// ========================================= INFO WABAH PENYAKIT ========================================= //
|
||||
model InfoWabahPenyakit {
|
||||
id String @id @default(cuid())
|
||||
name String
|
||||
deskripsiSingkat String
|
||||
deskripsiLengkap String
|
||||
image FileStorage @relation(fields: [imageId], references: [id])
|
||||
imageId String
|
||||
createdAt DateTime @default(now())
|
||||
updatedAt DateTime @updatedAt
|
||||
deletedAt DateTime @default(now())
|
||||
isActive Boolean @default(true)
|
||||
}
|
||||
|
||||
@@ -1,333 +1,308 @@
|
||||
/* eslint-disable @typescript-eslint/no-explicit-any */
|
||||
import ApiFetch from "@/lib/api-fetch";
|
||||
import { Prisma } from "@prisma/client";
|
||||
import { toast } from "react-toastify";
|
||||
import { proxy } from "valtio";
|
||||
import { z } from "zod";
|
||||
|
||||
/* Informasi Umum */
|
||||
const templateInformasiUmum = z.object({
|
||||
fasilitas: z.string().min(3, "Fasilitas minimal 3 karakter"),
|
||||
alamat: z.string().min(3, "Alamat minimal 3 karakter"),
|
||||
jamOperasional: z.string().min(3, "Jam Operasional minimal 3 karakter"),
|
||||
// Validasi form
|
||||
const templateForm = z.object({
|
||||
name: z.string().min(1, "Nama harus diisi"),
|
||||
informasiUmum: z.object({
|
||||
fasilitas: z.string().min(1, "Fasilitas harus diisi"),
|
||||
alamat: z.string().min(1, "Alamat harus diisi"),
|
||||
jamOperasional: z.string().min(1, "Jam operasional harus diisi"),
|
||||
}),
|
||||
layananUnggulan: z.object({
|
||||
content: z.string().min(1, "Layanan unggulan harus diisi"),
|
||||
}),
|
||||
dokterdanTenagaMedis: z.object({
|
||||
name: z.string().min(1, "Nama dokter harus diisi"),
|
||||
specialist: z.string().min(1, "Spesialis harus diisi"),
|
||||
jadwal: z.string().min(1, "Jadwal harus diisi"),
|
||||
}),
|
||||
fasilitasPendukung: z.object({
|
||||
content: z.string().min(1, "Fasilitas pendukung harus diisi"),
|
||||
}),
|
||||
prosedurPendaftaran: z.object({
|
||||
content: z.string().min(1, "Prosedur pendaftaran harus diisi"),
|
||||
}),
|
||||
tarifDanLayanan: z.object({
|
||||
layanan: z.string().min(1, "Layanan harus diisi"),
|
||||
tarif: z.string().min(1, "Tarif harus diisi"),
|
||||
}),
|
||||
});
|
||||
|
||||
type InfromasiUmum = Prisma.InformasiUmumGetPayload<{
|
||||
select: {
|
||||
fasilitas: true;
|
||||
alamat: true;
|
||||
jamOperasional: true;
|
||||
// Default form kosong
|
||||
const defaultForm = {
|
||||
name: "",
|
||||
informasiUmum: {
|
||||
fasilitas: "",
|
||||
alamat: "",
|
||||
jamOperasional: "",
|
||||
},
|
||||
layananUnggulan: {
|
||||
content: "",
|
||||
},
|
||||
dokterdanTenagaMedis: {
|
||||
name: "",
|
||||
specialist: "",
|
||||
jadwal: "",
|
||||
},
|
||||
fasilitasPendukung: {
|
||||
content: "",
|
||||
},
|
||||
prosedurPendaftaran: {
|
||||
content: "",
|
||||
},
|
||||
tarifDanLayanan: {
|
||||
layanan: "",
|
||||
tarif: "",
|
||||
},
|
||||
};
|
||||
}>;
|
||||
|
||||
const informasiumum = proxy({
|
||||
const fasilitasKesehatanState = proxy({
|
||||
create: {
|
||||
form: {} as InfromasiUmum,
|
||||
form: { ...defaultForm },
|
||||
loading: false,
|
||||
async create() {
|
||||
const cek = templateInformasiUmum.safeParse(informasiumum.create.form);
|
||||
async submit() {
|
||||
const cek = templateForm.safeParse(this.form);
|
||||
if (!cek.success) {
|
||||
const err = `[${cek.error.issues
|
||||
.map((v) => `${v.path.join(".")}`)
|
||||
.join("\n")}] required`;
|
||||
return toast.error(err);
|
||||
const errMsg = cek.error.issues
|
||||
.map((v) => `${v.path.join(".")}: ${v.message}`)
|
||||
.join("\n");
|
||||
toast.error(errMsg);
|
||||
return null;
|
||||
}
|
||||
|
||||
try {
|
||||
informasiumum.create.loading = true;
|
||||
const res = await ApiFetch.api.kesehatan.informasiumum["create"].post(
|
||||
informasiumum.create.form
|
||||
this.loading = true;
|
||||
const payload = { ...this.form };
|
||||
|
||||
const res = await (ApiFetch.api.kesehatan as any)[
|
||||
"fasilitas-kesehatan"
|
||||
].create.post(payload);
|
||||
|
||||
if (res.status === 200) {
|
||||
toast.success("Berhasil menambahkan fasilitas kesehatan");
|
||||
this.resetForm();
|
||||
await fasilitasKesehatanState.findMany.load();
|
||||
return res.data;
|
||||
}
|
||||
} catch (err: any) {
|
||||
const msg = err?.message || "Terjadi kesalahan saat mengirim data";
|
||||
toast.error(msg);
|
||||
console.error("SUBMIT ERROR:", err);
|
||||
return null;
|
||||
} finally {
|
||||
this.loading = false;
|
||||
}
|
||||
},
|
||||
resetForm() {
|
||||
this.form = { ...defaultForm };
|
||||
},
|
||||
},
|
||||
|
||||
findMany: {
|
||||
data: null as
|
||||
| Prisma.FasilitasKesehatanGetPayload<{
|
||||
include: {
|
||||
informasiumum: true;
|
||||
layananunggulan: true;
|
||||
dokterdantenagamedis: true;
|
||||
fasilitaspendukung: true;
|
||||
prosedurpendaftaran: true;
|
||||
tarifdanlayanan: true;
|
||||
};
|
||||
}>[]
|
||||
| null,
|
||||
loading: false,
|
||||
async load() {
|
||||
try {
|
||||
this.loading = true;
|
||||
const res = await (ApiFetch.api.kesehatan as any)[
|
||||
"fasilitas-kesehatan"
|
||||
]["find-many"].get();
|
||||
|
||||
if (res.status === 200) {
|
||||
this.data = res.data?.data ?? [];
|
||||
} else {
|
||||
toast.error("Gagal memuat data fasilitas kesehatan");
|
||||
}
|
||||
|
||||
return res;
|
||||
} catch (err) {
|
||||
toast.error("Terjadi error saat load data");
|
||||
console.error("LOAD ERROR:", err);
|
||||
throw err;
|
||||
} finally {
|
||||
this.loading = false;
|
||||
}
|
||||
},
|
||||
},
|
||||
findUnique: {
|
||||
data: null as Prisma.FasilitasKesehatanGetPayload<{
|
||||
include: {
|
||||
informasiumum: true;
|
||||
layananunggulan: true;
|
||||
dokterdantenagamedis: true;
|
||||
fasilitaspendukung: true;
|
||||
prosedurpendaftaran: true;
|
||||
tarifdanlayanan: true;
|
||||
};
|
||||
}> | null,
|
||||
loading: false,
|
||||
async load(id: string) {
|
||||
const res = await fetch(`/api/kesehatan/fasilitas-kesehatan/${id}`);
|
||||
if (res.ok) {
|
||||
const data = await res.json();
|
||||
fasilitasKesehatanState.findUnique.data = data.data ?? null;
|
||||
} else {
|
||||
toast.error("Gagal load data fasilitas kesehatan");
|
||||
}
|
||||
},
|
||||
},
|
||||
edit: {
|
||||
id: "",
|
||||
form: { ...defaultForm },
|
||||
loading: false,
|
||||
async load(id: string) {
|
||||
const res = await fetch(`/api/kesehatan/fasilitas-kesehatan/${id}`);
|
||||
if (!res.ok) {
|
||||
toast.error("Gagal load data fasilitas kesehatan");
|
||||
return;
|
||||
}
|
||||
|
||||
const result = await res.json();
|
||||
const data = result.data;
|
||||
|
||||
fasilitasKesehatanState.edit.id = data.id;
|
||||
fasilitasKesehatanState.edit.form = {
|
||||
name: data.name,
|
||||
informasiUmum: {
|
||||
fasilitas: data.informasiumum.fasilitas,
|
||||
alamat: data.informasiumum.alamat,
|
||||
jamOperasional: data.informasiumum.jamOperasional,
|
||||
},
|
||||
layananUnggulan: {
|
||||
content: data.layananunggulan.content,
|
||||
},
|
||||
dokterdanTenagaMedis: {
|
||||
name: data.dokterdantenagamedis.name,
|
||||
specialist: data.dokterdantenagamedis.specialist,
|
||||
jadwal: data.dokterdantenagamedis.jadwal,
|
||||
},
|
||||
fasilitasPendukung: {
|
||||
content: data.fasilitaspendukung.content,
|
||||
},
|
||||
prosedurPendaftaran: {
|
||||
content: data.prosedurpendaftaran.content,
|
||||
},
|
||||
tarifDanLayanan: {
|
||||
layanan: data.tarifdanlayanan.layanan,
|
||||
tarif: data.tarifdanlayanan.tarif,
|
||||
},
|
||||
};
|
||||
},
|
||||
async submit() {
|
||||
const cek = templateForm.safeParse(fasilitasKesehatanState.edit.form);
|
||||
if (!cek.success) {
|
||||
const errMsg = cek.error.issues
|
||||
.map((v) => `${v.path.join(".")}: ${v.message}`)
|
||||
.join("\n");
|
||||
toast.error(errMsg);
|
||||
return null;
|
||||
}
|
||||
|
||||
try {
|
||||
fasilitasKesehatanState.edit.loading = true;
|
||||
const payload = {
|
||||
name: fasilitasKesehatanState.edit.form.name,
|
||||
informasiUmum: {
|
||||
fasilitas:
|
||||
fasilitasKesehatanState.edit.form.informasiUmum.fasilitas,
|
||||
alamat: fasilitasKesehatanState.edit.form.informasiUmum.alamat,
|
||||
jamOperasional:
|
||||
fasilitasKesehatanState.edit.form.informasiUmum.jamOperasional,
|
||||
},
|
||||
layananUnggulan: {
|
||||
content: fasilitasKesehatanState.edit.form.layananUnggulan.content,
|
||||
},
|
||||
dokterdanTenagaMedis: {
|
||||
name: fasilitasKesehatanState.edit.form.dokterdanTenagaMedis.name,
|
||||
specialist:
|
||||
fasilitasKesehatanState.edit.form.dokterdanTenagaMedis.specialist,
|
||||
jadwal:
|
||||
fasilitasKesehatanState.edit.form.dokterdanTenagaMedis.jadwal,
|
||||
},
|
||||
fasilitasPendukung: {
|
||||
content:
|
||||
fasilitasKesehatanState.edit.form.fasilitasPendukung.content,
|
||||
},
|
||||
prosedurPendaftaran: {
|
||||
content:
|
||||
fasilitasKesehatanState.edit.form.prosedurPendaftaran.content,
|
||||
},
|
||||
tarifDanLayanan: {
|
||||
layanan: fasilitasKesehatanState.edit.form.tarifDanLayanan.layanan,
|
||||
tarif: fasilitasKesehatanState.edit.form.tarifDanLayanan.tarif,
|
||||
},
|
||||
};
|
||||
|
||||
const res = await fetch(
|
||||
`/api/kesehatan/fasilitas-kesehatan/${fasilitasKesehatanState.edit.id}`,
|
||||
{
|
||||
method: "PUT",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify(payload),
|
||||
}
|
||||
);
|
||||
if (res.status === 200) {
|
||||
informasiumum.findMany.load();
|
||||
return toast.success("success create");
|
||||
}
|
||||
return toast.error("failed create");
|
||||
} catch (error) {
|
||||
console.log((error as Error).message);
|
||||
} finally {
|
||||
informasiumum.create.loading = false;
|
||||
}
|
||||
},
|
||||
},
|
||||
findMany: {
|
||||
data: null as
|
||||
| Prisma.InformasiUmumGetPayload<{ omit: { isActive: true } }>[]
|
||||
| null,
|
||||
async load() {
|
||||
const res = await ApiFetch.api.kesehatan.
|
||||
informasiumum["find-many"].get();
|
||||
if (res.status === 200) {
|
||||
informasiumum.findMany.data = res.data?.data ?? [];
|
||||
}
|
||||
},
|
||||
},
|
||||
});
|
||||
/* ======================================================================= */
|
||||
|
||||
/* Layanan Unggulan */
|
||||
const templateLayananUnggulanForm = z.object({
|
||||
content: z.string().min(3, "Content minimal 3 karakter"),
|
||||
});
|
||||
|
||||
type LayananUnggulan = Prisma.LayananUnggulanGetPayload<{
|
||||
select: {
|
||||
content: true;
|
||||
};
|
||||
}>;
|
||||
|
||||
const layananunggulan = proxy({
|
||||
create: {
|
||||
form: {} as LayananUnggulan,
|
||||
loading: false,
|
||||
async create() {
|
||||
const cek = templateLayananUnggulanForm.safeParse(layananunggulan.create.form);
|
||||
if (!cek.success) {
|
||||
const err = `[${cek.error.issues
|
||||
.map((v) => `${v.path.join(".")}`)
|
||||
.join("\n")}] required`;
|
||||
return toast.error(err);
|
||||
if (!res.ok) {
|
||||
const error = await res.json();
|
||||
throw new Error(error.message || "Update gagal");
|
||||
}
|
||||
try {
|
||||
layananunggulan.create.loading = true;
|
||||
const res = await ApiFetch.api.kesehatan.layananunggulan["create"].post(
|
||||
layananunggulan.create.form
|
||||
|
||||
toast.success("Berhasil update fasilitas kesehatan");
|
||||
await fasilitasKesehatanState.findMany.load();
|
||||
return true;
|
||||
} catch (err) {
|
||||
toast.error(
|
||||
err instanceof Error ? err.message : "Terjadi kesalahan saat update"
|
||||
);
|
||||
if (res.status === 200) {
|
||||
layananunggulan.findMany.load();
|
||||
return toast.success("success create");
|
||||
}
|
||||
return toast.error("failed create");
|
||||
} catch (error) {
|
||||
console.log((error as Error).message);
|
||||
return false;
|
||||
} finally {
|
||||
layananunggulan.create.loading = false;
|
||||
fasilitasKesehatanState.edit.loading = false;
|
||||
}
|
||||
},
|
||||
},
|
||||
findMany: {
|
||||
data: null as
|
||||
| Prisma.LayananUnggulanGetPayload<{ omit: { isActive: true } }>[]
|
||||
| null,
|
||||
async load() {
|
||||
const res = await ApiFetch.api.kesehatan.
|
||||
layananunggulan["find-many"].get();
|
||||
if (res.status === 200) {
|
||||
layananunggulan.findMany.data = res.data?.data ?? [];
|
||||
}
|
||||
resetForm() {
|
||||
fasilitasKesehatanState.edit.id = "";
|
||||
fasilitasKesehatanState.edit.form = { ...defaultForm };
|
||||
},
|
||||
},
|
||||
})
|
||||
/* ======================================================================= */
|
||||
|
||||
/* Dokter dan Tenaga Medis */
|
||||
const templateDokterdanTenagaMedis = z.object({
|
||||
name: z.string().min(3, "Name minimal 3 karakter"),
|
||||
specialist: z.string().min(3, "Specialist minimal 3 karakter"),
|
||||
jadwal: z.string().min(3, "Jadwal minimal 3 karakter"),
|
||||
})
|
||||
|
||||
type DokterdanTenagaMedis = Prisma.DokterdanTenagaMedisGetPayload<{
|
||||
select: {
|
||||
name: true;
|
||||
specialist: true;
|
||||
jadwal: true;
|
||||
};
|
||||
}>;
|
||||
|
||||
const dokterdantenagamedis = proxy({
|
||||
create: {
|
||||
form: {} as DokterdanTenagaMedis,
|
||||
delete: {
|
||||
loading: false,
|
||||
async create() {
|
||||
const cek = templateDokterdanTenagaMedis.safeParse(dokterdantenagamedis.create.form);
|
||||
if (!cek.success) {
|
||||
const err = `[${cek.error.issues
|
||||
.map((v) => `${v.path.join(".")}`)
|
||||
.join("\n")}] required`;
|
||||
return toast.error(err);
|
||||
}
|
||||
async byId(id: string){
|
||||
try {
|
||||
dokterdantenagamedis.create.loading = true;
|
||||
const res = await ApiFetch.api.kesehatan.dokterdantenagamedis["create"].post(dokterdantenagamedis.create.form);
|
||||
if (res.status === 200) {
|
||||
dokterdantenagamedis.findMany.load();
|
||||
return toast.success("success create");
|
||||
fasilitasKesehatanState.delete.loading = true;
|
||||
const res = await fetch(`/api/kesehatan/fasilitas-kesehatan/del/${id}`, {
|
||||
method: "DELETE",
|
||||
});
|
||||
|
||||
const result = await res.json();
|
||||
if (res.ok && result.success) {
|
||||
toast.success("Fasilitas kesehatan berhasil dihapus");
|
||||
await fasilitasKesehatanState.findMany.load();
|
||||
} else {
|
||||
toast.error(result.message || "Gagal menghapus");
|
||||
}
|
||||
return toast.error("failed create");
|
||||
} catch (error) {
|
||||
console.log((error as Error).message);
|
||||
} catch {
|
||||
toast.error("Terjadi kesalahan saat menghapus");
|
||||
} finally {
|
||||
dokterdantenagamedis.create.loading = false;
|
||||
fasilitasKesehatanState.delete.loading = false;
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
findMany: {
|
||||
data: null as
|
||||
| Prisma.DokterdanTenagaMedisGetPayload<{ omit: { isActive: true } }>[]
|
||||
| null,
|
||||
async load() {
|
||||
const res = await ApiFetch.api.kesehatan.dokterdantenagamedis["find-many"].get();
|
||||
if (res.status === 200) {
|
||||
dokterdantenagamedis.findMany.data = res.data?.data ?? [];
|
||||
}
|
||||
},
|
||||
},
|
||||
})
|
||||
/* ======================================================================= */
|
||||
});
|
||||
|
||||
/* Fasilitas Pendukung */
|
||||
const templateFasilitasPendukung = z.object({
|
||||
content: z.string().min(3, "Content minimal 3 karakter"),
|
||||
})
|
||||
|
||||
type FasilitasPendukung = Prisma.FasilitasPendukungGetPayload<{
|
||||
select: {
|
||||
content: true;
|
||||
};
|
||||
}>;
|
||||
|
||||
const fasilitaspendukung = proxy({
|
||||
create: {
|
||||
form: {} as FasilitasPendukung,
|
||||
loading: false,
|
||||
async create() {
|
||||
const cek = templateFasilitasPendukung.safeParse(fasilitaspendukung.create.form);
|
||||
if (!cek.success) {
|
||||
const err = `[${cek.error.issues
|
||||
.map((v) => `${v.path.join(".")}`)
|
||||
.join("\n")}] required`;
|
||||
return toast.error(err);
|
||||
}
|
||||
try {
|
||||
fasilitaspendukung.create.loading = true;
|
||||
const res = await ApiFetch.api.kesehatan.fasilitaspendukung["create"].post(fasilitaspendukung.create.form);
|
||||
if (res.status === 200) {
|
||||
fasilitaspendukung.findMany.load();
|
||||
return toast.success("success create");
|
||||
}
|
||||
return toast.error("failed create");
|
||||
} catch (error) {
|
||||
console.log((error as Error).message);
|
||||
} finally {
|
||||
fasilitaspendukung.create.loading = false;
|
||||
}
|
||||
},
|
||||
},
|
||||
findMany: {
|
||||
data: null as
|
||||
| Prisma.FasilitasPendukungGetPayload<{ omit: { isActive: true } }>[]
|
||||
| null,
|
||||
async load() {
|
||||
const res = await ApiFetch.api.kesehatan.
|
||||
fasilitaspendukung["find-many"].get();
|
||||
if (res.status === 200) {
|
||||
fasilitaspendukung.findMany.data = res.data?.data ?? [];
|
||||
}
|
||||
},
|
||||
},
|
||||
})
|
||||
/* ======================================================================= */
|
||||
|
||||
/* Tarif dan Layanan */
|
||||
const templateTarifDanLayanan = z.object({
|
||||
layanan: z.string().min(3, "Layanan minimal 3 karakter"),
|
||||
tarif: z.string().min(3, "Tarif minimal 3 karakter"),
|
||||
})
|
||||
|
||||
const tarifdanlayanan = proxy({
|
||||
create: {
|
||||
form: {} as Prisma.TarifDanLayananGetPayload<{ select: { layanan: true; tarif: true } }>,
|
||||
loading: false,
|
||||
async create() {
|
||||
const cek = templateTarifDanLayanan.safeParse(tarifdanlayanan.create.form);
|
||||
if (!cek.success) {
|
||||
const err = `[${cek.error.issues
|
||||
.map((v) => `${v.path.join(".")}`)
|
||||
.join("\n")}] required`;
|
||||
return toast.error(err);
|
||||
}
|
||||
try {
|
||||
tarifdanlayanan.create.loading = true;
|
||||
const res = await ApiFetch.api.kesehatan.tarifdanlayanan["create"].post(tarifdanlayanan.create.form);
|
||||
if (res.status === 200) {
|
||||
tarifdanlayanan.findMany.load();
|
||||
return toast.success("success create");
|
||||
}
|
||||
return toast.error("failed create");
|
||||
} catch (error) {
|
||||
console.log((error as Error).message);
|
||||
} finally {
|
||||
tarifdanlayanan.create.loading = false;
|
||||
}
|
||||
},
|
||||
},
|
||||
findMany: {
|
||||
data: null as
|
||||
| Prisma.TarifDanLayananGetPayload<{ omit: { isActive: true } }>[]
|
||||
| null,
|
||||
async load() {
|
||||
const res = await ApiFetch.api.kesehatan.
|
||||
tarifdanlayanan["find-many"].get();
|
||||
if (res.status === 200) {
|
||||
tarifdanlayanan.findMany.data = res.data?.data ?? [];
|
||||
}
|
||||
},
|
||||
},
|
||||
})
|
||||
/* ======================================================================= */
|
||||
|
||||
/* Prosedur Pendaftaran */
|
||||
const templateProsedurPendaftaran = z.object({
|
||||
content: z.string().min(3, "Content minimal 3 karakter"),
|
||||
})
|
||||
|
||||
const prosedurpendaftaran = proxy({
|
||||
create: {
|
||||
form: {} as Prisma.ProsedurPendaftaranGetPayload<{ select: { content: true } }>,
|
||||
loading: false,
|
||||
async create() {
|
||||
const cek = templateProsedurPendaftaran.safeParse(prosedurpendaftaran.create.form);
|
||||
if (!cek.success) {
|
||||
const err = `[${cek.error.issues
|
||||
.map((v) => `${v.path.join(".")}`)
|
||||
.join("\n")}] required`;
|
||||
return toast.error(err);
|
||||
}
|
||||
try {
|
||||
prosedurpendaftaran.create.loading = true;
|
||||
const res = await ApiFetch.api.kesehatan.prosedurpendaftaran["create"].post(prosedurpendaftaran.create.form);
|
||||
if (res.status === 200) {
|
||||
prosedurpendaftaran.findMany.load();
|
||||
return toast.success("success create");
|
||||
}
|
||||
return toast.error("failed create");
|
||||
} catch (error) {
|
||||
console.log((error as Error).message);
|
||||
} finally {
|
||||
prosedurpendaftaran.create.loading = false;
|
||||
}
|
||||
},
|
||||
},
|
||||
findMany: {
|
||||
data: null as
|
||||
| Prisma.ProsedurPendaftaranGetPayload<{ omit: { isActive: true } }>[]
|
||||
| null,
|
||||
async load() {
|
||||
const res = await ApiFetch.api.kesehatan.
|
||||
prosedurpendaftaran["find-many"].get();
|
||||
if (res.status === 200) {
|
||||
prosedurpendaftaran.findMany.data = res.data?.data ?? [];
|
||||
}
|
||||
},
|
||||
},
|
||||
})
|
||||
|
||||
const stateFasilitasKesehatan = proxy({
|
||||
informasiumum,
|
||||
layananunggulan,
|
||||
dokterdantenagamedis,
|
||||
fasilitaspendukung,
|
||||
tarifdanlayanan,
|
||||
prosedurpendaftaran
|
||||
})
|
||||
|
||||
export default stateFasilitasKesehatan
|
||||
export default fasilitasKesehatanState;
|
||||
|
||||
@@ -6,7 +6,7 @@ import { z } from "zod";
|
||||
|
||||
const templateGrafikKepuasan = z.object({
|
||||
label: z.string().min(2, "Label harus diisi"),
|
||||
jumlah: z.string().min(2, "Jumlah harus diisi"),
|
||||
jumlah: z.string().min(1, "Jumlah harus diisi"),
|
||||
});
|
||||
|
||||
type GrafikKepuasan = Prisma.GrafikKepuasanGetPayload<{
|
||||
@@ -31,24 +31,30 @@ const grafikkepuasan = proxy({
|
||||
const err = `[${cek.error.issues
|
||||
.map((v) => `${v.path.join(".")}`)
|
||||
.join("\n")}] required`;
|
||||
return toast.error(err);
|
||||
toast.error(err);
|
||||
return null;
|
||||
}
|
||||
try {
|
||||
grafikkepuasan.create.loading = true;
|
||||
const res = await ApiFetch.api.kesehatan.grafikkepuasan["create"].post(
|
||||
grafikkepuasan.create.form
|
||||
);
|
||||
const res = await ApiFetch.api.kesehatan.grafikkepuasan["create"].post(grafikkepuasan.create.form);
|
||||
|
||||
if (res.status === 200) {
|
||||
const uuid = res.data?.data?.uuid;
|
||||
if (uuid) {
|
||||
toast.success("Success create");
|
||||
grafikkepuasan.create.form = {
|
||||
label: "",
|
||||
jumlah: ""
|
||||
jumlah: "",
|
||||
};
|
||||
grafikkepuasan.findMany.load();
|
||||
return toast.success("success create");
|
||||
return uuid;
|
||||
}
|
||||
return toast.error("failed create");
|
||||
}
|
||||
toast.error("failed create");
|
||||
return null;
|
||||
} catch (error) {
|
||||
console.log((error as Error).message);
|
||||
return null;
|
||||
} finally {
|
||||
grafikkepuasan.create.loading = false;
|
||||
}
|
||||
@@ -67,10 +73,110 @@ const grafikkepuasan = proxy({
|
||||
}
|
||||
},
|
||||
},
|
||||
findUnique: {
|
||||
data: null as Prisma.GrafikKepuasanGetPayload<{
|
||||
omit: { isActive: true }
|
||||
}> | null,
|
||||
async load(uuid: string) {
|
||||
try {
|
||||
const res = await fetch(`/api/kesehatan/grafikkepuasan/${uuid}`);
|
||||
if (res.ok) {
|
||||
const data = await res.json();
|
||||
grafikkepuasan.findUnique.data = data.data ?? null;
|
||||
} else {
|
||||
console.error("Failed to fetch grafikkepuasan:", res.statusText);
|
||||
grafikkepuasan.findUnique.data = null;
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error fetching grafikkepuasan:", error);
|
||||
grafikkepuasan.findUnique.data = null;
|
||||
}
|
||||
},
|
||||
},
|
||||
update: {
|
||||
uuid: "",
|
||||
form: {...defaultForm},
|
||||
loading: false,
|
||||
async byId() {
|
||||
},
|
||||
async submit() {
|
||||
const uuid = this.uuid;
|
||||
if (!uuid) {
|
||||
toast.warn("ID tidak valid");
|
||||
return null;
|
||||
}
|
||||
const cek = templateGrafikKepuasan.safeParse(grafikkepuasan.update.form);
|
||||
if (!cek.success) {
|
||||
const err = `[${cek.error.issues
|
||||
.map((v) => `${v.path.join(".")}`)
|
||||
.join("\n")}] required`;
|
||||
return toast.error(err);
|
||||
}
|
||||
try {
|
||||
this.loading = true;
|
||||
const response = await fetch(`/api/kesehatan/grafikkepuasan/${uuid}`, {
|
||||
method: "PUT",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
body: JSON.stringify(this.form),
|
||||
});
|
||||
const result = await response.json();
|
||||
|
||||
if (!response.ok || !result?.success) {
|
||||
throw new Error(result?.message || "Gagal update data");
|
||||
}
|
||||
|
||||
toast.success("Berhasil update data!");
|
||||
|
||||
// ✅ Optional: refresh list kalau kamu langsung ke halaman list
|
||||
await grafikkepuasan.findMany.load();
|
||||
|
||||
return result.data;
|
||||
} catch (error) {
|
||||
console.error("Error update data:", error);
|
||||
toast.error("Gagal update data grafik kepuasan");
|
||||
} finally {
|
||||
this.loading = false;
|
||||
}
|
||||
},
|
||||
},
|
||||
delete: {
|
||||
loading: false,
|
||||
async byId(uuid: string) {
|
||||
if (!uuid) {
|
||||
return toast.warn("ID tidak valid");
|
||||
}
|
||||
try {
|
||||
grafikkepuasan.delete.loading = true;
|
||||
|
||||
const response = await fetch(`/api/kesehatan/grafikkepuasan/del/${uuid}`, {
|
||||
method: "DELETE",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
});
|
||||
|
||||
const stategrafikKepuasan = proxy({
|
||||
grafikkepuasan,
|
||||
const result = await response.json();
|
||||
|
||||
if (response.ok && result?.success) {
|
||||
toast.success(
|
||||
result.message || "Grafik kepuasan berhasil dihapus"
|
||||
);
|
||||
await grafikkepuasan.findMany.load(); // refresh list
|
||||
} else {
|
||||
toast.error(
|
||||
result?.message || "Gagal menghapus grafik kepuasan"
|
||||
);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Gagal delete:", error);
|
||||
toast.error("Terjadi kesalahan saat menghapus grafik kepuasan");
|
||||
} finally {
|
||||
grafikkepuasan.delete.loading = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
export default stategrafikKepuasan;
|
||||
export default grafikkepuasan;
|
||||
|
||||
@@ -6,9 +6,9 @@ import { z } from "zod";
|
||||
|
||||
const templatePersentase = z.object({
|
||||
tahun: z.string().min(4, "Tahun harus diisi"),
|
||||
kematianKasar: z.string().min(2, "Kematian kasar harus diisi"),
|
||||
kelahiranKasar: z.string().min(2, "Kelahiran kasar harus diisi"),
|
||||
kematianBayi: z.string().min(2, "Kematian bayi harus diisi"),
|
||||
kematianKasar: z.string().min(1, "Kematian kasar harus diisi"),
|
||||
kelahiranKasar: z.string().min(1, "Kelahiran kasar harus diisi"),
|
||||
kematianBayi: z.string().min(1, "Kematian bayi harus diisi"),
|
||||
});
|
||||
|
||||
type Persentase = Prisma.DataKematian_KelahiranGetPayload<{
|
||||
@@ -34,51 +34,157 @@ const persentasekelahiran = proxy({
|
||||
async create() {
|
||||
const cek = templatePersentase.safeParse(persentasekelahiran.create.form);
|
||||
if (!cek.success) {
|
||||
const err = `[${cek.error.issues
|
||||
.map((v) => `${v.path.join(".")}`)
|
||||
.join("\n")}] required`;
|
||||
return toast.error(err);
|
||||
const err = `[${cek.error.issues.map((v) => `${v.path.join(".")}`).join("\n")}] required`;
|
||||
toast.error(err);
|
||||
return null;
|
||||
}
|
||||
try {
|
||||
persentasekelahiran.create.loading = true;
|
||||
const res = await ApiFetch.api.kesehatan.persentasekelahiran[
|
||||
"create"
|
||||
].post(persentasekelahiran.create.form);
|
||||
const res = await ApiFetch.api.kesehatan.persentasekelahiran["create"].post(
|
||||
persentasekelahiran.create.form
|
||||
);
|
||||
|
||||
if (res.status === 200) {
|
||||
persentasekelahiran.create.form = {
|
||||
tahun: "",
|
||||
kematianKasar: "",
|
||||
kelahiranKasar: "",
|
||||
kematianBayi: "",
|
||||
};
|
||||
const uuid = res.data?.data?.uuid;
|
||||
if (uuid) {
|
||||
toast.success("Success create");
|
||||
persentasekelahiran.create.form = { ...defaultForm };
|
||||
persentasekelahiran.findMany.load();
|
||||
return toast.success("success create");
|
||||
return uuid;
|
||||
}
|
||||
return toast.error("failed create");
|
||||
}
|
||||
toast.error("failed create");
|
||||
return null;
|
||||
} catch (error) {
|
||||
console.log((error as Error).message);
|
||||
return null;
|
||||
} finally {
|
||||
persentasekelahiran.create.loading = false;
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
findMany: {
|
||||
data: null as
|
||||
| Prisma.DataKematian_KelahiranGetPayload<{ omit: { isActive: true } }>[]
|
||||
| null,
|
||||
data: null as Prisma.DataKematian_KelahiranGetPayload<{
|
||||
omit: { isActive: true };
|
||||
}>[] | null,
|
||||
async load() {
|
||||
const res = await ApiFetch.api.kesehatan.persentasekelahiran[
|
||||
"find-many"
|
||||
].get();
|
||||
const res = await ApiFetch.api.kesehatan.persentasekelahiran["find-many"].get();
|
||||
if (res.status === 200) {
|
||||
persentasekelahiran.findMany.data = res.data?.data ?? [];
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
findUnique: {
|
||||
data: null as Prisma.DataKematian_KelahiranGetPayload<{
|
||||
omit: { isActive: true };
|
||||
}> | null,
|
||||
async load(uuid: string) {
|
||||
try {
|
||||
const res = await fetch(`/api/kesehatan/persentasekelahiran/${uuid}`);
|
||||
if (res.ok) {
|
||||
const data = await res.json();
|
||||
persentasekelahiran.findUnique.data = data.data ?? null;
|
||||
} else {
|
||||
console.error("Failed to fetch persentasekelahiran:", res.statusText);
|
||||
persentasekelahiran.findUnique.data = null;
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error fetching persentasekelahiran:", error);
|
||||
persentasekelahiran.findUnique.data = null;
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
update: {
|
||||
uuid: "",
|
||||
form: { ...defaultForm },
|
||||
loading: false,
|
||||
async submit() {
|
||||
const uuid = this.uuid;
|
||||
if (!uuid) {
|
||||
toast.warn("UUID tidak valid");
|
||||
return null;
|
||||
}
|
||||
|
||||
const formData = {
|
||||
tahun: this.form.tahun,
|
||||
kematianKasar: this.form.kematianKasar,
|
||||
kelahiranKasar: this.form.kelahiranKasar,
|
||||
kematianBayi: this.form.kematianBayi,
|
||||
};
|
||||
|
||||
const cek = templatePersentase.safeParse(formData);
|
||||
if (!cek.success) {
|
||||
const err = `[${cek.error.issues
|
||||
.map((v) => `${v.path.join(".")}`)
|
||||
.join("\n")}] required`;
|
||||
toast.error(err);
|
||||
return null;
|
||||
}
|
||||
|
||||
try {
|
||||
this.loading = true;
|
||||
const res = await fetch(`/api/kesehatan/persentasekelahiran/${uuid}`, {
|
||||
method: "PUT",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
body: JSON.stringify(formData),
|
||||
});
|
||||
|
||||
const statePersentase = proxy({
|
||||
persentasekelahiran,
|
||||
const result = await res.json();
|
||||
|
||||
if (!res.ok || !result?.success) {
|
||||
throw new Error(result?.message || "Gagal update data");
|
||||
}
|
||||
|
||||
toast.success("Berhasil update data!");
|
||||
await persentasekelahiran.findMany.load();
|
||||
return result.data;
|
||||
} catch (error) {
|
||||
console.error("Update error:", error);
|
||||
toast.error("Gagal update data persentase kelahiran");
|
||||
throw error;
|
||||
} finally {
|
||||
this.loading = false;
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
|
||||
delete: {
|
||||
loading: false,
|
||||
async byId(uuid: string) {
|
||||
if (!uuid) return toast.warn("UUID tidak valid");
|
||||
|
||||
try {
|
||||
persentasekelahiran.delete.loading = true;
|
||||
|
||||
const response = await fetch(`/api/kesehatan/persentasekelahiran/del/${uuid}`, {
|
||||
method: "DELETE",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
});
|
||||
|
||||
export default statePersentase;
|
||||
const result = await response.json();
|
||||
|
||||
if (response.ok && result?.success) {
|
||||
toast.success(result.message || "Persentase kelahiran berhasil dihapus");
|
||||
await persentasekelahiran.findMany.load();
|
||||
} else {
|
||||
toast.error(result?.message || "Gagal menghapus persentase kelahiran");
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Gagal delete:", error);
|
||||
toast.error("Terjadi kesalahan saat menghapus persentase kelahiran");
|
||||
} finally {
|
||||
persentasekelahiran.delete.loading = false;
|
||||
}
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
export default persentasekelahiran;
|
||||
|
||||
@@ -0,0 +1,214 @@
|
||||
import ApiFetch from "@/lib/api-fetch";
|
||||
import { Prisma } from "@prisma/client";
|
||||
import { toast } from "react-toastify";
|
||||
import { proxy } from "valtio";
|
||||
import { z } from "zod";
|
||||
|
||||
const templateForm = z.object({
|
||||
name: z.string().min(3, "Judul minimal 3 karakter"),
|
||||
deskripsiSingkat: z.string().min(3, "Deskripsi singkat minimal 3 karakter"),
|
||||
deskripsiLengkap: z.string().min(3, "Deskripsi lengkap minimal 3 karakter"),
|
||||
imageId: z.string().nonempty(),
|
||||
});
|
||||
|
||||
const defaultForm = {
|
||||
name: "",
|
||||
deskripsiSingkat: "",
|
||||
deskripsiLengkap: "",
|
||||
imageId: "",
|
||||
};
|
||||
|
||||
const infoWabahPenyakit = proxy({
|
||||
findMany: {
|
||||
data: [] as Prisma.InfoWabahPenyakitGetPayload<{
|
||||
include: {
|
||||
image: true;
|
||||
};
|
||||
}>[],
|
||||
async load() {
|
||||
const res = await ApiFetch.api.kesehatan.infowabahpenyakit[
|
||||
"find-many"
|
||||
].get();
|
||||
if (res.status === 200) {
|
||||
infoWabahPenyakit.findMany.data = res.data?.data ?? [];
|
||||
}
|
||||
},
|
||||
},
|
||||
create: {
|
||||
form: { ...defaultForm },
|
||||
loading: false,
|
||||
async create() {
|
||||
const cek = templateForm.safeParse(infoWabahPenyakit.create.form);
|
||||
if (!cek.success) {
|
||||
const err = `[${cek.error.issues
|
||||
.map((v) => `${v.path.join(".")}`)
|
||||
.join("\n")}] required`;
|
||||
return toast.error(err);
|
||||
}
|
||||
|
||||
try {
|
||||
infoWabahPenyakit.create.loading = true;
|
||||
const res = await ApiFetch.api.kesehatan.infowabahpenyakit[
|
||||
"create"
|
||||
].post(infoWabahPenyakit.create.form);
|
||||
if (res.status === 200) {
|
||||
infoWabahPenyakit.findMany.load();
|
||||
return toast.success("Info wabah penyakit berhasil disimpan!");
|
||||
}
|
||||
|
||||
return toast.error("Gagal menyimpan info wabah penyakit");
|
||||
} catch (error) {
|
||||
console.log((error as Error).message);
|
||||
} finally {
|
||||
infoWabahPenyakit.create.loading = false;
|
||||
}
|
||||
},
|
||||
resetForm() {
|
||||
infoWabahPenyakit.create.form = { ...defaultForm };
|
||||
},
|
||||
},
|
||||
findUnique: {
|
||||
data: null as Prisma.InfoWabahPenyakitGetPayload<{
|
||||
include: {
|
||||
image: true;
|
||||
};
|
||||
}> | null,
|
||||
async load(id: string) {
|
||||
try {
|
||||
const res = await fetch(`/api/kesehatan/infowabahpenyakit/${id}`);
|
||||
if (res.ok) {
|
||||
const data = await res.json();
|
||||
infoWabahPenyakit.findUnique.data = data.data ?? null;
|
||||
} else {
|
||||
console.error("Failed to fetch info wabah penyakit:", res.statusText);
|
||||
infoWabahPenyakit.findUnique.data = null;
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error fetching info wabah penyakit:", error);
|
||||
infoWabahPenyakit.findUnique.data = null;
|
||||
}
|
||||
},
|
||||
},
|
||||
delete: {
|
||||
loading: false,
|
||||
async byId(id: string) {
|
||||
if (!id) return toast.warn("ID tidak valid");
|
||||
|
||||
try {
|
||||
infoWabahPenyakit.delete.loading = true;
|
||||
|
||||
const response = await fetch(`/api/kesehatan/infowabahpenyakit/del/${id}`, {
|
||||
method: "DELETE",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
});
|
||||
|
||||
const result = await response.json();
|
||||
if (response.ok && result?.success) {
|
||||
toast.success(result.message || "Info wabah penyakit berhasil dihapus");
|
||||
await infoWabahPenyakit.findMany.load(); // refresh list
|
||||
} else {
|
||||
toast.error(result?.message || "Gagal menghapus info wabah penyakit");
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Gagal delete:", error);
|
||||
toast.error("Terjadi kesalahan saat menghapus info wabah penyakit");
|
||||
} finally {
|
||||
infoWabahPenyakit.delete.loading = false;
|
||||
}
|
||||
},
|
||||
},
|
||||
edit: {
|
||||
id: "",
|
||||
form: { ...defaultForm },
|
||||
loading: false,
|
||||
|
||||
async load(id: string) {
|
||||
if (!id) {
|
||||
toast.warn("ID tidak valid");
|
||||
return null;
|
||||
}
|
||||
|
||||
try {
|
||||
const response = await fetch(`/api/kesehatan/infowabahpenyakit/${id}`, {
|
||||
method: "GET",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
});
|
||||
if (!response.ok) {
|
||||
throw new Error(`HTTP error! status: ${response.status}`);
|
||||
}
|
||||
const result = await response.json();
|
||||
if (result?.success) {
|
||||
const data = result.data;
|
||||
this.id = data.id;
|
||||
this.form = {
|
||||
name: data.name,
|
||||
deskripsiSingkat: data.deskripsiSingkat,
|
||||
deskripsiLengkap: data.deskripsiLengkap,
|
||||
imageId: data.imageId,
|
||||
};
|
||||
return data; // Return the loaded data
|
||||
} else {
|
||||
throw new Error(result?.message || "Gagal memuat data");
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error fetching info wabah penyakit:", error);
|
||||
toast.error(error instanceof Error ? error.message : "Gagal memuat data");
|
||||
return null;
|
||||
}
|
||||
},
|
||||
|
||||
async update() {
|
||||
const cek = templateForm.safeParse(infoWabahPenyakit.edit.form);
|
||||
if (!cek.success) {
|
||||
const err = `[${cek.error.issues
|
||||
.map((v) => `${v.path.join(".")}`)
|
||||
.join("\n")}] required`;
|
||||
return toast.error(err);
|
||||
}
|
||||
|
||||
try {
|
||||
infoWabahPenyakit.edit.loading = true;
|
||||
const response = await fetch(`/api/kesehatan/infowabahpenyakit/${this.id}`, {
|
||||
method: "PUT",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
body: JSON.stringify({
|
||||
name: this.form.name,
|
||||
deskripsiSingkat: this.form.deskripsiSingkat,
|
||||
deskripsiLengkap: this.form.deskripsiLengkap,
|
||||
imageId: this.form.imageId,
|
||||
}),
|
||||
});
|
||||
if (!response.ok) {
|
||||
const errorData = await response.json().catch(() => ({}));
|
||||
throw new Error(errorData.message || `HTTP error! status: ${response.status}`);
|
||||
}
|
||||
const result = await response.json();
|
||||
if (result.success) {
|
||||
toast.success(result.message || "Info wabah penyakit berhasil diupdate");
|
||||
await infoWabahPenyakit.findMany.load();
|
||||
return true;
|
||||
} else {
|
||||
throw new Error(result.message || "Gagal update info wabah penyakit");
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Gagal update:", error);
|
||||
toast.error(error instanceof Error ? error.message : "Terjadi kesalahan saat mengupdate info wabah penyakit");
|
||||
return false;
|
||||
} finally {
|
||||
infoWabahPenyakit.edit.loading = false;
|
||||
}
|
||||
},
|
||||
reset() {
|
||||
infoWabahPenyakit.edit.id = "";
|
||||
infoWabahPenyakit.edit.form = { ...defaultForm };
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
export default infoWabahPenyakit;
|
||||
@@ -0,0 +1,208 @@
|
||||
import ApiFetch from "@/lib/api-fetch";
|
||||
import { Prisma } from "@prisma/client";
|
||||
import { toast } from "react-toastify";
|
||||
import { proxy } from "valtio";
|
||||
import { z } from "zod";
|
||||
|
||||
const templateForm = z.object({
|
||||
name: z.string().min(3, "Judul minimal 3 karakter"),
|
||||
deskripsi: z.string().min(3, "Deskripsi minimal 3 karakter"),
|
||||
imageId: z.string().nonempty(),
|
||||
})
|
||||
|
||||
const defaultForm = {
|
||||
name: "",
|
||||
deskripsi: "",
|
||||
imageId: "",
|
||||
}
|
||||
|
||||
const kontakDarurat = proxy({
|
||||
findMany: {
|
||||
data: [] as Prisma.KontakDaruratGetPayload<{
|
||||
include: {
|
||||
image: true;
|
||||
};
|
||||
}>[],
|
||||
async load() {
|
||||
const res = await ApiFetch.api.kesehatan.kontakdarurat[
|
||||
"find-many"
|
||||
].get();
|
||||
if (res.status === 200) {
|
||||
kontakDarurat.findMany.data = res.data?.data ?? [];
|
||||
}
|
||||
},
|
||||
},
|
||||
create:{
|
||||
form: {...defaultForm},
|
||||
loading: false,
|
||||
async create() {
|
||||
const cek = templateForm.safeParse(kontakDarurat.create.form);
|
||||
if (!cek.success) {
|
||||
const err = `[${cek.error.issues
|
||||
.map((v) => `${v.path.join(".")}`)
|
||||
.join("\n")}] required`;
|
||||
return toast.error(err);
|
||||
}
|
||||
|
||||
try {
|
||||
kontakDarurat.create.loading = true;
|
||||
const res = await ApiFetch.api.kesehatan.kontakdarurat[
|
||||
"create"
|
||||
].post(kontakDarurat.create.form);
|
||||
if (res.status === 200) {
|
||||
kontakDarurat.findMany.load();
|
||||
return toast.success("Kontak Darurat berhasil disimpan!");
|
||||
}
|
||||
|
||||
return toast.error("Gagal menyimpan kontak darurat");
|
||||
} catch (error) {
|
||||
console.log((error as Error).message);
|
||||
} finally {
|
||||
kontakDarurat.create.loading = false;
|
||||
}
|
||||
},
|
||||
resetForm() {
|
||||
kontakDarurat.create.form = {...defaultForm};
|
||||
}
|
||||
},
|
||||
findUnique: {
|
||||
data: null as Prisma.KontakDaruratGetPayload<{
|
||||
include: {
|
||||
image: true;
|
||||
};
|
||||
}> | null,
|
||||
async load(id: string) {
|
||||
try {
|
||||
const res = await fetch(`/api/kesehatan/kontakdarurat/${id}`);
|
||||
if (res.ok) {
|
||||
const data = await res.json();
|
||||
kontakDarurat.findUnique.data = data.data ?? null;
|
||||
} else {
|
||||
console.error("Failed to fetch data", res.status, res.statusText);
|
||||
kontakDarurat.findUnique.data = null;
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error fetching data:", error);
|
||||
kontakDarurat.findUnique.data = null;
|
||||
}
|
||||
},
|
||||
},
|
||||
delete: {
|
||||
loading: false,
|
||||
async byId(id: string) {
|
||||
try {
|
||||
kontakDarurat.delete.loading = true;
|
||||
const response = await fetch(`/api/kesehatan/kontakdarurat/del/${id}`, {
|
||||
method: 'DELETE',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
});
|
||||
|
||||
const result = await response.json();
|
||||
|
||||
if (response.ok && result?.success) {
|
||||
toast.success(result.message || "Kontak darurat berhasil dihapus");
|
||||
await kontakDarurat.findMany.load(); // refresh list
|
||||
} else {
|
||||
toast.error(result?.message || "Gagal menghapus kontak darurat");
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Gagal delete:", error);
|
||||
toast.error("Terjadi kesalahan saat menghapus kontak darurat");
|
||||
} finally {
|
||||
kontakDarurat.delete.loading = false;
|
||||
}
|
||||
}
|
||||
},
|
||||
edit: {
|
||||
id: "",
|
||||
form: { ...defaultForm },
|
||||
loading: false,
|
||||
|
||||
async load(id: string) {
|
||||
if (!id) {
|
||||
toast.warn("ID tidak valid");
|
||||
return null;
|
||||
}
|
||||
|
||||
try {
|
||||
const response = await fetch(`/api/kesehatan/kontakdarurat/${id}`, {
|
||||
method: "GET",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
});
|
||||
if (!response.ok) {
|
||||
throw new Error(`HTTP error! status: ${response.status}`);
|
||||
}
|
||||
const result = await response.json();
|
||||
if (result?.success) {
|
||||
const data = result.data;
|
||||
this.id = data.id;
|
||||
this.form = {
|
||||
name: data.name,
|
||||
deskripsi: data.deskripsi,
|
||||
imageId: data.imageId,
|
||||
};
|
||||
return data; // Return the loaded data
|
||||
} else {
|
||||
throw new Error(result?.message || "Gagal memuat data");
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error fetching kontak darurat:", error);
|
||||
toast.error(error instanceof Error ? error.message : "Gagal memuat data");
|
||||
return null;
|
||||
}
|
||||
},
|
||||
|
||||
async update() {
|
||||
const cek = templateForm.safeParse(kontakDarurat.edit.form);
|
||||
if (!cek.success) {
|
||||
const err = `[${cek.error.issues
|
||||
.map((v) => `${v.path.join(".")}`)
|
||||
.join("\n")}] required`;
|
||||
return toast.error(err);
|
||||
}
|
||||
|
||||
try {
|
||||
kontakDarurat.edit.loading = true;
|
||||
const response = await fetch(`/api/kesehatan/kontakdarurat/${this.id}`, {
|
||||
method: "PUT",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
body: JSON.stringify({
|
||||
name: this.form.name,
|
||||
deskripsi: this.form.deskripsi,
|
||||
imageId: this.form.imageId,
|
||||
}),
|
||||
});
|
||||
if (!response.ok) {
|
||||
const errorData = await response.json().catch(() => ({}));
|
||||
throw new Error(errorData.message || `HTTP error! status: ${response.status}`);
|
||||
}
|
||||
const result = await response.json();
|
||||
if (result.success) {
|
||||
toast.success(result.message || "Kontak darurat berhasil diupdate");
|
||||
await kontakDarurat.findMany.load();
|
||||
return true;
|
||||
} else {
|
||||
throw new Error(result.message || "Gagal update kontak darurat");
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Gagal update:", error);
|
||||
toast.error(error instanceof Error ? error.message : "Terjadi kesalahan saat mengupdate kontak darurat");
|
||||
return false;
|
||||
} finally {
|
||||
kontakDarurat.edit.loading = false;
|
||||
}
|
||||
},
|
||||
reset() {
|
||||
kontakDarurat.edit.id = "";
|
||||
kontakDarurat.edit.form = { ...defaultForm };
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
export default kontakDarurat
|
||||
@@ -0,0 +1,208 @@
|
||||
import ApiFetch from "@/lib/api-fetch";
|
||||
import { Prisma } from "@prisma/client";
|
||||
import { toast } from "react-toastify";
|
||||
import { proxy } from "valtio";
|
||||
import { z } from "zod";
|
||||
|
||||
const templateForm = z.object({
|
||||
name: z.string().min(3, "Judul minimal 3 karakter"),
|
||||
deskripsi: z.string().min(3, "Deskripsi minimal 3 karakter"),
|
||||
imageId: z.string().nonempty(),
|
||||
})
|
||||
|
||||
const defaultForm = {
|
||||
name: "",
|
||||
deskripsi: "",
|
||||
imageId: "",
|
||||
}
|
||||
|
||||
const penangananDarurat = proxy({
|
||||
findMany: {
|
||||
data: [] as Prisma.PenangananDaruratGetPayload<{
|
||||
include: {
|
||||
image: true;
|
||||
};
|
||||
}>[],
|
||||
async load() {
|
||||
const res = await ApiFetch.api.kesehatan.penanganandarurat[
|
||||
"find-many"
|
||||
].get();
|
||||
if (res.status === 200) {
|
||||
penangananDarurat.findMany.data = res.data?.data ?? [];
|
||||
}
|
||||
},
|
||||
},
|
||||
create:{
|
||||
form: {...defaultForm},
|
||||
loading: false,
|
||||
async create() {
|
||||
const cek = templateForm.safeParse(penangananDarurat.create.form);
|
||||
if (!cek.success) {
|
||||
const err = `[${cek.error.issues
|
||||
.map((v) => `${v.path.join(".")}`)
|
||||
.join("\n")}] required`;
|
||||
return toast.error(err);
|
||||
}
|
||||
|
||||
try {
|
||||
penangananDarurat.create.loading = true;
|
||||
const res = await ApiFetch.api.kesehatan.penanganandarurat[
|
||||
"create"
|
||||
].post(penangananDarurat.create.form);
|
||||
if (res.status === 200) {
|
||||
penangananDarurat.findMany.load();
|
||||
return toast.success("Penanganan Darurat berhasil disimpan!");
|
||||
}
|
||||
|
||||
return toast.error("Gagal menyimpan penanganan darurat");
|
||||
} catch (error) {
|
||||
console.log((error as Error).message);
|
||||
} finally {
|
||||
penangananDarurat.create.loading = false;
|
||||
}
|
||||
},
|
||||
resetForm() {
|
||||
penangananDarurat.create.form = {...defaultForm};
|
||||
}
|
||||
},
|
||||
findUnique: {
|
||||
data: null as Prisma.PenangananDaruratGetPayload<{
|
||||
include: {
|
||||
image: true;
|
||||
};
|
||||
}> | null,
|
||||
async load(id: string) {
|
||||
try {
|
||||
const res = await fetch(`/api/kesehatan/penanganandarurat/${id}`);
|
||||
if (res.ok) {
|
||||
const data = await res.json();
|
||||
penangananDarurat.findUnique.data = data.data ?? null;
|
||||
} else {
|
||||
console.error("Failed to fetch data", res.status, res.statusText);
|
||||
penangananDarurat.findUnique.data = null;
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error fetching data:", error);
|
||||
penangananDarurat.findUnique.data = null;
|
||||
}
|
||||
},
|
||||
},
|
||||
delete: {
|
||||
loading: false,
|
||||
async byId(id: string) {
|
||||
try {
|
||||
penangananDarurat.delete.loading = true;
|
||||
const response = await fetch(`/api/kesehatan/penanganandarurat/del/${id}`, {
|
||||
method: 'DELETE',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
});
|
||||
|
||||
const result = await response.json();
|
||||
|
||||
if (response.ok && result?.success) {
|
||||
toast.success(result.message || "Penanganan darurat berhasil dihapus");
|
||||
await penangananDarurat.findMany.load(); // refresh list
|
||||
} else {
|
||||
toast.error(result?.message || "Gagal menghapus penanganan darurat");
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Gagal delete:", error);
|
||||
toast.error("Terjadi kesalahan saat menghapus penanganan darurat");
|
||||
} finally {
|
||||
penangananDarurat.delete.loading = false;
|
||||
}
|
||||
}
|
||||
},
|
||||
edit: {
|
||||
id: "",
|
||||
form: { ...defaultForm },
|
||||
loading: false,
|
||||
|
||||
async load(id: string) {
|
||||
if (!id) {
|
||||
toast.warn("ID tidak valid");
|
||||
return null;
|
||||
}
|
||||
|
||||
try {
|
||||
const response = await fetch(`/api/kesehatan/penanganandarurat/${id}`, {
|
||||
method: "GET",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
});
|
||||
if (!response.ok) {
|
||||
throw new Error(`HTTP error! status: ${response.status}`);
|
||||
}
|
||||
const result = await response.json();
|
||||
if (result?.success) {
|
||||
const data = result.data;
|
||||
this.id = data.id;
|
||||
this.form = {
|
||||
name: data.name,
|
||||
deskripsi: data.deskripsi,
|
||||
imageId: data.imageId,
|
||||
};
|
||||
return data; // Return the loaded data
|
||||
} else {
|
||||
throw new Error(result?.message || "Gagal memuat data");
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error fetching penanganan darurat:", error);
|
||||
toast.error(error instanceof Error ? error.message : "Gagal memuat data");
|
||||
return null;
|
||||
}
|
||||
},
|
||||
|
||||
async update() {
|
||||
const cek = templateForm.safeParse(penangananDarurat.edit.form);
|
||||
if (!cek.success) {
|
||||
const err = `[${cek.error.issues
|
||||
.map((v) => `${v.path.join(".")}`)
|
||||
.join("\n")}] required`;
|
||||
return toast.error(err);
|
||||
}
|
||||
|
||||
try {
|
||||
penangananDarurat.edit.loading = true;
|
||||
const response = await fetch(`/api/kesehatan/penanganandarurat/${this.id}`, {
|
||||
method: "PUT",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
body: JSON.stringify({
|
||||
name: this.form.name,
|
||||
deskripsi: this.form.deskripsi,
|
||||
imageId: this.form.imageId,
|
||||
}),
|
||||
});
|
||||
if (!response.ok) {
|
||||
const errorData = await response.json().catch(() => ({}));
|
||||
throw new Error(errorData.message || `HTTP error! status: ${response.status}`);
|
||||
}
|
||||
const result = await response.json();
|
||||
if (result.success) {
|
||||
toast.success(result.message || "Penanganan darurat berhasil diupdate");
|
||||
await penangananDarurat.findMany.load();
|
||||
return true;
|
||||
} else {
|
||||
throw new Error(result.message || "Gagal update penanganan darurat");
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Gagal update:", error);
|
||||
toast.error(error instanceof Error ? error.message : "Terjadi kesalahan saat mengupdate penanganan darurat");
|
||||
return false;
|
||||
} finally {
|
||||
penangananDarurat.edit.loading = false;
|
||||
}
|
||||
},
|
||||
reset() {
|
||||
penangananDarurat.edit.id = "";
|
||||
penangananDarurat.edit.form = { ...defaultForm };
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
export default penangananDarurat
|
||||
217
src/app/admin/(dashboard)/_state/kesehatan/posyandu/posyandu.ts
Normal file
217
src/app/admin/(dashboard)/_state/kesehatan/posyandu/posyandu.ts
Normal file
@@ -0,0 +1,217 @@
|
||||
import ApiFetch from "@/lib/api-fetch";
|
||||
import { Prisma } from "@prisma/client";
|
||||
import { toast } from "react-toastify";
|
||||
import { proxy } from "valtio";
|
||||
import { z } from "zod";
|
||||
|
||||
const templateForm = z.object({
|
||||
name: z.string().min(1, { message: "Name is required" }),
|
||||
nomor: z.string().min(1, { message: "Nomor is required" }),
|
||||
deskripsi: z.string().min(1, { message: "Deskripsi is required" }),
|
||||
imageId: z.string().nonempty(),
|
||||
});
|
||||
|
||||
const defaultForm = {
|
||||
name: "",
|
||||
nomor: "",
|
||||
deskripsi: "",
|
||||
imageId: "",
|
||||
};
|
||||
|
||||
const posyandustate = proxy({
|
||||
create: {
|
||||
form: { ...defaultForm },
|
||||
loading: false,
|
||||
async create() {
|
||||
const cek = templateForm.safeParse(posyandustate.create.form);
|
||||
if (!cek.success) {
|
||||
const err = `[${cek.error.issues
|
||||
.map((v) => `${v.path.join(".")}`)
|
||||
.join("\n")}] required`;
|
||||
return toast.error(err);
|
||||
}
|
||||
|
||||
try {
|
||||
posyandustate.create.loading = true;
|
||||
const res = await ApiFetch.api.kesehatan.posyandu["create"].post(posyandustate.create.form);
|
||||
if (res.status === 200) {
|
||||
posyandustate.findMany.load();
|
||||
return toast.success("Posyandu berhasil disimpan!");
|
||||
}
|
||||
return toast.error("Gagal menyimpan posyandu");
|
||||
} catch (error) {
|
||||
console.log((error as Error).message);
|
||||
} finally {
|
||||
posyandustate.create.loading = false;
|
||||
}
|
||||
},
|
||||
resetForm(){
|
||||
posyandustate.create.form = { ...defaultForm };
|
||||
}
|
||||
},
|
||||
findMany: {
|
||||
data: null as
|
||||
| Prisma.PosyanduGetPayload<{
|
||||
include: {
|
||||
image: true;
|
||||
}
|
||||
}>[]
|
||||
| null,
|
||||
async load() {
|
||||
const res = await ApiFetch.api.kesehatan.posyandu["find-many"].get();
|
||||
if (res.status === 200) {
|
||||
posyandustate.findMany.data = res.data?.data ?? [];
|
||||
}
|
||||
}
|
||||
},
|
||||
findUnique: {
|
||||
data: null as
|
||||
| Prisma.PosyanduGetPayload<{
|
||||
include: {
|
||||
image: true;
|
||||
}
|
||||
}> | null,
|
||||
async load(id: string) {
|
||||
try {
|
||||
const res = await fetch(`/api/kesehatan/posyandu/${id}`);
|
||||
if (res.ok) {
|
||||
const data = await res.json();
|
||||
posyandustate.findUnique.data = data.data ?? null;
|
||||
} else {
|
||||
console.error("Failed to fetch posyandu:", res.statusText);
|
||||
posyandustate.findUnique.data = null;
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error fetching posyandu:", error);
|
||||
posyandustate.findUnique.data = null;
|
||||
}
|
||||
}
|
||||
},
|
||||
delete: {
|
||||
loading: false,
|
||||
async byId(id: string) {
|
||||
try {
|
||||
posyandustate.delete.loading = true;
|
||||
const response = await fetch(`/api/kesehatan/posyandu/del/${id}`, {
|
||||
method: 'DELETE',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
});
|
||||
|
||||
const result = await response.json();
|
||||
|
||||
if (response.ok && result?.success) {
|
||||
toast.success(result.message || "Posyandu berhasil dihapus");
|
||||
await posyandustate.findMany.load(); // refresh list
|
||||
} else {
|
||||
toast.error(result?.message || "Gagal menghapus posyandu");
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Gagal delete:", error);
|
||||
toast.error("Terjadi kesalahan saat menghapus posyandu");
|
||||
} finally {
|
||||
posyandustate.delete.loading = false;
|
||||
}
|
||||
}
|
||||
},
|
||||
edit: {
|
||||
id: "",
|
||||
form: {...defaultForm},
|
||||
loading: false,
|
||||
|
||||
async load(id: string) {
|
||||
if(!id){
|
||||
toast.warn("ID tidak valid");
|
||||
return null;
|
||||
}
|
||||
|
||||
try {
|
||||
const response = await fetch(`/api/kesehatan/posyandu/${id}`, {
|
||||
method: 'GET',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
});
|
||||
|
||||
if(!response.ok){
|
||||
throw new Error(`HTTP error! status: ${response.status}`);
|
||||
}
|
||||
|
||||
const result = await response.json();
|
||||
|
||||
if(result?.success){
|
||||
const data = result.data;
|
||||
this.id = data.id;
|
||||
this.form = {
|
||||
name: data.name,
|
||||
nomor: data.nomor,
|
||||
deskripsi: data.deskripsi,
|
||||
imageId: data.imageId || "",
|
||||
};
|
||||
return data;
|
||||
} else {
|
||||
throw new Error(result?.message || "Gagal memuat data");
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error fetching posyandu:", error);
|
||||
toast.error(error instanceof Error ? error.message : "Gagal memuat data");
|
||||
return null;
|
||||
}
|
||||
},
|
||||
async update() {
|
||||
const cek = templateForm.safeParse(posyandustate.edit.form);
|
||||
if(!cek.success){
|
||||
const err = `[${cek.error.issues
|
||||
.map((v) => `${v.path.join(".")}`)
|
||||
.join("\n")}] required`;
|
||||
toast.error(err);
|
||||
return false;
|
||||
}
|
||||
|
||||
try {
|
||||
posyandustate.edit.loading = true;
|
||||
const response = await fetch(`/api/kesehatan/posyandu/${this.id}`, {
|
||||
method: 'PUT',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify({
|
||||
name: this.form.name,
|
||||
nomor: this.form.nomor,
|
||||
deskripsi: this.form.deskripsi,
|
||||
imageId: this.form.imageId,
|
||||
}),
|
||||
});
|
||||
|
||||
if(!response.ok){
|
||||
const errorData = await response.json().catch(() => ({}));
|
||||
throw new Error(errorData.message || `HTTP error! status: ${response.status}`);
|
||||
}
|
||||
|
||||
const result = await response.json();
|
||||
|
||||
if(result.success){
|
||||
toast.success(result.message || "Posyandu berhasil diperbarui");
|
||||
await posyandustate.findMany.load(); // refresh list
|
||||
return true;
|
||||
} else {
|
||||
throw new Error(result.message || "Gagal memuat data");
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error fetching posyandu:", error);
|
||||
toast.error(error instanceof Error ? error.message : "Gagal memuat data");
|
||||
return false;
|
||||
} finally {
|
||||
posyandustate.edit.loading = false;
|
||||
}
|
||||
},
|
||||
|
||||
reset() {
|
||||
posyandustate.edit.id = "";
|
||||
posyandustate.edit.form = {...defaultForm};
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
export default posyandustate;
|
||||
@@ -0,0 +1,214 @@
|
||||
import ApiFetch from "@/lib/api-fetch";
|
||||
import { Prisma } from "@prisma/client";
|
||||
import { toast } from "react-toastify";
|
||||
import { proxy } from "valtio";
|
||||
import { z } from "zod";
|
||||
|
||||
const templateForm = z.object({
|
||||
name: z.string().min(3, "Judul minimal 3 karakter"),
|
||||
deskripsiSingkat: z.string().min(3, "Deskripsi singkat minimal 3 karakter"),
|
||||
deskripsi: z.string().min(3, "Deskripsi minimal 3 karakter"),
|
||||
imageId: z.string().nonempty(),
|
||||
});
|
||||
|
||||
const defaultForm = {
|
||||
name: "",
|
||||
deskripsiSingkat: "",
|
||||
deskripsi: "",
|
||||
imageId: "",
|
||||
};
|
||||
|
||||
const programKesehatan = proxy({
|
||||
findMany: {
|
||||
data: [] as Prisma.ProgramKesehatanGetPayload<{
|
||||
include: {
|
||||
image: true;
|
||||
};
|
||||
}>[],
|
||||
async load() {
|
||||
const res = await ApiFetch.api.kesehatan.programkesehatan[
|
||||
"find-many"
|
||||
].get();
|
||||
if (res.status === 200) {
|
||||
programKesehatan.findMany.data = res.data?.data ?? [];
|
||||
}
|
||||
},
|
||||
},
|
||||
create: {
|
||||
form: { ...defaultForm },
|
||||
loading: false,
|
||||
async create() {
|
||||
const cek = templateForm.safeParse(programKesehatan.create.form);
|
||||
if (!cek.success) {
|
||||
const err = `[${cek.error.issues
|
||||
.map((v) => `${v.path.join(".")}`)
|
||||
.join("\n")}] required`;
|
||||
return toast.error(err);
|
||||
}
|
||||
|
||||
try {
|
||||
programKesehatan.create.loading = true;
|
||||
const res = await ApiFetch.api.kesehatan.programkesehatan[
|
||||
"create"
|
||||
].post(programKesehatan.create.form);
|
||||
if (res.status === 200) {
|
||||
programKesehatan.findMany.load();
|
||||
return toast.success("Program Kesehatan berhasil disimpan!");
|
||||
}
|
||||
|
||||
return toast.error("Gagal menyimpan program kesehatan");
|
||||
} catch (error) {
|
||||
console.log((error as Error).message);
|
||||
} finally {
|
||||
programKesehatan.create.loading = false;
|
||||
}
|
||||
},
|
||||
resetForm() {
|
||||
programKesehatan.create.form = { ...defaultForm };
|
||||
},
|
||||
},
|
||||
findUnique: {
|
||||
data: null as Prisma.ProgramKesehatanGetPayload<{
|
||||
include: {
|
||||
image: true;
|
||||
};
|
||||
}> | null,
|
||||
async load(id: string) {
|
||||
try {
|
||||
const res = await fetch(`/api/kesehatan/programkesehatan/${id}`);
|
||||
if (res.ok) {
|
||||
const data = await res.json();
|
||||
programKesehatan.findUnique.data = data.data ?? null;
|
||||
} else {
|
||||
console.error("Failed to fetch program kesehatan:", res.statusText);
|
||||
programKesehatan.findUnique.data = null;
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error fetching program kesehatan:", error);
|
||||
programKesehatan.findUnique.data = null;
|
||||
}
|
||||
},
|
||||
},
|
||||
delete: {
|
||||
loading: false,
|
||||
async byId(id: string) {
|
||||
if (!id) return toast.warn("ID tidak valid");
|
||||
|
||||
try {
|
||||
programKesehatan.delete.loading = true;
|
||||
|
||||
const response = await fetch(`/api/kesehatan/programkesehatan/del/${id}`, {
|
||||
method: "DELETE",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
});
|
||||
|
||||
const result = await response.json();
|
||||
if (response.ok && result?.success) {
|
||||
toast.success(result.message || "Program kesehatan berhasil dihapus");
|
||||
await programKesehatan.findMany.load(); // refresh list
|
||||
} else {
|
||||
toast.error(result?.message || "Gagal menghapus program kesehatan");
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Gagal delete:", error);
|
||||
toast.error("Terjadi kesalahan saat menghapus program kesehatan");
|
||||
} finally {
|
||||
programKesehatan.delete.loading = false;
|
||||
}
|
||||
},
|
||||
},
|
||||
edit: {
|
||||
id: "",
|
||||
form: { ...defaultForm },
|
||||
loading: false,
|
||||
|
||||
async load(id: string) {
|
||||
if (!id) {
|
||||
toast.warn("ID tidak valid");
|
||||
return null;
|
||||
}
|
||||
|
||||
try {
|
||||
const response = await fetch(`/api/kesehatan/programkesehatan/${id}`, {
|
||||
method: "GET",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
});
|
||||
if (!response.ok) {
|
||||
throw new Error(`HTTP error! status: ${response.status}`);
|
||||
}
|
||||
const result = await response.json();
|
||||
if (result?.success) {
|
||||
const data = result.data;
|
||||
this.id = data.id;
|
||||
this.form = {
|
||||
name: data.name,
|
||||
deskripsiSingkat: data.deskripsiSingkat,
|
||||
deskripsi: data.deskripsi,
|
||||
imageId: data.imageId,
|
||||
};
|
||||
return data; // Return the loaded data
|
||||
} else {
|
||||
throw new Error(result?.message || "Gagal memuat data");
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error fetching program kesehatan:", error);
|
||||
toast.error(error instanceof Error ? error.message : "Gagal memuat data");
|
||||
return null;
|
||||
}
|
||||
},
|
||||
|
||||
async update() {
|
||||
const cek = templateForm.safeParse(programKesehatan.edit.form);
|
||||
if (!cek.success) {
|
||||
const err = `[${cek.error.issues
|
||||
.map((v) => `${v.path.join(".")}`)
|
||||
.join("\n")}] required`;
|
||||
return toast.error(err);
|
||||
}
|
||||
|
||||
try {
|
||||
programKesehatan.edit.loading = true;
|
||||
const response = await fetch(`/api/kesehatan/programkesehatan/${this.id}`, {
|
||||
method: "PUT",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
body: JSON.stringify({
|
||||
name: this.form.name,
|
||||
deskripsiSingkat: this.form.deskripsiSingkat,
|
||||
deskripsi: this.form.deskripsi,
|
||||
imageId: this.form.imageId,
|
||||
}),
|
||||
});
|
||||
if (!response.ok) {
|
||||
const errorData = await response.json().catch(() => ({}));
|
||||
throw new Error(errorData.message || `HTTP error! status: ${response.status}`);
|
||||
}
|
||||
const result = await response.json();
|
||||
if (result.success) {
|
||||
toast.success(result.message || "Program kesehatan berhasil diupdate");
|
||||
await programKesehatan.findMany.load();
|
||||
return true;
|
||||
} else {
|
||||
throw new Error(result.message || "Gagal update program kesehatan");
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Gagal update:", error);
|
||||
toast.error(error instanceof Error ? error.message : "Terjadi kesalahan saat mengupdate program kesehatan");
|
||||
return false;
|
||||
} finally {
|
||||
programKesehatan.edit.loading = false;
|
||||
}
|
||||
},
|
||||
reset() {
|
||||
programKesehatan.edit.id = "";
|
||||
programKesehatan.edit.form = { ...defaultForm };
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
export default programKesehatan;
|
||||
@@ -0,0 +1,298 @@
|
||||
import ApiFetch from "@/lib/api-fetch";
|
||||
import { Prisma } from "@prisma/client";
|
||||
import { toast } from "react-toastify";
|
||||
import { proxy } from "valtio";
|
||||
import { z } from "zod";
|
||||
|
||||
// Validasi form
|
||||
const templateForm = z.object({
|
||||
name: z.string().min(1),
|
||||
alamat: z.string().min(1),
|
||||
imageId: z.string().min(1),
|
||||
jam: z.object({
|
||||
workDays: z.string().min(1),
|
||||
weekDays: z.string().min(1),
|
||||
holiday: z.string().min(1),
|
||||
}),
|
||||
kontak: z.object({
|
||||
kontakPuskesmas: z.string().min(1),
|
||||
email: z.string().min(1),
|
||||
facebook: z.string().min(1),
|
||||
kontakUGD: z.string().min(1),
|
||||
}),
|
||||
});
|
||||
|
||||
// Default form
|
||||
const defaultForm = {
|
||||
name: "",
|
||||
alamat: "",
|
||||
imageId: "",
|
||||
jam: {
|
||||
workDays: "",
|
||||
weekDays: "",
|
||||
holiday: "",
|
||||
},
|
||||
kontak: {
|
||||
kontakPuskesmas: "",
|
||||
email: "",
|
||||
facebook: "",
|
||||
kontakUGD: "",
|
||||
},
|
||||
image: undefined,
|
||||
};
|
||||
|
||||
const puskesmasState = proxy({
|
||||
create: {
|
||||
form: { ...defaultForm },
|
||||
loading: false,
|
||||
async submit() {
|
||||
const cek = templateForm.safeParse(puskesmasState.create.form);
|
||||
if (!cek.success) {
|
||||
const err = `[${cek.error.issues.map((v) => v.path.join(".")).join(", ")}] required`;
|
||||
return toast.error(err);
|
||||
}
|
||||
|
||||
try {
|
||||
puskesmasState.create.loading = true;
|
||||
|
||||
console.log('Form data:', puskesmasState.create.form);
|
||||
interface ErrorResponse {
|
||||
message?: string;
|
||||
error?: string;
|
||||
errors?: Record<string, string[]>;
|
||||
}
|
||||
|
||||
const payload = {
|
||||
name: puskesmasState.create.form.name,
|
||||
alamat: puskesmasState.create.form.alamat,
|
||||
imageId: puskesmasState.create.form.imageId,
|
||||
jam: {
|
||||
workDays: puskesmasState.create.form.jam.workDays,
|
||||
weekDays: puskesmasState.create.form.jam.weekDays,
|
||||
holiday: puskesmasState.create.form.jam.holiday,
|
||||
},
|
||||
kontak: {
|
||||
kontakPuskesmas: puskesmasState.create.form.kontak.kontakPuskesmas,
|
||||
email: puskesmasState.create.form.kontak.email,
|
||||
facebook: puskesmasState.create.form.kontak.facebook,
|
||||
kontakUGD: puskesmasState.create.form.kontak.kontakUGD,
|
||||
},
|
||||
};
|
||||
|
||||
|
||||
|
||||
|
||||
console.log('Sending payload:', JSON.stringify(payload, null, 2));
|
||||
|
||||
try {
|
||||
const res = await ApiFetch.api.kesehatan.puskesmas.create.post(payload);
|
||||
console.log('API Response:', res);
|
||||
|
||||
if (res.status === 200) {
|
||||
await puskesmasState.findMany.load();
|
||||
toast.success("Berhasil menambahkan puskesmas");
|
||||
return res;
|
||||
} else {
|
||||
console.error('API Error Response:', {
|
||||
status: res.status,
|
||||
data: res.data
|
||||
});
|
||||
|
||||
const errorData = res.data as ErrorResponse;
|
||||
let errorMessage = 'Gagal menambahkan puskesmas';
|
||||
|
||||
if (errorData?.message) {
|
||||
errorMessage = errorData.message;
|
||||
} else if (errorData?.error) {
|
||||
errorMessage = errorData.error;
|
||||
} else if (errorData?.errors) {
|
||||
errorMessage = Object.entries(errorData.errors)
|
||||
.map(([field, messages]) => `${field}: ${Array.isArray(messages) ? messages.join(', ') : messages}`)
|
||||
.join('; ');
|
||||
}
|
||||
|
||||
console.error('Extracted error message:', errorMessage);
|
||||
toast.error(errorMessage);
|
||||
throw new Error(errorMessage);
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Error in API call:', {
|
||||
error,
|
||||
errorString: String(error),
|
||||
jsonError: error instanceof Error ? {
|
||||
name: error.name,
|
||||
message: error.message,
|
||||
stack: error.stack
|
||||
} : 'Not an Error instance'
|
||||
});
|
||||
throw error;
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error in puskesmas submit:", {
|
||||
error,
|
||||
errorString: String(error),
|
||||
errorType: typeof error,
|
||||
isErrorInstance: error instanceof Error,
|
||||
errorDetails: error instanceof Error ? {
|
||||
name: error.name,
|
||||
message: error.message,
|
||||
stack: error.stack,
|
||||
cause: error.cause
|
||||
} : null
|
||||
});
|
||||
|
||||
let errorMessage = "Terjadi kesalahan saat menambahkan puskesmas";
|
||||
if (error instanceof Error) {
|
||||
errorMessage = error.message || errorMessage;
|
||||
} else if (error && typeof error === 'object' && 'message' in error) {
|
||||
errorMessage = String((error as { message: unknown }).message);
|
||||
} else if (typeof error === 'string') {
|
||||
errorMessage = error;
|
||||
}
|
||||
|
||||
console.error('Displaying error to user:', errorMessage);
|
||||
toast.error(errorMessage);
|
||||
throw error;
|
||||
} finally {
|
||||
puskesmasState.create.loading = false;
|
||||
}
|
||||
},
|
||||
resetForm() {
|
||||
puskesmasState.create.form = { ...defaultForm };
|
||||
}
|
||||
},
|
||||
|
||||
findMany: {
|
||||
data: null as Prisma.PuskesmasGetPayload<{
|
||||
include: { image: true; jam: true; kontak: true };
|
||||
}>[] | null,
|
||||
async load() {
|
||||
const res = await ApiFetch.api.kesehatan.puskesmas["find-many"].get();
|
||||
if (res.status === 200) {
|
||||
puskesmasState.findMany.data = res.data?.data ?? [];
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
findUnique: {
|
||||
data: null as Prisma.PuskesmasGetPayload<{
|
||||
include: { image: true; jam: true; kontak: true };
|
||||
}> | null,
|
||||
async load(id: string) {
|
||||
const res = await fetch(`/api/kesehatan/puskesmas/${id}`);
|
||||
if (res.ok) {
|
||||
const data = await res.json();
|
||||
puskesmasState.findUnique.data = data.data ?? null;
|
||||
} else {
|
||||
toast.error("Gagal load data puskesmas");
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
edit: {
|
||||
id: "",
|
||||
form: { ...defaultForm },
|
||||
loading: false,
|
||||
|
||||
async load(id: string) {
|
||||
const res = await fetch(`/api/kesehatan/puskesmas/${id}`);
|
||||
if (!res.ok) {
|
||||
toast.error("Gagal memuat data");
|
||||
return;
|
||||
}
|
||||
|
||||
const result = await res.json();
|
||||
const data = result.data;
|
||||
|
||||
puskesmasState.edit.id = data.id;
|
||||
puskesmasState.edit.form = {
|
||||
name: data.name,
|
||||
alamat: data.alamat,
|
||||
imageId: data.imageId,
|
||||
jam: {
|
||||
workDays: data.jam.workDays,
|
||||
weekDays: data.jam.weekDays,
|
||||
holiday: data.jam.holiday,
|
||||
},
|
||||
kontak: {
|
||||
kontakPuskesmas: data.kontak.kontakPuskesmas,
|
||||
email: data.kontak.email,
|
||||
facebook: data.kontak.facebook,
|
||||
kontakUGD: data.kontak.kontakUGD,
|
||||
},
|
||||
image: data.image,
|
||||
};
|
||||
},
|
||||
|
||||
async submit() {
|
||||
const cek = templateForm.safeParse(puskesmasState.edit.form);
|
||||
if (!cek.success) {
|
||||
const err = `[${cek.error.issues.map((v) => v.path.join(".")).join(", ")}] required`;
|
||||
toast.error(err);
|
||||
return false;
|
||||
}
|
||||
|
||||
try {
|
||||
puskesmasState.edit.loading = true;
|
||||
const payload = {
|
||||
name: puskesmasState.edit.form.name,
|
||||
alamat: puskesmasState.edit.form.alamat,
|
||||
imageId: puskesmasState.edit.form.imageId,
|
||||
jam: { ...puskesmasState.edit.form.jam },
|
||||
kontak: { ...puskesmasState.edit.form.kontak }
|
||||
};
|
||||
|
||||
const res = await fetch(`/api/kesehatan/puskesmas/${puskesmasState.edit.id}`, {
|
||||
method: "PUT",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify(payload),
|
||||
});
|
||||
|
||||
if (!res.ok) {
|
||||
const error = await res.json();
|
||||
throw new Error(error.message || "Update gagal");
|
||||
}
|
||||
|
||||
toast.success("Berhasil update puskesmas");
|
||||
await puskesmasState.findMany.load();
|
||||
return true;
|
||||
} catch (err) {
|
||||
toast.error(err instanceof Error ? err.message : "Terjadi kesalahan saat update");
|
||||
return false;
|
||||
} finally {
|
||||
puskesmasState.edit.loading = false;
|
||||
}
|
||||
},
|
||||
|
||||
reset() {
|
||||
puskesmasState.edit.id = "";
|
||||
puskesmasState.edit.form = { ...defaultForm };
|
||||
}
|
||||
},
|
||||
|
||||
delete: {
|
||||
loading: false,
|
||||
async byId(id: string) {
|
||||
try {
|
||||
puskesmasState.delete.loading = true;
|
||||
const res = await fetch(`/api/kesehatan/puskesmas/del/${id}`, {
|
||||
method: "DELETE",
|
||||
});
|
||||
|
||||
const result = await res.json();
|
||||
if (res.ok && result.success) {
|
||||
toast.success("Puskesmas berhasil dihapus");
|
||||
await puskesmasState.findMany.load();
|
||||
} else {
|
||||
toast.error(result.message || "Gagal menghapus");
|
||||
}
|
||||
} catch {
|
||||
toast.error("Terjadi kesalahan saat menghapus");
|
||||
} finally {
|
||||
puskesmasState.delete.loading = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
export default puskesmasState;
|
||||
@@ -5,8 +5,8 @@ import { proxy } from "valtio";
|
||||
import { z } from "zod";
|
||||
|
||||
const templateGrafikJenisKelamin = z.object({
|
||||
laki: z.string().min(2, "Data laki-laki harus diisi"),
|
||||
perempuan: z.string().min(2, "Data perempuan harus diisi"),
|
||||
laki: z.string().min(1, "Data laki-laki harus diisi"),
|
||||
perempuan: z.string().min(1, "Data perempuan harus diisi"),
|
||||
});
|
||||
|
||||
type GrafikJenisKelamin = Prisma.GrafikBerdasarkanJenisKelaminGetPayload<{
|
||||
|
||||
@@ -5,10 +5,10 @@ import { proxy } from "valtio";
|
||||
import { z } from "zod";
|
||||
|
||||
const templateGrafikUmur = z.object({
|
||||
remaja: z.string().min(2, "Data remaja harus diisi"),
|
||||
dewasa: z.string().min(2, "Data dewasa harus diisi"),
|
||||
orangtua: z.string().min(2, "Data orangtua harus diisi"),
|
||||
lansia: z.string().min(2, "Data lansia harus diisi"),
|
||||
remaja: z.string().min(1, "Data remaja harus diisi"),
|
||||
dewasa: z.string().min(1, "Data dewasa harus diisi"),
|
||||
orangtua: z.string().min(1, "Data orangtua harus diisi"),
|
||||
lansia: z.string().min(1, "Data lansia harus diisi"),
|
||||
});
|
||||
|
||||
type GrafikUmur = Prisma.GrafikBerdasarkanUmurGetPayload<{
|
||||
|
||||
@@ -6,7 +6,7 @@ import { z } from "zod";
|
||||
|
||||
const templateGrafikHasilKepuasanMasyarakat = z.object({
|
||||
label: z.string().min(2, "Label harus diisi"),
|
||||
kepuasan: z.string().min(2, "Kepuasan harus diisi"),
|
||||
kepuasan: z.string().min(1, "Kepuasan harus diisi"),
|
||||
});
|
||||
|
||||
type GrafikHasilKepuasanMasyarakat = Prisma.IndeksKepuasanMasyarakatGetPayload<{
|
||||
|
||||
@@ -0,0 +1,77 @@
|
||||
/* eslint-disable react-hooks/exhaustive-deps */
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Stack, Tabs, TabsList, TabsPanel, TabsTab, Title } from '@mantine/core';
|
||||
import { usePathname, useRouter } from 'next/navigation';
|
||||
import React, { useEffect, useState } from 'react';
|
||||
|
||||
function LayoutTabs({ children }: { children: React.ReactNode }) {
|
||||
const router = useRouter()
|
||||
const pathname = usePathname()
|
||||
const tabs = [
|
||||
{
|
||||
label: "Presentase Kelahiran & Kematian",
|
||||
value: "presentasekelahiran&kematian",
|
||||
href: "/admin/kesehatan/data-kesehatan-warga/persentase_data_kelahiran_kematian"
|
||||
},
|
||||
{
|
||||
label: "Grafik Hasil Kepuasan Masyarakat Terhadap Pelayanan Publik",
|
||||
value: "grafikhasilkepuasan",
|
||||
href: "/admin/kesehatan/data-kesehatan-warga/grafik_hasil_kepuasan"
|
||||
},
|
||||
{
|
||||
label: "Fasilitas Kesehatan",
|
||||
value: "fasilitaskesehatan",
|
||||
href: "/admin/kesehatan/data-kesehatan-warga/fasilitas_kesehatan"
|
||||
},
|
||||
{
|
||||
label: "Jadwal Kegiatan",
|
||||
value: "jadwalkegiatan",
|
||||
href: "/admin/kesehatan/data-kesehatan-warga/jadwal_kegiatan"
|
||||
},
|
||||
{
|
||||
label: "Artikel Kesehatan",
|
||||
value: "artikelkesehatan",
|
||||
href: "/admin/kesehatan/data-kesehatan-warga/artikel_kesehatan"
|
||||
},
|
||||
];
|
||||
const curentTab = tabs.find(tab => tab.href === pathname)
|
||||
const [activeTab, setActiveTab] = useState<string | null>(curentTab?.value || tabs[0].value);
|
||||
|
||||
const handleTabChange = (value: string | null) => {
|
||||
const tab = tabs.find(t => t.value === value)
|
||||
if (tab) {
|
||||
router.push(tab.href)
|
||||
}
|
||||
setActiveTab(value)
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
const match = tabs.find(tab => tab.href === pathname)
|
||||
if (match) {
|
||||
setActiveTab(match.value)
|
||||
}
|
||||
}, [pathname])
|
||||
|
||||
return (
|
||||
<Stack>
|
||||
<Title order={3}>Data Kesehatan Warga</Title>
|
||||
<Tabs color={colors['blue-button']} variant='pills' value={activeTab} onChange={handleTabChange}>
|
||||
<TabsList p={"xs"} bg={"#BBC8E7FF"}>
|
||||
{tabs.map((e, i) => (
|
||||
<TabsTab key={i} value={e.value}>{e.label}</TabsTab>
|
||||
))}
|
||||
</TabsList>
|
||||
{tabs.map((e, i) => (
|
||||
<TabsPanel key={i} value={e.value}>
|
||||
{/* Konten dummy, bisa diganti tergantung routing */}
|
||||
<></>
|
||||
</TabsPanel>
|
||||
))}
|
||||
</Tabs>
|
||||
{children}
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default LayoutTabs;
|
||||
@@ -1,89 +0,0 @@
|
||||
import stateFasilitasKesehatan from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/fasilitasKesehatan';
|
||||
import colors from '@/con/colors';
|
||||
import { Center, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text } from '@mantine/core';
|
||||
import { useShallowEffect } from '@mantine/hooks';
|
||||
import _ from 'lodash';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
|
||||
function DokterdanTenagaMedisList() {
|
||||
const kesehatanState = useProxy(stateFasilitasKesehatan.dokterdantenagamedis);
|
||||
|
||||
useShallowEffect(() => {
|
||||
kesehatanState.findMany.load();
|
||||
}, []);
|
||||
|
||||
// Penanganan kasus ketika tidak ada data
|
||||
if (_.isEmpty(kesehatanState.findMany.data)) {
|
||||
return (
|
||||
<Stack>
|
||||
<Table
|
||||
striped
|
||||
highlightOnHover
|
||||
withTableBorder
|
||||
withColumnBorders
|
||||
bg={colors['white-1']}
|
||||
>
|
||||
<TableThead>
|
||||
<TableTr>
|
||||
<TableTh>
|
||||
<Center>Nama</Center>
|
||||
</TableTh>
|
||||
<TableTh>
|
||||
<Center>Specialist</Center>
|
||||
</TableTh>
|
||||
<TableTh >
|
||||
<Center>Jadwal</Center>
|
||||
</TableTh>
|
||||
</TableTr>
|
||||
</TableThead>
|
||||
<TableTbody >
|
||||
<TableTr >
|
||||
<TableTd colSpan={3}>
|
||||
<Center>
|
||||
<Text>Tidak ada data</Text>
|
||||
</Center>
|
||||
</TableTd>
|
||||
</TableTr>
|
||||
</TableTbody>
|
||||
</Table>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<Stack>
|
||||
<Table
|
||||
striped
|
||||
highlightOnHover
|
||||
withTableBorder
|
||||
withColumnBorders
|
||||
bg={colors['white-1']}
|
||||
>
|
||||
<TableThead >
|
||||
<TableTr >
|
||||
<TableTh >
|
||||
<Center>Nama</Center>
|
||||
</TableTh>
|
||||
<TableTh >
|
||||
<Center>Specialist</Center>
|
||||
</TableTh>
|
||||
<TableTh >
|
||||
<Center>Jadwal</Center>
|
||||
</TableTh>
|
||||
</TableTr>
|
||||
</TableThead>
|
||||
<TableTbody >
|
||||
{kesehatanState.findMany.data?.map((item) => (
|
||||
<TableTr key={item.id}>
|
||||
<TableTd ta="center">{item.name}</TableTd>
|
||||
<TableTd ta="center">Specialist {item.specialist}</TableTd>
|
||||
<TableTd ta="center">{item.jadwal}</TableTd>
|
||||
</TableTr>
|
||||
))}
|
||||
</TableTbody>
|
||||
</Table>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default DokterdanTenagaMedisList;
|
||||
@@ -1,41 +0,0 @@
|
||||
import stateFasilitasKesehatan from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/fasilitasKesehatan';
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Paper, Stack, Text, TextInput } from '@mantine/core';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
|
||||
function DokterDanTenagaMedis() {
|
||||
const dokterdantenagamedisState = useProxy(stateFasilitasKesehatan.dokterdantenagamedis)
|
||||
return (
|
||||
<Box>
|
||||
<Paper bg={colors['white-1']} p={"md"}>
|
||||
<Stack gap={"xs"}>
|
||||
<Text fw={"bold"}>Dokter & Tenaga Medis</Text>
|
||||
<TextInput
|
||||
label="Nama Dokter"
|
||||
placeholder='masukkan nama dokter'
|
||||
onChange={(val) => {
|
||||
dokterdantenagamedisState.create.form.name = val.target.value
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label="Specialist"
|
||||
placeholder='masukkan specialist'
|
||||
onChange={(val) => {
|
||||
dokterdantenagamedisState.create.form.specialist = val.target.value
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
mb={10}
|
||||
label="Jadwal"
|
||||
placeholder='masukkan jadwal'
|
||||
onChange={(val) => {
|
||||
dokterdantenagamedisState.create.form.jadwal = val.target.value
|
||||
}}
|
||||
/>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default DokterDanTenagaMedis;
|
||||
@@ -1,21 +0,0 @@
|
||||
import { Box, Stack, Text } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import stateFasilitasKesehatan from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/fasilitasKesehatan';
|
||||
import { useShallowEffect } from '@mantine/hooks';
|
||||
|
||||
function FasilitasPendukungList() {
|
||||
const fasilitaspendukungState = useProxy(stateFasilitasKesehatan.fasilitaspendukung)
|
||||
useShallowEffect(() => {
|
||||
fasilitaspendukungState.findMany.load()
|
||||
}, [])
|
||||
return <Stack>
|
||||
{fasilitaspendukungState.findMany.data?.map((item) => (
|
||||
<Box key={item.id}>
|
||||
<Text dangerouslySetInnerHTML={{__html: item.content}}/>
|
||||
</Box>
|
||||
))}
|
||||
</Stack>
|
||||
}
|
||||
|
||||
export default FasilitasPendukungList;
|
||||
@@ -1,21 +0,0 @@
|
||||
import stateFasilitasKesehatan from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/fasilitasKesehatan';
|
||||
import { Box, Paper, Text } from '@mantine/core';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import { KesehatanEditor } from '../../../_com/kesehatanEditor';
|
||||
import colors from '@/con/colors';
|
||||
|
||||
function FasilitasPendukung() {
|
||||
const fasilitaspendukungState = useProxy(stateFasilitasKesehatan.fasilitaspendukung)
|
||||
return <Box>
|
||||
<Paper bg={colors['white-1']} p={'md'}>
|
||||
<Text fw={"bold"}>Fasilitas Pendukung</Text>
|
||||
<KesehatanEditor
|
||||
showSubmit={false}
|
||||
onChange={(val) => {
|
||||
fasilitaspendukungState.create.form.content = val;
|
||||
}} />
|
||||
</Paper>
|
||||
</Box>
|
||||
}
|
||||
|
||||
export default FasilitasPendukung;
|
||||
@@ -1,40 +0,0 @@
|
||||
'use client'
|
||||
import stateFasilitasKesehatan from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/fasilitasKesehatan';
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Paper, Stack, Text, TextInput } from '@mantine/core';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
|
||||
function InformasiUmum() {
|
||||
const infromasiState = useProxy(stateFasilitasKesehatan.informasiumum)
|
||||
return <Box>
|
||||
<Paper bg={colors['white-1']} p={'md'}>
|
||||
<Text fw={"bold"}>Informasi Umum</Text>
|
||||
<Stack gap={"xs"}>
|
||||
<TextInput
|
||||
label="Fasilitas"
|
||||
placeholder='masukkan nama fasilitas kesehatan'
|
||||
onChange={(val) => {
|
||||
infromasiState.create.form.fasilitas = val.target.value
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label="Alamat"
|
||||
placeholder='masukkan alamat'
|
||||
onChange={(val) => {
|
||||
infromasiState.create.form.alamat = val.target.value
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
mb={10}
|
||||
label="Jam Operasional"
|
||||
placeholder='masukkan jam operasional'
|
||||
onChange={(val) => {
|
||||
infromasiState.create.form.jamOperasional = val.target.value
|
||||
}}
|
||||
/>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Box>
|
||||
}
|
||||
|
||||
export default InformasiUmum;
|
||||
@@ -1,23 +0,0 @@
|
||||
'use client'
|
||||
import stateFasilitasKesehatan from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/fasilitasKesehatan';
|
||||
import { Box, Paper, Text } from '@mantine/core';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import { KesehatanEditor } from '../../../_com/kesehatanEditor';
|
||||
import colors from '@/con/colors';
|
||||
|
||||
function LayananUnggulan() {
|
||||
const informasiumumState = useProxy(stateFasilitasKesehatan.layananunggulan)
|
||||
return <Box>
|
||||
<Paper bg={colors['white-1']} p={'md'}>
|
||||
<Text fw={"bold"}>Layanan Unggulan</Text>
|
||||
<KesehatanEditor
|
||||
showSubmit={false}
|
||||
onChange={(val) => {
|
||||
informasiumumState.create.form.content = val;
|
||||
}} />
|
||||
</Paper>
|
||||
</Box>
|
||||
;
|
||||
}
|
||||
|
||||
export default LayananUnggulan;
|
||||
@@ -1,254 +0,0 @@
|
||||
"use client"
|
||||
|
||||
import stateFasilitasKesehatan from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/fasilitasKesehatan';
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Center, Paper, SimpleGrid, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text, Title } from '@mantine/core';
|
||||
import { useShallowEffect } from '@mantine/hooks';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import DokterDanTenagaMedis from './dokterdantenagamedis/page';
|
||||
import FasilitasPendukung from './fasilitas_pendukung/page';
|
||||
import InformasiUmum from './informasi_umum/page';
|
||||
import LayananUnggulan from './layanan_unggulan/page';
|
||||
import ProsedurPendaftaran from './prosedurpendaftaran/page';
|
||||
import TarifDanLayanan from './tarifdanlayanan/page';
|
||||
|
||||
|
||||
function FasilitasKesehatan() {
|
||||
const allState = useProxy(stateFasilitasKesehatan)
|
||||
const submitAllForms = () => {
|
||||
if (allState.informasiumum.create.form.fasilitas &&
|
||||
allState.informasiumum.create.form.alamat &&
|
||||
allState.informasiumum.create.form.jamOperasional) {
|
||||
allState.informasiumum.create.create()
|
||||
}
|
||||
|
||||
if (allState.layananunggulan.create.form.content) {
|
||||
allState.layananunggulan.create.create();
|
||||
}
|
||||
|
||||
if (allState.dokterdantenagamedis.create.form.name &&
|
||||
allState.dokterdantenagamedis.create.form.specialist &&
|
||||
allState.dokterdantenagamedis.create.form.jadwal) {
|
||||
allState.dokterdantenagamedis.create.create()
|
||||
}
|
||||
|
||||
if (allState.fasilitaspendukung.create.form.content) {
|
||||
allState.fasilitaspendukung.create.create();
|
||||
}
|
||||
|
||||
if (allState.tarifdanlayanan.create.form.tarif &&
|
||||
allState.tarifdanlayanan.create.form.layanan) {
|
||||
allState.tarifdanlayanan.create.create()
|
||||
}
|
||||
|
||||
if (allState.prosedurpendaftaran.create.form.content) {
|
||||
allState.prosedurpendaftaran.create.create();
|
||||
}
|
||||
|
||||
// refreshListData();
|
||||
// resetAllForms();
|
||||
}
|
||||
|
||||
// const refreshListData = () => {
|
||||
// allState.informasiumum.findMany.load();
|
||||
// allState.layananunggulan.findMany.load();
|
||||
// allState.dokterdantenagamedis.findMany.load();
|
||||
// allState.fasilitaspendukung.findMany.load();
|
||||
// allState.tarifdanlayanan.findMany.load();
|
||||
// allState.prosedurpendaftaran.findMany.load();
|
||||
// }
|
||||
|
||||
// const resetAllForms = () => {
|
||||
// allState.informasiumum.create.form = {
|
||||
// fasilitas: '',
|
||||
// alamat: '',
|
||||
// jamOperasional: ''
|
||||
// };
|
||||
// allState.layananunggulan.create.form = {
|
||||
// content: ''
|
||||
// };
|
||||
// allState.dokterdantenagamedis.create.form = {
|
||||
// name: '',
|
||||
// specialist: '',
|
||||
// jadwal: ''
|
||||
// };
|
||||
// allState.fasilitaspendukung.create.form = {
|
||||
// content: ''
|
||||
// };
|
||||
// allState.tarifdanlayanan.create.form = {
|
||||
// tarif: '',
|
||||
// layanan: ''
|
||||
// };
|
||||
// allState.prosedurpendaftaran.create.form = {
|
||||
// content: ''
|
||||
// };
|
||||
// }
|
||||
|
||||
return (
|
||||
<Stack py={10}>
|
||||
<SimpleGrid cols={{
|
||||
base: 1, md: 2
|
||||
}}>
|
||||
<Box>
|
||||
<Stack gap={'xs'}>
|
||||
<Title order={4}>Tambah Fasilitas Kesehatan</Title>
|
||||
{/* Informasi Umum */}
|
||||
<InformasiUmum />
|
||||
{/* Layanan Unggulan */}
|
||||
<LayananUnggulan />
|
||||
{/* Dokter & Tenaga Medis */}
|
||||
<DokterDanTenagaMedis />
|
||||
{/* Fasilitas Pendukung */}
|
||||
<FasilitasPendukung />
|
||||
{/* Tarif & Layanan */}
|
||||
<TarifDanLayanan />
|
||||
{/* Prosedur Pendaftaran */}
|
||||
<ProsedurPendaftaran />
|
||||
<Button onClick={submitAllForms}>Submit</Button>
|
||||
</Stack>
|
||||
</Box>
|
||||
|
||||
<Box>
|
||||
<Stack gap={"xs"}>
|
||||
<Title order={4}>Data Fasilitas Kesehatan</Title>
|
||||
<AllList />
|
||||
</Stack>
|
||||
</Box>
|
||||
</SimpleGrid>
|
||||
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
function AllList() {
|
||||
const allListState = useProxy(stateFasilitasKesehatan)
|
||||
useShallowEffect(() => {
|
||||
allListState.informasiumum.findMany.load();
|
||||
allListState.layananunggulan.findMany.load();
|
||||
allListState.dokterdantenagamedis.findMany.load();
|
||||
allListState.fasilitaspendukung.findMany.load();
|
||||
allListState.tarifdanlayanan.findMany.load();
|
||||
allListState.prosedurpendaftaran.findMany.load();
|
||||
}, [])
|
||||
|
||||
if (!allListState.informasiumum.findMany.data
|
||||
|| !allListState.layananunggulan.findMany.data
|
||||
|| !allListState.dokterdantenagamedis.findMany.data
|
||||
|| !allListState.fasilitaspendukung.findMany.data
|
||||
|| !allListState.tarifdanlayanan.findMany.data
|
||||
|| !allListState.prosedurpendaftaran.findMany.data
|
||||
) return <Stack>
|
||||
{Array.from({ length: 10 }).map((v, k) => <Skeleton key={k} h={40} />)}
|
||||
</Stack>
|
||||
return <Stack>
|
||||
<Paper bg={colors['white-1']} p={'md'}>
|
||||
<Title order={4}>Informasi Umum</Title>
|
||||
{allListState.informasiumum.findMany.data?.map((item) => (
|
||||
<Box key={item.id}>
|
||||
|
||||
<Text>{item.fasilitas}</Text>
|
||||
<Text>{item.alamat}</Text>
|
||||
<Text>{item.jamOperasional}</Text>
|
||||
</Box>
|
||||
))}
|
||||
</Paper>
|
||||
|
||||
<Paper bg={colors['white-1']} p={'md'}>
|
||||
<Title order={4}>Layanan Unggulan</Title>
|
||||
{allListState.layananunggulan.findMany.data?.map((item) => (
|
||||
<Box key={item.id}>
|
||||
<Text dangerouslySetInnerHTML={{ __html: item.content }} />
|
||||
</Box>
|
||||
))}
|
||||
</Paper>
|
||||
|
||||
|
||||
<Paper bg={colors['white-1']} p={'md'}>
|
||||
<Title order={4}>Dokter & Tenaga Medis</Title>
|
||||
|
||||
<Table
|
||||
striped
|
||||
highlightOnHover
|
||||
withTableBorder
|
||||
withColumnBorders
|
||||
bg={colors['white-1']}
|
||||
>
|
||||
<TableThead >
|
||||
<TableTr >
|
||||
<TableTh >
|
||||
<Center>Nama</Center>
|
||||
</TableTh>
|
||||
<TableTh >
|
||||
<Center>Specialist</Center>
|
||||
</TableTh>
|
||||
<TableTh >
|
||||
<Center>Jadwal</Center>
|
||||
</TableTh>
|
||||
</TableTr>
|
||||
</TableThead>
|
||||
<TableTbody >
|
||||
{allListState.dokterdantenagamedis.findMany.data?.map((item) => (
|
||||
<TableTr key={item.id}>
|
||||
<TableTd ta="center">{item.name}</TableTd>
|
||||
<TableTd ta="center">Specialist {item.specialist}</TableTd>
|
||||
<TableTd ta="center">{item.jadwal}</TableTd>
|
||||
</TableTr>
|
||||
))}
|
||||
</TableTbody>
|
||||
</Table>
|
||||
</Paper>
|
||||
|
||||
<Paper bg={colors['white-1']} p={'md'}>
|
||||
|
||||
<Title order={4}>Fasilitas Pendukung</Title>
|
||||
{allListState.fasilitaspendukung.findMany.data?.map((item) => (
|
||||
<Box key={item.id}>
|
||||
<Text dangerouslySetInnerHTML={{ __html: item.content }} />
|
||||
</Box>
|
||||
))}
|
||||
</Paper>
|
||||
|
||||
<Paper bg={colors['white-1']} p={'md'}>
|
||||
<Title order={4}>Tarif & Layanan</Title>
|
||||
<Table
|
||||
suppressHydrationWarning
|
||||
striped
|
||||
highlightOnHover
|
||||
withTableBorder
|
||||
withColumnBorders
|
||||
bg={colors['white-1']}
|
||||
>
|
||||
<TableThead>
|
||||
<TableTr>
|
||||
<TableTh>
|
||||
Layanan
|
||||
</TableTh>
|
||||
<TableTh>
|
||||
Tarif
|
||||
</TableTh>
|
||||
</TableTr>
|
||||
</TableThead>
|
||||
<TableTbody>
|
||||
{allListState.tarifdanlayanan.findMany.data?.map((item) => (
|
||||
<TableTr key={item.id}>
|
||||
<TableTd>{item.layanan}</TableTd>
|
||||
<TableTd>Rp.{item.tarif}</TableTd>
|
||||
</TableTr>
|
||||
))}
|
||||
</TableTbody>
|
||||
</Table>
|
||||
</Paper>
|
||||
|
||||
<Paper bg={colors['white-1']} p={'md'}>
|
||||
|
||||
<Title order={4}>Prosedur Pendaftaran</Title>
|
||||
{allListState.prosedurpendaftaran.findMany.data?.map((item) => (
|
||||
<Box key={item.id}>
|
||||
<Text dangerouslySetInnerHTML={{ __html: item.content }} />
|
||||
</Box>
|
||||
))}
|
||||
</Paper>
|
||||
</Stack>
|
||||
}
|
||||
|
||||
export default FasilitasKesehatan;
|
||||
@@ -1,25 +0,0 @@
|
||||
import stateFasilitasKesehatan from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/fasilitasKesehatan';
|
||||
import { Box, Skeleton, Stack, Text } from '@mantine/core';
|
||||
import { useShallowEffect } from '@mantine/hooks';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
|
||||
function ListProsedurPendaftaran() {
|
||||
const prosedurpendaftaranState = useProxy(stateFasilitasKesehatan.prosedurpendaftaran)
|
||||
useShallowEffect(() => {
|
||||
prosedurpendaftaranState.findMany.load()
|
||||
}, [])
|
||||
|
||||
if (!prosedurpendaftaranState.findMany.data)return<Stack>
|
||||
{Array.from({ length: 10 }).map((v, k) => <Skeleton key={k} h={40} />)}
|
||||
</Stack>
|
||||
|
||||
return <Stack>
|
||||
{prosedurpendaftaranState.findMany.data?.map((item) => (
|
||||
<Box key={item.id}>
|
||||
<Text dangerouslySetInnerHTML={{__html: item.content}}/>
|
||||
</Box>
|
||||
))}
|
||||
</Stack>
|
||||
}
|
||||
|
||||
export default ListProsedurPendaftaran;
|
||||
@@ -1,22 +0,0 @@
|
||||
import stateFasilitasKesehatan from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/fasilitasKesehatan';
|
||||
import { Box, Text, Paper } from '@mantine/core';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import { KesehatanEditor } from '../../../_com/kesehatanEditor';
|
||||
import colors from '@/con/colors';
|
||||
|
||||
function ProsedurPendaftaran() {
|
||||
const prosedurpendaftaranState = useProxy(stateFasilitasKesehatan.prosedurpendaftaran)
|
||||
return <Box>
|
||||
<Paper bg={colors['white-1']} p={'md'}>
|
||||
<Text fw={"bold"}>Prosedur Pendaftaran</Text>
|
||||
<KesehatanEditor
|
||||
showSubmit={false}
|
||||
onChange={(val) => {
|
||||
prosedurpendaftaranState.create.form.content = val;
|
||||
}} />
|
||||
</Paper>
|
||||
</Box>
|
||||
|
||||
}
|
||||
|
||||
export default ProsedurPendaftaran;
|
||||
@@ -1,82 +0,0 @@
|
||||
import stateFasilitasKesehatan from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/fasilitasKesehatan';
|
||||
import colors from '@/con/colors';
|
||||
import { Center, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text } from '@mantine/core';
|
||||
import { useShallowEffect } from '@mantine/hooks';
|
||||
import _ from 'lodash';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
|
||||
function TarifDanLayananList() {
|
||||
const tarifdanlayanan = useProxy(stateFasilitasKesehatan.tarifdanlayanan)
|
||||
useShallowEffect(() => {
|
||||
tarifdanlayanan.findMany.load()
|
||||
}, [])
|
||||
|
||||
if (_.isEmpty(tarifdanlayanan.findMany.data)) {
|
||||
return (
|
||||
<Stack>
|
||||
<Table
|
||||
striped
|
||||
highlightOnHover
|
||||
withTableBorder
|
||||
withColumnBorders
|
||||
bg={colors['white-1']}
|
||||
>
|
||||
<TableThead>
|
||||
<TableTr>
|
||||
<TableTh>
|
||||
<Center>Nama</Center>
|
||||
</TableTh>
|
||||
<TableTh>
|
||||
<Center>Specialist</Center>
|
||||
</TableTh>
|
||||
<TableTh >
|
||||
<Center>Jadwal</Center>
|
||||
</TableTh>
|
||||
</TableTr>
|
||||
</TableThead>
|
||||
<TableTbody >
|
||||
<TableTr >
|
||||
<TableTd colSpan={3}>
|
||||
<Center>
|
||||
<Text>Tidak ada data</Text>
|
||||
</Center>
|
||||
</TableTd>
|
||||
</TableTr>
|
||||
</TableTbody>
|
||||
</Table>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
return <Stack>
|
||||
<Table
|
||||
suppressHydrationWarning
|
||||
striped
|
||||
highlightOnHover
|
||||
withTableBorder
|
||||
withColumnBorders
|
||||
bg={colors['white-1']}
|
||||
>
|
||||
<TableThead>
|
||||
<TableTr>
|
||||
<TableTh>
|
||||
Layanan
|
||||
</TableTh>
|
||||
<TableTh>
|
||||
Tarif
|
||||
</TableTh>
|
||||
</TableTr>
|
||||
</TableThead>
|
||||
<TableTbody>
|
||||
{tarifdanlayanan.findMany.data?.map((item) => (
|
||||
<TableTr key={item.id}>
|
||||
<TableTd>{item.layanan}</TableTd>
|
||||
<TableTd>Rp.{item.tarif}</TableTd>
|
||||
</TableTr>
|
||||
))}
|
||||
</TableTbody>
|
||||
</Table>
|
||||
</Stack>
|
||||
}
|
||||
|
||||
export default TarifDanLayananList;
|
||||
@@ -1,32 +0,0 @@
|
||||
import stateFasilitasKesehatan from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/fasilitasKesehatan';
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Paper, Stack, Text, TextInput } from '@mantine/core';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
|
||||
function TarifDanLayanan() {
|
||||
const tarifdanlayanan = useProxy(stateFasilitasKesehatan.tarifdanlayanan)
|
||||
return <Box>
|
||||
<Paper bg={colors['white-1']} p={'md'}>
|
||||
<Text fw={"bold"}>Tarif & Layanan</Text>
|
||||
<Stack gap={"xs"}>
|
||||
<TextInput
|
||||
label="Tarif"
|
||||
placeholder='masukkan tarif'
|
||||
onChange={(val) => {
|
||||
tarifdanlayanan.create.form.tarif = val.target.value
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
mb={10}
|
||||
label="Layanan"
|
||||
placeholder='masukkan layanan'
|
||||
onChange={(val) => {
|
||||
tarifdanlayanan.create.form.layanan = val.target.value
|
||||
}}
|
||||
/>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Box>
|
||||
}
|
||||
|
||||
export default TarifDanLayanan;
|
||||
@@ -1,101 +0,0 @@
|
||||
/* eslint-disable @typescript-eslint/no-explicit-any */
|
||||
'use client'
|
||||
import stategrafikKepuasan from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/grafikKepuasan';
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Group, Paper, Skeleton, Stack, TextInput, Title } from '@mantine/core';
|
||||
import { useMediaQuery, useShallowEffect } from '@mantine/hooks';
|
||||
import { useEffect, useState } from 'react';
|
||||
import { Bar, BarChart, Legend, Tooltip, XAxis, YAxis } from 'recharts';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
|
||||
function GrafikHasilKepuasan() {
|
||||
const grafikkepuasan = useProxy(stategrafikKepuasan.grafikkepuasan)
|
||||
const [mounted, setMounted] = useState(false);
|
||||
const isTablet = useMediaQuery('(max-width: 1024px)')
|
||||
const isMobile = useMediaQuery('(max-width: 768px)')
|
||||
const [chartData, setChartData] = useState<any[]>([])
|
||||
|
||||
useShallowEffect(() => {
|
||||
const fetchData = async () => {
|
||||
await grafikkepuasan.findMany.load();
|
||||
if (grafikkepuasan.findMany.data && grafikkepuasan.findMany.data.length > 0) {
|
||||
setChartData(grafikkepuasan.findMany.data);
|
||||
}
|
||||
};
|
||||
fetchData();
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
setMounted(true); // setelah komponen siap di client
|
||||
}, []);
|
||||
|
||||
if (!mounted) {
|
||||
return null; // Jangan render apa-apa dulu sebelum mounted
|
||||
}
|
||||
|
||||
|
||||
return (
|
||||
<Stack py={10} gap={"xs"}>
|
||||
<Paper w={{ base: '100%', md: '50%' }} bg={colors['white-1']} p={'md'}>
|
||||
<Title order={4}>Tambah Grafik Hasil Kepuasan</Title>
|
||||
<Stack gap={"xs"}>
|
||||
<TextInput
|
||||
label="Label"
|
||||
placeholder='Masukkan label yang diinginkan'
|
||||
value={grafikkepuasan.create.form.label}
|
||||
onChange={(val) => {
|
||||
grafikkepuasan.create.form.label = val.currentTarget.value
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label="Jumlah Penderita"
|
||||
type='number'
|
||||
placeholder='Masukkan jumlah penderita'
|
||||
value={grafikkepuasan.create.form.jumlah}
|
||||
onChange={(val) => {
|
||||
grafikkepuasan.create.form.jumlah = val.currentTarget.value
|
||||
}}
|
||||
/>
|
||||
<Group>
|
||||
<Button bg={colors['blue-button']} mt={10}
|
||||
onClick={async () => {
|
||||
await grafikkepuasan.create.create();
|
||||
await grafikkepuasan.findMany.load();
|
||||
if (grafikkepuasan.findMany.data) {
|
||||
setChartData(grafikkepuasan.findMany.data);
|
||||
}
|
||||
}}
|
||||
>Submit</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
{!chartData ? (
|
||||
<Box style={{ width: '100%', minWidth: 300, minHeight: 300 }}>
|
||||
<Paper bg={colors['white-1']} p={'md'}>
|
||||
<Title py={15} order={4}>Data Hasil Kepuasan</Title>
|
||||
<Skeleton h={400} />
|
||||
</Paper>
|
||||
</Box>
|
||||
) : (
|
||||
<Box style={{ width: '100%', minWidth: 300, minHeight: 300 }}>
|
||||
<Paper bg={colors['white-1']} p={'md'}>
|
||||
<Title py={15} order={4}>Data Hasil Kepuasan</Title>
|
||||
<BarChart
|
||||
width={isMobile ? 250 : isTablet ? 300 : 350}
|
||||
height={380}
|
||||
data={chartData}
|
||||
>
|
||||
<XAxis dataKey="label" />
|
||||
<YAxis />
|
||||
<Tooltip />
|
||||
<Legend />
|
||||
<Bar dataKey="jumlah" fill={colors['blue-button']} name="Jumlah" />
|
||||
</BarChart>
|
||||
</Paper>
|
||||
</Box>
|
||||
)}
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default GrafikHasilKepuasan;
|
||||
@@ -1,124 +0,0 @@
|
||||
'use client'
|
||||
/* eslint-disable @typescript-eslint/no-explicit-any */
|
||||
import statePersentase from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/persentaseKelahiran';
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Group, Paper, Skeleton, Stack, TextInput, Title } from '@mantine/core';
|
||||
import { useMediaQuery, useShallowEffect } from '@mantine/hooks';
|
||||
import { useEffect, useState } from 'react';
|
||||
import { Bar, BarChart, Legend, Tooltip, XAxis, YAxis } from 'recharts';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
|
||||
function PersentaseDataKelahiranKematian() {
|
||||
const persentase = useProxy(statePersentase.persentasekelahiran);
|
||||
const [chartData, setChartData] = useState<any[]>([]);
|
||||
const [mounted, setMounted] = useState(false); // untuk memastikan DOM sudah ready
|
||||
const isTablet = useMediaQuery('(max-width: 1024px)')
|
||||
const isMobile = useMediaQuery('(max-width: 768px)')
|
||||
|
||||
useEffect(() => {
|
||||
setMounted(true);
|
||||
}, []);
|
||||
|
||||
useShallowEffect(() => {
|
||||
const fetchData = async () => {
|
||||
await persentase.findMany.load();
|
||||
if (persentase.findMany.data && persentase.findMany.data.length > 0) {
|
||||
setChartData(persentase.findMany.data);
|
||||
}
|
||||
};
|
||||
fetchData();
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<Stack py={10}>
|
||||
{/* Form Input */}
|
||||
<Box>
|
||||
<Paper w={{ base: '100%', md: '50%' }} bg={colors['white-1']} p={'md'}>
|
||||
<Title order={4}>Tambah Persentase Data Kelahiran & Kematian</Title>
|
||||
<Stack gap={"xs"}>
|
||||
<TextInput
|
||||
label="Tahun"
|
||||
type="number"
|
||||
value={persentase.create.form.tahun}
|
||||
placeholder="Masukkan tahun"
|
||||
onChange={(val) => {
|
||||
persentase.create.form.tahun = val.currentTarget.value;
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label="Kematian Kasar"
|
||||
type="number"
|
||||
value={persentase.create.form.kematianKasar}
|
||||
placeholder="Masukkan kematian kasar"
|
||||
onChange={(val) => {
|
||||
persentase.create.form.kematianKasar = val.currentTarget.value;
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label="Kematian Bayi"
|
||||
type="number"
|
||||
value={persentase.create.form.kematianBayi}
|
||||
placeholder="Masukkan kematian bayi"
|
||||
onChange={(val) => {
|
||||
persentase.create.form.kematianBayi = val.currentTarget.value;
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label="Kelahiran Kasar"
|
||||
type="number"
|
||||
value={persentase.create.form.kelahiranKasar}
|
||||
placeholder="Masukkan kelahiran kasar"
|
||||
onChange={(val) => {
|
||||
persentase.create.form.kelahiranKasar = val.currentTarget.value;
|
||||
}}
|
||||
/>
|
||||
<Group>
|
||||
<Button
|
||||
bg={colors['blue-button']}
|
||||
mt={10}
|
||||
onClick={async () => {
|
||||
await persentase.create.create();
|
||||
await persentase.findMany.load();
|
||||
if (persentase.findMany.data) {
|
||||
setChartData(persentase.findMany.data);
|
||||
}
|
||||
}}
|
||||
>
|
||||
Submit
|
||||
</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Box>
|
||||
|
||||
{/* Chart */}
|
||||
{!mounted && !chartData ? (
|
||||
<Box style={{ width: '100%', minWidth: 300, height: 400, minHeight: 300 }}>
|
||||
<Paper bg={colors['white-1']} p={'md'}>
|
||||
<Title pb={10} order={3}>Data Kelahiran & Kematian</Title>
|
||||
<Skeleton h={400} />
|
||||
</Paper>
|
||||
</Box>
|
||||
) : (
|
||||
<Box style={{ width: '100%', minWidth: 300, height: 400, minHeight: 300 }}>
|
||||
<Paper bg={colors['white-1']} p={'md'}>
|
||||
<Title pb={10} order={4}>Data Kelahiran & Kematian</Title>
|
||||
{mounted && chartData.length > 0 && (
|
||||
<BarChart width={isMobile ? 450 : isTablet ? 500 : 550} height={350} data={chartData} >
|
||||
<XAxis dataKey="tahun" />
|
||||
<YAxis />
|
||||
<Tooltip />
|
||||
<Legend />
|
||||
<Bar dataKey="kematianKasar" fill="#f03e3e" name="Kematian Kasar" />
|
||||
<Bar dataKey="kematianBayi" fill="#ff922b" name="Kematian Bayi" />
|
||||
<Bar dataKey="kelahiranKasar" fill="#4dabf7" name="Kelahiran Kasar" />
|
||||
</BarChart>
|
||||
)}
|
||||
</Paper>
|
||||
</Box>
|
||||
)}
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default PersentaseDataKelahiranKematian;
|
||||
@@ -1,10 +1,9 @@
|
||||
'use client'
|
||||
import { Box, Paper, Text } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import { KesehatanEditor } from '../../../_com/kesehatanEditor';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import stateArtikelKesehatan from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/artikelKesehatan';
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Paper, Text } from '@mantine/core';
|
||||
import { KesehatanEditor } from '../../_com/kesehatanEditor';
|
||||
import stateArtikelKesehatan from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/artikelKesehatan';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
|
||||
function DoctorSignUI() {
|
||||
const doctorSign = useProxy(stateArtikelKesehatan.doctorSign)
|
||||
@@ -1,10 +1,9 @@
|
||||
'use client'
|
||||
import { Box, Paper, Stack, Text, TextInput } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import stateArtikelKesehatan from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/artikelKesehatan';
|
||||
import { KesehatanEditor } from '../../../_com/kesehatanEditor';
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Paper, Stack, Text, TextInput } from '@mantine/core';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import { KesehatanEditor } from '../../_com/kesehatanEditor';
|
||||
|
||||
function FirstAidUI() {
|
||||
const firstAidState = useProxy(stateArtikelKesehatan.firstAid)
|
||||
@@ -2,9 +2,9 @@
|
||||
import { Box, Paper, Stack, Text } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import { KesehatanEditor } from '../../../_com/kesehatanEditor';
|
||||
import stateArtikelKesehatan from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/artikelKesehatan';
|
||||
import colors from '@/con/colors';
|
||||
import { KesehatanEditor } from '../../_com/kesehatanEditor';
|
||||
import stateArtikelKesehatan from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/artikelKesehatan';
|
||||
|
||||
function IntoductionUI() {
|
||||
const introduction = useProxy(stateArtikelKesehatan.introduction)
|
||||
@@ -1,10 +1,9 @@
|
||||
'use client'
|
||||
import stateArtikelKesehatan from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/artikelKesehatan';
|
||||
import { Box, Paper, Stack, Text, TextInput } from '@mantine/core';
|
||||
import React from 'react';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import { KesehatanEditor } from '../../../_com/kesehatanEditor';
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Paper, Stack, Text, TextInput } from '@mantine/core';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import { KesehatanEditor } from '../../_com/kesehatanEditor';
|
||||
|
||||
function PreventionUI() {
|
||||
const preventionState = useProxy(stateArtikelKesehatan.prevention)
|
||||
@@ -1,9 +1,9 @@
|
||||
'use client'
|
||||
import stateArtikelKesehatan from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/artikelKesehatan';
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Paper, Stack, Text, TextInput } from '@mantine/core';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import { KesehatanEditor } from '../../../_com/kesehatanEditor';
|
||||
import colors from '@/con/colors';
|
||||
import { KesehatanEditor } from '../../_com/kesehatanEditor';
|
||||
|
||||
function SymptomUI() {
|
||||
const symptomState = useProxy(stateArtikelKesehatan.symptom)
|
||||
@@ -0,0 +1,359 @@
|
||||
/* eslint-disable react-hooks/exhaustive-deps */
|
||||
'use client'
|
||||
|
||||
import EditEditor from '@/app/admin/(dashboard)/_com/editEditor';
|
||||
import fasilitasKesehatanState from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/fasilitasKesehatan';
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, 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';
|
||||
import { toast } from 'react-toastify';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
|
||||
interface FasilitasKesehatanFormBase {
|
||||
name: string;
|
||||
informasiUmum: {
|
||||
fasilitas: string;
|
||||
alamat: string;
|
||||
jamOperasional: string;
|
||||
};
|
||||
layananUnggulan: {
|
||||
content: string;
|
||||
};
|
||||
dokterdanTenagaMedis: {
|
||||
name: string;
|
||||
specialist: string;
|
||||
jadwal: string;
|
||||
};
|
||||
fasilitasPendukung: {
|
||||
content: string;
|
||||
};
|
||||
prosedurPendaftaran: {
|
||||
content: string;
|
||||
};
|
||||
tarifDanLayanan: {
|
||||
layanan: string;
|
||||
tarif: string;
|
||||
};
|
||||
}
|
||||
|
||||
function EditFasilitasKesehatan() {
|
||||
const stateFasilitasKesehatan = useProxy(fasilitasKesehatanState);
|
||||
const router = useRouter();
|
||||
const params = useParams();
|
||||
|
||||
const [formData, setFormData] = useState<FasilitasKesehatanFormBase>({
|
||||
name: stateFasilitasKesehatan.edit.form.name || '',
|
||||
informasiUmum: {
|
||||
fasilitas: stateFasilitasKesehatan.edit.form.informasiUmum?.fasilitas || '',
|
||||
alamat: stateFasilitasKesehatan.edit.form.informasiUmum?.alamat || '',
|
||||
jamOperasional: stateFasilitasKesehatan.edit.form.informasiUmum?.jamOperasional || '',
|
||||
},
|
||||
layananUnggulan: {
|
||||
content: stateFasilitasKesehatan.edit.form.layananUnggulan?.content || '',
|
||||
},
|
||||
dokterdanTenagaMedis: {
|
||||
name: stateFasilitasKesehatan.edit.form.dokterdanTenagaMedis?.name || '',
|
||||
specialist: stateFasilitasKesehatan.edit.form.dokterdanTenagaMedis?.specialist || '',
|
||||
jadwal: stateFasilitasKesehatan.edit.form.dokterdanTenagaMedis?.jadwal || '',
|
||||
},
|
||||
fasilitasPendukung: {
|
||||
content: stateFasilitasKesehatan.edit.form.fasilitasPendukung?.content || '',
|
||||
},
|
||||
prosedurPendaftaran: {
|
||||
content: stateFasilitasKesehatan.edit.form.prosedurPendaftaran?.content || '',
|
||||
},
|
||||
tarifDanLayanan: {
|
||||
layanan: stateFasilitasKesehatan.edit.form.tarifDanLayanan?.layanan || '',
|
||||
tarif: stateFasilitasKesehatan.edit.form.tarifDanLayanan?.tarif || '',
|
||||
},
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
const loadFasilitasKesehatan = async () => {
|
||||
const id = params?.id as string;
|
||||
if (!id) return;
|
||||
|
||||
try {
|
||||
await stateFasilitasKesehatan.edit.load(id);
|
||||
const { form } = stateFasilitasKesehatan.edit;
|
||||
if (form) {
|
||||
setFormData({
|
||||
name: form.name,
|
||||
informasiUmum: {
|
||||
fasilitas: form.informasiUmum?.fasilitas || '',
|
||||
alamat: form.informasiUmum?.alamat || '',
|
||||
jamOperasional: form.informasiUmum?.jamOperasional || '',
|
||||
},
|
||||
layananUnggulan: {
|
||||
content: form.layananUnggulan?.content || '',
|
||||
},
|
||||
dokterdanTenagaMedis: {
|
||||
name: form.dokterdanTenagaMedis?.name || '',
|
||||
specialist: form.dokterdanTenagaMedis?.specialist || '',
|
||||
jadwal: form.dokterdanTenagaMedis?.jadwal || '',
|
||||
},
|
||||
fasilitasPendukung: {
|
||||
content: form.fasilitasPendukung?.content || '',
|
||||
},
|
||||
prosedurPendaftaran: {
|
||||
content: form.prosedurPendaftaran?.content || '',
|
||||
},
|
||||
tarifDanLayanan: {
|
||||
layanan: form.tarifDanLayanan?.layanan || '',
|
||||
tarif: form.tarifDanLayanan?.tarif || '',
|
||||
},
|
||||
});
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error loading fasilitas kesehatan:", error);
|
||||
toast.error("Gagal memuat data fasilitas kesehatan");
|
||||
}
|
||||
};
|
||||
loadFasilitasKesehatan();
|
||||
}, [params?.id]);
|
||||
|
||||
const handleSubmit = async () => {
|
||||
try {
|
||||
stateFasilitasKesehatan.edit.form = {
|
||||
...stateFasilitasKesehatan.edit.form,
|
||||
name: formData.name,
|
||||
informasiUmum: {
|
||||
fasilitas: formData.informasiUmum.fasilitas,
|
||||
alamat: formData.informasiUmum.alamat,
|
||||
jamOperasional: formData.informasiUmum.jamOperasional,
|
||||
},
|
||||
layananUnggulan: {
|
||||
content: formData.layananUnggulan.content,
|
||||
},
|
||||
dokterdanTenagaMedis: {
|
||||
name: formData.dokterdanTenagaMedis.name,
|
||||
specialist: formData.dokterdanTenagaMedis.specialist,
|
||||
jadwal: formData.dokterdanTenagaMedis.jadwal,
|
||||
},
|
||||
fasilitasPendukung: {
|
||||
content: formData.fasilitasPendukung.content,
|
||||
},
|
||||
prosedurPendaftaran: {
|
||||
content: formData.prosedurPendaftaran.content,
|
||||
},
|
||||
tarifDanLayanan: {
|
||||
layanan: formData.tarifDanLayanan.layanan,
|
||||
tarif: formData.tarifDanLayanan.tarif,
|
||||
},
|
||||
};
|
||||
const success = await stateFasilitasKesehatan.edit.submit();
|
||||
if (success) {
|
||||
toast.success("Fasilitas kesehatan berhasil diperbarui!");
|
||||
router.push("/admin/kesehatan/data-kesehatan-warga/fasilitas_kesehatan");
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error updating fasilitas kesehatan:", error);
|
||||
toast.error(error instanceof Error ? error.message : "Gagal memperbarui data fasilitas kesehatan");
|
||||
}
|
||||
};
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
<Button onClick={() => router.back()} variant="subtle" color="blue">
|
||||
<IconArrowBack color={colors['blue-button']} size={25} />
|
||||
</Button>
|
||||
</Box>
|
||||
<Stack gap="xs">
|
||||
<Paper bg={colors['white-1']} p="md" w={{ base: '100%', md: '50%' }}>
|
||||
<Stack gap="xs">
|
||||
<Title order={3}>Edit Fasilitas Kesehatan</Title>
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Nama Fasilitas Kesehatan</Text>}
|
||||
placeholder="masukkan nama fasilitas kesehatan"
|
||||
value={formData.name}
|
||||
onChange={(e) => {
|
||||
setFormData(prev => ({
|
||||
...prev,
|
||||
name: e.target.value
|
||||
}));
|
||||
}}
|
||||
/>
|
||||
<Box>
|
||||
<Text fz="md" fw="bold">Informasi Umum</Text>
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Fasilitas</Text>}
|
||||
placeholder="masukkan fasilitas"
|
||||
value={formData.informasiUmum.fasilitas}
|
||||
onChange={(e) => {
|
||||
setFormData(prev => ({
|
||||
...prev,
|
||||
informasiUmum: {
|
||||
...prev.informasiUmum,
|
||||
fasilitas: e.target.value
|
||||
}
|
||||
}));
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Alamat</Text>}
|
||||
placeholder="masukkan alamat"
|
||||
value={formData.informasiUmum.alamat}
|
||||
onChange={(e) => {
|
||||
setFormData(prev => ({
|
||||
...prev,
|
||||
informasiUmum: {
|
||||
...prev.informasiUmum,
|
||||
alamat: e.target.value
|
||||
}
|
||||
}));
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Jam Operasional</Text>}
|
||||
placeholder="masukkan jam operasional"
|
||||
value={formData.informasiUmum.jamOperasional}
|
||||
onChange={(e) => {
|
||||
setFormData(prev => ({
|
||||
...prev,
|
||||
informasiUmum: {
|
||||
...prev.informasiUmum,
|
||||
jamOperasional: e.target.value
|
||||
}
|
||||
}));
|
||||
}}
|
||||
/>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz="md" fw="bold">Layanan Unggulan</Text>
|
||||
<EditEditor
|
||||
value={formData.layananUnggulan.content}
|
||||
onChange={(e) => {
|
||||
setFormData(prev => ({
|
||||
...prev,
|
||||
layananUnggulan: {
|
||||
...prev.layananUnggulan,
|
||||
content: e
|
||||
}
|
||||
}));
|
||||
}}
|
||||
/>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz="md" fw="bold">Dokter dan Tenaga Medis</Text>
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Nama Dokter</Text>}
|
||||
placeholder="masukkan nama dokter"
|
||||
value={formData.dokterdanTenagaMedis.name}
|
||||
onChange={(e) => {
|
||||
setFormData(prev => ({
|
||||
...prev,
|
||||
dokterdanTenagaMedis: {
|
||||
...prev.dokterdanTenagaMedis,
|
||||
name: e.target.value
|
||||
}
|
||||
}));
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Specialist</Text>}
|
||||
placeholder="masukkan specialist"
|
||||
value={formData.dokterdanTenagaMedis.specialist}
|
||||
onChange={(e) => {
|
||||
setFormData(prev => ({
|
||||
...prev,
|
||||
dokterdanTenagaMedis: {
|
||||
...prev.dokterdanTenagaMedis,
|
||||
specialist: e.target.value
|
||||
}
|
||||
}));
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Jadwal</Text>}
|
||||
placeholder="masukkan jadwal"
|
||||
value={formData.dokterdanTenagaMedis.jadwal}
|
||||
onChange={(e) => {
|
||||
setFormData(prev => ({
|
||||
...prev,
|
||||
dokterdanTenagaMedis: {
|
||||
...prev.dokterdanTenagaMedis,
|
||||
jadwal: e.target.value
|
||||
}
|
||||
}));
|
||||
}}
|
||||
/>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz="md" fw="bold">Fasilitas Pendukung</Text>
|
||||
<EditEditor
|
||||
value={formData.fasilitasPendukung.content}
|
||||
onChange={(e) => {
|
||||
setFormData(prev => ({
|
||||
...prev,
|
||||
fasilitasPendukung: {
|
||||
...prev.fasilitasPendukung,
|
||||
content: e
|
||||
}
|
||||
}));
|
||||
}}
|
||||
/>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz="md" fw="bold">Prosedur Pendaftaran</Text>
|
||||
<EditEditor
|
||||
value={formData.prosedurPendaftaran.content}
|
||||
onChange={(e) => {
|
||||
setFormData(prev => ({
|
||||
...prev,
|
||||
prosedurPendaftaran: {
|
||||
...prev.prosedurPendaftaran,
|
||||
content: e
|
||||
}
|
||||
}));
|
||||
}}
|
||||
/>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz="md" fw="bold">Tarif dan Layanan</Text>
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Tarif</Text>}
|
||||
placeholder="masukkan tarif"
|
||||
value={formData.tarifDanLayanan.tarif}
|
||||
onChange={(e) => {
|
||||
setFormData(prev => ({
|
||||
...prev,
|
||||
tarifDanLayanan: {
|
||||
...prev.tarifDanLayanan,
|
||||
tarif: e.target.value
|
||||
}
|
||||
}));
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Layanan</Text>}
|
||||
placeholder="masukkan layanan"
|
||||
value={formData.tarifDanLayanan.layanan}
|
||||
onChange={(e) => {
|
||||
setFormData(prev => ({
|
||||
...prev,
|
||||
tarifDanLayanan: {
|
||||
...prev.tarifDanLayanan,
|
||||
layanan: e.target.value
|
||||
}
|
||||
}));
|
||||
}}
|
||||
/>
|
||||
</Box>
|
||||
|
||||
<Button
|
||||
onClick={handleSubmit}
|
||||
bg={colors['blue-button']}
|
||||
loading={stateFasilitasKesehatan.edit.loading}
|
||||
>
|
||||
Simpan
|
||||
</Button>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default EditFasilitasKesehatan;
|
||||
@@ -0,0 +1,127 @@
|
||||
'use client'
|
||||
import { ModalKonfirmasiHapus } from '@/app/admin/(dashboard)/_com/modalKonfirmasiHapus';
|
||||
import fasilitasKesehatanState from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/fasilitasKesehatan';
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Flex, Paper, Skeleton, Stack, Text } from '@mantine/core';
|
||||
import { useShallowEffect } from '@mantine/hooks';
|
||||
import { IconArrowBack, IconEdit, IconX } from '@tabler/icons-react';
|
||||
import { useParams, useRouter } from 'next/navigation';
|
||||
import { useState } from 'react';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
|
||||
function DetailFasilitasKesehatan() {
|
||||
const params = useParams()
|
||||
const router = useRouter();
|
||||
const stateFasilitasKesehatan = useProxy(fasilitasKesehatanState)
|
||||
const [modalHapus, setModalHapus] = useState(false);
|
||||
const [selectedId, setSelectedId] = useState<string | null>(null)
|
||||
|
||||
useShallowEffect(() => {
|
||||
stateFasilitasKesehatan.findUnique.load(params?.id as string)
|
||||
}, [])
|
||||
|
||||
const handleHapus = () => {
|
||||
if (selectedId) {
|
||||
stateFasilitasKesehatan.delete.byId(selectedId)
|
||||
setModalHapus(false)
|
||||
setSelectedId(null)
|
||||
router.push("/admin/kesehatan/data-kesehatan-warga/fasilitas_kesehatan")
|
||||
}
|
||||
}
|
||||
|
||||
if (!stateFasilitasKesehatan.findUnique.data) {
|
||||
return (
|
||||
<Stack py={10}>
|
||||
<Skeleton h={500} />
|
||||
</Stack>
|
||||
)
|
||||
}
|
||||
|
||||
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
<Button variant="subtle" onClick={() => router.back()}>
|
||||
<IconArrowBack color={colors['blue-button']} size={25} />
|
||||
</Button>
|
||||
</Box>
|
||||
<Paper w={{ base: "100%", md: "50%" }} bg={colors['white-1']} p={'md'}>
|
||||
<Stack>
|
||||
<Text fz={"xl"} fw={"bold"}>Detail Fasilitas Kesehatan</Text>
|
||||
{stateFasilitasKesehatan.findUnique.data ? (
|
||||
<Paper bg={colors['BG-trans']} p={'md'}>
|
||||
<Stack gap={"xs"}>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Nama Fasilitas Kesehatan</Text>
|
||||
<Text fz={"md"}>{stateFasilitasKesehatan.findUnique.data.name}</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Informasi Umum</Text>
|
||||
<Text fz={"md"} fw={"bold"}>Fasilitas</Text>
|
||||
<Text fz={"md"}>{stateFasilitasKesehatan.findUnique.data.informasiumum.fasilitas}</Text>
|
||||
<Text fz={"md"} fw={"bold"}>Alamat</Text>
|
||||
<Text fz={"md"}>{stateFasilitasKesehatan.findUnique.data.informasiumum.alamat}</Text>
|
||||
<Text fz={"md"} fw={"bold"}>Jam Operasional</Text>
|
||||
<Text fz={"md"}>{stateFasilitasKesehatan.findUnique.data.informasiumum.jamOperasional}</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"md"} fw={"bold"}>Layanan Unggulan</Text>
|
||||
<Text fz={"md"} dangerouslySetInnerHTML={{ __html: stateFasilitasKesehatan.findUnique.data.layananunggulan.content }} />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"md"} fw={"bold"}>Dokter dan Tenaga Medis</Text>
|
||||
<Text fz={"md"} fw={"bold"}>Nama Dokter</Text>
|
||||
<Text fz={"md"}>{stateFasilitasKesehatan.findUnique.data.dokterdantenagamedis.name}</Text>
|
||||
<Text fz={"md"} fw={"bold"}>Specialist</Text>
|
||||
<Text fz={"md"}>{stateFasilitasKesehatan.findUnique.data.dokterdantenagamedis.specialist}</Text>
|
||||
<Text fz={"md"} fw={"bold"}>Jadwal</Text>
|
||||
<Text fz={"md"}>{stateFasilitasKesehatan.findUnique.data.dokterdantenagamedis.jadwal}</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Fasilitas Pendukung</Text>
|
||||
<Text fz={"md"} dangerouslySetInnerHTML={{ __html: stateFasilitasKesehatan.findUnique.data.fasilitaspendukung.content }} />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Prosedur Pendaftaran</Text>
|
||||
<Text fz={"md"} dangerouslySetInnerHTML={{ __html: stateFasilitasKesehatan.findUnique.data.prosedurpendaftaran.content }} />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Tarif dan Layanan</Text>
|
||||
<Text fz={"md"} fw={"bold"}>Layanan</Text>
|
||||
<Text fz={"md"}>{stateFasilitasKesehatan.findUnique.data.tarifdanlayanan.layanan}</Text>
|
||||
<Text fz={"md"} fw={"bold"}>Tarif</Text>
|
||||
<Text fz={"md"}>{stateFasilitasKesehatan.findUnique.data.tarifdanlayanan.tarif}</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Flex gap={"xs"}>
|
||||
<Button color="red" onClick={() => {
|
||||
if (stateFasilitasKesehatan.findUnique.data) {
|
||||
setSelectedId(stateFasilitasKesehatan.findUnique.data.id)
|
||||
setModalHapus(true)
|
||||
}
|
||||
}}>
|
||||
<IconX size={20} />
|
||||
</Button>
|
||||
<Button onClick={() => router.push(`/admin/kesehatan/data-kesehatan-warga/fasilitas_kesehatan/${stateFasilitasKesehatan.findUnique.data?.id}/edit`)} color="green">
|
||||
<IconEdit size={20} />
|
||||
</Button>
|
||||
</Flex>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Paper>
|
||||
) : null}
|
||||
</Stack>
|
||||
</Paper>
|
||||
|
||||
{/* Modal Hapus */}
|
||||
<ModalKonfirmasiHapus
|
||||
opened={modalHapus}
|
||||
onClose={() => setModalHapus(false)}
|
||||
onConfirm={handleHapus}
|
||||
text="Apakah anda yakin ingin menghapus fasilitas kesehatan ini?"
|
||||
/>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default DetailFasilitasKesehatan;
|
||||
@@ -0,0 +1,187 @@
|
||||
'use client'
|
||||
import CreateEditor from '@/app/admin/(dashboard)/_com/createEditor';
|
||||
import fasilitasKesehatanState from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/fasilitasKesehatan';
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
|
||||
import { IconArrowBack } from '@tabler/icons-react';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { toast } from 'react-toastify';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
|
||||
|
||||
function CreateFasilitasKesehatan() {
|
||||
const stateFasilitasKesehatan = useProxy(fasilitasKesehatanState)
|
||||
const router = useRouter();
|
||||
|
||||
|
||||
const resetForm = () => {
|
||||
stateFasilitasKesehatan.create.form = {
|
||||
name: "",
|
||||
informasiUmum: {
|
||||
fasilitas: "",
|
||||
alamat: "",
|
||||
jamOperasional: "",
|
||||
},
|
||||
layananUnggulan: {
|
||||
content: "",
|
||||
},
|
||||
dokterdanTenagaMedis: {
|
||||
name: "",
|
||||
specialist: "",
|
||||
jadwal: "",
|
||||
},
|
||||
fasilitasPendukung: {
|
||||
content: "",
|
||||
},
|
||||
prosedurPendaftaran: {
|
||||
content: "",
|
||||
},
|
||||
tarifDanLayanan: {
|
||||
layanan: "",
|
||||
tarif: "",
|
||||
},
|
||||
};
|
||||
};
|
||||
|
||||
|
||||
|
||||
const handleSubmit = async (e: React.FormEvent) => {
|
||||
e.preventDefault();
|
||||
await stateFasilitasKesehatan.create.submit();
|
||||
|
||||
toast.success("Data berhasil disimpan");
|
||||
resetForm();
|
||||
// After successful submission, redirect to the list page
|
||||
router.push('/admin/kesehatan/data-kesehatan-warga/fasilitas_kesehatan');
|
||||
}
|
||||
|
||||
return (
|
||||
<Box component="form" onSubmit={handleSubmit}>
|
||||
<Box mb={10}>
|
||||
<Button variant="subtle" onClick={() => router.back()}>
|
||||
<IconArrowBack color={colors['blue-button']} size={25} />
|
||||
</Button>
|
||||
</Box>
|
||||
|
||||
<Paper bg={colors['white-1']} p="md" w={{ base: '100%', md: '50%' }}>
|
||||
<Stack gap="xs">
|
||||
<Title order={3}>Create Fasilitas Kesehatan</Title>
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Nama Fasilitas Kesehatan</Text>}
|
||||
placeholder="masukkan nama fasilitas kesehatan"
|
||||
value={stateFasilitasKesehatan.create.form.name}
|
||||
onChange={(e) => {
|
||||
stateFasilitasKesehatan.create.form.name = e.target.value;
|
||||
}}
|
||||
/>
|
||||
<Box>
|
||||
<Text fz="md" fw="bold">Informasi Umum</Text>
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Fasilitas</Text>}
|
||||
placeholder="masukkan fasilitas"
|
||||
value={stateFasilitasKesehatan.create.form.informasiUmum.fasilitas}
|
||||
onChange={(e) => {
|
||||
stateFasilitasKesehatan.create.form.informasiUmum.fasilitas = e.target.value;
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Alamat</Text>}
|
||||
placeholder="masukkan alamat"
|
||||
value={stateFasilitasKesehatan.create.form.informasiUmum.alamat}
|
||||
onChange={(e) => {
|
||||
stateFasilitasKesehatan.create.form.informasiUmum.alamat = e.target.value;
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Jam Operasional</Text>}
|
||||
placeholder="masukkan jam operasional"
|
||||
value={stateFasilitasKesehatan.create.form.informasiUmum.jamOperasional}
|
||||
onChange={(e) => {
|
||||
stateFasilitasKesehatan.create.form.informasiUmum.jamOperasional = e.target.value;
|
||||
}}
|
||||
/>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz="md" fw="bold">Layanan Unggulan</Text>
|
||||
<CreateEditor
|
||||
value={stateFasilitasKesehatan.create.form.layananUnggulan.content}
|
||||
onChange={(e) => {
|
||||
stateFasilitasKesehatan.create.form.layananUnggulan.content = e;
|
||||
}}
|
||||
/>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz="md" fw="bold">Dokter dan Tenaga Medis</Text>
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Nama Dokter</Text>}
|
||||
placeholder="masukkan nama dokter"
|
||||
value={stateFasilitasKesehatan.create.form.dokterdanTenagaMedis.name}
|
||||
onChange={(e) => {
|
||||
stateFasilitasKesehatan.create.form.dokterdanTenagaMedis.name = e.target.value;
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Specialist</Text>}
|
||||
placeholder="masukkan specialist"
|
||||
value={stateFasilitasKesehatan.create.form.dokterdanTenagaMedis.specialist}
|
||||
onChange={(e) => {
|
||||
stateFasilitasKesehatan.create.form.dokterdanTenagaMedis.specialist = e.target.value;
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Jadwal</Text>}
|
||||
placeholder="masukkan jadwal"
|
||||
value={stateFasilitasKesehatan.create.form.dokterdanTenagaMedis.jadwal}
|
||||
onChange={(e) => {
|
||||
stateFasilitasKesehatan.create.form.dokterdanTenagaMedis.jadwal = e.target.value;
|
||||
}}
|
||||
/>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz="md" fw="bold">Fasilitas Pendukung</Text>
|
||||
<CreateEditor
|
||||
value={stateFasilitasKesehatan.create.form.fasilitasPendukung.content}
|
||||
onChange={(e) => {
|
||||
stateFasilitasKesehatan.create.form.fasilitasPendukung.content = e;
|
||||
}}
|
||||
/>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz="md" fw="bold">Prosedur Pendaftaran</Text>
|
||||
<CreateEditor
|
||||
value={stateFasilitasKesehatan.create.form.prosedurPendaftaran.content}
|
||||
onChange={(e) => {
|
||||
stateFasilitasKesehatan.create.form.prosedurPendaftaran.content = e;
|
||||
}}
|
||||
/>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz="md" fw="bold">Tarif dan Layanan</Text>
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Tarif</Text>}
|
||||
placeholder="masukkan tarif"
|
||||
value={stateFasilitasKesehatan.create.form.tarifDanLayanan.tarif}
|
||||
onChange={(e) => {
|
||||
stateFasilitasKesehatan.create.form.tarifDanLayanan.tarif = e.target.value;
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Layanan</Text>}
|
||||
placeholder="masukkan layanan"
|
||||
value={stateFasilitasKesehatan.create.form.tarifDanLayanan.layanan}
|
||||
onChange={(e) => {
|
||||
stateFasilitasKesehatan.create.form.tarifDanLayanan.layanan = e.target.value;
|
||||
}}
|
||||
/>
|
||||
</Box>
|
||||
|
||||
<Button onClick={handleSubmit} bg={colors['blue-button']}>
|
||||
Simpan
|
||||
</Button>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default CreateFasilitasKesehatan;
|
||||
@@ -0,0 +1,81 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr } from '@mantine/core';
|
||||
import { useShallowEffect } from '@mantine/hooks';
|
||||
import { IconDeviceImacCog, IconSearch } from '@tabler/icons-react';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import fasilitasKesehatanState from '../../../_state/kesehatan/data_kesehatan_warga/fasilitasKesehatan';
|
||||
import HeaderSearch from '../../../_com/header';
|
||||
import JudulList from '../../../_com/judulList';
|
||||
|
||||
|
||||
function FasilitasKesehatan() {
|
||||
return (
|
||||
<Box>
|
||||
<HeaderSearch
|
||||
title='Fasilitas Kesehatan'
|
||||
placeholder='pencarian'
|
||||
searchIcon={<IconSearch size={20} />}
|
||||
/>
|
||||
<ListFasilitasKesehatan/>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
function ListFasilitasKesehatan() {
|
||||
const stateFasilitasKesehatan = useProxy(fasilitasKesehatanState)
|
||||
const router = useRouter();
|
||||
|
||||
useShallowEffect(() => {
|
||||
stateFasilitasKesehatan.findMany.load()
|
||||
}, [])
|
||||
|
||||
if (!stateFasilitasKesehatan.findMany.data) {
|
||||
return (
|
||||
<Box py={10}>
|
||||
<Skeleton h={500}/>
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
return (
|
||||
<Box py={10}>
|
||||
<Paper bg={colors['white-1']} p={'md'}>
|
||||
<Stack>
|
||||
<JudulList
|
||||
title='List Fasilitas Kesehatan'
|
||||
href='/admin/kesehatan/data-kesehatan-warga/fasilitas_kesehatan/create'
|
||||
/>
|
||||
<Box style={{ overflowX: "auto" }}>
|
||||
<Table striped withRowBorders withTableBorder style={{ minWidth: '700px' }}>
|
||||
<TableThead>
|
||||
<TableTr>
|
||||
<TableTh>Fasilitas Kesehatan</TableTh>
|
||||
<TableTh>Alamat</TableTh>
|
||||
<TableTh>Jam Operasional</TableTh>
|
||||
<TableTh>Detail</TableTh>
|
||||
</TableTr>
|
||||
</TableThead>
|
||||
<TableTbody>
|
||||
{stateFasilitasKesehatan.findMany.data?.map((item) => (
|
||||
<TableTr key={item.id}>
|
||||
<TableTd>{item.name}</TableTd>
|
||||
<TableTd>{item.informasiumum.alamat}</TableTd>
|
||||
<TableTd>{item.informasiumum.jamOperasional}</TableTd>
|
||||
<TableTd>
|
||||
<Button onClick={() => router.push(`/admin/kesehatan/data-kesehatan-warga/fasilitas_kesehatan/${item.id}`)}>
|
||||
<IconDeviceImacCog size={25} />
|
||||
</Button>
|
||||
</TableTd>
|
||||
</TableTr>
|
||||
))}
|
||||
</TableTbody>
|
||||
</Table>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
|
||||
export default FasilitasKesehatan;
|
||||
@@ -0,0 +1,80 @@
|
||||
/* eslint-disable react-hooks/exhaustive-deps */
|
||||
'use client'
|
||||
|
||||
import grafikkepuasan from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/grafikKepuasan';
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Paper, Stack, TextInput, Title } from '@mantine/core';
|
||||
import { IconArrowBack } from '@tabler/icons-react';
|
||||
import { useParams, useRouter } from 'next/navigation';
|
||||
import { useEffect } from 'react';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
|
||||
function EditGrafikHasilKepuasan() {
|
||||
const router = useRouter()
|
||||
const params = useParams() as { uuid: string }
|
||||
const stateGrafikKepuasan = useProxy(grafikkepuasan)
|
||||
|
||||
const uuid = params.uuid
|
||||
|
||||
// Load data saat komponen mount
|
||||
useEffect(() => {
|
||||
if (uuid) {
|
||||
stateGrafikKepuasan.findUnique.load(uuid).then(() => {
|
||||
const data = stateGrafikKepuasan.findUnique.data
|
||||
if (data) {
|
||||
stateGrafikKepuasan.update.form = {
|
||||
label: data.label || '',
|
||||
jumlah: data.jumlah || '',
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
}, [uuid])
|
||||
|
||||
const handleSubmit = async () => {
|
||||
// Set the ID before submitting
|
||||
stateGrafikKepuasan.update.uuid = uuid;
|
||||
await stateGrafikKepuasan.update.submit();
|
||||
router.push('/admin/kesehatan/data-kesehatan-warga/grafik_hasil_kepuasan')
|
||||
}
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
<Button variant="subtle" onClick={() => router.back()}>
|
||||
<IconArrowBack size={20} />
|
||||
</Button>
|
||||
</Box>
|
||||
<Paper bg={colors['white-1']} w={{ base: '100%', md: '50%' }} p={'md'}>
|
||||
<Stack>
|
||||
<Title order={3}>Edit Grafik Hasil Kepuasan</Title>
|
||||
<TextInput
|
||||
label="Label"
|
||||
placeholder="masukkan label"
|
||||
value={stateGrafikKepuasan.update.form.label}
|
||||
onChange={(val) => {
|
||||
stateGrafikKepuasan.update.form.label = val.currentTarget.value;
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label="Jumlah"
|
||||
type="number"
|
||||
placeholder="masukkan jumlah"
|
||||
value={stateGrafikKepuasan.update.form.jumlah}
|
||||
onChange={(val) => {
|
||||
stateGrafikKepuasan.update.form.jumlah = val.currentTarget.value;
|
||||
}}
|
||||
/>
|
||||
<Button
|
||||
mt={10}
|
||||
bg={colors['blue-button']}
|
||||
onClick={handleSubmit}
|
||||
>
|
||||
Simpan
|
||||
</Button>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
|
||||
export default EditGrafikHasilKepuasan;
|
||||
@@ -0,0 +1,81 @@
|
||||
/* eslint-disable @typescript-eslint/no-unused-vars */
|
||||
/* eslint-disable @typescript-eslint/no-explicit-any */
|
||||
'use client'
|
||||
import grafikkepuasan from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/grafikKepuasan';
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Group, Paper, Stack, TextInput, Title } from '@mantine/core';
|
||||
import { IconArrowBack } from '@tabler/icons-react';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { useState } from 'react';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
|
||||
function CreateGrafikHasilKepuasanMasyarakat() {
|
||||
const stateGrafikKepuasan = useProxy(grafikkepuasan);
|
||||
const [chartData, setChartData] = useState<any[]>([]);
|
||||
const router = useRouter()
|
||||
|
||||
const resetForm = () => {
|
||||
stateGrafikKepuasan.create.form = {
|
||||
label: "",
|
||||
jumlah: "",
|
||||
}
|
||||
}
|
||||
|
||||
const handleSubmit = async () => {
|
||||
const id = await stateGrafikKepuasan.create.create();
|
||||
if (id) {
|
||||
const idStr = String(id);
|
||||
await stateGrafikKepuasan.findUnique.load(idStr);
|
||||
if (stateGrafikKepuasan.findUnique.data) {
|
||||
setChartData([stateGrafikKepuasan.findUnique.data]);
|
||||
}
|
||||
}
|
||||
resetForm();
|
||||
router.push("/admin/kesehatan/data-kesehatan-warga/grafik_hasil_kepuasan");
|
||||
}
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
<Button variant="subtle" onClick={() => router.back()}>
|
||||
<IconArrowBack size={20} />
|
||||
</Button>
|
||||
</Box>
|
||||
<Box>
|
||||
<Paper w={{ base: '100%', md: '50%' }} bg={colors['white-1']} p={'md'}>
|
||||
<Title order={4}>Tambah Grafik Hasil Kepuasan Masyarakat</Title>
|
||||
<Stack gap={"xs"}>
|
||||
<TextInput
|
||||
label="Label"
|
||||
type="text"
|
||||
value={stateGrafikKepuasan.create.form.label}
|
||||
placeholder="Masukkan label"
|
||||
onChange={(val) => {
|
||||
stateGrafikKepuasan.create.form.label = val.currentTarget.value;
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label="Jumlah"
|
||||
type="number"
|
||||
value={stateGrafikKepuasan.create.form.jumlah}
|
||||
placeholder="Masukkan jumlah"
|
||||
onChange={(val) => {
|
||||
stateGrafikKepuasan.create.form.jumlah = val.currentTarget.value;
|
||||
}}
|
||||
/>
|
||||
<Group>
|
||||
<Button
|
||||
bg={colors['blue-button']}
|
||||
mt={10}
|
||||
onClick={handleSubmit}
|
||||
>
|
||||
Submit
|
||||
</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Box>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default CreateGrafikHasilKepuasanMasyarakat;
|
||||
@@ -0,0 +1,148 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text, Title } from '@mantine/core';
|
||||
import { useMediaQuery, useShallowEffect } from '@mantine/hooks';
|
||||
import { IconEdit, IconSearch, IconTrash } from '@tabler/icons-react';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { useEffect, useState } from 'react';
|
||||
import { Bar, BarChart, Legend, Tooltip, XAxis, YAxis } from 'recharts';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import JudulListTab from '../../../_com/jusulListTab';
|
||||
import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
|
||||
import grafikkepuasan from '../../../_state/kesehatan/data_kesehatan_warga/grafikKepuasan';
|
||||
|
||||
function GrafikHasilKepuasanMasyarakat() {
|
||||
type PDKMGrafik = {
|
||||
id: string;
|
||||
label: string;
|
||||
jumlah: number;
|
||||
}
|
||||
const stateGrafikKepuasan = useProxy(grafikkepuasan);
|
||||
const [chartData, setChartData] = useState<PDKMGrafik[]>([]);
|
||||
const [mounted, setMounted] = useState(false); // untuk memastikan DOM sudah ready
|
||||
const isTablet = useMediaQuery('(max-width: 1024px)')
|
||||
const isMobile = useMediaQuery('(max-width: 768px)')
|
||||
const [modalHapus, setModalHapus] = useState(false)
|
||||
const [selectedId, setSelectedId] = useState<string | null>(null)
|
||||
const router = useRouter();
|
||||
|
||||
const handleDelete = () => {
|
||||
if (selectedId) {
|
||||
stateGrafikKepuasan.delete.byId(selectedId)
|
||||
setModalHapus(false)
|
||||
setSelectedId(null)
|
||||
|
||||
stateGrafikKepuasan.findMany.load()
|
||||
}
|
||||
}
|
||||
|
||||
useShallowEffect(() => {
|
||||
setMounted(true)
|
||||
stateGrafikKepuasan.findMany.load()
|
||||
}, [])
|
||||
|
||||
useEffect(() => {
|
||||
setMounted(true);
|
||||
if (stateGrafikKepuasan.findMany.data) {
|
||||
setChartData(stateGrafikKepuasan.findMany.data.map((item) => ({
|
||||
id: item.uuid,
|
||||
label: item.label,
|
||||
jumlah: Number(item.jumlah),
|
||||
})));
|
||||
}
|
||||
}, [stateGrafikKepuasan.findMany.data]);
|
||||
|
||||
if (!stateGrafikKepuasan.findMany.data) {
|
||||
return (
|
||||
<Stack>
|
||||
<Skeleton h={500} />
|
||||
</Stack>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<Box>
|
||||
<Stack gap={"xs"}>
|
||||
{/* Form Input */}
|
||||
<Paper bg={colors['white-1']} p={'md'}>
|
||||
<JudulListTab
|
||||
title='List Grafik Hasil Kepuasan Masyarakat'
|
||||
href='/admin/kesehatan/data-kesehatan-warga/grafik_hasil_kepuasan/create'
|
||||
placeholder='pencarian'
|
||||
searchIcon={<IconSearch size={16} />}
|
||||
/>
|
||||
<Table striped withTableBorder withRowBorders>
|
||||
<TableThead>
|
||||
<TableTr>
|
||||
<TableTh>Label</TableTh>
|
||||
<TableTh>Jumlah</TableTh>
|
||||
<TableTh>Edit</TableTh>
|
||||
<TableTh>Delete</TableTh>
|
||||
</TableTr>
|
||||
</TableThead>
|
||||
<TableTbody>
|
||||
{stateGrafikKepuasan.findMany.data?.map((item) => (
|
||||
<TableTr key={item.uuid}>
|
||||
<TableTd>{item.label}</TableTd>
|
||||
<TableTd>{item.jumlah}</TableTd>
|
||||
<TableTd>
|
||||
<Button color='green' onClick={() => router.push(`/admin/kesehatan/data-kesehatan-warga/grafik_hasil_kepuasan/${item.uuid}`)}>
|
||||
<IconEdit size={20} />
|
||||
</Button>
|
||||
</TableTd>
|
||||
<TableTd>
|
||||
<Button
|
||||
color='red'
|
||||
disabled={stateGrafikKepuasan.delete.loading}
|
||||
onClick={() => {
|
||||
setSelectedId(item.uuid)
|
||||
setModalHapus(true)
|
||||
}}>
|
||||
<IconTrash size={20} />
|
||||
</Button>
|
||||
</TableTd>
|
||||
</TableTr>
|
||||
))}
|
||||
</TableTbody>
|
||||
</Table>
|
||||
</Paper>
|
||||
|
||||
|
||||
{/* Chart */}
|
||||
{!mounted && !chartData ? (
|
||||
<Box style={{ width: '100%', minWidth: 300, height: 400, minHeight: 300 }}>
|
||||
<Paper bg={colors['white-1']} p={'md'}>
|
||||
<Title pb={10} order={3}>Grafik Hasil Kepuasan Masyarakat</Title>
|
||||
<Text c='dimmed'>Belum ada data untuk ditampilkan dalam grafik</Text>
|
||||
</Paper>
|
||||
</Box>
|
||||
) : (
|
||||
<Box style={{ width: '100%', minWidth: 300, height: 400, minHeight: 300 }}>
|
||||
<Paper bg={colors['white-1']} p={'md'}>
|
||||
<Title pb={10} order={4}>Grafik Hasil Kepuasan Masyarakat</Title>
|
||||
{mounted && chartData.length > 0 && (
|
||||
<BarChart width={isMobile ? 450 : isTablet ? 500 : 550} height={350} data={chartData} >
|
||||
<XAxis dataKey="label" />
|
||||
<YAxis />
|
||||
<Tooltip />
|
||||
<Legend />
|
||||
<Bar dataKey="jumlah" fill={colors['blue-button']} name="Jumlah" />
|
||||
</BarChart>
|
||||
)}
|
||||
</Paper>
|
||||
</Box>
|
||||
)}
|
||||
</Stack>
|
||||
|
||||
{/* Modal Konfirmasi Hapus */}
|
||||
<ModalKonfirmasiHapus
|
||||
opened={modalHapus}
|
||||
onClose={() => setModalHapus(false)}
|
||||
onConfirm={handleDelete}
|
||||
text='Apakah anda yakin ingin menghapus grafik hasil kepuasan masyarakat ini?'
|
||||
/>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default GrafikHasilKepuasanMasyarakat;
|
||||
@@ -1,8 +1,9 @@
|
||||
'use client'
|
||||
import stateJadwalKegiatan from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/jadwalKegiatan';
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Paper, Stack, Text } from '@mantine/core';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import { KesehatanEditor } from '../../../_com/kesehatanEditor';
|
||||
import colors from '@/con/colors';
|
||||
import { KesehatanEditor } from '../../_com/kesehatanEditor';
|
||||
|
||||
function DeskripsiKegiatan() {
|
||||
const deskripsiKegiatanState = useProxy(stateJadwalKegiatan.deskripsiKegiatan)
|
||||
@@ -1,8 +1,9 @@
|
||||
'use client'
|
||||
import stateJadwalKegiatan from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/jadwalKegiatan';
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Paper, Stack, Text } from '@mantine/core';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import { KesehatanEditor } from '../../../_com/kesehatanEditor';
|
||||
import colors from '@/con/colors';
|
||||
import { KesehatanEditor } from '../../_com/kesehatanEditor';
|
||||
|
||||
function DokumenYangDiperlukan() {
|
||||
const dokumenDiperlukan = useProxy(stateJadwalKegiatan.dokumenjadwalkegiatan)
|
||||
@@ -1,3 +1,4 @@
|
||||
'use client'
|
||||
import stateJadwalKegiatan from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/jadwalKegiatan';
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Paper, Stack, TextInput, Title } from '@mantine/core';
|
||||
@@ -1,8 +1,9 @@
|
||||
'use client'
|
||||
import stateJadwalKegiatan from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/jadwalKegiatan';
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Paper, Stack, Text } from '@mantine/core';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import { KesehatanEditor } from '../../../_com/kesehatanEditor';
|
||||
import colors from '@/con/colors';
|
||||
import { KesehatanEditor } from '../../_com/kesehatanEditor';
|
||||
|
||||
function LayananTersedia() {
|
||||
const layananTersediaState = useProxy(stateJadwalKegiatan.layanantersedia)
|
||||
@@ -1,8 +1,9 @@
|
||||
import stateJadwalKegiatan from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/jadwalKegiatan';
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Paper, Stack, Text } from '@mantine/core';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import { KesehatanEditor } from '../../../_com/kesehatanEditor';
|
||||
import colors from '@/con/colors';
|
||||
import { KesehatanEditor } from '../../_com/kesehatanEditor';
|
||||
import stateJadwalKegiatan from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/jadwalKegiatan';
|
||||
|
||||
function SyaratDanKetentuan() {
|
||||
const syaratKetentuan = useProxy(stateJadwalKegiatan.syaratketentuan)
|
||||
@@ -0,0 +1,12 @@
|
||||
'use client'
|
||||
|
||||
import LayoutTabs from "./_lib/layoutTabs"
|
||||
|
||||
|
||||
export default function Layout({children} : {children: React.ReactNode}) {
|
||||
return (
|
||||
<LayoutTabs>
|
||||
{children}
|
||||
</LayoutTabs>
|
||||
)
|
||||
}
|
||||
@@ -1,54 +0,0 @@
|
||||
import colors from '@/con/colors';
|
||||
import { Stack, Tabs, TabsList, TabsPanel, TabsTab, Title } from '@mantine/core';
|
||||
import ArtikelKesehatan from './_ui/artikel_kesehatan/page';
|
||||
import FasilitasKesehatan from './_ui/fasilitas_kesehatan/page';
|
||||
import GrafikHasilKepuasan from './_ui/grafik_hasil_kepuasan/page';
|
||||
import JadwalKegiatan from './_ui/jadwal_kegiatan/page';
|
||||
import PersentaseDataKelahiranKematian from './_ui/persentase_data_kelahiran_kematian/page';
|
||||
|
||||
|
||||
function Page() {
|
||||
return (
|
||||
<Stack>
|
||||
<Title order={3}>Data Kesehatan Warga</Title>
|
||||
<Tabs color={colors['blue-button']} variant='pills' defaultValue={"Persentase Kelahiran & Kematian"}>
|
||||
<TabsList bg={colors['BG-trans']} p={'xs'}>
|
||||
<TabsTab value="Persentase Kelahiran & Kematian">
|
||||
Persentase Kelahiran & Kematian
|
||||
</TabsTab>
|
||||
<TabsTab value="Grafik Hasil Kepuasan">
|
||||
Grafik Hasil Kepuasan
|
||||
</TabsTab>
|
||||
<TabsTab value="Fasilitas Kesehatan">
|
||||
Fasilitas Kesehatan
|
||||
</TabsTab>
|
||||
<TabsTab value="Jadwal Kegiatan">
|
||||
Jadwal Kegiatan
|
||||
</TabsTab>
|
||||
<TabsTab value="Artikel Kesehatan">
|
||||
Artikel Kesehatan
|
||||
</TabsTab>
|
||||
</TabsList>
|
||||
|
||||
<TabsPanel value="Persentase Kelahiran & Kematian">
|
||||
<PersentaseDataKelahiranKematian />
|
||||
</TabsPanel>
|
||||
<TabsPanel value="Grafik Hasil Kepuasan">
|
||||
<GrafikHasilKepuasan/>
|
||||
</TabsPanel>
|
||||
<TabsPanel value="Fasilitas Kesehatan">
|
||||
<FasilitasKesehatan/>
|
||||
</TabsPanel>
|
||||
<TabsPanel value="Jadwal Kegiatan">
|
||||
<JadwalKegiatan/>
|
||||
</TabsPanel>
|
||||
<TabsPanel value="Artikel Kesehatan">
|
||||
<ArtikelKesehatan/>
|
||||
</TabsPanel>
|
||||
|
||||
</Tabs>
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
|
||||
export default Page;
|
||||
@@ -0,0 +1,114 @@
|
||||
/* eslint-disable react-hooks/exhaustive-deps */
|
||||
'use client'
|
||||
|
||||
import persentasekelahiran from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/persentaseKelahiran';
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Paper, Stack, TextInput, Title } from '@mantine/core';
|
||||
import { IconArrowBack } from '@tabler/icons-react';
|
||||
import { useParams, useRouter } from 'next/navigation';
|
||||
import { useEffect } from 'react';
|
||||
import { toast } from 'react-toastify';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
|
||||
function EditPersentaseDataKelahiranKematian() {
|
||||
const router = useRouter()
|
||||
const params = useParams() as { uuid: string }
|
||||
const statePresentase = useProxy(persentasekelahiran)
|
||||
|
||||
const id = params.uuid
|
||||
|
||||
// Load data saat komponen mount
|
||||
// Di file page.tsx, ubah useEffect-nya menjadi:
|
||||
useEffect(() => {
|
||||
if (!id) return;
|
||||
statePresentase.update.uuid = id;
|
||||
statePresentase.findUnique.load(id)
|
||||
.then(() => {
|
||||
const data = statePresentase.findUnique.data;
|
||||
if (data) {
|
||||
statePresentase.update.form = {
|
||||
tahun: String(data.tahun || ''),
|
||||
kematianKasar: String(data.kematianKasar || ''),
|
||||
kelahiranKasar: String(data.kelahiranKasar || ''),
|
||||
kematianBayi: String(data.kematianBayi || '')
|
||||
};
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error loading data:', error);
|
||||
toast.error('Gagal memuat data');
|
||||
});
|
||||
}, [id]);
|
||||
|
||||
// Di handleSubmit, ubah menjadi:
|
||||
const handleSubmit = async () => {
|
||||
try {
|
||||
statePresentase.update.uuid = id;
|
||||
await statePresentase.update.submit();
|
||||
toast.success('Data berhasil diperbarui');
|
||||
router.push('/admin/kesehatan/data-kesehatan-warga/persentase_data_kelahiran_kematian');
|
||||
} catch (error) {
|
||||
console.error('Error updating data:', error);
|
||||
toast.error('Gagal memperbarui data');
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
<Button variant="subtle" onClick={() => router.back()}>
|
||||
<IconArrowBack size={20} />
|
||||
</Button>
|
||||
</Box>
|
||||
<Paper bg={colors['white-1']} w={{ base: '100%', md: '50%' }} p={'md'}>
|
||||
<Stack>
|
||||
<Title order={3}>Edit Persentase Data Kelahiran & Kematian</Title>
|
||||
<TextInput
|
||||
label="Tahun"
|
||||
placeholder="masukkan tahun"
|
||||
value={statePresentase.update.form.tahun}
|
||||
onChange={(val) => {
|
||||
statePresentase.update.form.tahun = val.currentTarget.value;
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label="Kematian Kasar"
|
||||
type="number"
|
||||
placeholder="masukkan kematian kasar"
|
||||
value={statePresentase.update.form.kematianKasar}
|
||||
onChange={(val) => {
|
||||
statePresentase.update.form.kematianKasar = val.currentTarget.value;
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label="Kematian Bayi"
|
||||
type="number"
|
||||
placeholder="masukkan kematian bayi"
|
||||
value={statePresentase.update.form.kematianBayi}
|
||||
onChange={(val) => {
|
||||
statePresentase.update.form.kematianBayi = val.currentTarget.value;
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label="Kelahiran Kasar"
|
||||
type="number"
|
||||
placeholder="masukkan kelahiran kasar"
|
||||
value={statePresentase.update.form.kelahiranKasar}
|
||||
onChange={(val) => {
|
||||
statePresentase.update.form.kelahiranKasar = val.currentTarget.value;
|
||||
}}
|
||||
/>
|
||||
<Button
|
||||
mt={10}
|
||||
bg={colors['blue-button']}
|
||||
onClick={handleSubmit}
|
||||
>
|
||||
Simpan Perubahan
|
||||
</Button>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
|
||||
export default EditPersentaseDataKelahiranKematian;
|
||||
@@ -0,0 +1,101 @@
|
||||
/* eslint-disable @typescript-eslint/no-unused-vars */
|
||||
/* eslint-disable @typescript-eslint/no-explicit-any */
|
||||
'use client'
|
||||
import persentasekelahiran from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/persentaseKelahiran';
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Group, Paper, Stack, TextInput, Title } from '@mantine/core';
|
||||
import { IconArrowBack } from '@tabler/icons-react';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { useState } from 'react';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
|
||||
function CreatePersentaseDataKelahiranKematian() {
|
||||
const statePersentase = useProxy(persentasekelahiran);
|
||||
const [chartData, setChartData] = useState<any[]>([]);
|
||||
const router = useRouter()
|
||||
|
||||
const resetForm = () => {
|
||||
statePersentase.create.form = {
|
||||
tahun: "",
|
||||
kematianBayi: "",
|
||||
kematianKasar: "",
|
||||
kelahiranKasar: "",
|
||||
}
|
||||
}
|
||||
|
||||
const handleSubmit = async () => {
|
||||
const id = await statePersentase.create.create();
|
||||
if (id) {
|
||||
const idStr = String(id);
|
||||
await statePersentase.findUnique.load(idStr);
|
||||
if (statePersentase.findUnique.data) {
|
||||
setChartData([statePersentase.findUnique.data]);
|
||||
}
|
||||
}
|
||||
resetForm();
|
||||
router.push("/admin/kesehatan/data-kesehatan-warga/persentase_data_kelahiran_kematian");
|
||||
}
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
<Button variant="subtle" onClick={() => router.back()}>
|
||||
<IconArrowBack size={20} />
|
||||
</Button>
|
||||
</Box>
|
||||
<Box>
|
||||
<Paper w={{ base: '100%', md: '50%' }} bg={colors['white-1']} p={'md'}>
|
||||
<Title order={4}>Tambah Persentase Data Kelahiran & Kematian</Title>
|
||||
<Stack gap={"xs"}>
|
||||
<TextInput
|
||||
label="Tahun"
|
||||
type="number"
|
||||
value={statePersentase.create.form.tahun}
|
||||
placeholder="Masukkan tahun"
|
||||
onChange={(val) => {
|
||||
statePersentase.create.form.tahun = val.currentTarget.value;
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label="Kematian Kasar"
|
||||
type="number"
|
||||
value={statePersentase.create.form.kematianKasar}
|
||||
placeholder="Masukkan kematian kasar"
|
||||
onChange={(val) => {
|
||||
statePersentase.create.form.kematianKasar = val.currentTarget.value;
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label="Kematian Bayi"
|
||||
type="number"
|
||||
value={statePersentase.create.form.kematianBayi}
|
||||
placeholder="Masukkan kematian bayi"
|
||||
onChange={(val) => {
|
||||
statePersentase.create.form.kematianBayi = val.currentTarget.value;
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label="Kelahiran Kasar"
|
||||
type="number"
|
||||
value={statePersentase.create.form.kelahiranKasar}
|
||||
placeholder="Masukkan kelahiran kasar"
|
||||
onChange={(val) => {
|
||||
statePersentase.create.form.kelahiranKasar = val.currentTarget.value;
|
||||
}}
|
||||
/>
|
||||
<Group>
|
||||
<Button
|
||||
bg={colors['blue-button']}
|
||||
mt={10}
|
||||
onClick={handleSubmit}
|
||||
>
|
||||
Submit
|
||||
</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Box>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default CreatePersentaseDataKelahiranKematian;
|
||||
@@ -0,0 +1,158 @@
|
||||
'use client'
|
||||
import persentasekelahiran from '@/app/admin/(dashboard)/_state/kesehatan/data_kesehatan_warga/persentaseKelahiran';
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text, Title } from '@mantine/core';
|
||||
import { useMediaQuery, useShallowEffect } from '@mantine/hooks';
|
||||
import { IconEdit, IconSearch, IconTrash } from '@tabler/icons-react';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { useEffect, useState } from 'react';
|
||||
import { Bar, BarChart, Legend, Tooltip, XAxis, YAxis } from 'recharts';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import JudulListTab from '../../../_com/jusulListTab';
|
||||
import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
|
||||
|
||||
function PersentaseDataKelahiranKematian() {
|
||||
type PDKMGrafik = {
|
||||
uuid: string;
|
||||
tahun: string;
|
||||
kematianKasar: number;
|
||||
kematianBayi: number;
|
||||
kelahiranKasar: number;
|
||||
}
|
||||
const statePersentase = useProxy(persentasekelahiran);
|
||||
const [chartData, setChartData] = useState<PDKMGrafik[]>([]);
|
||||
const [mounted, setMounted] = useState(false); // untuk memastikan DOM sudah ready
|
||||
const isTablet = useMediaQuery('(max-width: 1024px)')
|
||||
const isMobile = useMediaQuery('(max-width: 768px)')
|
||||
const [modalHapus, setModalHapus] = useState(false)
|
||||
const [selectedId, setSelectedId] = useState<string | null>(null)
|
||||
const router = useRouter();
|
||||
|
||||
const handleDelete = () => {
|
||||
if (selectedId) {
|
||||
statePersentase.delete.byId(selectedId)
|
||||
setModalHapus(false)
|
||||
setSelectedId(null)
|
||||
|
||||
statePersentase.findMany.load()
|
||||
}
|
||||
}
|
||||
|
||||
useShallowEffect(() => {
|
||||
setMounted(true)
|
||||
statePersentase.findMany.load()
|
||||
}, [])
|
||||
|
||||
useEffect(() => {
|
||||
setMounted(true);
|
||||
if (statePersentase.findMany.data) {
|
||||
setChartData(statePersentase.findMany.data.map((item) => ({
|
||||
uuid: item.uuid,
|
||||
tahun: item.tahun,
|
||||
kematianKasar: Number(item.kematianKasar),
|
||||
kematianBayi: Number(item.kematianBayi),
|
||||
kelahiranKasar: Number(item.kelahiranKasar),
|
||||
})));
|
||||
}
|
||||
}, [statePersentase.findMany.data]);
|
||||
|
||||
if (!statePersentase.findMany.data) {
|
||||
return (
|
||||
<Stack>
|
||||
<Skeleton h={500} />
|
||||
</Stack>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<Box>
|
||||
<Stack gap={"xs"}>
|
||||
{/* Form Input */}
|
||||
<Paper bg={colors['white-1']} p={'md'}>
|
||||
<JudulListTab
|
||||
title='List Persentase Data Kelahiran & Kematian'
|
||||
href='/admin/kesehatan/data-kesehatan-warga/persentase_data_kelahiran_kematian/create'
|
||||
placeholder='pencarian'
|
||||
searchIcon={<IconSearch size={16} />}
|
||||
/>
|
||||
<Table striped withTableBorder withRowBorders>
|
||||
<TableThead>
|
||||
<TableTr>
|
||||
<TableTh>Tahun</TableTh>
|
||||
<TableTh>Kematian Kasar</TableTh>
|
||||
<TableTh>Kematian Bayi</TableTh>
|
||||
<TableTh>kelahiran Kasar</TableTh>
|
||||
<TableTh>Edit</TableTh>
|
||||
<TableTh>Delete</TableTh>
|
||||
</TableTr>
|
||||
</TableThead>
|
||||
<TableTbody>
|
||||
{statePersentase.findMany.data?.map((item) => (
|
||||
<TableTr key={item.uuid}>
|
||||
<TableTd>{item.tahun}</TableTd>
|
||||
<TableTd>{item.kematianKasar}</TableTd>
|
||||
<TableTd>{item.kematianBayi}</TableTd>
|
||||
<TableTd>{item.kelahiranKasar}</TableTd>
|
||||
<TableTd>
|
||||
<Button color='green' onClick={() => router.push(`/admin/kesehatan/data-kesehatan-warga/persentase_data_kelahiran_kematian/${item.uuid}`)}>
|
||||
<IconEdit size={20} />
|
||||
</Button>
|
||||
</TableTd>
|
||||
<TableTd>
|
||||
<Button
|
||||
color='red'
|
||||
disabled={statePersentase.delete.loading}
|
||||
onClick={() => {
|
||||
setSelectedId(item.uuid)
|
||||
setModalHapus(true)
|
||||
}}>
|
||||
<IconTrash size={20} />
|
||||
</Button>
|
||||
</TableTd>
|
||||
</TableTr>
|
||||
))}
|
||||
</TableTbody>
|
||||
</Table>
|
||||
</Paper>
|
||||
|
||||
|
||||
{/* Chart */}
|
||||
{!mounted && !chartData ? (
|
||||
<Box style={{ width: '100%', minWidth: 300, height: 400, minHeight: 300 }}>
|
||||
<Paper bg={colors['white-1']} p={'md'}>
|
||||
<Title pb={10} order={3}>Data Kelahiran & Kematian</Title>
|
||||
<Text c='dimmed'>Belum ada data untuk ditampilkan dalam grafik</Text>
|
||||
</Paper>
|
||||
</Box>
|
||||
) : (
|
||||
<Box style={{ width: '100%', minWidth: 300, height: 400, minHeight: 300 }}>
|
||||
<Paper bg={colors['white-1']} p={'md'}>
|
||||
<Title pb={10} order={4}>Data Kelahiran & Kematian</Title>
|
||||
{mounted && chartData.length > 0 && (
|
||||
<BarChart width={isMobile ? 450 : isTablet ? 500 : 550} height={350} data={chartData} >
|
||||
<XAxis dataKey="tahun" />
|
||||
<YAxis />
|
||||
<Tooltip />
|
||||
<Legend />
|
||||
<Bar dataKey="kematianKasar" fill="#f03e3e" name="Kematian Kasar" />
|
||||
<Bar dataKey="kematianBayi" fill="#ff922b" name="Kematian Bayi" />
|
||||
<Bar dataKey="kelahiranKasar" fill="#4dabf7" name="Kelahiran Kasar" />
|
||||
</BarChart>
|
||||
)}
|
||||
</Paper>
|
||||
</Box>
|
||||
)}
|
||||
</Stack>
|
||||
|
||||
{/* Modal Konfirmasi Hapus */}
|
||||
<ModalKonfirmasiHapus
|
||||
opened={modalHapus}
|
||||
onClose={() => setModalHapus(false)}
|
||||
onConfirm={handleDelete}
|
||||
text='Apakah anda yakin ingin menghapus persentase data kelahiran & kematian ini?'
|
||||
/>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default PersentaseDataKelahiranKematian;
|
||||
@@ -0,0 +1,150 @@
|
||||
/* eslint-disable react-hooks/exhaustive-deps */
|
||||
'use client'
|
||||
import EditEditor from '@/app/admin/(dashboard)/_com/editEditor';
|
||||
import infoWabahPenyakit from '@/app/admin/(dashboard)/_state/kesehatan/info-wabah-penyakit/infoWabahPenyakit';
|
||||
import colors from '@/con/colors';
|
||||
import ApiFetch from '@/lib/api-fetch';
|
||||
import { Box, Button, Center, FileInput, Image, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
|
||||
import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
|
||||
import { useParams, useRouter } from 'next/navigation';
|
||||
import { useEffect, useState } from 'react';
|
||||
import { toast } from 'react-toastify';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
|
||||
|
||||
function EditInfoWabahPenyakit() {
|
||||
const infoWabahPenyakitState = useProxy(infoWabahPenyakit)
|
||||
const router = useRouter();
|
||||
const params = useParams()
|
||||
|
||||
const [previewImage, setPreviewImage] = useState<string | null>(null);
|
||||
const [file, setFile] = useState<File | null>(null);
|
||||
const [formData, setFormData] = useState({
|
||||
name: infoWabahPenyakitState.edit.form.name || '',
|
||||
deskripsiSingkat: infoWabahPenyakitState.edit.form.deskripsiSingkat || '',
|
||||
deskripsi: infoWabahPenyakitState.edit.form.deskripsiLengkap || '',
|
||||
imageId: infoWabahPenyakitState.edit.form.imageId || '',
|
||||
})
|
||||
|
||||
useEffect(() => {
|
||||
const loadInfoWabahPenyakit = async () => {
|
||||
const id = params?.id as string;
|
||||
if (!id) return;
|
||||
|
||||
try {
|
||||
const data = await infoWabahPenyakitState.edit.load(id);
|
||||
if (data) {
|
||||
setFormData({
|
||||
name: data.name || '',
|
||||
deskripsiSingkat: data.deskripsiSingkat || '',
|
||||
deskripsi: data.deskripsiLengkap || '',
|
||||
imageId: data.imageId || '',
|
||||
});
|
||||
|
||||
if (data?.image?.link) {
|
||||
setPreviewImage(data.image.link);
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error loading program kesehatan:", error);
|
||||
toast.error("Gagal memuat data program kesehatan");
|
||||
}
|
||||
};
|
||||
|
||||
loadInfoWabahPenyakit();
|
||||
}, [params?.id]);
|
||||
|
||||
const handleSubmit = async () => {
|
||||
try {
|
||||
infoWabahPenyakitState.edit.form = {
|
||||
...infoWabahPenyakitState.edit.form,
|
||||
name: formData.name,
|
||||
deskripsiSingkat: formData.deskripsiSingkat,
|
||||
deskripsiLengkap: formData.deskripsi,
|
||||
imageId: formData.imageId,
|
||||
};
|
||||
|
||||
if (file) {
|
||||
const res = await ApiFetch.api.fileStorage.create.post({ file, name: file.name });
|
||||
const uploaded = res.data?.data;
|
||||
|
||||
if (!uploaded?.id) {
|
||||
return toast.error("Gagal upload gambar");
|
||||
}
|
||||
|
||||
infoWabahPenyakitState.edit.form.imageId = uploaded.id;
|
||||
}
|
||||
|
||||
await infoWabahPenyakitState.edit.update();
|
||||
toast.success("Info wabah penyakit berhasil diperbarui!");
|
||||
router.push("/admin/kesehatan/info-wabah-penyakit");
|
||||
} catch (error) {
|
||||
console.error("Error updating info wabah penyakit:", error);
|
||||
toast.error("Gagal memuat data info wabah penyakit");
|
||||
}
|
||||
}
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
<Button variant="subtle" onClick={() => router.back()}>
|
||||
<IconArrowBack color={colors['blue-button']} size={25} />
|
||||
</Button>
|
||||
</Box>
|
||||
<Stack gap={"xs"}>
|
||||
<Paper bg={colors['white-1']} p="md" w={{ base: '100%', md: '50%' }}>
|
||||
<Stack gap="xs">
|
||||
<Title order={3}>Edit Info Wabah Penyakit</Title>
|
||||
<TextInput
|
||||
value={formData.name}
|
||||
onChange={(e) => setFormData({ ...formData, name: e.target.value })}
|
||||
label={<Text fz="sm" fw="bold">Judul</Text>}
|
||||
placeholder="masukkan judul"
|
||||
/>
|
||||
|
||||
<TextInput
|
||||
value={formData.deskripsiSingkat}
|
||||
onChange={(e) => setFormData({ ...formData, deskripsiSingkat: e.target.value })}
|
||||
label={<Text fz="sm" fw="bold">Deskripsi Singkat</Text>}
|
||||
placeholder="masukkan deskripsi"
|
||||
/>
|
||||
|
||||
<Box>
|
||||
<Text fz="sm" fw="bold">Deskripsi</Text>
|
||||
<EditEditor
|
||||
value={formData.deskripsi}
|
||||
onChange={(val) => setFormData({ ...formData, deskripsi: val })}
|
||||
/>
|
||||
</Box>
|
||||
|
||||
<FileInput
|
||||
label={<Text fz="sm" fw="bold">Upload Gambar</Text>}
|
||||
value={file}
|
||||
onChange={async (e) => {
|
||||
if (!e) return;
|
||||
setFile(e);
|
||||
const base64 = await e.arrayBuffer().then((buf) =>
|
||||
'data:image/png;base64,' + Buffer.from(buf).toString('base64')
|
||||
);
|
||||
setPreviewImage(base64);
|
||||
}}
|
||||
/>
|
||||
|
||||
{previewImage ? (
|
||||
<Image alt="" src={previewImage} w={200} h={200} />
|
||||
) : (
|
||||
<Center w={200} h={200} bg="gray">
|
||||
<IconImageInPicture />
|
||||
</Center>
|
||||
)}
|
||||
|
||||
<Button onClick={handleSubmit} bg={colors['blue-button']}>
|
||||
Simpan
|
||||
</Button>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</Box >
|
||||
);
|
||||
}
|
||||
|
||||
export default EditInfoWabahPenyakit;
|
||||
@@ -0,0 +1,103 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Paper, Stack, Flex, Text, Image, Skeleton } from '@mantine/core';
|
||||
import { IconArrowBack, IconX, IconEdit } from '@tabler/icons-react';
|
||||
import { useParams, useRouter } from 'next/navigation';
|
||||
import React, { useState } from 'react';
|
||||
import infoWabahPenyakit from '../../../_state/kesehatan/info-wabah-penyakit/infoWabahPenyakit';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import { useShallowEffect } from '@mantine/hooks';
|
||||
import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
|
||||
|
||||
function DetailInfoWabahPenyakit() {
|
||||
const infoWabahPenyakitState = useProxy(infoWabahPenyakit)
|
||||
const [modalHapus, setModalHapus] = useState(false)
|
||||
const [selectedId, setSelectedId] = useState<string | null>(null)
|
||||
const router = useRouter();
|
||||
const params = useParams()
|
||||
|
||||
useShallowEffect(() => {
|
||||
infoWabahPenyakitState.findUnique.load(params?.id as string)
|
||||
}, [])
|
||||
|
||||
const handleHapus = () => {
|
||||
if (selectedId) {
|
||||
infoWabahPenyakitState.delete.byId(selectedId)
|
||||
setModalHapus(false)
|
||||
setSelectedId(null)
|
||||
router.push("/admin/kesehatan/info-wabah-penyakit")
|
||||
}
|
||||
}
|
||||
|
||||
if (!infoWabahPenyakitState.findUnique.data) {
|
||||
return (
|
||||
<Stack py={10}>
|
||||
<Skeleton h={400} />
|
||||
</Stack>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
<Button variant="subtle" onClick={() => router.back()}>
|
||||
<IconArrowBack color={colors['blue-button']} size={25} />
|
||||
</Button>
|
||||
</Box>
|
||||
<Paper w={{ base: "100%", md: "50%" }} bg={colors['white-1']} p={'md'}>
|
||||
<Stack>
|
||||
<Text fz={"xl"} fw={"bold"}>Detail Info Wabah Penyakit</Text>
|
||||
{infoWabahPenyakitState.findUnique.data ? (
|
||||
<Paper bg={colors['BG-trans']} p={'md'}>
|
||||
<Stack gap={"xs"}>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Judul</Text>
|
||||
<Text fz={"lg"}>{infoWabahPenyakitState.findUnique.data.name}</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Deskripsi Singkat</Text>
|
||||
<Text fz={"lg"}>{infoWabahPenyakitState.findUnique.data.deskripsiSingkat}</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Deskripsi</Text>
|
||||
<Text fz={"lg"} dangerouslySetInnerHTML={{ __html: infoWabahPenyakitState.findUnique.data.deskripsiLengkap }} />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Gambar</Text>
|
||||
<Image src={infoWabahPenyakitState.findUnique.data.image?.link} alt="gambar" />
|
||||
</Box>
|
||||
<Box>
|
||||
<Flex gap={"xs"}>
|
||||
<Button color="red" onClick={() => {
|
||||
if (infoWabahPenyakitState.findUnique.data) {
|
||||
setSelectedId(infoWabahPenyakitState.findUnique.data.id)
|
||||
setModalHapus(true)
|
||||
}
|
||||
}}
|
||||
disabled={infoWabahPenyakitState.delete.loading || !infoWabahPenyakitState.findUnique.data}
|
||||
>
|
||||
<IconX size={20} />
|
||||
</Button>
|
||||
<Button onClick={() => router.push(`/admin/kesehatan/info-wabah-penyakit/${infoWabahPenyakitState.findUnique.data?.id}/edit`)} color="green">
|
||||
<IconEdit size={20} />
|
||||
</Button>
|
||||
</Flex>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Paper>
|
||||
) : null}
|
||||
</Stack>
|
||||
</Paper>
|
||||
|
||||
{/* Modal Hapus */}
|
||||
<ModalKonfirmasiHapus
|
||||
opened={modalHapus}
|
||||
onClose={() => setModalHapus(false)}
|
||||
onConfirm={handleHapus}
|
||||
text="Apakah anda yakin ingin menghapus info wabah penyakit ini?"
|
||||
/>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default DetailInfoWabahPenyakit;
|
||||
@@ -1,12 +1,62 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
|
||||
import { IconArrowBack } from '@tabler/icons-react';
|
||||
import ApiFetch from '@/lib/api-fetch';
|
||||
import { Box, Button, Center, FileInput, Image, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
|
||||
import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { KesehatanEditor } from '../../_com/kesehatanEditor';
|
||||
import { useState } from 'react';
|
||||
import { toast } from 'react-toastify';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import CreateEditor from '../../../_com/createEditor';
|
||||
import infoWabahPenyakit from '../../../_state/kesehatan/info-wabah-penyakit/infoWabahPenyakit';
|
||||
|
||||
function CreateInfoWabahPenyakit() {
|
||||
const router = useRouter();
|
||||
const infoWabahPenyakitState = useProxy(infoWabahPenyakit)
|
||||
const [previewImage, setPreviewImage] = useState<string | null>(null);
|
||||
const [file, setFile] = useState<File | null>(null);
|
||||
|
||||
const resetForm = () => {
|
||||
// Reset state di valtio
|
||||
infoWabahPenyakitState.create.form = {
|
||||
name: "",
|
||||
deskripsiSingkat: "",
|
||||
deskripsiLengkap: "",
|
||||
imageId: "",
|
||||
};
|
||||
|
||||
// Reset state lokal
|
||||
setPreviewImage(null);
|
||||
setFile(null);
|
||||
};
|
||||
|
||||
const handleSubmit = async () => {
|
||||
if (!file) {
|
||||
return toast.warn("Pilih file gambar terlebih dahulu");
|
||||
}
|
||||
|
||||
// Upload gambar dulu
|
||||
const res = await ApiFetch.api.fileStorage.create.post({
|
||||
file,
|
||||
name: file.name,
|
||||
});
|
||||
|
||||
const uploaded = res.data?.data;
|
||||
if (!uploaded?.id) {
|
||||
return toast.error("Gagal upload gambar");
|
||||
}
|
||||
|
||||
// Simpan ID gambar ke form
|
||||
infoWabahPenyakitState.create.form.imageId = uploaded.id;
|
||||
|
||||
// Submit data berita
|
||||
await infoWabahPenyakitState.create.create();
|
||||
|
||||
// Reset form setelah submit
|
||||
resetForm();
|
||||
router.push("/admin/kesehatan/info-wabah-penyakit")
|
||||
};
|
||||
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
@@ -14,30 +64,38 @@ function CreateInfoWabahPenyakit() {
|
||||
<IconArrowBack color={colors['blue-button']} size={25} />
|
||||
</Button>
|
||||
</Box>
|
||||
|
||||
<Paper bg={colors['white-1']} p="md" w={{ base: '100%', md: '50%' }}>
|
||||
<Stack gap="xs">
|
||||
<Title order={3}>Create Info Wabah Penyakit</Title>
|
||||
|
||||
<TextInput
|
||||
|
||||
value={infoWabahPenyakitState.create.form.name}
|
||||
onChange={(val) => {
|
||||
infoWabahPenyakitState.create.form.name = val.target.value;
|
||||
}}
|
||||
label={<Text fz="sm" fw="bold">Judul</Text>}
|
||||
placeholder="masukkan judul"
|
||||
/>
|
||||
|
||||
<TextInput
|
||||
|
||||
label={<Text fz="sm" fw="bold">Deskripsi</Text>}
|
||||
value={infoWabahPenyakitState.create.form.deskripsiSingkat}
|
||||
onChange={(val) => {
|
||||
infoWabahPenyakitState.create.form.deskripsiSingkat = val.target.value;
|
||||
}}
|
||||
label={<Text fz="sm" fw="bold">Deskripsi Singkat</Text>}
|
||||
placeholder="masukkan deskripsi"
|
||||
/>
|
||||
|
||||
<TextInput
|
||||
|
||||
label={<Text fz="sm" fw="bold">Kategori</Text>}
|
||||
placeholder="masukkan kategori"
|
||||
<Box>
|
||||
<Text fz="sm" fw="bold">Deskripsi</Text>
|
||||
<CreateEditor
|
||||
value={infoWabahPenyakitState.create.form.deskripsiLengkap}
|
||||
onChange={(val) => {
|
||||
infoWabahPenyakitState.create.form.deskripsiLengkap = val;
|
||||
}}
|
||||
/>
|
||||
</Box>
|
||||
|
||||
{/* <FileInput
|
||||
<FileInput
|
||||
label={<Text fz="sm" fw="bold">Upload Gambar</Text>}
|
||||
value={file}
|
||||
onChange={async (e) => {
|
||||
@@ -48,25 +106,18 @@ function CreateInfoWabahPenyakit() {
|
||||
);
|
||||
setPreviewImage(base64);
|
||||
}}
|
||||
/> */}
|
||||
/>
|
||||
|
||||
{/* {previewImage ? (
|
||||
{previewImage ? (
|
||||
<Image alt="" src={previewImage} w={200} h={200} />
|
||||
) : (
|
||||
<Center w={200} h={200} bg="gray">
|
||||
<IconImageInPicture />
|
||||
</Center>
|
||||
)} */}
|
||||
)}
|
||||
|
||||
<Box>
|
||||
<Text fz="sm" fw="bold">Konten</Text>
|
||||
<KesehatanEditor
|
||||
showSubmit={false}
|
||||
/>
|
||||
</Box>
|
||||
|
||||
<Button bg={colors['blue-button']}>
|
||||
Simpan Potensi
|
||||
<Button onClick={handleSubmit} bg={colors['blue-button']}>
|
||||
Simpan
|
||||
</Button>
|
||||
</Stack>
|
||||
</Paper>
|
||||
|
||||
@@ -1,70 +0,0 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Paper, Stack, Flex, Text, Image } from '@mantine/core';
|
||||
import { IconArrowBack, IconX, IconEdit } from '@tabler/icons-react';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import React from 'react';
|
||||
// import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
|
||||
|
||||
function DetailInfoWabahPenyakit() {
|
||||
const router = useRouter();
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
<Button variant="subtle" onClick={() => router.back()}>
|
||||
<IconArrowBack color={colors['blue-button']} size={25} />
|
||||
</Button>
|
||||
</Box>
|
||||
<Paper w={{ base: "100%", md: "50%" }} bg={colors['white-1']} p={'md'}>
|
||||
<Stack>
|
||||
<Text fz={"xl"} fw={"bold"}>Detail Info Wabah/Penyakit</Text>
|
||||
|
||||
<Paper bg={colors['BG-trans']} p={'md'}>
|
||||
<Stack gap={"xs"}>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Nama Info Wabah/Penyakit</Text>
|
||||
<Text fz={"lg"}>Test Judul</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Deskripsi Info Wabah/Penyakit</Text>
|
||||
<Text fz={"lg"}>Test Kategori</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Deskripsi</Text>
|
||||
<Text fz={"lg"}>Test Deskripsi</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Gambar</Text>
|
||||
<Image src={"/"} alt="gambar" />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Konten</Text>
|
||||
<Text fz={"lg"} >Test Konten</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Flex gap={"xs"}>
|
||||
<Button color="red">
|
||||
<IconX size={20} />
|
||||
</Button>
|
||||
<Button onClick={() => router.push('/admin/kesehatan/info-wabah-penyakit/edit')} color="green">
|
||||
<IconEdit size={20} />
|
||||
</Button>
|
||||
</Flex>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</Paper>
|
||||
|
||||
{/* Modal Hapus
|
||||
<ModalKonfirmasiHapus
|
||||
opened={modalHapus}
|
||||
onClose={() => setModalHapus(false)}
|
||||
onConfirm={handleHapus}
|
||||
text="Apakah anda yakin ingin menghapus penanganan darurat ini?"
|
||||
/> */}
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default DetailInfoWabahPenyakit;
|
||||
@@ -1,62 +0,0 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Stack, SimpleGrid, Paper, Title, TextInput, Text, Button, Image } from '@mantine/core';
|
||||
import { KesehatanEditor } from '../../_com/kesehatanEditor';
|
||||
import { IconArrowBack } from '@tabler/icons-react';
|
||||
import { useRouter } from 'next/navigation';
|
||||
|
||||
|
||||
function EditInfoWabahPenyakit() {
|
||||
const router = useRouter();
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
<Button variant="subtle" onClick={() => router.back()}>
|
||||
<IconArrowBack color={colors['blue-button']} size={25} />
|
||||
</Button>
|
||||
</Box>
|
||||
<Stack gap={"xs"}>
|
||||
<SimpleGrid cols={{ base: 1, md: 2 }}>
|
||||
<Box>
|
||||
<Paper bg={colors['white-1']} p={"md"}>
|
||||
<Stack gap={"xs"}>
|
||||
<Title order={3}>Edit Info Wabah/Penyakit</Title>
|
||||
<TextInput
|
||||
label={<Text fw={"bold"} fz={"sm"}>Nama Info Wabah/Penyakit</Text>}
|
||||
placeholder='Masukkan nama Info Wabah/Penyakit'
|
||||
/>
|
||||
<TextInput
|
||||
label={<Text fw={"bold"} fz={"sm"}>Deskripsi Info Wabah/Penyakit</Text>}
|
||||
placeholder='Masukkan deskripsi Info Wabah/Penyakit'
|
||||
/>
|
||||
<Box>
|
||||
<Text fw={"bold"} fz={"sm"}>Deskripsi</Text>
|
||||
<KesehatanEditor
|
||||
showSubmit={false}
|
||||
/>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fw={"bold"} fz={"sm"}>Gambar</Text>
|
||||
<Image src={"/"} alt="gambar" />
|
||||
</Box>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Box>
|
||||
<Box>
|
||||
<Paper bg={colors['white-1']} p={"md"}>
|
||||
<Stack gap={"xs"}>
|
||||
<Title order={4}>Preview Data Info Wabah/Penyakit</Title>
|
||||
<Text fw={"bold"} fz={"sm"}>Nama Info Wabah/Penyakit</Text>
|
||||
<Text fw={"bold"} fz={"sm"}>Deskripsi Info Wabah/Penyakit</Text>
|
||||
<Text fw={"bold"} fz={"sm"}>Deskripsi</Text>
|
||||
<Text fw={"bold"} fz={"sm"}>Gambar</Text>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Box>
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default EditInfoWabahPenyakit;
|
||||
@@ -1,10 +1,13 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Image, Paper, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text } from '@mantine/core';
|
||||
import { Box, Button, Image, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text } from '@mantine/core';
|
||||
import { IconDeviceImacCog, IconSearch } from '@tabler/icons-react';
|
||||
import JudulList from '../../_com/judulList';
|
||||
import HeaderSearch from '../../_com/header';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import infoWabahPenyakit from '../../_state/kesehatan/info-wabah-penyakit/infoWabahPenyakit';
|
||||
import { useShallowEffect } from '@mantine/hooks';
|
||||
|
||||
function InfoWabahPenyakit() {
|
||||
return (
|
||||
@@ -20,7 +23,20 @@ function InfoWabahPenyakit() {
|
||||
}
|
||||
|
||||
function ListInfoWabahPenyakit() {
|
||||
const infoWabahPenyakitState = useProxy(infoWabahPenyakit)
|
||||
const router = useRouter()
|
||||
|
||||
useShallowEffect(() => {
|
||||
infoWabahPenyakitState.findMany.load()
|
||||
}, [])
|
||||
|
||||
if (!infoWabahPenyakitState.findMany.data) {
|
||||
return (
|
||||
<Box py={10}>
|
||||
<Skeleton h={500} />
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
return (
|
||||
<Box py={10}>
|
||||
<Paper bg={colors['white-1']} p={'md'}>
|
||||
@@ -34,27 +50,32 @@ function ListInfoWabahPenyakit() {
|
||||
<TableThead>
|
||||
<TableTr>
|
||||
<TableTh>Judul</TableTh>
|
||||
<TableTh>Kategori</TableTh>
|
||||
<TableTh>Deskripsi Singkat</TableTh>
|
||||
<TableTh>Image</TableTh>
|
||||
<TableTh>Detail</TableTh>
|
||||
</TableTr>
|
||||
</TableThead>
|
||||
<TableTbody>
|
||||
<TableTr>
|
||||
{infoWabahPenyakitState.findMany.data?.map((item) => (
|
||||
<TableTr key={item.id}>
|
||||
<TableTd>
|
||||
<Box w={100}>
|
||||
<Text truncate="end" fz={"sm"}>Test</Text>
|
||||
</Box></TableTd>
|
||||
<TableTd>Test</TableTd>
|
||||
<TableTd>
|
||||
<Image w={100} src={"/"} alt="image" />
|
||||
<Text truncate="end" fz={"sm"}>{item.name}</Text>
|
||||
</Box>
|
||||
</TableTd>
|
||||
<TableTd>
|
||||
<Button onClick={() => router.push('/admin/kesehatan/info-wabah-penyakit/detail')}>
|
||||
<Text truncate="end" fz={"sm"}>{item.deskripsiSingkat}</Text>
|
||||
</TableTd>
|
||||
<TableTd>
|
||||
<Image w={100} src={item.image?.link} alt="image" />
|
||||
</TableTd>
|
||||
<TableTd>
|
||||
<Button onClick={() => router.push(`/admin/kesehatan/info-wabah-penyakit/${item.id}`)}>
|
||||
<IconDeviceImacCog size={25} />
|
||||
</Button>
|
||||
</TableTd>
|
||||
</TableTr>
|
||||
))}
|
||||
</TableTbody>
|
||||
</Table>
|
||||
</Box>
|
||||
|
||||
@@ -0,0 +1,140 @@
|
||||
/* eslint-disable react-hooks/exhaustive-deps */
|
||||
'use client'
|
||||
import EditEditor from '@/app/admin/(dashboard)/_com/editEditor';
|
||||
import kontakDarurat from '@/app/admin/(dashboard)/_state/kesehatan/kontak-darurat/kontakDarurat';
|
||||
import colors from '@/con/colors';
|
||||
import ApiFetch from '@/lib/api-fetch';
|
||||
import { Box, Button, Center, FileInput, Image, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
|
||||
import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
|
||||
import { useParams, useRouter } from 'next/navigation';
|
||||
import { useEffect, useState } from 'react';
|
||||
import { toast } from 'react-toastify';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
|
||||
|
||||
|
||||
function EditKontakDarurat() {
|
||||
const kontakDaruratState = useProxy(kontakDarurat)
|
||||
const router = useRouter();
|
||||
const params = useParams()
|
||||
|
||||
const [previewImage, setPreviewImage] = useState<string | null>(null);
|
||||
const [file, setFile] = useState<File | null>(null);
|
||||
const [formData, setFormData] = useState({
|
||||
name: kontakDaruratState.edit.form.name || '',
|
||||
deskripsi: kontakDaruratState.edit.form.deskripsi || '',
|
||||
imageId: kontakDaruratState.edit.form.imageId || '',
|
||||
})
|
||||
|
||||
useEffect(() => {
|
||||
const loadProgramKesehatan = async () => {
|
||||
const id = params?.id as string;
|
||||
if (!id) return;
|
||||
|
||||
try {
|
||||
const data = await kontakDaruratState.edit.load(id);
|
||||
if (data) {
|
||||
setFormData({
|
||||
name: data.name || '',
|
||||
deskripsi: data.deskripsi || '',
|
||||
imageId: data.imageId || '',
|
||||
});
|
||||
|
||||
if (data?.image?.link) {
|
||||
setPreviewImage(data.image.link);
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error loading program kesehatan:", error);
|
||||
toast.error("Gagal memuat data program kesehatan");
|
||||
}
|
||||
};
|
||||
|
||||
loadProgramKesehatan();
|
||||
}, [params?.id]);
|
||||
|
||||
const handleSubmit = async () => {
|
||||
try {
|
||||
kontakDaruratState.edit.form = {
|
||||
...kontakDaruratState.edit.form,
|
||||
name: formData.name,
|
||||
deskripsi: formData.deskripsi,
|
||||
imageId: formData.imageId,
|
||||
};
|
||||
|
||||
if (file) {
|
||||
const res = await ApiFetch.api.fileStorage.create.post({ file, name: file.name });
|
||||
const uploaded = res.data?.data;
|
||||
|
||||
if (!uploaded?.id) {
|
||||
return toast.error("Gagal upload gambar");
|
||||
}
|
||||
|
||||
kontakDaruratState.edit.form.imageId = uploaded.id;
|
||||
}
|
||||
|
||||
await kontakDaruratState.edit.update();
|
||||
toast.success("Kontak darurat berhasil diperbarui!");
|
||||
router.push("/admin/kesehatan/kontak-darurat");
|
||||
} catch (error) {
|
||||
console.error("Error updating kontak darurat:", error);
|
||||
toast.error("Gagal memuat data kontak darurat");
|
||||
}
|
||||
}
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
<Button variant="subtle" onClick={() => router.back()}>
|
||||
<IconArrowBack color={colors['blue-button']} size={25} />
|
||||
</Button>
|
||||
</Box>
|
||||
<Stack gap={"xs"}>
|
||||
<Paper bg={colors['white-1']} p="md" w={{ base: '100%', md: '50%' }}>
|
||||
<Stack gap="xs">
|
||||
<Title order={3}>Edit Kontak Darurat</Title>
|
||||
<TextInput
|
||||
value={formData.name}
|
||||
onChange={(e) => setFormData({ ...formData, name: e.target.value })}
|
||||
label={<Text fz="sm" fw="bold">Judul</Text>}
|
||||
placeholder="masukkan judul"
|
||||
/>
|
||||
<Box>
|
||||
<Text fz="sm" fw="bold">Deskripsi</Text>
|
||||
<EditEditor
|
||||
value={formData.deskripsi}
|
||||
onChange={(val) => setFormData({ ...formData, deskripsi: val })}
|
||||
/>
|
||||
</Box>
|
||||
|
||||
<FileInput
|
||||
label={<Text fz="sm" fw="bold">Upload Gambar</Text>}
|
||||
value={file}
|
||||
onChange={async (e) => {
|
||||
if (!e) return;
|
||||
setFile(e);
|
||||
const base64 = await e.arrayBuffer().then((buf) =>
|
||||
'data:image/png;base64,' + Buffer.from(buf).toString('base64')
|
||||
);
|
||||
setPreviewImage(base64);
|
||||
}}
|
||||
/>
|
||||
|
||||
{previewImage ? (
|
||||
<Image alt="" src={previewImage} w={200} h={200} />
|
||||
) : (
|
||||
<Center w={200} h={200} bg="gray">
|
||||
<IconImageInPicture />
|
||||
</Center>
|
||||
)}
|
||||
|
||||
<Button onClick={handleSubmit} bg={colors['blue-button']}>
|
||||
Simpan
|
||||
</Button>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</Box >
|
||||
);
|
||||
}
|
||||
|
||||
export default EditKontakDarurat;
|
||||
@@ -0,0 +1,99 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Flex, Image, Paper, Skeleton, Stack, Text } from '@mantine/core';
|
||||
import { useShallowEffect } from '@mantine/hooks';
|
||||
import { IconArrowBack, IconEdit, IconX } from '@tabler/icons-react';
|
||||
import { useParams, useRouter } from 'next/navigation';
|
||||
import { useState } from 'react';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
|
||||
import kontakDarurat from '../../../_state/kesehatan/kontak-darurat/kontakDarurat';
|
||||
|
||||
function DetailKontakDarurat() {
|
||||
const kontakDaruratState = useProxy(kontakDarurat)
|
||||
const [modalHapus, setModalHapus] = useState(false)
|
||||
const [selectedId, setSelectedId] = useState<string | null>(null)
|
||||
const router = useRouter();
|
||||
const params = useParams()
|
||||
|
||||
useShallowEffect(() => {
|
||||
kontakDaruratState.findUnique.load(params?.id as string)
|
||||
}, [])
|
||||
|
||||
const handleHapus = () => {
|
||||
if (selectedId) {
|
||||
kontakDaruratState.delete.byId(selectedId)
|
||||
setModalHapus(false)
|
||||
setSelectedId(null)
|
||||
router.push("/admin/kesehatan/kontak-darurat")
|
||||
}
|
||||
}
|
||||
|
||||
if (!kontakDaruratState.findUnique.data) {
|
||||
return (
|
||||
<Stack py={10}>
|
||||
<Skeleton h={400} />
|
||||
</Stack>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
<Button variant="subtle" onClick={() => router.back()}>
|
||||
<IconArrowBack color={colors['blue-button']} size={25} />
|
||||
</Button>
|
||||
</Box>
|
||||
<Paper w={{ base: "100%", md: "50%" }} bg={colors['white-1']} p={'md'}>
|
||||
<Stack>
|
||||
<Text fz={"xl"} fw={"bold"}>Detail Kontak Darurat</Text>
|
||||
{kontakDaruratState.findUnique.data ? (
|
||||
<Paper bg={colors['BG-trans']} p={'md'}>
|
||||
<Stack gap={"xs"}>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Judul</Text>
|
||||
<Text fz={"lg"}>{kontakDaruratState.findUnique.data.name}</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Deskripsi</Text>
|
||||
<Text fz={"lg"} dangerouslySetInnerHTML={{ __html: kontakDaruratState.findUnique.data.deskripsi }} />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Gambar</Text>
|
||||
<Image src={kontakDaruratState.findUnique.data.image?.link} alt="gambar" />
|
||||
</Box>
|
||||
<Box>
|
||||
<Flex gap={"xs"}>
|
||||
<Button color="red" onClick={() => {
|
||||
if (kontakDaruratState.findUnique.data) {
|
||||
setSelectedId(kontakDaruratState.findUnique.data.id)
|
||||
setModalHapus(true)
|
||||
}
|
||||
}}
|
||||
disabled={kontakDaruratState.delete.loading || !kontakDaruratState.findUnique.data}
|
||||
>
|
||||
<IconX size={20} />
|
||||
</Button>
|
||||
<Button onClick={() => router.push(`/admin/kesehatan/kontak-darurat/${kontakDaruratState.findUnique.data?.id}/edit`)} color="green">
|
||||
<IconEdit size={20} />
|
||||
</Button>
|
||||
</Flex>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Paper>
|
||||
) : null}
|
||||
</Stack>
|
||||
</Paper>
|
||||
|
||||
{/* Modal Hapus */}
|
||||
<ModalKonfirmasiHapus
|
||||
opened={modalHapus}
|
||||
onClose={() => setModalHapus(false)}
|
||||
onConfirm={handleHapus}
|
||||
text="Apakah anda yakin ingin menghapus kontak darurat ini?"
|
||||
/>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default DetailKontakDarurat;
|
||||
@@ -1,12 +1,54 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
|
||||
import { IconArrowBack } from '@tabler/icons-react';
|
||||
import { Box, Button, Center, FileInput, Image, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
|
||||
import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { KesehatanEditor } from '../../_com/kesehatanEditor';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import kontakDarurat from '../../../_state/kesehatan/kontak-darurat/kontakDarurat';
|
||||
import { useState } from 'react';
|
||||
import { toast } from 'react-toastify';
|
||||
import ApiFetch from '@/lib/api-fetch';
|
||||
import CreateEditor from '../../../_com/createEditor';
|
||||
|
||||
|
||||
function CreateKontakDarurat() {
|
||||
const router = useRouter();
|
||||
const kontakDaruratState = useProxy(kontakDarurat)
|
||||
const [previewImage, setPreviewImage] = useState<string | null>(null);
|
||||
const [file, setFile] = useState<File | null>(null);
|
||||
|
||||
const resetForm = () => {
|
||||
kontakDaruratState.create.form = {
|
||||
name: "",
|
||||
deskripsi: "",
|
||||
imageId: "",
|
||||
};
|
||||
setPreviewImage(null);
|
||||
setFile(null);
|
||||
};
|
||||
|
||||
const handleSubmit = async () => {
|
||||
if (!file) {
|
||||
return toast.warn("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 upload gambar");
|
||||
}
|
||||
|
||||
kontakDaruratState.create.form.imageId = uploaded.id;
|
||||
|
||||
await kontakDaruratState.create.create();
|
||||
|
||||
resetForm();
|
||||
router.push("/admin/kesehatan/kontak-darurat")
|
||||
}
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
@@ -20,24 +62,25 @@ function CreateKontakDarurat() {
|
||||
<Title order={3}>Create Kontak Darurat</Title>
|
||||
|
||||
<TextInput
|
||||
|
||||
value={kontakDaruratState.create.form.name}
|
||||
onChange={(val) => {
|
||||
kontakDaruratState.create.form.name = val.target.value;
|
||||
}}
|
||||
label={<Text fz="sm" fw="bold">Judul</Text>}
|
||||
placeholder="masukkan judul"
|
||||
/>
|
||||
|
||||
<TextInput
|
||||
|
||||
label={<Text fz="sm" fw="bold">Deskripsi</Text>}
|
||||
placeholder="masukkan deskripsi"
|
||||
<Box>
|
||||
<Text fz="sm" fw="bold">Deskripsi</Text>
|
||||
<CreateEditor
|
||||
value={kontakDaruratState.create.form.deskripsi}
|
||||
onChange={(val) => {
|
||||
kontakDaruratState.create.form.deskripsi = val;
|
||||
}}
|
||||
/>
|
||||
</Box>
|
||||
|
||||
<TextInput
|
||||
|
||||
label={<Text fz="sm" fw="bold">Kategori</Text>}
|
||||
placeholder="masukkan kategori"
|
||||
/>
|
||||
|
||||
{/* <FileInput
|
||||
<FileInput
|
||||
label={<Text fz="sm" fw="bold">Upload Gambar</Text>}
|
||||
value={file}
|
||||
onChange={async (e) => {
|
||||
@@ -48,25 +91,18 @@ function CreateKontakDarurat() {
|
||||
);
|
||||
setPreviewImage(base64);
|
||||
}}
|
||||
/> */}
|
||||
/>
|
||||
|
||||
{/* {previewImage ? (
|
||||
{previewImage ? (
|
||||
<Image alt="" src={previewImage} w={200} h={200} />
|
||||
) : (
|
||||
<Center w={200} h={200} bg="gray">
|
||||
<IconImageInPicture />
|
||||
</Center>
|
||||
)} */}
|
||||
)}
|
||||
|
||||
<Box>
|
||||
<Text fz="sm" fw="bold">Konten</Text>
|
||||
<KesehatanEditor
|
||||
showSubmit={false}
|
||||
/>
|
||||
</Box>
|
||||
|
||||
<Button bg={colors['blue-button']}>
|
||||
Simpan Potensi
|
||||
<Button onClick={handleSubmit} bg={colors['blue-button']}>
|
||||
Simpan
|
||||
</Button>
|
||||
</Stack>
|
||||
</Paper>
|
||||
|
||||
@@ -1,70 +0,0 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Paper, Stack, Flex, Text, Image } from '@mantine/core';
|
||||
import { IconArrowBack, IconX, IconEdit } from '@tabler/icons-react';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import React from 'react';
|
||||
// import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
|
||||
|
||||
function DetailKontakDarurat() {
|
||||
const router = useRouter();
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
<Button variant="subtle" onClick={() => router.back()}>
|
||||
<IconArrowBack color={colors['blue-button']} size={25} />
|
||||
</Button>
|
||||
</Box>
|
||||
<Paper w={{ base: "100%", md: "50%" }} bg={colors['white-1']} p={'md'}>
|
||||
<Stack>
|
||||
<Text fz={"xl"} fw={"bold"}>Detail Kontak Darurat</Text>
|
||||
|
||||
<Paper bg={colors['BG-trans']} p={'md'}>
|
||||
<Stack gap={"xs"}>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Nama Kontak Darurat</Text>
|
||||
<Text fz={"lg"}>Test Judul</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Deskripsi Kontak Darurat</Text>
|
||||
<Text fz={"lg"}>Test Kategori</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Deskripsi</Text>
|
||||
<Text fz={"lg"}>Test Deskripsi</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Gambar</Text>
|
||||
<Image src={"/"} alt="gambar" />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Konten</Text>
|
||||
<Text fz={"lg"} >Test Konten</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Flex gap={"xs"}>
|
||||
<Button color="red">
|
||||
<IconX size={20} />
|
||||
</Button>
|
||||
<Button onClick={() => router.push('/admin/kesehatan/kontak-darurat/edit')} color="green">
|
||||
<IconEdit size={20} />
|
||||
</Button>
|
||||
</Flex>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</Paper>
|
||||
|
||||
{/* Modal Hapus
|
||||
<ModalKonfirmasiHapus
|
||||
opened={modalHapus}
|
||||
onClose={() => setModalHapus(false)}
|
||||
onConfirm={handleHapus}
|
||||
text="Apakah anda yakin ingin menghapus penanganan darurat ini?"
|
||||
/> */}
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default DetailKontakDarurat;
|
||||
@@ -1,62 +0,0 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Stack, SimpleGrid, Paper, Title, TextInput, Text, Button, Image } from '@mantine/core';
|
||||
import { KesehatanEditor } from '../../_com/kesehatanEditor';
|
||||
import { IconArrowBack } from '@tabler/icons-react';
|
||||
import { useRouter } from 'next/navigation';
|
||||
|
||||
|
||||
function EditKontakDarurat() {
|
||||
const router = useRouter();
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
<Button variant="subtle" onClick={() => router.back()}>
|
||||
<IconArrowBack color={colors['blue-button']} size={25} />
|
||||
</Button>
|
||||
</Box>
|
||||
<Stack gap={"xs"}>
|
||||
<SimpleGrid cols={{ base: 1, md: 2 }}>
|
||||
<Box>
|
||||
<Paper bg={colors['white-1']} p={"md"}>
|
||||
<Stack gap={"xs"}>
|
||||
<Title order={3}>Edit Kontak Darurat</Title>
|
||||
<TextInput
|
||||
label={<Text fw={"bold"} fz={"sm"}>Nama Kontak Darurat</Text>}
|
||||
placeholder='Masukkan nama Kontak Darurat'
|
||||
/>
|
||||
<TextInput
|
||||
label={<Text fw={"bold"} fz={"sm"}>Deskripsi Kontak Darurat</Text>}
|
||||
placeholder='Masukkan deskripsi Kontak Darurat'
|
||||
/>
|
||||
<Box>
|
||||
<Text fw={"bold"} fz={"sm"}>Deskripsi</Text>
|
||||
<KesehatanEditor
|
||||
showSubmit={false}
|
||||
/>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fw={"bold"} fz={"sm"}>Gambar</Text>
|
||||
<Image src={"/"} alt="gambar" />
|
||||
</Box>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Box>
|
||||
<Box>
|
||||
<Paper bg={colors['white-1']} p={"md"}>
|
||||
<Stack gap={"xs"}>
|
||||
<Title order={4}>Preview Data Kontak Darurat</Title>
|
||||
<Text fw={"bold"} fz={"sm"}>Nama Kontak Darurat</Text>
|
||||
<Text fw={"bold"} fz={"sm"}>Deskripsi Kontak Darurat</Text>
|
||||
<Text fw={"bold"} fz={"sm"}>Deskripsi</Text>
|
||||
<Text fw={"bold"} fz={"sm"}>Gambar</Text>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Box>
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default EditKontakDarurat;
|
||||
@@ -1,10 +1,13 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Image, Paper, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text } from '@mantine/core';
|
||||
import { Box, Button, Image, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text } from '@mantine/core';
|
||||
import { IconDeviceImacCog, IconSearch } from '@tabler/icons-react';
|
||||
import JudulList from '../../_com/judulList';
|
||||
import HeaderSearch from '../../_com/header';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import kontakDarurat from '../../_state/kesehatan/kontak-darurat/kontakDarurat';
|
||||
import { useShallowEffect } from '@mantine/hooks';
|
||||
|
||||
function KontakDarurat() {
|
||||
return (
|
||||
@@ -20,7 +23,21 @@ function KontakDarurat() {
|
||||
}
|
||||
|
||||
function ListKontakDarurat() {
|
||||
const kontakDaruratState = useProxy(kontakDarurat)
|
||||
const router = useRouter();
|
||||
|
||||
useShallowEffect(() => {
|
||||
kontakDaruratState.findMany.load()
|
||||
}, [])
|
||||
|
||||
if (!kontakDaruratState.findMany.data) {
|
||||
return (
|
||||
<Box py={10}>
|
||||
<Skeleton h={500} />
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<Box py={10}>
|
||||
<Paper bg={colors['white-1']} p={'md'}>
|
||||
@@ -34,27 +51,32 @@ function ListKontakDarurat() {
|
||||
<TableThead>
|
||||
<TableTr>
|
||||
<TableTh>Judul</TableTh>
|
||||
<TableTh>Kategori</TableTh>
|
||||
<TableTh>Deskripsi</TableTh>
|
||||
<TableTh>Image</TableTh>
|
||||
<TableTh>Detail</TableTh>
|
||||
</TableTr>
|
||||
</TableThead>
|
||||
<TableTbody>
|
||||
<TableTr>
|
||||
{kontakDaruratState.findMany.data?.map((item) => (
|
||||
<TableTr key={item.id}>
|
||||
<TableTd>
|
||||
<Box w={100}>
|
||||
<Text truncate="end" fz={"sm"}>Test</Text>
|
||||
</Box></TableTd>
|
||||
<TableTd>Test</TableTd>
|
||||
<TableTd>
|
||||
<Image w={100} src={"/"} alt="image" />
|
||||
<Text truncate="end" fz={"sm"}>{item.name}</Text>
|
||||
</Box>
|
||||
</TableTd>
|
||||
<TableTd>
|
||||
<Button onClick={() => router.push('/admin/kesehatan/kontak-darurat/detail')}>
|
||||
<Text truncate="end" fz={"sm"} dangerouslySetInnerHTML={{ __html: item.deskripsi }} />
|
||||
</TableTd>
|
||||
<TableTd>
|
||||
<Image w={100} src={item.image?.link} alt="image" />
|
||||
</TableTd>
|
||||
<TableTd>
|
||||
<Button onClick={() => router.push(`/admin/kesehatan/kontak-darurat/${item.id}`)}>
|
||||
<IconDeviceImacCog size={25} />
|
||||
</Button>
|
||||
</TableTd>
|
||||
</TableTr>
|
||||
))}
|
||||
</TableTbody>
|
||||
</Table>
|
||||
</Box>
|
||||
|
||||
@@ -0,0 +1,140 @@
|
||||
/* eslint-disable react-hooks/exhaustive-deps */
|
||||
'use client'
|
||||
import EditEditor from '@/app/admin/(dashboard)/_com/editEditor';
|
||||
import penangananDarurat from '@/app/admin/(dashboard)/_state/kesehatan/penanganan-darurat/penangananDarurat';
|
||||
import colors from '@/con/colors';
|
||||
import ApiFetch from '@/lib/api-fetch';
|
||||
import { Box, Button, Center, FileInput, Image, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
|
||||
import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
|
||||
import { useParams, useRouter } from 'next/navigation';
|
||||
import { useEffect, useState } from 'react';
|
||||
import { toast } from 'react-toastify';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
|
||||
function EditPenangananDarurat() {
|
||||
const penangananDaruratState = useProxy(penangananDarurat)
|
||||
const router = useRouter();
|
||||
const params = useParams()
|
||||
|
||||
const [previewImage, setPreviewImage] = useState<string | null>(null);
|
||||
const [file, setFile] = useState<File | null>(null);
|
||||
const [formData, setFormData] = useState({
|
||||
name: penangananDaruratState.edit.form.name || '',
|
||||
deskripsi: penangananDaruratState.edit.form.deskripsi || '',
|
||||
imageId: penangananDaruratState.edit.form.imageId || '',
|
||||
})
|
||||
|
||||
useEffect(() => {
|
||||
const loadPenangananDarurat = async () => {
|
||||
const id = params?.id as string;
|
||||
if (!id) return;
|
||||
|
||||
try {
|
||||
const data = await penangananDaruratState.edit.load(id);
|
||||
if (data) {
|
||||
setFormData({
|
||||
name: data.name || '',
|
||||
deskripsi: data.deskripsi || '',
|
||||
imageId: data.imageId || '',
|
||||
})
|
||||
|
||||
if (data?.image?.link) {
|
||||
setPreviewImage(data.image.link);
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Error loading penanganan darurat:', error);
|
||||
toast.error('Gagal memuat data penanganan darurat');
|
||||
}
|
||||
}
|
||||
|
||||
loadPenangananDarurat();
|
||||
}, [params?.id])
|
||||
|
||||
const handleSubmit = async () => {
|
||||
try {
|
||||
penangananDaruratState.edit.form = {
|
||||
...penangananDaruratState.edit.form,
|
||||
name: formData.name,
|
||||
deskripsi: formData.deskripsi,
|
||||
imageId: formData.imageId,
|
||||
}
|
||||
|
||||
if (file) {
|
||||
const res = await ApiFetch.api.fileStorage.create.post({ file, name: file.name });
|
||||
const uploaded = res.data?.data;
|
||||
|
||||
if (!uploaded?.id) {
|
||||
return toast.error("Gagal upload gambar");
|
||||
}
|
||||
|
||||
penangananDaruratState.edit.form.imageId = uploaded.id;
|
||||
}
|
||||
|
||||
await penangananDaruratState.edit.update();
|
||||
toast.success("Penanganan darurat berhasil diperbarui!");
|
||||
router.push("/admin/kesehatan/penanganan-darurat");
|
||||
} catch (error) {
|
||||
console.error("Error updating penanganan darurat:", error);
|
||||
toast.error("Gagal memuat data penanganan darurat");
|
||||
}
|
||||
}
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
<Button variant="subtle" onClick={() => router.back()}>
|
||||
<IconArrowBack color={colors['blue-button']} size={25} />
|
||||
</Button>
|
||||
</Box>
|
||||
<Stack gap={"xs"}>
|
||||
<Paper bg={colors['white-1']} p={"md"} w={{ base: '100%', md: '50%' }}>
|
||||
<Stack gap="xs">
|
||||
<Title order={3}>Edit Penanganan Darurat</Title>
|
||||
|
||||
<TextInput
|
||||
value={formData.name}
|
||||
onChange={(e) => setFormData({ ...formData, name: e.target.value })}
|
||||
label={<Text fz="sm" fw="bold">Judul</Text>}
|
||||
placeholder="masukkan judul"
|
||||
/>
|
||||
|
||||
<Box>
|
||||
<Text fz="sm" fw="bold">Deskripsi</Text>
|
||||
<EditEditor
|
||||
value={formData.deskripsi}
|
||||
onChange={(val) => setFormData({ ...formData, deskripsi: val })}
|
||||
/>
|
||||
</Box>
|
||||
|
||||
<FileInput
|
||||
label={<Text fz="sm" fw="bold">Upload Gambar</Text>}
|
||||
value={file}
|
||||
onChange={async (e) => {
|
||||
if (!e) return;
|
||||
setFile(e);
|
||||
const base64 = await e.arrayBuffer().then((buf) =>
|
||||
'data:image/png;base64,' + Buffer.from(buf).toString('base64')
|
||||
);
|
||||
setPreviewImage(base64);
|
||||
}}
|
||||
/>
|
||||
|
||||
{previewImage ? (
|
||||
<Image alt="" src={previewImage} w={200} h={200} />
|
||||
) : (
|
||||
<Center w={200} h={200} bg="gray">
|
||||
<IconImageInPicture />
|
||||
</Center>
|
||||
)}
|
||||
|
||||
<Button onClick={handleSubmit} bg={colors['blue-button']}>
|
||||
Simpan
|
||||
</Button>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Stack >
|
||||
</Box >
|
||||
);
|
||||
}
|
||||
|
||||
export default EditPenangananDarurat;
|
||||
@@ -0,0 +1,101 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Paper, Stack, Flex, Text, Image } from '@mantine/core';
|
||||
import { IconArrowBack, IconX, IconEdit } from '@tabler/icons-react';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import React, { useState } from 'react';
|
||||
// import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
|
||||
import penangananDarurat from '../../../_state/kesehatan/penanganan-darurat/penangananDarurat';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import { useShallowEffect } from '@mantine/hooks';
|
||||
import { useParams } from 'next/navigation';
|
||||
import { Skeleton } from '@mantine/core';
|
||||
import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
|
||||
|
||||
function DetailPenangananDarurat() {
|
||||
const penangananDaruratState = useProxy(penangananDarurat)
|
||||
const [modalHapus, setModalHapus] = useState(false)
|
||||
const [selectedId, setSelectedId] = useState<string | null>(null)
|
||||
const router = useRouter();
|
||||
const params = useParams()
|
||||
|
||||
useShallowEffect(() => {
|
||||
penangananDaruratState.findUnique.load(params?.id as string)
|
||||
}, [])
|
||||
|
||||
const handleHapus = () => {
|
||||
if (selectedId) {
|
||||
penangananDaruratState.delete.byId(selectedId)
|
||||
setModalHapus(false)
|
||||
setSelectedId(null)
|
||||
router.push("/admin/kesehatan/penanganan-darurat")
|
||||
}
|
||||
}
|
||||
|
||||
if (!penangananDaruratState.findUnique.data) {
|
||||
return (
|
||||
<Box py={10}>
|
||||
<Skeleton h={500} />
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
<Button variant="subtle" onClick={() => router.back()}>
|
||||
<IconArrowBack color={colors['blue-button']} size={25} />
|
||||
</Button>
|
||||
</Box>
|
||||
<Paper w={{ base: "100%", md: "50%" }} bg={colors['white-1']} p={'md'}>
|
||||
<Stack>
|
||||
<Text fz={"xl"} fw={"bold"}>Detail Penanganan Darurat</Text>
|
||||
{penangananDaruratState.findUnique.data ? (
|
||||
<Paper bg={colors['BG-trans']} p={'md'}>
|
||||
<Stack gap={"xs"}>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Nama Penanganan Darurat</Text>
|
||||
<Text fz={"lg"}>{penangananDaruratState.findUnique.data.name}</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Deskripsi</Text>
|
||||
<Text fz={"lg"} dangerouslySetInnerHTML={{ __html: penangananDaruratState.findUnique.data.deskripsi }} />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Gambar</Text>
|
||||
<Image src={penangananDaruratState.findUnique.data.image?.link} alt="gambar" />
|
||||
</Box>
|
||||
<Box>
|
||||
<Flex gap={"xs"}>
|
||||
<Button color="red" onClick={() => {
|
||||
if (penangananDaruratState.findUnique.data) {
|
||||
setSelectedId(penangananDaruratState.findUnique.data.id)
|
||||
setModalHapus(true)
|
||||
}
|
||||
}}
|
||||
disabled={penangananDaruratState.delete.loading || !penangananDaruratState.findUnique.data}>
|
||||
<IconX size={20} />
|
||||
</Button>
|
||||
<Button onClick={() => router.push(`/admin/kesehatan/penanganan-darurat/${penangananDaruratState.findUnique.data?.id}/edit`)} color="green">
|
||||
<IconEdit size={20} />
|
||||
</Button>
|
||||
</Flex>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Paper>
|
||||
) : null}
|
||||
</Stack>
|
||||
</Paper>
|
||||
|
||||
{/* Modal Hapus */}
|
||||
<ModalKonfirmasiHapus
|
||||
opened={modalHapus}
|
||||
onClose={() => setModalHapus(false)}
|
||||
onConfirm={handleHapus}
|
||||
text="Apakah anda yakin ingin menghapus penanganan darurat ini?"
|
||||
/>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default DetailPenangananDarurat;
|
||||
@@ -1,12 +1,54 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
|
||||
import { IconArrowBack } from '@tabler/icons-react';
|
||||
import ApiFetch from '@/lib/api-fetch';
|
||||
import { Box, Button, Center, FileInput, Image, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
|
||||
import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { KesehatanEditor } from '../../_com/kesehatanEditor';
|
||||
import { useState } from 'react';
|
||||
import { toast } from 'react-toastify';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import CreateEditor from '../../../_com/createEditor';
|
||||
import penangananDarurat from '../../../_state/kesehatan/penanganan-darurat/penangananDarurat';
|
||||
|
||||
|
||||
function CreatePenangananDarurat() {
|
||||
const router = useRouter();
|
||||
const penangananDaruratState = useProxy(penangananDarurat)
|
||||
const [previewImage, setPreviewImage] = useState<string | null>(null);
|
||||
const [file, setFile] = useState<File | null>(null);
|
||||
|
||||
const resetForm = () => {
|
||||
penangananDaruratState.create.form = {
|
||||
name: "",
|
||||
deskripsi: "",
|
||||
imageId: "",
|
||||
};
|
||||
setPreviewImage(null);
|
||||
setFile(null);
|
||||
};
|
||||
|
||||
const handleSubmit = async () => {
|
||||
if (!file) {
|
||||
return toast.warn("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 upload gambar");
|
||||
}
|
||||
|
||||
penangananDaruratState.create.form.imageId = uploaded.id;
|
||||
|
||||
await penangananDaruratState.create.create();
|
||||
|
||||
resetForm();
|
||||
router.push("/admin/kesehatan/penanganan-darurat")
|
||||
}
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
@@ -20,24 +62,25 @@ function CreatePenangananDarurat() {
|
||||
<Title order={3}>Create Penanganan Darurat</Title>
|
||||
|
||||
<TextInput
|
||||
|
||||
value={penangananDaruratState.create.form.name}
|
||||
onChange={(val) => {
|
||||
penangananDaruratState.create.form.name = val.target.value;
|
||||
}}
|
||||
label={<Text fz="sm" fw="bold">Judul</Text>}
|
||||
placeholder="masukkan judul"
|
||||
/>
|
||||
|
||||
<TextInput
|
||||
|
||||
label={<Text fz="sm" fw="bold">Deskripsi</Text>}
|
||||
placeholder="masukkan deskripsi"
|
||||
<Box>
|
||||
<Text fz="sm" fw="bold">Deskripsi</Text>
|
||||
<CreateEditor
|
||||
value={penangananDaruratState.create.form.deskripsi}
|
||||
onChange={(val) => {
|
||||
penangananDaruratState.create.form.deskripsi = val;
|
||||
}}
|
||||
/>
|
||||
</Box>
|
||||
|
||||
<TextInput
|
||||
|
||||
label={<Text fz="sm" fw="bold">Kategori</Text>}
|
||||
placeholder="masukkan kategori"
|
||||
/>
|
||||
|
||||
{/* <FileInput
|
||||
<FileInput
|
||||
label={<Text fz="sm" fw="bold">Upload Gambar</Text>}
|
||||
value={file}
|
||||
onChange={async (e) => {
|
||||
@@ -48,25 +91,18 @@ function CreatePenangananDarurat() {
|
||||
);
|
||||
setPreviewImage(base64);
|
||||
}}
|
||||
/> */}
|
||||
/>
|
||||
|
||||
{/* {previewImage ? (
|
||||
{previewImage ? (
|
||||
<Image alt="" src={previewImage} w={200} h={200} />
|
||||
) : (
|
||||
<Center w={200} h={200} bg="gray">
|
||||
<IconImageInPicture />
|
||||
</Center>
|
||||
)} */}
|
||||
)}
|
||||
|
||||
<Box>
|
||||
<Text fz="sm" fw="bold">Konten</Text>
|
||||
<KesehatanEditor
|
||||
showSubmit={false}
|
||||
/>
|
||||
</Box>
|
||||
|
||||
<Button bg={colors['blue-button']}>
|
||||
Simpan Potensi
|
||||
<Button onClick={handleSubmit} bg={colors['blue-button']}>
|
||||
Simpan
|
||||
</Button>
|
||||
</Stack>
|
||||
</Paper>
|
||||
|
||||
@@ -1,70 +0,0 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Paper, Stack, Flex, Text, Image } from '@mantine/core';
|
||||
import { IconArrowBack, IconX, IconEdit } from '@tabler/icons-react';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import React from 'react';
|
||||
// import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
|
||||
|
||||
function DetailPenangananDarurat() {
|
||||
const router = useRouter();
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
<Button variant="subtle" onClick={() => router.back()}>
|
||||
<IconArrowBack color={colors['blue-button']} size={25} />
|
||||
</Button>
|
||||
</Box>
|
||||
<Paper w={{ base: "100%", md: "50%" }} bg={colors['white-1']} p={'md'}>
|
||||
<Stack>
|
||||
<Text fz={"xl"} fw={"bold"}>Detail Penanganan Darurat</Text>
|
||||
|
||||
<Paper bg={colors['BG-trans']} p={'md'}>
|
||||
<Stack gap={"xs"}>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Nama Penanganan Darurat</Text>
|
||||
<Text fz={"lg"}>Test Judul</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Deskripsi Penanganan Darurat</Text>
|
||||
<Text fz={"lg"}>Test Kategori</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Deskripsi</Text>
|
||||
<Text fz={"lg"}>Test Deskripsi</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Gambar</Text>
|
||||
<Image src={"/"} alt="gambar" />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Konten</Text>
|
||||
<Text fz={"lg"} >Test Konten</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Flex gap={"xs"}>
|
||||
<Button color="red">
|
||||
<IconX size={20} />
|
||||
</Button>
|
||||
<Button onClick={() => router.push('/admin/kesehatan/penanganan-darurat/edit')} color="green">
|
||||
<IconEdit size={20} />
|
||||
</Button>
|
||||
</Flex>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</Paper>
|
||||
|
||||
{/* Modal Hapus
|
||||
<ModalKonfirmasiHapus
|
||||
opened={modalHapus}
|
||||
onClose={() => setModalHapus(false)}
|
||||
onConfirm={handleHapus}
|
||||
text="Apakah anda yakin ingin menghapus penanganan darurat ini?"
|
||||
/> */}
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default DetailPenangananDarurat;
|
||||
@@ -1,62 +0,0 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Stack, SimpleGrid, Paper, Title, TextInput, Text, Button, Image } from '@mantine/core';
|
||||
import { KesehatanEditor } from '../../_com/kesehatanEditor';
|
||||
import { IconArrowBack } from '@tabler/icons-react';
|
||||
import { useRouter } from 'next/navigation';
|
||||
|
||||
|
||||
function EditPenangananDarurat() {
|
||||
const router = useRouter();
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
<Button variant="subtle" onClick={() => router.back()}>
|
||||
<IconArrowBack color={colors['blue-button']} size={25} />
|
||||
</Button>
|
||||
</Box>
|
||||
<Stack gap={"xs"}>
|
||||
<SimpleGrid cols={{ base: 1, md: 2 }}>
|
||||
<Box>
|
||||
<Paper bg={colors['white-1']} p={"md"}>
|
||||
<Stack gap={"xs"}>
|
||||
<Title order={3}>Edit Penanganan Darurat</Title>
|
||||
<TextInput
|
||||
label={<Text fw={"bold"} fz={"sm"}>Nama Penanganan Darurat</Text>}
|
||||
placeholder='Masukkan nama Penanganan Darurat'
|
||||
/>
|
||||
<TextInput
|
||||
label={<Text fw={"bold"} fz={"sm"}>Deskripsi Penanganan Darurat</Text>}
|
||||
placeholder='Masukkan deskripsi Penanganan Darurat'
|
||||
/>
|
||||
<Box>
|
||||
<Text fw={"bold"} fz={"sm"}>Deskripsi</Text>
|
||||
<KesehatanEditor
|
||||
showSubmit={false}
|
||||
/>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fw={"bold"} fz={"sm"}>Gambar</Text>
|
||||
<Image src={"/"} alt="gambar" />
|
||||
</Box>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Box>
|
||||
<Box>
|
||||
<Paper bg={colors['white-1']} p={"md"}>
|
||||
<Stack gap={"xs"}>
|
||||
<Title order={4}>Preview Data Penanganan Darurat</Title>
|
||||
<Text fw={"bold"} fz={"sm"}>Nama Penanganan Darurat</Text>
|
||||
<Text fw={"bold"} fz={"sm"}>No Telp Penanganan Darurat</Text>
|
||||
<Text fw={"bold"} fz={"sm"}>Deskripsi</Text>
|
||||
<Text fw={"bold"} fz={"sm"}>Pelayanan Posyandu</Text>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Box>
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default EditPenangananDarurat;
|
||||
@@ -1,10 +1,14 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Image, Paper, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text } from '@mantine/core';
|
||||
import { Box, Button, Image, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text } from '@mantine/core';
|
||||
import { IconDeviceImacCog, IconSearch } from '@tabler/icons-react';
|
||||
import JudulList from '../../_com/judulList';
|
||||
import HeaderSearch from '../../_com/header';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import { useShallowEffect } from '@mantine/hooks';
|
||||
import penangananDarurat from '../../_state/kesehatan/penanganan-darurat/penangananDarurat';
|
||||
|
||||
|
||||
function PenangananDarurat() {
|
||||
return (
|
||||
@@ -20,7 +24,21 @@ function PenangananDarurat() {
|
||||
}
|
||||
|
||||
function ListPenangananDarurat() {
|
||||
const penangananDaruratState = useProxy(penangananDarurat)
|
||||
const router = useRouter();
|
||||
|
||||
useShallowEffect(() => {
|
||||
penangananDaruratState.findMany.load()
|
||||
}, [])
|
||||
|
||||
if (!penangananDaruratState.findMany.data) {
|
||||
return (
|
||||
<Box py={10}>
|
||||
<Skeleton h={500} />
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<Box py={10}>
|
||||
<Paper bg={colors['white-1']} p={'md'}>
|
||||
@@ -34,27 +52,31 @@ function ListPenangananDarurat() {
|
||||
<TableThead>
|
||||
<TableTr>
|
||||
<TableTh>Judul</TableTh>
|
||||
<TableTh>Kategori</TableTh>
|
||||
<TableTh>Deskripsi</TableTh>
|
||||
<TableTh>Image</TableTh>
|
||||
<TableTh>Detail</TableTh>
|
||||
</TableTr>
|
||||
</TableThead>
|
||||
<TableTbody>
|
||||
<TableTr>
|
||||
{penangananDaruratState.findMany.data?.map((item) => (
|
||||
<TableTr key={item.id}>
|
||||
<TableTd>
|
||||
<Box w={100}>
|
||||
<Text truncate="end" fz={"sm"}>Test</Text>
|
||||
<Text truncate="end" fz={"sm"}>{item.name}</Text>
|
||||
</Box></TableTd>
|
||||
<TableTd>Test</TableTd>
|
||||
<TableTd>
|
||||
<Image w={100} src={"/"} alt="image" />
|
||||
<Text truncate="end" fz={"sm"} dangerouslySetInnerHTML={{ __html: item.deskripsi }} />
|
||||
</TableTd>
|
||||
<TableTd>
|
||||
<Button onClick={() => router.push('/admin/kesehatan/penanganan-darurat/detail')}>
|
||||
<Image w={100} src={item.image?.link} alt="image" />
|
||||
</TableTd>
|
||||
<TableTd>
|
||||
<Button onClick={() => router.push(`/admin/kesehatan/penanganan-darurat/${item.id}`)}>
|
||||
<IconDeviceImacCog size={25} />
|
||||
</Button>
|
||||
</TableTd>
|
||||
</TableTr>
|
||||
))}
|
||||
</TableTbody>
|
||||
</Table>
|
||||
</Box>
|
||||
|
||||
147
src/app/admin/(dashboard)/kesehatan/posyandu/[id]/edit/page.tsx
Normal file
147
src/app/admin/(dashboard)/kesehatan/posyandu/[id]/edit/page.tsx
Normal file
@@ -0,0 +1,147 @@
|
||||
/* eslint-disable react-hooks/exhaustive-deps */
|
||||
'use client'
|
||||
import EditEditor from '@/app/admin/(dashboard)/_com/editEditor';
|
||||
import posyandustate from '@/app/admin/(dashboard)/_state/kesehatan/posyandu/posyandu';
|
||||
import colors from '@/con/colors';
|
||||
import ApiFetch from '@/lib/api-fetch';
|
||||
import { Box, Button, Center, FileInput, Group, Image, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
|
||||
import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
|
||||
import { useParams, useRouter } from 'next/navigation';
|
||||
import { useEffect, useState } from 'react';
|
||||
import { toast } from 'react-toastify';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
|
||||
|
||||
function EditPosyandu() {
|
||||
const statePosyandu = useProxy(posyandustate)
|
||||
const router = useRouter();
|
||||
const params = useParams()
|
||||
|
||||
const [previewImage, setPreviewImage] = useState<string | null>(null);
|
||||
const [file, setFile] = useState<File | null>(null);
|
||||
const [formData, setFormData] = useState({
|
||||
name: statePosyandu.edit.form.name || '',
|
||||
nomor: statePosyandu.edit.form.nomor || '',
|
||||
deskripsi: statePosyandu.edit.form.deskripsi || '',
|
||||
imageId: statePosyandu.edit.form.imageId || '',
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
const loadPosyandu = async () => {
|
||||
const id = params?.id as string;
|
||||
if (!id) return;
|
||||
|
||||
try {
|
||||
const data = await statePosyandu.edit.load(id);
|
||||
if (data) {
|
||||
setFormData({
|
||||
name: data.name || '',
|
||||
nomor: data.nomor || '',
|
||||
deskripsi: data.deskripsi || '',
|
||||
imageId: data.imageId || '',
|
||||
});
|
||||
|
||||
if (data?.image?.link) {
|
||||
setPreviewImage(data.image.link);
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error loading posyandu:", error);
|
||||
toast.error("Gagal memuat data posyandu");
|
||||
}
|
||||
}
|
||||
loadPosyandu();
|
||||
}, [params?.id])
|
||||
|
||||
const handleSubmit = async () => {
|
||||
try {
|
||||
statePosyandu.edit.form = {
|
||||
...statePosyandu.edit.form,
|
||||
name: formData.name,
|
||||
nomor: formData.nomor,
|
||||
deskripsi: formData.deskripsi,
|
||||
imageId: formData.imageId,
|
||||
}
|
||||
|
||||
if (file) {
|
||||
const res = await ApiFetch.api.fileStorage.create.post({ file, name: file.name });
|
||||
const uploaded = res.data?.data;
|
||||
|
||||
if (!uploaded?.id) {
|
||||
return toast.error("Gagal upload gambar");
|
||||
}
|
||||
|
||||
statePosyandu.edit.form.imageId = uploaded.id;
|
||||
}
|
||||
|
||||
await statePosyandu.edit.update();
|
||||
toast.success("Posyandu berhasil diperbarui!");
|
||||
router.push("/admin/kesehatan/posyandu");
|
||||
} catch (error) {
|
||||
console.error("Error updating posyandu:", error);
|
||||
toast.error("Gagal memuat data posyandu");
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
<Button onClick={() => router.back()} variant='subtle' color={'blue'}>
|
||||
<IconArrowBack color={colors['blue-button']} size={25} />
|
||||
</Button>
|
||||
</Box>
|
||||
|
||||
<Paper w={{ base: '100%', md: '50%' }} bg={colors['white-1']} p={'md'}>
|
||||
<Stack gap={"xs"}>
|
||||
<Title order={4}>Edit Posyandu</Title>
|
||||
{previewImage ? (
|
||||
<Image alt="" src={previewImage} w={200} h={200} />
|
||||
) : (
|
||||
<Center w={200} h={200} bg={"gray"}>
|
||||
<IconImageInPicture />
|
||||
</Center>
|
||||
)}
|
||||
<FileInput
|
||||
label={<Text fz={"sm"} fw={"bold"}>Upload Gambar</Text>}
|
||||
value={file}
|
||||
onChange={async (e) => {
|
||||
if (!e) return;
|
||||
setFile(e);
|
||||
const base64 = await e.arrayBuffer().then((buf) =>
|
||||
"data:image/png;base64," + Buffer.from(buf).toString("base64")
|
||||
);
|
||||
setPreviewImage(base64);
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
value={formData.name}
|
||||
onChange={(e) => setFormData({ ...formData, name: e.target.value })}
|
||||
label={<Text fw={"bold"} fz={"sm"}>Nama Posyandu</Text>}
|
||||
placeholder='Masukkan nama posyandu'
|
||||
/>
|
||||
<TextInput
|
||||
value={formData.nomor}
|
||||
onChange={(e) => setFormData({ ...formData, nomor: e.target.value })}
|
||||
label={<Text fw={"bold"} fz={"sm"}>Nomor Posyandu</Text>}
|
||||
placeholder='Masukkan nomor posyandu'
|
||||
/>
|
||||
<Box>
|
||||
<Text fw={"bold"} fz={"sm"}>Deskripsi Posyandu</Text>
|
||||
<EditEditor
|
||||
value={formData.deskripsi}
|
||||
onChange={(htmlContent) => {
|
||||
setFormData({ ...formData, deskripsi: htmlContent });
|
||||
statePosyandu.edit.form.deskripsi = htmlContent;
|
||||
}}
|
||||
/>
|
||||
</Box>
|
||||
<Group>
|
||||
<Button onClick={handleSubmit} bg={colors['blue-button']}>Submit</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default EditPosyandu;
|
||||
101
src/app/admin/(dashboard)/kesehatan/posyandu/[id]/page.tsx
Normal file
101
src/app/admin/(dashboard)/kesehatan/posyandu/[id]/page.tsx
Normal file
@@ -0,0 +1,101 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Paper, Stack, Flex, Text, Image, Skeleton } from '@mantine/core';
|
||||
import { IconArrowBack, IconX, IconEdit } from '@tabler/icons-react';
|
||||
import { useParams, useRouter } from 'next/navigation';
|
||||
import React, { useState } from 'react';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import posyandustate from '../../../_state/kesehatan/posyandu/posyandu';
|
||||
import { useShallowEffect } from '@mantine/hooks';
|
||||
import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
|
||||
// import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
|
||||
|
||||
function DetailPosyandu() {
|
||||
const statePosyandu = useProxy(posyandustate)
|
||||
const params = useParams()
|
||||
const router = useRouter();
|
||||
const [modalHapus, setModalHapus] = useState(false);
|
||||
const [selectedId, setSelectedId] = useState<string | null>(null)
|
||||
|
||||
useShallowEffect(() => {
|
||||
statePosyandu.findUnique.load(params?.id as string)
|
||||
}, [])
|
||||
|
||||
const handleHapus = () => {
|
||||
if (selectedId) {
|
||||
statePosyandu.delete.byId(selectedId)
|
||||
setModalHapus(false)
|
||||
setSelectedId(null)
|
||||
router.push("/admin/kesehatan/posyandu")
|
||||
}
|
||||
}
|
||||
|
||||
if (!statePosyandu.findUnique.data) {
|
||||
return (
|
||||
<Stack py={10}>
|
||||
<Skeleton h={500} />
|
||||
</Stack>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
<Button variant="subtle" onClick={() => router.back()}>
|
||||
<IconArrowBack color={colors['blue-button']} size={25} />
|
||||
</Button>
|
||||
</Box>
|
||||
<Paper w={{ base: "100%", md: "50%" }} bg={colors['white-1']} p={'md'}>
|
||||
<Stack>
|
||||
<Text fz={"xl"} fw={"bold"}>Detail Posyandu</Text>
|
||||
{statePosyandu.findUnique.data ? (
|
||||
<Paper key={statePosyandu.findUnique.data.id} bg={colors['BG-trans']} p={'md'}>
|
||||
<Stack gap={"xs"}>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Nama Posyandu</Text>
|
||||
<Text fz={"lg"}>{statePosyandu.findUnique.data.name}</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Nomor Posyandu</Text>
|
||||
<Text fz={"lg"}>{statePosyandu.findUnique.data.nomor}</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Deskripsi Posyandu</Text>
|
||||
<Text fz={"lg"} dangerouslySetInnerHTML={{ __html: statePosyandu.findUnique.data.deskripsi }} />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Gambar</Text>
|
||||
<Image src={statePosyandu.findUnique.data.image?.link} alt="gambar" />
|
||||
</Box>
|
||||
<Box>
|
||||
<Flex gap={"xs"}>
|
||||
<Button onClick={() => {
|
||||
if (statePosyandu.findUnique.data) {
|
||||
setSelectedId(statePosyandu.findUnique.data.id)
|
||||
setModalHapus(true)
|
||||
}
|
||||
}} color="red">
|
||||
<IconX size={20} />
|
||||
</Button>
|
||||
<Button onClick={() => router.push(`/admin/kesehatan/posyandu/${statePosyandu.findUnique.data?.id}/edit`)} color="green">
|
||||
<IconEdit size={20} />
|
||||
</Button>
|
||||
</Flex>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Paper>
|
||||
) : null}
|
||||
</Stack>
|
||||
</Paper>
|
||||
|
||||
<ModalKonfirmasiHapus
|
||||
opened={modalHapus}
|
||||
onClose={() => setModalHapus(false)}
|
||||
onConfirm={handleHapus}
|
||||
text="Apakah anda yakin ingin menghapus posyandu ini?"
|
||||
/>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default DetailPosyandu;
|
||||
@@ -1,13 +1,59 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
|
||||
import ApiFetch from '@/lib/api-fetch';
|
||||
import { Box, Button, Center, FileInput, Group, Image, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
|
||||
import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import React from 'react';
|
||||
import { KesehatanEditor } from '../../_com/kesehatanEditor';
|
||||
import { useState } from 'react';
|
||||
import { toast } from 'react-toastify';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import CreateEditor from '../../../_com/createEditor';
|
||||
import posyandustate from '../../../_state/kesehatan/posyandu/posyandu';
|
||||
|
||||
function CreatePosyandu() {
|
||||
const statePosyandu = useProxy(posyandustate)
|
||||
const router = useRouter();
|
||||
const [file, setFile] = useState<File | null>(null);
|
||||
const [previewImage, setPreviewImage] = useState<string | null>(null);
|
||||
|
||||
const resetForm = () => {
|
||||
statePosyandu.create.form = {
|
||||
name: "",
|
||||
nomor: "",
|
||||
deskripsi: "",
|
||||
imageId: "",
|
||||
};
|
||||
|
||||
setFile(null);
|
||||
setPreviewImage(null);
|
||||
}
|
||||
|
||||
const handleSubmit = async () => {
|
||||
if (!file) {
|
||||
return toast.warn("Pilih file gambar terlebih dahulu");
|
||||
}
|
||||
|
||||
// Upload gambar dulu
|
||||
const res = await ApiFetch.api.fileStorage.create.post({
|
||||
file,
|
||||
name: file.name,
|
||||
});
|
||||
|
||||
const uploaded = res.data?.data;
|
||||
if (!uploaded?.id) {
|
||||
return toast.error("Gagal upload gambar");
|
||||
}
|
||||
|
||||
statePosyandu.create.form.imageId = uploaded.id;
|
||||
|
||||
await statePosyandu.create.create();
|
||||
|
||||
resetForm();
|
||||
router.push("/admin/kesehatan/posyandu")
|
||||
}
|
||||
|
||||
|
||||
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
@@ -19,26 +65,52 @@ function CreatePosyandu() {
|
||||
<Paper w={{ base: '100%', md: '50%' }} bg={colors['white-1']} p={'md'}>
|
||||
<Stack gap={"xs"}>
|
||||
<Title order={4}>Create Posyandu</Title>
|
||||
<Box>
|
||||
<Text fw={"bold"} fz={"sm"}>Masukkan Image</Text>
|
||||
<IconImageInPicture size={50} />
|
||||
</Box>
|
||||
{previewImage ? (
|
||||
<Image alt="" src={previewImage} w={200} h={200} />
|
||||
) : (
|
||||
<Center w={200} h={200} bg={"gray"}>
|
||||
<IconImageInPicture />
|
||||
</Center>
|
||||
)}
|
||||
<FileInput
|
||||
label={<Text fz={"sm"} fw={"bold"}>Upload Gambar</Text>}
|
||||
value={file}
|
||||
onChange={async (e) => {
|
||||
if (!e) return;
|
||||
setFile(e);
|
||||
const base64 = await e.arrayBuffer().then((buf) =>
|
||||
"data:image/png;base64," + Buffer.from(buf).toString("base64")
|
||||
);
|
||||
setPreviewImage(base64);
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label={<Text fw={"bold"} fz={"sm"}>Nama Posyandu</Text>}
|
||||
placeholder='Masukkan nama posyandu'
|
||||
value={statePosyandu.create.form.name}
|
||||
onChange={(e) => {
|
||||
statePosyandu.create.form.name = e.target.value;
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label={<Text fw={"bold"} fz={"sm"}>Nomor Posyandu</Text>}
|
||||
placeholder='Masukkan nomor posyandu'
|
||||
value={statePosyandu.create.form.nomor}
|
||||
onChange={(e) => {
|
||||
statePosyandu.create.form.nomor = e.target.value;
|
||||
}}
|
||||
/>
|
||||
<Box>
|
||||
<Text fw={"bold"} fz={"sm"}>Deskripsi Posyandu</Text>
|
||||
<KesehatanEditor
|
||||
showSubmit={false}
|
||||
<CreateEditor
|
||||
value={statePosyandu.create.form.deskripsi}
|
||||
onChange={(htmlContent) => {
|
||||
statePosyandu.create.form.deskripsi = htmlContent;
|
||||
}}
|
||||
/>
|
||||
</Box>
|
||||
<Group>
|
||||
<Button bg={colors['blue-button']}>Submit</Button>
|
||||
<Button onClick={handleSubmit} bg={colors['blue-button']}>Submit</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
|
||||
@@ -1,66 +0,0 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Paper, Stack, Flex, Text, Image } from '@mantine/core';
|
||||
import { IconArrowBack, IconX, IconEdit } from '@tabler/icons-react';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import React from 'react';
|
||||
// import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
|
||||
|
||||
function DetailPosyandu() {
|
||||
const router = useRouter();
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
<Button variant="subtle" onClick={() => router.back()}>
|
||||
<IconArrowBack color={colors['blue-button']} size={25} />
|
||||
</Button>
|
||||
</Box>
|
||||
<Paper w={{ base: "100%", md: "50%" }} bg={colors['white-1']} p={'md'}>
|
||||
<Stack>
|
||||
<Text fz={"xl"} fw={"bold"}>Detail Posyandu</Text>
|
||||
|
||||
<Paper bg={colors['BG-trans']} p={'md'}>
|
||||
<Stack gap={"xs"}>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Nama Posyandu</Text>
|
||||
<Text fz={"lg"}>Test Judul</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Nomor Posyandu</Text>
|
||||
<Text fz={"lg"}>089647038426</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Deskripsi Posyandu</Text>
|
||||
<Text fz={"lg"}>Test Kategori</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Gambar</Text>
|
||||
<Image src={"/"} alt="gambar" />
|
||||
</Box>
|
||||
<Box>
|
||||
<Flex gap={"xs"}>
|
||||
<Button color="red">
|
||||
<IconX size={20} />
|
||||
</Button>
|
||||
<Button onClick={() => router.push('/admin/kesehatan/posyandu/edit')} color="green">
|
||||
<IconEdit size={20} />
|
||||
</Button>
|
||||
</Flex>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</Paper>
|
||||
|
||||
{/* Modal Hapus
|
||||
<ModalKonfirmasiHapus
|
||||
opened={modalHapus}
|
||||
onClose={() => setModalHapus(false)}
|
||||
onConfirm={handleHapus}
|
||||
text="Apakah anda yakin ingin menghapus penanganan darurat ini?"
|
||||
/> */}
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default DetailPosyandu;
|
||||
@@ -1,49 +0,0 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Group, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
|
||||
import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import React from 'react';
|
||||
import { KesehatanEditor } from '../../_com/kesehatanEditor';
|
||||
|
||||
function EditPosyandu() {
|
||||
const router = useRouter();
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
<Button onClick={() => router.back()} variant='subtle' color={'blue'}>
|
||||
<IconArrowBack color={colors['blue-button']} size={25}/>
|
||||
</Button>
|
||||
</Box>
|
||||
|
||||
<Paper w={{base: '100%', md: '50%'}} bg={colors['white-1']} p={'md'}>
|
||||
<Stack gap={"xs"}>
|
||||
<Title order={4}>Edit Posyandu</Title>
|
||||
<Box>
|
||||
<Text fw={"bold"} fz={"sm"}>Masukkan Image</Text>
|
||||
<IconImageInPicture size={50} />
|
||||
</Box>
|
||||
<TextInput
|
||||
label={<Text fw={"bold"} fz={"sm"}>Nama Posyandu</Text>}
|
||||
placeholder='Masukkan nama posyandu'
|
||||
/>
|
||||
<TextInput
|
||||
label={<Text fw={"bold"} fz={"sm"}>Nomor Posyandu</Text>}
|
||||
placeholder='Masukkan nomor posyandu'
|
||||
/>
|
||||
<Box>
|
||||
<Text fw={"bold"} fz={"sm"}>Deskripsi Posyandu</Text>
|
||||
<KesehatanEditor
|
||||
showSubmit={false}
|
||||
/>
|
||||
</Box>
|
||||
<Group>
|
||||
<Button bg={colors['blue-button']}>Submit</Button>
|
||||
</Group>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default EditPosyandu;
|
||||
@@ -1,10 +1,13 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Paper, Table, TableTbody, TableTd, TableTh, TableThead, TableTr } from '@mantine/core';
|
||||
import { Box, Button, Paper, Skeleton, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text } from '@mantine/core';
|
||||
import { IconDeviceImac, IconSearch } from '@tabler/icons-react';
|
||||
import HeaderSearch from '../../_com/header';
|
||||
import JudulList from '../../_com/judulList';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import posyandustate from '../../_state/kesehatan/posyandu/posyandu';
|
||||
import { useShallowEffect } from '@mantine/hooks';
|
||||
|
||||
function Posyandu() {
|
||||
return (
|
||||
@@ -20,7 +23,21 @@ function Posyandu() {
|
||||
}
|
||||
|
||||
function ListPosyandu() {
|
||||
const statePosyandu = useProxy(posyandustate)
|
||||
const router = useRouter();
|
||||
|
||||
useShallowEffect(() => {
|
||||
statePosyandu.findMany.load()
|
||||
}, [])
|
||||
|
||||
if (!statePosyandu.findMany.data) {
|
||||
return (
|
||||
<Box py={10}>
|
||||
<Skeleton h={500} />
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<Box py={10}>
|
||||
<Paper bg={colors['white-1']} p={'md'}>
|
||||
@@ -28,6 +45,7 @@ function ListPosyandu() {
|
||||
title='List Posyandu'
|
||||
href='/admin/kesehatan/posyandu/create'
|
||||
/>
|
||||
<Box style={{ overflowX: "auto" }}>
|
||||
<Table striped withTableBorder withRowBorders>
|
||||
<TableThead>
|
||||
<TableTr>
|
||||
@@ -38,18 +56,23 @@ function ListPosyandu() {
|
||||
</TableTr>
|
||||
</TableThead>
|
||||
<TableTbody>
|
||||
<TableTr>
|
||||
<TableTd>Posyandu 1</TableTd>
|
||||
<TableTd>0896232831883</TableTd>
|
||||
<TableTd>Posyandu 1</TableTd>
|
||||
{statePosyandu.findMany.data?.map((item) => (
|
||||
<TableTr key={item.id}>
|
||||
<TableTd>{item.name}</TableTd>
|
||||
<TableTd>{item.nomor}</TableTd>
|
||||
<TableTd>
|
||||
<Button onClick={() => router.push('/admin/kesehatan/posyandu/detail')}>
|
||||
<Text fz={"sm"} dangerouslySetInnerHTML={{ __html: item.deskripsi }} />
|
||||
</TableTd>
|
||||
<TableTd>
|
||||
<Button onClick={() => router.push(`/admin/kesehatan/posyandu/${item.id}`)}>
|
||||
<IconDeviceImac size={20} />
|
||||
</Button>
|
||||
</TableTd>
|
||||
</TableTr>
|
||||
))}
|
||||
</TableTbody>
|
||||
</Table>
|
||||
</Box>
|
||||
</Paper>
|
||||
</Box>
|
||||
);
|
||||
|
||||
@@ -0,0 +1,150 @@
|
||||
/* eslint-disable react-hooks/exhaustive-deps */
|
||||
'use client'
|
||||
import EditEditor from '@/app/admin/(dashboard)/_com/editEditor';
|
||||
import programKesehatan from '@/app/admin/(dashboard)/_state/kesehatan/program-kesehatan/programKesehatan';
|
||||
import colors from '@/con/colors';
|
||||
import ApiFetch from '@/lib/api-fetch';
|
||||
import { Box, Button, Center, FileInput, Image, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
|
||||
import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
|
||||
import { useParams, useRouter } from 'next/navigation';
|
||||
import { useEffect, useState } from 'react';
|
||||
import { toast } from 'react-toastify';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
|
||||
|
||||
function EditProgramKesehatan() {
|
||||
const programKesehatanState = useProxy(programKesehatan)
|
||||
const router = useRouter();
|
||||
const params = useParams()
|
||||
|
||||
const [previewImage, setPreviewImage] = useState<string | null>(null);
|
||||
const [file, setFile] = useState<File | null>(null);
|
||||
const [formData, setFormData] = useState({
|
||||
name: programKesehatanState.edit.form.name || '',
|
||||
deskripsiSingkat: programKesehatanState.edit.form.deskripsiSingkat || '',
|
||||
deskripsi: programKesehatanState.edit.form.deskripsi || '',
|
||||
imageId: programKesehatanState.edit.form.imageId || '',
|
||||
})
|
||||
|
||||
useEffect(() => {
|
||||
const loadProgramKesehatan = async () => {
|
||||
const id = params?.id as string;
|
||||
if (!id) return;
|
||||
|
||||
try {
|
||||
const data = await programKesehatanState.edit.load(id);
|
||||
if (data) {
|
||||
setFormData({
|
||||
name: data.name || '',
|
||||
deskripsiSingkat: data.deskripsiSingkat || '',
|
||||
deskripsi: data.deskripsi || '',
|
||||
imageId: data.imageId || '',
|
||||
});
|
||||
|
||||
if (data?.image?.link) {
|
||||
setPreviewImage(data.image.link);
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error loading program kesehatan:", error);
|
||||
toast.error("Gagal memuat data program kesehatan");
|
||||
}
|
||||
};
|
||||
|
||||
loadProgramKesehatan();
|
||||
}, [params?.id]);
|
||||
|
||||
const handleSubmit = async () => {
|
||||
try {
|
||||
programKesehatanState.edit.form = {
|
||||
...programKesehatanState.edit.form,
|
||||
name: formData.name,
|
||||
deskripsiSingkat: formData.deskripsiSingkat,
|
||||
deskripsi: formData.deskripsi,
|
||||
imageId: formData.imageId,
|
||||
};
|
||||
|
||||
if (file) {
|
||||
const res = await ApiFetch.api.fileStorage.create.post({ file, name: file.name });
|
||||
const uploaded = res.data?.data;
|
||||
|
||||
if (!uploaded?.id) {
|
||||
return toast.error("Gagal upload gambar");
|
||||
}
|
||||
|
||||
programKesehatanState.edit.form.imageId = uploaded.id;
|
||||
}
|
||||
|
||||
await programKesehatanState.edit.update();
|
||||
toast.success("Program kesehatan berhasil diperbarui!");
|
||||
router.push("/admin/kesehatan/program-kesehatan");
|
||||
} catch (error) {
|
||||
console.error("Error updating program kesehatan:", error);
|
||||
toast.error("Gagal memuat data program kesehatan");
|
||||
}
|
||||
}
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
<Button variant="subtle" onClick={() => router.back()}>
|
||||
<IconArrowBack color={colors['blue-button']} size={25} />
|
||||
</Button>
|
||||
</Box>
|
||||
<Stack gap={"xs"}>
|
||||
<Paper bg={colors['white-1']} p="md" w={{ base: '100%', md: '50%' }}>
|
||||
<Stack gap="xs">
|
||||
<Title order={3}>Edit Program Kesehatan</Title>
|
||||
<TextInput
|
||||
value={formData.name}
|
||||
onChange={(e) => setFormData({ ...formData, name: e.target.value })}
|
||||
label={<Text fz="sm" fw="bold">Judul</Text>}
|
||||
placeholder="masukkan judul"
|
||||
/>
|
||||
|
||||
<TextInput
|
||||
value={formData.deskripsiSingkat}
|
||||
onChange={(e) => setFormData({ ...formData, deskripsiSingkat: e.target.value })}
|
||||
label={<Text fz="sm" fw="bold">Deskripsi Singkat</Text>}
|
||||
placeholder="masukkan deskripsi"
|
||||
/>
|
||||
|
||||
<Box>
|
||||
<Text fz="sm" fw="bold">Deskripsi</Text>
|
||||
<EditEditor
|
||||
value={formData.deskripsi}
|
||||
onChange={(val) => setFormData({ ...formData, deskripsi: val })}
|
||||
/>
|
||||
</Box>
|
||||
|
||||
<FileInput
|
||||
label={<Text fz="sm" fw="bold">Upload Gambar</Text>}
|
||||
value={file}
|
||||
onChange={async (e) => {
|
||||
if (!e) return;
|
||||
setFile(e);
|
||||
const base64 = await e.arrayBuffer().then((buf) =>
|
||||
'data:image/png;base64,' + Buffer.from(buf).toString('base64')
|
||||
);
|
||||
setPreviewImage(base64);
|
||||
}}
|
||||
/>
|
||||
|
||||
{previewImage ? (
|
||||
<Image alt="" src={previewImage} w={200} h={200} />
|
||||
) : (
|
||||
<Center w={200} h={200} bg="gray">
|
||||
<IconImageInPicture />
|
||||
</Center>
|
||||
)}
|
||||
|
||||
<Button onClick={handleSubmit} bg={colors['blue-button']}>
|
||||
Simpan
|
||||
</Button>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</Box >
|
||||
);
|
||||
}
|
||||
|
||||
export default EditProgramKesehatan;
|
||||
@@ -0,0 +1,103 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Paper, Stack, Flex, Text, Image, Skeleton } from '@mantine/core';
|
||||
import { IconArrowBack, IconX, IconEdit } from '@tabler/icons-react';
|
||||
import { useParams, useRouter } from 'next/navigation';
|
||||
import React, { useState } from 'react';
|
||||
import programKesehatan from '../../../_state/kesehatan/program-kesehatan/programKesehatan';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import { useShallowEffect } from '@mantine/hooks';
|
||||
import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
|
||||
|
||||
function DetailProgramKesehatan() {
|
||||
const programKesehatanState = useProxy(programKesehatan)
|
||||
const [modalHapus, setModalHapus] = useState(false)
|
||||
const [selectedId, setSelectedId] = useState<string | null>(null)
|
||||
const router = useRouter();
|
||||
const params = useParams()
|
||||
|
||||
useShallowEffect(() => {
|
||||
programKesehatanState.findUnique.load(params?.id as string)
|
||||
}, [])
|
||||
|
||||
const handleHapus = () => {
|
||||
if (selectedId) {
|
||||
programKesehatanState.delete.byId(selectedId)
|
||||
setModalHapus(false)
|
||||
setSelectedId(null)
|
||||
router.push("/admin/kesehatan/program-kesehatan")
|
||||
}
|
||||
}
|
||||
|
||||
if (!programKesehatanState.findUnique.data) {
|
||||
return (
|
||||
<Stack py={10}>
|
||||
<Skeleton h={400} />
|
||||
</Stack>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
<Button variant="subtle" onClick={() => router.back()}>
|
||||
<IconArrowBack color={colors['blue-button']} size={25} />
|
||||
</Button>
|
||||
</Box>
|
||||
<Paper w={{ base: "100%", md: "50%" }} bg={colors['white-1']} p={'md'}>
|
||||
<Stack>
|
||||
<Text fz={"xl"} fw={"bold"}>Detail Program Kesehatan</Text>
|
||||
{programKesehatanState.findUnique.data ? (
|
||||
<Paper bg={colors['BG-trans']} p={'md'}>
|
||||
<Stack gap={"xs"}>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Judul</Text>
|
||||
<Text fz={"lg"}>{programKesehatanState.findUnique.data.name}</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Deskripsi Singkat</Text>
|
||||
<Text fz={"lg"}>{programKesehatanState.findUnique.data.deskripsiSingkat}</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Deskripsi</Text>
|
||||
<Text fz={"lg"} dangerouslySetInnerHTML={{ __html: programKesehatanState.findUnique.data.deskripsi }} />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Gambar</Text>
|
||||
<Image src={programKesehatanState.findUnique.data.image?.link} alt="gambar" />
|
||||
</Box>
|
||||
<Box>
|
||||
<Flex gap={"xs"}>
|
||||
<Button color="red" onClick={() => {
|
||||
if (programKesehatanState.findUnique.data) {
|
||||
setSelectedId(programKesehatanState.findUnique.data.id)
|
||||
setModalHapus(true)
|
||||
}
|
||||
}}
|
||||
disabled={programKesehatanState.delete.loading || !programKesehatanState.findUnique.data}
|
||||
>
|
||||
<IconX size={20} />
|
||||
</Button>
|
||||
<Button onClick={() => router.push(`/admin/kesehatan/program-kesehatan/${programKesehatanState.findUnique.data?.id}/edit`)} color="green">
|
||||
<IconEdit size={20} />
|
||||
</Button>
|
||||
</Flex>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Paper>
|
||||
) : null}
|
||||
</Stack>
|
||||
</Paper>
|
||||
|
||||
{/* Modal Hapus */}
|
||||
<ModalKonfirmasiHapus
|
||||
opened={modalHapus}
|
||||
onClose={() => setModalHapus(false)}
|
||||
onConfirm={handleHapus}
|
||||
text="Apakah anda yakin ingin menghapus program kesehatan ini?"
|
||||
/>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default DetailProgramKesehatan;
|
||||
@@ -1,12 +1,62 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
|
||||
import { IconArrowBack } from '@tabler/icons-react';
|
||||
import ApiFetch from '@/lib/api-fetch';
|
||||
import { Box, Button, Center, FileInput, Image, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
|
||||
import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { KesehatanEditor } from '../../_com/kesehatanEditor';
|
||||
import { useState } from 'react';
|
||||
import { toast } from 'react-toastify';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import CreateEditor from '../../../_com/createEditor';
|
||||
import programKesehatan from '../../../_state/kesehatan/program-kesehatan/programKesehatan';
|
||||
|
||||
function CreateProgramKesehatan() {
|
||||
const router = useRouter();
|
||||
const programKesehatanState = useProxy(programKesehatan)
|
||||
const [previewImage, setPreviewImage] = useState<string | null>(null);
|
||||
const [file, setFile] = useState<File | null>(null);
|
||||
|
||||
const resetForm = () => {
|
||||
// Reset state di valtio
|
||||
programKesehatanState.create.form = {
|
||||
name: "",
|
||||
deskripsiSingkat: "",
|
||||
deskripsi: "",
|
||||
imageId: "",
|
||||
};
|
||||
|
||||
// Reset state lokal
|
||||
setPreviewImage(null);
|
||||
setFile(null);
|
||||
};
|
||||
|
||||
const handleSubmit = async () => {
|
||||
if (!file) {
|
||||
return toast.warn("Pilih file gambar terlebih dahulu");
|
||||
}
|
||||
|
||||
// Upload gambar dulu
|
||||
const res = await ApiFetch.api.fileStorage.create.post({
|
||||
file,
|
||||
name: file.name,
|
||||
});
|
||||
|
||||
const uploaded = res.data?.data;
|
||||
if (!uploaded?.id) {
|
||||
return toast.error("Gagal upload gambar");
|
||||
}
|
||||
|
||||
// Simpan ID gambar ke form
|
||||
programKesehatanState.create.form.imageId = uploaded.id;
|
||||
|
||||
// Submit data berita
|
||||
await programKesehatanState.create.create();
|
||||
|
||||
// Reset form setelah submit
|
||||
resetForm();
|
||||
router.push("/admin/kesehatan/program-kesehatan")
|
||||
};
|
||||
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
@@ -14,30 +64,38 @@ function CreateProgramKesehatan() {
|
||||
<IconArrowBack color={colors['blue-button']} size={25} />
|
||||
</Button>
|
||||
</Box>
|
||||
|
||||
<Paper bg={colors['white-1']} p="md" w={{ base: '100%', md: '50%' }}>
|
||||
<Stack gap="xs">
|
||||
<Title order={3}>Create Program Kesehatan</Title>
|
||||
|
||||
<TextInput
|
||||
|
||||
value={programKesehatanState.create.form.name}
|
||||
onChange={(val) => {
|
||||
programKesehatanState.create.form.name = val.target.value;
|
||||
}}
|
||||
label={<Text fz="sm" fw="bold">Judul</Text>}
|
||||
placeholder="masukkan judul"
|
||||
/>
|
||||
|
||||
<TextInput
|
||||
|
||||
label={<Text fz="sm" fw="bold">Deskripsi</Text>}
|
||||
value={programKesehatanState.create.form.deskripsiSingkat}
|
||||
onChange={(val) => {
|
||||
programKesehatanState.create.form.deskripsiSingkat = val.target.value;
|
||||
}}
|
||||
label={<Text fz="sm" fw="bold">Deskripsi Singkat</Text>}
|
||||
placeholder="masukkan deskripsi"
|
||||
/>
|
||||
|
||||
<TextInput
|
||||
|
||||
label={<Text fz="sm" fw="bold">Kategori</Text>}
|
||||
placeholder="masukkan kategori"
|
||||
<Box>
|
||||
<Text fz="sm" fw="bold">Deskripsi</Text>
|
||||
<CreateEditor
|
||||
value={programKesehatanState.create.form.deskripsi}
|
||||
onChange={(val) => {
|
||||
programKesehatanState.create.form.deskripsi = val;
|
||||
}}
|
||||
/>
|
||||
</Box>
|
||||
|
||||
{/* <FileInput
|
||||
<FileInput
|
||||
label={<Text fz="sm" fw="bold">Upload Gambar</Text>}
|
||||
value={file}
|
||||
onChange={async (e) => {
|
||||
@@ -48,25 +106,18 @@ function CreateProgramKesehatan() {
|
||||
);
|
||||
setPreviewImage(base64);
|
||||
}}
|
||||
/> */}
|
||||
/>
|
||||
|
||||
{/* {previewImage ? (
|
||||
{previewImage ? (
|
||||
<Image alt="" src={previewImage} w={200} h={200} />
|
||||
) : (
|
||||
<Center w={200} h={200} bg="gray">
|
||||
<IconImageInPicture />
|
||||
</Center>
|
||||
)} */}
|
||||
)}
|
||||
|
||||
<Box>
|
||||
<Text fz="sm" fw="bold">Konten</Text>
|
||||
<KesehatanEditor
|
||||
showSubmit={false}
|
||||
/>
|
||||
</Box>
|
||||
|
||||
<Button bg={colors['blue-button']}>
|
||||
Simpan Potensi
|
||||
<Button onClick={handleSubmit} bg={colors['blue-button']}>
|
||||
Simpan
|
||||
</Button>
|
||||
</Stack>
|
||||
</Paper>
|
||||
|
||||
@@ -1,70 +0,0 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Paper, Stack, Flex, Text, Image } from '@mantine/core';
|
||||
import { IconArrowBack, IconX, IconEdit } from '@tabler/icons-react';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import React from 'react';
|
||||
// import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
|
||||
|
||||
function DetailProgramKesehatan() {
|
||||
const router = useRouter();
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
<Button variant="subtle" onClick={() => router.back()}>
|
||||
<IconArrowBack color={colors['blue-button']} size={25} />
|
||||
</Button>
|
||||
</Box>
|
||||
<Paper w={{ base: "100%", md: "50%" }} bg={colors['white-1']} p={'md'}>
|
||||
<Stack>
|
||||
<Text fz={"xl"} fw={"bold"}>Detail Potensi</Text>
|
||||
|
||||
<Paper bg={colors['BG-trans']} p={'md'}>
|
||||
<Stack gap={"xs"}>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Judul</Text>
|
||||
<Text fz={"lg"}>Test Judul</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Kategori</Text>
|
||||
<Text fz={"lg"}>Test Kategori</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Deskripsi</Text>
|
||||
<Text fz={"lg"}>Test Deskripsi</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Gambar</Text>
|
||||
<Image src={"/"} alt="gambar" />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Konten</Text>
|
||||
<Text fz={"lg"} >Test Konten</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Flex gap={"xs"}>
|
||||
<Button color="red">
|
||||
<IconX size={20} />
|
||||
</Button>
|
||||
<Button onClick={() => router.push('/admin/kesehatan/program-kesehatan/edit')} color="green">
|
||||
<IconEdit size={20} />
|
||||
</Button>
|
||||
</Flex>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</Paper>
|
||||
|
||||
{/* Modal Hapus
|
||||
<ModalKonfirmasiHapus
|
||||
opened={modalHapus}
|
||||
onClose={() => setModalHapus(false)}
|
||||
onConfirm={handleHapus}
|
||||
text="Apakah anda yakin ingin menghapus potensi ini?"
|
||||
/> */}
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default DetailProgramKesehatan;
|
||||
@@ -1,64 +0,0 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Stack, SimpleGrid, Paper, Title, TextInput, Text, Button } from '@mantine/core';
|
||||
import { KesehatanEditor } from '../../_com/kesehatanEditor';
|
||||
import { IconArrowBack } from '@tabler/icons-react';
|
||||
import { useRouter } from 'next/navigation';
|
||||
|
||||
|
||||
function EditProgramKesehatan() {
|
||||
const router = useRouter();
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
<Button variant="subtle" onClick={() => router.back()}>
|
||||
<IconArrowBack color={colors['blue-button']} size={25} />
|
||||
</Button>
|
||||
</Box>
|
||||
<Stack gap={"xs"}>
|
||||
<SimpleGrid cols={{ base: 1, md: 2 }}>
|
||||
<Box>
|
||||
<Paper bg={colors['white-1']} p={"md"}>
|
||||
<Stack gap={"xs"}>
|
||||
<Title order={3}>Edit Program Kesehatan</Title>
|
||||
<TextInput
|
||||
label={<Text fw={"bold"} fz={"sm"}>Nama Program Kesehatan</Text>}
|
||||
placeholder='Masukkan nama Program Kesehatan'
|
||||
/>
|
||||
<TextInput
|
||||
label={<Text fw={"bold"} fz={"sm"}>No Telp Program Kesehatan</Text>}
|
||||
placeholder='Masukkan no telp Program Kesehatan'
|
||||
/>
|
||||
<Box>
|
||||
<Text fw={"bold"} fz={"sm"}>Deskripsi</Text>
|
||||
<KesehatanEditor
|
||||
showSubmit={false}
|
||||
/>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fw={"bold"} fz={"sm"}>Pelayanan Posyandu</Text>
|
||||
<KesehatanEditor
|
||||
showSubmit={false}
|
||||
/>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Box>
|
||||
<Box>
|
||||
<Paper bg={colors['white-1']} p={"md"}>
|
||||
<Stack gap={"xs"}>
|
||||
<Title order={4}>Preview Data Program Kesehatan</Title>
|
||||
<Text fw={"bold"} fz={"sm"}>Nama Program Kesehatan</Text>
|
||||
<Text fw={"bold"} fz={"sm"}>No Telp Program Kesehatan</Text>
|
||||
<Text fw={"bold"} fz={"sm"}>Deskripsi</Text>
|
||||
<Text fw={"bold"} fz={"sm"}>Pelayanan Posyandu</Text>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Box>
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default EditProgramKesehatan;
|
||||
@@ -1,10 +1,13 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Image, Paper, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text } from '@mantine/core';
|
||||
import { Box, Button, Image, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text } from '@mantine/core';
|
||||
import { IconDeviceImacCog, IconSearch } from '@tabler/icons-react';
|
||||
import JudulList from '../../_com/judulList';
|
||||
import HeaderSearch from '../../_com/header';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import programKesehatan from '../../_state/kesehatan/program-kesehatan/programKesehatan';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import { useShallowEffect } from '@mantine/hooks';
|
||||
|
||||
function ProgramKesehatan() {
|
||||
return (
|
||||
@@ -20,7 +23,21 @@ function ProgramKesehatan() {
|
||||
}
|
||||
|
||||
function ListProgramKesehatan() {
|
||||
const programKesehatanState = useProxy(programKesehatan)
|
||||
const router = useRouter()
|
||||
|
||||
useShallowEffect(() => {
|
||||
programKesehatanState.findMany.load()
|
||||
}, [])
|
||||
|
||||
if (!programKesehatanState.findMany.data) {
|
||||
return (
|
||||
<Box py={10}>
|
||||
<Skeleton h={500} />
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<Box py={10}>
|
||||
<Paper bg={colors['white-1']} p={'md'}>
|
||||
@@ -33,28 +50,31 @@ function ListProgramKesehatan() {
|
||||
<Table striped withRowBorders withTableBorder style={{ minWidth: '700px' }}>
|
||||
<TableThead>
|
||||
<TableTr>
|
||||
<TableTh>Judul</TableTh>
|
||||
<TableTh>Kategori</TableTh>
|
||||
<TableTh>Image</TableTh>
|
||||
<TableTh>Detail</TableTh>
|
||||
<TableTh w={250}>Judul</TableTh>
|
||||
<TableTh w={250}>Deskripsi Singkat</TableTh>
|
||||
<TableTh w={250}>Image</TableTh>
|
||||
<TableTh w={200}>Detail</TableTh>
|
||||
</TableTr>
|
||||
</TableThead>
|
||||
<TableTbody>
|
||||
<TableTr>
|
||||
{programKesehatanState.findMany.data?.map((item) => (
|
||||
<TableTr key={item.id}>
|
||||
<TableTd>
|
||||
<Box w={100}>
|
||||
<Text truncate="end" fz={"sm"}>Test</Text>
|
||||
</Box></TableTd>
|
||||
<TableTd>Test</TableTd>
|
||||
<Text truncate="end" fz={"sm"}>{item.name}</Text>
|
||||
</Box>
|
||||
</TableTd>
|
||||
<TableTd>{item.deskripsiSingkat}</TableTd>
|
||||
<TableTd>
|
||||
<Image w={100} src={"/"} alt="image" />
|
||||
<Image w={100} src={item.image?.link} alt="image" />
|
||||
</TableTd>
|
||||
<TableTd>
|
||||
<Button onClick={() => router.push('/admin/kesehatan/program-kesehatan/detail')}>
|
||||
<Button onClick={() => router.push(`/admin/kesehatan/program-kesehatan/${item.id}`)}>
|
||||
<IconDeviceImacCog size={25} />
|
||||
</Button>
|
||||
</TableTd>
|
||||
</TableTr>
|
||||
))}
|
||||
</TableTbody>
|
||||
</Table>
|
||||
</Box>
|
||||
|
||||
286
src/app/admin/(dashboard)/kesehatan/puskesmas/[id]/edit/page.tsx
Normal file
286
src/app/admin/(dashboard)/kesehatan/puskesmas/[id]/edit/page.tsx
Normal file
@@ -0,0 +1,286 @@
|
||||
/* eslint-disable react-hooks/exhaustive-deps */
|
||||
'use client'
|
||||
|
||||
import puskesmasState from '@/app/admin/(dashboard)/_state/kesehatan/puskesmas/puskesmas';
|
||||
import colors from '@/con/colors';
|
||||
import ApiFetch from '@/lib/api-fetch';
|
||||
import { Box, Button, Center, FileInput, Image, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
|
||||
import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
|
||||
import { useParams, useRouter } from 'next/navigation';
|
||||
import { ChangeEvent, useEffect, useState } from 'react';
|
||||
import { toast } from 'react-toastify';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
|
||||
interface PuskesmasFormBase {
|
||||
name: string;
|
||||
alamat: string;
|
||||
jam: {
|
||||
workDays: string;
|
||||
weekDays: string;
|
||||
holiday: string;
|
||||
};
|
||||
kontak: {
|
||||
kontakPuskesmas: string;
|
||||
email: string;
|
||||
facebook: string;
|
||||
kontakUGD: string;
|
||||
};
|
||||
imageId: string;
|
||||
}
|
||||
|
||||
interface PuskesmasFormData extends PuskesmasFormBase {
|
||||
image?: {
|
||||
link: string;
|
||||
};
|
||||
}
|
||||
|
||||
function EditPuskesmas() {
|
||||
const statePuskesmas = useProxy(puskesmasState);
|
||||
const router = useRouter();
|
||||
const params = useParams();
|
||||
|
||||
const [previewImage, setPreviewImage] = useState<string | null>(null);
|
||||
const [file, setFile] = useState<File | null>(null);
|
||||
const [formData, setFormData] = useState<PuskesmasFormData>({
|
||||
name: statePuskesmas.edit.form.name || '',
|
||||
alamat: statePuskesmas.edit.form.alamat || '',
|
||||
jam: {
|
||||
workDays: statePuskesmas.edit.form.jam?.workDays || '',
|
||||
weekDays: statePuskesmas.edit.form.jam?.weekDays || '',
|
||||
holiday: statePuskesmas.edit.form.jam?.holiday || '',
|
||||
},
|
||||
kontak: {
|
||||
kontakPuskesmas: statePuskesmas.edit.form.kontak?.kontakPuskesmas || '',
|
||||
email: statePuskesmas.edit.form.kontak?.email || '',
|
||||
facebook: statePuskesmas.edit.form.kontak?.facebook || '',
|
||||
kontakUGD: statePuskesmas.edit.form.kontak?.kontakUGD || '',
|
||||
},
|
||||
imageId: statePuskesmas.edit.form.imageId || '',
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
const loadPuskesmas = async () => {
|
||||
const id = params?.id as string;
|
||||
if (!id) return;
|
||||
|
||||
try {
|
||||
await statePuskesmas.edit.load(id);
|
||||
const { form } = statePuskesmas.edit;
|
||||
if (form) {
|
||||
setFormData({
|
||||
name: form.name,
|
||||
alamat: form.alamat,
|
||||
jam: {
|
||||
workDays: form.jam.workDays,
|
||||
weekDays: form.jam.weekDays,
|
||||
holiday: form.jam.holiday,
|
||||
},
|
||||
kontak: {
|
||||
kontakPuskesmas: form.kontak.kontakPuskesmas,
|
||||
email: form.kontak.email,
|
||||
facebook: form.kontak.facebook,
|
||||
kontakUGD: form.kontak.kontakUGD,
|
||||
},
|
||||
imageId: form.imageId,
|
||||
});
|
||||
|
||||
// Check if there's an existing image URL in the form data
|
||||
const formWithImage = form as PuskesmasFormData;
|
||||
if (formWithImage.image?.link) {
|
||||
setPreviewImage(formWithImage.image.link);
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error loading puskesmas:", error);
|
||||
toast.error("Gagal memuat data puskesmas");
|
||||
}
|
||||
};
|
||||
loadPuskesmas();
|
||||
}, [params?.id]);
|
||||
|
||||
const handleSubmit = async () => {
|
||||
try {
|
||||
statePuskesmas.edit.form = {
|
||||
...statePuskesmas.edit.form,
|
||||
name: formData.name,
|
||||
alamat: formData.alamat,
|
||||
jam: {
|
||||
workDays: formData.jam.workDays,
|
||||
weekDays: formData.jam.weekDays,
|
||||
holiday: formData.jam.holiday,
|
||||
},
|
||||
kontak: {
|
||||
kontakPuskesmas: formData.kontak.kontakPuskesmas,
|
||||
email: formData.kontak.email,
|
||||
facebook: formData.kontak.facebook,
|
||||
kontakUGD: formData.kontak.kontakUGD,
|
||||
},
|
||||
imageId: formData.imageId,
|
||||
};
|
||||
|
||||
if (file) {
|
||||
const res = await ApiFetch.api.fileStorage.create.post({ file, name: file.name });
|
||||
const uploaded = res.data?.data;
|
||||
|
||||
if (!uploaded?.id) {
|
||||
toast.error("Gagal upload gambar");
|
||||
return;
|
||||
}
|
||||
|
||||
statePuskesmas.edit.form.imageId = uploaded.id;
|
||||
}
|
||||
|
||||
const success = await statePuskesmas.edit.submit();
|
||||
if (success) {
|
||||
toast.success("Puskesmas berhasil diperbarui!");
|
||||
router.push("/admin/kesehatan/puskesmas");
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error updating puskesmas:", error);
|
||||
toast.error(error instanceof Error ? error.message : "Gagal memperbarui data puskesmas");
|
||||
}
|
||||
};
|
||||
|
||||
const handleFileChange = (selectedFile: File | null) => {
|
||||
if (selectedFile) {
|
||||
setFile(selectedFile);
|
||||
const reader = new FileReader();
|
||||
reader.onload = (e) => {
|
||||
if (e.target?.result) {
|
||||
setPreviewImage(e.target.result as string);
|
||||
}
|
||||
};
|
||||
reader.readAsDataURL(selectedFile);
|
||||
} else {
|
||||
setFile(null);
|
||||
setPreviewImage(null);
|
||||
}
|
||||
};
|
||||
|
||||
const handleInputChange = (e: ChangeEvent<HTMLInputElement>) => {
|
||||
const { name, value } = e.target;
|
||||
setFormData(prev => ({
|
||||
...prev,
|
||||
[name]: value
|
||||
}));
|
||||
};
|
||||
|
||||
const handleNestedChange = (section: 'jam' | 'kontak', field: string, value: string) => {
|
||||
setFormData(prev => ({
|
||||
...prev,
|
||||
[section]: {
|
||||
...prev[section],
|
||||
[field]: value
|
||||
}
|
||||
}));
|
||||
};
|
||||
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
<Button onClick={() => router.back()} variant="subtle" color="blue">
|
||||
<IconArrowBack color={colors['blue-button']} size={25} />
|
||||
</Button>
|
||||
</Box>
|
||||
<Stack gap="xs">
|
||||
<Paper bg={colors['white-1']} p="md" w={{ base: '100%', md: '50%' }}>
|
||||
<Stack gap="xs">
|
||||
<Title order={3}>Edit Puskesmas</Title>
|
||||
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Nama Puskesmas</Text>}
|
||||
placeholder="masukkan nama puskesmas"
|
||||
name="name"
|
||||
value={formData.name}
|
||||
onChange={handleInputChange}
|
||||
/>
|
||||
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Alamat</Text>}
|
||||
placeholder="masukkan alamat"
|
||||
name="alamat"
|
||||
value={formData.alamat}
|
||||
onChange={handleInputChange}
|
||||
/>
|
||||
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Jam Buka</Text>}
|
||||
placeholder="masukkan jam buka"
|
||||
value={formData.jam.workDays}
|
||||
onChange={(e) => handleNestedChange('jam', 'workDays', e.target.value)}
|
||||
/>
|
||||
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Jam Tutup</Text>}
|
||||
placeholder="masukkan jam tutup"
|
||||
value={formData.jam.weekDays}
|
||||
onChange={(e) => handleNestedChange('jam', 'weekDays', e.target.value)}
|
||||
/>
|
||||
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Jam Libur</Text>}
|
||||
placeholder="masukkan jam libur"
|
||||
value={formData.jam.holiday}
|
||||
onChange={(e) => handleNestedChange('jam', 'holiday', e.target.value)}
|
||||
/>
|
||||
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Kontak Puskesmas</Text>}
|
||||
placeholder="masukkan kontak puskesmas"
|
||||
value={formData.kontak.kontakPuskesmas}
|
||||
onChange={(e) => handleNestedChange('kontak', 'kontakPuskesmas', e.target.value)}
|
||||
/>
|
||||
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Email</Text>}
|
||||
placeholder="masukkan email"
|
||||
value={formData.kontak.email}
|
||||
onChange={(e) => handleNestedChange('kontak', 'email', e.target.value)}
|
||||
/>
|
||||
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Facebook</Text>}
|
||||
placeholder="masukkan facebook"
|
||||
value={formData.kontak.facebook}
|
||||
onChange={(e) => handleNestedChange('kontak', 'facebook', e.target.value)}
|
||||
/>
|
||||
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Kontak UGD</Text>}
|
||||
placeholder="masukkan kontak UGD"
|
||||
value={formData.kontak.kontakUGD}
|
||||
onChange={(e) => handleNestedChange('kontak', 'kontakUGD', e.target.value)}
|
||||
/>
|
||||
|
||||
<FileInput
|
||||
placeholder="Pilih gambar"
|
||||
label="Gambar"
|
||||
accept="image/*"
|
||||
leftSection={<IconImageInPicture size={16} />}
|
||||
value={file}
|
||||
onChange={handleFileChange}
|
||||
/>
|
||||
|
||||
{previewImage ? (
|
||||
<Image alt="Preview" src={previewImage} w={200} h={200} />
|
||||
) : (
|
||||
<Center w={200} h={200} bg="gray">
|
||||
<IconImageInPicture />
|
||||
</Center>
|
||||
)}
|
||||
|
||||
<Button
|
||||
onClick={handleSubmit}
|
||||
bg={colors['blue-button']}
|
||||
loading={statePuskesmas.edit.loading}
|
||||
>
|
||||
Simpan Perubahan
|
||||
</Button>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default EditPuskesmas;
|
||||
111
src/app/admin/(dashboard)/kesehatan/puskesmas/[id]/page.tsx
Normal file
111
src/app/admin/(dashboard)/kesehatan/puskesmas/[id]/page.tsx
Normal file
@@ -0,0 +1,111 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Paper, Stack, Flex, Text, Image, Skeleton } from '@mantine/core';
|
||||
import { IconArrowBack, IconX, IconEdit } from '@tabler/icons-react';
|
||||
import { useParams, useRouter } from 'next/navigation';
|
||||
import React, { useState } from 'react';
|
||||
import puskesmasState from '../../../_state/kesehatan/puskesmas/puskesmas';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import { useShallowEffect } from '@mantine/hooks';
|
||||
import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
|
||||
|
||||
function DetailPuskesmas() {
|
||||
const params = useParams()
|
||||
const router = useRouter();
|
||||
const statePuskesmas = useProxy(puskesmasState)
|
||||
const [modalHapus, setModalHapus] = useState(false);
|
||||
const [selectedId, setSelectedId] = useState<string | null>(null)
|
||||
|
||||
useShallowEffect(() => {
|
||||
statePuskesmas.findUnique.load(params?.id as string)
|
||||
}, [])
|
||||
|
||||
const handleHapus = () => {
|
||||
if (selectedId) {
|
||||
statePuskesmas.delete.byId(selectedId)
|
||||
setModalHapus(false)
|
||||
setSelectedId(null)
|
||||
router.push("/admin/kesehatan/puskesmas")
|
||||
}
|
||||
}
|
||||
|
||||
if (!statePuskesmas.findUnique.data) {
|
||||
return (
|
||||
<Stack py={10}>
|
||||
<Skeleton h={500} />
|
||||
</Stack>
|
||||
)
|
||||
}
|
||||
|
||||
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
<Button variant="subtle" onClick={() => router.back()}>
|
||||
<IconArrowBack color={colors['blue-button']} size={25} />
|
||||
</Button>
|
||||
</Box>
|
||||
<Paper w={{ base: "100%", md: "50%" }} bg={colors['white-1']} p={'md'}>
|
||||
<Stack>
|
||||
<Text fz={"xl"} fw={"bold"}>Detail Puskesmas</Text>
|
||||
{statePuskesmas.findUnique.data ? (
|
||||
<Paper bg={colors['BG-trans']} p={'md'}>
|
||||
<Stack gap={"xs"}>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Nama Puskesmas</Text>
|
||||
<Text fz={"lg"}>{statePuskesmas.findUnique.data.name}</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Alamat</Text>
|
||||
<Text fz={"lg"}>{statePuskesmas.findUnique.data.alamat}</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Jam Operasional</Text>
|
||||
<Text fz={"lg"}>{statePuskesmas.findUnique.data.jam.workDays}</Text>
|
||||
<Text fz={"lg"}>{statePuskesmas.findUnique.data.jam.weekDays}</Text>
|
||||
<Text fz={"lg"}>{statePuskesmas.findUnique.data.jam.holiday}</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Gambar</Text>
|
||||
<Image src={statePuskesmas.findUnique.data.image?.link} alt="gambar" />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Kontak</Text>
|
||||
<Text fz={"lg"} >{statePuskesmas.findUnique.data.kontak.kontakPuskesmas}</Text>
|
||||
<Text fz={"lg"} >{statePuskesmas.findUnique.data.kontak.email}</Text>
|
||||
<Text fz={"lg"} >{statePuskesmas.findUnique.data.kontak.facebook}</Text>
|
||||
<Text fz={"lg"} >{statePuskesmas.findUnique.data.kontak.kontakUGD}</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Flex gap={"xs"}>
|
||||
<Button color="red" onClick={() => {
|
||||
if (statePuskesmas.findUnique.data) {
|
||||
setSelectedId(statePuskesmas.findUnique.data.id)
|
||||
setModalHapus(true)
|
||||
}
|
||||
}}>
|
||||
<IconX size={20} />
|
||||
</Button>
|
||||
<Button onClick={() => router.push(`/admin/kesehatan/puskesmas/${statePuskesmas.findUnique.data?.id}/edit`)} color="green">
|
||||
<IconEdit size={20} />
|
||||
</Button>
|
||||
</Flex>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Paper>
|
||||
) : null}
|
||||
</Stack>
|
||||
</Paper>
|
||||
|
||||
{/* Modal Hapus */}
|
||||
<ModalKonfirmasiHapus
|
||||
opened={modalHapus}
|
||||
onClose={() => setModalHapus(false)}
|
||||
onConfirm={handleHapus}
|
||||
text="Apakah anda yakin ingin menghapus potensi ini?"
|
||||
/>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default DetailPuskesmas;
|
||||
@@ -1,14 +1,76 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
|
||||
import { IconArrowBack } from '@tabler/icons-react';
|
||||
import ApiFetch from '@/lib/api-fetch';
|
||||
import { Box, Button, Center, FileInput, Image, Paper, Stack, Text, TextInput, Title } from '@mantine/core';
|
||||
import { IconArrowBack, IconImageInPicture } from '@tabler/icons-react';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { KesehatanEditor } from '../../_com/kesehatanEditor';
|
||||
import { useState } from 'react';
|
||||
import { toast } from 'react-toastify';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import puskesmasState from '../../../_state/kesehatan/puskesmas/puskesmas';
|
||||
|
||||
function CreatePuskesmas() {
|
||||
const statePuskesmas = useProxy(puskesmasState)
|
||||
const router = useRouter();
|
||||
const [file, setFile] = useState<File | null>(null);
|
||||
const [previewImage, setPreviewImage] = useState<string | null>(null);
|
||||
|
||||
|
||||
const resetForm = () => {
|
||||
statePuskesmas.create.form = {
|
||||
name: "",
|
||||
alamat: "",
|
||||
jam: {
|
||||
workDays: "",
|
||||
weekDays: "",
|
||||
holiday: "",
|
||||
},
|
||||
kontak: {
|
||||
kontakPuskesmas: "",
|
||||
email: "",
|
||||
facebook: "",
|
||||
kontakUGD: "",
|
||||
},
|
||||
imageId: "",
|
||||
image: undefined,
|
||||
};
|
||||
|
||||
setFile(null);
|
||||
setPreviewImage(null);
|
||||
};
|
||||
|
||||
|
||||
|
||||
const handleSubmit = async (e: React.FormEvent) => {
|
||||
e.preventDefault();
|
||||
if (!file) {
|
||||
return toast.warn("Pilih file gambar terlebih dahulu");
|
||||
}
|
||||
|
||||
// Upload gambar dulu
|
||||
const res = await ApiFetch.api.fileStorage.create.post({
|
||||
file,
|
||||
name: file.name,
|
||||
});
|
||||
|
||||
const uploaded = res.data?.data;
|
||||
if (!uploaded?.id) {
|
||||
return toast.error("Gagal upload gambar");
|
||||
}
|
||||
|
||||
statePuskesmas.create.form.imageId = uploaded.id;
|
||||
// State is already being updated directly in the form inputs
|
||||
|
||||
await statePuskesmas.create.submit();
|
||||
|
||||
toast.success("Data berhasil disimpan");
|
||||
resetForm();
|
||||
// After successful submission, redirect to the list page
|
||||
router.push('/admin/kesehatan/puskesmas');
|
||||
}
|
||||
|
||||
return (
|
||||
<Box>
|
||||
<Box component="form" onSubmit={handleSubmit}>
|
||||
<Box mb={10}>
|
||||
<Button variant="subtle" onClick={() => router.back()}>
|
||||
<IconArrowBack color={colors['blue-button']} size={25} />
|
||||
@@ -18,26 +80,80 @@ function CreatePuskesmas() {
|
||||
<Paper bg={colors['white-1']} p="md" w={{ base: '100%', md: '50%' }}>
|
||||
<Stack gap="xs">
|
||||
<Title order={3}>Create Puskesmas</Title>
|
||||
|
||||
<TextInput
|
||||
|
||||
label={<Text fz="sm" fw="bold">Judul</Text>}
|
||||
placeholder="masukkan judul"
|
||||
label={<Text fz="sm" fw="bold">Nama Puskesmas</Text>}
|
||||
placeholder="masukkan nama puskesmas"
|
||||
value={statePuskesmas.create.form.name}
|
||||
onChange={(e) => {
|
||||
statePuskesmas.create.form.name = e.target.value;
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Alamat</Text>}
|
||||
placeholder="masukkan alamat"
|
||||
value={statePuskesmas.create.form.alamat}
|
||||
onChange={(e) => {
|
||||
statePuskesmas.create.form.alamat = e.target.value;
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Jam Buka</Text>}
|
||||
placeholder="masukkan jam buka"
|
||||
value={statePuskesmas.create.form.jam.workDays}
|
||||
onChange={(e) => {
|
||||
statePuskesmas.create.form.jam.workDays = e.target.value;
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Jam Tutup</Text>}
|
||||
placeholder="masukkan jam tutup"
|
||||
value={statePuskesmas.create.form.jam.weekDays}
|
||||
onChange={(e) => {
|
||||
statePuskesmas.create.form.jam.weekDays = e.target.value;
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Holiday</Text>}
|
||||
placeholder="masukkan holiday"
|
||||
value={statePuskesmas.create.form.jam.holiday}
|
||||
onChange={(e) => {
|
||||
statePuskesmas.create.form.jam.holiday = e.target.value;
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Kontak Puskesmas</Text>}
|
||||
placeholder="masukkan kontak puskesmas"
|
||||
value={statePuskesmas.create.form.kontak.kontakPuskesmas}
|
||||
onChange={(e) => {
|
||||
statePuskesmas.create.form.kontak.kontakPuskesmas = e.target.value;
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Email</Text>}
|
||||
placeholder="masukkan email"
|
||||
value={statePuskesmas.create.form.kontak.email}
|
||||
onChange={(e) => {
|
||||
statePuskesmas.create.form.kontak.email = e.target.value;
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Facebook</Text>}
|
||||
placeholder="masukkan facebook"
|
||||
value={statePuskesmas.create.form.kontak.facebook}
|
||||
onChange={(e) => {
|
||||
statePuskesmas.create.form.kontak.facebook = e.target.value;
|
||||
}}
|
||||
/>
|
||||
<TextInput
|
||||
label={<Text fz="sm" fw="bold">Kontak UGD</Text>}
|
||||
placeholder="masukkan kontak ugd"
|
||||
value={statePuskesmas.create.form.kontak.kontakUGD}
|
||||
onChange={(e) => {
|
||||
statePuskesmas.create.form.kontak.kontakUGD = e.target.value;
|
||||
}}
|
||||
/>
|
||||
|
||||
<TextInput
|
||||
|
||||
label={<Text fz="sm" fw="bold">Deskripsi</Text>}
|
||||
placeholder="masukkan deskripsi"
|
||||
/>
|
||||
|
||||
<TextInput
|
||||
|
||||
label={<Text fz="sm" fw="bold">Kategori</Text>}
|
||||
placeholder="masukkan kategori"
|
||||
/>
|
||||
|
||||
{/* <FileInput
|
||||
<FileInput
|
||||
label={<Text fz="sm" fw="bold">Upload Gambar</Text>}
|
||||
value={file}
|
||||
onChange={async (e) => {
|
||||
@@ -48,25 +164,18 @@ function CreatePuskesmas() {
|
||||
);
|
||||
setPreviewImage(base64);
|
||||
}}
|
||||
/> */}
|
||||
/>
|
||||
|
||||
{/* {previewImage ? (
|
||||
{previewImage ? (
|
||||
<Image alt="" src={previewImage} w={200} h={200} />
|
||||
) : (
|
||||
<Center w={200} h={200} bg="gray">
|
||||
<IconImageInPicture />
|
||||
</Center>
|
||||
)} */}
|
||||
)}
|
||||
|
||||
<Box>
|
||||
<Text fz="sm" fw="bold">Konten</Text>
|
||||
<KesehatanEditor
|
||||
showSubmit={false}
|
||||
/>
|
||||
</Box>
|
||||
|
||||
<Button bg={colors['blue-button']}>
|
||||
Simpan Potensi
|
||||
<Button onClick={handleSubmit} bg={colors['blue-button']}>
|
||||
Simpan Puskesmas
|
||||
</Button>
|
||||
</Stack>
|
||||
</Paper>
|
||||
|
||||
@@ -1,70 +0,0 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Paper, Stack, Flex, Text, Image } from '@mantine/core';
|
||||
import { IconArrowBack, IconX, IconEdit } from '@tabler/icons-react';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import React from 'react';
|
||||
// import { ModalKonfirmasiHapus } from '../../../_com/modalKonfirmasiHapus';
|
||||
|
||||
function DetailPuskesmas() {
|
||||
const router = useRouter();
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
<Button variant="subtle" onClick={() => router.back()}>
|
||||
<IconArrowBack color={colors['blue-button']} size={25} />
|
||||
</Button>
|
||||
</Box>
|
||||
<Paper w={{ base: "100%", md: "50%" }} bg={colors['white-1']} p={'md'}>
|
||||
<Stack>
|
||||
<Text fz={"xl"} fw={"bold"}>Detail Potensi</Text>
|
||||
|
||||
<Paper bg={colors['BG-trans']} p={'md'}>
|
||||
<Stack gap={"xs"}>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Judul</Text>
|
||||
<Text fz={"lg"}>Test Judul</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Kategori</Text>
|
||||
<Text fz={"lg"}>Test Kategori</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Deskripsi</Text>
|
||||
<Text fz={"lg"}>Test Deskripsi</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Gambar</Text>
|
||||
<Image src={"/"} alt="gambar" />
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fz={"lg"} fw={"bold"}>Konten</Text>
|
||||
<Text fz={"lg"} >Test Konten</Text>
|
||||
</Box>
|
||||
<Box>
|
||||
<Flex gap={"xs"}>
|
||||
<Button color="red">
|
||||
<IconX size={20} />
|
||||
</Button>
|
||||
<Button onClick={() => router.push('/admin/kesehatan/puskesmas/edit')} color="green">
|
||||
<IconEdit size={20} />
|
||||
</Button>
|
||||
</Flex>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Stack>
|
||||
</Paper>
|
||||
|
||||
{/* Modal Hapus
|
||||
<ModalKonfirmasiHapus
|
||||
opened={modalHapus}
|
||||
onClose={() => setModalHapus(false)}
|
||||
onConfirm={handleHapus}
|
||||
text="Apakah anda yakin ingin menghapus potensi ini?"
|
||||
/> */}
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default DetailPuskesmas;
|
||||
@@ -1,64 +0,0 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Stack, SimpleGrid, Paper, Title, TextInput, Text, Button } from '@mantine/core';
|
||||
import { KesehatanEditor } from '../../_com/kesehatanEditor';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { IconArrowBack } from '@tabler/icons-react';
|
||||
|
||||
|
||||
function EditPuskesmas() {
|
||||
const router = useRouter();
|
||||
return (
|
||||
<Box>
|
||||
<Box mb={10}>
|
||||
<Button onClick={() => router.back()} variant='subtle' color={'blue'}>
|
||||
<IconArrowBack color={colors['blue-button']} size={25}/>
|
||||
</Button>
|
||||
</Box>
|
||||
<Stack gap={"xs"}>
|
||||
<SimpleGrid cols={{ base: 1, md: 2 }}>
|
||||
<Box>
|
||||
<Paper bg={colors['white-1']} p={"md"}>
|
||||
<Stack gap={"xs"}>
|
||||
<Title order={4}>Edit Puskesmas</Title>
|
||||
<TextInput
|
||||
label={<Text fw={"bold"} fz={"sm"}>Nama Puskesmas</Text>}
|
||||
placeholder='Masukkan nama puskesmas'
|
||||
/>
|
||||
<TextInput
|
||||
label={<Text fw={"bold"} fz={"sm"}>No Telp Puskesmas</Text>}
|
||||
placeholder='Masukkan no telp puskesmas'
|
||||
/>
|
||||
<Box>
|
||||
<Text fw={"bold"} fz={"sm"}>Deskripsi</Text>
|
||||
<KesehatanEditor
|
||||
showSubmit={false}
|
||||
/>
|
||||
</Box>
|
||||
<Box>
|
||||
<Text fw={"bold"} fz={"sm"}>Pelayanan Posyandu</Text>
|
||||
<KesehatanEditor
|
||||
showSubmit={false}
|
||||
/>
|
||||
</Box>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Box>
|
||||
<Box>
|
||||
<Paper bg={colors['white-1']} p={"md"}>
|
||||
<Stack gap={"xs"}>
|
||||
<Title order={4}>Preview Data Puskesmas</Title>
|
||||
<Text fw={"bold"} fz={"sm"}>Nama Puskesmas</Text>
|
||||
<Text fw={"bold"} fz={"sm"}>No Telp Puskesmas</Text>
|
||||
<Text fw={"bold"} fz={"sm"}>Deskripsi</Text>
|
||||
<Text fw={"bold"} fz={"sm"}>Pelayanan Posyandu</Text>
|
||||
</Stack>
|
||||
</Paper>
|
||||
</Box>
|
||||
</SimpleGrid>
|
||||
</Stack>
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
|
||||
export default EditPuskesmas;
|
||||
@@ -1,10 +1,13 @@
|
||||
'use client'
|
||||
import colors from '@/con/colors';
|
||||
import { Box, Button, Image, Paper, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr, Text } from '@mantine/core';
|
||||
import { Box, Button, Image, Paper, Skeleton, Stack, Table, TableTbody, TableTd, TableTh, TableThead, TableTr } from '@mantine/core';
|
||||
import { useShallowEffect } from '@mantine/hooks';
|
||||
import { IconDeviceImacCog, IconSearch } from '@tabler/icons-react';
|
||||
import JudulList from '../../_com/judulList';
|
||||
import HeaderSearch from '../../_com/header';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { useProxy } from 'valtio/utils';
|
||||
import HeaderSearch from '../../_com/header';
|
||||
import JudulList from '../../_com/judulList';
|
||||
import puskesmasState from '../../_state/kesehatan/puskesmas/puskesmas';
|
||||
|
||||
function Puskesmas() {
|
||||
return (
|
||||
@@ -20,7 +23,20 @@ function Puskesmas() {
|
||||
}
|
||||
|
||||
function ListPuskesmas() {
|
||||
const statePuskesmas = useProxy(puskesmasState)
|
||||
const router = useRouter();
|
||||
|
||||
useShallowEffect(() => {
|
||||
statePuskesmas.findMany.load()
|
||||
}, [])
|
||||
|
||||
if (!statePuskesmas.findMany.data) {
|
||||
return (
|
||||
<Box py={10}>
|
||||
<Skeleton h={500}/>
|
||||
</Box>
|
||||
)
|
||||
}
|
||||
return (
|
||||
<Box py={10}>
|
||||
<Paper bg={colors['white-1']} p={'md'}>
|
||||
@@ -33,28 +49,27 @@ function ListPuskesmas() {
|
||||
<Table striped withRowBorders withTableBorder style={{ minWidth: '700px' }}>
|
||||
<TableThead>
|
||||
<TableTr>
|
||||
<TableTh>Judul</TableTh>
|
||||
<TableTh>Kategori</TableTh>
|
||||
<TableTh>Nama Puskesmas</TableTh>
|
||||
<TableTh>Alamat</TableTh>
|
||||
<TableTh>Image</TableTh>
|
||||
<TableTh>Detail</TableTh>
|
||||
</TableTr>
|
||||
</TableThead>
|
||||
<TableTbody>
|
||||
<TableTr>
|
||||
{statePuskesmas.findMany.data?.map((item) => (
|
||||
<TableTr key={item.id}>
|
||||
<TableTd>{item.name}</TableTd>
|
||||
<TableTd>{item.alamat}</TableTd>
|
||||
<TableTd>
|
||||
<Box w={100}>
|
||||
<Text truncate="end" fz={"sm"}>Test</Text>
|
||||
</Box></TableTd>
|
||||
<TableTd>Test</TableTd>
|
||||
<TableTd>
|
||||
<Image w={100} src={"/"} alt="image" />
|
||||
<Image w={100} src={item.image.link} alt="image" />
|
||||
</TableTd>
|
||||
<TableTd>
|
||||
<Button onClick={() => router.push('/admin/kesehatan/puskesmas/detail')}>
|
||||
<Button onClick={() => router.push(`/admin/kesehatan/puskesmas/${item.id}`)}>
|
||||
<IconDeviceImacCog size={25} />
|
||||
</Button>
|
||||
</TableTd>
|
||||
</TableTr>
|
||||
))}
|
||||
</TableTbody>
|
||||
</Table>
|
||||
</Box>
|
||||
|
||||
@@ -42,6 +42,7 @@ function VisiMisiPPIDEdit() {
|
||||
visiMisi.findById.data.misi = draftMisi;
|
||||
visiMisi.update.save(visiMisi.findById.data);
|
||||
}
|
||||
router.push('/admin/ppid/visi-misi-ppid')
|
||||
};
|
||||
|
||||
return (
|
||||
|
||||
@@ -11,41 +11,26 @@ export const navBar = [
|
||||
},
|
||||
{
|
||||
id: "Landing_Page_2",
|
||||
name: "Penghargaan",
|
||||
path: "/admin/landing-page/penghargaan"
|
||||
},
|
||||
{
|
||||
id: "Landing_Page_3",
|
||||
name: "Layanan",
|
||||
path: "/admin/landing-page/layanan"
|
||||
},
|
||||
{
|
||||
id: "Landing_Page_4",
|
||||
name: "Potensi",
|
||||
path: "/admin/landing-page/potensi"
|
||||
},
|
||||
{
|
||||
id: "Landing_Page_5",
|
||||
name: "Desa Anti Korupsi",
|
||||
path: "/admin/landing-page/desa-anti-korupsi"
|
||||
},
|
||||
{
|
||||
id: "Landing_Page_6",
|
||||
id: "Landing_Page_3",
|
||||
name: "Indeks Kepuasan Masyarakat",
|
||||
path: "/admin/landing-page/indeks-kepuasan-masyarakat"
|
||||
},
|
||||
{
|
||||
id: "Landing_Page_7",
|
||||
id: "Landing_Page_4",
|
||||
name: "SDGs Desa",
|
||||
path: "/admin/landing-page/sdgs-desa"
|
||||
},
|
||||
{
|
||||
id: "Landing_Page_8",
|
||||
id: "Landing_Page_5",
|
||||
name: "APBDes",
|
||||
path: "/admin/landing-page/apbdes"
|
||||
},
|
||||
{
|
||||
id: "Landing_Page_9",
|
||||
id: "Landing_Page_6",
|
||||
name: "Prestasi Desa",
|
||||
path: "/admin/landing-page/prestasi-desa"
|
||||
}
|
||||
@@ -156,7 +141,7 @@ export const navBar = [
|
||||
{
|
||||
id: "Kesehatan_2",
|
||||
name: "Data Kesehatan Warga",
|
||||
path: "/admin/kesehatan/data-kesehatan-warga"
|
||||
path: "/admin/kesehatan/data-kesehatan-warga/persentase_data_kelahiran_kematian"
|
||||
},
|
||||
{
|
||||
id: "Kesehatan_3",
|
||||
|
||||
@@ -0,0 +1,64 @@
|
||||
import prisma from "@/lib/prisma";
|
||||
import { Context } from "elysia";
|
||||
|
||||
type FasilitasKesehatanInput = {
|
||||
name: string;
|
||||
informasiUmum: { fasilitas: string; alamat: string; jamOperasional: string };
|
||||
layananUnggulan: { content: string };
|
||||
dokterdanTenagaMedis: { name: string; specialist: string; jadwal: string };
|
||||
fasilitasPendukung: { content: string };
|
||||
prosedurPendaftaran: { content: string };
|
||||
tarifDanLayanan: { layanan: string; tarif: string };
|
||||
};
|
||||
|
||||
const fasilitasKesehatanCreate = async (context: Context) => {
|
||||
const body = await context.body as FasilitasKesehatanInput;
|
||||
|
||||
const {
|
||||
name,
|
||||
informasiUmum,
|
||||
layananUnggulan,
|
||||
dokterdanTenagaMedis,
|
||||
fasilitasPendukung,
|
||||
prosedurPendaftaran,
|
||||
tarifDanLayanan,
|
||||
} = body;
|
||||
|
||||
// Buat masing-masing relasi terlebih dahulu
|
||||
const [createdInformasiUmum, createdLayananUnggulan, createdDokter, createdPendukung, createdProsedur, createdTarif] = await Promise.all([
|
||||
prisma.informasiUmum.create({ data: informasiUmum }),
|
||||
prisma.layananUnggulan.create({ data: layananUnggulan }),
|
||||
prisma.dokterdanTenagaMedis.create({ data: dokterdanTenagaMedis }),
|
||||
prisma.fasilitasPendukung.create({ data: fasilitasPendukung }),
|
||||
prisma.prosedurPendaftaran.create({ data: prosedurPendaftaran }),
|
||||
prisma.tarifDanLayanan.create({ data: tarifDanLayanan }),
|
||||
]);
|
||||
|
||||
const fasilitas = await prisma.fasilitasKesehatan.create({
|
||||
data: {
|
||||
name,
|
||||
informasiUmumId: createdInformasiUmum.id,
|
||||
layananUnggulanId: createdLayananUnggulan.id,
|
||||
dokterdanTenagaMedisId: createdDokter.id,
|
||||
fasilitasPendukungId: createdPendukung.id,
|
||||
prosedurPendaftaranId: createdProsedur.id,
|
||||
tarifDanLayananId: createdTarif.id,
|
||||
},
|
||||
include: {
|
||||
informasiumum: true,
|
||||
layananunggulan: true,
|
||||
dokterdantenagamedis: true,
|
||||
fasilitaspendukung: true,
|
||||
prosedurpendaftaran: true,
|
||||
tarifdanlayanan: true,
|
||||
},
|
||||
});
|
||||
|
||||
return {
|
||||
success: true,
|
||||
message: "Fasilitas berhasil dibuat",
|
||||
data: fasilitas,
|
||||
};
|
||||
};
|
||||
|
||||
export default fasilitasKesehatanCreate;
|
||||
@@ -0,0 +1,43 @@
|
||||
import prisma from "@/lib/prisma";
|
||||
import { Context } from "elysia";
|
||||
|
||||
const fasilitasKesehatanDelete = async (context: Context) => {
|
||||
const id = context.params?.id as string;
|
||||
|
||||
if (!id) {
|
||||
return {
|
||||
status: 400,
|
||||
message: "ID tidak ditemukan",
|
||||
}
|
||||
}
|
||||
|
||||
const fasilitasKesehatan = await prisma.fasilitasKesehatan.findUnique({
|
||||
where: { id },
|
||||
include: {
|
||||
informasiumum: true,
|
||||
layananunggulan: true,
|
||||
dokterdantenagamedis: true,
|
||||
fasilitaspendukung: true,
|
||||
prosedurpendaftaran: true,
|
||||
tarifdanlayanan: true,
|
||||
}
|
||||
})
|
||||
|
||||
if (!fasilitasKesehatan) {
|
||||
return {
|
||||
status: 404,
|
||||
message: "Fasilitas kesehatan tidak ditemukan",
|
||||
}
|
||||
}
|
||||
|
||||
await prisma.fasilitasKesehatan.delete({
|
||||
where: { id },
|
||||
})
|
||||
|
||||
return {
|
||||
status: 200,
|
||||
success: true,
|
||||
message: "Fasilitas kesehatan berhasil dihapus",
|
||||
}
|
||||
}
|
||||
export default fasilitasKesehatanDelete
|
||||
@@ -1,31 +0,0 @@
|
||||
import prisma from "@/lib/prisma";
|
||||
import { Prisma } from "@prisma/client";
|
||||
import { Context } from "elysia";
|
||||
|
||||
type FormCreate = Prisma.DokterdanTenagaMedisGetPayload<{
|
||||
select: {
|
||||
name: true
|
||||
specialist: true
|
||||
jadwal: true
|
||||
}
|
||||
}>
|
||||
|
||||
async function dokterDantenagamedisCreate(context: Context) {
|
||||
const body = context.body as FormCreate
|
||||
|
||||
await prisma.dokterdanTenagaMedis.create({
|
||||
data: {
|
||||
name: body.name,
|
||||
specialist: body.specialist,
|
||||
jadwal: body.jadwal,
|
||||
}
|
||||
})
|
||||
return {
|
||||
success: true,
|
||||
message: "Success create dokter dan tenaga medis",
|
||||
data: {
|
||||
...body
|
||||
}
|
||||
}
|
||||
}
|
||||
export default dokterDantenagamedisCreate
|
||||
@@ -1,8 +0,0 @@
|
||||
import prisma from "@/lib/prisma";
|
||||
|
||||
export default async function dokterDantenagamedisFindMany() {
|
||||
const res = await prisma.dokterdanTenagaMedis.findMany();
|
||||
return {
|
||||
data: res
|
||||
}
|
||||
}
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user