@extends('pwa.template.app.main')
@push('scripts')
@if (session('success-buatproduk'))
<script>
    Swal.fire({
        icon: 'success',
        title: 'Sukses!',
        text: "{{ session('success-buatproduk') }}",
    })

</script>
@endif
@if (session('success-settingproduk'))
<script>
    Swal.fire({
        icon: 'success',
        title: 'Sukses!',
        text: "{{ session('success-settingproduk') }}",
    })

</script>
@endif
@if (session('success-editmerchant'))
<script>
    Swal.fire({
        icon: 'success',
        title: 'Sukses!',
        text: "{{ session('success-editmerchant') }}",
    })

</script>
@endif
@if (session('success-deleteproduk'))
<script>
    Swal.fire({
        icon: 'success',
        title: 'Sukses!',
        text: "{{ session('success-deleteproduk') }}",
    })

</script>
@endif
<script>
    $('.dropify').dropify({
        tpl: {
            message: '<div class="dropify-message"><span class="file-icon" /></div>',
        }
    });

    function handleEdit(merchant, url) {
        $("#form-edit").attr('action', url);
    }

    function handleDelete(produk, url) {
        $("#form-delete").attr('action', url);
    }

</script>
<script>
    tinymce.init({
        selector: 'textarea#myeditorinstance', // Replace this CSS selector to match the placeholder element for TinyMCE
        plugins: 'code table lists',
        toolbar: 'undo redo | blocks | bold italic | alignleft aligncenter alignright | indent outdent | bullist numlist | code | table'
    });

</script>
@endpush
@section('app-content')
<style>
    .produks {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        height: 100%;
    }

    .pic-produk {
        border-radius: 6px;
        height: 150px;
        width: 150px;
    }

    #home>div>div>div>ul>li {
        list-style: outside;
    }

    .product-card .btn {
        border-radius: 5px;
        width: 30%;
        right: 0 !important;
        bottom: 0 !important;
    }

    .nrmlhref {
        text-decoration:
    }

