@extends('layouts.app')

@section('content')
<div class="card">
    <div class="card-header"><h5>Edit Nota Pengeluaran Kas</h5></div>

    <div class="card-body">

        <form action="{{ route('nota.update', $nota->id) }}" method="POST" enctype="multipart/form-data">
            @csrf
            @method('PUT')

            @if($errors->any())
                <div class="alert alert-danger">
                    <ul class="mb-0">
                        @foreach($errors->all() as $error)
                            <li>{{ $error }}</li>
                        @endforeach
                    </ul>
                </div>
            @endif

            @if(session('error'))
                <div class="alert alert-danger">
                    {{ session('error') }}
                </div>
            @endif

            @if(session('success'))
                <div class="alert alert-success">
                    {{ session('success') }}
                </div>
            @endif

            <div class="mb-2">
                <label>Tanggal</label>
                <input type="date" class="form-control" name="tanggal" value="{{ $nota->tanggal ? \Carbon\Carbon::parse($nota->tanggal)->format('Y-m-d') : date('Y-m-d') }}" required>
            </div>

            @php
                $detail = $nota->detailTransaksi->first();
                if (!function_exists('formatExactNumber')) {
                    function formatExactNumber($num) {
                        if ($num === null || $num === '') return '';
                        $val = (float) $num;
                        if (fmod($val, 1) == 0) {
                            return number_format($val, 0, ',', '.');
                        }
                        $str = (string) $val;
                        $parts = explode('.', $str);
                        $intFormatted = number_format((float)$parts[0], 0, ',', '.');
                        $dec = isset($parts[1]) ? $parts[1] : '';
                        return $dec !== '' ? $intFormatted . ',' . $dec : $intFormatted;
                    }
                }
            @endphp

            <div class="mb-2">
                <label>Keterangan</label>
                <input type="text" class="form-control" name="keterangan" value="{{ $detail ? $detail->deskripsi_item : '' }}" required>
            </div>

            <div class="mb-2">
                <label>Volume</label>
                <input type="text" class="form-control" name="vol" id="vol" value="{{ ($detail && $detail->vol) ? (float)$detail->vol : '' }}" required>
            </div>

            <div class="mb-2">
                <label>Satuan</label>
                <input type="text" class="form-control" name="satuan" id="satuan" value="{{ $detail ? $detail->satuan : '' }}" required>
            </div>

            <div class="mb-2">
                <label>Harga Satuan</label>
                <input type="text" class="form-control rupiah-input" name="harga_satuan" id="harga_satuan" value="{{ formatExactNumber($detail ? $detail->harga_satuan : 0) }}" required>
            </div>

            <div class="mb-2">
                <label>Nominal</label>
                <input type="text" class="form-control rupiah-input" name="nominal" id="nominal" value="{{ formatExactNumber($detail ? $detail->nominal : ($nota->nominal ?? 0)) }}" readonly>
            </div>

            <div class="mb-2">
                <label>Akun Pengeluaran (Beban)</label>
                <select name="akun_pengeluaran" class="form-control select2" required>
                    @foreach($akun_pengeluaran as $a)
                        <option value="{{ $a->id }}" {{ ($detail && $a->kode_akun == $detail->kode_akun) ? 'selected' : '' }}>
                            {{ $a->kode_akun }} - {{ $a->nama_akun }}
                        </option>
                    @endforeach
                </select>
            </div>

            <div class="mb-2">
                <label>Sumber Dana (Kas/Bank)</label>
                <select name="akun_sumber_dana" class="form-control select2" required>
                    @foreach($akun_kas as $a)
                        <option value="{{ $a->id }}" {{ $a->kode_akun == $nota->kode_akun ? 'selected' : '' }}>
                            {{ $a->kode_akun }} - {{ $a->nama_akun }}
                        </option>
                    @endforeach
                </select>
            </div>

            <div class="mb-2">
                <label>Upload Bukti (boleh lebih dari 1)</label>
                <input type="file" class="form-control" name="file[]" multiple accept=".jpg,.jpeg,.png,.pdf">
                <small class="text-muted">Format: JPG, JPEG, PNG, PDF. Maksimal 20MB per file.</small>
                
                @if($detail && $detail->file)
                    <div class="mt-3 p-3 border rounded bg-light" id="file-list-container">
                        <strong>File saat ini:</strong>
                        @php
                            $files = json_decode($detail->file, true);
                            if (!is_array($files)) {
                                $files = [$detail->file];
                            }
                        @endphp
                        
                        <div class="list-group mt-2">
                            @foreach($files as $index => $file)
                                <div class="list-group-item d-flex justify-content-between align-items-center" id="file-row-{{ $index }}">
                                    <div class="text-truncate" style="max-width: 80%;">
                                        <a href="{{ route('nota.file', ['detail' => $detail->id, 'filename' => $file]) }}" 
                                           target="_blank" 
                                           class="text-primary">
                                            <em class="icon ni ni-file-docs"></em> {{ $file }}
                                        </a>
                                    </div>
                                    <button type="button" 
                                            class="btn btn-sm btn-danger" 
                                            onclick="deleteFile({{ $detail->id }}, '{{ $file }}', 'file-row-{{ $index }}')">
                                        <em class="icon ni ni-trash"></em> Hapus
                                    </button>
                                </div>
                            @endforeach
                        </div>
                        @if($detail->uploaded_at)
                            <div class="mt-2"><small class="text-muted">Terakhir diupload: {{ \Carbon\Carbon::parse($detail->uploaded_at)->format('d M Y H:i') }}</small></div>
                        @endif
                    </div>
                @endif
            </div>

            <div class="d-flex gap-2 mt-3">
                <button type="submit" class="btn btn-primary">
                    <em class="icon ni ni-save"></em> Update Nota
                </button>
                <a href="{{ route('nota.index', ['bulan' => $nota->tanggal ? \Carbon\Carbon::parse($nota->tanggal)->format('m') : date('m'), 'tahun' => $nota->tanggal ? \Carbon\Carbon::parse($nota->tanggal)->format('Y') : date('Y')]) }}" class="btn btn-secondary">
                    <em class="icon ni ni-arrow-left"></em> Kembali
                </a>
            </div>
        </form>

    </div>
