@extends('layouts.app')

@section('title', 'Edit Transaksi')

@section('content')

    @php
        $tipeFixed = in_array($transaction->tipe, ['pemasukan', 'pengeluaran'], true)
            ? $transaction->tipe
            : 'pemasukan';
    @endphp

    <div class="page-header">
        <div>
            <h1 class="page-title">
                Edit {{ ucfirst($tipeFixed) }}
            </h1>
        </div>
    </div>

    <div class="content-narrow">

        <div class="form-shell">

            <div class="card-body">

                <form method="POST"
                    action="{{ route('transaksi.update', ['tipe' => $tipeFixed, 'id' => $transaction->id]) }}"
                    enctype="multipart/form-data">

                    @csrf
                    @method('PUT')

                    <input type="hidden" name="tipe" value="{{ $tipeFixed }}">

                    {{-- Tanggal --}}
                    <div class="mb-3">

                        <label class="form-label fw-medium">
                            Tanggal
                        </label>

                        <input type="date" name="tanggal" class="form-control"
                            value="{{ old('tanggal', optional($transaction->tanggal)->format('Y-m-d')) }}" required>

                    </div>

                    {{-- Nama Kategori --}}
                    <div class="mb-3">

                        <label class="form-label fw-medium">
                            Nama Kategori
                        </label>

                        <select id="produk" name="id_kategori" class="form-select" required>

                            @foreach($categories as $cat)

                                <option value="{{ $cat->id }}" data-harga="{{ $cat->harga }}" @selected(old('id_kategori', $transaction->id_kategori) == $cat->id)>

                                    {{ $cat->nama_kategori }}

                                </option>

                            @endforeach

                        </select>

                    </div>

                    {{-- Jumlah --}}
                    <div class="mb-3">

                        <label class="form-label fw-medium">

                            {{ $tipeFixed == 'pemasukan'
        ? 'Jumlah Terjual'
        : 'Jumlah' }}

                        </label>

                        <input type="number" id="kuantitas" name="kuantitas" class="form-control"
                            value="{{ old('kuantitas', $transaction->kuantitas) }}" required>

                    </div>

                    {{-- Satuan --}}
                    <div class="mb-3">

                        <label class="form-label fw-medium">
                            Satuan
                        </label>

                        <select name="satuan" class="form-select" required>

                            <option value="">- Pilih Satuan -</option>

                            <option value="box" {{ old('satuan', $transaction->satuan ?? '') == 'box' ? 'selected' : '' }}>
                                box
                            </option>

                            <option value="kg" {{ old('satuan', $transaction->satuan ?? '') == 'kg' ? 'selected' : '' }}>
                                kg
                            </option>

                            <option value="liter" {{ old('satuan', $transaction->satuan ?? '') == 'liter' ? 'selected' : '' }}>
                                liter
                            </option>

                            <option value="pack" {{ old('satuan', $transaction->satuan ?? '') == 'pack' ? 'selected' : '' }}>
                                pack
                            </option>

                            <option value="pcs" {{ old('satuan', $transaction->satuan ?? '') == 'pcs' ? 'selected' : '' }}>
                                pcs
                            </option>

                        </select>

                    </div>

                    {{-- Harga --}}
                    @if($tipeFixed == 'pemasukan')

                        <div class="mb-3">

                            <label class="form-label fw-medium">
                                Total Harga
                            </label>

                            <input type="text" id="totalHargaView" class="form-control" readonly>

                            <input type="hidden" id="totalNominal" name="nominal"
                                value="{{ old('nominal', $transaction->nominal) }}">

                        </div>

                    @else

                        <div class="mb-3">

                            <label class="form-label fw-medium">
                                Nominal
                            </label>

                            <input type="text" id="nominalInput" name="nominal" class="form-control"
                                value="{{ old('nominal', (int) $transaction->nominal) }}" required>

                        </div>

                        @if($transaction->bukti)
                            <div class="mb-3">
                                <label class="form-label fw-medium d-block">
                                    Bukti Nota Saat Ini
                                </label>
                                @php
                                    $extension = strtolower(pathinfo($transaction->bukti, PATHINFO_EXTENSION));
                                    $buktiUrl = $transaction->bukti_url ?? asset('bukti/' . $transaction->bukti);
                                @endphp
                                @if(!($transaction->bukti_exists ?? true))
                                    <div class="alert alert-warning py-2 mb-2">
                                        File bukti tidak ditemukan di server. Silakan upload ulang bukti nota.
                                    </div>
                                @else
                                    @if(in_array($extension, ['jpg', 'jpeg', 'png']))
                                        <div class="mb-2">
                                            <img src="{{ $buktiUrl }}" alt="Bukti Nota" class="img-thumbnail" style="max-height: 180px; border-radius: 6px;">
                                        </div>
                                    @elseif($extension === 'pdf')
                                        <div class="mb-2">
                                            <a href="{{ $buktiUrl }}" target="_blank" class="btn btn-outline-danger btn-sm px-3">
                                                <i class="bi bi-file-earmark-pdf-fill fs-6 me-1"></i> Lihat Dokumen PDF
                                            </a>
                                        </div>
                                    @else
                                        <div class="mb-2">
                                            <a href="{{ $buktiUrl }}" target="_blank" class="btn btn-outline-info btn-sm px-3">
                                                Lihat File Pendukung
                                            </a>
                                        </div>
                                    @endif
                                @endif
                                <div class="form-check mt-2">
                                    <input class="form-check-input" type="checkbox" name="hapus_bukti" id="hapus_bukti" value="1">
                                    <label class="form-check-label text-danger fw-semibold" for="hapus_bukti">
                                        Hapus Bukti Nota Saat Ini
                                    </label>
                                </div>
                            </div>
                        @endif

                        <div class="mb-3">

                            <label class="form-label fw-medium">
                                {{ $transaction->bukti ? 'Ganti Bukti Nota' : 'Upload Bukti Nota' }}
                            </label>

                            <input type="file" name="bukti" class="form-control" accept=".jpg,.jpeg,.png,.pdf">
                            <small class="text-muted">Format file yang didukung: JPG, JPEG, PNG, PDF. Maksimal 2MB.</small>

                        </div>

                    @endif

                    <div class="form-actions">

                        <button class="btn btn-primary" type="submit">

                            Simpan

                        </button>

                        <a href="{{ route('transaksi.index', ['tipe' => $tipeFixed]) }}"
                            class="btn btn-outline-secondary">

                            Batal

                        </a>

                    </div>

                </form>

            </div>

        </div>

    </div>

    @if($tipeFixed == 'pemasukan')

        <script>

            const produk = document.getElementById('produk');
            const kuantitas = document.getElementById('kuantitas');

            const total = document.getElementById('totalNominal');
            const totalView = document.getElementById('totalHargaView');

            function hitungTotal() {

                let harga = parseFloat(
                    produk.options[produk.selectedIndex]?.dataset.harga || 0
                );

                let qty = parseFloat(kuantitas.value || 0);

                let hasil = harga * qty;

                total.value = hasil;

                totalView.value = "Rp " + hasil.toLocaleString('id-ID');

            }

            produk.addEventListener('change', hitungTotal);
            kuantitas.addEventListener('input', hitungTotal);

            window.onload = hitungTotal;

        </script>

    @endif

    @if($tipeFixed == 'pengeluaran')
        <script>
            const nominalInput = document.getElementById('nominalInput');

            function formatRupiah(angka) {
                let numberString = angka.toString().replace(/[^,\d]/g, '');
                let split = numberString.split(',');
                let sisa = split[0].length % 3;
                let rupiah = split[0].substr(0, sisa);
                let ribuan = split[0].substr(sisa).match(/\d{3}/gi);

                if (ribuan) {
                    let separator = sisa ? '.' : '';
                    rupiah += separator + ribuan.join('.');
                }

                rupiah = split[1] !== undefined ? rupiah + ',' + split[1] : rupiah;
                return rupiah;
            }

            nominalInput.addEventListener('input', function(e) {
                this.value = formatRupiah(this.value);
            });

            nominalInput.addEventListener('keydown', function(e) {
                if (['Backspace', 'Delete', 'Tab', 'Escape', 'Enter', 'Home', 'End', 'ArrowLeft', 'ArrowRight'].includes(e.key)) {
                    return;
                }
                if (e.ctrlKey || e.metaKey) {
                    return;
                }
                if (!/\d/.test(e.key)) {
                    e.preventDefault();
                }
            });

            window.onload = function() {
                if (nominalInput.value) {
                    nominalInput.value = formatRupiah(nominalInput.value);
                }
            };
        </script>
    @endif

@endsection