@extends('layouts.master')
@section('title', 'Internal Committees Add/Edit')

@section('style')
    <style></style>
@endsection

@section('script')
    <script>
        document.addEventListener('click', function(e) {

            // เพิ่ม staff
            if (e.target.classList.contains('add-staff')) {
                let wrapper = document.getElementById('staff-wrapper');

                let html = `
            <div class="input-group mb-2">
                <input type="text" class="form-control" name="ic_staff_name[]" required>
                <button type="button" class="btn btn-danger remove-staff">−</button>
            </div>
        `;
                wrapper.insertAdjacentHTML('beforeend', html);
            }

            // ลบ staff
            if (e.target.classList.contains('remove-staff')) {
                e.target.closest('.input-group').remove();
            }
        });

        $(document).ready(function() {
            $('.select2').select2({
                placeholder: 'Select Faculty Member',
                allowClear: true,
                width: '100%'
            });
        });
    </script>
@endsection

@section('content')

    @include('layouts.header')

    @include('layouts.title')


    <section class="wrapper bg-light">
        <div class="container py-15 py-md-17">

            <div class="col-md-12">
                <h5 class="display-1 mb-3" style="font-size: 30px">@yield('title')</h5>
                <p class="lead fs-lg pe-lg-15 pe-xxl-12"></p>
            </div>


            <div class="col-lg-12">
                <div class="blog single">
                    <div class="card">
                        <div class="card-body">

                            <div class="row">
                                <div class="col-lg-12">

                                    <form class="contact-form" method="post" action="{{ url('/internalcommitteeedit') }}"
                                        enctype="multipart/form-data">
                                        {{ csrf_field() }}

                                        <input type="hidden" name="ic_id" value="{{ $internalcommittee->ic_id ?? '' }}">

                                        <div class="messages"></div>
                                        <div class="row gx-4">

                                            <div class="col-md-12">
                                                <div class="form-floating mb-4">
                                                    <select class="form-select" placeholder="" name="ic_academic_year"
                                                        id="">
                                                        <option value="default" selected disabled>Please select</option>
                                                        @foreach ($academic_year as $i => $item)
                                                            <option value="{{ $item->academic_id }}"
                                                                @if (!empty($internalcommittee) && $internalcommittee->ic_academic_year == $item->academic_id) selected @endif>
                                                                {{ $item->academic_name }}
                                                            </option>
                                                        @endforeach
                                                    </select>
                                                    <label for="textInputExample">Academic Year *</label>
                                                </div>
                                            </div>

                                            <div class="col-md-12">
                                                <div class="form-floating mb-4">
                                                    <input type="text" class="form-control" id="textInputExample"
                                                        name="ic_name" value="{{ $internalcommittee->ic_name ?? '' }}"
                                                        placeholder="Internal Committee Name *" required>
                                                    <label for="textInputExample">Internal Committee Name *</label>
                                                </div>
                                            </div>

                                            <div class="col-md-12">
                                                <div class="mb-4">
                                                    <label class="form-label">Faculty Member Name *</label>
                                                    <select class="form-select select2" name="ic_faculty_member_name[]"
                                                        multiple>
                                                        @foreach ($faculty as $item)
                                                            <option value="{{ $item->faculty_id }}"
                                                                @if (!empty($internalcommittee) && in_array($item->faculty_id, explode(',', $ic_faculty_member_name))) selected @endif>
                                                                {{ $item->faculty_name }}
                                                            </option>
                                                        @endforeach
                                                    </select>
                                                </div>
                                            </div>


                                            <div class="col-md-12">
                                                <div id="staff-wrapper">
                                                    @if (!empty($internalcommittee) && !empty($ic_staff_name))
                                                        @foreach (explode(',', $ic_staff_name) as $staff)
                                                            <div class="input-group mb-2">
                                                                <input type="text" class="form-control"
                                                                    name="ic_staff_name[]" value="{{ trim($staff) }}"
                                                                    required>
                                                                <button type="button"
                                                                    class="btn btn-danger remove-staff">−</button>
                                                            </div>
                                                        @endforeach
                                                    @else
                                                        <div class="input-group mb-2">
                                                            <input type="text" class="form-control"
                                                                name="ic_staff_name[]" placeholder="Staff Name" required>
                                                            <button type="button"
                                                                class="btn btn-success add-staff">+</button>
                                                        </div>
                                                    @endif
                                                </div>
                                            </div>

                                            <div class="col-md-12">
                                                <div class="form-floating mb-4">
                                                    <input type="file" class="form-control" name="ic_documents"
                                                        accept=".pdf,.doc,.docx,.jpg,.png">
                                                    <label>Documents *</label>

                                                    @if (!empty($ic_documents))
                                                        <small class="text-muted">
                                                            Current file:
                                                            <a href="{{ asset('uploads/internal_committee/' . $ic_documents) }}"
                                                                target="_blank">
                                                                {{ $ic_documents }}
                                                            </a>
                                                        </small>
                                                    @endif
                                                </div>
                                            </div>

                                            <div class="col-12 text-center">
                                                <input type="submit" class="btn btn-primary rounded-pill btn-send mb-3"
                                                    value="Submit">
                                                <p class="text-muted"><strong>*</strong> These fields are required.</p>
                                            </div>

                                        </div>
                                    </form>
                                </div>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
        </div>

    </section>

    @include('layouts.footer')

@endsection