tps dan kategori

This commit is contained in:
rahmagustin 2026-01-30 10:18:47 +07:00
parent 01ae5917d7
commit 3f01fe71b1
5 changed files with 172 additions and 127 deletions

View File

@ -29968,11 +29968,4 @@ @media (max-width: 991px) {
} }
} }
.deskripsi-cell {
max-width: 350px; /* atur sesuai kebutuhan */
white-space: normal; /* teks boleh turun baris */
word-wrap: break-word; /* potong kata panjang */
vertical-align: top;
}
/*# sourceMappingURL=../maps/vertical-layout-light/style.css.map */ /*# sourceMappingURL=../maps/vertical-layout-light/style.css.map */

View File

@ -14,17 +14,17 @@
<div class="form-group"> <div class="form-group">
<label>Nama Kategori</label> <label>Nama Kategori</label>
<input type="text" name="nama_kategori" class="form-control" required> <input type="text" name="nama_kategori" class="form-control" placeholder="Nama Kategori">
</div> </div>
<div class="form-group"> <div class="form-group">
<label>Kepanjangan Kategori</label> <label>Kepanjangan Kategori</label>
<input type="text" name="kepanjangan_kategori" class="form-control"> <input type="text" name="kepanjangan_kategori" class="form-control" placeholder="Kepanjangan Kategori">
</div> </div>
<div class="form-group"> <div class="form-group">
<label for="exampleTextarea1">Deskripsi</label> <label for="exampleTextarea1">Deskripsi</label>
<textarea name="deskripsi" class="form-control" id="exampleTextarea1" rows="4"></textarea> <textarea name="deskripsi" class="form-control" id="exampleTextarea1" rows="8" placeholder="Deskripsi"></textarea>
</div> </div>
<div class="form-group"> <div class="form-group">

View File

@ -28,7 +28,7 @@ class="form-control">
<div class="form-group"> <div class="form-group">
<label>Deskripsi</label> <label>Deskripsi</label>
<textarea name="deskripsi" class="form-control">{{ $kategori->deskripsi }}</textarea> <textarea name="deskripsi" rows="8" class="form-control">{{ $kategori->deskripsi }}</textarea>
</div> </div>
<div class="form-group"> <div class="form-group">

View File

