@extends('layouts.app')
@section('title', __('mednotify::lang.log'))
@section('content')
<section class="content-header"><h1>@lang('mednotify::lang.log')</h1></section>
<section class="content">
    @component('components.widget', ['class' => 'box-primary'])
        <div class="row">
            <div class="col-md-4">
                <div class="form-group">
                    {!! Form::label('filter_event', __('mednotify::lang.event') . ':') !!}
                    {!! Form::select('filter_event', ['' => __('mednotify::lang.all')] + $events->mapWithKeys(fn ($e) => [$e => $e])->toArray(), null, ['class' => 'form-control', 'id' => 'filter_event']) !!}
                </div>
            </div>
            <div class="col-md-4">
                <div class="form-group">
                    {!! Form::label('filter_channel', __('mednotify::lang.channel') . ':') !!}
                    <select class="form-control" id="filter_channel">
                        <option value="">@lang('mednotify::lang.all')</option>
                        @foreach($channels as $channel)
                            <option value="{{ $channel }}">@lang('mednotify::lang.channel_' . $channel)</option>
                        @endforeach
                    </select>
                </div>
            </div>
            <div class="col-md-4">
                <div class="form-group">
                    {!! Form::label('filter_status', __('mednotify::lang.status') . ':') !!}
                    <select class="form-control" id="filter_status">
                        <option value="">@lang('mednotify::lang.all')</option>
                        @foreach($statuses as $status)
                            <option value="{{ $status }}">@lang('mednotify::lang.status_' . $status)</option>
                        @endforeach
                    </select>
                </div>
            </div>
        </div>

        <div class="table-responsive">
            <table class="table table-bordered table-striped" id="mednotify_log_table">
                <thead><tr>
                    <th>@lang('mednotify::lang.date')</th>
                    <th>@lang('mednotify::lang.event')</th>
                    <th>@lang('mednotify::lang.channel')</th>
                    <th>@lang('mednotify::lang.recipient')</th>
                    <th>@lang('mednotify::lang.subject')</th>
                    <th>@lang('mednotify::lang.status')</th>
                </tr></thead>
            </table>
        </div>
    @endcomponent
</section>
@endsection
@section('javascript')
<script>
$(function () {
    var table = $('#mednotify_log_table').DataTable({
        processing: true, serverSide: true, order: [[0, 'desc']],
        ajax: {
            url: '{{ route('mednotify.log.index') }}',
            data: function (d) {
                d.event_key = $('#filter_event').val();
                d.channel = $('#filter_channel').val();
                d.status = $('#filter_status').val();
            }
        },
        columns: [
            { data: 'created_at', name: 'created_at' },
            { data: 'event_key', name: 'event_key' },
            { data: 'channel', name: 'channel' },
            { data: 'recipient_type', name: 'recipient_type' },
            { data: 'rendered_subject', name: 'rendered_subject' },
            { data: 'status', name: 'status', orderable: false },
        ],
    });
    $('#filter_event, #filter_channel, #filter_status').on('change', function () { table.ajax.reload(); });
});
</script>
@endsection
