@extends('company.layout.content')

@section('customTitle')
{{ __('company.Ratings.fields.Show Reviews') }}
@endsection

@section('customStyle')
<link href='{{ asset("company/$locale/assets/css/elements/alert.css") }}' rel="stylesheet" type="text/css" />
@endsection


@section('customBody')
<div id="content" class="main-content">
    <div class="layout-px-spacing">
        <div class="row layout-top-spacing">
            <div class="col-12 layout-spacing">
                <div class="widget-content widget-content-area br-6">
                    <div class="table-responsive">
                        <table id="ratingsTable" class="table table-hover text-center">
                            <thead>
                                <tr>
                                    <th>{{ __('company.Ratings.fields.User Name') }}</th>
                                    <th>{{ __('company.Ratings.fields.Rating') }}</th>
                                    <th>{{ __('general.actions') }}</th>
                                </tr>
                            </thead>
                            <tfoot>
                                <tr>
                                    <th>{{ __('company.Ratings.fields.User Name') }}</th>
                                    <th>{{ __('company.Ratings.fields.Rating') }}</th>
                                    <th>{{ __('general.actions') }}</th>
                                </tr>
                            </tfoot>
                        </table>
                    </div>
                </div>
            </div>
        </div>

    </div>
</div>

<x-bootstrap.modal id="showModal" content-type="empty" :with-header="false" />

@endsection

@section('customScript')
<script>
    $("#ratings-menu-box").attr("data-active", "true");

    initializeDataTable("#ratingsTable",{
        columns : [
            {data: "user", searchable: false, orderable: false},
            {data: "value", searchable: false},
            {data: "actions", searchable: false, orderable: false},
        ],
        searching:false
    });


    $(document).on("click",".show-rating",function(e){
        e.preventDefault();
        $("#showModal .modal-body").html($(this).data("review"));
        $("#showModal").modal();
    });
</script>

@endsection