@extends('layouts.app')

@section('title', 'Buat Surat P1')

@section('content')
<div class="card">
    <div class="card-header"><h3 class="card-title">Form Surat P1</h3></div>
    <div class="card-body">
        <form action="{{ route('p1.persetujuan.store') }}" method="POST">
            @csrf
            <div class="form-group row">
                <label class="col-sm-2 col-form-label">No. Surat</label>
                <div class="col-sm-10"><input type="text" name="nosrt" class="form-control" value="{{ $nosrt }}" required></div>
            </div>
            <div class="form-group row">
                <label class="col-sm-2 col-form-label">Mahasiswa</label>
                <div class="col-sm-10">
                    <select name="nim" class="form-control" required>
                        @foreach($mahasiswa as $m)
                        <option value="{{ $m->nim }}">{{ $m->nim }} - {{ $m->nama }}</option>
                        @endforeach
                    </select>
                </div>
            </div>
            <div class="form-group row">
                <label class="col-sm-2 col-form-label">Lokasi Penelitian</label>
                <div class="col-sm-10"><input type="text" name="lokasi_penelitian" class="form-control" required></div>
            </div>
            <div class="form-group row">
                <label class="col-sm-2 col-form-label">Judul Skripsi</label>
                <div class="col-sm-10"><textarea name="judul" class="form-control" required></textarea></div>
            </div>
            <button type="submit" class="btn btn-primary">Simpan & Cetak</button>
            <a href="{{ route('p1.persetujuan.index') }}" class="btn btn-secondary">Batal</a>
        </form>
    </div>
</div>
@endsection

@push('js')
<script>
    $(document).ready(function() {
        var nimSelect = $('select[name="nim_mahasiswa"], select[name="nim"]');
        nimSelect.select2({
            theme: 'bootstrap4',
            placeholder: 'Pilih atau Cari Mahasiswa'
        });
        var judulTextarea = $('textarea[name="judul_skripsi"], textarea[name="judul"]');
        
        nimSelect.on('change', function() {
            var nim = $(this).val();
            if (nim) {
                $.ajax({
                    url: '/mahasiswa/detail/' + nim,
                    type: 'GET',
                    dataType: 'json',
                    success: function(data) {
                        if (data && data.judul_skripsi) {
                            judulTextarea.val(data.judul_skripsi);
                        } else {
                            judulTextarea.val('');
                        }
                    }
                });
            } else {
                judulTextarea.val('');
            }
        });
    });
</script>
@endpush

