204 lines
9.9 KiB
PHP
204 lines
9.9 KiB
PHP
@extends('layouts.app')
|
|
|
|
@section('title', 'Edit Paket - INUFA')
|
|
|
|
@section('header', 'Edit Paket Sound System')
|
|
|
|
@section('content')
|
|
<div class="bg-white rounded-lg shadow-lg p-6">
|
|
<form action="{{ route('paket.update', $paket->id) }}" method="POST" enctype="multipart/form-data">
|
|
@csrf
|
|
@method('PUT')
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
|
|
<!-- Nama Paket -->
|
|
<div class="space-y-2">
|
|
<label for="nama_paket" class="block text-sm font-medium text-gray-700">Nama Paket</label>
|
|
<input type="text" name="nama_paket" id="nama_paket"
|
|
value="{{ old('nama_paket', $paket->nama_paket) }}"
|
|
class="w-full rounded-lg border-gray-300 focus:border-blue-500 focus:ring-blue-500">
|
|
@error('nama_paket')
|
|
<p class="text-red-500 text-sm">{{ $message }}</p>
|
|
@enderror
|
|
</div>
|
|
|
|
<!-- Jenis Paket -->
|
|
<div class="space-y-2">
|
|
<label for="jenis_paket" class="block text-sm font-medium text-gray-700">Jenis Paket</label>
|
|
<select name="jenis_paket" id="jenis_paket"
|
|
class="w-full rounded-lg border-gray-300 focus:border-blue-500 focus:ring-blue-500">
|
|
<option value="wedding" {{ $paket->jenis_paket == 'wedding' ? 'selected' : '' }}>Wedding</option>
|
|
<option value="seminar" {{ $paket->jenis_paket == 'seminar' ? 'selected' : '' }}>Seminar</option>
|
|
<option value="outdoor" {{ $paket->jenis_paket == 'outdoor' ? 'selected' : '' }}>Outdoor</option>
|
|
<option value="custom" {{ $paket->jenis_paket == 'custom' ? 'selected' : '' }}>Custom</option>
|
|
</select>
|
|
@error('jenis_paket')
|
|
<p class="text-red-500 text-sm">{{ $message }}</p>
|
|
@enderror
|
|
</div>
|
|
|
|
<!-- Harga -->
|
|
<div class="space-y-2">
|
|
<label for="harga" class="block text-sm font-medium text-gray-700">Harga</label>
|
|
<input type="number" name="harga" id="harga"
|
|
value="{{ old('harga', $paket->harga) }}"
|
|
class="w-full rounded-lg border-gray-300 focus:border-blue-500 focus:ring-blue-500">
|
|
@error('harga')
|
|
<p class="text-red-500 text-sm">{{ $message }}</p>
|
|
@enderror
|
|
</div>
|
|
|
|
<!-- Stok -->
|
|
<div class="space-y-2">
|
|
<label for="stok" class="block text-sm font-medium text-gray-700">Stok</label>
|
|
<input type="number" name="stok" id="stok"
|
|
value="{{ old('stok', $paket->stok) }}"
|
|
class="w-full rounded-lg border-gray-300 focus:border-blue-500 focus:ring-blue-500">
|
|
@error('stok')
|
|
<p class="text-red-500 text-sm">{{ $message }}</p>
|
|
@enderror
|
|
</div>
|
|
|
|
<!-- Gambar -->
|
|
<div class="space-y-2">
|
|
<label for="image" class="block text-sm font-medium text-gray-700">Gambar Paket</label>
|
|
@if($paket->image)
|
|
<div class="mb-2">
|
|
<img src="{{ Storage::url($paket->image) }}" alt="Preview" class="w-32 h-32 object-cover rounded-lg">
|
|
</div>
|
|
@endif
|
|
<input type="file" name="image" id="image"
|
|
class="w-full rounded-lg border-gray-300 focus:border-blue-500 focus:ring-blue-500">
|
|
@error('image')
|
|
<p class="text-red-500 text-sm">{{ $message }}</p>
|
|
@enderror
|
|
</div>
|
|
|
|
<!-- Ongkir per Kota -->
|
|
<div class="space-y-2 md:col-span-2">
|
|
<label class="block text-sm font-medium text-gray-700">Ongkir per Kota</label>
|
|
<div id="ongkir-container">
|
|
@forelse($paket->ongkirKota as $index => $ongkir)
|
|
<div class="ongkir-form mb-2 p-4 border rounded-lg bg-gray-50">
|
|
<div class="grid grid-cols-2 gap-4">
|
|
<div>
|
|
<label class="block text-sm font-medium text-gray-600">Nama Kota</label>
|
|
<input type="text" name="ongkir[{{ $index }}][nama_kota]" value="{{ $ongkir->nama_kota }}"
|
|
class="w-full border border-gray-300 rounded-md px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500">
|
|
</div>
|
|
<div>
|
|
<label class="block text-sm font-medium text-gray-600">Biaya Ongkir (Rp)</label>
|
|
<input type="number" name="ongkir[{{ $index }}][biaya_ongkir]" value="{{ $ongkir->biaya_ongkir }}" min="0"
|
|
class="w-full border border-gray-300 rounded-md px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500">
|
|
</div>
|
|
</div>
|
|
<button type="button" class="mt-2 text-red-600 hover:text-red-800 delete-ongkir">
|
|
<i class="fas fa-trash mr-1"></i> Hapus
|
|
</button>
|
|
</div>
|
|
@empty
|
|
<div class="ongkir-form mb-2 p-4 border rounded-lg bg-gray-50">
|
|
<div class="grid grid-cols-2 gap-4">
|
|
<div>
|
|
<label class="block text-sm font-medium text-gray-600">Nama Kota</label>
|
|
<input type="text" name="ongkir[0][nama_kota]"
|
|
class="w-full border border-gray-300 rounded-md px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500">
|
|
</div>
|
|
<div>
|
|
<label class="block text-sm font-medium text-gray-600">Biaya Ongkir (Rp)</label>
|
|
<input type="number" name="ongkir[0][biaya_ongkir]" min="0"
|
|
class="w-full border border-gray-300 rounded-md px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500">
|
|
</div>
|
|
</div>
|
|
<button type="button" class="mt-2 text-red-600 hover:text-red-800 delete-ongkir" style="display: none;">
|
|
<i class="fas fa-trash mr-1"></i> Hapus
|
|
</button>
|
|
</div>
|
|
@endforelse
|
|
</div>
|
|
<button type="button" id="tambah-ongkir" class="mt-2 text-sm bg-green-500 hover:bg-green-600 text-white px-3 py-1 rounded">
|
|
<i class="fas fa-plus mr-1"></i> Tambah Kota
|
|
</button>
|
|
</div>
|
|
|
|
<!-- Keterangan -->
|
|
<div class="space-y-2 md:col-span-2">
|
|
<label for="keterangan" class="block text-sm font-medium text-gray-700">Keterangan</label>
|
|
<textarea name="keterangan" id="keterangan" rows="4"
|
|
class="w-full rounded-lg border-gray-300 focus:border-blue-500 focus:ring-blue-500">{{ old('keterangan', $paket->keterangan) }}</textarea>
|
|
@error('keterangan')
|
|
<p class="text-red-500 text-sm">{{ $message }}</p>
|
|
@enderror
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Tombol Submit -->
|
|
<div class="mt-6 flex justify-end space-x-3">
|
|
<a href="{{ route('paket.index') }}"
|
|
class="px-4 py-2 bg-gray-500 text-white rounded-lg hover:bg-gray-600 transition duration-200">
|
|
Batal
|
|
</a>
|
|
<button type="submit"
|
|
class="px-4 py-2 bg-blue-600 text-white rounded-lg hover:bg-blue-700 transition duration-200">
|
|
Simpan Perubahan
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
@endsection
|
|
|
|
@push('scripts')
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
const ongkirContainer = document.getElementById('ongkir-container');
|
|
const tambahOngkirBtn = document.getElementById('tambah-ongkir');
|
|
let ongkirCount = document.querySelectorAll('.ongkir-form').length;
|
|
|
|
// Fungsi untuk menambah form ongkir baru
|
|
tambahOngkirBtn.addEventListener('click', function() {
|
|
const template = ongkirContainer.children[0].cloneNode(true);
|
|
|
|
// Update nama field
|
|
const inputs = template.querySelectorAll('input');
|
|
inputs.forEach(input => {
|
|
input.name = input.name.replace(/\[\d+\]/, `[${ongkirCount}]`);
|
|
input.value = '';
|
|
});
|
|
|
|
// Tampilkan tombol hapus
|
|
const deleteBtn = template.querySelector('.delete-ongkir');
|
|
deleteBtn.style.display = 'inline-flex';
|
|
|
|
ongkirContainer.appendChild(template);
|
|
ongkirCount++;
|
|
updateDeleteButtons();
|
|
});
|
|
|
|
// Event delegation untuk tombol hapus
|
|
ongkirContainer.addEventListener('click', function(e) {
|
|
if (e.target.classList.contains('delete-ongkir') ||
|
|
e.target.closest('.delete-ongkir')) {
|
|
e.target.closest('.ongkir-form').remove();
|
|
updateDeleteButtons();
|
|
}
|
|
});
|
|
|
|
// Tampilkan/sembunyikan tombol hapus
|
|
const updateDeleteButtons = () => {
|
|
const forms = ongkirContainer.children;
|
|
const deleteButtons = ongkirContainer.querySelectorAll('.delete-ongkir');
|
|
|
|
deleteButtons.forEach((btn, index) => {
|
|
if (forms.length > 1) {
|
|
btn.style.display = 'inline-flex';
|
|
} else {
|
|
btn.style.display = 'none';
|
|
}
|
|
});
|
|
};
|
|
|
|
// Initialize delete buttons
|
|
updateDeleteButtons();
|
|
});
|
|
</script>
|
|
@endpush
|