@ -1,115 +1,124 @@
@extends('admin.template') @extends('admin.template')
@section('content') @section('content')
<div class="content-wrapper"> <style>
<div class="row"> .deskripsi-truncate-div {
<div class="col-lg-12 grid-margin stretch-card"> max-width: 300px; /* lebar kolom deskripsi */
<div class="card"> white-space: normal !important; /* override Bootstrap */
<div class="card-body"> word-wrap: break-word !important;
<div class="d-flex justify-content-between mb-3"> overflow-wrap: break-word !important;
<div> }
<h4 class="card-title mb-0">Data Kategori TPS</h4> .table td {
<p class="card-description mb-0"> vertical-align: top; /* supaya teks membungkus ke bawah */
Daftar Kategori Tempat Pembangunan Sampah (TPS) }
</p> </style>
</div>
<a href="{{ route('admin.kategori.create') }}" class="btn btn-primary"> <div class="content-wrapper">
<i class="bi bi-plus-lg"></i> Tambah <div class="row">
</a> <div class="col-lg-12 grid-margin stretch-card">
<div class="card">
<div class="card-body">
<div class="mb-3 d-flex justify-content-between">
<div>
<h4 class="mb-0 card-title">Data Kategori TPS</h4>
<p class="mb-0 card-description">
Daftar Kategori Tempat Pembangunan Sampah (TPS)
</p>
</div> </div>
<a href="{{ route('admin.kategori.create') }}" class="btn btn-primary">
<div class="table-responsive"> <i class="bi bi-plus-lg"></i> Tambah
<table class="table"> </a>
<thead>
<tr>
<th>Nama Kategori</th>
<th>Foto</th>
<th>Deskripsi</th>
<th>Aksi</th>
</tr>
</thead>
<tbody>
@foreach ($kategori as $item)
<tr>
<td>{{ $item->nama_kategori }}</td>
<td>
@if ($item->foto_kategori)
<img src="{{ asset('storage/' . $item->foto_kategori) }}" alt="Foto Kategori"
style="
width:200px;
height:auto;
border-radius:2px;
">
@else
<span class="text-muted">-</span>
@endif
</td>
<td class="deskripsi-truncate">
{{ $item->deskripsi ?? '-' }}
</td>
<td class="text-center">
<a href="{{ route('admin.kategori.edit', $item->id_kategori_tps) }}"
class="btn btn-warning btn-sm me-1" title="Edit">
<i class="bi bi-pencil-square"></i>
</a>
<form action="{{ route('admin.tps.destroy', $item->id_kategori_tps) }}" method="POST"
class="form-hapus" style="display:inline;">
@csrf
@method('DELETE')
<button type="submit" class="btn btn-danger btn-sm">
<i class="bi bi-trash"></i>
</button>
</form>
</td>
</tr>
@endforeach
</tbody>
</table>
</div>
</div> </div>
<div class="table-responsive">
<table class="table">
<thead>
<tr>
<th>Nama Kategori</th>
<th>Foto</th>
<th>Deskripsi</th>
<th>Aksi</th>
</tr>
</thead>
<tbody>
@foreach ($kategori as $item)
<tr>
<td>{{ $item->nama_kategori }}</td>
<td>
@if ($item->foto_kategori)
<img src="{{ asset('storage/' . $item->foto_kategori) }}" alt="Foto Kategori"
style="width:200px; height:auto; border-radius:2px;">
@else
<span class="text-muted">-</span>
@endif
</td>
<td>
<div class="deskripsi-truncate-div">
{{ $item->deskripsi ?? '-' }}
</div>
</td>
<td class="text-center">
<a href="{{ route('admin.kategori.edit', $item->id_kategori_tps) }}"
class="btn btn-warning btn-sm me-1" title="Edit">
<i class="bi bi-pencil-square"></i>
</a>
<form action="{{ route('admin.tps.destroy', $item->id_kategori_tps) }}" method="POST"
class="form-hapus" style="display:inline;">
@csrf
@method('DELETE')
<button type="submit" class="btn btn-danger btn-sm">
<i class="bi bi-trash"></i>
</button>
</form>
</td>
</tr>
@endforeach
</tbody>
</table>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<script> </div>
document.querySelectorAll('.form-hapus').forEach(form => {
form.addEventListener('submit', function(e) {
e.preventDefault();
Swal.fire({ <script>
title: 'Hapus Data Kategori TPS?', document.querySelectorAll('.form-hapus').forEach(form => {
text: 'Data yang sudah dihapus tidak dapat dikembalikan!', form.addEventListener('submit', function(e) {
icon: 'warning', e.preventDefault();
showCancelButton: true,
confirmButtonColor: '#d33', Swal.fire({
cancelButtonColor: '#6c757d', title: 'Hapus Data Kategori TPS?',
confirmButtonText: 'Ya, Hapus', text: 'Data yang sudah dihapus tidak dapat dikembalikan!',
cancelButtonText: 'Batal', icon: 'warning',
didOpen: () => { showCancelButton: true,
document.querySelector('.swal2-popup').style.fontFamily = confirmButtonColor: '#d33',
'Nunito, sans-serif'; cancelButtonColor: '#6c757d',
} confirmButtonText: 'Ya, Hapus',
}).then((result) => { cancelButtonText: 'Batal',
if (result.isConfirmed) { didOpen: () => {
form.submit(); document.querySelector('.swal2-popup').style.fontFamily =
} 'Nunito, sans-serif';
}); }
}); }).then((result) => {
if (result.isConfirmed) {
form.submit();
}
}); });
</script> });
});
</script>
@if (session('success'))
@if (session('success')) <script>
<script> Swal.fire({
Swal.fire({ icon: 'success',
icon: 'success', title: 'Berhasil',
title: 'Berhasil', text: '{{ session('success') }}',
text: '{{ session('success') }}', timer: 2000,
timer: 2000, showConfirmButton: false
showConfirmButton: false });
}); </script>
</script> @endif
@endif
@endsection @endsection

View File

