08746d3262
Mengubah metode perhitungan total tugas pada tampilan progres aktivitas dengan memanfaatkan fungsi `countPermohonanForUser`. Perubahan ini bertujuan untuk menyederhanakan kode dan meningkatkan keterbacaan dengan menghilangkan logika filter yang kompleks dan menggantinya dengan pemanggilan fungsi yang lebih ringkas.
302 lines
15 KiB
PHP
302 lines
15 KiB
PHP
@extends('layouts.main')
|
|
@section('breadcrumbs')
|
|
{{ Breadcrumbs::render('activity.progres') }}
|
|
@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;
|
|
}
|
|
|
|
.break-words {
|
|
word-break: break-word;
|
|
white-space: normal;
|
|
}
|
|
</style>
|
|
@endpush
|
|
|
|
<div class="w-full grid gap-5 lg:gap-7.5 mx-auto">
|
|
<div class="card min-w-full">
|
|
<div class="card-header">
|
|
<h3 class="card-title">Team Activity</h3>
|
|
</div>
|
|
<div data-accordion="true">
|
|
|
|
@php
|
|
|
|
$sortedTeamsActivity = $teamsActivity->sortBy(function ($item) {
|
|
return $item->team->regions->penilaiTeam
|
|
->filter(function ($penilaiTeam) use ($item) {
|
|
return $penilaiTeam->user_id == $item->user->id;
|
|
})
|
|
->count();
|
|
});
|
|
@endphp
|
|
|
|
@foreach ($sortedTeamsActivity as $index => $item)
|
|
<div class="accordion-item [&:not(:last-child)]:border-b border-b-gray-200" data-accordion-item="true"
|
|
id="accordion_{{ $index }}">
|
|
<button class="accordion-toggle py-4 group mx-8"
|
|
data-accordion-toggle="#accordion_{{ $index }}content_{{ $index }}"
|
|
style="margin-start: 10px">
|
|
<table class="table table-auto align-middle text-gray-700 font-medium text-sm">
|
|
<tr>
|
|
<th class="min-w-[150px]" style="width: 600px">
|
|
<span
|
|
class="text-base text-gray-900 font-normal break-words">{{ $item->user->name }}</span>
|
|
</th>
|
|
<th class="min-w-[150px]">
|
|
<span class="text-base text-gray-900 font-normal">
|
|
<p>Total Task: {{ countPermohonanForUser($item->user->id) }}</p>
|
|
</span>
|
|
</th>
|
|
<th>
|
|
<i
|
|
class="ki-outline ki-plus text-gray-600 text-2sm accordion-active:hidden block"></i>
|
|
<i
|
|
class="ki-outline ki-minus text-gray-600 text-2sm accordion-active:block hidden"></i>
|
|
</th>
|
|
</tr>
|
|
|
|
</table>
|
|
</button>
|
|
<div class="accordion-content hidden" id="accordion_{{ $index }}content_{{ $index }}">
|
|
<div class="mx-8 pb-4" style="margin-bottom: 20px">
|
|
<div class="card card-grid min-w-full" data-datatable="false"
|
|
id="activity-table-{{ $index }}"
|
|
data-api-url="{{ route('activity.progres.datatables', ['id' => $item->user->id]) }}">
|
|
<div class="card-body">
|
|
<div class="scrollable-x-auto">
|
|
<table
|
|
class="table table-auto align-middle text-gray-700 font-medium text-sm my-4"
|
|
data-datatable-table="true">
|
|
<thead>
|
|
<tr>
|
|
<th class="min-w-[100px]">Nama Debitur</th>
|
|
<th class="min-w-[100px]">Tujuan Penilaian</th>
|
|
<th class="min-w-[100px]">Jenis Asset</th>
|
|
<th class="min-w-[100px]">Jenis Report</th>
|
|
<th class="min-w-[100px]">Tgl Register</th>
|
|
<th class="min-w-[100px]">Tgl Assign</th>
|
|
<th class="min-w-[100px]">Tgl Kunjungan</th>
|
|
<th class="min-w-[100px]">Progress</th>
|
|
<th class="min-w-[100px]">Due Date SLA</th>
|
|
<th class="min-w-[100px]">Paparan</th>
|
|
<th class="min-w-[100px]">Approve</th>
|
|
<th class="min-w-[50px] text-center">Keterangan</th>
|
|
<th class="min-w-[50px] text-center">Action</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<div
|
|
class="card-footer justify-center md:justify-between flex-col md:flex-row gap-3 text-gray-600 text-2sm font-medium">
|
|
<div class="flex items-center gap-2">
|
|
Show
|
|
<select class="select select-sm w-16" data-datatable-size="true"
|
|
name="perpage"></select> per page
|
|
</div>
|
|
<div class="flex items-center gap-4">
|
|
<span data-datatable-info="true"></span>
|
|
<div class="pagination" data-datatable-pagination="true"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endforeach
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endsection
|
|
|
|
@push('scripts')
|
|
<script>
|
|
function jadwal(id) {
|
|
document.getElementById('ids').value = id;
|
|
}
|
|
</script>
|
|
|
|
|
|
<script type="module">
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
const accordions = document.querySelectorAll('[data-accordion-item]');
|
|
|
|
accordions.forEach((accordion, index) => {
|
|
accordion.querySelector('.accordion-toggle').addEventListener('click', () => {
|
|
const apiUrl = accordion.querySelector('.card-grid').getAttribute(
|
|
'data-api-url');
|
|
|
|
const dataTableOptions = {
|
|
apiEndpoint: apiUrl,
|
|
pageSize: 5,
|
|
order: [{
|
|
column: 'nomor_registrasi',
|
|
dir: 'asc'
|
|
}],
|
|
columns: {
|
|
nama_debitur: {
|
|
title: 'Nama Debitur',
|
|
render: (item, data) => {
|
|
return `${data.permohonan.debiture.name}`
|
|
},
|
|
},
|
|
tujuan_penilaian: {
|
|
title: 'Tujuan Penilaian',
|
|
render: (item, data) => {
|
|
return `${data.permohonan.tujuan_penilaian?.name || ''}`;
|
|
},
|
|
},
|
|
jenis_asset: {
|
|
title: 'Jenis Asset',
|
|
render: (item, data) =>
|
|
`${data.permohonan.debiture.documents.map(d => d.jenis_jaminan.name) || ''}`,
|
|
},
|
|
jenis_report: {
|
|
title: 'Jenis Report',
|
|
render: (item, data) => `${data.jenis_report || ''}`,
|
|
},
|
|
register: {
|
|
title: 'Register',
|
|
render: (item, data) =>
|
|
`${formatDateFromISO(data.permohonan.created_at) || ''}`,
|
|
|
|
},
|
|
assign: {
|
|
title: 'Assign',
|
|
render: (item, data) => `${formatDateFromISO(data.created_at)}`,
|
|
},
|
|
tanggal_kunjungan: {
|
|
title: 'Tgl Kunjungan',
|
|
render: (item, data) =>
|
|
`${formatDateFromISO(data.waktu_penilaian) || ''}`,
|
|
},
|
|
progress: {
|
|
title: 'Progress',
|
|
render: (item, data) => `${data.progress || ''}`,
|
|
},
|
|
due_date: {
|
|
title: 'Due Date',
|
|
render: (item, data) => {
|
|
const mulai = new Date(data.permohonan.created_at);
|
|
const selesai = new Date(data.tanggal_kunjungan)
|
|
return `${mulai.getDate()}-${mulai.getMonth() + 1}-${mulai.getFullYear()} - ${selesai.getDate()}-${selesai.getMonth() + 1}-${selesai.getFullYear()}`
|
|
},
|
|
},
|
|
|
|
paparan: {
|
|
title: 'Paparan',
|
|
render: (item, data) => `${data.paparan || ''}`,
|
|
},
|
|
approve: {
|
|
title: 'Approve',
|
|
render: (item, data) => `${data.approve || ''}`,
|
|
},
|
|
keterangan: {
|
|
title: 'Keterangan',
|
|
render: (item, data) => `${data.keterangan || ''}`,
|
|
},
|
|
actions: {
|
|
title: 'Action',
|
|
render: (item, data) => `
|
|
<a class="btn btn-sm btn-icon btn-clear btn-primary" data-modal-toggle="#modal_jadwal" onclick="jadwal(${data.user_penilai[0].penilaian_id})">
|
|
<i class="ki-filled ki-calendar-edit"></i>
|
|
</a>`,
|
|
},
|
|
},
|
|
};
|
|
|
|
// Initialize DataTable only for the active accordion
|
|
if (!accordion.querySelector('.dataTable')) {
|
|
const element = accordion.querySelector('.card-grid');
|
|
new KTDataTable(element, dataTableOptions);
|
|
}
|
|
});
|
|
});
|
|
});
|
|
|
|
|
|
function formatDateFromISO(isoDateString) {
|
|
const date = new Date(isoDateString);
|
|
const day = String(date.getDate()).padStart(2, '0');
|
|
const month = String(date.getMonth() + 1).padStart(2, '0');
|
|
const year = String(date.getFullYear()).slice(-2);
|
|
return `${day}-${month}-${year}`;
|
|
}
|
|
</script>
|
|
@endpush
|
|
|
|
|
|
<div class="modal" data-modal="true" id="modal_jadwal">
|
|
<div class="modal-content max-w-[600px] top-[10%]">
|
|
<div class="modal-header">
|
|
<h3 class="modal-title">Pilih</h3>
|
|
<button class="btn btn-xs btn-icon btn-light" data-modal-dismiss="true">
|
|
<i class="ki-outline ki-cross"></i>
|
|
</button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<form action="{{ route('activity.update-team') }}" method="POST" enctype="multipart/form-data"
|
|
id="revisiForm">
|
|
@method('put')
|
|
@csrf
|
|
<input id="ids" type="hidden" name="id">
|
|
<div class="pl-1 grid gap-2.5">
|
|
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
|
|
<label class="form-label max-w-56">Pilih Team</label>
|
|
<div class="flex flex-wrap items-baseline w-full">
|
|
<div class="input-group w-full">
|
|
<select id="surveyor_id" name="surveyor_id" class="input tomselect">
|
|
<option value="">Pilih Team</option>
|
|
@foreach ($teamsActivity as $item)
|
|
<option value="{{ $item->user->id }}">{{ $item->user->name }}</option>
|
|
@endforeach
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<em id="error-surveyor_id" class="alert text-danger text-sm"></em>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="modal-footer justify-end mt-2">
|
|
<div class="flex gap-4">
|
|
<button type="button" class="btn btn-light" data-modal-dismiss="true">Cancel</button>
|
|
<button id="btnSubmit" type="submit" class="btn btn-primary">Submit</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|