{extend name="$LAYOUT_MOBILE_BASE" /}
{block name="title"}{$info['goodsName']} - 积分商城 - {__block__}{/block}
{block name="meta"}
<meta name="description" content="{$info['goodsSeoDesc']}">
<meta name="Keywords" content="{$info['goodsSeoKeywords']}">
{/block}
{block name="css"}
<link rel="stylesheet"  href="__STATIC__/plugins/swiper/swiper.min.css"/>
<link rel="stylesheet"  href="__ROOT__/addons/integral/view/mobile/index/css/detail.css?v={$v}">

<link rel="stylesheet" href="__STATIC__/plugins/photoswipe/photoswipe.css">
<link rel="stylesheet" href="__STATIC__/plugins/photoswipe/default-skin/default-skin.css">
{/block}
{block name="header"}
	{php}$cartNum = WSTCartNum();{/php}
	<header class="ui-header ui-header-positive wst-header">
	    <a href="{:addon_url('integral://goods/molists')}"><i class="ui-icon-return"></i></a>
	    <ul class="ui-tab-nav">
	        <li class="switch active" onclick="javascript:pageSwitch(this,1);">商品</li>
	        <li class="switch" onclick="javascript:pageSwitch(this,2);">详情</li>
	        <li class="switch" id="appr" onclick="javascript:pageSwitch(this,3);">评价</li>
    	</ul>
		<a href="{:url('mobile/carts/index')}"><span class="cart" id="cartNum">{if($cartNum>0)}<span>{php} echo $cartNum;{/php}</span>{/if}</span></a>
		<?php if(!(Request()->isSsl())){?>
		<span class="share" onclick="javascript:shareShow();"></span>
		<?php } ?>
    </header>
{/block}
{block name="footer"}
    <div class="ui-loading-wrap wst-Load" id="Load">
	    <i class="ui-loading"></i>
	</div>
	<input type="hidden" name="" value="{$info['goodsId']}" id="goodsId" autocomplete="off">
	<input type="hidden" name="" value="{$info['goodsType']}" id="goodsType" autocomplete="off">
    <footer class="ui-footer wst-footer-btns" style="height:45px; border-top: 1px solid #e8e8e8;" id="footer">
       <div class="wst-toTop" id="toTop">
	  	<i class="wst-toTopimg"><span>顶部</span></i>
		</div>

	    <div class="ui-row-flex">
		<div class="ui-col ui-col-3 wst-go-icon">
			<div class="ui-row-flex">
				 <div class="ui-col ui-col" style="border-right: 1px solid rgba(0,0,0,.05);">
				{if($info['favGood']==0)}
			    	<button class="but" type="button"><span class="img imgfollow nofollow" onclick="javascript:WST.favorites({$info['goodsId']},0);"></span><span style="line-height: 1.5;" class="word">关注</span></button>
				    {else}
			    	<button class="but" type="button"><span class="img imgfollow follow" onclick="javascript:WST.cancelFavorite({$info['favGood']},0);"></span><span style="line-height: 1.5;" class="word">关注</span></button> 
				{/if}
				</div>
				<div class="ui-col ui-col" style="border-right: 1px solid rgba(0,0,0,.05);">
					<div class="icon"><a href="{:url('mobile/carts/index')}"><span class="img shop" id="cartNum">{if($cartNum>0)}<span>{php} echo $cartNum;{/php}</span>{/if}</span></span><span class="word">购物</span></a></div>
				</div>
			</div>
		</div>
	    <div class="ui-col ui-col-4 wst-goods_buy">
	    {if $info['status'] }
			<button id="goods_buyr" class="wst-goods_buym" type="button" onclick="javascript:cartShow(1);">立即购买</button>
		    {else}
			<button id="buyBtn" class="wst-goods_buym active" type="button" onclick="javascript:cartShow(1);" disabled>立即购买</button>
		{/if}
	    </div>
	    </div>
    </footer>
{/block}
{block name="main"}

