daengdeni/lpj
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

perbaikan activity pemohonan ( seacrh filter status multiple, Penilai/Surveyor tidak tampil dan status aktivitas pada permohonan akan berjalan dari bawah ke atas)

Browse Source
This commit is contained in:
majid
2024-09-27 15:08:13 +07:00
parent d4ab7033c9
commit 5fcce527b4
10 changed files with 307 additions and 180 deletions
Download Patch File Download Diff File Expand all files Collapse all files

118
resources/views/activity/index.blade.php
View File

@@ -4,16 +4,45 @@
{{ Breadcrumbs::render('activity') }}
@endsection
@section('content')
@push('styles')
<style>
.dropdown {
position: relative;
display: inline-block;
}
.dropdowns-content {
display: none;
position: absolute;
background-color: white;
min-width: 224px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: 1;
}
.dropdown:hover .dropdowns-content {
display: block;
}
.dropdowns-content a {
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
}
.dropdowns-content a:hover {
background-color: #f1f1f1;
}
</style>
@endpush
<div class="w-full grid gap-5 lg:gap-7.5 mx-auto">
<div class="card pb-2.5">
<div class="card-header" id="basic_settings">
<div class="card-title flex flex-row gap-1.5">
Activity
</div>
<div class="card-header py-5 flex-wrap">
<h3 class="card-title">
{{-- Daftar {{}} --}}
</h3>
<div class="flex flex-wrap gap-2 lg:gap-5">
<div class="flex">
<label class="input input-sm">
@@ -22,14 +51,42 @@
</label>
</div>
<div class="flex">
<select class="select select-sm w-28" name="select" id="status-filter">
<option value="">Pilih Status</option>
@foreach ($status_permohonan as $item)
<option value="{{ strtolower($item->name) }}">{{ $item->name }}</option>
@endforeach
</select>
<div class="dropdown" data-dropdown="true" data-dropdown-trigger="click">
<button
class="dropdowns-toggle btn btn-sm btn-light inline-flex justify-between w-full items-center">
Pilih Status
<i class="ki-outline ki-down dropdown-open:hidden">
</i>
<i class="ki-outline ki-up hidden dropdown-open:block">
</i>
</button>
<div
class="dropdowns-content w-full max-w-56 py-2 absolute mt-2 origin-top-right z-50 bg-white rounded-md shadow-lg ring-1 ring-black ring-opacity-5">
<div class="menu menu-default flex flex-col w-full">
<!-- Checkbox untuk All Status -->
<div class="menu-item">
<label class="menu-link flex items-center px-4 py-2 text-sm text-gray-700">
<input id="select-all" type="checkbox"
class="form-checkbox h-4 w-4 text-blue-600">
<span class="ml-2">All Status</span>
</label>
</div>
<!-- Dinamis Status dari Backend -->
@foreach ($status_permohonan as $item)
<div class="menu-item">
<label class="menu-link flex items-center px-4 py-2 text-sm text-gray-700">
<input type="checkbox"
class="form-checkbox status-checkbox h-4 w-4 text-blue-600"
value="{{ strtolower($item->name) }}">
<span class="ml-2">{{ $item->name }}</span>
</label>
</div>
@endforeach
</div>
</div>
</div>
<div class="flex flex-wrap gap-2.5">
<div class="h-[24px] border border-r-gray-200"></div>
<a class="btn btn-sm btn-light" href="{{ route('activity.export') }}"> Export to Excel </a>
@@ -203,9 +260,44 @@
dataTable.search(searchValue, true);
});
statusFilter.addEventListener('change', function() {
const selectedStatus = this.value;
dataTable.search(selectedStatus);
const selectAllCheckbox = document.getElementById('select-all');
const statusCheckboxes = document.querySelectorAll('.status-checkbox');
statusCheckboxes.forEach(checkbox => {
checkbox.addEventListener('change', applyStatusFilter);
});
// Event listener untuk "Select All"
selectAllCheckbox.addEventListener('change', function() {
const isChecked = this.checked;
statusCheckboxes.forEach(checkbox => {
checkbox.checked = isChecked;
});
applyStatusFilter();
});
function applyStatusFilter() {
const selectedStatuses = Array.from(statusCheckboxes)
.filter(checkbox => checkbox.checked)
.map(checkbox => checkbox.value);
if (selectedStatuses.length === 0) {
dataTable.search('');
console.log(selectedStatuses);
} else {
dataTable.search(selectedStatuses.join(','), true);
console.log(selectedStatuses);
}
const allChecked = Array.from(statusCheckboxes).every(cb => cb.checked);
selectAllCheckbox.checked = allChecked;
}
</script>
@endpush