@extends('admin.layouts.app')
@section('title')
    {{ __('create') }}
@endsection
@section('content')
    @if (userCan('test_preparation_course.create'))
        <div class="container-fluid">
            <div class="row">
                <div class="col-md-12">
                    <div class="card">
                        <div class="card-header">
                            <h3 class="card-title line-height-36">{{ __('create') }} {{ __('Courses') }}</h3>
                            <a href="{{ route('test_preparation_courses.index' ) }}"
                                class="btn bg-primary float-right d-flex align-items-center justify-content-center">
                                <i class="fas fa-arrow-left"></i>&nbsp; {{ __('back') }}
                            </a>
                        </div>
                        <div class="card-body">
                           <div class="row justify-content-center">
                                <div class="col-md-8">
                                    <form action="{{ route('test_preparation_courses.store') }}" method="POST">
                                        @csrf
                                        <div class="row">
                                            <div class="col-md-6">
                                                <div class="form-group">
                                                    <label class="form-label" for="plan_category">{{ __('Plan Title') }} <small
                                                        class="text-danger">*</small></label>
                                                        <select name="plan_id" id="plan_category" class="form-control @error('plan_id') is-invalid @enderror">
                                                            <option value="">Select Plan</option>
                                                            @foreach (@$plans as $plan)
                                                                <option value="{{@$plan['id']}}" {{old('plan_id') == $plan['id'] ? "selected" : "" }}>{{@$plan['title']}}</option>
                                                            @endforeach
                                                        </select>
                                                    @error('plan_id')
                                                        <span class="invalid-feedback" role="alert">{{ __(@$message) }}</span>
                                                    @enderror
                                                </div>
                                            </div>
                                            <div class="col-md-6 priceToggle" style="display: none">
                                                <div class="form-group">
                                                    <label class="form-label" for="price">{{ __('price') }}
                                                        {{ defaultCurrencySymbol() }}<small
                                                            class="text-danger">*</small></label>
                                                    <input type="number" id="price"  value="{{@$plan->price}}"
                                                        class="form-control @error('price') is-invalid @enderror"
                                                        placeholder="{{ __('10') }}{{ defaultCurrencySymbol() }}" readonly>
                                                    @error('price')
                                                        <span class="invalid-feedback" role="alert">{{ __(@$message) }}</span>
                                                    @enderror
                                                </div>
                                            </div>

                                            <div class="col-md-6 priceToggle" >
                                                <div class="form-group">
                                                    <label class="form-label" for="name">{{ __('Course Name') }}
                                                        {{ defaultCurrencySymbol() }}<small
                                                            class="text-danger">*</small></label>
                                                    <input type="text" id="name" name="name"  value="{{old('name')}}"
                                                        class="form-control @error('name') is-invalid @enderror"
                                                        placeholder="Course Name" >
                                                    @error('name')
                                                        <span class="invalid-feedback" role="alert">{{ __(@$message) }}</span>
                                                    @enderror
                                                </div>
                                            </div>

                                            <div class="col-md-6 priceToggle" >
                                                <div class="form-group">
                                                    <label class="form-label" for="duration">{{ __('Course Duration (In days)') }}
                                                        {{ defaultCurrencySymbol() }}<small
                                                            class="text-danger">*</small></label>
                                                    <input type="number" id="duration" name="duration"  value="{{old('duration')}}"
                                                        class="form-control @error('duration') is-invalid @enderror"
                                                        placeholder="Course Duration" >
                                                    @error('duration')
                                                        <span class="invalid-feedback" role="alert">{{ __(@$message) }}</span>
                                                    @enderror
                                                </div>
                                            </div>
                                            
                                        </div>
                                        <div class="row justify-content-center">
                                            <button class="btn btn-success" type="submit">
                                                <i class="fas fa-plus"></i>&nbsp; {{ __('create') }}
                                            </button>
                                        </div>  
                                    </form>
                                </div>
                           </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    @endif
@endsection
@section('script')
    <script src="{{ asset('backend') }}/plugins/select2/js/select2.full.min.js"></script>
    <script>
        $('#filterForm').on('change', function() {
            $(this).submit();
        })
        $('#plan_category').on('change', function() {
            $('.priceToggle').hide();
            var plan_category_id = $(this).find('option:selected').val();
            if(plan_category_id != '' && plan_category_id != undefined){
                $.ajax({
                    url: "{{ route('order.plan-details',['plan_category_id' => ':plan_category_id']) }}",
                    type: 'GET',
                    data: {
                        plan_category_id: plan_category_id
                    },
                    success: function(res) {
                        $('#price').val(res)
                        $('.priceToggle').show();
                    }
                });   
            }
        });
        $(document).ready(function() {
            var plan_category_id = $(this).find('option:selected').val();
            if(plan_category_id != '' && plan_category_id != undefined){
                $.ajax({
                    url: "{{ route('order.plan-details',['plan_category_id' => ':plan_category_id']) }}",
                    type: 'GET',
                    data: {
                        plan_category_id: plan_category_id
                    },
                    success: function(res) {
                        $('#price').val(res)
                        $('.priceToggle').show();
                    }
                });   
            }
        });

        

       
    </script>
@endsection

@section('style')
    <link rel="stylesheet" href="{{ asset('backend') }}/plugins/select2/css/select2.min.css">
    <link rel="stylesheet" href="{{ asset('backend') }}/plugins/select2-bootstrap4-theme/select2-bootstrap4.min.css">
    <style>
        .select2-results__option[aria-selected=true] {
            display: none;
        }

        .select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice {
            color: #fff;
            border: 1px solid #fff;
            background: #007bff;
            border-radius: 30px;
        }

        .select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice__remove {
            color: #fff;
        }
    </style>
@endsection