{include file=comm/head.html}
<!-- Bootstrap Datetimepicker-->
<link type="text/css" href="{pboot:sitepublic}/datetimepicker/css/bootstrap-datetimepicker.min.css" rel="stylesheet">
<script type="text/javascript" src="{pboot:sitepublic}/datetimepicker/js/bootstrap-datetimepicker.min.js"></script>
<script type="text/javascript" src="{pboot:sitepublic}/datetimepicker/js/locales/bootstrap-datetimepicker.zh-CN.js"></script>
<script type="text/javascript" src="{pboot:sitepublic}/datetimepicker/js/format.js"></script>
<!-- Bootstrap Datetimepicker End-->
<style>
	.shop-type {
		color: #fff;
    background: #000000;
    padding: 0.01rem 0.5rem;
    font-size: medium;
    border-radius: 0.8rem;
	}
	.col-md-4 {
		background: #f7f7f79e;
	}
	</style>
<main role="main" class="">
{include file=comm/position.html}
<div class="container my-5">
      <div class="row">
        <div class="col-lg-9 pe-md-4 pe-lg-4 content mb-4">
		<div class="shadow-sm editor-content p-3 p-md-4 px-lg-4 py-md-5">
		<div class="text-strat text-md-center"><h2>{content:title}</h2>
		<p class="infos news-img"><i class="fa fa-folder-open-o"></i> <a href="{sort:link}" rel="category tag">{sort:name}</a> <i class="fa fa-calendar-minus-o"></i> 由<a style="color:#ff4900" href="javascript:void(0);"> {content:author}</a>于 {content:date time=1} 发布</p>
		<div class="line my-2"></div>
		</div>
			
		<div class="row">            
            <div class="col-md-4">
                <img src="{content:ico}" class="img-fluid" alt="{content:title}">
            </div>
            <div class="col-md-7">
				<p class="info-row">
					<span class="fw-bold">商品ID：</span>
					<span id="product_scode">{content:id}</span>
					<span class="fw-bold ms-3">库存：</span>
					<span id="product_stock">{content:ext_shop_stock}</span>
					<span class="fw-bold ms-3">类型：</span>
					<span id="product_type" class="shop-type">{content:ext_shop_type}</span>
				</p>
                <div class="row align-items-center my-3">
                    <div class="col-6">
                        <span class="fw-bold">价格：</span>
                        <span id="price">{content:ext_shop_price}</span> 元						
                    </div>
                    <div class="col-6">
                        <div class="input-group">
                            <button class="btn btn-outline-secondary" type="button" id="decreaseQuantity">-</button>
                            <input type="number" class="form-control quantity-input" id="quantity" value="1">
                            <button class="btn btn-outline-secondary" type="button" id="increaseQuantity">+</button>
                        </div>
                    </div>
                </div>
                <p class="">
					{pboot:if({pboot:shopstatus})}
					<a class="btn btn-customer px-3 py-2" id="buyNow"><i class="fa fa-credit-card"> 立即购买</i></a>
                    <!--<a class="btn btn-primary px-3 py-2 disabled" id="addToCart"><i class="fa fa-shopping-cart"> 加入购物车</i></a>-->
					{/pboot:if}
                    <a href="tencent://message/?uin={pboot:companyqq}&Site=988ps.com/ngdao&Menu=yes" class="btn btn-warning px-3 py-2 mx-2"><i class="fa fa-qq"> QQ 客服</i></a>
                    <a href="#" data-bs-toggle="modal" data-bs-target="#weixin-Modal" class="btn btn-success px-3 py-2"><i class="fa fa-weixin"> 微信客服</i></a>
                </p>
				<p><span class="text-customer">※</span> 提示：购买遇到问题请联系在线客服处理！</p>
            </div>
        </div>
			
<p class="news-img"></p>			

{content:content}
			
</div>
</div>
		<!-- col-lg-9 -->
		<div class="col-lg-3">
        <form class="sidebar-search d-flex justify-content-between mb-4" method="get" id="searchform" action="{pboot:scaction}">
<div class="ms-auto w-100">
  <input type="search" name="keyword" id="s" class="form-control" placeholder="Search...">
</div>
<button class="btn btn-search" type="submit"><i class="fa fa-search"></i></button>
</form>
<!-- sidebar-search --><div class="sidebar-news mb-4">
<div class="list-group">
<div class="section-title-page"><h4>推荐模版</h4></div>
{pboot:list scode=5 num=8 order=random}
<div class="list-group-item">
<div class="row d-flex justify-content-between align-items-center">
<span class="col-sm-12 col-md-5 col-lg-12 col-xl-5 effect-imghover mb-3 mb-lg-3  mb-xl-0 tj-img">
<a href="[list:link]"><img class="img-fluid" src="[list:ico]" class="img-fluid" alt="[list:title]"></a></span>
<span class="col-sm-12 col-md-7 col-lg-12 col-xl-7"><h6><a href="[list:link]" title="[list:title]">[list:title]</a></h6><small class="text-muted">[list:date style=Y年m月d日]</small></span>
</div>
</div>
{/pboot:list}
	
</div>
</div>
<!-- sidebar-news -->
<div class="sidebar-news mb-4">
<div class="list-group">
<div class="section-title-page"><h4>相关内容</h4></div>
{pboot:list scode={sort:tcode} num=6 order=random}
<div class="list-group-item">
<div class="row d-flex justify-content-between align-items-center">
<span class="col-sm-12 col-lg-12"><h6><a href="[list:link]" title="[list:title]">[list:title]</a></h6><small class="text-muted">[list:date style=Y年m月d日]</small></span>
</div>
</div>
{/pboot:list}
</div>
</div>
<!-- sidebar-news -->
		</div>
<!-- col-lg-3 -->
{include file=comm/comment.html}	
      </div>
</div>

</main>

{include file=shop/info.html}
{include file=comm/foot.html}