</style>
<div class="page-content-wrapper pb-3">
    <!-- Vendor Details Wrap -->
    <div class="vendor-details-wrap bg-img bg-overlay py-4" style="background-image: url('img/bg-img/15.jpg')">
        <div class="container">
            <div class="d-flex align-items-start">
                <!-- Vendor Profile-->
                <div class="vendor-profile shadow me-3 mt-1">
                    <figure style="width: 100%; height: 100%;" class="m-0"><img
                            src="{{ asset('storage/' . $merchant->foto) }}" alt="foto merchant"
                            style="width: 100%; height: 100%; object-fit: cover; max-width: 100%;"></figure>
                </div>
                <!-- Vendor Info-->
                <div class="vendor-info">
                    <h5 class="vendor-title text-white">{{ $merchant->nama }}</h5>
                    <p class="mb-1 text-white"><i class="fa-solid fa-location-dot me-1"></i>{{ $merchant->alamat }}</p>
                    {{-- <div class="ratings lh-1"><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i
                class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><span
                class="text-white">(99% Positive Seller)</span></div> --}}
                </div>
            </div>
            <!-- Vendor Basic Info-->
            {{-- <div class="vendor-basic-info d-flex align-items-center justify-content-between mt-4">
          <div class="single-basic-info">
            <div class="icon"><i class="fa-solid fa-shield"></i></div><span>Trusted Seller</span>
          </div>
          <div class="single-basic-info">
            <div class="icon"><i class="fa-solid fa-bag-shopping"></i></div><span>100+ Items</span>
          </div>
          <div class="single-basic-info">
            <div class="icon"><i class="fa-solid fa-ship"></i></div><span>98% Ship On Time</span>
          </div>
        </div> --}}
        </div>
    </div>
    <!-- Vendor Tabs -->
    <div class="vendor-tabs">
        <div class="container">
            <ul class="nav nav-tabs mb-3" id="vendorTab" role="tablist">
                <li class="nav-item" role="presentation">
                    <button class="nav-link" id="home-tab" data-bs-toggle="tab" data-bs-target="#home" type="button"
                        role="tab" aria-controls="home" aria-selected="true">Tentang Merchant</button>
                </li>
                <li class="nav-item" role="presentation">
                    <button class="nav-link active" id="products-tab" data-bs-toggle="tab" data-bs-target="#products"
                        type="button" role="tab" aria-controls="products" aria-selected="false">Produk</button>
                </li>
                <!--<li class="nav-item" role="presentation">-->
                <!--  <button class="nav-link" id="reviews-tab" data-bs-toggle="tab" data-bs-target="#reviews" type="button"-->
                <!--    role="tab" aria-controls="reviews" aria-selected="false">Ratings &amp; Reviews</button>-->
                <!--</li>-->
                <li class="nav-item" role="presentation">
                    <button class="nav-link" id="orders-tab" data-bs-toggle="tab" data-bs-target="#orders" type="button"
                        role="tab" aria-controls="reviews" aria-selected="false">Pesanan</button>
                </li>
            </ul>
        </div>
    </div>
    <div class="tab-content" id="vendorTabContent">
        <div class="tab-pane fade" id="home" role="tabpanel" aria-labelledby="home-tab">
            <div class="container">
                <div class="card">
                    <div class="card-body about-content-wrap dir-rtl">
                        {!! $merchant->deskripsi !!}
                        <div class="contact-btn-wrap text-center">
                            <button class="btn btn-warning w-100 me-1" data-bs-toggle="modal"
                                data-bs-target="#modal-edit">
                                Edit
                            </button>
                        </div>
                    </div>
                </div>
            </div>
            <!-- Modal Edit -->
            <div class="modal fade" id="modal-edit" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1"
                aria-labelledby="staticBackdropLabel" aria-hidden="true">
                <div class="modal-dialog modal-dialog-centered">
                    <div class="modal-content">
                        <form method="POST" id="form-edit"
                            action="{{ route('merchantdeskripsi.update', $merchant->id) }}"
                            enctype="multipart/form-data">
                            @csrf
                            <div class="modal-header">
                                <h1 class="modal-title fs-5" id="staticBackdropLabel">Edit Deskripsi</h1>
                                <button type="button" class="btn-close" data-bs-dismiss="modal"
                                    aria-label="Close"></button>
                            </div>
                            <div class="modal-body">
                                <div class="mb-3">
                                    <label class="form-label">Nama</label>
                                    <input class="form-control" type="text" name="nama" id="nama"
                                        value="{{ $merchant->nama }}">
                                </div>
                                <div class="mb-3">
                                    <label class="form-label">Ongkir</label>
                                    <input class="form-control" type="number" name="ongkir" id="ongkir"
                                        value="{{ $merchant->ongkir }}">
                                </div>
                                <div class="mb-3">
                                    <label class="form-label">Foto Merchant</label>
                                    <input type="file" class="dropify" name="foto"
                                        data-default-file="{{ asset('storage/' . $merchant->foto) }}" />
                                </div>

                                <div class="mb-3">
                                    <label for="deskripsi" class="form-label">Deskripsi Merchant</label>
                                    <textarea id="myeditorinstance" class="form-control"
                                        placeholder="Jelaskan Sedikit Tentang Toko Anda"
                                        name="deskripsi">{!! $merchant->deskripsi !!}</textarea>
                                </div>
                            </div>
                            <div class="modal-footer">
                                <button type="button" class="btn btn-danger" data-bs-dismiss="modal">Tidak</button>
                                <button type="submit" class="btn btn-success">Ya</button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
        <div class="tab-pane fade show active" id="products" role="tabpanel" aria-labelledby="products-tab">
            <div class="container">
                <div class="row g-2 rtl-flex-d-row-r">
                    <div class="col-12">
                        <a href="{{ route('buat-produk') }}" class="btn btn-success" style="width: 100%;">Tambah
                            Produk</a>
                    </div>
                    <!-- Product Card -->
                    @foreach ($produk as $p)
                    <div class="col-6 col-md-4">
                        {{-- <a href="{{ route('produk-detail', $p->id) }}"> --}}
                        <a href="{{ route('produk-detail', $p->id) }}">
                            <div class="card product-card" style="height: 100%;">
                                <div class="card-body">
                                    <div class="produks">
                                        <div class="produk-f">
                                            <!-- Thumbnail -->
                                            <div class="product-thumbnail d-block"><img class="pic-produk mb-2"
                                                    src="{{ asset('storage/' . $p->foto) }}" alt=""
                                                    style="object-fit: cover;">
                                            </div>
                                        </div>
                                        <div class="produk-lt mt-2">
                                            <!-- Product Title -->
                                            <div class="product-title" style="color: #45b05a;">{{ $p->nama }}</div>
                                            <!-- Product Price -->
                                            <p class="sale-price">@currency($p->harga)</p>
                                            <!-- Rating -->
                                            <div class="footer-produk">
                                                {{-- <a href="{{ route('setting-produk', $p->id) }}">
                                                <button type="button" class="btn btn-secondary"><i
                                                        class="bi bi-gear"></i></button>
                        </a> --}}
                        <div class="alternative-search-options">
                            <div class="dropdown">
                                <a class="btn btn-danger dropdown-toggle" id="altSearchOption" href="#" role="button"
                                    data-bs-toggle="dropdown" aria-expanded="false"><i
                                        class="fa-solid fa-sliders"></i></a>
                                <!-- Dropdown Menu -->
                                <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="altSearchOption" style="">
                                    <li>
                                        <a class="dropdown-item" href="{{ route('setting-produk', $p->id) }}"><i
                                                class="fa-solid fa-gear" style="font-size: 13px;"></i> Ubah Produk</a>
                                    </li>
                                    <li>
                                        <a class="dropdown-item" data-bs-toggle="modal" data-bs-target="#modal-delete"
                                            onclick="handleDelete({{ $produk }}, '{{ route('produk.delete', $p->id) }}')"
                                            style="cursor: pointer; color: red;">
                                            <i class="fa-solid fa-trash-can" style="font-size: 13px; color: red;"></i>
                                            Hapus
                                            Produk
                                        </a>
                                        {{-- <form method="POST" action="{{ route('produk.delete', $p->id) }}">
                                        @csrf
                                        <button class="dropdown-item"><i class="fa-solid fa-trash-can"> </i>Hapus
                                            Produk</button>
                                        </form> --}}
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    </a>
</div>
@endforeach
</div>
</div>
</div>
<div class="tab-pane fade" id="reviews" role="tabpanel" aria-labelledby="reviews-tab">
    <!-- Rating & Review Wrapper -->
    <div class="rating-and-review-wrapper bg-white py-3 mb-3 dir-rtl">
        <div class="container">
            <div class="rating-review-content">
                <ul class="ps-0">
                    <!-- Single User Review -->
                    <li class="single-user-review d-flex">
                        <div class="user-thumbnail"><img src="img/bg-img/7.jpg" alt=""></div>
                        <div class="rating-comment">
                            <div class="rating"><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i
                                    class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i
                                    class="fa-solid fa-star"></i>
                            </div>
                            <p class="comment mb-0">Very good product. It's just amazing!</p><span
                                class="name-date">Designing
                                World 12 Dec 2022</span><a class="review-image mt-2 border rounded"
                                href="img/product/3.png"><img class="rounded-3" src="img/product/3.png" alt=""></a>
                        </div>
                    </li>
                    <!-- Single User Review -->
                    <li class="single-user-review d-flex">
                        <div class="user-thumbnail"><img src="img/bg-img/8.jpg" alt=""></div>
                        <div class="rating-comment">
                            <div class="rating"><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i
                                    class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i
                                    class="fa-solid fa-star"></i>
                            </div>
                            <p class="comment mb-0">Very excellent product. Love it.</p><span
                                class="name-date">Designing
                                World
                                8 Dec 2022</span><a class="review-image mt-2 border rounded"
                                href="img/product/4.png"><img class="rounded-3" src="img/product/4.png" alt=""></a><a
                                class="review-image mt-2 border rounded" href="img/product/6.png"><img class="rounded-3"
                                    src="img/product/6.png" alt=""></a>
                        </div>
                    </li>
                    <!-- Single User Review -->
                    <li class="single-user-review d-flex">
                        <div class="user-thumbnail"><img src="img/bg-img/9.jpg" alt=""></div>
                        <div class="rating-comment">
                            <div class="rating"><i class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i
                                    class="fa-solid fa-star"></i><i class="fa-solid fa-star"></i><i
                                    class="fa-solid fa-star"></i>
                            </div>
                            <p class="comment mb-0">What a nice product it is. I am looking it's.</p><span
                                class="name-date">Designing World 28 Nov 2022</span>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <!-- Ratings Submit Form-->
    <div class="ratings-submit-form bg-white py-3 dir-rtl">
        <div class="container">
            <h6>Submit A Review</h6>
            <form action="#" method="">
                <div class="stars mb-3">
                    <input class="star-1" type="radio" name="star" id="star1">
                    <label class="star-1" for="star1"></label>
                    <input class="star-2" type="radio" name="star" id="star2">
                    <label class="star-2" for="star2"></label>
                    <input class="star-3" type="radio" name="star" id="star3">
                    <label class="star-3" for="star3"></label>
                    <input class="star-4" type="radio" name="star" id="star4">
                    <label class="star-4" for="star4"></label>
                    <input class="star-5" type="radio" name="star" id="star5">
                    <label class="star-5" for="star5"></label><span></span>
                </div>
                <textarea class="form-control mb-3" id="comments" name="comment" cols="30" rows="10"
                    data-max-length="200" placeholder="Write your review..."></textarea>
                <button class="btn btn-primary" type="submit">Save Review</button>
            </form>
        </div>
    </div>
