@extends('layout/ace')

@section('breadcrumbs')
    {{ Breadcrumbs::render('OceneKursa') }}
@endsection

@section('title')
    Pregled ocena kursa
@endsection

@section('content')
{{-- <div class="col-12">
    <!-- table-tools -->
    <div class="table-tools">
        <div class="table-filters">
            <div class="select-holder" wire:ignore="">
                <label>Filter Godina:</label>
                <div class="dropdown bootstrap-select form-control">
                    <select class="bootstrap-select form-control" autocomplete="off" data-style="btn btn-sm btn-white" id="year" tabindex="null">
                        @for ($i = intval(date('Y')); $i >= 2019 ; $i--)
                            <option @if($year == $i) selected="selected" @endif value="{{$i}}">{{$i}}</option>
                        @endfor
                    </select>
                </div>
            </div>
        </div>
    </div>
<!-- table-tools end -->
</div> --}}

<div class="col-12">
    <div class="h-100 bgc-white pt-0 radius-1 shadow-sm mx-auto">
        <div class="w-100 brc-info-tp2 radius-t-1"></div>
        <div class="card h-100 border-0">
            <div class="card-body h-100 d-flex flex-column justify-content-center py-3 px-3 border-0">
                <div class="table-responsive-md">
                    <table class="table table-bordered table-hover text-dark-blue custom-table">
                        <thead class="bgc-grey-l4">
                            <tr>
                                <th class="column-l">
                                    <span>Kurs</span>
                                </th>
                                <th class="column-xs">
                                    <span>Ocena</span>
                                </th>
                                <th class="column-xs">
                                    <span>Prosečna ocena</span>
                                </th>
                                <th class="column-xs">
                                    <span>Ocena tema</span>
                                </th>
                                <th class="column-xs">
                                    <span>Ocena korisnost</span>
                                </th>
                                <th class="column-xs">
                                    <span>Ocena primenjivost</span>
                                </th>
                                <th class="column-xs">
                                    <span>Prikaži prosečnu ocenu</span>
                                </th>
                            </tr>
                        </thead>

                        <tbody>
                            @foreach ($courses as $course)
                                <!-- user tr -->
                                <tr class="bgc-h-default-l3 d-style">
                                    <td class="column-l">
                                        <a
                                            href="{{ route('cms.course-review.show', $course->id) }}"
                                        >
                                            {{ $course->title }}
                                        </a>
                                    </td>
                                    <td class="column-xs">
                                        <a
                                            href="#"
                                            class="btn-open-modal-change-course-rate"
                                            data-course_id="{{ $course->id }}"
                                            data-course_rate="{{ $course->rating }}"
                                        >
                                            {{ number_format($course->rating, 1) }}
                                        </a>
                                    </td>
                                    <td class="column-xs">{{ $course->real_rate }}</td>
                                    <td class="column-xs">{{ number_format($course->reviews_avg_rate, 1) }}</td>
                                    <td class="column-xs">{{ number_format($course->reviews_avg_grade_useful, 1) }}</td>
                                    <td class="column-xs">{{ number_format($course->reviews_avg_grade_applicability, 1) }}</td>
                                    <td class="column-xs text-center">
                                        <input
                                            type="checkbox"
                                            class="ace-switch input-sm bgc-success"
                                            name="show_real_rate"
                                            value="1"
                                            data-course_id="{{ $course->id }}"
                                            @if ($course->show_real_rate)
                                                checked="checked"
                                            @endif
                                        >
                                    </td>
                                </tr>
                                <!-- user tr -->
                            @endforeach
                            <!-- user detail-row end -->
                        </tbody>
                    </table>
                    <!-- table end -->
                </div>
                <!-- table-responsive end -->
            </div><!-- card-body end -->
        </div><!-- .card -->
    </div><!-- h-100 end -->
</div>
@include('cms.course_review._modal-change-course-rate')
@endsection


@section('scripts')
    @parent
    <script>
        $(document).on('change', 'input[type=checkbox][name=show_real_rate]', function(e) {
            const course_id = $(e.target).data('course_id');
            const show_real_rate = $(e.target).is(':checked') ? 1 : 0;
            $.ajax({
                url: `${window.origin}/ks4dm/course/${course_id}/show-real-rate`,
                method: 'PATCH',
                data: {show_real_rate},
                success: function(data) {
                    acMessages(data.message, 'success');
                },
                error(xhr) {
                    acMessages("Greška prilikom izmene", 'error');
                    $element.attr('checked', !$element.is(":checked")   );
                }
            });
        });
    </script>
    <script>
        $(document).on('click', '.btn-open-modal-change-course-rate', (e) => {
            e.preventDefault();
            const course_id = $(e.target).data('course_id');
            const course_rate = $(e.target).data('course_rate');
            const action = route('cms.course.update_partial', course_id);

            $('#changeCourseRateForm').attr('action', action);
            $('#rating').val(course_rate);
            $('#changeCourseRateModal').modal('show');
        })
    </script>
@endsection