@extends('layouts.admin')

@section('title', 'Voucher List')
@section('content-header', 'Voucher List')
@section('content-actions')


    @section('content')
        <div class="card">
            <div class="card-body">
                @php
                    $i = 0;
                    $k = 0;
                    $today = date("Y-m-d");
                @endphp
                <table class="table" id="example1">
                    <thead>
                    <tr>
                        <th>Voucher No.</th>
                        <th>Security No.</th>
                        <th>Amt (RM)</th>
                        <th>Expiry Date</th>
                        <th>Used</th>
                        <th>Used Date</th>
                        <th>Used Outlet</th>
                        <th>Counter No.</th>
                        <th>Transaction No.</th>
                        <th>Action</th>
                    </tr>
                    </thead>
                    <tbody>
                    @foreach($vou as $key)
                        <tr>
                            <th>{{$key->voucher_code}}</th>
                            <th>{{$key->security_code}}</th>
                            <th>{{$key->voucher_amt}}</th>
                            <th>{{$key->exp_date}}</th>
                            <th>{{$key->used_flag}}</th>
                            <th>{{$key->tran_date}}</th>
                            <th>{{$key->oid}}</th>
                            <th>{{$key->reg}}</th>
                            <th>{{$key->tran_no}}</th>
                            @if ($key->used_flag == 0)
                                <th>
                                    <a href="{{ route('vouchers.QRPrint', $key->voucher_code) }}" style="margin:4px;" class="btn btn-primary float-right" id="printBtn" target="_blank">Print Voucher</a>
                                </th>
                            @elseif ($key->exp_date < $today)
                                <th>
                                    <a href="javascript:void(0)" style="margin: 4px;" class="btn btn-secondary float-right" disabled>Voucher Expired</a>
                                </th>
                            @else
                                <th>
                                    <button class="btn btn-primary float-right" data-url="{{ route('vouchers.reactivate_voucher', $key->voucher_code) }}" id="Reactivate">Reactivate Voucher</button>
                                </th>
                            @endif
                        </tr>
                        @php
                            $i++;
                          if($key->used_flag == '1'){
                            $k++;
                          }
                        @endphp
                    @endforeach
                    </tbody>
                    <tfoot>
                    <tr>
                        <th>Total Voucher</th>
                        <th></th>
                        <th></th>

                        <th>{{$i}}</th>


                    </tr>
                    <tr>
                        <th>Total Used Voucher</th>
                        <th></th>
                        <th></th>

                        <th>{{$k}}</th>


                    </tr>
                    </tfoot>
                </table>
            </div>
        </div>
    @endsection
    @section('js')
        <!-- DataTables  & Plugins -->
        <script src="https://cdnjs.cloudflare.com/ajax/libs/limonte-sweetalert2/11.7.5/sweetalert2.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
        <script src="//cdn.datatables.net/1.10.20/js/jquery.dataTables.min.js"></script>
        <script src="//cdn.datatables.net/buttons/1.6.1/js/dataTables.buttons.min.js"></script>
        <script src="//cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js"></script>
        <script src="//cdn.datatables.net/buttons/1.6.1/js/buttons.html5.min.js"></script>
        <link href="//cdn.datatables.net/1.10.20/css/jquery.dataTables.min.css" rel="stylesheet"/>
        <script>

            $(document).ready(function () {
                $(document).on('click', '#Reactivate', function () {
                    const url = $(this).data('url');
                    const swalWithBootstrapButtons = Swal.mixin({
                        customClass: {
                            confirmButton: 'btn btn-success',
                            cancelButton: 'btn btn-danger'
                        },
                        buttonsStyling: false
                    })

                    // Show Swal confirmation dialog
                    swalWithBootstrapButtons.fire({
                        title: 'Are you sure?',
                        text: 'Do you really want to reactivate this voucher?',
                        icon: 'warning',
                        showCancelButton: true,
                        confirmButtonText: 'Yes, reactivate it!',
                        cancelButtonText: 'No',
                        reverseButtons: true
                    }).then((result) => {
                        // If user confirms
                        if (result.isConfirmed) {
                            // Proceed with reactivation
                            window.location.href = url;
                        }
                    });

                })
            })

            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });
            $(function () {
                $('#example1').DataTable({
                    dom: 'Bfrtip',
                    buttons: [
                        {
                            extend: 'excel',
                            footer: true,
                            customize: (xlsx, config, dataTable) => {
                                let sheet = xlsx.xl.worksheets['sheet1.xml'];
                                let footerIndex = $('sheetData row', sheet).length;
                                let $footerRows = $('tr', dataTable.footer());

                                // If there are more than one footer rows
                                if ($footerRows.length > 1) {
                                    // First header row is already present, so we start from the second row (i = 1)
                                    for (let i = 1; i < $footerRows.length; i++) {
                                        // Get the current footer row
                                        let $footerRow = $footerRows[i];

                                        // Get footer row columns
                                        let $footerRowCols = $('th', $footerRow);

                                        // Increment the last row index
                                        footerIndex++;

                                        // Create the new header row XML using footerIndex and append it at sheetData
                                        $('sheetData', sheet).append(`
                                        <row r="${footerIndex}">
                                          ${$footerRowCols.map((index, el) => `
                                            <c t="inlineStr" r="${String.fromCharCode(65 + index)}${footerIndex}" s="2">
                                              <is>
                                                <t xml:space="default">${$(el).text()}</t>
                                              </is>
                                            </c>
                                          `).get().join('')}
                                        </row>
                                      `);
                                    }
                                }
                            }
                        }
                    ]
                });
            });

        </script>
    @endsection