@extends('layouts.app')
@section('title', 'Student Bulk Upload')
@include('admin.components.toster')
@include('admin.components.tosterjs')
@include('admin.components.select2css')
@include('admin.components.select2js')
@section('content')
    <div class="container">
        <div class="page-breadcrumb d-flex align-items-center mb-2 border-bottom pb-2">
            <div>
                <h4>Student Bulk Upload</h4>
            </div>
            <div class="ms-auto">
                <a href="{{ route('admin.student.index') }}" type="button" class="btn btn-primary btn-sm"> <i
                        class="bi bi-arrow-counterclockwise"></i> Back To Student list</a>
            </div>
        </div>
        <!--breadcrumb-->
        <form action="{{ route('admin.student.bulk.upload.store') }}" method="post" enctype="multipart/form-data">
            @csrf
            <div class="row">
                <div class="col-12 col-xl-12">
                    <div class="card">
                        <div class="card-header bg-primary text-white">
                            <h6 class="mb-0 text-uppercase">Student Bulk Upload</h6>
                        </div>
                        <div class="card-body">
                            <div class="row g-3">
                                <div class="col-12 col-md-4">
                                    <label class="form-label">Class <span class="text-danger">*</span></label>
                                    <select name="class_type_id" id="class_type_id" class="form-control class_type_id" required>
                                        <option value="">Select Class</option>
                                        @foreach ($classtypes as $type)
                                            <option value="{{ $type->id }}">{{ $type->name }}</option>
                                        @endforeach
                                    </select>
                                    <div class="text-danger">{{ $errors->first('class_type_id') }}</div>
                                </div>
                                <div class="col-12 col-md-4">
                                    <label class="form-label">Session <span class="text-danger">*</span></label>
                                    <select name="session_id" id="session_id" class="form-control select2 session_id" required>
                                        <option value="">Select Session</option>
                                        @foreach ($sessiones as $session)
                                            <option value="{{ $session->id }}">{{ $session->name }}</option>
                                        @endforeach
                                    </select>
                                    <div class="text-danger">{{ $errors->first('session_id') }}</div>
                                </div>
                                <div class="col-12 col-md-4">
                                    <label class="form-label">Group/Department <span class="text-danger">*</span></label>
                                    <select name="group_id" id="group_id" class="form-control group_id" required>
                                        <option value="">Select Group</option>
                                    </select>
                                    <div class="text-danger">{{ $errors->first('group_id') }}</div>
                                </div>
                                <div class="col-12 col-md-4">
                                    <label class="form-label">Year <span class="text-danger">*</span></label>
                                    <select name="class_year_id" id="class_year_id" class="form-control class_year_id" required>
                                        <option value="">Select Class Year</option>
                                    </select>
                                    <div class="text-danger">{{ $errors->first('class_year_id') }}</div>
                                </div>
                                <div class="col-12 col-md-4">
                                    <label class="form-label">Section</label>
                                    <select name="section_id" id="section_id" class="form-control section_id">
                                        <option value="">Select Section</option>
                                    </select>
                                    <div class="text-danger">{{ $errors->first('section_id') }}</div>
                                </div>

                                <div class="col-12 col-md-4">
                                    <label class="form-label">Student Type <span class="text-danger">*</span></label>
                                    <select name="student_type" id="student_type" class="form-control student_type" required>
                                        <option value="Regular">Regular</option>
                                        <option value="Irregular">Irregular</option>
                                        <option value="">Select Type</option>
                                    </select>
                                    <div class="text-danger">{{ $errors->first('student_type') }}</div>
                                </div>

                                <div class="col-12 col-md-4">
                                    <label class="form-label">CSV File <span class="text-danger">*</span>  <a href="{{ asset('students/students.csv') }}" download>Example Download</a> </label>
                                     <input type="file" name="studentfile" class="form-control" required>
                                    <div class="text-danger">{{ $errors->first('studentfile') }}</div>
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="card">
                        <div class="card-body">
                            <div class="row">
                                <div class="col-12">
                                    <button type="submit" class="btn btn-primary px-4">Submit</button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </form>
    </div>
    </div>


@section('js')
    <script>
        $(document).on('change', '.class_type_id', function() {
            getClassYear();
            getGroup();
        });


        $(document).on('change', '.class_type_id,.session_id,.group_id,.class_year_id', function() {
            getSection();
        });


        function getClassYear() {
            var class_type_id = $('.class_type_id').val();
            if (class_type_id) {
                $.ajax({
                    type: "get",
                    url: "{{ route('get.classyear') }}",
                    data: {
                        class_type_id: class_type_id
                    },
                    success: function(data) {
                        $(".class_year_id").html(data);
                    },
                    error: function(data) {
                        console.log('Error:', data);
                    }
                });
            }
        }


        function getGroup() {
            var class_type_id = $('.class_type_id').val();
            if (class_type_id) {
                $.ajax({
                    type: "get",
                    url: "{{ route('get.group') }}",
                    data: {
                        class_type_id: class_type_id
                    },
                    success: function(data) {
                        $(".group_id").html(data);
                    },
                    error: function(data) {
                        console.log('Error:', data);
                    }
                });
            }
        }

        function getSection() {
            var class_type_id   = $('.class_type_id').val();
            var session_id      = $('.session_id').val();
            var group_id        = $('.group_id').val();
            var class_year_id   = $('.class_year_id').val();

            if (class_type_id && session_id && group_id && class_year_id) {
                $.ajax({
                    type: "get",
                    url: "{{ route('get.section') }}",
                    data: {
                        class_type_id: class_type_id,session_id:session_id,group_id:group_id,class_year_id:class_year_id
                    },
                    success: function(data) {
                        $(".section_id").html(data);
                    },
                    error: function(data) {
                        console.log('Error:', data);
                    }
                });
            }
        }







    </script>
@endsection
@endsection