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

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

View File

@@ -13,108 +13,115 @@
</style>
@endpush
<div class="w-full grid gap-5 lg:gap-7.5 mx-auto">
<div class="card">
<div class="card-header" id="advanced_settings_appearance">
<h3 class="card-title">
Activity Permohonan
</h3>
<div class="flex items-center gap-2">
<a href="{{ route('activity.index') }}" class="btn btn-xs btn-info"><i class="ki-filled ki-exit-left"></i>
Back</a>
<div class="card">
<div class="card-header" id="advanced_settings_appearance">
<h3 class="card-title">
Activity Permohonan
</h3>
<div class="flex items-center gap-2">
<a href="{{ route('activity.index') }}" class="btn btn-xs btn-info"><i class="ki-filled ki-exit-left"></i>
Back</a>
</div>
</div>
<div class="card-body lg:py-7.5 grid grid-cols-3">
<div class="mb-5">
<h3 class="text-md font-medium text-gray-900">
Nomor Register Permohonan:
</h3>
<span class="text-2sm text-gray-700">
{{ $permohonan->nomor_registrasi }}
</span>
</div>
<div class="mb-5">
<h3 class="text-md font-medium text-gray-900">
Pemohon:
</h3>
<span class="text-2sm text-gray-700">
{{ $permohonan->user->nik }} | {{ $permohonan->user->name }} | {{ $permohonan->user->branch->name }}
</span>
</div>
<div class="mb-5">
<h3 class="text-md font-medium text-gray-900">
Tujuan Permohonan:
</h3>
<span class="text-2sm text-gray-700">
{{ $permohonan->tujuanPenilaian->name }}
</span>
</div>
</div>
</div>
<div class="card-body lg:py-7.5 grid grid-cols-3">
<div class="mb-5">
<div class="card grow" id="activity_2024">
<div class="card-header">
<h3 class="text-md font-medium text-gray-900">
Nomor Register Permohonan:
Status Activity
</h3>
<span class="text-2sm text-gray-700">
{{ $permohonan->nomor_registrasi }}
</span>
</div>
<div class="mb-5">
<h3 class="text-md font-medium text-gray-900">
Pemohon:
</h3>
<span class="text-2sm text-gray-700">
{{ $permohonan->user->nik }} | {{ $permohonan->user->name }} | {{ $permohonan->user->branch->name }}
</span>
</div>
<div class="mb-5">
<h3 class="text-md font-medium text-gray-900">
Tujan Permohonan:
</h3>
<span class="text-2sm text-gray-700">
{{ $permohonan->tujuanPenilaian->name }}
</span>
</div>
</div>
</div>
<div class="card grow" id="activity_2024">
<div class="card-header">
<h3 class="text-md font-medium text-gray-900">
Status Activity
</h3>
</div>
<div class="card-body">
<div class="flex flex-col">
@foreach ($status_permohonan as $index => $status)
{{-- Cek apakah status adalah "Revisi" dan status permohonan tidak sama, maka tidak ditampilkan --}}
@if (strtolower($status->name) == 'revisi' && strtolower($status->name) != strtolower($permohonan->status))
@continue
@endif
<div class="flex items-start relative">
@if ($index < count($status_permohonan) - 1)
<div
class="w-9 left-0 top-9 absolute bottom-0 translate-x-1/2
{{ strtolower($status->name) == strtolower($permohonan->status) ? 'border-l border-l-primary' : 'border-l border-l-gray-300' }}">
</div>
<div class="card-body">
<div class="flex flex-col">
@foreach ($status_permohonan as $index => $status)
{{-- Cek apakah status adalah "Revisi" dan status permohonan tidak sama, maka tidak ditampilkan --}}
@if (strtolower($status->name) == 'revisi' && strtolower($status->name) != strtolower($permohonan->status))
@continue
@endif
<div
class="flex items-center justify-center shrink-0 rounded-full
{{ strtolower($status->name) == strtolower($permohonan->status) ? ' btn-outline btn-primary' : 'bg-gray-100 border-gray-300 text-gray-600' }}
size-9">
@switch(strtolower($status->name))
@case('order')
<i class="ki-filled ki-handcart text-base"></i>
@break
<div class="flex items-start relative">
@if ($index > 0)
<div
class="w-9 left-0 top-9 absolute bottom-0 translate-x-1/2
{{ strtolower($status->name) == strtolower($permohonan->status) ? 'border-l border-l-primary' : 'border-l border-l-gray-300' }}">
</div>
@endif
@case('revisi')
<i class="ki-filled ki-notepad-edit text-base"></i>
@break
<div
class="flex items-center justify-center shrink-0 rounded-full
{{ strtolower($status->name) == strtolower($permohonan->status) ? 'btn-outline btn-primary' : 'bg-gray-100 border-gray-300 text-gray-600' }}
size-9">
@switch(strtolower($status->name))
@case('order')
<i class="ki-filled ki-handcart text-base"></i>
@break
@case('register')
<i class="ki-filled ki-note-2 text-base"></i>
@break
@case('revisi')
<i class="ki-filled ki-notepad-edit text-base"></i>
@break
@case('assign')
<i class="ki-filled ki-file-added"></i>
@break
@case('register')
<i class="ki-filled ki-note-2 text-base"></i>
@break
@case('survey')
<i class="ki-filled ki-map text-base"></i>
@break
@case('assign')
<i class="ki-filled ki-file-added"></i>
@break
@default
<i class="ki-filled ki-people text-base"></i>
@endswitch
@case('survey')
<i class="ki-filled ki-map text-base"></i>
@break
@case('proses laporan')
<i class="ki-filled ki-paper-plane text-base"></i>
@break
@case('approved')
<i class="ki-filled ki-check text-base"></i>
@break
@case('delivered')
<i class="ki-filled ki-delivery-3 text-base"></i>
@break
@default
<i class="ki-filled ki-information text-base"></i>
@endswitch
</div>
@include('lpj::activity.components.status')
</div>
@include('lpj::activity.components.status')
</div>
@endforeach
@endforeach
</div>
</div>
<div class="card-footer justify-center">
<!-- Add footer content if necessary -->
</div>
</div>
<div class="card-footer justify-center">
</div>
</div>
</div>
@endsection

