@extends('layouts.admin_default')
    @section('content')
        <div class="content-wrapper container-xxl p-0">
            <div class="flash_messages">
                @include('flash_messages.admin_message')
            </div>
            <div class="content-header row">
                <div class="content-header-left col-md-9 col-12 mb-2">
                    <div class="row breadcrumbs-top">
                        <div class="col-12">
                            <h2 class="content-header-title float-start mb-0">Order Details</h2>
                            <div class="breadcrumb-wrapper">
                                <ol class="breadcrumb">
                                    <li class="breadcrumb-item"><a href="{{ route('dashboard') }}">Home</a></li>
                                    <li class="breadcrumb-item"><a href="{{ route('order_master.index') }}">Order</a></li>
                                    <li class="breadcrumb-item"><a href="javascript:void(0);">Order Details</a></li>
                                </ol>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="content-body">
                <!-- Vertical Wizard -->
                <section class="vertical-wizard">
                    <div class="bs-stepper vertical vertical-wizard-example">
                        <div class="bs-stepper-header">
                            <div class="step" data-target="#account-details-vertical" role="tab" id="account-details-vertical-trigger">
                                <button type="button" class="step-trigger">
                                    <!-- <span class="bs-stepper-box">1</span> -->
                                    <span class="bs-stepper-label">
                                        <span class="bs-stepper-title">Order Details</span>
                                    </span>
                                </button>
                            </div>
                            <div class="step" data-target="#personal-info-vertical" role="tab" id="personal-info-vertical-trigger">
                                <button type="button" class="step-trigger">
                                    <!-- <span class="bs-stepper-box">2</span> -->
                                    <span class="bs-stepper-label">
                                        <span class="bs-stepper-title">Order Product</span>
                                    </span>
                                </button>
                            </div>
                        </div>
                        <div class="bs-stepper-content">
                            <div id="account-details-vertical" class="content" role="tabpanel" aria-labelledby="account-details-vertical-trigger">
                                <div class="row">
                                    <div class="mb-1 col-md-6">
                                        <label class="form-label" for="vertical-username">Order Id</label>
                                    </div>
                                    <div class="mb-1 col-md-6">
                                        <label class="form-label" for="vertical-email">{{ $result->id }}</label>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="mb-1 col-md-6">
                                        <label class="form-label" for="vertical-username">Invoice Number</label>
                                    </div>
                                    <div class="mb-1 col-md-6">
                                        <label class="form-label" for="vertical-email">{{ $result->order_no }}</label>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="mb-1 col-md-6">
                                        <label class="form-label" for="vertical-username">Customer Name</label>
                                    </div>
                                    <div class="mb-1 col-md-6">
                                        <label class="form-label" for="vertical-email">{{ $result->client->first_name }}</label>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="mb-1 col-md-6">
                                        <label class="form-label" for="vertical-username">Email</label>
                                    </div>
                                    <div class="mb-1 col-md-6">
                                        <label class="form-label" for="vertical-email">{{ $result->client->email_id }}</label>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="mb-1 col-md-6">
                                        <label class="form-label" for="vertical-username">Contact Number</label>
                                    </div>
                                    <div class="mb-1 col-md-6">
                                        <label class="form-label" for="vertical-email">{{ $result->client->mobile_no }}</label>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="mb-1 col-md-6">
                                        <label class="form-label" for="vertical-username">Date Added</label>
                                    </div>
                                    <div class="mb-1 col-md-6">
                                        <label class="form-label" for="vertical-email">{{ date('d-m-Y',strtotime($result->date)) }}</label>
                                    </div>
                                </div>
                                <div class="row">
                                    <div class="mb-1 col-md-6">
                                        <label class="form-label" for="vertical-username">Download</label>
                                    </div>
                                    <div class="mb-1 col-md-6">
                                        <a href="{{ asset('storage/'.$result->invoice) }}" target='_blank'><i class='fa fa-download'></i>&nbsp;Download</a>
                                    </div>
                                </div>
                                <div class="d-flex justify-content-between">
                                    <button class="btn btn-outline-secondary btn-prev" disabled>
                                        <i data-feather="arrow-left" class="align-middle me-sm-25 me-0"></i>
                                        <span class="align-middle d-sm-inline-block d-none">Previous</span>
                                    </button>
                                    <button class="btn btn-primary btn-next">
                                        <span class="align-middle d-sm-inline-block d-none">Next</span>
                                        <i data-feather="arrow-right" class="align-middle ms-sm-25 ms-0"></i>
                                    </button>
                                </div>
                            </div>
                            <div id="personal-info-vertical" class="content" role="tabpanel" aria-labelledby="personal-info-vertical-trigger">
                                <table class="table table-bordered">
                                    <thead>
                                        <tr>
                                            <th style="text-align:center">Sr. No</th>
                                            <th style="text-align:center">Product Name</th>
                                            <th style="text-align:center">Qty</th>
                                            <th style="text-align:center">MRP</th>
                                            <th style="text-align:center">SP</th>
                                            <th style="text-align:center">Item Total</th>
                                        </tr>
                                        @php
                                            $sr = 1;
                                            $total_qty = 0;
                                            $total_item = 0;
                                        @endphp
                                        @foreach($result->order_product as $key => $ovalue)
                                            <tr>
                                                <td align="center">{{ $sr }}</td>
                                                <td align="center">{{ $ovalue->product_name }}</td>
                                                <td align="center">{{ $ovalue->qty }}</td>
                                                <td align="center">{{ $ovalue->mrp }}</td>
                                                <td align="center">{{ '₹ '.number_format($ovalue->sp, 2, '.', '') }}</td>
                                                <td align="center">{{ '₹ '.number_format($ovalue->item_total, 2, '.', '') }}</td>
                                            </tr>
                                            @php
                                                $total_qty += $ovalue->qty;
                                                $total_item += $ovalue->item_total;
                                                $sr++;
                                            @endphp
                                        @endforeach
                                        <tr>
                                            <td colspan="2" align="right" style="color:green;">Total Quantity</td>
                                            <td align="center">{{ $total_qty }}</td>
                                            <td colspan="3"></td>
                                        </tr>
                                        <tr>
                                            <td colspan="5" align="right">Total</td>
                                            <td align="center">{{ '₹ '.number_format($total_item,2,'.','') }}</td>
                                        </tr>
                                    </thead>
                                </table>
                                <div class="d-flex justify-content-between">
                                    <button class="btn btn-primary btn-prev">
                                        <i data-feather="arrow-left" class="align-middle me-sm-25 me-0"></i>
                                        <span class="align-middle d-sm-inline-block d-none">Previous</span>
                                    </button>
                                    <button class="btn btn-primary btn-next">
                                        <span class="align-middle d-sm-inline-block d-none">Next</span>
                                        <i data-feather="arrow-right" class="align-middle ms-sm-25 ms-0"></i>
                                    </button>
                                </div>
                            </div>
                            <br>
                            <div class="row">
                                <div class="col-12">
                                    <a href="{{ route('order_master.index') }}" class="btn btn-outline-secondary">Back</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </section>
                <!-- /Vertical Wizard -->
            </div>
        </div>

        <script>
            document.addEventListener("DOMContentLoaded", function() {
                // compony logo button
                document.getElementById('button-company-logo').addEventListener('click', (event) => {
                    event.preventDefault();

                    inputId = 'company-logo';

                    window.open('/file-manager/fm-button', 'fm', 'width=1400,height=800');
                });

                // compony fav logo button
                document.getElementById('button-company-fav-logo').addEventListener('click', (event) => {
                    event.preventDefault();

                    inputId = 'company-fav-logo';

                    window.open('/file-manager/fm-button', 'fm', 'width=1400,height=800');
                });
            });

            // input
            let inputId = '';

            // set file link
            function fmSetLink($url) {
                document.getElementById(inputId).value = $url;
            }

            $(".remove_image").click(function(){
                var imgTable = $(this).closest('.input_image');
                config_key = imgTable.find('.selected_image').attr('name');
                $.ajax({
                    url: "{{ route('setting.update.image') }}",
                    type: "POST",
                    data : {
                        "id" : '',
                        'config_key' : config_key,
                        "_token": "{{ csrf_token() }}"
                    },
                    success:function(response)
                    {
                        if (response.status==true)
                        {
                            window.location.reload();
                        }
                    }
                });
            });
        </script>
    @endsection