@extends('layouts.app')
@section('content')
    <div class="d-flex flex-column flex-column-fluid">
        <!--begin::Toolbar-->
        <div id="kt_app_toolbar" class="app-toolbar py-3 py-lg-6">
            <!--begin::Toolbar container-->
            <div id="kt_app_toolbar_container" class="app-container container-xxl d-flex flex-stack">
                <!--begin::Page title-->
                <div class="page-title d-flex flex-column justify-content-center flex-wrap me-3">
                    <!--begin::Title-->
                    <h1 class="page-heading d-flex text-dark fw-bold fs-3 flex-column justify-content-center my-0">Order
                        Details</h1>
                    <!--end::Title-->
                    <!--begin::Breadcrumb-->
                    <ul class="breadcrumb breadcrumb-separatorless fw-semibold fs-7 my-0 pt-1">
                        <!--begin::Item-->
                        <li class="breadcrumb-item text-muted">
                            <a href="{{ route('dashboard') }}" class="text-muted text-hover-primary">Home</a>
                        </li>
                        <!--end::Item-->
                        <!--begin::Item-->
                        <li class="breadcrumb-item">
                            <span class="bullet bg-gray-400 w-5px h-2px"></span>
                        </li>
                        <!--end::Item-->
                        <!--begin::Item-->
                        <li class="breadcrumb-item text-muted">Orders</li>
                        <!--end::Item-->
                        <!--begin::Item-->
                        <li class="breadcrumb-item">
                            <span class="bullet bg-gray-400 w-5px h-2px"></span>
                        </li>
                        <!--end::Item-->
                        <!--begin::Item-->
                        <li class="breadcrumb-item text-muted">Details</li>
                        <!--end::Item-->
                    </ul>
                    <!--end::Breadcrumb-->
                </div>
                <!--end::Page title-->
            </div>
            <!--end::Toolbar container-->
        </div>
        <!--end::Toolbar-->
        <!--begin::Content-->
        <div id="kt_app_content" class="app-content flex-column-fluid">
            <!--begin::Content container-->
            <div id="kt_app_content_container" class="app-container container-xxl">
                <!--begin::Order details page-->
                <div class="d-flex flex-column gap-7 gap-lg-10">
                    <div class="d-flex flex-wrap flex-stack gap-5 gap-lg-10">
                        <!--begin:::Tabs-->
                        <ul
                            class="nav nav-custom nav-tabs nav-line-tabs nav-line-tabs-2x border-0 fs-4 fw-semibold mb-lg-n2 me-auto">
                            <!--begin:::Tab item-->
                            <li class="nav-item">
                                <a class="nav-link text-active-primary pb-4 active" data-bs-toggle="tab"
                                    href="#kt_ecommerce_sales_order_summary">Order Summary</a>
                            </li>
                            <!--end:::Tab item-->
                        </ul>
                        <!--end:::Tabs-->
                        <!--begin::Button-->
                        <button type="button" id="cmd" class="btn btn-sm btn-success">Download PDF</button><br>
                        <a href="{{ route('order.order-list') }}" class="btn btn-primary btn-sm">Go Back</a>
                        <!--end::Button-->
                    </div>



                    <!--begin::Order summary-->
                    <div id="content">
                        <div class="d-flex flex-column flex-xl-row gap-7 gap-lg-10">
                            <!--begin::Order details-->
                            <div class="card card-flush py-4 flex-row-fluid">
                                <!--begin::Card header-->
                                <div class="card-header">
                                    <div class="card-title">
                                        <h2>Order No. ({{ $order->order_no }})</h2>
                                        <div hidden id="order_no">{{$order->order_no}}</div>
                                    </div>
                                </div>
                                <!--end::Card header-->
                                <!--begin::Card body-->
                                <div class="card-body pt-0">
                                    <div class="table-responsive">
                                        <!--begin::Table-->
                                        <table class="table align-middle table-row-bordered mb-0 fs-6 gy-5 min-w-300px">
                                            <!--begin::Table body-->
                                            <tbody class="fw-semibold text-gray-600">
                                                <!--begin::Date-->
                                                <tr>
                                                    <td class="text-muted">
                                                        <div class="d-flex align-items-center">
                                                            <!--begin::Svg Icon | path: icons/duotune/files/fil002.svg-->
                                                            <span class="svg-icon svg-icon-2 me-2">
                                                                <svg width="20" height="21" viewBox="0 0 20 21"
                                                                    fill="none" xmlns="http://www.w3.org/2000/svg">
                                                                    <path opacity="0.3"
                                                                        d="M19 3.40002C18.4 3.40002 18 3.80002 18 4.40002V8.40002H14V4.40002C14 3.80002 13.6 3.40002 13 3.40002C12.4 3.40002 12 3.80002 12 4.40002V8.40002H8V4.40002C8 3.80002 7.6 3.40002 7 3.40002C6.4 3.40002 6 3.80002 6 4.40002V8.40002H2V4.40002C2 3.80002 1.6 3.40002 1 3.40002C0.4 3.40002 0 3.80002 0 4.40002V19.4C0 20 0.4 20.4 1 20.4H19C19.6 20.4 20 20 20 19.4V4.40002C20 3.80002 19.6 3.40002 19 3.40002ZM18 10.4V13.4H14V10.4H18ZM12 10.4V13.4H8V10.4H12ZM12 15.4V18.4H8V15.4H12ZM6 10.4V13.4H2V10.4H6ZM2 15.4H6V18.4H2V15.4ZM14 18.4V15.4H18V18.4H14Z"
                                                                        fill="currentColor" />
                                                                    <path
                                                                        d="M19 0.400024H1C0.4 0.400024 0 0.800024 0 1.40002V4.40002C0 5.00002 0.4 5.40002 1 5.40002H19C19.6 5.40002 20 5.00002 20 4.40002V1.40002C20 0.800024 19.6 0.400024 19 0.400024Z"
                                                                        fill="currentColor" />
                                                                </svg>
                                                            </span>
                                                            <!--end::Svg Icon-->Order Date
                                                        </div>
                                                    </td>
                                                    <td class="fw-bold text-end">
                                                        {{ \Carbon\Carbon::parse($order->created_at)->format('d M, Y') }}</td>
                                                </tr>
                                                <!--end::Date-->
                                                {{-- order Status --}}
                                                <tr>
                                                    <td class="text-muted">
                                                        <div class="d-flex align-items-center">
                                                            <!--begin::Svg Icon | path: icons/duotune/finance/fin008.svg-->
                                                            <span class="svg-icon svg-icon-2 me-2">
                                                                <svg width="24" height="24" viewBox="0 0 24 24"
                                                                    fill="none" xmlns="http://www.w3.org/2000/svg">
                                                                    <path opacity="0.3"
                                                                        d="M3.20001 5.91897L16.9 3.01895C17.4 2.91895 18 3.219 18.1 3.819L19.2 9.01895L3.20001 5.91897Z"
                                                                        fill="currentColor" />
                                                                    <path opacity="0.3"
                                                                        d="M13 13.9189C13 12.2189 14.3 10.9189 16 10.9189H21C21.6 10.9189 22 11.3189 22 11.9189V15.9189C22 16.5189 21.6 16.9189 21 16.9189H16C14.3 16.9189 13 15.6189 13 13.9189ZM16 12.4189C15.2 12.4189 14.5 13.1189 14.5 13.9189C14.5 14.7189 15.2 15.4189 16 15.4189C16.8 15.4189 17.5 14.7189 17.5 13.9189C17.5 13.1189 16.8 12.4189 16 12.4189Z"
                                                                        fill="currentColor" />
                                                                    <path
                                                                        d="M13 13.9189C13 12.2189 14.3 10.9189 16 10.9189H21V7.91895C21 6.81895 20.1 5.91895 19 5.91895H3C2.4 5.91895 2 6.31895 2 6.91895V20.9189C2 21.5189 2.4 21.9189 3 21.9189H19C20.1 21.9189 21 21.0189 21 19.9189V16.9189H16C14.3 16.9189 13 15.6189 13 13.9189Z"
                                                                        fill="currentColor" />
                                                                </svg>
                                                            </span>
                                                            <!--end::Svg Icon-->Order Status
                                                        </div>
                                                    </td>
                                                    <td class="fw-bold text-end">
                                                        {{ (!empty($order->status)) ? (($order->status == 1) ? 'Onging' : (($order->status == 2) ? 'Completed' : (($order->status == 3) ? 'Cancelled' : 'NA'))) : 'NA' }}
                                                    </td>
                                                </tr>
                                                <!--begin::Delivered on-->
                                                <tr>
                                                    <td class="text-muted">
                                                        <div class="d-flex align-items-center">
                                                            <!--begin::Svg Icon | path: icons/duotune/finance/fin008.svg-->
                                                            <span class="svg-icon svg-icon-2 me-2">
                                                                <svg width="20" height="21" viewBox="0 0 20 21"
                                                                    fill="none" xmlns="http://www.w3.org/2000/svg">
                                                                    <path opacity="0.3"
                                                                        d="M19 3.40002C18.4 3.40002 18 3.80002 18 4.40002V8.40002H14V4.40002C14 3.80002 13.6 3.40002 13 3.40002C12.4 3.40002 12 3.80002 12 4.40002V8.40002H8V4.40002C8 3.80002 7.6 3.40002 7 3.40002C6.4 3.40002 6 3.80002 6 4.40002V8.40002H2V4.40002C2 3.80002 1.6 3.40002 1 3.40002C0.4 3.40002 0 3.80002 0 4.40002V19.4C0 20 0.4 20.4 1 20.4H19C19.6 20.4 20 20 20 19.4V4.40002C20 3.80002 19.6 3.40002 19 3.40002ZM18 10.4V13.4H14V10.4H18ZM12 10.4V13.4H8V10.4H12ZM12 15.4V18.4H8V15.4H12ZM6 10.4V13.4H2V10.4H6ZM2 15.4H6V18.4H2V15.4ZM14 18.4V15.4H18V18.4H14Z"
                                                                        fill="currentColor" />
                                                                    <path
                                                                        d="M19 0.400024H1C0.4 0.400024 0 0.800024 0 1.40002V4.40002C0 5.00002 0.4 5.40002 1 5.40002H19C19.6 5.40002 20 5.00002 20 4.40002V1.40002C20 0.800024 19.6 0.400024 19 0.400024Z"
                                                                        fill="currentColor" />
                                                                </svg>
                                                            </span>
                                                            <!--end::Svg Icon-->Deliveried On
                                                        </div>
                                                    </td>
                                                    <td class="fw-bold text-end">
                                                        {{ (!empty($order->deliveried_on)) ? \Carbon\Carbon::parse($order->deliveried_on)->format('d M, Y') : 'NA' }}
                                                    </td>
                                                </tr>
                                                <!--end::Payment method-->
                                            </tbody>
                                            <!--end::Table body-->
                                        </table>
                                        <!--end::Table-->
                                    </div>
                                </div>
                                <!--end::Card body-->
                            </div>
                            <!--end::Order details-->
                            <!--begin::Customer details-->
                            <div class="card card-flush py-4 flex-row-fluid">
                                <!--begin::Card header-->
                                <div class="card-header">
                                    <div class="card-title">
                                        <h2>Retailer Details</h2>
                                    </div>
                                </div>
                                <!--end::Card header-->
                                <!--begin::Card body-->
                                <div class="card-body pt-0">
                                    <div class="table-responsive">
                                        <!--begin::Table-->
                                        <table class="table align-middle table-row-bordered mb-0 fs-6 gy-5 min-w-300px">
                                            <!--begin::Table body-->
                                            <tbody class="fw-semibold text-gray-600">
                                                <!--begin::Customer name-->
                                                <tr>
                                                    <td class="text-muted">
                                                        <div class="d-flex align-items-center">
                                                            <!--begin::Svg Icon | path: icons/duotune/communication/com006.svg-->
                                                            <span class="svg-icon svg-icon-2 me-2">
                                                                <svg width="18" height="18" viewBox="0 0 18 18"
                                                                    fill="none" xmlns="http://www.w3.org/2000/svg">
                                                                    <path opacity="0.3"
                                                                        d="M16.5 9C16.5 13.125 13.125 16.5 9 16.5C4.875 16.5 1.5 13.125 1.5 9C1.5 4.875 4.875 1.5 9 1.5C13.125 1.5 16.5 4.875 16.5 9Z"
                                                                        fill="currentColor" />
                                                                    <path
                                                                        d="M9 16.5C10.95 16.5 12.75 15.75 14.025 14.55C13.425 12.675 11.4 11.25 9 11.25C6.6 11.25 4.57499 12.675 3.97499 14.55C5.24999 15.75 7.05 16.5 9 16.5Z"
                                                                        fill="currentColor" />
                                                                    <rect x="7" y="6" width="4"
                                                                        height="4" rx="2" fill="currentColor" />
                                                                </svg>
                                                            </span>
                                                            <!--end::Svg Icon-->Retailer
                                                        </div>
                                                    </td>
                                                    <td class="fw-bold text-end">
                                                        <div class="d-flex align-items-center justify-content-end">
                                                            <!--begin:: Avatar -->
                                                            <div class="symbol symbol-circle symbol-25px overflow-hidden me-3">
                                                                <div class="symbol-label">
                                                                    @if ($order->retailer?->image == null)
                                                                        <div
                                                                            class="symbol symbol-circle symbol-50px overflow-hidden me-3">
                                                                            <img class="w-100"
                                                                                alt="{{ $order->retailer?->company_name }}"
                                                                                src="{{ asset('assets/media/avatars/blank.png') }}">
                                                                        </div>
                                                                    @else
                                                                        <div
                                                                            class="symbol symbol-circle symbol-50px overflow-hidden me-3">
                                                                            <img class="w-100"
                                                                                alt="{{ $order->retailer?->company_nam }}"
                                                                                src="{{ asset('storage/user_image/' . $order->retailer?->image) }}">
                                                                        </div>
                                                                    @endif
                                                                </div>
                                                            </div>
                                                            <!--end::Avatar-->
                                                            <!--begin::Name-->
                                                            <a href=""
                                                                class="text-gray-600 text-hover-primary">{{ $order->retailer?->company_name }}</a>
                                                            <!--end::Name-->
                                                        </div>
                                                    </td>
                                                </tr>
                                                <!--end::Customer name-->
                                                <!--begin::Customer email-->
                                                <tr>
                                                    <td class="text-muted">
                                                        <div class="d-flex align-items-center">
                                                            <!--begin::Svg Icon | path: icons/duotune/communication/com011.svg-->
                                                            <span class="svg-icon svg-icon-2 me-2">
                                                                <svg width="24" height="24" viewBox="0 0 24 24"
                                                                    fill="none" xmlns="http://www.w3.org/2000/svg">
                                                                    <path opacity="0.3"
                                                                        d="M21 19H3C2.4 19 2 18.6 2 18V6C2 5.4 2.4 5 3 5H21C21.6 5 22 5.4 22 6V18C22 18.6 21.6 19 21 19Z"
                                                                        fill="currentColor" />
                                                                    <path
                                                                        d="M21 5H2.99999C2.69999 5 2.49999 5.10005 2.29999 5.30005L11.2 13.3C11.7 13.7 12.4 13.7 12.8 13.3L21.7 5.30005C21.5 5.10005 21.3 5 21 5Z"
                                                                        fill="currentColor" />
                                                                </svg>
                                                            </span>
                                                            <!--end::Svg Icon-->Email
                                                        </div>
                                                    </td>
                                                    <td class="fw-bold text-end">
                                                        <a class="text-gray-600 text-hover-primary">{{ $order->retailer?->email ?? 'NA' }}</a>
                                                    </td>
                                                </tr>
                                                <!--end::Payment method-->
                                                <!--begin::Date-->
                                                <tr>
                                                    <td class="text-muted">
                                                        <div class="d-flex align-items-center">
                                                            <!--begin::Svg Icon | path: icons/duotune/electronics/elc003.svg-->
                                                            <span class="svg-icon svg-icon-2 me-2">
                                                                <svg width="24" height="24" viewBox="0 0 24 24"
                                                                    fill="none" xmlns="http://www.w3.org/2000/svg">
                                                                    <path
                                                                        d="M5 20H19V21C19 21.6 18.6 22 18 22H6C5.4 22 5 21.6 5 21V20ZM19 3C19 2.4 18.6 2 18 2H6C5.4 2 5 2.4 5 3V4H19V3Z"
                                                                        fill="currentColor" />
                                                                    <path opacity="0.3" d="M19 4H5V20H19V4Z"
                                                                        fill="currentColor" />
                                                                </svg>
                                                            </span>
                                                            <!--end::Svg Icon-->Phone
                                                        </div>
                                                    </td>
                                                    <td class="fw-bold text-end">{{ $order->retailer?->phone }}</td>
                                                </tr>
                                                <!--end::Date-->
                                            </tbody>
                                            <!--end::Table body-->
                                        </table>
                                        <!--end::Table-->
                                    </div>
                                </div>
                                <!--end::Card body-->
                            </div>
                            <!--end::Customer details-->
                        </div>

                        <!--end::Order summary-->
                        <!--begin::Tab content-->
                        <div class="tab-content mt-5">
                            <!--begin::Tab pane-->
                            <div class="tab-pane fade show active" id="kt_ecommerce_sales_order_summary" role="tab-panel">

                                <div class="d-flex flex-column flex-xl-row gap-7 gap-lg-12">
                                    <div class="card card-flush py-4 flex-row-fluid overflow-hidden">
                                        <div class="container">
                                            <div class="row">
                                                <div class="col-12 col-md-12 hh-grayBox pt45 pb20">
                                                    <div class="row justify-content-between">
                                                                                                                <div class="order-tracking @if (in_array('order_placed',$status_arr)) completed @endif">
                                                            <span class="is-complete"></span>
                                                            <p>Order Placed<br></p>
                                                            @if (!empty($time_arr['order_placed']))
                                                                <span>{{ \Carbon\Carbon::parse($time_arr['order_placed'])->format('d M, Y') }}</span>
                                                            @endif
                                                        </div>
                                                        {{-- <div class="order-tracking @if (in_array('on_process',$status_arr)) completed @endif">
                                                            <span class="is-complete"></span>
                                                            <p>Processing<br></p>
                                                            @if (!empty($time_arr['on_process']))
                                                                <span>{{ \Carbon\Carbon::parse($time_arr['on_process'])->format('d M, Y') }}</span>
                                                            @endif
                                                        </div>
                                                        <div class="order-tracking @if (in_array('out_for_delivery',$status_arr)) completed @endif">
                                                            <span class="is-complete"></span>
                                                            <p>Out For Delivery<br></p>
                                                            @if (!empty($time_arr['out_for_delivery']))
                                                                <span>{{ \Carbon\Carbon::parse($time_arr['out_for_delivery'])->format('d M, Y') }}</span>
                                                            @endif
                                                        </div> --}}
                                                        @if (in_array('invoiced',$status_arr))
                                                        <div class="order-tracking @if (in_array('invoiced',$status_arr)) completed @endif">
                                                            <span class="is-complete"></span>
                                                            <p>Invoiced<br>
                                                                @if ($order->deliveried_on)
                                                                    <span>{{ (!empty($order->deliveried_on)) ? \Carbon\Carbon::parse($order->deliveried_on)->format('d M, Y') : 'NA' }}</span>
                                                                @endif
                                                            </p>
                                                        </div>
                                                        @elseif (in_array('cancelled',$status_arr))
                                                        <div class="order-tracking @if (in_array('cancelled',$status_arr)) completed @endif">
                                                            <span class="is-complete"></span>
                                                            <p>Cancelled<br>
                                                                @if (!empty($time_arr['cancelled']))
                                                                    <span>{{ \Carbon\Carbon::parse($time_arr['cancelled'])->format('d M, Y') }}</span>
                                                                @endif
                                                            </p>
                                                        </div>
                                                        @else
                                                        <div class="order-tracking">
                                                            <span class="is-complete"></span>
                                                            <p><br></p>
                                                        </div>
                                                        @endif


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

                                <div class="d-flex flex-column flex-xl-row gap-7 gap-lg-10">
                                    <!--begin::Shipping address-->
                                    <div class="card card-flush py-4 flex-row-fluid overflow-hidden">
                                        <!--begin::Background-->
                                        <div class="position-absolute top-0 end-0 opacity-50 pe-none"
                                            style="margin-right: 100px">
                                            <img src="{{ asset('assets/media/icons/duotune/ecommerce/ecm006.svg') }}"
                                                class="w-175px" />
                                        </div>
                                        <!--end::Background-->
                                        <!--begin::Card header-->
                                        <div class="card-header">
                                            <div class="card-title">
                                                <h2>Retailer Address</h2>
                                            </div>
                                        </div>
                                        <!--end::Card header-->
                                        <!--begin::Card body-->
                                        <div class="card-body pt-0">{{ $order->retailer?->address?->address ?? ' - ' }},
                                            <br />{{ $order->retailer?->address?->pin_code ?? ' - ' }},
                                            <br />INDIA.
                                        </div>
                                        <!--end::Card body-->
                                    </div>
                                    <!--end::Shipping address-->
                                </div>
                                <!--begin::Orders-->
                                <div class="d-flex flex-column gap-7 gap-lg-10">
                                    <!--begin::Product List-->
                                    <div class="card card-flush py-4 flex-row-fluid overflow-hidden">
                                        <!--begin::Card header-->
                                        <div class="card-header">
                                            <div class="card-title">
                                                <h2>Order {{ $order->order_no }}</h2>
                                            </div>
                                        </div>
                                        <!--end::Card header-->
                                        <!--begin::Card body-->
                                        <div class="card-body pt-0">
                                            <div class="table-responsive">
                                                <!--begin::Table-->
                                                <table class="table align-middle table-row-dashed fs-6 gy-5 mb-0">
                                                    <!--begin::Table head-->
                                                    <thead>
                                                        <tr class="text-start text-gray-400 fw-bold fs-7 text-uppercase gs-0">
                                                            <th class="min-w-175px">Product</th>
                                                            @if (auth()->user()->hasRole('admin'))
                                                                <th class="min-w-175px">Dealer</th>
                                                            @endif
                                                            <th class="min-w-100px text-end">Type</th>
                                                            <th class="min-w-100px text-end">Company</th>
                                                            <th class="min-w-100px text-end">Origin</th>
                                                            <th class="min-w-70px text-end">Per Unit Price</th>
                                                            <th class="min-w-100px text-end">Quantity (Unit)</th>
                                                            <th class="min-w-100px text-end">GST</th>
                                                            <th class="min-w-100px text-end">Total</th>
                                                            @if (($order->payment_type != 'Credit Balence') && ($order->status != 2))
                                                                <th class="min-w-100px text-end">Action</th>
                                                            @endif
                                                        </tr>
                                                    </thead>
                                                    <!--end::Table head-->
                                                    <!--begin::Table body-->
                                                    <tbody class="fw-semibold text-gray-600">
                                                        <!--begin::Products-->
                                                        @foreach ($orderDetails as $details)
                                                            <tr>
                                                                <!--begin::Product-->
                                                                <td>
                                                                    <div class="d-flex align-items-center">
                                                                        <!--begin::Thumbnail-->
                                                                        <a href="javascript:void(0)"
                                                                            class="symbol symbol-50px">
                                                                            @if (!empty($details->product?->image))
                                                                            <span class="symbol-label"
                                                                            style="background-image:url('{{ asset('storage/product_images/' . $details->product?->image) }}');"></span>
                                                                            @else
                                                                            <span class="symbol-label"
                                                                            style="background-image:url('{{ asset('assets/media/auth/default_product.png') }}');"></span>
                                                                            @endif
                                                                        </a>
                                                                        <!--end::Thumbnail-->
                                                                        <!--begin::Title-->
                                                                        <div class="ms-5">
                                                                            <a class="fw-bold text-gray-600 text-hover-primary">{{ $details->product?->name ?? 'NA' }}</a>
                                                                        </div>
                                                                        <!--end::Title-->
                                                                    </div>
                                                                </td>

                                                                @if (auth()->user()->hasRole('admin'))
                                                                <td>
                                                                    <div class="d-flex flex-column">
                                                                        <span
                                                                            class="text-gray-800 text-hover-primary mb-1">{{ $details->dealer?->company_name }}</span>
                                                                        <span>{{ $details->dealer?->email ?? '-' }}</span>
                                                                    </div>
                                                                </td>
                                                                @endif

                                                                <td class="text-end">{{ $details->product?->type ?? ' - ' }}</td>
                                                                <td class="text-end">{{ $details->product?->company ?? ' - ' }}</td>
                                                                <td class="text-end">{{ $details->product?->origin_country ?? ' - ' }}</td>
                                                                <td class="text-end">₹ {{ $details->price ?? ' - ' }}</td>
                                                                <td class="text-end">{{ $details->quantity ?? ' - ' }}</td>
                                                                <td class="text-end">₹ {{ $details->gst ?? ' - ' }}</td>
                                                                <td class="text-end">₹ {{ (($details->price) + ($details->gst)) ?? ' - ' }}</td>
                                                                @if (($order->payment_type != 'Credit Balence') && ($order->status != 2))
                                                                    <td class="min-w-100px text-end">
                                                                        <button
                                                                            class="btn btn-icon btn-active-light-primary w-30px h-30px me-3 change-order-details-quantity"
                                                                            data-order-id="{{ $order->id }}"
                                                                            data-order-details-id="{{ $details->id }}"
                                                                            data-order-details-quantity-id="{{ $details->quantity }}">
                                                                            <span class="svg-icon svg-icon-3"><svg width="24px" height="24px"
                                                                                viewBox="0 0 24 24">
                                                                                <path
                                                                                    d="M8,17.9148182 L8,5.96685884 C8,5.56391781 8.16211443,5.17792052 8.44982609,4.89581508 L10.965708,2.42895648 C11.5426798,1.86322723 12.4640974,1.85620921 13.0496196,2.41308426 L15.5337377,4.77566479 C15.8314604,5.0588212 16,5.45170806 16,5.86258077 L16,17.9148182 C16,18.7432453 15.3284271,19.4148182 14.5,19.4148182 L9.5,19.4148182 C8.67157288,19.4148182 8,18.7432453 8,17.9148182 Z"
                                                                                    fill="currentColor" fill-rule="nonzero"
                                                                                    transform="translate(12.000000, 10.707409) rotate(-135.000000) translate(-12.000000, -10.707409) " />
                                                                                <rect fill="#000000" opacity="0.3" x="5" y="20" width="15"
                                                                                    height="2" rx="1" />
                                                                            </svg></span>
                                                                        </button>
                                                                    </td>
                                                                @endif
                                                            </tr>
                                                        @endforeach

                                                        <!--end::Products-->
                                                        <!--begin::Grand total-->
                                                        <tr>
                                                            <td colspan="@if (auth()->user()->hasRole('admin'))
                                                                {{ 8 }} @else   {{ 7 }}
                                                            @endif" class="fs-3 text-dark fw-bolder text-end">Credit Used
                                                            </td>
                                                            <td class="text-dark fs-3 fw-bolder text-end">
                                                                ₹ {{ $order->points ?? ' 0.00 ' }}</td>
                                                        </tr>
                                                        <tr>
                                                            <td colspan="@if (auth()->user()->hasRole('admin'))
                                                                {{ 8 }} @else   {{ 7 }}
                                                            @endif" class="fs-3 text-dark fw-bolder text-end">Grand Total
                                                            </td>
                                                            <td class="text-dark fs-3 fw-bolder text-end">
                                                                ₹ {{ $order->total_price ?? ' - ' }}</td>
                                                        </tr>
                                                        <!--end::Grand total-->
                                                    </tbody>
                                                    <!--end::Table head-->
                                                </table>
                                                <!--end::Table-->
                                            </div>
                                        </div>
                                        <!--end::Card body-->
                                    </div>
                                    <!--end::Product List-->
                                </div>
                                <!--end::Orders-->
                            </div>
                            <!--end::Tab pane-->
                        </div>
                        <!--end::Tab content-->
                    </div>
                </div>

                <div class="modal fade" id="kt_modal_update_order_details_quantity" tabindex="-1" aria-hidden="true">
                    <!--begin::Modal dialog-->
                    <div class="modal-dialog modal-dialog-centered mw-650px">
                        <!--begin::Modal content-->
                        <div class="modal-content">
                            <!--begin::Modal header-->
                            <div class="modal-header">
                                <!--begin::Modal title-->
                                <h2 class="fw-bold">Update Product Quantity</h2>
                                <!--end::Modal title-->
                                <!--begin::Close-->
                                <div class="btn btn-icon btn-sm btn-active-icon-primary close-modal">
                                    <!--begin::Svg Icon | path: icons/duotune/arrows/arr061.svg-->
                                    <span class="svg-icon svg-icon-1">
                                        <svg width="24" height="24" viewBox="0 0 24 24" fill="none"
                                            xmlns="http://www.w3.org/2000/svg">
                                            <rect opacity="0.5" x="6" y="17.3137" width="16" height="2"
                                                rx="1" transform="rotate(-45 6 17.3137)" fill="currentColor" />
                                            <rect x="7.41422" y="6" width="16" height="2" rx="1"
                                                transform="rotate(45 7.41422 6)" fill="currentColor" />
                                        </svg>
                                    </span>
                                    <!--end::Svg Icon-->
                                </div>
                                <!--end::Close-->
                            </div>
                            <!--end::Modal header-->
                            <!--begin::Modal body-->
                            <div class="modal-body scroll-y mx-5 mx-xl-15 my-7">
                                <!--begin::Form-->
                                <form id="kt_modal_update_order_details_quantity_form" class="form" data-action="{{ route('order.update-order-details-quantity') }}">
                                    @csrf
                                    <!--end::Input group-->
                                    <div class="col-md-12 fv-row lable_pd_style_tag">
                                        <input type="hidden" id="order_id" name="order_id">
                                        <input type="hidden" id="order_details_id" name="order_details_id">

                                        <label class="fs-6 fw-semibold form-label mb-2">
                                            <span class="required">New Quantity</span>
                                        </label>
                                        <!--end::Label-->
                                        <!--begin::Input-->
                                        <input class="form-control form-control-solid" placeholder="Enter Product Quantity"
                                            name="quantity" id="order_details_quantity" oninput="this.value = this.value.replace(/[^0-9.]/g, '').replace(/(\..*?)\..*/g, '$1');">
                                        {{-- <span id="validate_credit_limit" class="mt-2" style="color: red"></span> --}}
                                        <!--end::Input-->
                                    </div>
                                    <!--begin::Actions-->
                                    <div class="text-center pt-15">
                                        <button type="reset" class="btn btn-light me-3 close-modal">Discard</button>
                                        <button type="submit" id="updateCreditLimitBtn" class="btn btn-primary"
                                            data-kt-pilldrop-modal-action="submit">
                                            <span class="indicator-label">Update</span>
                                            <span class="indicator-progress">Please wait...
                                                <span
                                                    class="spinner-border spinner-border-sm align-middle ms-2"></span></span>
                                        </button>
                                    </div>
                                    <!--end::Actions-->
                                </form>
                                <!--end::Form-->
                            </div>
                            <!--end::Modal body-->
                        </div>
                        <!--end::Modal content-->
                    </div>
                    <!--end::Modal dialog-->
                </div>
                <!--end::Order details page-->
            </div>
            <!--end::Content container-->
        </div>
        <!--end::Content-->
    </div>
