@extends('layouts.app')

@section('title', 'Edit Bobot Nilai - SIAKAD')
@section('page-title', 'Edit Konfigurasi Bobot Nilai')

@section('content')
<div class="row">
    <div class="col-md-6">
        <div class="card">
            <div class="card-header">
                <div class="d-flex justify-content-between align-items-center">
                    <div>
                        <h5 class="mb-0">Edit: {{ $bobotNilai->matakuliah->nama ?? 'Konfigurasi Umum' }}</h5>
                        @if($bobotNilai->is_default)
                            <span class="badge bg-success mt-1">Default</span>
                        @endif
                    </div>
                    <a href="{{ route('admin.bobot-nilai.index') }}" class="btn btn-outline-secondary btn-sm">
                        <i class="bi bi-arrow-left me-1"></i>Kembali
                    </a>
                </div>
            </div>
            <div class="card-body">
                <form action="{{ route('admin.bobot-nilai.update', $bobotNilai) }}" method="POST">
                    @csrf @method('PUT')
                    <div class="mb-3">
                        <label class="form-label">Mata Kuliah</label>
                        <select name="matakuliah_id" class="form-select @error('matakuliah_id') is-invalid @enderror">
                            <option value="">-- Umum (Semua MK) --</option>
                            @foreach($matakuliahs as $mk)
                                <option value="{{ $mk->id }}" {{ old('matakuliah_id', $bobotNilai->matakuliah_id) == $mk->id ? 'selected' : '' }}>
                                    {{ $mk->nama }} ({{ $mk->kode }})
                                </option>
                            @endforeach
                        </select>
                        @error('matakuliah_id')
                            <div class="invalid-feedback">{{ $message }}</div>
                        @enderror
                    </div>

                    <div class="row">
                        <div class="col-6 mb-3">
                            <label class="form-label">Tugas (%)</label>
                            <input type="number" name="tugas" class="form-control @error('tugas') is-invalid @enderror"
                                value="{{ old('tugas', $bobotNilai->tugas) }}" min="0" max="100" step="0.01" required>
                            @error('tugas')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-6 mb-3">
                            <label class="form-label">UTS (%)</label>
                            <input type="number" name="uts" class="form-control @error('uts') is-invalid @enderror"
                                value="{{ old('uts', $bobotNilai->uts) }}" min="0" max="100" step="0.01" required>
                            @error('uts')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-6 mb-3">
                            <label class="form-label">UAS (%)</label>
                            <input type="number" name="uas" class="form-control @error('uas') is-invalid @enderror"
                                value="{{ old('uas', $bobotNilai->uas) }}" min="0" max="100" step="0.01" required>
                            @error('uas')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                        <div class="col-6 mb-3">
                            <label class="form-label">Presensi (%)</label>
                            <input type="number" name="presensi" class="form-control @error('presensi') is-invalid @enderror"
                                value="{{ old('presensi', $bobotNilai->presensi) }}" min="0" max="100" step="0.01" required>
                            @error('presensi')
                                <div class="invalid-feedback">{{ $message }}</div>
                            @enderror
                        </div>
                    </div>

                    <div class="mb-3">
                        <div class="alert alert-info py-2 mb-0">
                            <small>Total: <span id="totalPersen">{{ $bobotNilai->tugas + $bobotNilai->uts + $bobotNilai->uas + $bobotNilai->presensi }}</span>%</small>
                        </div>
                    </div>

                    <div class="d-flex gap-2">
                        <button type="submit" class="btn btn-primary">
                            <i class="bi bi-check-lg me-2"></i>Update
                        </button>
                        @if(!$bobotNilai->is_default && !$bobotNilai->matakuliah_id)
                            <a href="{{ route('admin.bobot-nilai.setDefault', $bobotNilai) }}" class="btn btn-success">
                                <i class="bi bi-star me-2"></i>Jadikan Default
                            </a>
                        @endif
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
@endsection

@push('scripts')
<script>
document.querySelectorAll('input[name="tugas"], input[name="uts"], input[name="uas"], input[name="presensi"]').forEach(input => {
    input.addEventListener('input', updateTotal);
});

function updateTotal() {
    const tugas = parseFloat(document.querySelector('input[name="tugas"]').value) || 0;
    const uts = parseFloat(document.querySelector('input[name="uts"]').value) || 0;
    const uas = parseFloat(document.querySelector('input[name="uas"]').value) || 0;
    const presensi = parseFloat(document.querySelector('input[name="presensi"]').value) || 0;
    const total = tugas + uts + uas + presensi;

    const alert = document.querySelector('.alert-info');
    alert.className = total === 100 ? 'alert alert-info py-2 mb-0' : 'alert alert-danger py-2 mb-0';
    document.getElementById('totalPersen').textContent = total.toFixed(2);
}
</script>
@endpush