</div>
{{-- TABS ORDER --}}
<div class="tab-pane fade" id="orders" role="tabpanel" aria-labelledby="orders-tab">
    <div class="container">
        @forelse ($orders as $index => $order)
        <div class="card mb-3">
            <div class="card-header bg-white d-flex justify-content-between">
                <div style="display: flex; align-items: center;">
                    <i class="fa-solid fa-bag-shopping me-2"></i>
                    <div style="display: flex; flex-direction: column">
                        <div>
                            @switch($order->tipe)
                            @case('produk')
                            Belanja
                            @break
                            @endswitch
                        </div>
                        <div style="font-size: 13px; margin-top: -5px">
                            {{ date('d M Y', strtotime($order->created_at)) }}
                        </div>
                    </div>
                </div>
                <span>
                    @switch($order->status)
                    @case('pending')
                    <span class="badge text-bg-warning" id="badge-{{ $index }}">{{ $order->status }}</span>
                    @break

                    @case('kirim')
                    <span class="badge text-bg-primary" id="badge-{{ $index }}">{{ $order->status }}</span>
                    @break

                    @case('terima')
                    <span class="badge text-bg-success" id="badge-{{ $index }}">{{ $order->status }}</span>
                    @break

                    @case('tolak')
                    <span class="badge text-bg-danger" id="badge-{{ $index }}">{{ $order->status }}</span>
                    @break
                    @endswitch
                    <div class="dropdown" style="display: inline-block">
                        <i class="fa-solid fa-ellipsis-vertical ms-2 fs-5" style="vertical-align: middle"
                            data-bs-toggle="dropdown"></i>
                        <ul class="dropdown-menu shadow">
                            <li>
                                <a class="dropdown-item d-flex align-items-center text-primary" href="#">
                                    <i class="fa-solid me-2 fa-arrow-up-from-bracket"></i>
                                    <span>Kirim</span>
                                </a>
                            </li>
                            <hr class="m-0">
                            <li>
                                <a class="dropdown-item d-flex align-items-center text-danger" href="#">
                                    <i class="fa-solid me-2 fa-ban"></i> <span>Tolak</span>
                                </a>
                            </li>
                        </ul>
                    </div>
                </span>
            </div>
            <div class="card-body">
                <div class="d-flex" style="gap: 5px">
                    <img src="{{ asset('storage/' . $order->order_details[0]->produk->foto) }}" alt="" style="width: 40px; border-radius: 5px;
                height: 40px; object-fit: cover;" class="shadow-sm">
                    <div>
                        <h5 class="card-title mb-0">{{ $order->no_invoice }}</h5>
                        <p class="mb-0">{{ $order->total_barang() }} Barang</p>
                    </div>
                </div>
                <div class="d-flex justify-content-between">
                    <div>
                        <p class="mb-0" style="font-size: 15px">Total Belanja</p>
                        <p class="mb-0 text-dark" style="font-weight: bold">Rp.
                            {{ number_format($order->harga, 0, 0, '.') }}</p>
                    </div>
                    <button type="button" data-bs-toggle="collapse" data-bs-target="#table-order-{{ $index }}"
                        aria-expanded="false" aria-controls="table-order-{{ $index }}" class="btn btn-primary"
                        style="height: fit-content; align-self:flex-end">Detail</a>
                </div>
                <div class="collapse" id="table-order-{{ $index }}">
                    <div class="cart-table  mb-3">
                        <div class="table-responsive ">
                            <table class="table mb-0 table-bordered ">
                                <thead>
                                    <th>#</th>
                                    <th>Foto</th>
                                    <th>Nama</th>
                                    <th>Harga</th>
                                    <th>Kuantitas</th>
                                    <th>Total Harga</th>
                                </thead>
                                <tbody>
                                    @foreach ($order->order_details as $i => $order_detail)
                                    <tr>
                                        {{-- <th scope="row">
                                <a class="remove-product" href="#"><i class="fa-solid fa-xmark"></i></a>
                              </th> --}}
                                        <td>{{ $i + 1 }}</td>
                                        <td>
                                            <img class="rounded"
                                                src="{{ asset('storage/' . $order_detail->produk->foto) }}" alt="" />
                                        </td>
                                        <td>
                                            <a href="single-product.html">{{ $order_detail->produk->nama }}</a>
                                        </td>
                                        <td class="text-nowrap">Rp. {{ number_format($order_detail->harga, 0, 0, '.') }}
                                        </td>
                                        <td class="text-center">x {{ $order_detail->kuantitas }}</td>
                                        <td class="text-nowrap">Rp.
                                            {{ number_format($order_detail->total_harga(), 0, 0, '.') }}
                                        </td>
                                    </tr>
                                    @endforeach
                                    <tr>
                                        <td colspan="5" style="text-align: end;">Ongkir :</td>
                                        <td>Rp. {{ number_format($order->ongkir, 0, 0, '.') }}</td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                    @if ($order->status != 'terima')
                    <div class="d-flex justify-content-end" style="gap: 5px;" id="button-handle-order">
                        @if ($order->status == 'pending')
                        <button data-bs-toggle="modal" data-bs-target="#modal-tolak"
                            onclick="handleKonfirmasi('tolak', '{{ route('merchant.handle-order', $order->id) }}', {{ $index }})"
                            class="btn btn-danger bg-gradient"><i class="fa-solid fa-ban"></i>
                            Tolak</button>
                        <button data-bs-toggle="modal" data-bs-target="#modal-kirim"
                            onclick="handleKonfirmasi('kirim', '{{ route('merchant.handle-order', $order->id) }}', {{ $index }})"
                            class="btn btn-warning bg-gradient"><i class="fa-solid fa-arrow-up-from-bracket"></i>
                            Kirim</button>
                        @endif
                    </div>
                    @endif
                </div>
            </div>
        </div>
        @empty
        @endforelse
    </div>
