Files
asset-management-system/resources/views/rbac/permissions/index.blade.php

142 lines
6.7 KiB
PHP

@extends('layouts.master')
@section('content')
<div class="d-flex align-items-center justify-content-between mb-3 page-header-breadcrumb flex-wrap gap-2">
<div>
<h1 class="page-title fw-medium fs-20 mb-0">Permission Management</h1>
<p class="text-muted mb-0">Kelola daftar izin yang akan di-attach ke role.</p>
</div>
</div>
<div class="row">
<div class="col-12">
<div class="card custom-card">
<div class="card-header d-flex align-items-center justify-content-between">
<div>
<div class="card-title">Permissions</div>
<div class="card-subtitle">Gunakan nama yang konsisten, mis: asset.create, user.manage.</div>
</div>
<button class="btn btn-primary btn-wave" data-bs-toggle="modal" data-bs-target="#createPermissionModal">
<i class="ri-add-line me-1"></i>Tambah Permission
</button>
</div>
<div class="card-body">
@if(session('success'))
<div class="alert alert-success alert-dismissible" role="alert">
{{ session('success') }}
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
@endif
@if($errors->any())
<div class="alert alert-danger">
<ul class="mb-0">
@foreach($errors->all() as $error)
<li>{{ $error }}</li>
@endforeach
</ul>
</div>
@endif
<div class="table-responsive">
<table class="table table-bordered align-middle">
<thead class="table-light">
<tr>
<th>Permission</th>
<th class="text-center" style="width: 10%;">Aksi</th>
</tr>
</thead>
<tbody>
@forelse($permissions as $permission)
<tr>
<td class="fw-semibold">{{ $permission->name }}</td>
<td class="text-center">
<button class="btn btn-sm btn-outline-primary"
data-bs-toggle="modal"
data-bs-target="#editPermissionModal"
data-id="{{ $permission->getKey() }}"
data-name="{{ $permission->name }}">
Edit
</button>
</td>
</tr>
@empty
<tr>
<td colspan="2" class="text-center text-muted">Belum ada permission.</td>
</tr>
@endforelse
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
{{-- Modal create --}}
<div class="modal fade" id="createPermissionModal" tabindex="-1" aria-labelledby="createPermissionModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Tambah Permission</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<form action="{{ route('permissions.store') }}" method="POST">
@csrf
<div class="modal-body">
<div class="mb-3">
<label class="form-label">Nama Permission</label>
<input type="text" name="name" class="form-control" placeholder="mis: asset.view" required>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Batal</button>
<button type="submit" class="btn btn-primary">Simpan</button>
</div>
</form>
</div>
</div>
</div>
{{-- Modal edit --}}
<div class="modal fade" id="editPermissionModal" tabindex="-1" aria-labelledby="editPermissionModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Edit Permission</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<form id="editPermissionForm" method="POST">
@csrf
@method('PUT')
<div class="modal-body">
<div class="mb-3">
<label class="form-label">Nama Permission</label>
<input type="text" name="name" id="editPermissionName" class="form-control" required>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Batal</button>
<button type="submit" class="btn btn-primary">Update</button>
</div>
</form>
</div>
</div>
</div>
@endsection
@section('scripts')
<script>
const editPermissionModal = document.getElementById('editPermissionModal');
if (editPermissionModal) {
editPermissionModal.addEventListener('show.bs.modal', function (event) {
const button = event.relatedTarget;
const form = document.getElementById('editPermissionForm');
form.action = "{{ url('permissions') }}/" + button.getAttribute('data-id');
document.getElementById('editPermissionName').value = button.getAttribute('data-name');
});
}
</script>
@endsection