{/* 图片查看层 */}
<div id="gallery" class="pswp" tabindex="-1" role="dialog" aria-hidden="true">
	<div class="pswp__bg"></div>
	<div class="pswp__scroll-wrap">
		<div class="pswp__container">
			<div class="pswp__item"></div>
			<div class="pswp__item"></div>
			<div class="pswp__item"></div>
		</div>
		<div class="pswp__ui pswp__ui--hidden">
			<div class="pswp__top-bar">
				<div class="pswp__counter"></div>
				<button class="pswp__button pswp__button--close" title="关闭"></button>
				<button class="pswp__button pswp__button--fs" title="全屏"></button>
				<button class="pswp__button pswp__button--zoom" title="Zoom in/out"></button>
				<div class="pswp__preloader">
					<div class="pswp__preloader__icn">
						<div class="pswp__preloader__cut">
							<div class="pswp__preloader__donut"></div>
						</div>
					</div>
				</div>
			</div>
			<div class="pswp__share-modal pswp__share-modal--hidden pswp__single-tap">
				<div class="pswp__share-tooltip">
				</div>
			</div>
			<button class="pswp__button pswp__button--arrow--left" title="Previous (arrow left)"></button>
			<button class="pswp__button pswp__button--arrow--right" title="Next (arrow right)"></button>
			<div class="pswp__caption">
				<div class="pswp__caption__center">
				</div>
			</div>
		</div>
	</div>
</div>

{if($info['goodsId']>0)}
	{/* 商品  */}
     <section class="ui-container" id="goods1">
        <div id="integral-time" sc="{:date("Y-m-d H:i:s")}" sv="{$info['startTime']}" ev="{$info['endTime']}" st="{$info['status']}"></div>
			<div class="swiper-container">
				<div class="swiper-wrapper">
					{if $info['goodsVideo']!=""}
					<div class="swiper-slide" style="width:100%;">
						<div class="wst-video-box">
						<video muted src="__RESOURCE_PATH__/{$info["goodsVideo"]}" id='previewVideo' controls="controls" autoplay="autoplay" style="width:3.75rem;height:3.75rem;"></video>
						</div>
					</div>
					{/if}
					{volist name="info['gallery']" id="ga" key="i"}
					{php}$_i = $i-1;{/php}
					<div onclick="gViewImg({$_i})" class="swiper-slide" style="width:100%;">
						<div class="wst-go-img"><a><img src="__RESOURCE_PATH__/{:WSTImg($ga,2)}"></a></div>
					</div>
					{/volist}
				</div>
				{if(count($info['gallery'])>1)}<div class="swiper-pagination"></div>{/if}
				<div class="wst-go-return" onclick="history.back()"><i class="ui-icon-prev"></i></div>
				<div class="wst-go-mores" onclick="javascript:inMore()"><i>···</i></div>
			</div>
		<div class="ui-nowrap-multi ui-whitespace wst-go-name">{$info['goodsName']}</div>
		<div class="ui-row-flex wst-go-price">
		    <div class="ui-col ui-col-3">
		    	<p style="font-size:0.13rem;">店铺价：¥{$info['shopPrice']}</p>
		    	<p class="prices">兑换价：<span class="price">¥{$info['goodsPrice']}</span> + <span class="price2">{$info['integralNum']}</span> 积分</p>
		    </div>
		</div>
		{if($info['integralDesc'])}
		<div class="ui-row-flex wst-integral-desc">
			<div class="ui-col">
			    <p>积分商城说明：{$info['integralDesc']}</p>
			</div>
		</div>
		{/if}
		<ul class="ui-list ui-list-text wst-go-ul ui-list-active">
			
		    <li style="display: none;">
		        <div class="ui-list-info">
		            <h5 class="ui-nowrap"><span class="word">优惠</span><span class="line">|</span></h5>
		        </div>
		        <span class="icon">></span>
		    </li>
		    {if !empty($info['attrs']) }
		    <li onclick="javascript:dataShow();">
		        <div class="ui-list-info">
		            <h5 class="ui-nowrap">产品参数</h5>
		        </div>
		        <span class="icon">></span>
		    </li>
		    {/if}

		    <li onclick="javascript:pageSwitch($('#appr'),3);">
		        <div class="ui-list-info">
		            <h5 class="ui-nowrap">商品评价(<span class="red">{$info['appraiseNum']}</span>)</h5>
		        </div>
		        <span class="icon">></span>
		    </li>
		</ul>
     	<div class="wst-in-titlel">
       		<span class="title">&nbsp;为您推荐</span>
      	</div>
      	{wst:goods type='recom' cache="86400" num='6' id="re"}
     	<div class="wst-go-goods" onclick="javascript:WST.intoGoods({$re['goodsId']});">
     		<div class="img j-imgAdapt">
     			<a href="javascript:void(0);" onclick="javascript:WST.intoGoods({$re['goodsId']});"><img src="__RESOURCE_PATH__/{:WSTConf('CONF.goodsLogo')}" data-echo="__RESOURCE_PATH__/{$re['goodsImg']}" title="{$re['goodsName']|WSTStripTags}"></a>
     		</div>
     		<p class="name ui-nowrap-multi">{$re['goodsName']}</p>
     		<div class="info"><span class="ui-nowrap-flex price">¥{$re['shopPrice']}</span></div>
     	</div>
     	{/wst:goods}
	    <div class="wst-clear"></div>
     </section>
    {/* 详情  */}
    <section class="ui-container" id="goods2" style="display: none;">
    	<div class="wst-go-details">{$info['goodsDesc']}</div>
    </section>
    {/* 评价  */}
    <input type="hidden" name="" value="{$info['goodsId']}" id="goodsId" autocomplete="off">
    <input type="hidden" name="" value="" id="currPage" autocomplete="off">
    <input type="hidden" name="" value="" id="totalPage" autocomplete="off">
    <section class="ui-container" id="goods3" style="display: none;">
    	<div id="evaluate-list"></div>
    </section>