@endsection
@push('script')
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.5.3/jspdf.min.js"></script>
<script type="text/javascript" src="https://html2canvas.hertzen.com/dist/html2canvas.js"></script>
<script src="{{ asset('assets/js/order/order-quantity-update.js') }}"></script>
    <script>
        $(document).ready(function () {
            $('#cmd').click(function () {
                var HTML_Width = $("#content").width();
                var HTML_Height = $("#content").height();
                var top_left_margin = 15;
                var PDF_Width = HTML_Width + (top_left_margin * 2);
                var PDF_Height = (PDF_Width * 1.5) + (top_left_margin * 2);
                var canvas_image_width = HTML_Width;
                var canvas_image_height = HTML_Height;
                var orderNo = $('#order_no').html();

                var totalPDFPages = Math.ceil(HTML_Height / PDF_Height) - 1;

                html2canvas($("#content")[0]).then(function (canvas) {
                    var imgData = canvas.toDataURL("image/jpeg", 1.0);
                    var pdf = new jsPDF('p', 'pt', [PDF_Width, PDF_Height]);
                    pdf.addImage(imgData, 'JPG', top_left_margin, top_left_margin, canvas_image_width, canvas_image_height);
                    for (var i = 1; i <= totalPDFPages; i++) {
                        pdf.addPage(PDF_Width, PDF_Height);
                        pdf.addImage(imgData, 'JPG', top_left_margin, -(PDF_Height*i)+(top_left_margin*4),canvas_image_width,canvas_image_height);
                    }
                    pdf.save(orderNo+".pdf");
                });
            });
        });
    </script>
@endpush