@extends('layouts.instructor')

@push('title', get_phrase('Schedule Create'))

@push('meta')
@endpush

@push('css')
@endpush



@section('content')
    <div class="ol-card radius-8px">
        <div class="ol-card-body my-3 py-18px px-20px">
            <div class="d-flex align-items-center justify-content-between gap-3 flex-wrap flex-md-nowrap">
                <h4 class="title fs-16px">
                    <i class="fi-rr-settings-sliders me-2"></i>
                    {{ get_phrase('Add schedule') }}
                </h4>
            </div>
        </div>
    </div>

    <!-- Content -->
    <div class="ol-body-content">
        <div class="container-fluid">
            <div class="row">
                <div class="col-lg-7">
                    <div class="ol-card">
                        <form class="required-form" action="{{ route('instructor.schedule_store') }}" method="post" enctype="multipart/form-data">
                            @csrf
                            <div class="ol-card-body mb-20px p-20px">
                                <h4 class="title fs-16px mb-3">{{ get_phrase('Add schedule') }}</h4>

                                <div class="row">
                                    <div class="col-xxl-6">
                                        <div class="mb-3">
                                            <label for="category_id" class="form-label ol-form-label">
                                                {{ get_phrase('Category') }}<span class="text-danger ms-1">*</span>
                                            </label>
                                            <select class="ol-select2" name="category_id" id="category_id" required>
                                                <option value="0">{{ get_phrase('Select Category') }}</option>
                                                @foreach ($categories as $category)
                                                    <option value="{{ $category->category_id }}">{{ $category->category_to_tutorCategory->name }}</option>
                                                @endforeach
                                            </select>
                                        </div>
                                    </div>

                                    <div class="col-xxl-6 d-flex align-items-end">
                                        <div class="w-100 mb-3 load_subjects">
                                            <label for="subject_id" class="form-label ol-form-label">
                                                {{ get_phrase('Subject') }}<span class="text-danger ms-1">*</span>
                                            </label>
                                            <select class="ol-select2" name="subject_id" id="subject_id" required>
                                                <option value="">{{ get_phrase('First select category') }}
                                                </option>
                                            </select>
                                        </div>
                                    </div>
                                </div>

                                <div class="eRadios">
                                    <div class="paid-section" id="paid-section">

                                        <div class="mb-3">
                                            <label class="form-label ol-form-label col-sm-2 w-100">
                                                {{ get_phrase('Tution type') }}
                                                <span class="text-danger ms-1">*</span>
                                            </label>
                                            <div class="d-flex gap-3">

                                                <div class="form-check">
                                                    <input type="radio" name="tution_type" value="1"
                                                        class="form-check-input form-check-input-radio" id="single_1" name="1_tution_type_indentify"
                                                        onchange="$('#tution_type').slideUp(200)" checked>
                                                    <label for="single_1"
                                                        class="form-check-label">{{ get_phrase('Single time') }}</label>
                                                </div>

                                                <div class="form-check">
                                                    <input type="radio" name="tution_type" value="0"
                                                        class="form-check-input form-check-input-radio" id="selected_class_1" name="1_tution_type_indentify"
                                                        onchange="$('#tution_type').slideDown(200)">
                                                    <label for="selected_class_1"
                                                        class="form-check-label">{{ get_phrase('Repeated days') }}</label>
                                                </div>

                                            </div>
                                        </div>

                                        <div class="mb-3">
                                            <label class="form-label ol-form-label" for="start_time">{{ get_phrase('Schedule start time') }}<span class="required">*</span></label>
                                            <input type="datetime-local" class="form-control ol-form-control" id="start_time" name="start_time" required>
                                        </div>

                                        <div id="tution_type">

                                            <div class="mb-3">
                                                <label class="form-label ol-form-label"
                                                    for="end_time">{{ get_phrase('Schedule end Date') }}</label>
                                                <input type="date" name="end_time" id="end_time" class="form-control ol-form-control">
                                            </div>

                                            <div class="mb-3">
                                                <div class="d-flex justify-content-between">
                                                    <div> 
                                                        <label class="form-label ol-form-label col-sm-2 w-100">
                                                            {{ get_phrase('Select days') }}
                                                            <span class="text-danger ms-1">*</span>
                                                        </label>
                                                    </div>
                                                    <div class="d-flex" style="justify-content: right;"> 
                                                        <label class="form-label ol-form-label col-sm-2 w-100 float-end" for="check_all_days">{{ get_phrase('Check all') }}</label><input type="checkbox" class="form-check-input form-check-input-checkbox" id="check_all_days">
                                                    </div>
                                                </div>
                                                <div class="form-check form-check-checkbox d-flex justify-content-between">
                                                    <div>
                                                        <input type="checkbox" class="form-check-input form-check-input-checkbox" id="sunday_1" name="1_day[]" value="sunday">
                                                        <label id="label_sunday_1" for="sunday_1">