@extends('layouts.app')
@section('page-title')| {{__('label.reports')}}  @endsection
@section('css')

@endsection
<link href="{!! env('APP_ASSETS') !!}vendor_components/bootstrap-daterangepicker/daterangepicker.css" rel="stylesheet">
@php
    $resto = \App\Models\Restaurants::find(\App\Helpers\CommonMethods::getRestuarantID());

    $lang = $resto->default_lang;

    app()->setLocale($lang);
    if(session('app_lang') !==null){
    $lang = session('app_lang');
    app()->setLocale($lang);

    }
@endphp

@section('content')

    <!-- Content Wrapper. Contains page content -->
    <div class="content-wrapper">
        <div class="container-full">
            <!-- Main content -->
            <section class="content p-2">
                <div class="row">
                    <div class="col-md-6">
                        <div class="page-top-title">
                            <h3 class="title m-0">{{__('label.reports')}}</h3>
                            <p>Download relevant data about your business under several scopes. </p>

                        </div>
                    </div>
                </div>

                <div class="row p-0 m-0">
                    <div class="col-md-6">
                        <div class="card rounded">
                            <div class="card-header d-flex justify-content-between align-items-center">
                                <div>
                                    <h5>Order history</h5>
                                    <p>Get detailed information about your orders.</p>
                                </div>

                                <button type="button" class="btn btn-sm btn-primary create-report" data-section="order" data-title="Order history report">Generate Report</button>


                            </div>
                            <div class="card-body">
                                @if(isset($reports['orders']))
                                <ul class="list-group list-group-flush">
                                    @foreach($reports['orders'] as $report)
                                        <li class="list-group-item d-flex justify-content-between align-items-start">
                                            <div class="ms-2 me-auto">
                                                <div class="fw-bold">{!! $report['start_date'] !!} - {!! $report['end_date'] !!}</div>
                                                {!! $report['created_at'] !!}, {!! $report['searched_by'] !!}
                                            </div>
                                            <a href="{!! env('APP_URL') !!}public/uploads/report-files/{!! $resto->resto_unique_name !!}/orders/{!! $report['file_name'] !!}" download="orderhistory-{!! \Illuminate\Support\Str::slug($report['start_date']. $report['end_date']) !!}.xlsx" class="btn btn-primary btn-sm">
                                                <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 256 256"><path fill="currentColor" d="M228 152v56a20 20 0 0 1-20 20H48a20 20 0 0 1-20-20v-56a12 12 0 0 1 24 0v52h152v-52a12 12 0 0 1 24 0Zm-108.49 8.49a12 12 0 0 0 17 0l40-40a12 12 0 0 0-17-17L140 123V40a12 12 0 0 0-24 0v83l-19.51-19.49a12 12 0 0 0-17 17Z"/></svg>
                                            </a>
                                            <a href="#!" class="text-danger m-2 delete-report" data-id="{!! $report['id'] !!}">
                                                <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24"><path fill="currentColor" d="M7 21q-.825 0-1.413-.588T5 19V6q-.425 0-.713-.288T4 5q0-.425.288-.713T5 4h4q0-.425.288-.713T10 3h4q.425 0 .713.288T15 4h4q.425 0 .713.288T20 5q0 .425-.288.713T19 6v13q0 .825-.588 1.413T17 21H7ZM7 6v13h10V6H7Zm2 10q0 .425.288.713T10 17q.425 0 .713-.288T11 16V9q0-.425-.288-.713T10 8q-.425 0-.713.288T9 9v7Zm4 0q0 .425.288.713T14 17q.425 0 .713-.288T15 16V9q0-.425-.288-.713T14 8q-.425 0-.713.288T13 9v7ZM7 6v13V6Z"/></svg>
                                            </a>
                                        </li>
                                     @endforeach
                                </ul>
                                    @endif
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <div class="card rounded">
                            <div class="card-header d-flex justify-content-between align-items-center">
                                <div>
                                    <h5>Items Sale</h5>
                                    <p>Get detailed information about your orders.</p>
                                </div>

                                <button type="button" class="btn btn-sm btn-primary create-report" data-section="items" data-title="Items Sale">Generate Report</button>


                            </div>
                            <div class="card-body">
                                @if(isset($reports['items']))
                                    <ul class="list-group list-group-flush">
                                        @foreach($reports['items'] as $report)
                                            <li class="list-group-item d-flex justify-content-between align-items-start">
                                                <div class="ms-2 me-auto">
                                                    <div class="fw-bold">{!! $report['start_date'] !!} - {!! $report['end_date'] !!}</div>
                                                    {!! $report['created_at'] !!}, {!! $report['searched_by'] !!}
                                                </div>
                                                <a href="{!! env('APP_URL') !!}public/uploads/report-files/{!! $resto->resto_unique_name !!}/items-sale/{!! $report['file_name'] !!}" download="itemSale-{!! \Illuminate\Support\Str::slug($report['start_date']. $report['end_date']) !!}.xlsx" class="btn btn-primary btn-sm">
                                                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 256 256"><path fill="currentColor" d="M228 152v56a20 20 0 0 1-20 20H48a20 20 0 0 1-20-20v-56a12 12 0 0 1 24 0v52h152v-52a12 12 0 0 1 24 0Zm-108.49 8.49a12 12 0 0 0 17 0l40-40a12 12 0 0 0-17-17L140 123V40a12 12 0 0 0-24 0v83l-19.51-19.49a12 12 0 0 0-17 17Z"/></svg>
                                                </a>

                                                <a href="#!" class="text-danger m-2 delete-report" data-id="{!! $report['id'] !!}">
                                                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24"><path fill="currentColor" d="M7 21q-.825 0-1.413-.588T5 19V6q-.425 0-.713-.288T4 5q0-.425.288-.713T5 4h4q0-.425.288-.713T10 3h4q.425 0 .713.288T15 4h4q.425 0 .713.288T20 5q0 .425-.288.713T19 6v13q0 .825-.588 1.413T17 21H7ZM7 6v13h10V6H7Zm2 10q0 .425.288.713T10 17q.425 0 .713-.288T11 16V9q0-.425-.288-.713T10 8q-.425 0-.713.288T9 9v7Zm4 0q0 .425.288.713T14 17q.425 0 .713-.288T15 16V9q0-.425-.288-.713T14 8q-.425 0-.713.288T13 9v7ZM7 6v13V6Z"/></svg>
                                                </a>

                                            </li>
                                        @endforeach
                                    </ul>
                                @endif
                            </div>
                        </div>
                    </div>
                </div>

            </section>
            <!-- /.content -->
        </div>
    </div>
    <!-- /.content-wrapper -->


    <div class="modal" tabindex="-1" id="report-model">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="report-tile"></h5>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <p>You 'll download an excel file with selected date of ranges and it 'll also be listed on the report listing section.</p>
                    <form id="get-report-data" method="POST" action="{!! env('APP_URL') !!}download/report/data" enctype="multipart/form-data">
                        @csrf
                        <input type="hidden" name="report_type" />
                        <div class="form-group">
                            <label>Time frame</label>
                            <div id="reportrange" style="background: #fff; cursor: pointer; padding: 5px 10px; border: 1px solid #ccc; width: 100%">
                                <i class="fa fa-calendar"></i>&nbsp;
                                <span></span> <i class="fa fa-caret-down"></i>
                            </div>
                        </div>
                    </form>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
                    <button type="button" class="btn btn-primary generate-report">Create Report</button>
                </div>
            </div>
        </div>
    </div>