</div>
@endsection
@push('scripts')


<script>
document.addEventListener('DOMContentLoaded', function() {
    $('.select2').select2({placeholder: "Pilih akun", allowClear: true, width: '100%'});

    const vol = document.getElementById('vol');
    const harga = document.getElementById('harga_satuan');
    const nominal = document.getElementById('nominal');

    function parseNumber(str) {
        if (!str) return 0;
        let s = String(str).trim();
        s = s.replace(/[^0-9,\.\-]/g, '');
        if (!s) return 0;

        const hasComma = s.includes(',');
        const hasDot = s.includes('.');

        if (hasComma && hasDot) {
            const lastDot = s.lastIndexOf('.');
            const lastComma = s.lastIndexOf(',');
            if (lastComma > lastDot) {
                s = s.replace(/\./g, '').replace(',', '.');
            } else {
                s = s.replace(/,/g, '');
            }
        } else if (hasDot && !hasComma) {
            if ((s.match(/\./g) || []).length > 1 || /^\d{1,3}(\.\d{3})+$/.test(s)) {
                s = s.replace(/\./g, '');
            }
        } else if (hasComma && !hasDot) {
            if ((s.match(/,/g) || []).length > 1 || /^\d{1,3}(,\d{3})+$/.test(s)) {
                s = s.replace(/,/g, '');
            } else {
                s = s.replace(',', '.');
            }
        }

        const n = parseFloat(s);
        return isNaN(n) ? 0 : n;
    }

    function formatRupiah(num) {
        if (num === '' || isNaN(num) || num === null) return '';
        const parts = num.toString().split('.');
        let intPart = parts[0];
        let decPart = parts.length > 1 ? parts[1] : '';
        intPart = intPart.replace(/\B(?=(\d{3})+(?!\d))/g, '.');
        return decPart ? intPart + ',' + decPart : intPart;
    }

    function formatRupiahValue(str) {
        if (!str) return '';
        let s = String(str).replace(/[^\d,]/g, '');
        const parts = s.split(',');
        let intPart = parts[0].replace(/^0+/, '') || '0';
        let decPart = parts[1] !== undefined ? parts[1].slice(0, 2) : '';
        let rgx = /(\d+)(\d{3})/;
        let out = intPart;
        while (rgx.test(out)) {
            out = out.replace(rgx, '$1' + '.' + '$2');
        }
        return parts.length > 1 ? out + ',' + decPart : out;
    }

    function updateNominal() {
        const v = parseNumber(vol.value);
        const h = parseNumber(harga.value);
        const product = v * h;
        if (vol.value === '' || harga.value === '' || isNaN(product) || product === 0) {
            nominal.value = '';
        } else {
            nominal.value = formatRupiah(Math.round(product * 100) / 100);
        }
    }

    harga.addEventListener('input', function(e) {
        e.target.value = formatRupiahValue(e.target.value);
        updateNominal();
    });

    vol.addEventListener('input', updateNominal);

    // Validasi file upload (Matches create.blade.php behavior)
    $('input[name="file[]"]').on('change', function() {
        const files = this.files;
        const maxSize = 20 * 1024 * 1024; // 20MB in bytes
        const allowedTypes = ['image/jpeg', 'image/jpg', 'image/png', 'application/pdf'];
        
        for (let i = 0; i < files.length; i++) {
            const file = files[i];
            
            // Check file size
            if (file.size > maxSize) {
                alert(`File "${file.name}" terlalu besar. Maksimal 20MB per file.`);
                this.value = ''; // Clear the input
                return false;
            }
            
            // Check file type
            if (!allowedTypes.includes(file.type)) {
                alert(`File "${file.name}" tidak didukung. Hanya JPG, JPEG, PNG, dan PDF yang diperbolehkan.`);
                this.value = ''; // Clear the input
                return false;
            }
        }
    });
});

