@extends('app-new')
@push('head-script')
    <link rel="stylesheet" type="text/css" href="/app-assets/vendors/css/tables/datatable/dataTables.bootstrap5.min.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/vendors/css/tables/datatable/responsive.bootstrap5.min.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/css/components.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/vendors/css/vendors.min.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/vendors/css/extensions/toastr.min.css">

    <!-- BEGIN: Page CSS-->
    <link rel="stylesheet" type="text/css" href="/app-assets/css/core/menu/menu-types/vertical-menu.css">
    <link rel="stylesheet" type="text/css" href="/app-assets/css/plugins/forms/pickers/form-flat-pickr.css">
    <!-- END: Page CSS-->
@endpush

@push('content-header')
    <div class="row breadcrumbs-top">
        <div class="col-12">
            <h2 class="content-header-title float-start mb-0">Contractor Invoice</h2>
            <div class="breadcrumb-wrapper">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="/{!! $alias !!}/home">{{ trans('common/common.home') }}</a>
                    </li>
                    <li class="breadcrumb-item active">Contractor Invoice
                    </li>
                </ol>
            </div>
        </div>
    </div>
@endpush
@section('content')
    <section id="dashboard-ecommerce">
        <div class="row match-height">
            <!-- Statistics Card -->
            <div class="col-xl-12 col-md-12 col-12">
                <div class="card card-statistics">
                    <div class="card-body statistics-body">
                        <form>
                            <div class="row">
                                <div class="col-md-12">
                                    <div class="row d-flex align-items-end">
                                        <div class="col-md-2">
                                            <label class="form-label"
                                                for="year">{{ trans('admin/template.year') }}</label>
                                            <select class="form-control mb-2 select2" name="year" id="year">
                                                @foreach ($years as $val)
                                                    <option class="form-control" value="{{ $val }}"
                                                        @if ($val == $year) selected @endif>
                                                        {{ $val }}</option>
                                                @endforeach
                                            </select>
                                        </div>

                                        <div class="col-md-2">
                                            <label class="form-label"
                                                for="area_id">{{ trans('admin/template.month') }}</label>
                                            <select class="form-control mb-2 select2" name="month" id="month">
                                                @foreach ($months as $key => $val)
                                                    <option class="form-control" value="{{ $key }}"
                                                        @if ($key == $month) selected @endif>
                                                        {{ $val }}</option>
                                                @endforeach
                                            </select>
                                        </div>

                                        <div class="col-md-3">
                                            <label class="form-label"
                                                for="basicSelect">{{ trans('common/filter.contractor') }}</label>
                                            <select class="form-control select2" id="contractor_id" name="contractor_id">
                                                <option value="">{{ trans('common/filter.contractor') }}</option>
                                                @foreach ($contractors as $contractor)
                                                    <option value="{{ $contractor->id }}"
                                                        @if (request()->contractor_id == $contractor->id) selected @endif>
                                                        {{ $contractor->name }}
                                                    </option>
                                                @endforeach
                                            </select>
                                        </div>

                                        <div class="col-md-2">
                                            <button class="btn btn-primary w-100 waves-effect waves-float waves-light">
                                                View Invoices
                                            </button>
                                        </div>

                                        @if (request()->contractor_id && !$invoices->where('status', 'active')->count())
                                            <div class="col-md-2">
                                                <button name="generate_new" value="1"
                                                    class="btn btn-warning w-100 waves-effect waves-float waves-light">
                                                    Generate
                                                </button>
                                            </div>
                                        @endif

                                        <div class="col-md-12 mt-2">
                                            <div class="table-responsive">
                                                <table class="table mt-2">
                                                    <thead>
                                                        <th>Invoice Number</th>
                                                        <th>Invoice Date</th>
                                                        <th>Invoice Amount</th>
                                                        <th>Status</th>
                                                        <th>{{ trans('master/master.action') }}</th>
                                                    </thead>
                                                    <tbody>
                                                        @if (count($invoices))
                                                            @foreach ($invoices as $invoice)
                                                                <tr>
                                                                    <td>
                                                                        {{ $invoice->invoice_number }}
                                                                    </td>
                                                                    <td>
                                                                        {{ date('Y-m-d', strtotime($invoice->created_at)) }}
                                                                    </td>
                                                                    <td>
                                                                        {{ round($invoice->invoice_amount, 2) }}
                                                                    </td>
                                                                    <td>
                                                                        {{ $invoice->status }}
                                                                    </td>

                                                                    <td>
                                                                        <div class="mb-1">
                                                                            <a class="pe-1 dropdown-toggle hide-arrow text-primary"
                                                                                data-bs-toggle="dropdown">
                                                                                <i data-feather="more-vertical"
                                                                                    class="font-small-4"></i>
                                                                            </a>
                                                                            <div class="dropdown-menu dropdown-menu-end">
                                                                                <a class="dropdown-item"
                                                                                    href="{{ $orgUrl }}/contractor-invoice/pdf/{{ $invoice->id }}"
                                                                                    target="_blank"><i data-feather="eye"
                                                                                        class="font-4"
                                                                                        aria-hidden="true"></i><span
                                                                                        class="align-middle">
                                                                                        View</span></a>
                                                                                @if ($invoice->status == 'active')
                                                                                    <a class="dropdown-item edit-invoice"
                                                                                        href="javascript:void(0);"
                                                                                        data-url="{{ $orgUrl }}/contractor-invoices/{{ $invoice->id }}">
                                                                                        <i data-feather="edit"
                                                                                            class="font-4"
                                                                                            aria-hidden="true"></i>
                                                                                        <span class="align-middle">
                                                                                            Modify</span>
                                                                                    </a>
                                                                                    <a class="dropdown-item"
                                                                                        href="javascript:void(0);"
                                                                                        data-request="remove"
                                                                                        data-url="{{ $orgUrl }}/contractor-invoice/{{ $invoice->id }}/update-status"
                                                                                        data-message="Are you sure you want to cancel this invoice ?">
                                                                                        <i data-feather="trash"
                                                                                            class="font-4"
                                                                                            aria-hidden="true"></i>
                                                                                        <span class="align-middle">
                                                                                            Cancel</span>
                                                                                    </a>
                                                                                @endif
                                                                            </div>
                                                                        </div>
                                                                    </td>
                                                                </tr>
                                                            @endforeach
                                                        @else
                                                            <tr>
                                                                <td colspan="100%" class="text-center">No Invoices Found
                                                                </td>
                                                            </tr>
                                                        @endif
                                                    </tbody>
                                                </table>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- Dashboard Ecommerce ends -->
