@extends('layout._default')
@section('title')
    Feedbacks
@endsection
@section('body-con')
   
<div class="card">
    <!--begin::Card header-->
    <div class="card-header border-0 pt-6">
        <!--begin::Card title-->
        <div class="card-title">
            <!--begin::Search-->
            <div class="d-flex align-items-center position-relative my-1">
                {!! getIcon('magnifier', 'fs-3 position-absolute ms-5') !!}
                <input type="text" data-kt-user-table-filter="search" class="form-control form-control-solid w-250px ps-13" placeholder="Search Feedback" id="mySearchInput"/>
               
            </div>
            <div class="d-flex align-items-center position-relative my-1 float-right mx-1">
                <select onchange="filterData()" id="medium" class="form-control form-control-solid w-250px ps-13" name="medium" data-kt-select2="true" data-placeholder="Select Medium" data-allow-clear="true" data-hide-search="true">
                    <option></option>
                    <option value="ushare">Ushare</option>
                    <option value="app">App</option>
                </select>
                <!--end::Input-->
            </div>
            <!--end::Search-->
        </div>
        <!--begin::Card title-->

        <!--begin::Card toolbar-->
        <div class="card-toolbar">
            {{-- <div class="d-flex justify-content-end" data-kt-user-table-toolbar="base">
                <!--begin::Add user-->
                <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#kt_modal_add_user">
                    {!! getIcon('plus', 'fs-2', '', 'i') !!}
                    Add User
                </button>
                <!--end::Add user-->
            </div> --}}

        </div>
        <!--end::Card toolbar-->
    </div>
    <!--end::Card header-->

    <!--begin::Card body-->
    <div class="card-body py-4">
        <!--begin::Table-->
        <div class="table-responsive">

            {{ $dataTable->table() }}
            <div id="total_records"></div>
        </div>

        
        <!--end::Table-->
    </div>
    <!--end::Card body-->
</div>

{{-- @include('livewire.user.add-user-modal') --}}
@push('scripts')
        {{ $dataTable->scripts() }}
    <script>
        KTMenu.init();
        // var recordsTotal = window.LaravelDataTables["userfeedback-table"];
        // console.log(recordsTotal);
        // $('#total_records').text('Total Records: ' + recordsTotal);
        document.getElementById('mySearchInput').addEventListener('keyup', function () {
            window.LaravelDataTables['userfeedback-table'].search(JSON.stringify({"search": this.value,"medium":document.getElementById('medium').value})).draw();
        });
        
    
        function filterData()
        {
            // console.log(window.LaravelDataTables["userfeedback-table"])
            window.LaravelDataTables['userfeedback-table'].search(JSON.stringify({"search": document.getElementById('mySearchInput').value,"medium":document.getElementById('medium').value})).draw();
        }
    </script>
@endpush


@endsection