</div>
</div>
</div>
</div>



<!-- Modal Delete -->
<div class="modal fade" id="modal-delete" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1"
    aria-labelledby="staticBackdropLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content">
            <form method="POST" id="form-delete">
                @csrf
                <div class="modal-header">
                    <h1 class="modal-title fs-5" id="staticBackdropLabel">Hapus Produk</h1>
                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">
                    <h4>Apakah Anda Ingin Menghapus Produk ini?</h4>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-danger" data-bs-dismiss="modal">Tidak</button>
                    <button type="submit" class="btn btn-success">Ya</button>
                </div>
            </form>
        </div>
    </div>
</div>

{{-- modal tolak --}}
<div class="modal fade" id="modal-tolak" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content">
            <div class="modal-header">
                <h1 class="modal-title fs-5" id="exampleModalLabel">Tolak Produk</h1>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                Apa Anda Yakin Untuk Menolak Order Ini ?
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
                <button type="button" class="btn btn-danger" data-bs-dismiss="modal" id="button-tolak">Tolak</button>
            </div>
        </div>
    </div>
</div>
{{-- modal kirim --}}
<div class="modal fade" id="modal-kirim" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content">
            <div class="modal-header">
                <h1 class="modal-title fs-5" id="exampleModalLabel">Kirim Produk</h1>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                Yakin Untuk Mengirim Produk ?
            </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" data-bs-dismiss="modal" id="button-kirim">Kirim</button>
            </div>
        </div>
    </div>
