@extends('web.layout.master')

@section('content')
<style>
    #removegear {
        position: relative;
        float: right;
        top: -2px;
        z-index: 99;
        font-size: 20px;
        right: 20px;
    }
</style>
<div class="container" >
     <div class="row justify-content-center">
        <div class="col-sm-7 mx-auto" >
            <div class="mt-3 text-black font-weight-bold d-lg-none">
                <label class="fs-1"><b>My Gear</b></label>
            </div>
            <div class="text-center mt-4 text-black font-weight-bold d-none d-lg-block">
                <label class="fs-1">My Gear</label>
            </div>
        </div>
    </div>
    <div class="row d-none d-lg-block">
        <div class="col-md-12 text-end" >
            <div class="mt-4 text-black font-weight-bold">
                <a  href="{{ route('my-info') }}" class="" style="font-size: 18px;">My Info</a>&nbsp; |&nbsp; <a  href="{{ route('my-order') }}" class="" style="font-size: 18px;">My Orders</a>
            </div>
        </div>
    </div>
    @foreach (['danger', 'warning', 'success', 'info'] as $msg)
    @if(Session::has('alert-' . $msg))

    <p class="alert alert-{{ $msg }}">{{ Session::get('alert-' . $msg) }}</p>
    @endif
    @endforeach
    <div class="row mt-3">
        <div class="col-sm-10" >

            <div class=" text-black font-weight-bold d-lg-none">
                <a  href="{{ route('my-info') }}" class="" style="font-size: 18px;">My Info</a>
            </div>
            <hr class="d-lg-none">
            <div class=" text-black font-weight-bold d-lg-none">
                <a  href="{{ route('my-order') }}" class="" style="font-size: 18px;">See my Order</a>
            </div>
            <hr class="d-lg-none">

        </div>
    </div>
    <h3 class="mt-2">Models</h3>
    <div class="row mt-2" id="myGearModels">

    </div>
    <h3 class="mt-4">Parts</h3>
    <div class="row mt-2">
        @forelse ($wishlistparts as $parts)
            <div class="col-md-3 col-sm-6 p-2 col-xs-6 text-center">
                <div id = "removegear" >
                    <a href="{{ route('wishlist-remove',[$parts->ProductCode,1]) }}" class="text-black" aria-label=""><i class="fa fa-times" aria-hidden="true"></i></a>
                </div>
                                <a href="{{ route('part-details-new',[$pname1.'-p',$parts->ProductCode.'.html']) }}" class="text-decoration-none text-black" aria-label="">
                    <div class="card p-2 align-items-center" style="height: 220px;">
                        <img alt="..." src="https://s3.us-central-1.wasabisys.com/partswarehouse/photos/{{ $parts->ProductCode }}-2.jpg"
                            onerror="this.onerror=null;this.src=&quot;https://s3.us-central-1.wasabisys.com/partswarehouse/photos/NO_PRODUCT_IMAGE-2.jpg&quot;"
                            class="mt-2" style="width:60px;height: 60px;">
                        <span class="text-center mt-4">{{ $parts->Name }}</span>
                        <span class="text-center text-danger mt-2 " >{{ $parts->ProductCode }}</span>
                    </div>
                </a></div>
        @empty
            {{-- <p>My Gear Part Not Found</p> --}}
            <p>No Parts Saved Yet</p>
        @endforelse

    </div>

</div>
<script>
    var subcatID = 0;
    var modeldetailUrl = "";
    var wishlistUrl = "";
    $( document ).ready(function() {
        @if(!empty($wishlistmodels))
            @foreach ($wishlistmodels as $modid)

		@if(!empty($modid["modid"]))
                wishlistUrl = '{{ route("wishlist-remove",[$modid["modid"],2]) }}';
                myGearModels("{{ $modid['subcat']  }}",1,"",wishlistUrl);
		@endif
            @endforeach
        @else
            // $('#myGearModels').html('<p>My Gear Model Not Found</p>');
            $('#myGearModels').html('<p>No Models Saved Yet</p>');
        @endif


    });
</script>

@endsection