@extends('layouts.admin.app')
@section('page-title')
    {{ __('Tire Sizes') }}
@endSection

@section('page-nav-title')
    <div class="app-title">
        <div>
            <h1>{{ __('Tire Sizes') }}</h1>
            <p>{{ __('all tire sizes') }}</p>
        </div>
        <ul class="app-breadcrumb breadcrumb">
            <li class="breadcrumb-item"><i class="fa fa-home fa-lg"></i></li>
            <li class="breadcrumb-item"><a href="{{ route('admin.dashboard.index') }}">{{ __('Dashboard') }}</a></li>
            <li class="breadcrumb-item"><a href="#">{{ __('Tire Sizes') }}</a></li>
        </ul>
    </div>
@endsection

@section('content')
    @include('includes.dialog')

    <div class="row">
        {{--        <div class="col-md-6 col-lg-3"> --}}
        {{--            --}}{{--                <a style="  text-decoration: none" href="{{route("admin.Products.index",$main_category_id)}}"> --}}
        {{--            <div class="widget-small  coloured-icon"> --}}
        {{--                <div  style="background: #1e7e34; height: 75px"> --}}
        {{--                    <i class="icon fa fa-cog fa-spin fa-3x fa-fw"></i> --}}
        {{--                </div> --}}
        {{--                <div class="info" style="background-color: white; color:black; height: 75px; padding-top: 10px" > --}}
        {{--                    <h4><b>{{__("Tire Products")}}</b></h4> --}}
        {{--                    <p><b id="products">{{count($products)}}</b></p> --}}
        {{--                </div> --}}
        {{--            </div> --}}
        {{--            --}}{{--                </a> --}}
        {{--        </div> --}}
        <div class="container">
            <form action="{{ route('admin.Products.search', ['main_id' => $main_id]) }}" method="POST" role="search">
                {{ csrf_field() }}
                <div class="input-group">
                    <input type="text" class="form-control" name="product" placeholder="Search Product Name">
                    <span class="input-group-btn">
                        <button type="submit" class="btn btn-default">
                            <i class="fa fa-search" aria-hidden="true"></i>
                        </button>
                    </span>
                </div>
            </form>
        </div>
        <div class="col-md-12">
            <div class="buttons-group"></div>
            <div class="tile">
                <div class="tile-body">
                    <div class="table-responsive" id="purchase_order">
                        <table class="table table-hover table-bordered text-center" id="sampleTable">
                            <thead>
                                <tr>
                                    <th>{{ __('ID') }}</th>
                                    <th>{{ __('Main Image') }}</th>
                                    <th>{{ __('Attachment File') }}</th>
                                    <th>{{ __('Name') }}</th>
                                    <th>{{ __('Description') }}</th>
                                    <th>{{ __('Sell Price') }}</th>
                                    <th>{{ __('Secondary Price') }}</th>
                                    <th>{{ __('Item Balance') }}</th>
                                    <th>{{ __('Available Years') }}</th>
                                    <th>{{ __('Size Details') }}</th>
                                    <th>{{ __('users-rating') }}</th>
                                    <th>{{ __('Control') }}</th>

                                </tr>
                            </thead>
                            <tbody>
                                @foreach ($products as $product)
                                    <tr>
                                        <td>{{ $product->id }}</td>
                                        <td>
                                            @if ($product->getFirstMediaFile('default'))
                                                <img src="{{ $product->getFirstMediaFile('default')->url }}" alt="" width="50px" height="50px">
                                            @endif
                                        </td>
                                        {{--                                        <td>{{__("Hello All Images")}}</td> --}}
                                        {{-- 
                                        <td>
                                            <button type="button" class="btn btn-primary view-attachemnts" data-toggle="modal" data-target="#image{{ $product->id }}">
                                                View
                                            </button>
                                            <!-- Modal -->
                                            <div class="modal fade" id="image{{ $product->id }}" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
                                                <div class="modal-dialog modal-xl">
                                                    <div class="modal-content" style="height: 800px;overflow-y: auto;">
                                                        <div class="modal-header">
                                                            <h5 class="modal-title" id="exampleModalLabel">All Images</h5>
                                                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                                <span aria-hidden="true">&times;</span>
                                                            </button>
                                                        </div>
                                                        <div class="modal-body mt-2 mb-2">
                                                            <div class="row">
                                                                @if ($product->getFirstMediaFile('product_photo'))
                                                                    @foreach ($product->getMediaFiles('product_photo') as $file)
                                                                        <div class="col-4">
                                                                            <img src="{{ $file->url }}" width="100%">
                                                                        </div>
                                                                    @endforeach
                                                                @endif
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </td> --}}
                                        <td>
                                            <button type="button" class="btn btn-primary view-attachemnts" data-toggle="modal" data-target="#file{{ $product->id }}">
                                                {{ __('View') }}
                                            </button>
                                            <!-- Modal -->
                                            <div class="modal fade" id="file{{ $product->id }}" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
                                                <div class="modal-dialog modal-xl">
                                                    <div class="modal-content" style="height: 800px;overflow-y: auto;">
                                                        <div class="modal-header">
                                                            <h5 class="modal-title" id="exampleModalLabel">{{ __('Attachment File') }}</h5>
                                                            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                                <span aria-hidden="true">&times;</span>
                                                            </button>
                                                        </div>
                                                        <div class="modal-body mt-2 mb-2">
                                                            <div class="row">
                                                                <div class="col-4">
                                                                    @if ($product->getFirstMediaFile('attachment'))
                                                                        <iframe src="{{ $product->getFirstMediaFile('attachment')->url }}" width="1000px" height="1000px"> </iframe>
                                                                    @endif
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </td>
                                        <td>{{ $product->getNameAttribute() }}</td>
                                        <td>{{ $product->getDescriptionsAttribute() }}</td>
                                        <td>{{ $product->origin_price . ' JD' }}</td>
                                        <td>{{ $product->second_price . ' JD' }}</td>
                                        <td>@if(!is_null($product->itemBalance)) {{ $product->itemBalance->item_balance }}@endif</td>
                                        <td><a href="{{ route('admin.Products.available-year', ['id' => $product->id, 'page' => request()->page]) }}" class="btn btn-primary">{{ __('View') }}</a></td>
                                        <td><a href="{{ route('admin.Products.details', $product->id) }}" class="btn btn-primary">{{ __('View') }}</a></td>
                                        <td class="text-center"><a href="{{ route('admin.Products.rating', $product->id) }}"><i class="fas fa-star" style="font-size:17px;margin-top:17px;"></i></a></td>
                                        {{--                                        <td> --}}
                                        {{--                                            <div class="toggle-flip changes-status"> --}}
                                        {{--                                                <label> --}}
                                        {{--                                                    <input type="checkbox" class="changes-status"  data-url="{{route("ajax.product.change_status",$product->id)}}" id="status{{$product->id}}}" data-status-type="product" data-id="{{$product->id}}" {{checked("status", true, $product)}}><span class="flip-indecator" data-toggle-on="{{__("ON")}}" data-toggle-off="{{__("OFF")}}"></span> --}}

                                        {{--                                                </label> --}}
                                        {{--                                            </div> --}}
                                        {{--                                        </td> --}}


                                        {{--                                        <td> --}}
                                        {{--                                            <div class="toggle-flip changes-status"> --}}
                                        {{--                                                <label> --}}
                                        {{--                                                    <input type="checkbox" class="changes-status" data-url="{{route("ajax.product.change_status", $product->id )}}" id="status{{$product->id}}"  data-status-type="user" data-id="{{$product->id}}" {{checked("status",true,$product)}}> --}}
                                        {{--                                                    <span class="flip-indecator" data-toggle-on="{{__("On")}}" data-toggle-off="{{__("Off")}}"></span> --}}
                                        {{--                                                </label> --}}
                                        {{--                                            </div> --}}
                                        {{--                                            <span class="status-box @if ($product->status) bg-active-color @else bg-non-active-color @endif"> --}}
                                        {{--                                                {{$product->status ?__("Active") : __("Non-Active")}} --}}
                                        {{--                                            </span> --}}
                                        {{--                                        </td> --}}

                                        {{--                                        <td>@if ($product->getFirstMediaFile('default')) <img src="{{ $product->getFirstMediaFile('default')->url}}" alt="" width="50px">@endif</td> --}}

                                        <td>
                                            {{--                                            <input type="hidden" value="{{ request()->page  }}"> --}}
                                            <a id="href" href="{{ route('admin.Products.edit', ['id' => $product->id, 'page' => request()->page]) }}" class="control-link edit"><i class="fas fa-edit"></i></a>
                                            {{--
     <form action="{{route("admin.Products.destroy", $product->id)}}" method="post" id="delete{{$product->id}}" style="display: none" data-swal-title="{{__("Delete product")}}" data-swal-text="{{__("Are You Sure To Delete This products?")}}" data-yes="{{__("Yes")}}" data-no="{{__("No")}}" data-success-msg="{{__("the product has been deleted succssfully")}}">@csrf @method("delete")</form> --}}
                                            {{--                                            <span href="#" class="control-link remove form-confirm" data-form-id="#delete{{$product->id}}"><i class="far fa-trash-alt"></i></span> --}}
                                        </td>
                                    </tr>
                                @endforeach
                                {{--                            @endif --}}
                            </tbody>
                        </table>
                        <div>
                            @if (!isset($search))
                                @if (count($products) != 0)
                                    {{ $products->links() }}
                                @endif
                            @endif
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

@endsection

@section('scripts')
    <!-- Data table plugin-->
    <script type="text/javascript" src="{{ asset('assets/js/plugins/jquery.dataTables.min.js') }}"></script>
    <script type="text/javascript" src="{{ asset('assets/js/plugins/dataTables.bootstrap.min.js') }}"></script>
    <script type="text/javascript">
        $('#sampleTable').DataTable();
    </script>
    <script>
        const y = window.location.search;
        console.log(y);
        const urlParams = new URLSearchParams(y)

        const page = urlParams.get('page')
        console.log(page)
    </script>
@endsection