@extends('layouts.app')

@section('title', __('bms::lang.visits'))

@section('content')
<section class="content-header">
    <h1>@lang('bms::lang.visits')</h1>
</section>

<section class="content">
    @component('components.widget', ['class' => 'box-primary', 'title' => __('bms::lang.visits')])
        <div class="table-responsive">
            <table class="table table-bordered table-striped" id="bms_vs_table">
                <thead>
                    <tr>
                        <th>@lang('bms::lang.client')</th>
                        <th>@lang('bms::lang.visit') @lang('bms::lang.event_date')</th>
                        <th>@lang('bms::lang.open_time')</th>
                        <th>@lang('messages.status')</th>
                        <th>@lang('messages.action')</th>
                    </tr>
                </thead>
            </table>
        </div>
    @endcomponent
</section>
@endsection

@section('javascript')
<script>
$(function () {
    var table = $('#bms_vs_table').DataTable({
        processing: true, serverSide: true, order: [[1, 'desc']],
        ajax: { url: '{{ route('bms.visits.index') }}' },
        columns: [
            { data: 'contact_name', name: 'contacts.name' },
            { data: 'visit_date', name: 'visit_date' },
            { data: 'visit_time', name: 'visit_time' },
            { data: 'status', name: 'status' },
            { data: 'action', name: 'action', orderable: false, searchable: false },
        ],
    });
    window.__bmsTables = window.__bmsTables || [];
    window.__bmsTables.push(table);
});
</script>
@endsection
