@extends('backend.layout.main')
@section('content')

    @if ($errors->has('title'))
        <div class="alert alert-danger alert-dismissible text-center">
            <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span
                    aria-hidden="true">&times;</span></button>{{ $errors->first('title') }}
        </div>
    @endif
    @if (session()->has('message'))
        <div class="alert alert-success alert-dismissible text-center">
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>{{ session()->get('message') }}
        </div>
    @endif
    @if (session()->has('not_permitted'))
        <div class="alert alert-danger alert-dismissible text-center">
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">&times;</span>
            </button>{{ session()->get('not_permitted') }}
        </div>
    @endif

    <section>
        <div class="container-fluid">
            <div style="border-radius: 30px;" class="card pb-4 ">
                <link rel="stylesheet" href="{{ asset('public/css/cloudma.css') }}">
                <div style="background: linear-gradient(to right, #00c1e3, #00489f); border-radius: 30px 30px 0px 0px; font-weight: bold; color: white;"
                    class="card-header mt-2">
                    <h3 class="text-center">Daily Sale Payment Report</h3>
                </div>

                <form action="{{ url('dailysalepaymentreportmodule') }}" method="GET">
                    <div class="row mr-1 mt-4 pl-4 align-items-center">
                        <div class="col-md-4">
                            <label><strong>Select Date</strong> &nbsp;</label>
                            <div class="input-group">
                                <input type="date" name="report_date" id="report_date"
                                    value="{{ request()->input('report_date', date('Y-m-d')) }}" class="form-control"
                                    required />
                            </div>
                        </div>
                        <div class="col-md-3 pt-md-4">
                            <button type="submit" class="btn btn-primary" id="generate-report-btn">Generate Report</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>

        <div class="container-fluid mt-4">
            <!-- අලුතෙන් දාපු Single Export Buttons ටික -->
            <div class="row mb-3">
                <div class="col-md-12 text-right">
                    <button class="btn btn-danger" onclick="exportFullReport('pdf')" style="border-radius: 10px;">
                        <i class="fa fa-file-pdf-o"></i> Export PDF
                    </button>
                    <button class="btn btn-success" onclick="exportFullReport('excel')" style="border-radius: 10px;">
                        <i class="dripicons-document-new"></i> Export Excel
                    </button>
                    <button class="btn btn-info" onclick="exportFullReport('csv')" style="border-radius: 10px;">
                        <i class="fa fa-file-text-o"></i> Export CSV
                    </button>
                    <button class="btn btn-secondary" onclick="window.print()" style="border-radius: 10px;">
                        <i class="fa fa-print"></i> Print Report
                    </button>
                </div>
            </div>

            <!-- Sales Table -->
            <h4 class="mb-3" style="color: #00489f; font-weight: bold;">Sales Table (Daily Sale)</h4>
            <div class="table-responsive">
                <table style="border-radius: 15px; background-color: #e0e5ea;" class="table table-hover table-bordered">
                    <thead
                        style="border-radius: 50px; background: linear-gradient(to right, #078bce, #1a1d1e); color: white;">
                        <tr>
                            <th>Date</th>
                            <th>Reference Number</th>
                            <th>Cashier</th>
                            <th>Customer</th>
                            <th>Grand Total</th>
                            <th>Cash</th>
                            <th>Card 1</th>
                            <th>Card 2</th>
                            <th>Card 3</th>
                            <th>Online Transfer</th>
                            <th>Link Pay</th>
                            <th>Due Amount</th>
                        </tr>
                    </thead>
                    <tbody>
                        @php
                            // යටින් පෙන්නන්න ඕන එකතුවට බින්දුවෙන් විචල්‍යයන් හදාගන්නවා
                            $tot_grand = 0;
                            $tot_cash = 0;
                            $tot_card1 = 0;
                            $tot_card2 = 0;
                            $tot_card3 = 0;
                            $tot_online = 0;
                            $tot_link = 0;
                            $tot_due = 0;
                        @endphp

                        @foreach ($sales_data as $sale)
                            <tr>
                                <td>{{ $sale->date }}</td>
                                <td>{{ $sale->reference_no }}</td>
                                <td>{{ $sale->cashier }}</td>
                                <td>{{ $sale->customer }}</td>
                                <td class="text-right">{{ number_format($sale->grand_total, 2) }}</td>
                                <td class="text-right">{{ number_format($sale->cash, 2) }}</td>
                                <td class="text-right">{{ number_format($sale->card1, 2) }}</td>
                                <td class="text-right">{{ number_format($sale->card2, 2) }}</td>
                                <td class="text-right">{{ number_format($sale->card3, 2) }}</td>
                                <td class="text-right">{{ number_format($sale->online_transfer, 2) }}</td>
                                <td class="text-right">{{ number_format($sale->link_pay, 2) }}</td>
                                <td class="text-right">{{ number_format($sale->due_amount, 2) }}</td>
                            </tr>

                            @php
                                // ටේබල් එක යටින් පෙන්වන්න ඔක්කොම එකතු කරනවා
                                $tot_grand += $sale->grand_total;
                                $tot_cash += $sale->cash;
                                $tot_card1 += $sale->card1;
                                $tot_card2 += $sale->card2;
                                $tot_card3 += $sale->card3;
                                $tot_online += $sale->online_transfer;
                                $tot_link += $sale->link_pay;
                                $tot_due += $sale->due_amount;
                            @endphp
                        @endforeach
                    </tbody>
                    <tfoot style="background-color: #cdd4da; font-weight: bold;">
                        <tr>
                            <td colspan="4" class="text-right">Total</td>
                            <td class="text-right">{{ number_format($tot_grand, 2) }}</td>
                            <td class="text-right">{{ number_format($tot_cash, 2) }}</td>
                            <td class="text-right">{{ number_format($tot_card1, 2) }}</td>
                            <td class="text-right">{{ number_format($tot_card2, 2) }}</td>
                            <td class="text-right">{{ number_format($tot_card3, 2) }}</td>
                            <td class="text-right">{{ number_format($tot_online, 2) }}</td>
                            <td class="text-right">{{ number_format($tot_link, 2) }}</td>
                            <td class="text-right">{{ number_format($tot_due, 2) }}</td>
                        </tr>
                    </tfoot>
                </table>
            </div>
        </div>

        <div class="container-fluid mt-5">
            <!-- Credit Sale Collections Table -->
            <h4 class="mb-3" style="color: #00489f; font-weight: bold;">Credit Sale Collections</h4>
            <div class="table-responsive">
                <table style="border-radius: 15px; background-color: #e0e5ea;" class="table table-hover table-bordered">
                    <thead
                        style="border-radius: 50px; background: linear-gradient(to right, #078bce, #1a1d1e); color: white;">
                        <tr>
                            <th>Original Bill Date</th>
                            <th>Reference Number</th>
                            <th>Cashier</th>
                            <th>Customer</th>
                            <th>Grand Total</th>
                            <th>Cash</th>
                            <th>Card 1</th>
                            <th>Card 2</th>
                            <th>Card 3</th>
                            <th>Online Transfer</th>
                            <th>Link Pay</th>
                        </tr>
                    </thead>
                    <tbody>
                        {{-- @foreach ($credit_data as $credit) --}}
                        <!-- Data rows will come here -->
                        {{-- @endforeach --}}
                    </tbody>
                    <tfoot style="background-color: #cdd4da; font-weight: bold;">
                        <tr>
                            <td colspan="4" class="text-right">Total</td>
                            <td>0.00</td>
                            <td>0.00</td>
                            <td>0.00</td>
                            <td>0.00</td>
                            <td>0.00</td>
                            <td>0.00</td>
                            <td>0.00</td>
                        </tr>
                    </tfoot>
                </table>
            </div>
        </div>

        <div class="container-fluid mt-5 mb-5">
            <!-- Payment Method Summary Table -->
            <h4 class="mb-3" style="color: #00489f; font-weight: bold;">Payment Method Summary</h4>
            <div class="table-responsive">
                <table style="border-radius: 15px; background-color: #e0e5ea; width: 60%;"
                    class="table table-hover table-bordered">
                    <thead
                        style="border-radius: 50px; background: linear-gradient(to right, #078bce, #1a1d1e); color: white;">
                        <tr>
                            <th>Payment Option</th>
                            <th>Sale Amount</th>
                            <th>Received Amount</th>
                            <th>Total Amount</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>Cash</td>
                            <td>0.00</td>
                            <td>0.00</td>
                            <td>0.00</td>
                        </tr>
                        <tr>
                            <td>Card 1</td>
                            <td>0.00</td>
                            <td>0.00</td>
                            <td>0.00</td>
                        </tr>
                        <tr>
                            <td>Card 2</td>
                            <td>0.00</td>
                            <td>0.00</td>
                            <td>0.00</td>
                        </tr>
                        <tr>
                            <td>Card 3</td>
                            <td>0.00</td>
                            <td>0.00</td>
                            <td>0.00</td>
                        </tr>
                        <tr>
                            <td>Online Transfer</td>
                            <td>0.00</td>
                            <td>0.00</td>
                            <td>0.00</td>
                        </tr>
                        <tr>
                            <td>Link Pay</td>
                            <td>0.00</td>
                            <td>0.00</td>
                            <td>0.00</td>
                        </tr>
                    </tbody>
                    <tfoot style="background-color: #cdd4da; font-weight: bold;">
                        <tr>
                            <td class="text-right">Grand Total</td>
                            <td>0.00</td>
                            <td>0.00</td>
                            <td>0.00</td>
                        </tr>
                    </tfoot>
                </table>
            </div>
        </div>
    </section>

    <style>
        .bootstrap-select.form-control,
        .form-control,
        .input-group-text {
            background-color: #fdfdff;
            border-color: #002250;
            border-radius: 15px;
        }

        .btn-primary {
            background-color: #002250;
            border-color: #002250;
            border-radius: 15px;
            padding: 10px 25px;
        }

        .btn-primary:hover {
            background-color: #0068e3;
        }

        table {
            border-collapse: collapse !important;
        }
    </style>

@endsection

@push('scripts')
    <script type="text/javascript">
        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });

        // මුළු රිපෝට් එකම එක්ස්පෝර්ට් කරන්න හදපු Function එක
        function exportFullReport(exportType) {
            var selectedDate = $('#report_date').val();

            // ඔයාගේ Controller එකේ export route එකට මේක හරවන්න ඕනේ.
            // උදාහරණයක් විදිහට: url('/dailysalepaymentreportmodule/export')
            var exportUrl = "{{ url('/dailysalepaymentreportmodule/export') }}" + "?date=" + selectedDate + "&type=" + exportType;

            window.location.href = exportUrl;
        }
    </script>
@endpush