126 lines
6.9 KiB
PHP
126 lines
6.9 KiB
PHP
<div class="modal fade" id="createFoto" tabindex="-1" aria-hidden="true">
|
|
<div class="modal-dialog modal-dialog-centered modal-lg">
|
|
<div class="modal-content">
|
|
|
|
<div class="modal-header">
|
|
<h5 class="modal-title">Tambah Paket Foto</h5> <button type="button" class="btn-close"
|
|
data-bs-dismiss="modal" aria-label="Close"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<form action="{{ route('admin.paket-foto.store') }}" method="POST" enctype="multipart/form-data">
|
|
@csrf
|
|
<div class="row gx-3">
|
|
|
|
<div class="col-12 col-md-7">
|
|
|
|
<div class="mb-2">
|
|
<label class="form-label">Nama Paket</label>
|
|
<input type="text" name="nama"
|
|
class="form-control @error('nama') is-invalid @enderror" style="font-size: 14px;"
|
|
placeholder="Masukkan Nama Paket" value="{{ old('nama') }}">
|
|
@error('nama')
|
|
<div class="invalid-feedback">{{ $message }}</div>
|
|
@enderror
|
|
</div>
|
|
|
|
<div class="row gx-1">
|
|
<div class="col-12 col-md-6">
|
|
<div class="mb-2">
|
|
<label class="form-label">Harga Paket</label>
|
|
<input type="number" name="harga"
|
|
class="form-control @error('harga') is-invalid @enderror"
|
|
style="font-size: 14px;"
|
|
placeholder="Harga Paket"value="{{ old('harga') }}">
|
|
<p class="mb-0"><small class="text-muted mb-0">Dalam Rupiah</small>
|
|
</p>
|
|
@error('harga')
|
|
<div class="invalid-feedback">{{ $message }}</div>
|
|
@enderror
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<div class="col-12 col-md-6">
|
|
<div class="mb-2">
|
|
<label class="form-label">Durasi</label>
|
|
<input type="number" name="durasi"
|
|
class="form-control @error('durasi') is-invalid @enderror"
|
|
style="font-size: 14px;"
|
|
placeholder="Durasi Paket"value="{{ old('durasi') }}">
|
|
<p class="mb-0"><small class="text-muted mb-0">Dalam Menit</small>
|
|
</p>
|
|
@error('durasi')
|
|
<div class="invalid-feedback">{{ $message }}</div>
|
|
@enderror
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mb-2">
|
|
<label class="form-label">Deskripsi Paket</label>
|
|
<textarea name="deskripsi" class="form-control @error('deskripsi') is-invalid @enderror" rows="5"
|
|
style="font-size: 14px;" placeholder="Masukkan Deskripsi Paket">{{ old('deskripsi') }}</textarea>
|
|
@error('deskripsi')
|
|
<div class="invalid-feedback">{{ $message }}</div>
|
|
@enderror
|
|
</textarea>
|
|
</div>
|
|
|
|
</div>
|
|
<div class="col-12 col-md-5">
|
|
<div class="mb-3">
|
|
<label class="form-label">Upload Foto Paket</label>
|
|
|
|
{{-- Area Upload Custom --}}
|
|
<div class="upload-area p-4 text-center d-flex flex-column align-items-center justify-content-center"
|
|
onclick="document.getElementById('createFotoInput').click()"
|
|
style="cursor: pointer;">
|
|
|
|
<i class="bi bi-file-earmark-arrow-up fs-5 text-secondary mb-3"></i>
|
|
<span class="fw-semibold text-dark">Klik untuk Upload</span>
|
|
<small class="text-muted">Max 2MB (JPG/PNG)</small>
|
|
|
|
{{-- Input File Tersembunyi (ID UNIK: createFotoInput) --}}
|
|
<input type="file" id="createFotoInput" class="d-none" name="foto"
|
|
accept="image/*"
|
|
onchange="previewImage(this, 'createImgPreview', 'createPlaceholder')">
|
|
</div>
|
|
@error('foto')
|
|
<div class="text-danger mt-1" style="font-size: 12px;">{{ $message }}</div>
|
|
@enderror
|
|
</div>
|
|
|
|
{{-- 7. Preview Foto (Fixed Container) --}}
|
|
<div class="mb-3">
|
|
<label class="form-label">Preview</label>
|
|
<div class="border rounded d-flex justify-content-center align-items-center position-relative overflow-hidden"
|
|
style="height: 120px; background-color: #f8f9fa;">
|
|
|
|
{{-- Placeholder Teks (ID UNIK: createPlaceholder) --}}
|
|
<div id="createPlaceholder" class="text-center text-muted">
|
|
<i class="bi bi-image fs-4"></i>
|
|
<p class="mb-0" style="font-size: 12px;">Belum ada foto dipilih</p>
|
|
</div>
|
|
|
|
{{-- Gambar Preview (ID UNIK: createImgPreview) --}}
|
|
<img id="createImgPreview" src="#" class="d-none w-100 h-100"
|
|
style="object-fit: contain;">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="modal-footer justify-content-end border-top-0 pt-0">
|
|
<button type="submit" class="btn btn-primary rounded-pill terima px-3 py-2">
|
|
Simpan
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|