fix view foto jaminan
This commit is contained in:
majid
@@ -1,142 +1,169 @@
|
||||
<div>
|
||||
@php
|
||||
$photoSections = [
|
||||
'rute_menuju_lokasi' => [
|
||||
'key' => 'rute_menuju_lokasi',
|
||||
'name_prefix' => '',
|
||||
'nested' => true,
|
||||
],
|
||||
'foto_rute_lainnya' => [
|
||||
'key' => 'name_rute_lainnya',
|
||||
'name_prefix' => '',
|
||||
'nested' => false,
|
||||
],
|
||||
'foto_lingkungan' => [
|
||||
'key' => 'foto_lingkungan',
|
||||
'name_prefix' => '',
|
||||
'nested' => true,
|
||||
],
|
||||
'single_photos' => [
|
||||
'foto_basement' => 'Basement',
|
||||
'foto_gerbang' => 'Gerbang',
|
||||
'pendamping' => 'Pendamping',
|
||||
],
|
||||
'object_jaminan' => [
|
||||
'key' => 'name_objek',
|
||||
'name_prefix' => '',
|
||||
'nested' => false,
|
||||
],
|
||||
'foto_lantai_unit' => [
|
||||
'key' => 'name',
|
||||
'name_prefix' => 'Foto Lantai',
|
||||
'nested' => true,
|
||||
],
|
||||
];
|
||||
<style>
|
||||
/* General Styles */
|
||||
body {
|
||||
font-family: Arial, sans-serif;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
$hasPhotos = false;
|
||||
.photo-container {
|
||||
width: 100%;
|
||||
margin-bottom: 10px;
|
||||
clear: both;
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
|
||||
.photo-row {
|
||||
width: 100%;
|
||||
clear: both;
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
|
||||
.photo-item {
|
||||
width: 48%;
|
||||
margin-right: 2%;
|
||||
float: left;
|
||||
padding: 5px;
|
||||
box-sizing: border-box;
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
|
||||
.photo-item:nth-child(2n) {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
/* Image Styling */
|
||||
.photo-item img {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
object-fit: contain;
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
|
||||
/* Clearfix */
|
||||
.clearfix::after {
|
||||
content: "";
|
||||
clear: both;
|
||||
display: table;
|
||||
}
|
||||
|
||||
/* Media Print */
|
||||
@media print {
|
||||
.photo-item {
|
||||
width: 48%;
|
||||
margin-right: 2%;
|
||||
float: left;
|
||||
padding: 5px;
|
||||
box-sizing: border-box;
|
||||
page-break-inside: avoid;
|
||||
}
|
||||
|
||||
.photo-item img {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 14px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@isset($basicData['foto'])
|
||||
@php
|
||||
$photos = $formFoto['upload_foto'] ?? [];
|
||||
if (!is_array($photos)) {
|
||||
$photos = [];
|
||||
}
|
||||
$groupedPhotos = collect($photos)->groupBy('category');
|
||||
|
||||
$mainPhotos = $groupedPhotos->filter(fn($_, $key) => $key !== 'Lainnya');
|
||||
$otherPhotos = $groupedPhotos->get('Lainnya', collect());
|
||||
@endphp
|
||||
|
||||
<style>
|
||||
.photo-container {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.photo-item {
|
||||
width: 100%; /* Adjust to fit two photos per row */
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.photo-item img {
|
||||
width: 80%;
|
||||
height: auto;
|
||||
border-radius: 5px;
|
||||
}
|
||||
</style>
|
||||
@if ($groupedPhotos->isEmpty())
|
||||
<p class="text-gray-500">Tidak ada foto yang tersedia.</p>
|
||||
@else
|
||||
<div class="photo-container">
|
||||
@foreach ($mainPhotos as $category => $photos)
|
||||
<h2 class="text-gray-800 font-bold text-lg">{{ $category }}</h2>
|
||||
|
||||
@foreach ($photoSections as $sectionKey => $sectionConfig)
|
||||
@if ($sectionKey === 'single_photos')
|
||||
<div class="photo-container">
|
||||
@foreach ($sectionConfig as $photoKey => $photoName)
|
||||
@if (isset($formFoto[$photoKey]) && !empty($formFoto[$photoKey]))
|
||||
@php
|
||||
$imagePath = storage_path('app/public/' . $formFoto[$photoKey]);
|
||||
$hasPhotos = true;
|
||||
@endphp
|
||||
<div class="photo-item border">
|
||||
<h2 class="text-gray-600 font-semibold text-xl">
|
||||
{{ $photoName }}
|
||||
</h2>
|
||||
@if ($statusLpj || file_exists($imagePath))
|
||||
<img src="{{ $imagePath }}" alt="{{ $photoName }}" class="photo-image">
|
||||
@endif
|
||||
</div>
|
||||
@endif
|
||||
@endforeach
|
||||
</div>
|
||||
@else
|
||||
@php
|
||||
$sectionData = $formFoto[$sectionKey] ?? null;
|
||||
@endphp
|
||||
@php
|
||||
$groupedBySubcategory = $photos->groupBy('sub');
|
||||
@endphp
|
||||
|
||||
@if (!empty($sectionData))
|
||||
@if ($sectionConfig['nested'])
|
||||
@if (isset($sectionData[$sectionConfig['key']][0]))
|
||||
<div class="photo-container">
|
||||
@foreach ($sectionData[$sectionConfig['key']][0] as $index => $item)
|
||||
@if ($groupedBySubcategory->isEmpty())
|
||||
<p class="text-gray-500">Tidak ada subkategori yang tersedia.</p>
|
||||
@else
|
||||
@foreach ($groupedBySubcategory as $subcategory => $subPhotos)
|
||||
<h3 class="text-gray-600 font-semibold text-md">
|
||||
{{ $subcategory ?: '' }}
|
||||
</h3>
|
||||
|
||||
<div class="photo-row clearfix">
|
||||
@foreach ($subPhotos as $index => $item)
|
||||
@php
|
||||
$imagePath = storage_path('app/public/' . $item['path']);
|
||||
$hasPhotos = true;
|
||||
@endphp
|
||||
<div class="photo-item border">
|
||||
<h2 class="text-gray-600 font-semibold text-xl">
|
||||
{{ $sectionConfig['name_prefix']
|
||||
? $sectionConfig['name_prefix'] . ' ' . ($index + 1)
|
||||
: $item['name'] ?? 'Foto ' . ($index + 1) }}
|
||||
</h2>
|
||||
<h4 class="text-gray-600 font-semibold text-sm">{{ $item['name'] }}</h4>
|
||||
@if ($statusLpj || file_exists($imagePath))
|
||||
<img src="{{ $imagePath }}" alt="{{ $item['path'] }}" class="photo-image">
|
||||
@else
|
||||
<p class="text-gray-400">Foto tidak ditemukan.</p>
|
||||
@endif
|
||||
</div>
|
||||
@endforeach
|
||||
|
||||
@if (($index + 1) % 2 == 0 && !$loop->last)
|
||||
</div>
|
||||
<div class="photo-row clearfix">
|
||||
@endif
|
||||
@else
|
||||
<div class="photo-container">
|
||||
@foreach ($sectionData as $index => $item)
|
||||
@php
|
||||
$name = $item[$sectionConfig['key']] ?? '';
|
||||
$photoPath =
|
||||
$sectionKey === 'object_jaminan'
|
||||
? $item['foto_objek'] ?? ''
|
||||
: $item['foto_rute_lainnya'] ?? '';
|
||||
|
||||
$imagePath = storage_path('app/public/' . $photoPath);
|
||||
@endphp
|
||||
|
||||
@if (!empty($name) || !empty($photoPath))
|
||||
@php $hasPhotos = true; @endphp
|
||||
<div class="photo-item border">
|
||||
@if (!empty($name))
|
||||
<h2 class="text-gray-600 font-semibold text-xl">
|
||||
{{ $name }}
|
||||
</h2>
|
||||
@endif
|
||||
@if ($statusLpj || (file_exists($imagePath) && !empty($photoPath)))
|
||||
<img src="{{ $imagePath }}" alt="{{ $name ?: 'Foto' }}" class="photo-image">
|
||||
@endif
|
||||
</div>
|
||||
@endif
|
||||
@endforeach
|
||||
</div>
|
||||
@endif
|
||||
@endif
|
||||
@endif
|
||||
@endforeach
|
||||
</div>
|
||||
@endforeach
|
||||
@endif
|
||||
@endforeach
|
||||
|
||||
@if (!$hasPhotos)
|
||||
<div class="text-center py-6 bg-gray-100 rounded-lg">
|
||||
<p class="text-gray-500 italic">Tidak ada foto yang tersedia</p>
|
||||
</div>
|
||||
@endif
|
||||
@if (!$otherPhotos->isEmpty())
|
||||
<h2 class="text-gray-800 font-bold text-lg">Lainnya</h2>
|
||||
|
||||
@php
|
||||
$groupedBySubcategory = $otherPhotos->groupBy('sub');
|
||||
@endphp
|
||||
|
||||
@if ($groupedBySubcategory->isEmpty())
|
||||
<p class="text-gray-500">Tidak ada subkategori yang tersedia.</p>
|
||||
@else
|
||||
@foreach ($groupedBySubcategory as $subcategory => $subPhotos)
|
||||
<h3 class="text-gray-600 font-semibold text-md">
|
||||
{{ $subcategory ?: '' }}
|
||||
</h3>
|
||||
|
||||
<div class="photo-row clearfix">
|
||||
@foreach ($subPhotos as $index => $item)
|
||||
@php
|
||||
$imagePath = storage_path('app/public/' . $item['path']);
|
||||
@endphp
|
||||
<div class="photo-item border">
|
||||
<h4 class="text-gray-600 font-semibold text-sm">{{ $item['name'] }}</h4>
|
||||
@if ($statusLpj || file_exists($imagePath))
|
||||
<img src="{{ $imagePath }}" alt="{{ $item['path'] }}" class="photo-image">
|
||||
@else
|
||||
<p class="text-gray-400">Foto tidak ditemukan.</p>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
@if (($index + 1) % 2 == 0 && !$loop->last)
|
||||
</div>
|
||||
<div class="photo-row clearfix">
|
||||
@endif
|
||||
@endforeach
|
||||
</div>
|
||||
@endforeach
|
||||
@endif
|
||||
@endif
|
||||
</div>
|
||||
@endif
|
||||
@endisset
|
||||
|
||||
Reference in New Issue
Block a user