@extends('layouts.app')
@section('titlePage', 'Supervise Course')
@section('content')
<script>
    document.getElementById("kts-9").classList.add("is-expanded");
    document.getElementById("ktss-9").classList.add("active","is-expanded");
    document.getElementById("view-9").classList.add("active");
</script> 
<div class="page-wrapper">
   <!-- [ breadcrumb ] start -->
   <div class="breadcrumb-header justify-content-between">
        <div class="left-content">
		<h5 class="breadcrumb-item font-weight-bold">View All</h5>

        </div>
        <div class="justify-content-center mt-2">
               <ol class="breadcrumb">
                  <li class="breadcrumb-item"><a href="{{ _route('client.courses.index') }}"><i class="feather icon-home"></i></a></li>
                  <li class="breadcrumb-item active">View</li>
               </ol>
            </div>
         </div>
    
   <!-- [ breadcrumb ] end -->
   <!-- [ Main Content ] start -->
   <div class="row">
      <div class="col-sm-12">
         <div class="card">
            <div class="card-header">
               <a href="{{ _route('client.courses.index') }}" class="btn btn-primary float-right">List</a>
            </div>
            <div class="card-body">
               @include('common.alert')
               <style>
    .select2-container .select2-selection--multiple{
        min-height: 40px !important;
        background: #eff3f6 !important;
        border: 1px solid #ced4da !important;
    }
    .select2-container .select2-search--inline .select2-search__field{
        line-height: 30px !important;
    }
</style>
<div class="row">
    <div class="col-md-12">
        <div class="form-group">
            <label for="">Title* <span class="text-red"></span></label>
            <input type="text" class="form-control" name="title" value="{{ getValueInput($data,'title')}}"
                   id="title" required>
        </div>
    </div>
    <div class="col-md-12">
        <div class="form-group" >
            <label for="">Description <span class="text-red">*</span></label>
            <textarea id="description" class="form-control ck_editor" name="description">{!! getValueInput($data,'description') !!}</textarea>
        </div>
    </div>
</div>

@include('common.script.view-multi-section')

<div class="row">
    {{--<div class="col-md-12">
        @include('common.lfm', [
               'type' => 'image',
               'name' => 'Image',
               'input' => 'image',
               'required' => true,
               'file' => $data->image ?? null,
        ])
    </div>--}}
    <div class="repeater col-md-12">
        <div data-repeater-list="section" class="section form-group pt-5">
            @if(old('section') != null)
                @php 
                $i = 0;
                @endphp
                @foreach(old('section') as $key => $oldData)
                    <div data-repeater-item class="repeater_item">
                        <label for="">{{$content_name}}</label><br>
                        <input id="section_title" type="text" class="form-control" name="section[{{$i}}][title_section]" value="{{$oldData['title_section']}}" placeholder="Name"/>
                        <div class="d-flex mt-2">
                            <select class="form-control select-content "  id="content" name="section[{{$i}}][content_section][]" multiple>
                                @if(count($dataContent) > 0)
                                    @foreach($dataContent as $e)
                                        <option value="{{$e['value']}}" {{(in_array($e['value'],$oldData['content_section'] ?? []) ? 'selected' : '')}}>{{$e['title']}}</option>
                                    @endforeach
                                @endif
                            </select>
                        </div>
                    </div>
                    @php $i++ @endphp
                @endforeach
            @else
                @if(!empty($data->sections_course) && count($data->sections_course))
                    @php $i = 0 @endphp
                        @foreach($data->sections_course as $section)
                            <div data-repeater-item class="repeater_item">
                                <label for="">{{$content_name}}</label><br>
                                <input type="hidden" name="section[{{$i}}][id]" value="{{$section['id']}}"/>
                                <input type="text" id="section_title" class="form-control" name="section[{{$i}}][title_section]" value="{{$section['section_title']}}" placeholder="Name"/>
                                <div class="d-flex mt-2">
                                    <select class="form-control select-content " id="content" name="section[{{$i}}][content_section][]" multiple>
                                        @if(count($dataContent) > 0)
                                            @php
                                                $content = json_decode($section->content,true);
                                                $content = is_array($content) ? $content : [];
                                            @endphp
                                            @foreach($content as $keyMap)
                                                @if(array_key_exists($keyMap,$dataContent))
                                                    <option id="content" value="{{$dataContent[$keyMap]['value']}}" selected>{{$dataContent[$keyMap]['title']}}</option>
                                                @endif
                                            @endforeach
                                            @foreach($dataContent as $e)
                                                @if(!in_array($e['value'],$content))
                                                    <option value="{{$e['value']}}">{{$e['title']}}</option>
                                                @endif
                                            @endforeach
                                        @endif
                                    </select>
                                </div>
                            </div>
                        @php $i++ @endphp
                        @endforeach
                @else
                    <div data-repeater-item class="repeater_item">
                        <label for="">{{$content_name}}</label><br>
                        <input type="text" id="section_title" class="form-control" name="section[0][title_section]" value="" placeholder="Name"/>
                        <div class="d-flex mt-2">
                            <select class="form-control select-content " id="content" name="section[0][content_section][]" multiple>
                                @if(count($dataContent) > 0)
                                    @foreach($dataContent as $e)
                                        <option value="{{$e['value']}}">{{$e['title']}}</option>
                                    @endforeach
                                @endif
                            </select>
                        </div>
                    </div>
                @endif
            @endif
        </div>
    </div>

</div>


<div class="row input-daterange" style="width: auto;">
    <fieldset class="form-group col-md-6">
        <label for="start_date">Start Date*</label>
        <input id="start_date" class="input-sm form-control start-date" placeholder="17-07-2020" value="{{ old('start_date', encode_date(isset($data->start_date) ? Carbon::parse($data->start_date)->format('d-m-Y'):'' ?? null)) }}"  name="start_date" type="text" id="start_date" required>
    </fieldset>
    <fieldset class="form-group col-md-6">
        <label for="end_date">End Date*</label>
        <input id="end_date" class="input-sm form-control end-date" placeholder="20-07-2020" name="end_date" value="{{ old('end_date', encode_date(isset($data->end_date) ? Carbon::parse($data->end_date)->format('d-m-Y'):'' ?? null)) }}" type="text" id="end_date" required>
    </fieldset>
</div>

            </div>
         </div>
      </div>
   </div>
   <!-- [ Main Content ] end -->
</div>
@push('script')
<script>
    $(document).ready(function (e) {
        $(function(){
            $('#title').prop('disabled', true);
            $('#description').prop('disabled', true);
            $('#select_all').prop('disabled', true);
            $('#campus_id').prop('disabled', true);
            $('#degree_specialization_id').prop('disabled', true);
            $('#department_mng_id').prop('disabled', true);
            $('#batch_id').prop('disabled', true);
            $('#section_id').prop('disabled', true);
            $('#image').prop('disabled', true);
            $('#section_title').prop('disabled', true);
            $('#content').prop('disabled', true);
            $('#publish_result').prop('disabled', true);
            $('#start_date').prop('disabled', true);
            $('#end_date').prop('disabled', true);
            
        });
    });

</script>
@endpush
@endsection
@section('script')
    @include('client.course.script')
@endsection