@ -15,7 +15,9 @@
<!-- Fonts --> <!-- Fonts -->
<link href="https://fonts.googleapis.com" rel="preconnect"> <link href="https://fonts.googleapis.com" rel="preconnect">
<link href="https://fonts.gstatic.com" rel="preconnect" crossorigin> <link href="https://fonts.gstatic.com" rel="preconnect" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Source+Sans+Pro:ital,wght@0,200;0,300;0,400;0,600;0,700;0,900;1,200;1,300;1,400;1,600;1,700;1,900&display=swap" rel="stylesheet"> <link
href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Source+Sans+Pro:ital,wght@0,200;0,300;0,400;0,600;0,700;0,900;1,200;1,300;1,400;1,600;1,700;1,900&display=swap"
rel="stylesheet">
<!-- Vendor CSS Files --> <!-- Vendor CSS Files -->
<link href="{{ asset('assets/user/vendor/bootstrap/css/bootstrap.min.css') }}" rel="stylesheet"> <link href="{{ asset('assets/user/vendor/bootstrap/css/bootstrap.min.css') }}" rel="stylesheet">
@ -42,21 +44,60 @@
<nav id="navmenu" class="navmenu"> <nav id="navmenu" class="navmenu">
<ul> <ul>
<li><a href="{{ route('user.index') }}" class="active">Beranda<br></a></li> <li>
<li class="dropdown"><a href="{{ route('user.about') }}"><span>Tentang</span> <i class="bi bi-chevron-down toggle-dropdown"></i></a> <a href="{{ route('user.index') }}"
<ul> class="{{ Request::routeIs('user.index') ? 'active' : '' }}">
<li><a href="{{ route('user.about-tps') }}">TPS</a></li> Beranda<br>
<li><a href="{{ route('user.about-tps') }}">TPS 3R</a></li> </a>
<li><a href="{{ route('user.about-tps') }}">TPA</a></li> </li>
</ul>
<li class="dropdown">
<a href="{{ route('user.about') }}"
class="{{ Request::routeIs('user.about*') ? 'active' : '' }}">
<span>Tentang</span>
<i class="bi bi-chevron-down toggle-dropdown"></i>
</a>
<ul>
<li>
<a href="{{ route('user.about-tps') }}"
class="{{ Request::routeIs('user.about-tps') ? 'active' : '' }}">TPS</a>
</li> </li>
<li><a href="{{ route('user.sig-tps') }}">Sebaran TPS</a></li> <li>
<li><a href="{{ route('user.aduan') }}">Aduan TPS</a></li> <a href="{{ route('user.about-tps') }}"
<li><a href="{{ route('user.kontak') }}">Kontak</a></li> class="{{ Request::routeIs('user.about-tps') ? 'active' : '' }}">TPS 3R</a>
</li>
<li>
<a href="{{ route('user.about-tps') }}"
class="{{ Request::routeIs('user.about-tps') ? 'active' : '' }}">TPA</a>
</li>
</ul>
</li>
<li>
<a href="{{ route('user.sig-tps') }}"
class="{{ Request::routeIs('user.sig-tps') ? 'active' : '' }}">
Sebaran TPS
</a>
</li>
<li>
<a href="{{ route('user.aduan') }}"
class="{{ Request::routeIs('user.aduan') ? 'active' : '' }}">
Aduan TPS
</a>
</li>
<li>
<a href="{{ route('user.kontak') }}"
class="{{ Request::routeIs('user.kontak') ? 'active' : '' }}">
Kontak
</a>
</li>
</ul> </ul>
<i class="mobile-nav-toggle d-xl-none bi bi-list"></i> <i class="mobile-nav-toggle d-xl-none bi bi-list"></i>
</nav> </nav>
<a class="btn-getstarted" href="{{ route('login') }}">Masuk</a> <a class="btn-getstarted" href="{{ route('login') }}">Masuk</a>
</div> </div>
@ -75,9 +116,10 @@
<a href="index.html" class="logo d-flex align-items-center"> <a href="index.html" class="logo d-flex align-items-center">
<span class="sitename">SIG TPS Kab. Nganjuk</span> <span class="sitename">SIG TPS Kab. Nganjuk</span>
</a> </a>
<div class="footer-contact pt-3"> <div class="pt-3 footer-contact">
<p>Dinas Lingkungan Hidup Kabupaten Nganjuk</p> <p>Dinas Lingkungan Hidup Kabupaten Nganjuk</p>
<p>Jl. Raya Kedondong No.01, Sanggrahan, Kedondong, Kec. Bagor, Kabupaten Nganjuk, Jawa Timur 64461</p> <p>Jl. Raya Kedondong No.01, Sanggrahan, Kedondong, Kec. Bagor, Kabupaten Nganjuk, Jawa
Timur 64461</p>
</div> </div>
</div> </div>
@ -129,7 +171,8 @@
</footer> </footer>
<!-- Scroll Top --> <!-- Scroll Top -->
<a href="#" id="scroll-top" class="scroll-top d-flex align-items-center justify-content-center"><i class="bi bi-arrow-up-short"></i></a> <a href="#" id="scroll-top" class="scroll-top d-flex align-items-center justify-content-center"><i
class="bi bi-arrow-up-short"></i></a>
<!-- Preloader --> <!-- Preloader -->
<div id="preloader"></div> <div id="preloader"></div>