@extends('layouts.master')

@section('page_title', 'Product Sale Report')
@section('title', 'Product Sale Report')
@section('main_item', 'Reports')
@section('sub_item', 'Product Sale Report')

@section('content')
    <div class="col-12">
        <div class="card">
            <div id="accordion">
                <div class="border-bottom card-header" style="background-color: white; cursor: pointer;" data-toggle="collapse"
                    data-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
                    <h4 class="mb-0 header-title">
                        Filter
                    </h4>
                </div>
                <div id="collapseOne" class="collapse show mt-3" aria-labelledby="headingOne" data-parent="#accordion">
                    <div class="card-body">
                        <form action="{{ url('product/sale/report') }}" method="get" id="filter_form">
                            <div class="row">
                                <div class="col-md-3">
                                    <div class="form-group">
                                        <label style="font-weight: bold" for="product">Product</label>
                                        <select class="form-control select2" id="product_id" name="product_id">
                                            <option value="" selected>All</option>
                                            @foreach ($products as $product)
                                                <option value="{{ $product->id }}"
                                                    @if (request('product_id') == $product->id) selected @endif>
                                                    {{ $product->product_name }}
                                                    |
                                                    {{ $product->sku }}
                                                    @if (!empty($product->attribute_value))
                                                        ({{ $product->attribute_value }})
                                                    @endif
                                                </option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                                <div class="col-md-3">
                                    <div class="form-group">
                                        <label style="font-weight: bold" for="reportrange"> Date </label>
                                        <div class="input-group">
                                            <input type="text" class="form-control" name="dates" id="reportrange"
                                                value="{{ request('dates') }}" readonly>
                                            <div class="input-group-append">
                                                <span class="input-group-text"><i class="dripicons-calendar"></i></span>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-3">
                                    <div class="form-group">
                                        <label style="font-weight: bold" for="supplier">Clickom User</label>
                                        <select class="form-control select2" id="user_id" name="user_id">
                                            <option value="">All</option>
                                            @foreach ($users as $user)
                                                <option value="{{ $user->id }}"
                                                    @if (request('user_id') == $user->id) selected @endif>
                                                    {{ $user->username }}
                                                </option>
                                            @endforeach
                                        </select>
                                    </div>
                                </div>
                                <div class="col-md-3">
                                    <div class="search">
                                        <label style="font-weight: bold" for="contact_id">Customer Name</label>
                                        <div class="form-group">
                                            <input id="customer_name" name="customer_name" type="text"
                                                class="form-control" placeholder="Search for Customer Name.."
                                                aria-label="Search for..." value="{{ request('customer_name') }}">
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-3">
                                    <div class="form-group">
                                        <label style="font-weight: bold" for="waybill_id">Order ID</label>
                                        <input id="invoice_no" name="invoice_no" type="text" class="form-control"
                                            placeholder="Search for..." aria-label="Search for..."
                                            value="{{ request('invoice_no') }}">
                                    </div>
                                </div>
                                <div class="col-md-3">
                                    <div class="form-group">
                                        <label style="font-weight: bold" for="supplier">Delivery Status</label>
                                        <select class="form-control select2" id="status" name="status">
                                            <option value="">All</option>

                                            <option value="delivered" @if (request('status') == 'delivered') selected @endif>
                                                Delivered
                                            </option>
                                            <option value="returned" @if (request('status') == 'returned') selected @endif>
                                                Returned
                                            </option>
                                        </select>
                                    </div>
                                </div>
                            </div>
                            <div>
                                <button type="submit" class="btn btn-primary px-5 py-2 submit-filters" id="btn-search"
                                    data-type="table">Filter</button>
                                <a href="{{ url('product/sale/report') }}" class="btn btn-danger px-5 py-2">Reset</a>
                            </div>
                            <div>
                                <a href="{{ url('product/sale/report') }}"
                                    class="btn btn-primary float-right px-5 py-2 submit-filters" data-type="excel">Download
                                    Excel</a>
                                <span id="btn_print">
                                    <button type="button" id="print" class="btn btn-primary float-right px-5 py-2"
                                        style="margin-left: 155px; position: relative;">Print</button></span>
                                <input type="hidden" name="data_type" id="data_type" value="">
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="col-12" id="print_ariea">
        <div class="card">
            <div class="card-body">
                <div class="table-responsive dash-social">
                    <table id="laravel_datatable_product_sale" class="table table-hover">
                        <thead class="thead-dark">
                            <tr>
                                <th>Product Name</th>
                                <th>SKU</th>
                                <th>Customer Name</th>
                                <th>Order ID</th>
                                <th>Sale Date</th>
                                <th>Clickom User</th>
                                <th>Quantity</th>
                                <th>Selling Price</th>
                                <th> Discount</th>
                                <th>Total</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach ($product_sales as $product_sale)
                                <tr>
                                    <td>
                                        @if (!empty($product_sale->attribute_value))
                                            {{ $product_sale->product_name . ' | ' . $product_sale->attribute_value }}
                                        @else
                                            {{ $product_sale->product_name }}
                                        @endif
                                    </td>
                                    <td>
                                        {{ $product_sale->sku }}
                                    </td>
                                    <td>
                                        <span>{{ $product_sale->customer->name }}</span>
                                    </td>
                                    <td>
                                        {{ $product_sale->invoice_no }}
                                    </td>
                                    <td>
                                        {{ Carbon\Carbon::parse($product_sale->sale_date)->toDateString() }}
                                    </td>
                                    <td>
                                        {{ $product_sale->name }}
                                    </td>
                                    <td>{{ $product_sale->qty }}</td>
                                    <td>
                                        {{ number_format($product_sale->sale_unit_price, 2) }}
                                    </td>
                                    <td>
                                        {{ number_format($product_sale->invoice_discount, 2) }}
                                    </td>
                                    <td>
                                        {{ number_format($product_sale->sale_unit_price * $product_sale->qty - $product_sale->invoice_discount, 2) }}
                                    </td>
                                </tr>
                            @endforeach
                        </tbody>
                        <tfoot style="background:rgb(232, 232, 232);">
                            <tr>
                                <td colspan="6"></td>
                                <td id="total_qty"></td>
                                <td colspan="3"></td>
                            </tr>
                        </tfoot>
                    </table>
                    <div class="d-flex justify-content-end" style="margin-top: 30px;">
                        {{ $product_sales->appends($_GET)->links() }}
                    </div>
                    <div>
                        <span style="font-weight: bold">Total Count&nbsp;&nbsp;
                            {{ $count }}
                        </span>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection
