<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8" />
	<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
    <title></title>
    @style()
    <style>
        .ctx-menu{
            position: relative;
            background-color: white;
            margin-top: 5px;
        }
        .cus-count{
            position: absolute;
            right: 18px;
            top: 47px;
            color: red;
        }
        .cus-date{
            position: absolute;
            right: 7px;
            top: 70px;
            color: red;
        }
    </style>
</head>
<body style="height: 500px;">
    <!-- <div id="searchFrm">
        <div class="row">
            <input type="file" accept="image/*">
            <div class="col">
                <input class="form-control" type="text" id="plate" placeholder="Plate">
            </div>
            <div class="col-2">
                <i class="fa fa-camera"></i>
            </div>
        </div>
        <div class="row">
            <input class="form-control" type="text" id="name" placeholder="Name">
        </div>
        <div class="row">
            <input class="form-control" type="text" id="phone" placeholder="Phone">
        </div>
        <div class="row">
            <button id="btnSearch" class="btn btn-success form-control">SEARCH</button>
        </div>
    </div> -->
    <div id="listView" style="background-color: #d1d1d1;">
        @foreach($this->customers as $key=>$value) 
        <div class="cus-item ctx-menu" id="cus_all_{{$value->id}}" data-id="{{$value->id}}">
            <div class="cus-container clearfix">
                <div class="cus-image pull-left loaded" style="background-image: url({{$value->image}});">
                    <img onerror="window.onImageError(this);" onload="window.onImageLoaded(this);" src="{{$value->image}}">
                </div>
                <div class="cus-info pull-left" style="padding-top: 15px;"><b class="cus-name" style="color:royalblue">{{$value->name}}</b>
                    <div class="cus-plate" style="color:silver">{{$value->plate}}</div>
                    <div class="cus-count">{{$value->count}}</div>
                    <div class="cus-other-info clearfix">
                        <div class="cus-car-type" style="color:silver">{{$value->car}}</div>
                    </div>
                    <div class="cus-date">{{$value->created_at}}</div>
                </div>
            </div>
        </div>
        @endforeach
    </div>
    @script()
    <script>
         window['onImageLoaded'] = function(el) {
                console.log($(el).attr("src"));
            };
            window['onImageError'] = function(el) {
                $(el).attr("src","{{asset(/img/noimg.jpg)}}");
                console.log($(el).attr("src"));
            };
    </script>
</body>
</html>