</div>
@endsection

@push('scripts')
<script>
    function handleKonfirmasi(val, url, index) {
        let buttonKonfirmasi;
        if (val == 'kirim') {
            buttonKonfirmasi = '#button-kirim';
        }
        if (val == 'tolak') {
            buttonKonfirmasi = '#button-tolak';
        }
        $(buttonKonfirmasi).click(async () => {
            console.log(val);
            console.log(url);
            const response = await fetch(url, {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json',
                    'X-CSRF-Token': '{{ csrf_token() }}'
                },
                body: JSON.stringify({
                    status: val
                })
            });

            const data = await response.json()
            console.log(response);
            console.log(data);
            $('#button-handle-order').remove();
            if (data.status == 'kirim') {
                $(`#badge-${index}`).removeClass('text-bg-warning').addClass('text-bg-primary').text(
                    'kirim');
                Swal.fire({
                    icon: 'success',
                    title: 'Sukses Mengirim Order',
                })
            } else if (data.status == 'tolak') {
                $(`#badge-${index}`).removeClass('text-bg-warning').addClass('text-bg-danger').text(
                    'tolak');
                Swal.fire({
                    icon: 'success',
                    title: 'Sukses Menolak Order',
                })
            }


        });
    }

    // async function handleOrder(val, url, index) {
    //   console.log(val);
    //   console.log(url);
    //   const response = await fetch(url, {
    //     method: 'POST',
    //     headers: {
    //       'Content-Type': 'application/json',
    //       'X-CSRF-Token': '{{ csrf_token() }}'
    //     },
    //     body: JSON.stringify({
    //       status: val
    //     })
    //   });

    //   const data = await response.json()
    //   console.log(response);
    //   console.log(data);
    //   if (data.status == 'kirim') {
    //     $(`#badge-${index}`).removeClass('text-bg-warning').addClass('text-bg-primary').text('kirim');

    //   } else if (data.status == 'tolak') {
    //     $(`#badge-${index}`).removeClass('text-bg-warning').addClass('text-bg-danger').text('tolak');

    //   }
    //   $('#button-handle-order').remove();
    // }

</script>
@endpush