NIM_E31220400/resources/views/transaksi/pemasukan/create.blade.php

127 lines
5.3 KiB
PHP

@extends('layouts.app')
@section('content')
<!-- Background seluruh halaman -->
<div style="background-color: #e0e0e0; width: 100%; min-height: 100vh; border-radius: 15px; padding: 1rem;">
<!-- Header -->
<div style="background-color: #000; color: #fff; padding: 0.1rem; border-radius: 0.5rem;">
<h1 class="m-0">Tambah Pemasukan</h1>
</div>
<!-- Form Tambah Pemasukan -->
<div class="container mt-4">
<div class="card p-4 border border-secondary" style="border-radius: 15px; background-color: #fff;">
<form action="{{ route('pemasukan.store') }}" method="POST" enctype="multipart/form-data">
@csrf
<div class="mb-3">
<label for="tanggal" class="form-label">Tanggal</label>
<input type="date" class="form-control" name="tanggal" required>
</div>
<div class="mb-3">
<label for="nama" class="form-label">Nama</label>
<input type="text" name="nama" class="form-control" id="nama" required>
</div>
<div class="mb-3">
<label for="kategori" class="form-label">Kategori</label>
<select name="kategori" id="kategori" class="form-control" required onchange="updateForm()">
<option value="">-- Pilih Kategori --</option>
<option value="uang">Uang</option>
<option value="barang">Barang</option>
</select>
</div>
<!-- Field Jumlah (untuk uang) -->
<div class="mb-3" id="field-jumlah">
<label for="jumlah" class="form-label">Jumlah (Rp)</label>
<input type="number" class="form-control" name="jumlah" id="jumlah">
</div>
<!-- Field Harga dan Quantity (untuk barang) -->
<div class="mb-3" id="field-harga" style="display: none;">
<label for="harga" class="form-label">Harga Satuan (Rp)</label>
<input type="number" class="form-control" id="harga" name="harga" oninput="hitungSubtotal()">
</div>
<div class="mb-3" id="field-quantity" style="display: none;">
<label for="quantity" class="form-label">Quantity</label>
<input type="number" class="form-control" id="quantity" name="quantity" oninput="hitungSubtotal()">
</div>
<div class="mb-3" id="field-subtotal" style="display: none;">
<label for="subtotal" class="form-label">Total (Harga x Quantity)</label>
<input type="text" class="form-control" id="subtotal" readonly>
</div>
<!-- Field Keterangan -->
<div class="mb-3">
<label for="keterangan" class="form-label">Keterangan</label>
<input type="text" class="form-control" id="keterangan" name="keterangan">
</div>
<!-- Upload Bukti -->
<div class="mb-3">
<label for="bukti" class="form-label">Upload Kuitansi</label>
<input type="file" name="bukti" class="form-control" accept="image/*">
</div>
<div class="d-flex justify-content-between">
<a href="{{ route('pemasukan.index') }}" class="btn btn-secondary">Kembali</a>
<button type="submit" class="btn btn-success">Simpan</button>
</div>
</form>
</div>
</div>
</div>
<!-- JavaScript -->
<script>
function updateForm() {
const kategori = document.getElementById('kategori').value;
const fieldJumlah = document.getElementById('field-jumlah');
const fieldHarga = document.getElementById('field-harga');
const fieldQuantity = document.getElementById('field-quantity');
const fieldSubtotal = document.getElementById('field-subtotal');
if (kategori === 'uang') {
fieldJumlah.style.display = 'block';
fieldHarga.style.display = 'none';
fieldQuantity.style.display = 'none';
fieldSubtotal.style.display = 'none';
} else if (kategori === 'barang') {
fieldJumlah.style.display = 'none';
fieldHarga.style.display = 'block';
fieldQuantity.style.display = 'block';
fieldSubtotal.style.display = 'block';
} else {
fieldJumlah.style.display = 'none';
fieldHarga.style.display = 'none';
fieldQuantity.style.display = 'none';
fieldSubtotal.style.display = 'none';
}
document.getElementById('subtotal').value = '';
}
function hitungSubtotal() {
const harga = parseFloat(document.getElementById('harga').value) || 0;
const quantity = parseFloat(document.getElementById('quantity').value) || 0;
const total = harga * quantity;
document.getElementById('subtotal').value = total.toLocaleString('id-ID', {
style: 'currency',
currency: 'IDR'
});
// Juga isi field jumlah agar tersimpan
document.getElementById('jumlah').value = total;
}
document.addEventListener('DOMContentLoaded', updateForm);
</script>
@endsection