upd: dashboard admin

Deskripsi:
- tambah role user
- api edit tambah dan delete role user

NO Issues
This commit is contained in:
2025-11-24 17:40:27 +08:00
parent 10db3f922e
commit ad7b40523c
4 changed files with 246 additions and 100 deletions

View File

@@ -7,12 +7,11 @@ import {
Group,
Input,
Modal,
Select,
Stack,
Table,
Text,
Title,
Tooltip,
Tooltip
} from "@mantine/core";
import { useDisclosure, useShallowEffect } from "@mantine/hooks";
import { IconEdit, IconPlus, IconTrash } from "@tabler/icons-react";
@@ -21,6 +20,7 @@ import { useState } from "react";
import useSWR from "swr";
import notification from "./notificationGlobal";
import PermissionRole from "./PermissionRole";
import PermissionTree from "./PermissionTree";
export default function UserRoleSetting({ permissions }: { permissions: JsonValue[] }) {
const [btnDisable, setBtnDisable] = useState(true);
@@ -44,23 +44,15 @@ export default function UserRoleSetting({ permissions }: { permissions: JsonValu
const [dataEdit, setDataEdit] = useState({
id: "",
name: "",
phone: "",
email: "",
roleId: "",
permissions: [],
});
const [dataTambah, setDataTambah] = useState({
name: "",
email: "",
roleId: "",
password: "",
phone: "",
permissions: [],
});
const [error, setError] = useState({
name: false,
email: false,
roleId: false,
password: false,
phone: false,
permissions: false,
});
useShallowEffect(() => {
@@ -70,16 +62,13 @@ export default function UserRoleSetting({ permissions }: { permissions: JsonValu
async function handleCreate() {
try {
setBtnLoading(true);
const res = await apiFetch.api.user.create.post(dataTambah);
const res = await apiFetch.api.user["role-create"].post(dataTambah as any);
if (res.status === 200) {
mutate();
closeTambah();
setDataTambah({
name: "",
email: "",
roleId: "",
password: "",
phone: "",
permissions: [],
});
notification({
title: "Success",
@@ -139,19 +128,19 @@ export default function UserRoleSetting({ permissions }: { permissions: JsonValu
async function handleDelete() {
try {
setBtnLoading(true);
const res = await apiFetch.api.user.delete.post({ id: dataDelete });
const res = await apiFetch.api.user["role-delete"].post({ id: dataDelete });
if (res.status === 200) {
mutate();
closeDelete();
notification({
title: "Success",
message: "Your user have been deleted",
message: "Your role have been deleted",
type: "success",
});
} else {
notification({
title: "Error",
message: "Failed to delete user",
message: "Failed to delete role",
type: "error",
});
}
@@ -159,7 +148,7 @@ export default function UserRoleSetting({ permissions }: { permissions: JsonValu
console.error(error);
notification({
title: "Error",
message: "Failed to delete user",
message: "Failed to delete role",
type: "error",
});
} finally {
@@ -173,24 +162,14 @@ export default function UserRoleSetting({ permissions }: { permissions: JsonValu
data: {
id: string;
name: string;
phone: string;
email: string;
roleId: string;
permissions: [];
};
}) {
setDataEdit(data);
open();
}
function onValidation({
kat,
value,
aksi,
}: {
kat: "name" | "email" | "roleId" | "password" | "phone";
value: string | null;
aksi: "edit" | "tambah";
}) {
function onValidation({ kat, value, aksi, }: { kat: "name" | "permission"; value: string | null; aksi: "edit" | "tambah"; }) {
if (value == null || value.length < 1) {
setBtnDisable(true);
setError({ ...error, [kat]: true });
@@ -206,6 +185,8 @@ export default function UserRoleSetting({ permissions }: { permissions: JsonValu
}
}
console.log("dataTambah", dataTambah);
useShallowEffect(() => {
if (dataEdit.name.length > 0) {
setBtnDisable(false);
@@ -275,68 +256,12 @@ export default function UserRoleSetting({ permissions }: { permissions: JsonValu
}
/>
</Input.Wrapper>
<Select
label="Role"
placeholder="Pilih Role"
data={listRole.map((r: any) => ({
value: r.id,
label: r.name,
}))}
value={dataTambah.roleId || null}
error={error.roleId ? "Field is required" : ""}
onChange={(_value, option) => {
onValidation({
kat: "roleId",
value: option?.value,
aksi: "tambah",
});
<PermissionTree
selected={dataTambah.permissions}
onChange={(permissions) => {
setDataTambah({ ...dataTambah, permissions: permissions as never[] });
}}
/>
<Input.Wrapper label="Phone" description="">
<Input
value={dataTambah.phone}
onChange={(e) =>
onValidation({
kat: "phone",
value: e.target.value,
aksi: "tambah",
})
}
/>
</Input.Wrapper>
<Input.Wrapper
label="Email"
description=""
error={error.email ? "Field is required" : ""}
>
<Input
value={dataTambah.email}
onChange={(e) =>
onValidation({
kat: "email",
value: e.target.value,
aksi: "tambah",
})
}
/>
</Input.Wrapper>
<Input.Wrapper
label="Password"
description=""
error={error.password ? "Field is required" : ""}
>
<Input
value={dataTambah.password}
onChange={(e) =>
onValidation({
kat: "password",
value: e.target.value,
aksi: "tambah",
})
}
/>
</Input.Wrapper>
<Group justify="center" grow>
<Button variant="light" onClick={closeTambah}>
Batal
@@ -347,10 +272,7 @@ export default function UserRoleSetting({ permissions }: { permissions: JsonValu
disabled={
btnDisable ||
dataTambah.name.length < 1 ||
dataTambah.email.length < 1 ||
dataTambah.password.length < 1 ||
dataTambah.roleId.length < 1 ||
dataTambah.phone.length < 1
dataTambah.permissions.length < 1
}
loading={btnLoading}
>
@@ -369,7 +291,7 @@ export default function UserRoleSetting({ permissions }: { permissions: JsonValu
>
<Stack gap="md">
<Text size="md" color="gray.6">
Apakah anda yakin ingin menghapus user ini?
Apakah anda yakin ingin menghapus role ini?
</Text>
<Group justify="center" grow>
<Button variant="light" onClick={closeDelete}>