Tambahkan fitur hapus data mata uang secara batch
- Menambahkan endpoint `deleteMultiple` pada CurrencyController untuk menghapus beberapa data secara bersamaan. - Memperbarui tampilan index mata uang untuk mendukung fungsi hapus batch, termasuk tombol "Delete Selected". - Menambahkan logika pada JavaScript untuk menangani penghapusan batch menggunakan AJAX. - Memperbarui visibilitas tombol hapus berdasarkan checkbox yang dipilih pada tabel.
This commit is contained in:
@@ -82,6 +82,13 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
public function deleteMultiple(Request $request)
|
||||||
|
{
|
||||||
|
$ids = $request->input('ids');
|
||||||
|
Currency::whereIn('id', $ids)->delete();
|
||||||
|
return response()->json(['message' => 'Currencies deleted successfully']);
|
||||||
|
}
|
||||||
|
|
||||||
public function dataForDatatables(Request $request)
|
public function dataForDatatables(Request $request)
|
||||||
{
|
{
|
||||||
if (is_null($this->user) || !$this->user->can('currency.view')) {
|
if (is_null($this->user) || !$this->user->can('currency.view')) {
|
||||||
|
|||||||
@@ -21,6 +21,7 @@
|
|||||||
<div class="h-[24px] border border-r-gray-200"></div>
|
<div class="h-[24px] border border-r-gray-200"></div>
|
||||||
<a class="btn btn-sm btn-light" href="{{ route('basicdata.currency.export') }}"> Export to Excel </a>
|
<a class="btn btn-sm btn-light" href="{{ route('basicdata.currency.export') }}"> Export to Excel </a>
|
||||||
<a class="btn btn-sm btn-primary" href="{{ route('basicdata.currency.create') }}"> Tambah Mata Uang </a>
|
<a class="btn btn-sm btn-primary" href="{{ route('basicdata.currency.create') }}"> Tambah Mata Uang </a>
|
||||||
|
<button class="btn btn-sm btn-danger hidden" id="deleteSelected" onclick="deleteSelectedRows()">Delete Selected</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -97,10 +98,51 @@
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function deleteSelectedRows() {
|
||||||
|
const selectedCheckboxes = document.querySelectorAll('input[data-datatable-row-check="true"]:checked');
|
||||||
|
if (selectedCheckboxes.length === 0) {
|
||||||
|
Swal.fire('Warning', 'Please select at least one row to delete.', 'warning');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
Swal.fire({
|
||||||
|
title: 'Are you sure?',
|
||||||
|
text: `You are about to delete ${selectedCheckboxes.length} selected row(s). This action cannot be undone!`,
|
||||||
|
icon: 'warning',
|
||||||
|
showCancelButton: true,
|
||||||
|
confirmButtonColor: '#3085d6',
|
||||||
|
cancelButtonColor: '#d33',
|
||||||
|
confirmButtonText: 'Yes, delete them!'
|
||||||
|
}).then((result) => {
|
||||||
|
if (result.isConfirmed) {
|
||||||
|
const ids = Array.from(selectedCheckboxes).map(checkbox => checkbox.value);
|
||||||
|
|
||||||
|
$.ajaxSetup({
|
||||||
|
headers: {
|
||||||
|
'X-CSRF-TOKEN': '{{ csrf_token() }}'
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
$.ajax('{{ route("basicdata.currency.deleteMultiple") }}', {
|
||||||
|
type: 'POST',
|
||||||
|
data: { ids: ids }
|
||||||
|
}).then((response) => {
|
||||||
|
Swal.fire('Deleted!', 'Selected rows have been deleted.', 'success').then(() => {
|
||||||
|
window.location.reload();
|
||||||
|
});
|
||||||
|
}).catch((error) => {
|
||||||
|
console.error('Error:', error);
|
||||||
|
Swal.fire('Error!', 'An error occurred while deleting the rows.', 'error');
|
||||||
|
});
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
<script type="module">
|
<script type="module">
|
||||||
const element = document.querySelector('#currency-table');
|
const element = document.querySelector('#currency-table');
|
||||||
const searchInput = document.getElementById('search');
|
const searchInput = document.getElementById('search');
|
||||||
|
const deleteSelectedButton = document.getElementById('deleteSelected');
|
||||||
|
|
||||||
const apiUrl = element.getAttribute('data-api-url');
|
const apiUrl = element.getAttribute('data-api-url');
|
||||||
const dataTableOptions = {
|
const dataTableOptions = {
|
||||||
@@ -147,8 +189,34 @@
|
|||||||
searchInput.addEventListener('input', function () {
|
searchInput.addEventListener('input', function () {
|
||||||
const searchValue = this.value.trim();
|
const searchValue = this.value.trim();
|
||||||
dataTable.search(searchValue, true);
|
dataTable.search(searchValue, true);
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
function updateDeleteButtonVisibility() {
|
||||||
|
const selectedCheckboxes = document.querySelectorAll('input[data-datatable-row-check="true"]:checked');
|
||||||
|
if (selectedCheckboxes.length > 0) {
|
||||||
|
deleteSelectedButton.classList.remove('hidden');
|
||||||
|
} else {
|
||||||
|
deleteSelectedButton.classList.add('hidden');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Initial call to set button visibility
|
||||||
|
updateDeleteButtonVisibility();
|
||||||
|
|
||||||
|
// Add event listener to the table for checkbox changes
|
||||||
|
element.addEventListener('change', function(event) {
|
||||||
|
if (event.target.matches('input[data-datatable-row-check="true"]')) {
|
||||||
|
updateDeleteButtonVisibility();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
// Add event listener for the "select all" checkbox
|
||||||
|
const selectAllCheckbox = element.querySelector('input[data-datatable-check="true"]');
|
||||||
|
if (selectAllCheckbox) {
|
||||||
|
selectAllCheckbox.addEventListener('change', updateDeleteButtonVisibility);
|
||||||
|
}
|
||||||
|
|
||||||
|
window.dataTable = dataTable;
|
||||||
</script>
|
</script>
|
||||||
@endpush
|
@endpush
|
||||||
|
|
||||||
|
|||||||
@@ -22,6 +22,7 @@
|
|||||||
Route::get('restore/{id}', [CurrencyController::class, 'restore'])->name('restore');
|
Route::get('restore/{id}', [CurrencyController::class, 'restore'])->name('restore');
|
||||||
Route::get('datatables', [CurrencyController::class, 'dataForDatatables'])->name('datatables');
|
Route::get('datatables', [CurrencyController::class, 'dataForDatatables'])->name('datatables');
|
||||||
Route::get('export', [CurrencyController::class, 'export'])->name('export');
|
Route::get('export', [CurrencyController::class, 'export'])->name('export');
|
||||||
|
Route::post('delete-multiple', [CurrencyController::class, 'deleteMultiple'])->name('deleteMultiple');
|
||||||
});
|
});
|
||||||
|
|
||||||
Route::resource('mata-uang', CurrencyController::class, [
|
Route::resource('mata-uang', CurrencyController::class, [
|
||||||
|
|||||||
Reference in New Issue
Block a user