@extends('layouts.app')
@section('title', __('lang_v1.bounce_log'))

@section('content')
<section class="content-header">
    <h1><i class="fa fa-list"></i> @lang('lang_v1.bounce_log')
        <small>@lang('lang_v1.bounce_log_desc')</small>
    </h1>
</section>

<section class="content">
    @include('layouts.partials.error')

    <div class="box box-solid">
        <div class="box-body">
            {!! Form::open(['route' => 'bounce-rate.log', 'method' => 'get', 'class' => 'form-inline']) !!}
                <div class="form-group">
                    {!! Form::label('start_date', __('report.start_date') . ':') !!}
                    {!! Form::date('start_date', $filters['start_date'] ?? null, ['class' => 'form-control', 'style' => 'width:160px;']) !!}
                </div>
                <div class="form-group" style="margin-left:10px;">
                    {!! Form::label('end_date', __('report.end_date') . ':') !!}
                    {!! Form::date('end_date', $filters['end_date'] ?? null, ['class' => 'form-control', 'style' => 'width:160px;']) !!}
                </div>
                <div class="form-group" style="margin-left:10px;">
                    {!! Form::label('state', __('business.state') . ':') !!}
                    {!! Form::select('state', ['' => __('lang_v1.all_states')] + $states->mapWithKeys(fn($s) => [$s => $s])->all(),
                        $filters['state'] ?? null, ['class' => 'form-control']) !!}
                </div>
                <div class="form-group" style="margin-left:10px;">
                    {!! Form::label('business_id', __('lang_v1.store') . ':') !!}
                    {!! Form::select('business_id', ['' => __('lang_v1.all_stores')] + $businesses->all(),
                        $filters['business_id'] ?? null, ['class' => 'form-control select2', 'style' => 'width:220px;']) !!}
                </div>
                <div class="form-group" style="margin-left:10px;">
                    {!! Form::label('bounce_type', __('lang_v1.bounce_reason') . ':') !!}
                    {!! Form::select('bounce_type', [
                            '' => __('lang_v1.all'),
                            'out_of_stock' => __('lang_v1.bounce_out_of_stock'),
                            'not_listed' => __('lang_v1.bounce_not_listed'),
                        ], $filters['bounce_type'] ?? null, ['class' => 'form-control']) !!}
                </div>
                <button type="submit" class="btn btn-primary" style="margin-left:10px;">
                    <i class="fa fa-filter"></i> @lang('messages.filter')
                </button>
                <a href="{{ route('bounce-rate.index', $filters) }}" class="btn btn-default">
                    <i class="fa fa-chart-line"></i> @lang('lang_v1.back_to_board')
                </a>
            {!! Form::close() !!}
        </div>
    </div>

    @component('components.widget', ['class' => 'box-primary', 'title' => __('lang_v1.bounce_log')])
        <p class="help-block">@lang('lang_v1.bounce_log_help')</p>
        <div class="table-responsive">
            <table class="table table-bordered table-striped" id="bounce_log_table" style="width:100%;">
                <thead><tr>
                    <th>@lang('lang_v1.store')</th>
                    <th>@lang('business.location')</th>
                    <th>@lang('business.state')</th>
                    <th>@lang('sale.product')</th>
                    <th>@lang('lang_v1.searched_for')</th>
                    <th>@lang('lang_v1.bounce_reason')</th>
                    <th>@lang('messages.date')</th>
                    <th>@lang('lang_v1.time')</th>
                    <th class="text-right">@lang('lang_v1.bounce_count')</th>
                    <th class="text-right">@lang('lang_v1.qty_at_the_time')</th>
                    <th class="text-right">@lang('lang_v1.estimated_lost_sales')</th>
                </tr></thead>
                <tbody>
                    @foreach($rows as $r)
                        <tr>
                            <td>{{ $r->business_name }}</td>
                            <td>{{ $r->location_name }}</td>
                            <td>{{ $r->state }}</td>
                            <td>{{ $r->product_name }}</td>
                            <td>{{ $r->search_term }}</td>
                            <td>
                                @if($r->bounce_type === 'out_of_stock')
                                    <span class="label label-danger">@lang('lang_v1.bounce_out_of_stock')</span>
                                @else
                                    <span class="label label-warning">@lang('lang_v1.bounce_not_listed')</span>
                                @endif
                            </td>
                            {{-- Date and time in separate columns so the log can be
                                 sorted or exported by either on its own. --}}
                            <td>{{ \Carbon::parse($r->bounced_at)->format('d M Y') }}</td>
                            <td>{{ \Carbon::parse($r->bounced_at)->format('H:i') }}</td>
                            <td class="text-right">{{ $r->bounce_count }}</td>
                            <td class="text-right">{{ @format_quantity($r->qty_available) }}</td>
                            <td class="text-right">@format_currency($r->bounce_count * $r->unit_price)</td>
                        </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
    @endcomponent
</section>
@endsection

@section('javascript')
<script type="text/javascript">
    $(document).ready(function () {
        $('#bounce_log_table').DataTable({ order: [] });
    });
</script>
@endsection