269 lines
13 KiB
PHP
269 lines
13 KiB
PHP
@extends('frontend.app_base')
|
|
|
|
@section('content')
|
|
|
|
<!-- Carousel Start -->
|
|
<div class="container-fluid p-0">
|
|
<div id="header-carousel" class="carousel slide" data-ride="carousel">
|
|
<div class="carousel-inner">
|
|
<div class="carousel-item active">
|
|
<img class="w-100" src="{{ asset('fe/img/1_mojosemi.jpg') }}" alt="Image">
|
|
<div class="carousel-caption d-flex flex-column align-items-center justify-content-center">
|
|
<div class="p-3" style="max-width: 900px;">
|
|
<h4 class="text-white text-uppercase mb-md-3">Wisata Magetan</h4>
|
|
<h1 class="display-3 text-white mb-md-4">Temukan Destinasi Wisata Menarik</h1>
|
|
{{-- <a href="" class="btn btn-primary py-md-3 px-md-5 mt-2">Book Now</a> --}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="carousel-item">
|
|
<img class="w-100" src="{{ asset('fe/img/4_sarangan6.jpg') }}" alt="Image">
|
|
<div class="carousel-caption d-flex flex-column align-items-center justify-content-center">
|
|
<div class="p-3" style="max-width: 900px;">
|
|
<h4 class="text-white text-uppercase mb-md-3">Wisata Magetan</h4>
|
|
<h1 class="display-3 text-white mb-md-4">Temukan Tempat Menakjubkan Bersama Kami</h1>
|
|
{{-- <a href="" class="btn btn-primary py-md-3 px-md-5 mt-2">Book Now</a> --}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<a class="carousel-control-prev" href="#header-carousel" data-slide="prev">
|
|
<div class="btn btn-dark" style="width: 45px; height: 45px;">
|
|
<span class="carousel-control-prev-icon mb-n2"></span>
|
|
</div>
|
|
</a>
|
|
<a class="carousel-control-next" href="#header-carousel" data-slide="next">
|
|
<div class="btn btn-dark" style="width: 45px; height: 45px;">
|
|
<span class="carousel-control-next-icon mb-n2"></span>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<!-- Carousel End -->
|
|
|
|
<!-- Booking Start -->
|
|
<form method="GET" action="{{ route('wisata.index') }}">
|
|
<div class="container-fluid booking mt-5 pb-5">
|
|
<div class="container pb-5">
|
|
<div class="bg-light shadow" style="padding: 30px;">
|
|
<div class="row align-items-center" style="min-height: 60px;">
|
|
<div class="col-md-10">
|
|
<div class="row">
|
|
@foreach ($criteria as $item)
|
|
<div class="col-md-3">
|
|
<div class="mb-3 mb-md-0">
|
|
<select class="custom-select px-4" style="height: 47px;" name="{{ strtolower($item['criteria_name']) }}">
|
|
<option value="" selected>{{ $item['criteria_name'] }}</option>
|
|
@foreach ($item['sub'] as $val)
|
|
<option value="{{ $val->id }}">{{ $val->description }}</option>
|
|
@endforeach
|
|
|
|
</select>
|
|
</div>
|
|
</div>
|
|
@endforeach
|
|
</div>
|
|
</div>
|
|
<div class="col-md-2">
|
|
<button class="btn btn-primary btn-block" type="submit"
|
|
style="height: 47px; margin-top: -2px;">Submit</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
<!-- Booking End -->
|
|
|
|
<!-- Destination Start -->
|
|
<div class="container-fluid py-2" id="recomendation">
|
|
<div class="container pt-2 pb-3">
|
|
<div class="text-center mb-3 pb-3">
|
|
<h6 class="text-primary text-uppercase" style="letter-spacing: 5px;">Rekomendasi</h6>
|
|
<h1>Rekomendasi Wisata Magetan</h1>
|
|
</div>
|
|
|
|
@php
|
|
$param = request()->query();
|
|
|
|
// Konversi array ke dalam Laravel Collection
|
|
$collection = collect($param);
|
|
|
|
// Hitung jumlah data yang null
|
|
$nullCount = $collection->filter(function ($item) {
|
|
return is_null($item);
|
|
})->count();
|
|
|
|
// Hitung jumlah data yang tidak null
|
|
$notNullCount = $collection->filter(function ($item) {
|
|
return !is_null($item);
|
|
})->count();
|
|
@endphp
|
|
|
|
@if ($notNullCount >= 0 && $notNullCount < 2)
|
|
<div class="alert alert-danger alert-dismissible fade show" role="alert">
|
|
<strong>Tidak menampilkan data!</strong> Pilih lebih dari satu kriteria untuk menampilkan data.
|
|
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
|
|
</div>
|
|
@endif
|
|
|
|
@if ($notNullCount > 1)
|
|
<div class="accordion accordion-flush" id="accordionFlushExample">
|
|
<div class="accordion-item">
|
|
<h2 class="accordion-header" id="flush-headingOne">
|
|
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
|
|
data-bs-target="#flush-collapseOne" aria-expanded="false" aria-controls="flush-collapseOne">
|
|
Detail Perhitungan
|
|
</button>
|
|
</h2>
|
|
<div id="flush-collapseOne" class="accordion-collapse collapse" aria-labelledby="flush-headingOne"
|
|
data-bs-parent="#accordionFlushExample">
|
|
<div class="accordion-body">
|
|
|
|
{{-- Hasil Akhir --}}
|
|
<div class="card mt-4">
|
|
<div class="card-header">
|
|
<h5>Hasil Akhir</h5>
|
|
</div>
|
|
<div class="card-body px-4">
|
|
<div class="table-responsive">
|
|
<table id="tabel_data" class="table table-striped table-bordered" width="100%">
|
|
<thead>
|
|
<tr>
|
|
<th>Nama</th>
|
|
<th>Nilai</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr>
|
|
@foreach ($recomendation as $item)
|
|
<tr>
|
|
<td>{{ $item->name }}</td>
|
|
<td>{{ round($item->nilai, 3) }}</td>
|
|
</tr>
|
|
@endforeach
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endif
|
|
|
|
|
|
|
|
<div class="row">
|
|
@foreach ($recomendation as $item)
|
|
<div class="col-lg-4 col-md-6 mb-4">
|
|
<div class="destination-item position-relative overflow-hidden mb-2">
|
|
@if (isset($item->thumbnail))
|
|
<img class="img-fluid" src="{{ asset('/media/' . $item->thumbnail) }}" alt="" style="width: 400px; height: 250px; object-fit: cover;">
|
|
@else
|
|
<img class="img-fluid" src="{{ asset('images/no_image.jpg') }}" alt="">
|
|
@endif
|
|
<a class="destination-overlay text-white text-decoration-none" href="{{ url('detail') . '/' . $item->objek_id }}">
|
|
<h5 class="text-white">{{ $item->name }}</h5>
|
|
{{-- <span>100 Cities</span> --}}
|
|
</a>
|
|
</div>
|
|
</div>
|
|
@endforeach
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Destination Start -->
|
|
|
|
<!-- About Start -->
|
|
<div class="container-fluid py-5" id="about">
|
|
<div class="container pt-5">
|
|
<div class="row">
|
|
<div class="col-lg-6" style="min-height: 500px;">
|
|
<div class="position-relative h-100">
|
|
<img class="position-absolute w-100 h-100" src="{{ asset('fe/img/about.jpg') }}" style="object-fit: cover;">
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-6 pt-5 pb-lg-5">
|
|
<div class="about-text bg-white p-4 p-lg-5 my-lg-5">
|
|
<h6 class="text-primary text-uppercase" style="letter-spacing: 5px;">Tentang Kami</h6>
|
|
<h1 class="mb-3">Rekomendasi Wisata Menarik di Magetan</h1>
|
|
<p>Temukan rekomendasi wisata menarik di Magetan yang cocok untuk anda kunjungi. Cukup gunakan filter yang sesuai dengan referensi anda dan kami akan tampilkan rekomendasi yang pas untuk Anda.</p>
|
|
<div class="row mb-4">
|
|
<div class="col-6">
|
|
<img class="img-fluid" style="height: 100%; object-fit:cover" src="{{ asset('fe/img/5_tamanrefugia.jpg') }}" alt="">
|
|
</div>
|
|
<div class="col-6">
|
|
<img class="img-fluid" style="height: 100%; object-fit:cover" src="{{ asset('fe/img/6_taman-wisata-genilangit.jpg') }}" alt="">
|
|
</div>
|
|
</div>
|
|
{{-- <a href="" class="btn btn-primary mt-1">Book Now</a> --}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- About End -->
|
|
|
|
<!-- Packages Start -->
|
|
<div class="container-fluid py-5" id="objek">
|
|
<div class="container pt-5 pb-3">
|
|
<div class="text-center mb-3 pb-3">
|
|
<h6 class="text-primary text-uppercase" style="letter-spacing: 5px;">Wisata</h6>
|
|
<h1>Daftar Tempat Wisata</h1>
|
|
</div>
|
|
<div class="row">
|
|
@foreach ($objek as $item)
|
|
<div class="col-lg-4 col-md-6 mb-4">
|
|
<div class="package-item bg-white mb-2">
|
|
@if (isset($item->thumbnail))
|
|
<img class="img-fluid" src="{{ asset('/media/' . $item->thumbnail) }}" alt="" style="width: 400px; height: 250px; object-fit: cover;">
|
|
@else
|
|
<img class="img-fluid" src="{{ asset('images/no_image.jpg') }}" alt="">
|
|
@endif
|
|
<div class="p-4">
|
|
<div class="d-flex justify-content-between mb-3">
|
|
<small class="m-0"><i class="fa fa-map-marker-alt text-primary mr-2"></i>{{ $item->address ?? '-' }}</small>
|
|
</div>
|
|
<a class="h5 text-decoration-none" href="{{ url('detail') . '/' . $item->id }}">{{ $item->name }}</a>
|
|
<div class="border-top mt-4 pt-4">
|
|
<div class="d-flex justify-content-between">
|
|
<a href="{{ url('detail') . '/' . $item->id }}" class="btn btn-primary">Detail</a>
|
|
<h5 class="m-0">{{ Custom::rupiah($item->price) }}</h5>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endforeach
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Packages End -->
|
|
|
|
|
|
@endsection
|
|
|
|
@push('third_party_scripts')
|
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
|
|
<script>
|
|
// Smooth scrolling when clicking on navigation links
|
|
document.querySelectorAll('#navbar a').forEach(anchor => {
|
|
anchor.addEventListener('click', function(e) {
|
|
e.preventDefault();
|
|
|
|
const targetId = this.getAttribute('href').substring(1);
|
|
const targetSection = document.getElementById(targetId);
|
|
const topPos = targetSection.offsetTop;
|
|
|
|
window.scrollTo({
|
|
top: topPos,
|
|
behavior: 'smooth' // Smooth scrolling behavior
|
|
});
|
|
});
|
|
});
|
|
</script>
|
|
@endpush |