create loading and handle from js create edit and delete roles

This commit is contained in:
arifal
2025-02-11 23:40:31 +07:00
parent 2bf4b8b327
commit 1a15bc03f8
20 changed files with 422 additions and 153 deletions

View File

@@ -4,11 +4,12 @@
@include('layouts.partials/page-title', ['title' => 'Settings', 'subtitle' => 'Role'])
<x-toast-notification />
<div class="row d-flex justify-content-center">
<div class="col-md-6">
<div class="card">
<div class="card-body">
<form action="{{route("roles.store")}}" method="post">
<form action="{{route("roles.store")}}" method="post" id="formCreateRole" data-redirect="{{route("roles.index")}}">
@csrf
<div class="mb-3">
<label class="form-label" for="name">Name</label>
@@ -20,7 +21,10 @@
<input type="text" id="description" name="description"
class="form-control" placeholder="Enter description">
</div>
<button type="submit" class="btn btn-success">Create</button>
<button class="btn btn-primary me-1" type="button" id="btnCreateRole">
<span id="spinner" class="spinner-border spinner-border-sm me-1 d-none" role="status" aria-hidden="true"></span>
Create
</button>
</form>
</div>
</div>
@@ -28,3 +32,7 @@
</div>
@endsection
@section('scripts')
@vite(['resources/js/roles/create.js'])
@endsection

View File

@@ -4,11 +4,12 @@
@include('layouts.partials/page-title', ['title' => 'Settings', 'subtitle' => 'Role'])
<x-toast-notification/>
<div class="row d-flex justify-content-center">
<div class="col-md-6">
<div class="card">
<div class="card-body">
<form action="{{route("roles.update", $role->id)}}" method="post">
<form id="formUpdateRole" action="{{route("roles.update", $role->id)}}" method="post" >
@csrf
@method("put")
<div class="mb-3">
@@ -21,7 +22,10 @@
<input type="text" id="description" name="description"
class="form-control" placeholder="Enter description" value="{{$role->description}}">
</div>
<button type="submit" class="btn btn-success">Update</button>
<button class="btn btn-primary me-1" type="button" id="btnUpdateRole">
<span id="spinner" class="spinner-border spinner-border-sm me-1 d-none" role="status" aria-hidden="true"></span>
Update
</button>
</form>
</div>
</div>
@@ -29,3 +33,6 @@
</div>
@endsection
@section('scripts')
@vite(['resources/js/roles/update.js'])
@endsection

View File

@@ -8,12 +8,17 @@
@include('layouts.partials/page-title', ['title' => 'Settings', 'subtitle' => 'Role'])
<x-toast-notification/>
<x-modal-confirmation buttonText="Delete" confirmationMessage="Are you sure you want to delete this?" />
<div class="row">
<div class="d-flex justify-content-end pb-3">
<a href="{{ route('roles.create')}}" class="btn btn-success width-lg">Create</a>
</div>
<div>
<div id="table-roles"></div>
<div class="card w-full">
<div class="card-body">
<div class="d-flex justify-content-end pb-3">
<a href="{{ route('roles.create')}}" class="btn btn-success width-lg">Create</a>
</div>
<div id="table-roles"></div>
</div>
</div>
</div>