@endsection

@section('js')
    <script type="text/javascript" src="{!! env('APP_ASSETS') !!}vendor_components/bootstrap-daterangepicker/daterangepicker.min.js"></script>
    <script>
        $(function () {

            $("body").on("click",".delete-report",function(){
                var _id = $(this).data('id');
                var _this = $(this);
                //

                swal({
                        title: " Confirm?",
                        text: "Do you want delete?",
                        type: "error",
                        showCancelButton: true,
                        confirmButtonClass: "btn-danger",
                        confirmButtonText: " Confirm, delete it!",
                        cancelButtonText: "No, cancel please!",
                        closeOnConfirm: true,
                        closeOnCancel: true
                    },
                    function(isConfirm) {
                        if (isConfirm) {
                            $.ajax({
                                url:'{!! env('APP_URL') !!}report/delete/'+_id,

                                success:function (response) {
                                    $.toast({
                                        heading: 'Report Status',
                                        text: 'Report is delete successfully.',
                                        position: 'top-right',
                                        loaderBg: '#ff6849',
                                        icon: 'success',
                                        hideAfter: 3000,
                                        stack: 1
                                    });
                                    _this.parents('.list-group-item').remove();
                                }

                            });
                        }
                    });

              //  alert(_id);
            });

            $("body").on("click",".generate-report",function(){
                var start_date = $('#reportrange').data('daterangepicker').startDate;
               var s_date =  moment(start_date).format("YYYY-MM-DD");
                var end_date = $('#reportrange').data('daterangepicker').endDate;
                var e_date =  moment(end_date).format("YYYY-MM-DD");
                var _type =  $("input[name=report_type]").val();

                var url = "{!! env('APP_URL') !!}download/order/history";

                if(_type=="items")
                    url = "{!! env('APP_URL') !!}item/sales/count";
               $.ajax({
                   url:url,
                   type:"POST",
                   data:{
                       '_token':"{!! csrf_token() !!}",
                       start_date:s_date,
                       end_date:e_date,
                       restoName:"{!! $resto->resto_unique_name !!}"
                   },
                   success:function(response){
                        location.reload();
                   }
               });
            });

            $("body").on("click",".create-report",function(){
                var _title = $(this).data('title');
                var _section = $(this).data('section');
                $("#report-tile").html(_title);
                $("input[name=report_type]").val(_section);
                $("#report-model").modal('show');
            });

            var start = moment().subtract(29, 'days');
            var end = moment();



            $('#reportrange').daterangepicker({
                startDate: start,
                endDate: end,
                ranges: {
                    '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')]
                }
            }, cb);

            cb(start, end);

        });
        function cb(start, end) {
            $('#reportrange span').html(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'));
          //  alert(start.format('MMMM D, YYYY') + ' - ' + end.format('MMMM D, YYYY'));
        }
    </script>
@endsection