View File

@@ -43,47 +43,10 @@
</div>
@endif
{{-- Tampilkan informasi assign jika status 'assign' --}}
@if (strtolower($status->name) == 'assign' && $isCurrentStatus)
<div class="card shadow-none">
<div class="card-body grid grid-cols-3 gap-5">
{{-- Informasi Penilai, Surveyor, dan Penilai Surveyor --}}
<div>
@isset($permohonan->penilaian)
@if ($penilai = $permohonan->penilaian->userPenilai->name ?? null)
<div class="mb-3">
<p class="text-md font-medium text-gray-900">Penilai:</p>
<span class="text-2sm text-gray-700">{{ $penilai }}</span>
</div>
@endif
@if ($surveyor = $permohonan->penilaian->userSurveyor->name ?? null)
<div class="mb-3">
<p class="text-md font-medium text-gray-900">Surveyor:</p>
<span class="text-2sm text-gray-700">{{ $surveyor }}</span>
</div>
@endif
@if ($penilaiSurveyor = $permohonan->penilaian->userPenilaiSurveyor->name ?? null)
<div class="mb-3">
<p class="text-md font-medium text-gray-900">Penilai Surveyor:</p>
<span class="text-2sm text-gray-700">{{ $penilaiSurveyor }}</span>
</div>
@endif
@endisset
</div>
{{-- Teams --}}
<div>
<h3 class="text-md font-medium text-gray-900">Teams:</h3>
<ul>
@foreach ($permohonan->penilaian->teams->teamsUsers as $item)
<li class="text-xs text-gray-800 leading-[22px]">{{ $item->user->name }}</li>
@endforeach
</ul>
</div>
{{-- Catatan --}}
<div>
<h3 class="text-md font-medium text-gray-900">Catatan:</h3>
<span class="text-2sm text-gray-700">{{ $permohonan->penilaian->keterangan }}</span>

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

View File

@@ -0,0 +1,15 @@
@extends('layouts.main')
{{-- @section('breadcrumbs')
{{ Breadcrumbs::render('activity') }}
@endsection --}}
@section('content')
<div class="row"></div>
<div class="col-md-12">
hello
</div>
</div>
@endsection

View File

@@ -335,7 +335,7 @@
</label>
<div class="flex flex-wrap items-baseline w-full">
<select id="surveyor_id" name="surveyor_id"
class="input select @error('surveyor_id') border-danger bg-danger-light @enderror w-full">
class="select input @error('surveyor_id') border-danger bg-danger-light @enderror w-full">
<option value="">Pilih Surveyor</option>
</select>