<div ui-view="shop-detail">
	<!--轮播图区域开始-->
	<div class="container-fluid" ng-hide="hideType">
		<div ui-view="carousel"></div>
	</div>
	<!--轮播图区域结束-->

	<!--分类导航栏开始-->
	<div style="width: 100%;padding: 10px 0; border-bottom: 1px solid #ccc;" ng-hide="hideType">
		<div class="container">
			<div class="row">
				<div class="col-md-20">
					<ul class="nav nav-pills shop-type">
	                    {% for key, value in cats.items %}
	                        <li ui-sref-active="active" ui-sref=".{{ key }}"><a href="">{{ value }}</a></li>
	                    {% endfor %}
					</ul>
				</div>
			</div>
		</div>
	</div>
	<!--分类导航栏结束-->
	<br />

	<div ui-view="shop-type">
		<div class="container">
			<div class="row" style="border-bottom: 1px solid #ccc;">
				<div class="col-md-18">
					<h3>最新商品<small style="color: red;">&nbsp;(New)</small></h3>
				</div>
				<div class="col-md-2" style="padding-top: 24px;">
					<a class="pull-right" ui-sref=".latest"><span class="badge">More</span>>>></a>
				</div>
			</div>
		</div>

		<!--产品展示区域开始-->
		<div class="container">
			<div class="row">
				<div ui-view="latest-list">这用于最新产品列表展示</div>
			</div>
		</div>
		<!--产品展示区域结束-->

		<div class="container">
			<div class="row" style="border-bottom: 1px solid #ccc;padding-top: 50px;">
				<div class="col-md-18">
					<h3>最热商品<small style="color: red;">&nbsp;(Hot)</small></h3>
				</div>
				<div class="col-md-2" style="padding-top: 24px;">
					<a class="pull-right" ui-sref=".hot"><span class="badge">More</span>>>></a>
				</div>
			</div>
		</div>

		<!--产品展示区域开始-->
		<div class="container">
			<div class="row">
				<div ui-view="hot-list">这用于最热产品列表展示</div>
			</div>
		</div>
		<!--产品展示区域结束-->
	</div>
</div>
<!--页脚区域开始-->
<div class="footer hidden-sm hidden-xs" style="background-color: #333333;color: #f3f3f3;">
	<div class="container">
		<div class="row" style="height: 200px;">
			<div ui-view="footer"></div>
		</div>
	</div>
</div>
<!--页脚区域结束-->
