@extends('layouts.master')
@section('meta')
<meta name="csrf-token" content="{{ csrf_token() }}">
@stop
@section('content')
<div class="col-lg-12 grid-margin stretch-card" style="min-height: 80vh;">
    <div class="card">
        <div class="card-body">
            <div class="page-header">
                <h3 class="page-title">Customer Report: Last Order Over A Month Ago</h3>
                <nav aria-label="breadcrumb">
                    <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="{{route('home')}}">Dashboard</a></li>
                    <li class="breadcrumb-item active" aria-current="page">Customer Report 1</li>
                    </ol>
                </nav>
            </div>
            <div class="col-lg-12 d-flex flex-row justify-content-between p-2">
                <div>
                    <form class="d-flex" method="GET" action="{{ route('reports.lastorderovermonthago') }}">
                        <input class="me-2" name="query" type="search" placeholder="Search" aria-label="Search">
                        <button class="btn btn-outline-primary" type="submit">Search</button>
                    </form>
                </div>
                <!-- <div><button type="button" class="btn btn-primary manage-blog"  data-url="{{ route('blogs.store') }}" data-mode="add">Add New Blog</button></div> -->
            </div>
            <table class="table table-striped">
                <thead>
                    <tr>
                        <th> Customer Name </th>
                        <th> Phone Number </th>
                        <th> Email </th>
                        <th> Last Order </th>
                        <th> Last Order Date </th>
                    </tr>
                </thead>
                <tbody>
                    @foreach($report as $row)
                    <tr>
                        <td> <a href="{{ route('customers.edit', $row->id) }}">{{ $row->name }}</a> </td>
                        <td> {{ $row->phone_number }} </td>
                        <td> {{ $row->email }} </td>
                        <td> {{ $row->order_no }} </td>
                        <td> {{date("d M, Y h:i a", strtotime($row->last_order_date))}} </td>
                    </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
    </div>
</div>
@stop


@section('scripts')
<script src="https://cdn.tiny.cloud/1/kbhqd8olesnqncdmboouwnywrhurhtm4rgb2e3uj3iz2vmv5/tinymce/6/tinymce.min.js" referrerpolicy="origin"></script>
<script>
    (function($) {
        'use strict';

        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });

        $('.manage-blog').on('click', function(e) {
            var mode = $(this).data('mode');
            var action = $(this).data('url');
            var idval = $(this).data('id');
            var method = "";

            $('#id').val(idval);
            if(mode == 'add') {
                $('#manageBlog').find('.modal-title').text("Create Blog");
                method = 'POST';
            } else {
                $('#manageBlog').find('.modal-title').text("Edit Blog");
                method = 'POST';
            }

            $('#manageBlog').find('form').attr('action', action);
            $('#manageBlog').find('form').attr('method', method);

            // Show the modal
            $('#manageBlog').modal('show');
        });

        $('#error').hide();
        $('#blog-form').submit(function(e) {
            e.preventDefault();
            const editor = tinymce.get('body');
            var url = $('#manageBlog').find('form').attr('action');
            var method = $('#manageBlog').find('form').attr('method');
            $('#manageBlog').find('form').find('#body').text(editor.getContent());
            var formData = new FormData(this);
            $.ajax({
                url: url,
                type: method,
                data: formData,
                dataType: 'json',
                processData: false,
                contentType: false,
                success: function(response) {
                    $('#manageBlog').modal('toggle');
                    showSwal('success-message', "Successfully created", true);
                    // console.log(response.message);
                    // Perform any further actions or show success message
                },
                error: function(response) {
                    $('#error').text(response.responseJSON.message).show();
                    console.log(response.responseJSON);
                    // console.log(response.responseJSON.errors);
                    // Display validation errors or perform error handling
                }
            });
        });

        $('#manageBlog').on('show.bs.modal', function() {
            const editor = tinymce.get('body');
            var id = $('#id').val();
            var url = $('#manageBlog').find('form').attr('action');
            $('#manageBlog').find('form').find('#title').val("");
            $('#manageBlog').find('form').find('#category').val("");
            $('#manageBlog').find('form').find('#author').val("");
            $('#manageBlog').find('form').find('#status').prop("checked", true);
            editor.setContent("");
            if(id > 0) {
                $.ajax({
                url: url,
                type: 'GET',
                dataType: 'json',
                success: function(response) {
                    $('#manageBlog').find('form').find('#title').val(response.title);
                    $('#manageBlog').find('form').find('#category').val(response.category);
                    $('#manageBlog').find('form').find('#author').val(response.author);
                    $('#manageBlog').find('form').find('#status').prop("checked", response.status);
                    // $('#manageBlog').find('form').find('#content').text('<h1>idsdkhksdhf</h1>');
                    if (editor) {
                        editor.setContent(response.body); // Set the retrieved content to the editor
                    }
                },
                error: function(response) {

                }
            });
            }
        });

        $('.delete-blog').on('click', function(e) {
            var url = $(this).data('url');
            confirm("Are you sure you want to delete this Blog?", url);
        });

        tinymce.init({
            selector: '.tinymce-editor',
            plugins: 'anchor autolink link lists',
            toolbar: 'undo redo | blocks fontfamily fontsize | bold italic underline strikethrough | link | align lineheight | checklist numlist bullist indent outdent',
        });
    })(jQuery);
</script>
@stop