207 lines
9.2 KiB
PHP
207 lines
9.2 KiB
PHP
@extends('layouts.koleksi')
|
|
|
|
@section('title', 'Daftar Koleksi')
|
|
|
|
@section('content')
|
|
@php
|
|
use Picqer\Barcode\BarcodeGeneratorPNG;
|
|
@endphp
|
|
|
|
<div class="table-page-wrapper">
|
|
|
|
<div class="d-flex justify-content-between align-items-center mb-4 flex-wrap gap-2">
|
|
<h4 class="mb-0 fw-bold text-dark">
|
|
<i class="fas fa-book text-warning me-2"></i> Daftar Koleksi
|
|
</h4>
|
|
</div>
|
|
|
|
<div class="d-flex justify-content-between align-items-center flex-wrap gap-3 mb-4">
|
|
<form method="GET" action="{{ route('admin.koleksi.index') }}"
|
|
class="d-flex align-items-center gap-2 flex-wrap">
|
|
<div class="input-group" style="max-width: 320px;">
|
|
<input type="text" name="search" class="form-control form-control-sm shadow-sm"
|
|
placeholder="Cari judul, klasifikasi, atau kode..." value="{{ request('search') }}">
|
|
<button class="btn btn-sm btn-warning text-white px-3" type="submit">
|
|
<i class="fas fa-search"></i>
|
|
</button>
|
|
</div>
|
|
@if(request('search'))
|
|
<a href="{{ route('admin.koleksi.index') }}" class="btn btn-sm btn-secondary px-3">
|
|
<i class="fas fa-arrow-left"></i> Reset
|
|
</a>
|
|
@endif
|
|
</form>
|
|
</div>
|
|
|
|
@if (session('success'))
|
|
<div class="alert alert-success alert-dismissible fade show shadow-sm mt-3" role="alert">
|
|
<i class="fas fa-check-circle me-2"></i> {{ session('success') }}
|
|
<button type="button" class="btn-close" data-bs-dismiss="alert"></button>
|
|
</div>
|
|
@endif
|
|
|
|
<div class="table-responsive shadow-sm rounded-3">
|
|
<table class="table table-bordered table-modern align-middle mb-0">
|
|
<thead>
|
|
<tr>
|
|
<th class="text-center" width="4%">No</th>
|
|
<th>Judul</th>
|
|
<th width="10%">Klasifikasi</th>
|
|
<th width="10%">Kode Eksemplar</th>
|
|
<th width="9%">Barcode</th>
|
|
<th width="11%">Input Date</th>
|
|
<th width="11%">Terakhir Diubah</th>
|
|
<th width="8%">Sampul</th>
|
|
<th width="13%" class="text-center">Aksi</th>
|
|
</tr>
|
|
</thead>
|
|
|
|
<tbody>
|
|
@php $no = $results->firstItem(); @endphp
|
|
@forelse($results as $koleksi)
|
|
<tr>
|
|
<td class="text-center fw-semibold">{{ $no++ }}</td>
|
|
<td class="fw-semibold text-dark">{{ $koleksi->title ?? '-' }}</td>
|
|
<td class="text-center">{{ $koleksi->classification ?? '-' }}</td>
|
|
<td class="text-center">{{ $koleksi->kode_eksemplar ?? '-' }}</td>
|
|
|
|
<td class="text-center">
|
|
@if ($koleksi->barcode && Storage::disk('public')->exists($koleksi->barcode))
|
|
<img src="{{ Storage::url($koleksi->barcode) }}"
|
|
style="width:110px; height:40px; object-fit:contain;" class="rounded shadow-sm">
|
|
@elseif($koleksi->kode_eksemplar)
|
|
@php
|
|
$barcodeGen = new BarcodeGeneratorPNG();
|
|
$barcodeImg = base64_encode(
|
|
$barcodeGen->getBarcode($koleksi->kode_eksemplar, $barcodeGen::TYPE_CODE_128)
|
|
);
|
|
@endphp
|
|
<img src="data:image/png;base64,{{ $barcodeImg }}"
|
|
style="width:110px; height:40px; object-fit:contain;" class="rounded shadow-sm">
|
|
@else
|
|
<span class="text-muted">-</span>
|
|
@endif
|
|
</td>
|
|
|
|
<td class="text-center">
|
|
{{ $koleksi->input_date ? \Carbon\Carbon::parse($koleksi->input_date)->format('d-m-Y H:i') : '-' }}
|
|
</td>
|
|
<td class="text-center">
|
|
{{ $koleksi->last_update ? \Carbon\Carbon::parse($koleksi->last_update)->format('d-m-Y H:i') : '-' }}
|
|
</td>
|
|
|
|
<td class="text-center">
|
|
@if($koleksi->image && Storage::disk('public')->exists($koleksi->image))
|
|
<img src="{{ Storage::url($koleksi->image) }}" class="rounded shadow-sm"
|
|
style="width:55px; height:75px; object-fit:cover;">
|
|
@else
|
|
<span class="text-muted">-</span>
|
|
@endif
|
|
</td>
|
|
|
|
<td class="text-center">
|
|
<div class="d-flex justify-content-center gap-2 flex-wrap">
|
|
|
|
@if (!empty($koleksi->kode_eksemplar))
|
|
<a href="{{ route('admin.koleksi.barcode_single', ['kode_eksemplar' => $koleksi->kode_eksemplar]) }}"
|
|
target="_blank" class="btn btn-sm btn-outline-dark rounded-pill px-3 shadow-sm">
|
|
<i class="fas fa-barcode"></i> Cetak Barcode
|
|
</a>
|
|
@endif
|
|
|
|
@if (!empty($koleksi->kode_eksemplar))
|
|
<a href="{{ route('admin.koleksi.edit', ['kode_eksemplar' => $koleksi->kode_eksemplar]) }}"
|
|
class="btn btn-sm btn-outline-primary rounded-pill px-3 shadow-sm">
|
|
<i class="fas fa-edit"></i> Edit
|
|
</a>
|
|
@endif
|
|
|
|
@if (!empty($koleksi->kode_eksemplar))
|
|
<form
|
|
action="{{ route('admin.koleksi.destroy', ['kode_eksemplar' => $koleksi->kode_eksemplar]) }}"
|
|
method="POST" onsubmit="return confirm('Yakin ingin menghapus koleksi ini?')"
|
|
class="d-inline">
|
|
@csrf
|
|
@method('DELETE')
|
|
<button type="submit" class="btn btn-sm btn-outline-danger rounded-pill px-3">
|
|
<i class="fas fa-trash"></i> Hapus
|
|
</button>
|
|
</form>
|
|
@endif
|
|
</div>
|
|
</td>
|
|
|
|
</tr>
|
|
@empty
|
|
<tr>
|
|
<td colspan="9" class="text-center text-muted py-4">
|
|
<i class="fas fa-inbox fa-2x mb-2 d-block"></i>
|
|
Tidak ada data koleksi ditemukan.
|
|
</td>
|
|
</tr>
|
|
@endforelse
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<div class="d-flex flex-column align-items-center mt-4 gap-3">
|
|
{{ $results->links('pagination::bootstrap-4') }}
|
|
|
|
<a href="{{ route('admin.dashboard') }}" class="btn btn-secondary rounded-pill px-4 shadow-sm">
|
|
<i class="fas fa-arrow-left me-1"></i> Kembali
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<style>
|
|
.table-page-wrapper {
|
|
width: 100vw;
|
|
margin-left: calc(-50vw + 50%);
|
|
background: #ffffff;
|
|
min-height: 100vh;
|
|
padding: 40px 60px;
|
|
overflow-x: hidden;
|
|
}
|
|
|
|
.table-modern thead th {
|
|
background-color: #fbfdffff;
|
|
color: #131313ff;
|
|
font-weight: 600;
|
|
border-bottom: 2px solid #f3f3f5ff;
|
|
text-align: center;
|
|
}
|
|
|
|
.table-modern tbody tr:nth-child(even) {
|
|
background-color: #fffaf3;
|
|
}
|
|
|
|
.table-modern tbody tr:hover {
|
|
background-color: #fff2cc;
|
|
transition: 0.25s ease;
|
|
}
|
|
|
|
.btn-outline-primary:hover {
|
|
background-color: #2563eb;
|
|
color: #fff;
|
|
}
|
|
|
|
.btn-outline-danger:hover {
|
|
background-color: #dc2626;
|
|
color: #fff;
|
|
}
|
|
|
|
.btn-outline-dark:hover {
|
|
background-color: #111827;
|
|
color: #fff;
|
|
}
|
|
|
|
html {
|
|
scroll-behavior: smooth;
|
|
}
|
|
|
|
.pagination {
|
|
scroll-margin-top: 150px;
|
|
}
|
|
</style>
|
|
|
|
@endsection |