@endsection
@push('footer-script')
    <!-- BEGIN: Page Vendor JS-->
    <script src="/app-assets/vendors/js/tables/datatable/jquery.dataTables.min.js"></script>
    <script src="/app-assets/vendors/js/tables/datatable/dataTables.bootstrap5.min.js"></script>
    <script src="/app-assets/vendors/js/tables/datatable/dataTables.responsive.min.js"></script>
    <script src="/app-assets/vendors/js/tables/datatable/responsive.bootstrap5.js"></script>
    <script src="/app-assets/vendors/js/pickers/flatpickr/flatpickr.min.js"></script>
    <script src="/app-assets/js/scripts/ui/ui-feather.js"></script>

    <script src="/app-assets/vendors/js/tables/datatable/datatables.checkboxes.min.js"></script>
    <script src="/app-assets/vendors/js/tables/datatable/datatables.buttons.min.js"></script>
    <script src="/app-assets/vendors/js/tables/datatable/jszip.min.js"></script>
    <script src="/app-assets/vendors/js/tables/datatable/pdfmake.min.js"></script>
    <script src="/app-assets/vendors/js/tables/datatable/vfs_fonts.js"></script>
    <script src="/app-assets/vendors/js/tables/datatable/buttons.html5.min.js"></script>
    <script src="/app-assets/vendors/js/tables/datatable/buttons.print.min.js"></script>
    <script src="/app-assets/vendors/js/tables/datatable/dataTables.rowGroup.min.js"></script>
    <!-- END: Page Vendor JS-->
    <script src="/app-assets/vendors/js/extensions/toastr.min.js"></script>
    <script type="text/javascript" src="/assets/js/moment.min.js"></script>
    <script type="text/javascript" src="/assets/js/daterangepicker.js"></script>
    <link rel="stylesheet" type="text/css" href="/assets/css/daterangepicker.css" />

    <script src="/app-assets/vendors/js/forms/wizard/bs-stepper.min.js"></script>
    <script src="/app-assets/vendors/js/forms/select/select2.full.min.js"></script>
    <script src="/app-assets/js/scripts/forms/form-wizard.js"></script>
    <script src="{{ asset('js/common-script.js') }}"></script>

    <!-- BEGIN: Page JS-->
    <!-- END: Page JS-->
    <script>
        $(window).on('load', function() {
            if (feather) {
                feather.replace({
                    width: 14,
                    height: 14
                });
            }
        });

        $('.edit-invoice').click(function() {
            let url = $(this).data('url');

            Swal.fire({
                title: "@lang('messages.sweetAlertTitle')",
                text: "Enter Invoice Number",
                input: 'text',
                icon: "warning",
                showCancelButton: true,
                confirmButtonColor: "#DD6B55",
                confirmButtonText: "@lang('messages.deleteConfirmation')",
                cancelButtonText: "@lang('messages.confirmNoArchive')",
                preConfirm: (value) => {
                    if (!value) {
                        $("body .swal2-input").after(
                            `<span class="text-danger" style="margin-left: 28px;">Please fill Invoice Number</span>`
                        );
                        return false; // Prevent confirmed
                    }
                },
            }).then(function(data) {
                if (data?.value) {

                    var token = "{{ csrf_token() }}";

                    $.ajax({
                        type: 'POST',
                        url: url,
                        data: {
                            '_token': token,
                            '_method': 'PUT',
                            'invoice_number': data?.value
                        },
                        success: function(response) {
                            Swal.fire({
                                title: "Success",
                                text: response.message,
                                icon: "success",
                                confirmButtonColor: "#00c292",
                                confirmButtonText: "Ok",
                                closeOnConfirm: true
                            });
                            setTimeout(() => {
                                location.reload();
                            }, 2000);

                        }
                    });
                }
            });
        })
    </script>
@endpush