{php $this->template('header')}
	
	<link rel="stylesheet" href="{$public}css/shop/trace/index.css?{php echo time()}">
	
	<div class="bui-page ">

		<main class="main">
		

	        <div id="scrollList" class="bui-scroll">
	        	<div class="img text-c" style="display: none;"> <!-- --> 
					<img src="{$public}img/empty.png" style="width: 4rem;margin-top: 3rem;">
					<p>空空如也...</p>
				</div>
				<div class="bui-scroll-head"></div>
				<div class="bui-scroll-main">
					<ul class="bui-list bui-list-thumbnail bui-list-pic bui-fluid-space-2">
			               
			        </ul>
				</div>
				<div class="bui-scroll-foot"></div>
			</div>

		</main>
		
	</div>
	
	

	<script>
 
		bui.ready(function(){
			
			
		 var uiList = bui.list({
		        id: "#scrollList",
		        url: "{php echo iurl('shop/trace/index')}",
		        pageSize: 10,
		        data: {},
		        field: {
		            page: "page",
		            size: "pageSize",
		            data: "data"
		        },
		        template: function(data) {
		            var html = "";
		            data.forEach(function(el, index) {

		                html += `
								<li>
				                    <div class="bui-pic click" data-url="{php echo iurl('shop/index/item')}&id=${el.gid}">
				                        <div class="bui-pic-img bgauto" style="background-image:url(${el.img})"></div>
				                        <div class="bui-pic-title">${el.title}</div>
				                        <div class="price"><i>￥</i>${el.price}</div>
				                    </div>
				                </li>
				                `
		            });

		            if (html=='') {

		            	$('.img').show().siblings().hide();
						return ;

		            }

		            return html;
		        },
		       
		    })
 
		})
	



   
	</script>