@section('scripts')
    <script>
        //    $(document).ready(function() {
        //     // Function to calculate the sum of a column
        //     columnIndex = 7;
        //     function calculateColumnSum(columnIndex) {
        //         var sum = 0;
        //         $('#laravel_datatable_product_sale tbody tr').each(function() {
        //             var cellValue = $(this).find('td:eq(' + columnIndex + ')').text();
        //             if ((cellValue)) {
        //                 sum += parseFloat(cellValue);
        //             }
        //         });
        //         return sum;
        //     }
        //     var sumOfColumn7 = calculateColumnSum(7);
        //     var sumOfColumn7 = sumOfColumn7.toLocaleString();
        //     $('#total_qty').text(sumOfColumn7);
        //     console.log('Sum of Column 2:', sumOfColumn7);
        // });

        $(document).on('click', '.submit-filters', function(e) {
            e.preventDefault()
            let data_type = $(this).data('type');
            $('#data_type').val(data_type);
            $('#filter_form').submit();
        });
         $(document).on('click', '#print', function() {
            let printContents = document.getElementById('print_ariea').innerHTML;
            let originalContents = document.body.innerHTML;

            $('#btn_print').hide(); // hide button before printing

            document.body.innerHTML = printContents;
            window.print();
            document.body.innerHTML = originalContents;

            location.reload(); // reload to re-bind events and restore state
        });
        $(document).ready(function() {
            var getUrlParameter = function getUrlParameter(sParam) {
                var sPageURL = decodeURIComponent(window.location.search.substring(1)),
                    sURLVariables = sPageURL.split('&'),
                    sParameterName,
                    i;
                for (i = 0; i < sURLVariables.length; i++) {
                    sParameterName = sURLVariables[i].split('=');

                    if (sParameterName[0] === sParam) {
                        return sParameterName[1] === undefined ? true : sParameterName[1];
                    }
                }
            };
            var report_date = getUrlParameter('dates');
            myString = report_date.split('+-+').join('/');
            var result = myString.split('/');
            $('#reportrange').daterangepicker({
                startDate: result[0],
                endDate: result[1],
                ranges: {
                    'All Data': ['2020-01-01', moment()],
                    'Today': [moment(), moment()],
                    'Yesterday': [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
                    'Last 7 Days': [moment().subtract(6, 'days'), moment()],
                    'Last 30 Days': [moment().subtract(29, 'days'), moment()],
                    'This Month': [moment().startOf('month'), moment().endOf('month')],
                    'Last Month': [moment().subtract(1, 'month').startOf('month'), moment().subtract(1,
                        'month').endOf('month')]
                },
                locale: {
                    format: 'Y-M-DD'
                }
            });
        });
    </script>

@endsection