@extends('layouts.app')
@section('content')
    @include('includes.bread_crumb_with_header', [
        'header' => 'WholeSale Request',
        'bread_crumbs' => ['Home' => ''],
    ])
    <div id="kt_app_content_container" class="app-container ">
        <!--begin::Inbox App - Messages -->
        <div class="d-flex flex-column flex-lg-row">
            <!--begin::Content-->
            <div class="flex-lg-row-fluid ms-lg-7 ms-xl-2">
                <!--begin::Card-->
                <div class="card">
                    <div class="card-body p-0">
                        <!--begin::Table-->
                        <div id="kt_inbox_listing_wrapper" class="dataTables_wrapper dt-bootstrap4 no-footer">
                            <div class="table-responsive">
                                @if (Count($wholesaleRequests) > 0)
                                    <table
                                        class="table table-striped table-hover table-row-bordered fs-6 gy-5 my-0 no-footer"
                                        id="kt_inbox_listing">
                                        <!--begin::Table body-->
                                        {{-- @foreach ($tickets as $ticket) --}}
                                        <thead>
                                            <th class="fw-bold">Date</th>
                                            <th class="fw-bold">Contact Number</th>
                                            <th class="fw-bold">Description</th>
                                            <th class="fw-bold">status</th>
                                        </thead>
                                        <tbody>
                                        @php
                                          $v = false;
                                        @endphp
                                            @foreach ($wholesaleRequests as $index => $wholesaleRequest)
                                                <tr class="view-wholesale" data-id="{{ $wholesaleRequest->id }}">

                                                    <td>
                                                        <div class="mb-1">
                                                            <span class="">{{ $wholesaleRequest->date }}</span>
                                                            </a>
                                                        </div>
                                                    </td>
                                                    <td>
                                                        <div class="mb-1">
                                                            <span
                                                                class="">{{ $wholesaleRequest->phone_number }}</span>
                                                            </a>
                                                        </div>
                                                    </td>
                                                    <td>
                                                        <div class="mb-1">
                                                            <span
                                                                class="">{{ substr($wholesaleRequest->message, 0, 50) . '...' }}</span>
                                                            </a>
                                                        </div>
                                                    </td>
                                                    <td>
                                                        @if ($wholesaleRequest->status == 0)
                                                            <span class="badge badge-light-primary">Open</span>
                                                        @elseif($wholesaleRequest->status == 1)
                                                            <span class="badge badge-light-warning">Quoted</span>
                                                        @elseif($wholesaleRequest->status == 2)
                                                            <span class="badge badge-light-success">Accepted</span>
                                                        @elseif($wholesaleRequest->status == 3)
                                                            <span class="badge badge-light-danger ">Rejected</span>
                                                        @endif

                                                        <i class="fa fa-plus-circle mx-2 wholesaleRequest-extra"
                                                            aria-hidden="true" attr-id="{{ $wholesaleRequest->id }}"
                                                            id="wholesaleRequest-{{ $wholesaleRequest->id }}"></i>
                                                    </td>

                                                    @if($wholesaleRequest->status == 0 || $v == true)
                                                        <td style="width: 100px;">
                                                            @if ($wholesaleRequest->status == 0)
                                                                <button type="button" id="{{ $wholesaleRequest->id }}"
                                                                        class="btn btn-primary quatation">Quotation</button>
                                                            @endif
                                                        </td>
                                                        @php
                                                            $v = true;
                                                        @endphp
                                                    @endif

                                                </tr>
                                                <tr class="d-none product-details ">

                                                    <td colspan="5">
                                                        <div attr-id="wholesaleRequest-{{ $wholesaleRequest->id }}"></div>
                                                    </td>
                                                </tr>
                                            @endforeach
                                        </tbody>
                                        {{-- @endforeach --}}
                                    </table>
                                @else
                                    <h3 class="text-center m-5 text-gray-500">Theres no Wholesale requests</h3>
                                @endif
                            </div>
                        </div>
                        <!--end::Table-->
                    </div>
                </div>
                <!--end::Card-->
            </div>
            <!--end::Content-->
        </div>
        <!--end::Inbox App - Messages -->
    </div>
@endsection
@push('script')
    <script>
        var modalId = 'modal';
        $(document).on('click', '.quatation', async function() {
            // debugger;\\
            let wholesaleRequestId = $(this).attr('id');
            // alert(wholesaleRequestId);
            const btn = $(this);
            const btnTitle = btn.html();
            try {
                loadButton(btn, 'Loading ...');
                let loadURL = `${baseUrl}/admin/wholesale-requests/create-quatation` + "/" + wholesaleRequestId;

                await loadModal(modalId, loadURL);
            } catch (err) {
                toast.error("Could not load add quatation popup. (error_ref: create_quatation)");
                console.log("create_quatation", err);
            } finally {
                resetButton(btn, btnTitle);
            }

        });

        $(document).on('click', '#wholeSale', async function(e) {
            e.preventDefault();
            let form = $(this).closest('form');
            const btn = $(this);
            const btnTitle = btn.html();
            try {
                loadButton(btn);
                const url = "{{ route('admin.wholsesale.quatation.store') }}";
                let ajaxRequest = new HttpRequest(url, 'POST');
                ajaxRequest.set_data_by_form_object(form);
                let response = await ajaxRequest.call();
                $("#" + modalId).modal("hide");
                toast.success(response.message);
                setTimeout(() => {
                    location.reload();
                }, 50);

            } catch (err) {
                toast.error(err);
            } finally {
                resetButton(btn, btnTitle);
            }
        });
    </script>

    <script>
        $(document).ready(function() {
            $('.wholesaleRequest-extra').on('click', function() {

                $('.product-details').addClass('d-none');

                if ($("[attr-id='" + $(this).attr('id') + "']").attr('class') != 'active') {
                    $("[attr-id='" + $(this).attr('id') + "']").addClass('active').load(
                        "{{ url('/admin/wholesaleDetails') }}/" + $(this).attr('attr-id'));

                    $("[attr-id='" + $(this).attr('id') + "']").closest('tr').removeClass('d-none');
                } else {

                    $("[attr-id='" + $(this).attr('id') + "']").removeClass('active');
                }
            })

            $(document).on({
                'keyup': function() {
                    var unitPrice = $(this).val();
                    var qty = $(this).closest('.form-group').find('.qty').val();

                    $(this).closest('.form-group').find('.total-price').html('Total Price: ' + unitPrice * qty + '&euro;');
                }
            }, '.u-price')
        })
    </script>
@endpush