@extends('frontend_layouts.main')
@section('main-container')

<section class="py-sm-5 py-4">
            <div class="container">
                <div class="volumetric-calculatorbox">
                    <div class="row mt-sm-5 mt-3">
                        <div class="col-md-7 mb-3 mb-sm-0">
                            <div class="section-head section-headwhite">
                                <h2>Track Your Order</h2>
                            </div>

                            <div class="row mt-sm-4 mt-3">
                                <div class="col-md-6">
                                    <div class="form-group">
                                        <input type="text" name="awb" class="form-control length-input" placeholder="Enter AWB No." id="order_awb">
                                    </div>
                                </div>
        
                                <div class="col-md-6">
                                    <button type="button" data-toggle="modal" data-target="#exampleModal" class="btn features-btn" onclick="trackOrder();">CHECK STATUS</button>
                                </div>
                            </div>
                        </div>
                        <div class="col-md-5">
                            <img class="track-order-img" src="{{asset('assets/frontend/images/HowStep4.png')}}" alt="">
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <div class="chat-bot">
        <a href="https://web.whatsapp.com/send?phone=7042004334" target="_blank"><i class="fa fa-whatsapp" aria-hidden="true"></i></a>
            <!-- <img src="{{asset('assets/frontend/images/what-new.png')}}" alt=""> -->
        </div>
        <div class="modal fade pop-content" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title head-textsatus" id="exampleModalLabel">Status</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body text-center">
                    <div class="row py-4">
                        <div class="col-md-12"> 
                            <h4 id="order-status">Processing</h4>
                            
                        </div>
                    </div>
                    </div>
                </div>
            </div>
        </div>

        <style>
            .section-headwhite{
                margin-top: 48px!important;
            }
            .track-order-img{
                height: 336px!important;
            }
        </style>

<script>
    function trackOrder(){
        let orderOrAwb = $('#order_awb').val();

        $.ajax({
            url: "{{ url('/order-tracking') }}",
            data: {'orderOrAwb':orderOrAwb},
            success: function(data){
                let status = data[0] ?  data[0] : data[1];
                let status1 = '';

                if(data==''){

                    status1 = 'No record found.';
                    return $('#order-status').text(status1);

                }

                if(status == 'pickup_pending'){
                    status1 = 'Pickup Pending';

                }if(status == 'picked'){
                    status1 = 'Picked';

                }if(status == 'pickup_pending'){
                    status1 = 'Pickup Pending';
                }
                if(status == 'out_for_pickup'){
                    status1 = 'Out For Pickup';
                }
                if(status == 'manifest'){
                    status1 = 'Manifest';
                }
                if(status == 'ndr'){
                    status1 = 'NDR';
                }
                if(status == 'cancelled'){
                    status1 = 'Cancelled';
                }
                if(status == 'shipped'){
                    status1 = 'Shipped';
                }
                if(status == 'in_transit'){
                    status1 = 'Intransit';
                }
                if(status == 'out_for_delivery'){
                    status1 = 'Out For Delivery';
                }
                if(status == 'delivered'){
                    status1 = 'Delivered';
                }
                if(status == 'lost'){
                    status1 = 'Lost';
                }
                if(status == 'rto_initiated'){
                    status1 = 'RTO Initiated';
                }
                if(status == 'rto_in_transit'){
                    status1 = 'RTO Intransit';
                }
                if(status == 'rto_delivered'){
                    status1 = 'RTO Delivered';
                }
                if(status == 'rto_lost'){
                    status1 = 'RTO Lost';
                }if(status == 'rto'){
                    status1 = 'RTO';
                }
                if(status == 'processing'){
                    status1 = 'Processing';
                }
                
                $('#order-status').text(status1);
            }
        });
    }
</script>
@endsection