daengdeni/lpj
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

sementara

Browse Source
This commit is contained in:
Daeng Deni Mardaeni
2026-01-30 14:44:14 +07:00
parent f402c0831a
commit aceff4f006
29 changed files with 2144 additions and 93 deletions
Download Patch File Download Diff File Expand all files Collapse all files

197
resources/views/bank-data/index.blade.php
View File

@@ -5,17 +5,47 @@
@endsection
@section('content')
<div class="grid grid-cols-1 lg:grid-cols-4 gap-5 lg:gap-7.5 mb-10">
<style>
.loading-overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(255, 255, 255, 0.8);
display: none;
justify-content: center;
align-items: center;
z-index: 9999;
}
.loading-spinner {
border: 4px solid #f3f3f3;
border-top: 4px solid #3498db;
border-radius: 50%;
width: 40px;
height: 40px;
animation: spin 1s linear infinite;
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
</style>
<div class="loading-overlay" id="loadingOverlay">
<div class="loading-spinner"></div>
</div>
<div class="grid grid-cols-1 gap-5 mb-10 lg:grid-cols-4 lg:gap-7.5">
<div class="col-span-1">
<div class="card border border-agi-100 card-grid min-w-full">
<div class="card-header bg-agi-50 py-5 flex-wrap">
<div class="min-w-full border card border-agi-100 card-grid">
<div class="flex-wrap py-5 card-header bg-agi-50">
<h3 class="card-title">
Filter
</h3>
</div>
<div class="card-body px-5">
<div class="px-5 card-body">
<form id="filter-form">
<div class="grid gap-4 w-full p-5">
<div class="grid gap-4 p-5 w-full">
<div>
<label for="kategori" class="block text-sm font-medium text-gray-700">Kategori</label>
@@ -77,14 +107,20 @@
</div>
<div>
<label for="start_date" class="block text-sm font-medium text-gray-700">Start Date</label>
<input type="date" id="start_date" name="start_date" class="mt-1 block w-full py-2 px-3 border border-gray-300 bg-white rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm">
<input type="date" id="start_date" name="start_date" class="block px-3 py-2 mt-1 w-full bg-white rounded-md border border-gray-300 shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm">
</div>
<div>
<label for="end_date" class="block text-sm font-medium text-gray-700">End Date</label>
<input type="date" id="end_date" name="end_date" class="mt-1 block w-full py-2 px-3 border border-gray-300 bg-white rounded-md shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm">
<input type="date" id="end_date" name="end_date" class="block px-3 py-2 mt-1 w-full bg-white rounded-md border border-gray-300 shadow-sm focus:outline-none focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm">
</div>
<div>
<button type="submit" class="w-full inline-flex justify-center py-2 px-4 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
<div class="flex items-center">
<input id="show_all" name="show_all" type="checkbox" class="w-4 h-4 text-indigo-600 bg-gray-100 rounded border-gray-300 focus:ring-indigo-500 focus:ring-2">
<label for="show_all" class="ml-2 text-sm font-medium text-gray-700">Tampilkan Semua Data</label>
</div>
</div>
<div>
<button type="submit" class="inline-flex justify-center px-4 py-2 w-full text-sm font-medium text-white bg-indigo-600 rounded-md border border-transparent shadow-sm hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
Apply Filters
</button>
</div>
@@ -95,21 +131,21 @@
</div>
<div class="col-span-3">
<div class="card border border-agi-100 card-grid min-w-full">
<div class="card-header bg-agi-50 py-5 flex-wrap">
<div class="min-w-full border card border-agi-100 card-grid">
<div class="flex-wrap py-5 card-header bg-agi-50">
<h3 class="card-title">
Maps
</h3>
</div>
<div class="card-body px-5">
<div class="px-5 card-body">
<div id="map" style="height: 700px; width: 100%;"></div>
</div>
</div>
</div>
</div>
<div class="w-full grid gap-5 lg:gap-7.5 mx-auto">
<div class="card border border-agi-100 card-grid min-w-full" data-datatable="false" data-datatable-page-size="10" data-datatable-state-save="false" id="bank-data-table" data-api-url="{{ route('bank-data.datatables') }}">
<div class="card-header bg-agi-50 py-5 flex-wrap">
<div class="grid gap-5 mx-auto w-full lg:gap-7.5">
<div class="min-w-full border card border-agi-100 card-grid" data-datatable="false" data-datatable-page-size="10" data-datatable-state-save="false" id="bank-data-table" data-api-url="{{ route('bank-data.datatables') }}">
<div class="flex-wrap py-5 card-header bg-agi-50">
<h3 class="card-title">
Daftar Bank Data
</h3>
@@ -128,7 +164,7 @@
<div class="card-body">
<div class="scrollable-x-auto">
<table class="table table-auto table-border align-middle text-gray-700 font-medium text-sm" data-datatable-table="true">
<table class="table text-sm font-medium text-gray-700 align-middle table-auto table-border" data-datatable-table="true">
<thead>
<tr>
<th class="w-14">
@@ -174,13 +210,13 @@
</thead>
</table>
</div>
<div class="card-footer justify-center md:justify-between flex-col md:flex-row gap-3 text-gray-600 text-2sm font-medium">
<div class="flex items-center gap-2">
<div class="flex-col gap-3 justify-center font-medium text-gray-600 card-footer md:justify-between md:flex-row text-2sm">
<div class="flex gap-2 items-center">
Show
<select class="select select-sm w-16" data-datatable-size="true" name="perpage"> </select> per
<select class="w-16 select select-sm" data-datatable-size="true" name="perpage"> </select> per
page
</div>
<div class="flex items-center gap-4">
<div class="flex gap-4 items-center">
<span data-datatable-info="true"> </span>
<div class="pagination" data-datatable-pagination="true">
</div>
@@ -190,10 +226,10 @@
</div>
</div>
<div id="imageModal" class="fixed inset-0 bg-black bg-opacity-50 hidden items-center justify-center z-50">
<div id="imageModal" class="hidden fixed inset-0 z-50 justify-center items-center bg-black bg-opacity-50">
<div class="bg-white p-4 rounded-lg max-w-3xl max-h-[100vh] overflow-auto">
<img id="modalImage" src="" alt="Zoomed Image" class="max-w-full h-auto">
<button id="closeModal" class="mt-4 px-4 py-2 bg-red-300 text-gray-800 rounded hover:bg-red-400" onclick="closeImageModal()">Close</button>
<button id="closeModal" class="px-4 py-2 mt-4 text-gray-800 bg-red-300 rounded hover:bg-red-400" onclick="closeImageModal()">Close</button>
</div>
</div>
@endsection
@@ -261,8 +297,9 @@
const markerColors = {
data_pembanding: 'http://maps.google.com/mapfiles/ms/icons/red-dot.png',
penilaian: 'http://maps.google.com/mapfiles/ms/icons/blue-dot.png',
input: 'http://maps.google.com/mapfiles/ms/icons/yellow-dot.png'
internal: 'http://maps.google.com/mapfiles/ms/icons/orange-dot.png',
input: 'http://maps.google.com/mapfiles/ms/icons/yellow-dot.png',
kjpp: 'http://maps.google.com/mapfiles/ms/icons/purple-dot.png'
};
if (lat && lng) {
@@ -277,95 +314,95 @@
const contentString = `
<div id='content' style='width: 550px; max-width: 100%;'>
<div id='siteNotice'></div>
<h2 class='card-title mb-5'>
<h2 class='mb-5 card-title'>
${item.jenis_aset}
</h2>
<div class="grid gap-3">
<div class='flex items-center justify-between flex-wrap gap-1.5'>
<div class='flex items-center gap-1.5'>
<div class='flex flex-wrap gap-1.5 justify-between items-center'>
<div class='flex gap-1.5 items-center'>
<span class='text-sm font-normal text-gray-900'>
Tanggal Penilaian
</span>
</div>
<div class='flex items-center text-sm font-medium text-gray-800 gap-6'>
<div class='flex gap-6 items-center text-sm font-medium text-gray-800'>
<span class='lg:text-right'>
${window.formatTanggalIndonesia(item.tanggal)}
</span>
</div>
</div>
<div class="border-t border-gray-300 border-dashed"></div>
<div class='flex items-center justify-between flex-wrap gap-1.5'>
<div class='flex items-center gap-1.5'>
<div class='flex flex-wrap gap-1.5 justify-between items-center'>
<div class='flex gap-1.5 items-center'>
<span class='text-sm font-normal text-gray-900'>
Tahun
</span>
</div>
<div class='flex items-center text-sm font-medium text-gray-800 gap-6'>
<div class='flex gap-6 items-center text-sm font-medium text-gray-800'>
<span class='lg:text-right'>
${item.tahun}
</span>
</div>
</div>
<div class="border-t border-gray-300 border-dashed"></div>
<div class='flex items-center justify-between flex-wrap gap-1.5'>
<div class='flex items-center gap-1.5'>
<div class='flex flex-wrap gap-1.5 justify-between items-center'>
<div class='flex gap-1.5 items-center'>
<span class='text-sm font-normal text-gray-900'>
Luas Tanah
</span>
</div>
<div class='flex items-center text-sm font-medium text-gray-800 gap-6'>
<div class='flex gap-6 items-center text-sm font-medium text-gray-800'>
<span class='lg:text-right'>
${item.luas_tanah} m²
</span>
</div>
</div>
<div class="border-t border-gray-300 border-dashed"></div>
<div class='flex items-center justify-between flex-wrap gap-1.5'>
<div class='flex items-center gap-1.5'>
<div class='flex flex-wrap gap-1.5 justify-between items-center'>
<div class='flex gap-1.5 items-center'>
<span class='text-sm font-normal text-gray-900'>
Luas Bangunan
</span>
</div>
<div class='flex items-center text-sm font-medium text-gray-800 gap-6'>
<div class='flex gap-6 items-center text-sm font-medium text-gray-800'>
<span class='lg:text-right'>
${item.luas_bangunan} m²
</span>
</div>
</div>
<div class="border-t border-gray-300 border-dashed"></div>
<div class='flex items-center justify-between flex-wrap gap-1.5'>
<div class='flex items-center gap-1.5'>
<div class='flex flex-wrap gap-1.5 justify-between items-center'>
<div class='flex gap-1.5 items-center'>
<span class='text-sm font-normal text-gray-900'>
Harga
</span>
</div>
<div class='flex items-center text-sm font-medium text-gray-800 gap-6'>
<div class='flex gap-6 items-center text-sm font-medium text-gray-800'>
<span class='lg:text-right'>
${window.formatRupiah(item.harga)}
</span>
</div>
</div>
<div class="border-t border-gray-300 border-dashed"></div>
<div class='flex items-center justify-between flex-wrap gap-1.5'>
<div class='flex items-center gap-1.5'>
<div class='flex flex-wrap gap-1.5 justify-between items-center'>
<div class='flex gap-1.5 items-center'>
<span class='text-sm font-normal text-gray-900'>
Nilai Pasar
</span>
</div>
<div class='flex items-center text-sm font-medium text-gray-800 gap-6'>
<div class='flex gap-6 items-center text-sm font-medium text-gray-800'>
<span class='lg:text-right'>
${window.formatRupiah(item.nilai_pasar)}
</span>
</div>
</div>
<div class="border-t border-gray-300 border-dashed"></div>
<div class='flex items-start justify-between flex-wrap gap-1.5'>
<div class='flex items-start gap-1.5'>
<div class='flex flex-wrap gap-1.5 justify-between items-start'>
<div class='flex gap-1.5 items-start'>
<span class='text-sm font-normal text-gray-900'>
Location
</span>
</div>
<div class='flex items-center text-sm font-medium text-gray-800 gap-6'>
<div class='flex gap-6 items-center text-sm font-medium text-gray-800'>
<span class='text-right whitespace-normal break-words'>
${item.address.split(' ').reduce((acc, word, index, array) => {
if (index > 0 && index % 7 === 0) {
@@ -378,16 +415,16 @@
</div>
</div>
${item.photos && item.photos.length > 0 ? `
<div class="photo-gallery mb-5">
<div class="main-photo mb-2">
<div class="mb-5 photo-gallery">
<div class="mb-2 main-photo">
<img src="storage/${item.photos[0]}" alt="${item.jenis_aset}"
style="width: 100%; height: auto; object-fit: cover; cursor: pointer;"
onclick="openImageModal(this.src)">
</div>
<div class="thumbnail-container flex gap-2 overflow-x-auto">
<div class="flex overflow-x-auto gap-2 thumbnail-container">
${item.photos.map((photo, index) => `
<img src="storage/${photo}" alt="${item.jenis_aset} ${index + 1}"
class="thumbnail cursor-pointer"
class="cursor-pointer thumbnail"
style="width: 60px; height: 60px; object-fit: cover;"
onclick="changeMainPhoto(this, ${index})">
`).join('')}
@@ -462,6 +499,16 @@
const dataTableOptions = {
apiEndpoint: apiUrl,
pageSize: 5,
ajax: {
data: function(data) {
// Add show_all parameter if checkbox is checked
const showAllCheckbox = document.getElementById('show_all');
if (showAllCheckbox && showAllCheckbox.checked) {
data.show_all = true;
}
return data;
}
},
columns: {
select: {
render: (item, data, context) => {
@@ -535,11 +582,36 @@
}
const filterForm = document.getElementById('filter-form');
const loadingOverlay = document.getElementById('loadingOverlay');
function showLoading() {
loadingOverlay.style.display = 'flex';
}
function hideLoading() {
loadingOverlay.style.display = 'none';
}
filterForm.addEventListener('submit', function (e) {
e.preventDefault();
showLoading();
const formData = new FormData(this);
const filters = Object.fromEntries(formData.entries());
// Check if show_all is checked
const showAllCheckbox = document.getElementById('show_all');
if (showAllCheckbox.checked) {
filters.show_all = true;
// Hide pagination controls when showing all data
document.querySelector('[data-datatable-pagination="true"]').style.display = 'none';
document.querySelector('[data-datatable-size="true"]').closest('div').style.display = 'none';
} else {
// Show pagination controls when using pagination
document.querySelector('[data-datatable-pagination="true"]').style.display = 'block';
document.querySelector('[data-datatable-size="true"]').closest('div').style.display = 'flex';
}
// Apply the new search/filter
if (filters) {
dataTable.search(filters, true);
@@ -547,16 +619,26 @@
// Reload the table to apply the new filters
dataTable.reload();
// Hide loading after a short delay to allow table to update
setTimeout(hideLoading, 300);
});
function updatePagination(response) {
const paginationInfo = document.querySelector('[data-datatable-info="true"]');
const showAllCheckbox = document.getElementById('show_all');
if (paginationInfo) {
if (response.recordsFiltered > 0) {
const start = (response.page - 1) * response.pageSize + 1;
const end = Math.min(start + response.pageSize - 1, response.recordsFiltered);
paginationInfo.textContent = `Showing ${start} to ${end} of ${response.recordsFiltered} entries`;
if (showAllCheckbox && showAllCheckbox.checked) {
// Show all data message when show_all is active
paginationInfo.textContent = `Showing all ${response.recordsFiltered} entries`;
} else {
// Normal pagination message
const start = (response.page - 1) * response.pageSize + 1;
const end = Math.min(start + response.pageSize - 1, response.recordsFiltered);
paginationInfo.textContent = `Showing ${start} to ${end} of ${response.recordsFiltered} entries`;
}
} else {
paginationInfo.textContent = 'No entries to show';
}
@@ -567,6 +649,17 @@
initMap();
initializeDataTable();
// Load all data on first initialization
setTimeout(() => {
const showAllCheckbox = document.getElementById('show_all');
showAllCheckbox.checked = true; // Check the show all checkbox by default
// Trigger filter submit to load all data
const filterForm = document.getElementById('filter-form');
const event = new Event('submit');
filterForm.dispatchEvent(event);
}, 500);
dataTable.on('draw', () => {
console.log("Table redrawn");
});

2
resources/views/penilai/components/analisa/lingkungan.blade.php
View File

@@ -23,7 +23,7 @@
<td style="padding: 2px; vertical-align: top;">Jalan Utama</td>
<td style="padding: 2px; vertical-align: top;">:</td>
<td style="padding: 2px; vertical-align: top;">{{ $lingkungan['jalan_linkungan'] ?? '-' }}</td>
</tr>
<tr>
<td style="padding: 2px; vertical-align: top;">Jarak CBD</td>
<td style="padding: 2px; vertical-align: top;">:</td>

1
resources/views/penilai/components/analisa/tanah.blade.php
View File

@@ -112,7 +112,6 @@
</td>
</tr>
</tr>
<tr>
<td>Tusuk Sate</td>
<td>:</td>

6
resources/views/penilai/components/foto-jaminan.blade.php
View File

@@ -136,6 +136,7 @@
$fallbackPath = null;
// Jika file asli tidak ditemukan, buat fallback path
if ($statusLpj == 1) {
$fullOriginalPath = storage_path('app/public/' . $originalPath);
@@ -156,10 +157,7 @@
$resizedPath = resize_image($pathToUse, 800, 400, 25);
$filePath =
$statusLpj == 1
? storage_path('app/public/' . $resizedPath)
: asset('storage/' . $resizedPath);
$filePath = storage_path('app/public/' . $resizedPath);
$extension = strtolower(pathinfo($pathToUse, PATHINFO_EXTENSION));
$isImage = in_array($extension, [

1
resources/views/penilai/components/print-out-sederhana.blade.php
View File

@@ -624,7 +624,6 @@
: $likuidasiCalc;
@endphp
<td style="padding: 3px; text-align: right;font-weight: bold;">{{ number_format($likuidasiFinal, 0, ',', '.') }}</td>
</td>
</tr>
</table>
</td>

147
resources/views/referensi_link/create.blade.php Normal file
View File

@@ -0,0 +1,147 @@
@extends('layouts.main')
@section('breadcrumbs')
{{ Breadcrumbs::render(request()->route()->getName()) }}
@endsection
@section('content')
<div class="w-full grid gap-5 lg:gap-7.5 mx-auto">
<form method="POST" action="{{ route('basicdata.referensi-link.store') }}">
@csrf
<div class="card border border-agi-100 pb-2.5">
<div class="card-header bg-agi-50" id="basic_settings">
<h3 class="card-title">
Tambah Referensi Link
</h3>
<div class="flex items-center gap-2">
<a href="{{ route('basicdata.referensi-link.index') }}" class="btn btn-xs btn-info"><i class="ki-filled ki-exit-left"></i> Back</a>
</div>
</div>
<div class="card-body grid gap-5">
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
<label class="form-label max-w-56">
Nama Referensi Link <span class="text-danger">*</span>
</label>
<div class="flex flex-wrap items-baseline w-full">
<input class="input @error('name') border-danger bg-danger-light @enderror"
type="text"
name="name"
value="{{ old('name') }}"
placeholder="Masukkan nama referensi link"
required>
@error('name')
<em class="alert text-danger text-sm">{{ $message }}</em>
@enderror
</div>
</div>
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
<label class="form-label max-w-56">
Link URL <span class="text-danger">*</span>
</label>
<div class="flex flex-wrap items-baseline w-full">
<input class="input @error('link') border-danger bg-danger-light @enderror"
type="url"
name="link"
value="{{ old('link') }}"
placeholder="https://example.com"
required>
@error('link')
<em class="alert text-danger text-sm">{{ $message }}</em>
@enderror
<div class="form-hint">Pastikan link diawali dengan http:// atau https://</div>
</div>
</div>
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
<label class="form-label max-w-56">
Kategori
</label>
<div class="flex flex-wrap items-baseline w-full">
<input class="input @error('kategori') border-danger bg-danger-light @enderror"
type="text"
name="kategori"
value="{{ old('kategori') }}"
placeholder="Misal: regulasi, panduan, dll">
@error('kategori')
<em class="alert text-danger text-sm">{{ $message }}</em>
@enderror
<div class="form-hint">Kosongkan jika tidak ada kategori</div>
</div>
</div>
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
<label class="form-label max-w-56">
Deskripsi
</label>
<div class="flex flex-wrap items-baseline w-full">
<textarea class="textarea @error('deskripsi') border-danger bg-danger-light @enderror"
name="deskripsi"
rows="4"
placeholder="Masukkan deskripsi lengkap referensi link">{{ old('deskripsi') }}</textarea>
@error('deskripsi')
<em class="alert text-danger text-sm">{{ $message }}</em>
@enderror
</div>
</div>
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
<label class="form-label max-w-56">
Status Aktif
</label>
<div class="flex flex-wrap items-baseline w-full">
<label class="switch">
<input type="checkbox" name="is_active" value="1" {{ old('is_active', true) ? 'checked' : '' }}>
<span class="switch-slider"></span>
</label>
<span class="ml-3 text-sm text-gray-600">Aktifkan referensi link ini</span>
@error('is_active')
<em class="alert text-danger text-sm">{{ $message }}</em>
@enderror
</div>
</div>
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
<label class="form-label max-w-56">
Urutan Tampil
</label>
<div class="flex flex-wrap items-baseline w-full">
<input class="input @error('urutan') border-danger bg-danger-light @enderror"
type="number"
name="urutan"
value="{{ old('urutan', 0) }}"
min="0"
placeholder="0">
@error('urutan')
<em class="alert text-danger text-sm">{{ $message }}</em>
@enderror
<div class="form-hint">Semakin kecil angka, semakin atas posisinya</div>
</div>
</div>
</div>
<div class="card-footer justify-end">
<div class="flex flex-wrap gap-2">
<a href="{{ route('basicdata.referensi-link.index') }}" class="btn btn-light">
<i class="ki-filled ki-exit-left"></i> Batal
</a>
<button type="submit" class="btn btn-primary">
<i class="ki-filled ki-check"></i> Simpan
</button>
</div>
</div>
</div>
</form>
</div>
@endsection
@push('scripts')
<script>
// Auto-add https:// if not present
document.querySelector('input[name="link"]').addEventListener('blur', function() {
let value = this.value.trim();
if (value && !value.match(/^https?:\/\//i)) {
this.value = 'https://' + value;
}
});
</script>
@endpush

148
resources/views/referensi_link/edit.blade.php Normal file
View File

@@ -0,0 +1,148 @@
@extends('layouts.main')
@section('breadcrumbs')
{{ Breadcrumbs::render(request()->route()->getName()) }}
@endsection
@section('content')
<div class="w-full grid gap-5 lg:gap-7.5 mx-auto">
<form method="POST" action="{{ route('basicdata.referensi-link.update', $referensiLink->id) }}">
@csrf
@method('PUT')
<div class="card border border-agi-100 pb-2.5">
<div class="card-header bg-agi-50" id="basic_settings">
<h3 class="card-title">
Edit Referensi Link
</h3>
<div class="flex items-center gap-2">
<a href="{{ route('basicdata.referensi-link.index') }}" class="btn btn-xs btn-info"><i class="ki-filled ki-exit-left"></i> Back</a>
</div>
</div>
<div class="card-body grid gap-5">
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
<label class="form-label max-w-56">
Nama Referensi Link <span class="text-danger">*</span>
</label>
<div class="flex flex-wrap items-baseline w-full">
<input class="input @error('name') border-danger bg-danger-light @enderror"
type="text"
name="name"
value="{{ old('name', $referensiLink->name) }}"
placeholder="Masukkan nama referensi link"
required>
@error('name')
<em class="alert text-danger text-sm">{{ $message }}</em>
@enderror
</div>
</div>
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
<label class="form-label max-w-56">
Link URL <span class="text-danger">*</span>
</label>
<div class="flex flex-wrap items-baseline w-full">
<input class="input @error('link') border-danger bg-danger-light @enderror"
type="url"
name="link"
value="{{ old('link', $referensiLink->link) }}"
placeholder="https://example.com"
required>
@error('link')
<em class="alert text-danger text-sm">{{ $message }}</em>
@enderror
<div class="form-hint">Pastikan link diawali dengan http:// atau https://</div>
</div>
</div>
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
<label class="form-label max-w-56">
Kategori
</label>
<div class="flex flex-wrap items-baseline w-full">
<input class="input @error('kategori') border-danger bg-danger-light @enderror"
type="text"
name="kategori"
value="{{ old('kategori', $referensiLink->kategori) }}"
placeholder="Misal: regulasi, panduan, dll">
@error('kategori')
<em class="alert text-danger text-sm">{{ $message }}</em>
@enderror
<div class="form-hint">Kosongkan jika tidak ada kategori</div>
</div>
</div>
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
<label class="form-label max-w-56">
Deskripsi
</label>
<div class="flex flex-wrap items-baseline w-full">
<textarea class="textarea @error('deskripsi') border-danger bg-danger-light @enderror"
name="deskripsi"
rows="4"
placeholder="Masukkan deskripsi lengkap referensi link">{{ old('deskripsi', $referensiLink->deskripsi) }}</textarea>
@error('deskripsi')
<em class="alert text-danger text-sm">{{ $message }}</em>
@enderror
</div>
</div>
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
<label class="form-label max-w-56">
Status Aktif
</label>
<div class="flex flex-wrap items-baseline w-full">
<label class="switch">
<input type="checkbox" name="is_active" value="1" {{ old('is_active', $referensiLink->is_active) ? 'checked' : '' }}>
<span class="switch-slider"></span>
</label>
<span class="ml-3 text-sm text-gray-600">Aktifkan referensi link ini</span>
@error('is_active')
<em class="alert text-danger text-sm">{{ $message }}</em>
@enderror
</div>
</div>
<div class="flex items-baseline flex-wrap lg:flex-nowrap gap-2.5">
<label class="form-label max-w-56">
Urutan Tampil
</label>
<div class="flex flex-wrap items-baseline w-full">
<input class="input @error('urutan') border-danger bg-danger-light @enderror"
type="number"
name="urutan"
value="{{ old('urutan', $referensiLink->urutan) }}"
min="0"
placeholder="0">
@error('urutan')
<em class="alert text-danger text-sm">{{ $message }}</em>
@enderror
<div class="form-hint">Semakin kecil angka, semakin atas posisinya</div>
</div>
</div>
</div>
<div class="card-footer justify-end">
<div class="flex flex-wrap gap-2">
<a href="{{ route('basicdata.referensi-link.index') }}" class="btn btn-light">
<i class="ki-filled ki-exit-left"></i> Batal
</a>
<button type="submit" class="btn btn-primary">
<i class="ki-filled ki-check"></i> Update
</button>
</div>
</div>
</div>
</form>
</div>
@endsection
@push('scripts')
<script>
// Auto-add https:// if not present
document.querySelector('input[name="link"]').addEventListener('blur', function() {
let value = this.value.trim();
if (value && !value.match(/^https?:\/\//i)) {
this.value = 'https://' + value;
}
});
</script>
@endpush

56
resources/views/referensi_link/import.blade.php Normal file
View File

@@ -0,0 +1,56 @@
@extends('layouts.main')
@section('breadcrumbs')
{{ Breadcrumbs::render('basicdata.referensi-link') }}
@endsection
@section('content')
<div class="grid">
<div class="card border border-agi-100 min-w-full">
<div class="card-header bg-agi-50 py-5 flex-wrap">
<h3 class="card-title">Import Referensi Link</h3>
<div class="flex flex-wrap gap-2 lg:gap-5">
<a class="btn btn-sm btn-light" href="{{ route('basicdata.referensi-link.download-template') }}">Download Template Excel</a>
<a class="btn btn-sm btn-primary" href="{{ route('basicdata.referensi-link.index') }}">Kembali ke Daftar</a>
</div>
</div>
<div class="card-body">
<form id="importPageForm" action="{{ route('basicdata.referensi-link.import.process') }}" method="POST" enctype="multipart/form-data" class="space-y-6">
@csrf
<div>
<label class="form-label">File Excel</label>
<input type="file" name="file" class="input" accept=".xlsx,.xls" required>
<div class="form-hint">Format file: .xlsx atau .xls, maksimal 10MB</div>
</div>
<div class="alert alert-info">
<div class="alert-description">
<strong>Format kolom yang didukung:</strong>
<div>Nama, Link, Kategori, Deskripsi, Status Aktif, Urutan</div>
<div class="mt-2">Contoh baris:</div>
<div class="mt-1">Contoh Referensi | https://example.com | panduan | Deskripsi contoh referensi link | aktif | 1</div>
<div>Contoh Regulasi | https://regulasi.example.com | regulasi | Deskripsi regulasi | aktif | 2</div>
</div>
</div>
<div class="flex gap-3">
<button type="submit" class="btn btn-primary">Import</button>
<a href="{{ route('basicdata.referensi-link.index') }}" class="btn btn-light">Batal</a>
</div>
</form>
</div>
</div>
</div>
@endsection
@push('scripts')
<script type="module">
const form = document.getElementById('importPageForm');
const submitBtn = form.querySelector('button[type="submit"]');
form.addEventListener('submit', function(e) {
submitBtn.disabled = true;
submitBtn.innerHTML = '<i class="ki-filled ki-loading"></i> Mengimport...';
});
</script>
@endpush

272
resources/views/referensi_link/index.blade.php Normal file
View File

@@ -0,0 +1,272 @@
@extends('layouts.main')
@section('breadcrumbs')
{{ Breadcrumbs::render('basicdata.referensi-link') }}
@endsection
@section('content')
<div class="grid">
<div class="min-w-full border card border-agi-100 card-grid" data-datatable="false" data-datatable-page-size="10" data-datatable-state-save="false" id="referensi-link-table" data-api-url="{{ route('basicdata.referensi-link.datatables') }}">
<div class="flex-wrap py-5 card-header bg-agi-50">
<h3 class="card-title">
Daftar Referensi Link
</h3>
<div class="flex flex-wrap gap-2 lg:gap-5">
<div class="flex">
<label class="input input-sm"> <i class="ki-filled ki-magnifier"> </i>
<input placeholder="Search Referensi Link" id="search" type="text" value="">
</label>
</div>
<div class="flex flex-wrap gap-2.5">
<div class="h-[24px] border border-r-gray-200"></div>
<button class="btn btn-sm btn-light" onclick="showImportModal()"> Import Excel </button>
<a class="btn btn-sm btn-light" href="{{ route('basicdata.referensi-link.export') }}"> Export to Excel </a>
<a class="btn btn-sm btn-primary" href="{{ route('basicdata.referensi-link.create') }}"> Tambah Referensi Link </a>
</div>
</div>
</div>
<div class="card-body">
<div class="scrollable-x-auto">
<table class="table text-sm font-medium text-gray-700 align-middle table-auto table-border" data-datatable-table="true">
<thead>
<tr>
<th class="w-14">
<input class="checkbox checkbox-sm" data-datatable-check="true" type="checkbox"/>
</th>
<th class="min-w-[200px]" data-datatable-column="name">
<span class="sort"> <span class="sort-label"> Nama </span>
<span class="sort-icon"> </span> </span>
</th>
<th class="min-w-[250px]" data-datatable-column="link">
<span class="sort"> <span class="sort-label"> Link </span>
<span class="sort-icon"> </span> </span>
</th>
<th class="min-w-[150px]" data-datatable-column="kategori">
<span class="sort"> <span class="sort-label"> Kategori </span>
<span class="sort-icon"> </span> </span>
</th>
<th class="min-w-[150px]" data-datatable-column="status_badge">
<span class="sort"> <span class="sort-label"> Status </span>
<span class="sort-icon"> </span> </span>
</th>
<th class="min-w-[80px]" data-datatable-column="urutan">
<span class="sort"> <span class="sort-label"> Urutan </span>
<span class="sort-icon"> </span> </span>
</th>
<th class="min-w-[150px] text-center" data-datatable-column="actions">Action</th>
</tr>
</thead>
</table>
</div>
<div class="flex-col gap-3 justify-center font-medium text-gray-600 card-footer md:justify-between md:flex-row text-2sm">
<div class="flex gap-2 items-center">
Show
<select class="w-16 select select-sm" data-datatable-size="true" name="perpage"> </select>
per page
</div>
<div class="flex gap-4 items-center text-gray-700">
<span>Total <span data-datatable-info="true"></span> records</span>
<div class="pagination" data-datatable-pagination="true"></div>
</div>
</div>
</div>
</div>
</div>
<!-- Import Modal -->
<div class="modal fade" id="importModal" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h3 class="modal-title">Import Referensi Link</h3>
<button type="button" class="btn btn-sm btn-icon btn-light btn-clear" data-modal-dismiss="true">
<i class="ki-filled ki-cross"></i>
</button>
</div>
<form id="importForm" action="{{ route('basicdata.referensi-link.import.process') }}" method="POST" enctype="multipart/form-data">
@csrf
<div class="modal-body">
<div class="mb-4">
<label class="form-label">File Excel</label>
<input type="file" name="file" class="input" accept=".xlsx,.xls" required>
<div class="form-hint">Format file: .xlsx atau .xls, maksimal 10MB</div>
</div>
<div class="alert alert-info">
<div class="alert-description">
<strong>Format file yang didukung:</strong><br>
- Nama, Link, Kategori, Deskripsi, Status Aktif, Urutan<br>
<a href="{{ route('basicdata.referensi-link.download-template') }}" class="text-primary hover:underline">
Download template Excel
</a>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-light" data-modal-dismiss="true">Batal</button>
<button type="submit" class="btn btn-primary">Import</button>
</div>
</form>
</div>
</div>
</div>
@endsection
@push('scripts')
<script type="text/javascript">
function deleteData(id) {
Swal.fire({
title: 'Are you sure?',
text: "You won't be able to revert this!",
icon: 'warning',
showCancelButton: true,
confirmButtonColor: '#3085d6',
cancelButtonColor: '#d33',
confirmButtonText: 'Yes, delete it!'
}).then((result) => {
if (result.isConfirmed) {
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': '{{ csrf_token() }}'
}
});
$.ajax(`basic-data/referensi-link/${id}`, {
type: 'DELETE'
}).then(() => {
swal.fire('Deleted!', 'Data berhasil dihapus.', 'success').then(() => {
window.location.reload();
});
}).catch((error) => {
console.error('Error:', error);
Swal.fire('Error!', 'Terjadi kesalahan saat menghapus.', 'error');
});
}
})
}
</script>
<script type="module">
const element = document.querySelector('#referensi-link-table');
const searchInput = document.getElementById('search');
const apiUrl = element.getAttribute('data-api-url');
const dataTableOptions = {
apiEndpoint: apiUrl,
pageSize: 5,
columns: {
select: {
render: (item, data) => {
const checkbox = document.createElement('input');
checkbox.className = 'checkbox checkbox-sm';
checkbox.type = 'checkbox';
checkbox.value = String(data.id);
checkbox.setAttribute('data-datatable-row-check', 'true');
return checkbox.outerHTML.trim();
},
},
name: { title: 'Nama' },
link: {
title: 'Link',
render: (item, data) => data.link,
},
kategori: { title: 'Kategori' },
status_badge: {
title: 'Status',
render: (item, data) => data.status_badge,
},
urutan: { title: 'Urutan' },
actions: {
title: 'Status',
render: (item, data) => {
return `<div class="flex flex-nowrap justify-center">
<a class="btn btn-sm btn-icon btn-clear btn-info" href="basic-data/referensi-link/${data.id}/edit">
<i class="ki-outline ki-notepad-edit"></i>
</a>
<a onclick="deleteData(${data.id})" class="delete btn btn-sm btn-icon btn-clear btn-danger">
<i class="ki-outline ki-trash"></i>
</a>
</div>`;
},
}
},
};
let dataTable = new KTDataTable(element, dataTableOptions);
searchInput.addEventListener('input', function () {
const searchValue = this.value.trim();
dataTable.search(searchValue, true);
});
window.showImportModal = function () {
const modal = new KTModal('#importModal');
modal.show();
}
document.getElementById('importForm').addEventListener('submit', function(e) {
e.preventDefault();
const form = this;
const submitBtn = form.querySelector('button[type="submit"]');
submitBtn.disabled = true;
submitBtn.innerHTML = '<i class="ki-filled ki-loading"></i> Mengimport...';
const formData = new FormData(form);
fetch(form.action, {
method: 'POST',
body: formData,
headers: { 'X-CSRF-TOKEN': '{{ csrf_token() }}' }
})
.then(response => response.json())
.then(data => {
if (data.success) {
showToast('success', 'Import berhasil!', data.message);
dataTable.reload();
const modal = KTModal.getInstance('#importModal');
modal.hide();
form.reset();
} else {
showToast('error', 'Import gagal!', data.message);
}
})
.catch(error => {
showToast('error', 'Error!', 'Terjadi kesalahan saat import data');
console.error('Import error:', error);
})
.finally(() => {
submitBtn.disabled = false;
submitBtn.innerHTML = 'Import';
});
});
window.toggleStatus = function (id, currentStatus) {
const newStatus = !currentStatus;
const statusText = newStatus ? 'Aktif' : 'Tidak Aktif';
if (confirm(`Apakah Anda yakin ingin mengubah status menjadi ${statusText}?`)) {
fetch(`{{ url('basicdata/referensi-link') }}/${id}/toggle-status`, {
method: 'POST',
headers: {
'X-CSRF-TOKEN': '{{ csrf_token() }}',
'Content-Type': 'application/json'
},
body: JSON.stringify({ is_active: newStatus })
})
.then(response => response.json())
.then(data => {
if (data.success) {
showToast('success', 'Berhasil!', data.message);
dataTable.reload();
} else {
showToast('error', 'Gagal!', data.message);
}
})
.catch(error => {
showToast('error', 'Error!', 'Terjadi kesalahan saat mengubah status');
console.error('Status toggle error:', error);
});
}
}
</script>
@endpush