@extends('user-layouts.user_template')
@section('content')
    <style>
        .badge-error {
            background-color: #b94a48;
        }
        .product-name-holder{
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }

        #item_list_sort{
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            grid-gap: 10px;
        }
    </style>
    <div class="content-wrapper" style="min-height: 916px;">
        <!-- Content Header (Page header) -->
        <section class="content-header">
            <h1>
                Store Item Arrangement
                <!-- <small>Control panel</small> -->
            </h1>
            <ol class="breadcrumb">
                <li><a href="{{ url ('user') }}"><i class="fa fa-home"></i> Home</a></li>
                <!-- <li><a href="{{ url ('user/profile') }}"><i class="fa fa-user"></i> My Profile</a></li> -->
                <li class="active">Store Item Arrangement</li>
               
            </ol>
        </section>

        <!-- Main content -->
        <section class="content">
            <div class="row">
                <div class="col-md-12">
                    <div class="box box-primary">
                        <div class="box-header with-border">
                            <h3 class="box-title">
                                Item List
                            </h3>
                        </div>
                        <div class="box-body">
                            <div class="row">
                                <div class="col-md-12">
                                    <div class="well">
                                        <button type="button" id="btn_save_item_sorting" class="btn btn-primary">
                                            Save Changes
                                        </button>
                                        <a href="{{ url('user/store-items') }}" class="btn btn-default"> Cancel</a>
                                    </div>
                                </div>
                            </div>
                            <div id="item_list_sort">
                                @foreach($product_array as $i => $product)
                                    @foreach($thumbnails as $t => $thumb)
                                        @if($thumb['product_id'] == $product->Id)
                                            @define $storeFolder = $thumb['folder']
                                            @define $filename = $thumb['thumb']
                                        @endif
                                    @endforeach
                                    <div id="{{ 'order_number_' . $product->Id }}">
                                        <div class="thumbnail" >
                                            <a href="#">
                                                <img style="height:200px" src="{{ config('site_config.images_url')  }}/{{ $filename . '?t=' . time() }}" alt="{{ $product->ProductName }}" >
                                            </a>
                                            <hr class="line">
                                            <div class="pull-right">
                                                <div style="text-transform: uppercase;" class="badge  @if($product->PrivacyStatus== 'private') badge-error @endif">{{ $product->PrivacyStatus  }}</div>
                                            </div>
                                            <h4 class="product-name-holder">{{ $product->ProductName }}<br><small>$ {{ $product->ProductPrice }}</small></h4>
                                        </div>
                                    </div>
                                @endforeach
                            </div>
                        </div>
                    <div>
                </div>
            </div>
        </section>
    <!-- /.content -->
    </div>
@endsection