<script id="list" type="text/html">
{{# if(d && d.length>0){ }}
{{# for(var i=0; i<d.length; i++){ }}
	<div class="ui-whitespace wst-go-evaluate">
		<div class="info">
			<span class="name">{{ d[i].loginName }}</span>
			{{# if(d[i].userTotalScore){ }}
            	<img src="__RESOURCE_PATH__/{{ d[i].userTotalScore }}">
            {{# } }}
            {{# var score = (d[i].goodsScore+d[i].serviceScore+d[i].timeScore)/3; }}
			{{# for(var j=1; j<6; j++){ }}
				{{# if(j <= score.toFixed(0)){ }}
                	<i class="bright"></i>
            	{{# }else{ }}       
                	<i class="dark"></i>
                {{# } }}
            {{# } }}
            <span class="time">{{ d[i].createTime }}</span>
            <div class="wst-clear"></div>
        </div>
        <div class="content">
       		<p>{{ d[i].content }}</p>
				{{# if(d[i].images){ }}
                	{{# for(var m=0; m<d[i].images.length; m++){ }}
                   		<img src="__RESOURCE_PATH__/{{ d[i].images[m] }}">
                	{{# } }}
            	{{# } }}
            <div class="wst-clear"></div>
           	<p class="word">{{ d[i].goodsSpecNames }}</p>
        </div>
		{{# if(d[i].shopReply){ }}
            <div class="reply"><p>卖家回复：<span>{{ d[i].shopReply }}</span></p></div>
        {{# } }}
    </div>
{{# } }}
{{# }else{ }}
	<ul class="ui-row-flex wst-flexslp">
		<li class="ui-col ui-flex ui-flex-pack-center">
		<p>对不起，没有相关评论。</p>
		</li>
	</ul>
{{# } }}
</script>
{else}
 <ul class="ui-row-flex wst-flexslp">
	<li class="ui-col ui-flex ui-flex-pack-center">
	<p>对不起，没有找到商品。</p>
	</li>
</ul>
{/if}
{/block}
{block name="include"}

{/* 遮盖层  */}
<div class="wst-cover" id="cover"></div>
{/* 参数框  */}
{if !empty($info['attrs']) }
<div class="wst-fr-box" id="frame">
	<div class="title"><span>产品参数</span><i class="ui-icon-close-page" onclick="javascript:dataHide();"></i><div class="wst-clear"></div></div>
	<div class="content" id="content">
		{volist name="$info['attrs']" id="at"}
			{$at['attrName']}：{$at['attrVal']}<br/>
		{/volist}
	</div>
	<button class="button" onclick="javascript:dataHide();">确定</button>
</div>
{/if}
{/*加入购物车框  */}
<div class="wst-cart-box" id="frame-cart">
	<div class="title">
     	<div class="picture"><div class="img"><a href="javascript:void(0);"><img src="__RESOURCE_PATH__/{:WSTImg($info['goodsImg'],2)}" title="{$info['goodsName']|WSTStripTags}"></a></div></div>
		<i class="ui-icon-close-page" onclick="javascript:cartHide();"></i>
		<p class="ui-nowrap-multi">{$info['goodsName']}</p>
		<p class="prices">兑换价：<span class="price">¥{$info['goodsPrice']}</span> + <span class="price2">{$info['integralNum']}</span> 积分</p>
		<div class="wst-clear"></div>
	</div>
	<div class="standard" id="standard">
	{if!empty($info['spec'])}
	{volist name="$info['spec']" id="sp"}
	<div class="spec">
		<p>{$sp['name']}</p>
		{volist name="sp['list']" id="sp2"}
		{if $sp2['itemImg']!=''}
			<img class="j-option img active" data-val="{$sp2['itemId']}" src="__RESOURCE_PATH__/{$sp2['itemImg']}" title="{$sp2['itemName']|WSTStripTags}">
		{else}
			<span class="j-option active" data-val="{$sp2['itemId']}">{$sp2['itemName']}</span>
		{/if}
		{/volist}
		<div class="wst-clear"></div>
	</div>
	{/volist}
	{/if}
	<div class="number">
		<p>数量</p>
		<div class="stock">库存：<span>{$info['totalNum']-$info['orderNum']}</span>{$info['goodsUnit']}</div>
	  	<div class="wst-buy_l">
           <input class="wst-buy_l1" type="button" value="-" onclick='javascript:WST.changeIptNum(-1,"#buyNum")'><input id="buyNum" class="wst-buy_l2" data-min='1' data-max='' type="number" value="1" autocomplete="off" onkeyup='WST.changeIptNum(0,"#buyNum")'><input class="wst-buy_l3" type="button" value="+" onclick='javascript:WST.changeIptNum(1,"#buyNum")'>
      	</div>
		<div class="wst-clear"></div>
	</div>
	</div>
	<button class="button" onclick="javascript:addCart({$info['goodsType']});">确定</button>
</div>
{/block}
{block name="js"}
<script>
	{php}
	$gallery = implode(',',$info['gallery']);
	{/php}

var goodsInfo = {
	id:{$info['goodsId']},
	integralId:{$info['id']},
	isSpec:{$info['isSpec']},
	goodsStock:{$info['goodsStock']},
	marketPrice:{$info['marketPrice']},
	goodsPrice:{$info['shopPrice']}
	{if isset($info['saleSpec'])}
	,sku:{:json_encode($info['saleSpec'])}
	{/if}
	,gallery:"{$gallery}",
}

		$(function(){
			if(goodsInfo.gallery!=''){
				goodsInfo.gallery = goodsInfo.gallery.split(',').map(function(imgUrl,i){
					imgUrl = WST.conf.RESOURCE_PATH+"/"+imgUrl;
					var _obj = { src:imgUrl, w:WST.pageWidth(), h:100 };
					gGetImgWH(imgUrl,i);
					return _obj;
				})
			}
		})

//弹框
function shareShow(){
	jQuery('#cover').attr("onclick","javascript:shareHide();").show();
	jQuery('#frame-share').animate({"bottom": 0}, 500);
}
function shareHide(){
	var cartHeight = parseInt($("#frame-cart").css('height'))+52+'px';
	jQuery('#frame-share').animate({'bottom': '-'+cartHeight}, 500);
	jQuery('#cover').hide();
}
</script>
<script type='text/javascript' src='__MOBILE__/js/jquery.min.js'></script>
<script type='text/javascript' src='__STATIC__/plugins/swiper/swiper.min.js'></script>
<script type='text/javascript' src='__ROOT__/addons/integral/view/mobile/index/js/detail.js?v={$v}'></script>

<script src="__STATIC__/plugins/photoswipe/photoswipe.min.js"></script>
<script src="__STATIC__/plugins/photoswipe/photoswipe-ui-default.min.js"></script>
{/block}