92 lines
5.5 KiB
PHP
92 lines
5.5 KiB
PHP
@extends('layouts.frontend')
|
|
|
|
@section('title', 'Belanja Sayur')
|
|
|
|
@section('content')
|
|
<!-- Single Page Header -->
|
|
<div class="container-fluid page-header py-5" style="background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), url('{{ asset('template/frontend/img/cart-page-header-img.jpg') }}'); background-position: center center; background-repeat: no-repeat; background-size: cover;">
|
|
<h1 class="text-center text-white display-6">Shop</h1>
|
|
<ol class="breadcrumb justify-content-center mb-0">
|
|
<li class="breadcrumb-item"><a href="{{ route('home') }}" class="text-white">Home</a></li>
|
|
<li class="breadcrumb-item active text-white">Shop</li>
|
|
</ol>
|
|
</div>
|
|
|
|
<!-- Fruits Shop-->
|
|
<div class="container-fluid fruite py-5">
|
|
<div class="container py-5">
|
|
<h1 class="mb-4">Toko Sayur & Buah Segar</h1>
|
|
<div class="row g-4">
|
|
<div class="col-lg-12">
|
|
<div class="row g-4">
|
|
<!-- SIDEBAR PENCARIAN -->
|
|
<div class="col-xl-3">
|
|
<div class="input-group w-100 mx-auto d-flex mb-4">
|
|
<form action="{{ route('shop') }}" method="GET" class="w-100 d-flex shadow-sm rounded">
|
|
<input type="search" name="search" class="form-control p-3 border-0" placeholder="Cari produk..." value="{{ request('search') }}" aria-describedby="search-icon-1" style="border-radius: 10px 0 0 10px;">
|
|
<button type="submit" id="search-icon-1" class="input-group-text p-3 border-0 bg-light" style="border-radius: 0 10px 10px 0;"><i class="fa fa-search"></i></button>
|
|
</form>
|
|
</div>
|
|
|
|
<div class="row g-4">
|
|
<div class="col-lg-12">
|
|
<div class="mb-3">
|
|
<h4>Kategori</h4>
|
|
<ul class="list-unstyled fruite-categorie">
|
|
<li>
|
|
<div class="d-flex justify-content-between fruite-name">
|
|
<a href="{{ route('shop') }}"><i class="fas fa-apple-alt me-2"></i>Semua Produk</a>
|
|
<span>({{ $produks->total() }})</span>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- GRID PRODUK -->
|
|
<div class="col-lg-9">
|
|
<div class="row g-4 justify-content-center">
|
|
@forelse($produks as $produk)
|
|
<div class="col-md-6 col-lg-6 col-xl-4">
|
|
<div class="rounded position-relative fruite-item border border-secondary h-100">
|
|
<div class="fruite-img">
|
|
<img src="{{ $produk->foto_produk ? asset('storage/'.$produk->foto_produk) : asset('template/frontend/img/fruite-item-5.jpg') }}" class="img-fluid w-100 rounded-top" alt="{{ $produk->nama_produk }}" style="height: 200px; object-fit: cover;">
|
|
</div>
|
|
<div class="text-white bg-secondary px-3 py-1 rounded position-absolute" style="top: 10px; left: 10px;">Segar</div>
|
|
<div class="p-4 border-top-0 rounded-bottom">
|
|
<h4>{{ $produk->nama_produk }}</h4>
|
|
<p>{{ Str::limit($produk->deskripsi, 50) }}</p>
|
|
<div class="d-flex justify-content-between flex-lg-wrap">
|
|
<p class="text-dark fs-5 fw-bold mb-0">Rp {{ number_format($produk->harga, 0, ',', '.') }} / kg</p>
|
|
<a href="{{ route('produk.detail', $produk->id) }}" class="btn border border-secondary rounded-pill px-3 text-primary"><i class="fa fa-eye me-2 text-primary"></i> Detail</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@empty
|
|
<div class="col-12 text-center">
|
|
<div class="alert alert-warning py-5">
|
|
<i class="fas fa-search fa-3x mb-3 text-warning"></i>
|
|
<h4>Produk tidak ditemukan</h4>
|
|
<p>Coba kata kunci lain atau kembali lagi nanti.</p>
|
|
<a href="{{ route('shop') }}" class="btn btn-outline-primary rounded-pill mt-3">Reset Pencarian</a>
|
|
</div>
|
|
</div>
|
|
@endforelse
|
|
|
|
<!-- PAGINATION -->
|
|
<div class="col-12">
|
|
<div class="d-flex justify-content-center mt-5">
|
|
{{ $produks->links() }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endsection |