feat: Tambahkan fitur untuk menampilkan roles dan users
marszayn
parent
994496d1ba
commit
d2102bfb5d
|
|
@ -27,13 +27,27 @@ class HandleInertiaRequests extends Middleware
|
|||
*
|
||||
* @return array<string, mixed>
|
||||
*/
|
||||
// public function share(Request $request): array
|
||||
// {
|
||||
// return [
|
||||
// ...parent::share($request),
|
||||
// 'auth' => [
|
||||
// 'user' => $request->user(),
|
||||
// ],
|
||||
// ];
|
||||
// }
|
||||
|
||||
public function share(Request $request): array
|
||||
{
|
||||
return [
|
||||
...parent::share($request),
|
||||
return array_merge(parent::share($request), [
|
||||
'auth' => [
|
||||
'user' => $request->user(),
|
||||
'user' => $request->user() ? [
|
||||
'id' => $request->user()->id,
|
||||
'name' => $request->user()->name,
|
||||
'permissions' => $request->user()->getPermissionArray(), // Kirim permissions
|
||||
] : null,
|
||||
],
|
||||
];
|
||||
]);
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@ class RoleRequest extends FormRequest
|
|||
*/
|
||||
public function authorize(): bool
|
||||
{
|
||||
return false;
|
||||
return true;
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
|
|||
|
|
@ -46,4 +46,16 @@ class User extends Authenticatable /*implements MustVerifyEmail*/
|
|||
'password' => 'hashed',
|
||||
];
|
||||
}
|
||||
|
||||
public function getPermissionArray()
|
||||
{
|
||||
|
||||
return $this->getAllPermissions()->mapWithKeys(function ($permission) {
|
||||
return [$permission->name => true];
|
||||
})->toArray();
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -13,7 +13,6 @@ return Application::configure(basePath: dirname(__DIR__))
|
|||
)
|
||||
->withMiddleware(function (Middleware $middleware) {
|
||||
$middleware->web(append: [
|
||||
\App\Http\Middleware\HandleInertiaRequests::class,
|
||||
\Illuminate\Http\Middleware\AddLinkHeadersForPreloadedAssets::class,
|
||||
HandleInertiaRequests::class,
|
||||
]);
|
||||
|
|
@ -22,6 +21,7 @@ return Application::configure(basePath: dirname(__DIR__))
|
|||
'role' => \Spatie\Permission\Middleware\RoleMiddleware::class,
|
||||
'permission' => \Spatie\Permission\Middleware\PermissionMiddleware::class,
|
||||
'role_or_permission' => \Spatie\Permission\Middleware\RoleOrPermissionMiddleware::class,
|
||||
//'auth' => \App\Http\Middleware\HandleInertiaRequests::class,//harus nya gini sih, karena di route nya lu pake middleware auth
|
||||
]);
|
||||
})
|
||||
->withExceptions(function (Exceptions $exceptions) {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,157 @@
|
|||
import AuthenticatedLayout from "@/layouts/authenticated-layout";
|
||||
import { Head, usePage, router } from "@inertiajs/react";
|
||||
import React, { useState } from "react";
|
||||
import hasAnyPermission from "@/utils/hasAnyPermission";
|
||||
import {
|
||||
Dialog,
|
||||
DialogContent,
|
||||
DialogDescription,
|
||||
DialogFooter,
|
||||
DialogHeader,
|
||||
DialogTitle,
|
||||
} from "@/components/ui/dialog";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import Pagination from "@/components/pagination";
|
||||
|
||||
export default function RolesIndex() {
|
||||
const { roles } = usePage().props;
|
||||
const [dialogOpen, setDialogOpen] = useState(false);
|
||||
const [roleToDelete, setRoleToDelete] = useState(null);
|
||||
|
||||
const handleDelete = (id) => {
|
||||
setRoleToDelete(id);
|
||||
setDialogOpen(true);
|
||||
};
|
||||
|
||||
const confirmDelete = () => {
|
||||
router.delete(`/admin/roles/${roleToDelete}`, {
|
||||
onSuccess: () => {
|
||||
setDialogOpen(false);
|
||||
setRoleToDelete(null);
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<AuthenticatedLayout header="Kelompok Pengguna">
|
||||
<Head title="Kelompok Pengguna" />
|
||||
|
||||
<div className="container mx-auto p-4">
|
||||
<div className="row mb-3">
|
||||
<div className="col-md-12">
|
||||
<div className="d-flex justify-content-between align-items-center">
|
||||
{hasAnyPermission(["Roles.index"]) && (
|
||||
<Link
|
||||
href="/admin/role/create"
|
||||
className="btn btn-success"
|
||||
>
|
||||
<i className="bi bi-plus-circle-fill me-2"></i>
|
||||
Add Role
|
||||
</Link>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="card border rounded">
|
||||
<div className="card-body p-0">
|
||||
<div className="table-responsive p-4">
|
||||
<table className="table align-middle">
|
||||
<thead className="table-light">
|
||||
<tr>
|
||||
<th scope="col" className="text-center">
|
||||
No.
|
||||
</th>
|
||||
<th scope="col">Role Name</th>
|
||||
<th scope="col">Permissions</th>
|
||||
<th scope="col" className="text-center">
|
||||
Actions
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{roles.data.map((role, index) => (
|
||||
<tr key={role.id}>
|
||||
<td className="text-center">
|
||||
{index +
|
||||
1 +
|
||||
(roles.current_page - 1) *
|
||||
roles.per_page}
|
||||
</td>
|
||||
<td>{role.name}</td>
|
||||
<td>
|
||||
<div className="d-flex flex-wrap gap-1">
|
||||
{role.permissions.map(
|
||||
(permission, i) => (
|
||||
<span
|
||||
key={i}
|
||||
className="badge bg-success text-white badge-lg"
|
||||
>
|
||||
{
|
||||
permission.name
|
||||
}
|
||||
</span>
|
||||
)
|
||||
)}
|
||||
</div>
|
||||
</td>
|
||||
<td className="text-center">
|
||||
{/* {hasAnyPermission([
|
||||
"roles.edit",
|
||||
]) && ( */}
|
||||
<Link
|
||||
href={`/admin/roles/${role.id}/edit`}
|
||||
className="btn btn-primary btn-md me-2"
|
||||
>
|
||||
<i className="bi bi-pencil"></i>{" "}
|
||||
Edit
|
||||
</Link>
|
||||
{/* )} */}
|
||||
{/* {hasAnyPermission([
|
||||
"roles.delete",
|
||||
]) && ( */}
|
||||
<button
|
||||
onClick={() =>
|
||||
handleDelete(role.id)
|
||||
}
|
||||
className="btn btn-danger btn-md"
|
||||
>
|
||||
<i className="bi bi-trash"></i>{" "}
|
||||
Delete
|
||||
</button>
|
||||
{/* )} */}
|
||||
</td>
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<Pagination links={roles.links} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<Dialog open={dialogOpen} onOpenChange={setDialogOpen}>
|
||||
<DialogContent>
|
||||
<DialogHeader>
|
||||
<DialogTitle>Apakah Anda yakin?</DialogTitle>
|
||||
<DialogDescription>
|
||||
Data ini akan dihapus secara permanen!
|
||||
</DialogDescription>
|
||||
</DialogHeader>
|
||||
<DialogFooter>
|
||||
<Button
|
||||
variant="outline"
|
||||
onClick={() => setDialogOpen(false)}
|
||||
>
|
||||
Batal
|
||||
</Button>
|
||||
<Button variant="destructive" onClick={confirmDelete}>
|
||||
Ya, hapus!
|
||||
</Button>
|
||||
</DialogFooter>
|
||||
</DialogContent>
|
||||
</Dialog>
|
||||
</AuthenticatedLayout>
|
||||
);
|
||||
}
|
||||
Loading…
Reference in New Issue