@extends('layouts.app')

@section('contents')
    <div class="card">
        <div class="card-body border-bottom">
            {{ MyNotify::get() }}
            <form action="{{ url()->current() }}" method="get">
                <div class="form-group">
                    <label for="date1">จาก : </label>
                    <input type="date" name="date1" value="{{ $date1 }}">
                    <label for="date1">ถึง : </label>
                    <input type="date" name="date2" value="{{ $date2 }}">
                    <input type="submit" value="ค้นหา">
                </div>
            </form>
        </div>
        <div class="card-datatable table-responsive pt-0 container-fluid">
            <table id="dtable" class="table table-bordered table-hover table-striped">
                <thead>
                    <tr>
                        <th>#</th>
                        <th style="white-space:nowrap">วันที่/เวลา</th>
                        <th>สถานะ</th>
                        <th>ประเภท</th>
                        @if ($name !== 'expense')
                            <th>ลูกค้า</th>
                        @endif
                        <th>ธนาคาร</th>
                        <th>ยอดเงิน</th>
                        @if ($name !== 'expense')
                            <th>โปร</th>
                            <th>เครดิต</th>
                            <th>ก่อนทำ</th>
                            <th>หลังทำ</th>
                        @endif
                        <th>โดย</th>
                    </tr>
                </thead>
                <tbody>
                    @php($i = 1)
                    @foreach ($reports as $value)
                        <tr>
                            <td>{{ $i++ }}</td>
                            <td>{{ $value->created_at }}</td>
                            <td>
                                {!! App\Helpers\DoReport::reportStatus($value->status_id) !!}
                            </td>
                            <td>
                                @if ($value->qrCode)
                                    <a href="{{ url('qrcode/' . $value->id) }}">
                                        {!! App\Helpers\DoReport::reportType($value->type_id) !!}
                                        <br />
                                        <small>ดู qrcode</small>
                                    </a>
                                @else
                                    {!! App\Helpers\DoReport::reportType($value->type_id) !!}
                                @endif
                            </td>
                            @if ($name !== 'expense')
                                <td class="text-nowrap">
                                    <small>
                                        {{ $value->customer ? $value->customer->f_name . ' ' . $value->customer->l_name : '' }}
                                        <br />
                                        {{ $value->customer ? $value->customer->game_username : '' }}
                                    </small>
                                </td>
                            @endif
                            <td class="text-nowrap">
                                @if ($value->bankSys !== null)
                                    <img src="{{ asset('assets/css/th/' . strtolower($value->bankSys->bankList->bank_abbrev_en) . '.png') }}"
                                        width="20px" class="rounded mx-auto d-block" />
                                    <small>
                                        <p class="text-center">
                                            {{ $value->bankSys->bankList->bank_abbrev_en . ' : ' . $value->bankSys->bankList->bank_abbrev_th }}
                                            <br />
                                            {{ $value->bankSys->account_number }}
                                            -
                                            {{ $value->bankSys->name }}
                                        </p>
                                    </small>
                                @endif
                            </td>
                            <td>{{ $value->amount }} ({{ $value->bonus }})</td>
                            @if ($name !== 'expense')
                                <td>{{ $value->promotion ? $value->promotion->name : 'ไม่รับโปร (-)' }}</td>
                                <td>{{ $value->credit }}</td>
                                <td>{{ $value->before }}</td>
                                <td>{{ $value->after }}</td>
                            @endif
                            <td>{{ $value->user->name }}</td>
                        </tr>
                    @endforeach
                </tbody>
                <tfoot>
                    <tr>
                        <th>#</th>
                        <th style="white-space:nowrap">วันที่/เวลา</th>
                        <th>สถานะ</th>
                        <th>ประเภท</th>
                        @if ($name !== 'expense')
                            <th>ลูกค้า</th>
                        @endif
                        <th>ธนาคาร</th>
                        <th>ยอดเงิน</th>
                        @if ($name !== 'expense')
                            <th>โปร</th>
                            <th>เครดิต</th>
                            <th>ก่อนทำ</th>
                            <th>หลังทำ</th>
                        @endif
                        <th>โดย</th>
                    </tr>
                </tfoot>
            </table>
        </div>
    </div>
@endsection

@section('head.vendor.css')
    <link rel="stylesheet" type="text/css"
        href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/5.0.1/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.11.3/css/dataTables.bootstrap5.min.css">
@endsection

@section('page.js')
    <script src="https://code.jquery.com/jquery-3.5.1.js"></script>
    <script src="https://cdn.datatables.net/1.11.3/js/jquery.dataTables.min.js"></script>
    <script src="https://cdn.datatables.net/1.11.3/js/dataTables.bootstrap5.min.js"></script>
    <script>
        $(document).ready(function() {
            $('#dtable').DataTable();
        });
    </script>
@endsection