@extends('user-layouts.user_template')
@section('content')
    <style>
        .badge-error {
            background-color: #b94a48;
        }
        .product-name-holder{
            white-space: nowrap;
            overflow: hidden;
            text-overflow: ellipsis;
        }
    </style>
    <div class="content-wrapper" style="min-height: 916px;">
        <!-- Content Header (Page header) -->
        <section class="content-header">
            <h1>
                Store Items
                <!-- <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 Items</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>
                        <!-- <form role="form" id="frm-change-password"> -->
                            <div class="box-body">
                                <div class="row">
                                    <div class="col-md-12">
                                        <div class="well">
                                            <a href="{{ url('user/store-items/add-item') }}" type="button" class="btn btn-primary">
                                                <i class="fa fa-plus"></i> Add new Item
                                            </a>
                                            <a href="{{ url('user/store-items/re-arrange') }}" class="btn btn-primary"><i class="fa fa-exchange"></i> Re-arrange item</a>
                                        </div>
                                    </div>
                                  <!-- BEGIN PRODUCTS -->
                                  
                                    @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 class="col-md-3 col-sm-6">
                                                <div class="thumbnail" >
                                                        <a href="{{ url('user/store-items/item') }}/{{ $product->ProductURL }}">
                                                            <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>
                                                    <hr class="line">
                                                    <a href="{{ url('user/store-items/item') }}/{{ $product->ProductURL }}" class="btn btn-success btn-block" > View Details</a>
                                                </div>
                                            </div>
                                    @endforeach
                                </div>
                               
                            </div>
                            <div class="box-footer">
                                <!-- <button type="submit" class="btn btn-primary btn-custom-save">update</button> -->
                            </div>
                        <!-- </form> -->
                    <div>
                </div>
            </div>
        </section>
    <!-- /.content -->
    </div>
@endsection