@include('frontend.includes.header',[
    'meta_title' => 'My Profile | FeatherFresh',
    'meta_description' => 'Discover FeatherFresh’s journey in crafting quality mattresses, pillows & comforters. Rooted in comfort, backed by trust & built for better sleep in India.',
    'meta_robots' => 'noindex,nofollow'
])

    <!--Hero Section-->
    <div class="hero-section hero-background">
        <h1 class="page-title">My Profile</h1>
    </div>

    <!--Navigation section-->
    <div class="container">
        <nav class="biolife-nav">
            <ul>
                <li class="nav-item"><a href="{{ url('/') }}" class="permal-link">Home</a></li>
                <li class="nav-item"><span class="current-page">{{$user->name}}</span></li>
            </ul>
        </nav>
    </div>

    <div class="page-contain checkout">

        <!-- Main content -->
        <div id="main-content" class="main-content">
            <div class="container sm-margin-top-37px">
                <div class="row">

                    <!--checkout progress box-->
                    <div class="col-lg-5 col-md-5 col-sm-4 col-xs-12">
                        <div class="checkout-progress-wrap">
                            <ul class="steps">
                                <li class="step 1st">
                                    <div class="checkout-act active">
                                        <h3 class="title-box">
                                            {{-- <span class="number">1</span> --}}
                                            Personal Information</h3>
                                        <div class="box-content">
                                            <p class="txt-desc">
                                                Signin Credentials
                                                {{-- Checking out as a <a class="pmlink" href="#">Guest?</a> You’ll be able to save your details to create an account with us later. --}}
                                            </p>
                                            <div class="login-on-checkout">
                                                <form name="frm-login" method="post">
                                                    @csrf
                                                    <p class="form-row">
                                                        <label for="input_email">Name</label>
                                                        <div class="position-relative">
                                                            <input type="text" name="name" id="input_email" disabled value="{{$user->name}}" placeholder="Your Username" class="w-100">
                                                            <i id="user_icon" class="fas fa-pencil position-absolute"></i>
                                                        </div>
                                                    </p>
                                                    <p class="form-row">
                                                        <label for="input_email">{{$user->email ? 'Email' : 'Number'}}</label>
                                                        <input type="text" name="email" id="input_email" disabled value="{{$user->email ?? $user->number}}" class="w-100" >
                                                    </p>
                                                    {{-- <p class="form-row">
                                                        <input type="checkbox" name="subcribe" id="input_subcribe" >
                                                        <label for="input_subcribe">Subscribe to our newsletter</label>
                                                    </p>
                                                    <p class="msg">Already have an account? <a href="#" class="link-forward">Sign in now</a></p> --}}
                                                    {{-- <button type="submit" name="btn-sbmt" class="btn">Save</button> --}}
                                                </form>
                                            </div>
                                        </div>
                                    </div>
                                </li>
                                {{-- <li class="step 2nd">
                                    <div class="checkout-act"><h3 class="title-box"><span class="number">2</span>Shipping</h3></div>
                                </li>
                                <li class="step 3rd">
                                    <div class="checkout-act"><h3 class="title-box"><span class="number">3</span>Billing</h3></div>
                                </li>
                                <li class="step 4th">
                                    <div class="checkout-act"><h3 class="title-box"><span class="number">4</span>Payment</h3></div>
                                </li> --}}
                            </ul>
                        </div>
                    </div>

                    <!--Order Summary-->
                    <div class="col-lg-7 col-md-7 col-sm-8 col-xs-12 sm-padding-top-48px sm-margin-bottom-0 xs-margin-bottom-15px">
                        <div class="order-summary sm-margin-bottom-80px">
                            <div class="title-block">
                                <h3 class="title">Order Summary</h3>
                                {{-- <a href="#" class="link-forward">Edit cart</a> --}}
                            </div>
                            <div class="cart-list-box short-type">
                                <span class="number">{{$orders->count()}} items</span>
                                <ul class="cart-list">
                                    @if (!function_exists('formatIndianNumber'))
                                    @php
                                    function formatIndianNumber($number) {
                                            $number = (string)$number;
                                            $lastThreeDigits = substr($number, -3);
                                            $remainingDigits = substr($number, 0, -3);
                                            
                                            if ($remainingDigits != '') {
                                                $lastThreeDigits = ',' . $lastThreeDigits;
                                            }
                                            
                                            $formattedNumber = preg_replace('/\B(?=(\d{2})+(?!\d))/', ',', $remainingDigits) . $lastThreeDigits;
                                            return $formattedNumber;
                                        }
                                    @endphp
                                    @endif
                                    @forelse($orders as $order)
                                    @foreach($order->product_ids as $key=>$product_id)
                                    <li class="cart-elem">
                                        <div class="cart-item">
                                            <div class=""><h4 class="text-muted m-1">#{{$order->id}}</h4></div>
                                            <div class="product-thumb">
                                                    @php
                                                    $product = DB::table('products')->where('id', $product_id)->first();
                                                    $images = explode(',', $product->images);
                                                    $first_img=$images[0];
                                                    @endphp
                                                <a class="prd-thumb" href="{{url('product/'.$product->slug)}}">
                                                    <figure><img src="{{url('frontend/custom/uploads/products/'.$first_img)}}" width="113" height="113" alt="shop-cart" ></figure>
                                                </a>
                                            </div>
                                            <div class="info">
                                                {{-- <span class="txt-quantity">{{$order->quantities[$key]}} x</span> --}}
                                                <a href="{{url('product/'.$product->slug)}}" class="pr-name">{{Str::limit($order->product_names[$key], 20, $end='...')}}</a>
                                            </div>
                                            <div class="info">
                                                <span class="txt-quantity">{{$order->quantities[$key]}} x {{$order->variant_details[$key]}}</span>
                                            </div>
                                            <div class="price price-contain">
                                                <ins><span class="price-amount"><span class="currencySymbol">&#8377;</span>{{formatIndianNumber($order->amount[$key])}}</span></ins>
                                            </div>
                                        </div>
                                    </li>
                                    @endforeach
                                    @empty
                                    <li>
                                        <h3>No Product</h3>
                                    </li>
                                    @endforelse
                                    {{-- <li class="cart-elem">
                                        <div class="cart-item">
                                            <div class="product-thumb">
                                                <a class="prd-thumb" href="#">
                                                    <figure><img src="assets/images/shippingcart/pr-02.jpg" width="113" height="113" alt="shop-cart" ></figure>
                                                </a>
                                            </div>
                                            <div class="info">
                                                <span class="txt-quantity">1X</span>
                                                <a href="#" class="pr-name">National Fresh Fruit</a>
                                            </div>
                                            <div class="price price-contain">
                                                <ins><span class="price-amount"><span class="currencySymbol">£</span>85.00</span></ins>
                                                <del><span class="price-amount"><span class="currencySymbol">£</span>95.00</span></del>
                                            </div>
                                        </div>
                                    </li> --}}
                                </ul>
                                {{-- <ul class="subtotal">
                                    <li>
                                        <div class="subtotal-line">
                                            <b class="stt-name">Subtotal</b>
                                            <span class="stt-price">£170.00</span>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="subtotal-line">
                                            <b class="stt-name">Shipping</b>
                                            <span class="stt-price">£20.00</span>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="subtotal-line">
                                            <b class="stt-name">Tax</b>
                                            <span class="stt-price">£0.00</span>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="subtotal-line">
                                            <a href="#" class="link-forward">Promo/Gift Certificate</a>
                                        </div>
                                    </li>
                                    <li>
                                        <div class="subtotal-line">
                                            <b class="stt-name">total:</b>
                                            <span class="stt-price">£190.00</span>
                                        </div>
                                    </li>
                                </ul> --}}
                            </div>
                        </div>
                    </div>

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

@include('frontend.includes.footer')
    
<script>
    $('#user_icon').on('click',function(){
        if($(this).hasClass('fa-pencil')){
            $(this).removeClass('fa-pencil');
            $(this).addClass('fa-check');
            $(this).addClass('text-success');
            $(this).removeClass('text-primary');
            $('input[name="name"]').attr('disabled',false);
            $('input[name="name"]').focus();
        }else{
            $(this).removeClass('fa-check');
            $(this).addClass('fa-pencil');
            $(this).removeClass('text-success');
            $(this).addClass('text-primary');
            $('input[name="name"]').attr('disabled',true);
            updateName();
        }
    });

    function updateName(){
        var name= $('input[name="name"]').val().trim();
        if(name.length < 1){
            return;
        }
        $.ajax({
            url: "{{url('updateName')}}",
            method: 'GET',
            data: {
                name: name
            },
            success: function(res){
                console.log(res);
                if(res.status == 'success'){
                    Swal.fire({
                        title: res.message,
                        icon: "success",
                        timer: 2000,
                    })
                }
            },
            error: function(xhr, status, error) {
                console.error('Error sending message:', error);
            }

        });
    }
</script>