// Fungsi untuk menghapus file
function deleteFile(detailId, filename, rowId) {
    if (!confirm('Apakah Anda yakin ingin menghapus file ini?')) {
        return;
    }
    
    // Button loading state
    const row = document.getElementById(rowId);
    const btn = row.querySelector('button');
    const originalText = btn.innerHTML;
    btn.disabled = true;
    btn.innerHTML = '<span class="spinner-border spinner-border-sm"></span>';
    
    // Gunakan route helper Laravel dengan prefix yayasan
    // Pastikan URL sesuai dengan route: Route::delete('/nota/file/{detailId}', ...)
    // Kita tambahkan filename sebagai query parameter
    const url = `/yayasan/transaksi/nota/file/${detailId}?filename=${encodeURIComponent(filename)}`;
    
    // Use POST with _method override to avoid 405 errors if server config issues
    let formData = new FormData();
    formData.append('_token', document.querySelector('meta[name="csrf-token"]').content);
    formData.append('_method', 'DELETE');
    
    fetch(url, {
        method: 'POST',
        headers: {
            'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').content,
            'Accept': 'application/json'
        },
        body: formData
    })
    .then(response => {
        if (!response.ok) {
            return response.json().then(err => { throw new Error(err.message || response.statusText) });
        }
        return response.json();
    })
    .then(data => {
        if (data.status === 'success') {
            // Hapus elemen baris file dari DOM
            if (row) {
                row.remove();
            }
            
            // Cek jika list kosong, hapus container
            const list = document.querySelector('.list-group');
            if (list && list.children.length === 0) {
                const container = document.getElementById('file-list-container');
                if (container) container.remove();
            }
            
            // Tampilkan pesan sukses
            // alert(data.message);
        } else {
            alert(data.message || 'Gagal menghapus file');
            btn.disabled = false;
            btn.innerHTML = originalText;
        }
    })
    .catch(error => {
        console.error('Error:', error);
        alert('Terjadi kesalahan saat menghapus file: ' + error.message);
        btn.disabled = false;
        btn.innerHTML = originalText;
    });
}



</script>


@endpush