@extends('layouts.app')

@section('title', 'Edit Progress Mitra')
@section('page_title', 'Edit Progress Mitra')


@section('content')
<div class="erp-page">
    <div class="erp-page-actions">
        <a href="{{ route('proyek.spk.progress.show', [$proyek->id_proyek, $spk->id_spk, $progress->id_progress]) }}" class="btn btn-secondary">Detail</a>
        <a href="{{ route('proyek.spk.progress.index', [$proyek->id_proyek, $spk->id_spk]) }}" class="btn btn-light">← Daftar Progress</a>
    </div>
@if ($errors->any())
        <div class="alert alert-danger">
            <strong>Terjadi kesalahan.</strong>
            <ul style="margin:.5rem 0 0 1rem;">
                @foreach ($errors->all() as $error)
                    <li>{{ $error }}</li>
                @endforeach
            </ul>
        </div>
    @endif

    <form method="POST" action="{{ route('proyek.spk.progress.update', [$proyek->id_proyek, $spk->id_spk, $progress->id_progress]) }}" enctype="multipart/form-data">
        @csrf
        @method('PUT')

        <section class="card erp-card" style="margin-bottom:1rem;">
            <div class="card-header erp-card-header">
                <div>
                    <h2>Data Progress</h2>
                    <p>Perbarui laporan progress pekerjaan mitra.</p>
                </div>
            </div>

            <div class="form-grid">
                <div class="form-group">
                    <label for="tanggal_progress">Tanggal Progress <span class="text-danger">*</span></label>
                    <input type="date" id="tanggal_progress" name="tanggal_progress" class="form-control erp-input" required
                           value="{{ old('tanggal_progress', $progress->tanggal_progress ?? date('Y-m-d')) }}">
                </div>

                <div class="form-group">
                    <label for="progress_persen">Progress Header (%)</label>
                    <input type="number" id="progress_persen" name="progress_persen" class="form-control erp-input" min="0" max="100" step="0.01"
                           value="{{ old('progress_persen', $progress->progress_persen ?? 0) }}">
                </div>

                <div class="form-group">
                    <label for="status">Status</label>
                    @php
                        $statusValue = old('status', $progress->status ?? 'Draft');
                        $statusList = ['Draft', 'Diajukan', 'Disetujui', 'Ditolak'];
                    @endphp
                    <select id="status" name="status" class="form-control erp-input">
                        @foreach ($statusList as $status)
                            <option value="{{ $status }}" {{ $statusValue === $status ? 'selected' : '' }}>{{ $status }}</option>
                        @endforeach
                    </select>
                </div>

                <div class="form-group form-group-full">
                    <label for="uraian_pekerjaan">Uraian Pekerjaan</label>
                    <textarea id="uraian_pekerjaan" name="uraian_pekerjaan" class="form-control erp-input" rows="3">{{ old('uraian_pekerjaan', $progress->uraian_pekerjaan ?? '') }}</textarea>
                </div>

                <div class="form-group form-group-full">
                    <label for="kendala">Kendala</label>
                    <textarea id="kendala" name="kendala" class="form-control erp-input" rows="3">{{ old('kendala', $progress->kendala ?? '') }}</textarea>
                </div>

                <div class="form-group form-group-full">
                    <label for="catatan">Catatan</label>
                    <textarea id="catatan" name="catatan" class="form-control erp-input" rows="3">{{ old('catatan', $progress->catatan ?? '') }}</textarea>
                </div>
            </div>
        </section>

        <section class="card erp-card" style="margin-bottom:1rem;">
            <div class="card-header erp-card-header">
                <div>
                    <h2>Progress Item SPK</h2>
                    <p>Perbarui volume/progress pekerjaan per item SPK.</p>
                </div>
            </div>

            <div class="table-responsive erp-table-wrap">
                <table class="data-table erp-table">
                    <thead>
                        <tr>
                            <th>No</th>
                            <th>Pekerjaan</th>
                            <th>Volume SPK</th>
                            <th>Satuan</th>
                            <th>Progress Volume</th>
                            <th>Progress (%)</th>
                            <th>Catatan</th>
                        </tr>
                    </thead>
                    <tbody id="progressItemBody">
                        @forelse ($spkItems as $index => $item)
                            @php
                                $pItem = $progressItems[$item->id_item] ?? null;
                            @endphp
                            <tr>
                                <td>{{ $index + 1 }}</td>
                                <td>
                                    <strong>{{ $item->nama_pekerjaan ?? '-' }}</strong>
                                    <input type="hidden" name="items[{{ $index }}][id_spk_item]" value="{{ $item->id_item }}">
                                </td>
                                <td>{{ number_format((float) ($item->volume ?? 0), 2, ',', '.') }}</td>
                                <td>{{ $item->satuan ?? '-' }}</td>
                                <td>
                                    <input type="text" name="items[{{ $index }}][progress_volume]" class="form-control erp-input"
                                           value="{{ old('items.' . $index . '.progress_volume', $pItem->progress_volume ?? 0) }}">
                                </td>
                                <td>
                                    <input type="number" name="items[{{ $index }}][progress_persen]" class="form-control item-progress-persen"
                                           min="0" max="100" step="0.01"
                                           value="{{ old('items.' . $index . '.progress_persen', $pItem->progress_persen ?? 0) }}">
                                </td>
                                <td>
                                    <input type="text" name="items[{{ $index }}][catatan]" class="form-control erp-input"
                                           value="{{ old('items.' . $index . '.catatan', $pItem->catatan ?? '') }}">
                                </td>
                            </tr>
                        @empty
                            <tr>
                                <td colspan="7" style="text-align:center;">Belum ada item SPK.</td>
                            </tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
        </section>

        <section class="card erp-card">
            <div class="card-header erp-card-header">
                <div>
                    <h2>Evidence</h2>
                    <p>Tambah evidence baru atau lihat evidence yang sudah ada.</p>
                </div>
            </div>

            <div class="card-body erp-card-body">
                @if(!empty($evidences) && count($evidences) > 0)
                    @foreach ($evidences as $evidence)
                        <div style="padding:.75rem 0; border-bottom:1px solid #e5e7eb;">
                            <strong>{{ $evidence->file_name ?? 'Evidence' }}</strong>
                            <div><small class="text-muted">{{ $evidence->keterangan ?? '-' }}</small></div>
                            <div style="margin-top:.35rem; display:flex; gap:.5rem; flex-wrap:wrap;">
                                <a href="{{ asset('storage/' . $evidence->file_path) }}" target="_blank" class="btn btn-sm btn-light">Lihat File</a>
                                <form method="POST"
                                      action="{{ route('proyek.spk.progress.evidence.delete', [$proyek->id_proyek, $spk->id_spk, $progress->id_progress, $evidence->id_evidence]) }}"
                                      onsubmit="return confirm('Hapus evidence ini?');">
                                    @csrf
                                    <button type="submit" class="btn btn-sm btn-danger">Hapus</button>
                                </form>
                            </div>
                        </div>
                    @endforeach
                @else
                    <p>Belum ada evidence.</p>
                @endif
            </div>

            <div class="form-grid" style="margin-top:1rem;">
                <div class="form-group">
                    <label>Tambah Evidence</label>
                    <input type="file" name="evidence[]" class="form-control erp-input" multiple>
                    <small class="form-help">Bisa pilih lebih dari satu file. Maksimal 10MB/file.</small>
                </div>
                <div class="form-group">
                    <label>Keterangan Evidence Baru</label>
                    <input type="text" name="evidence_keterangan[]" class="form-control erp-input" placeholder="Keterangan umum evidence">
                </div>
            </div>

            <div style="display:flex; gap:.6rem; flex-wrap:wrap; margin-top:1rem;">
                <button type="submit" class="btn btn-primary">Simpan Perubahan</button>
                <a href="{{ route('proyek.spk.progress.show', [$proyek->id_proyek, $spk->id_spk, $progress->id_progress]) }}" class="btn btn-secondary">Batal</a>
            </div>
        </section>
    </form>
</div>

<script>
document.addEventListener('DOMContentLoaded', function () {
    const itemBody = document.getElementById('progressItemBody');
    const totalInput = document.getElementById('progress_persen');

    function parseNumber(value) {
        value = String(value || '0').trim().replace(/\./g, '').replace(',', '.');
        const number = parseFloat(value);
        return isNaN(number) ? 0 : number;
    }

    function clamp(value, min, max) {
        return Math.min(max, Math.max(min, value));
    }

    function calculateHeaderProgress() {
        const inputs = itemBody ? itemBody.querySelectorAll('.item-progress-persen') : [];
        let total = 0;
        let count = 0;

        inputs.forEach(input => {
            total += clamp(parseNumber(input.value), 0, 100);
            count++;
        });

        if (count > 0 && totalInput) {
            totalInput.value = (total / count).toFixed(2);
        }
    }

    if (itemBody) {
        itemBody.querySelectorAll('.item-progress-persen').forEach(input => {
            input.addEventListener('input', calculateHeaderProgress);
        });
    }
});
</script>
@endsection