MIF_E31222713/resources/views/admin/pesanan.blade.php

391 lines
26 KiB
PHP

@extends('layoutadmin.app')
@section('content')
@php
$adaNegosiasi = $pesanans->contains('status', 'negosiasi');
@endphp
<nav class="navbar navbar-main navbar-expand-lg px-0 mx-4 shadow-none border-radius-xl" id="navbarBlur" data-scroll="true">
<div class="container-fluid py-1 px-3">
<nav aria-label="breadcrumb">
<ol class="breadcrumb bg-transparent mb-0 pb-0 pt-1 px-0 me-sm-6 me-5">
<li class="breadcrumb-item text-sm"><a class="opacity-5 text-dark" href="javascript:;">Pages</a></li>
<li class="breadcrumb-item text-sm text-dark active" aria-current="page">Pesanan</li>
</ol>
<h6 class="font-weight-bolder mb-0">Pesanan</h6>
</nav>
<div class="collapse navbar-collapse mt-sm-0 mt-2 me-md-0 me-sm-4" id="navbar">
<div class="ms-md-auto pe-md-5 d-flex align-items-center">
<div class="input-group input-group-outline">
<label class="form-label">Type here...</label>
<input type="text" class="form-control">
</div>
</div>
<ul class="navbar-nav pe-md-3">
<!-- Tambahkan Profile Icon di sini -->
<li class="nav-item d-flex align-items-center">
<a href="{{ route('profile') }}" class="nav-link text-body font-weight-bold px-2">
<i class="fas fa-user-circle me-sm-1"></i>
<span class="d-sm-inline d-none">Profile</span>
</a>
</li>
<!-- Ikon Logout -->
<li class="nav-item d-flex align-items-center">
<a href="javascript:void(0);" class="nav-link text-body font-weight-bold px-2" id="logout-link">
<i class="fa fa-sign-out me-sm-1"></i>
<span class="d-sm-inline d-none">Logout</span>
</a>
</li>
<script>
document.getElementById('logout-link').addEventListener('click', function(event) {
event.preventDefault(); // Mencegah tindakan default link
Swal.fire({
title: 'Are you sure?',
text: "You will be logged out.",
icon: 'warning',
showCancelButton: true,
confirmButtonText: 'Yes, logout',
cancelButtonText: 'No, cancel',
reverseButtons: true
}).then((result) => {
if (result.isConfirmed) {
window.location.href =
'{{ route('home') }}'; // Arahkan ke route logout jika konfirmasi diterima
}
});
});
</script>
</ul>
</div>
</div>
</nav>
<div class="container-fluid py-4">
<div class="row">
<div class="col-12">
<div class="card my-4">
<div class="card-header p-0 position-relative mt-n4 mx-3 z-index-2">
<div
class="bg-gradient-primary shadow-primary border-radius-lg pt-4 pb-3 d-flex justify-content-between align-items-center">
<h6 class="text-white text-capitalize ps-3">Table Pesanan</h6>
</div>
</div>
<div class="card-body px-0 pb-2">
<div class="table-responsive p-0">
<div class="d-flex justify-content-between align-items-center mb-3 px-3">
<!-- Search Input -->
<div class="input-group" style="width: 40%; max-width: 240px; margin-left: 10px">
<input type="text" class="form-control bg-white" id="searchInput"
placeholder="Cari berdasarkan nama pelanggan" />
<span class="input-group-text text-secondary" style="margin-top: 3px"><i
class="fas fa-search"></i></span>
</div>
<!-- Status Filter -->
<select id="statusFilter" class="form-select w-auto" onchange="filterTable()"
style="margin-right: 3px">
<option value="">Semua Status</option>
<optgroup label="In Progress">
<option value="in progress (bayar dp)">In Progress (Bayar DP)</option>
<option value="in progress (pembuatan taman)">In Progress (Pembuatan Taman)</option>
<option value="in progress (penyelesaian akhir)">In Progress (Penyelesaian Akhir)
</option>
</optgroup>
<option value="pending">Pending</option>
<option value="completed">Completed</option>
<option value="canceled">Canceled</option>
</select>
</div>
<table class="table align-items-center mb-0" id="statusTable">
<thead>
<tr>
<th class="text-center w-12">No</th>
<th class="text-center w-30">Nama</th>
<th class="text-center w-30">Budget / Sisa Bayar</th>
<th class="text-center w-15">Status Pesanan</th>
<th class="text-center w-20">Status Dp</th>
<th class="text-center w-30">Nominal DP</th>
@if ($adaNegosiasi)
<th class="text-center">Negosiasi</th>
@endif
<th class="text-center w-40">Foto Lokasi</th>
<th class="text-center w-40">Foto Desain</th>
<th class="text-center w-15">Action</th>
</tr>
</thead>
<tbody id="orderTableBody" class="align-middle text-xxs font-weight-bolder text-center">
@foreach ($pesanans as $pesanan)
<tr data-status="{{ $pesanan->status }}">
<td>
<div class="d-flex px-2 py-1 text-center">
<div class="d-flex flex-column">
<h6 class="mb-0 text-sm">{{ $loop->iteration }}</h6>
</div>
</div>
</td>
<td>
<div class="d-flex align-items-center">
<div class="d-flex flex-column">
<h6 class="mb-0">{{ $pesanan->pelanggan->nama }}</h6>
<p class="text-xs text-secondary mb-0">
{{ $pesanan->pelanggan->email }}</p>
</div>
</div>
</td>
<td>Rp{{ number_format($pesanan->budget, 0, ',', '.') }}</td>
<td class="align-middle text-center">
<span
class="badge
@if ($pesanan->status == 'in progress') bg-warning
@elseif($pesanan->status == 'pending') bg-primary
@elseif($pesanan->status == 'completed') bg-success
@elseif($pesanan->status == 'canceled') bg-danger
@else bg-secondary @endif">
{{ ucfirst($pesanan->status) }}
</span>
</td>
<td class="align-middle text-center">{{ $pesanan->status_pembayaran }}</td>
<td class="align-middle text-center">
{{ 'Rp ' . number_format($pesanan->nominal_dp, 0, ',', '.') }}</td>
@if ($adaNegosiasi)
<td class="align-middle text-center">
@if ($pesanan->status == 'negosiasi' && $pesanan->negosiasi->isNotEmpty())
{{ $pesanan->negosiasi->last()->pesan }}
@else
&nbsp;
@endif
</td>
@endif
<td class="align-middle text-center">
@if ($pesanan->foto_lokasi)
<img src="{{ asset('storage/' . $pesanan->foto_lokasi) }}"
alt="Foto Lokasi" class="img-fluid" style="max-height: 100px;">
@else
<span class="text-secondary">Tidak Ada</span>
@endif
</td>
<td class="align-middle text-center">
@if ($pesanan->desain && $pesanan->desain->foto)
<!-- Jika desain dipilih dari tabel desain -->
<img src="{{ asset('storage/' . $pesanan->desain->foto) }}"
alt="Foto Desain" class="img-fluid" style="max-height: 100px;">
@elseif ($pesanan->foto_desain)
<!-- Jika foto desain diunggah langsung -->
<img src="{{ asset('storage/' . $pesanan->foto_desain) }}"
alt="Foto Desain" class="img-fluid" style="max-height: 100px;">
@else
<span class="text-secondary">Tidak Ada</span>
@endif
</td>
<td class="align-middle text-center">
@if ($pesanan->status == 'canceled')
<span class="text-danger">{{ $pesanan->keterangan_tolak }} </span>
@elseif ($pesanan->status == 'completed')
<span class="text-success">Pesanan Selesai</span>
@elseif ($pesanan->status == 'pending')
<form action="{{ route('terimalunas', $pesanan->id) }}"
method="POST" style="display: inline;">
@csrf
@method('PATCH')
<button class="btn btn-sm btn-primary mt-2" type="submit">
<i class="fas fa-trash-alt"></i> Terima
</button>
</form>
<button class="btn btn-sm btn-warning mt-2" data-bs-toggle="modal"
data-bs-target="#negosiasiModal{{ $pesanan->id }}">
<i class="fas fa-info-circle"></i> Negosiasi
</button>
<button class="btn btn-sm btn-danger mt-2" data-bs-toggle="modal"
data-bs-target="#tolakModal{{ $pesanan->id }}">
<i class="fas fa-info-circle"></i> Tolak
</button>
<button class="btn btn-sm btn-info mt-2" data-bs-toggle="modal"
data-bs-target="#cetakPesananModal{{ $pesanan->id }}">
<i class="fas fa-info-circle"></i> Detail
</button>
@elseif ($pesanan->status == 'in progress (survei)')
<button class="btn btn-sm btn-info mt-2" data-bs-toggle="modal"
data-bs-target="#cetakPesananModal{{ $pesanan->id }}">
<i class="fas fa-info-circle"></i> Detail
</button>
<button class="btn btn-sm btn-warning mt-2" data-bs-toggle="modal"
data-bs-target="#editPesananModal{{ $pesanan->id }}">
<i class="fas fa-info-circle"></i> Edit
</button>
@if ($pesanan->status_pembayaran == 'belum lunas')
<form action="{{ route('lanjutadmin', $pesanan->id) }}"
method="POST" style="display: inline;">
@csrf
@method('PATCH')
<button class="btn btn-sm btn-primary mt-2" type="submit">
<i class="fas fa-trash-alt"></i> Lanjut
</button>
</form>
@elseif ($pesanan->status_pembayaran == 'dp')
<form action="{{ route('terimaadmin', $pesanan->id) }}"
method="POST" style="display: inline;">
@csrf
@method('PATCH')
<button class="btn btn-sm btn-primary mt-2" type="submit">
<i class="fas fa-trash-alt"></i> Lanjut
</button>
</form>
<button class="btn btn-sm btn-danger mt-2" data-bs-toggle="modal"
data-bs-target="#editPesananModal{{ $pesanan->id }}">
<i class="fas fa-info-circle"></i> Tolak
</button>
@endif
@elseif ($pesanan->status == 'in progress (bayar dp)')
<button class="btn btn-sm btn-info mt-2" data-bs-toggle="modal"
data-bs-target="#cetakPesananModal{{ $pesanan->id }}">
<i class="fas fa-info-circle"></i> Detail
</button>
<button class="btn btn-sm btn-warning mt-2" data-bs-toggle="modal"
data-bs-target="#lihatbukti{{ $pesanan->id }}">
<i class="fas fa-info-circle"></i> Bukti dp
</button>
<form action="{{ route('lanjutadmin', $pesanan->id) }}"
method="POST" style="display: inline;">
@csrf
@method('PATCH')
<button class="btn btn-sm btn-primary mt-2" type="submit">
<i class="fas fa-trash-alt"></i> Lanjut
</button>
</form>
@elseif ($pesanan->status == 'in progress (pembuatan taman)')
<button class="btn btn-sm btn-info mt-2" data-bs-toggle="modal"
data-bs-target="#cetakPesananModal{{ $pesanan->id }}">
<i class="fas fa-info-circle"></i> Detail
</button>
<form action="{{ route('selesaiadmin', $pesanan->id) }}"
method="POST" style="display: inline;">
@csrf
@method('PATCH')
<button class="btn btn-sm btn-success mt-2" type="submit">
<i class="fas fa-trash-alt"></i> Selesai
</button>
</form>
@elseif ($pesanan->status == 'negosiasi')
<button class="btn btn-sm btn-warning mt-2" data-bs-toggle="modal"
data-bs-target="#negosiasiModal{{ $pesanan->id }}">
<i class="fas fa-info-circle"></i> Negosiasi
</button>
<button class="btn btn-sm btn-info mt-2" data-bs-toggle="modal"
data-bs-target="#cetakPesananModal{{ $pesanan->id }}">
<i class="fas fa-info-circle"></i> Detail
</button>
<form action="{{ route('terimalunas', $pesanan->id) }}"
method="POST" style="display: inline;">
@csrf
@method('PATCH')
<button class="btn btn-sm btn-primary mt-2" type="submit">
<i class="fas fa-trash-alt"></i> Terima
</button>
</form>
<button class="btn btn-sm btn-danger mt-2" data-bs-toggle="modal"
data-bs-target="#tolakModal{{ $pesanan->id }}">
<i class="fas fa-info-circle"></i> Tolak
</button>
@endif
</td>
</tr>
@endforeach
</tbody>
</table>
<div class="d-flex mt-4 text-black justify-content-center">
<ul class="pagination">
<li class="page-item {{ $pesanans->onFirstPage() ? 'disabled' : '' }}">
<a class="page-link" href="{{ $pesanans->previousPageUrl() }}"
aria-label="Previous">
<span aria-hidden="true">&laquo;</span>
</a>
</li>
@foreach ($pesanans->links()->elements[0] as $page => $url)
<li class="page-item {{ $page == $pesanans->currentPage() ? 'active' : '' }}">
<a class="page-link" href="{{ $url }}">{{ $page }}</a>
</li>
@endforeach
<li class="page-item {{ $pesanans->hasMorePages() ? '' : 'disabled' }}">
<a class="page-link" href="{{ $pesanans->nextPageUrl() }}" aria-label="Next">
<span aria-hidden="true">&raquo;</span>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script>
document.getElementById('statusFilter').addEventListener('change', function() {
const selectedStatus = this.value;
const rows = document.querySelectorAll('#statusTable tbody tr');
rows.forEach(row => {
if (selectedStatus === '' || row.dataset.status === selectedStatus) {
row.style.display = '';
} else {
row.style.display = 'none';
}
});
});
document.getElementById("searchInput").addEventListener("input", function() {
const searchValue = this.value.toLowerCase(); // Nilai input pencarian dalam huruf kecil
const tableRows = document.querySelectorAll("#orderTableBody tr"); // Semua baris di tabel
tableRows.forEach(row => {
const namaPelanggan = row.querySelector("td:nth-child(2) h6").textContent
.toLowerCase(); // Ambil nama pelanggan
if (namaPelanggan.includes(searchValue)) {
row.style.display = ""; // Tampilkan baris jika cocok
} else {
row.style.display = "none"; // Sembunyikan baris jika tidak cocok
}
});
});
</script>
@endsection
@foreach ($pesanans as $pesanan)
@include('admin.modal.editcetakpesanan')
@include('admin.modal.editpesanan')
@include('admin.modal.editpembayaran')
@include('admin.modal.modaltolak')
@include('admin.modal.negosiasi')
@include('admin.modal.dpmodal')
@endforeach
<script>
document.addEventListener('DOMContentLoaded', function() {
const formatRupiah = (angka, prefix = 'Rp.') => {
let number_string = angka.replace(/[^,\d]/g, '').toString(),
split = number_string.split(','),
sisa = split[0].length % 3,
rupiah = split[0].substr(0, sisa),
ribuan = split[0].substr(sisa).match(/\d{3}/gi);
if (ribuan) {
let separator = sisa ? '.' : '';
rupiah += separator + ribuan.join('.');
}
rupiah = split[1] != undefined ? rupiah + ',' + split[1] : rupiah;
return prefix + rupiah;
}
document.querySelectorAll('input[name="budget"]').forEach(function(el) {
el.addEventListener('keyup', function(e) {
// Remove prefix 'Rp.' and format again
this.value = formatRupiah(this.value.replace(/^Rp\.\s?/, ''), 'Rp.');
});
});
});
</script>