zoomla
Version:
16年专业研发|中文alexa排名第一的CMS品牌-基于dotNET core、功能强大，集成站群、微信开发、小程序与ERP及OA办公系统，支持国际语言和多民族语言，世界五百强与大型门户专用高端网站内核CMS系统
283 lines (268 loc) • 10 kB
HTML
{ZL.Source id="常规商品数据源"/}
<html>
<head>
<meta charset="utf-8">
<title>{SField sid="常规商品数据源" FD="Proname" page="0"/}_{$SiteName/}</title>
<meta name="Keywords" content="{SField sid="常规商品数据源" FD="Meta_Keywords" page="0"/}" />
<meta name="description" content="{SField sid="常规商品数据源" FD="Meta_Description" page="0"/}" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" />
<meta name="renderer" content="webkit">
<link href="/dist/css/font-awesome.min.css" rel="stylesheet"/>
<link href="/dist/css/ZLico.css" rel="stylesheet"/>
<link rel="stylesheet" href="/dist/css/weui.min.css" />
<script type="text/javascript" src="/JS/jquery-1.11.1.min.js" ></script>
<link rel="stylesheet" href="/dist/css/swiper.min.css" />
<script src="/dist/js/swiper.min.js"></script>
<link rel="stylesheet" href="/dist/css/viewer.min.css" />
<script src="/dist/js/viewer.min.js"></script>
<link href="{$CssDir/}style.css?Version={ZL.Label id="前端样式版本号"/}" rel="stylesheet" />
<style>
.swiper-slide img { display:block; max-width:100%; }
</style>
{ZL:GetCSS(1,1)/}
</head>
<body>
<div class="page tabbar js_show">
<div class="page__bd" style="height:100%;">
<div class="weui-tab">
<div class="weui-tab__panel">
<div class="weui-flex home_header">
<div class="weui-flex__item">
<h1><i class="zi zi_clockCir"></i>上海微百货</h1>
</div><!--头部第一块结束-->
<div class="weui-flex__item home_header_r" >
<span class="pull-right"><a href="#" ><i class="zi zi_gift"></i><br/>惊喜</a></span>
<span class="pull-right"><a href="javascript:;" id="showIOSActionSheet"><i class="zi zi_alignjustify"></i><br/>Menu</a></span>
</div>
</div>
<div class="home_top " hidden>
<h1><i class="zi zi_clockCir"></i>上海微百货</h1>
<!--<a class="logo" ><img src="{$CssDir/}images/logo.jpg" alt="南京微生活" /></a><-->
<form action="#">
<input type="text" class="form-control" name="keyword" placeholder="输入关键字查询" />
<button type="submit"><i class="zi zi_search"></i></button>
</form>
<a href="#" class="pull-right gift"><i class="zi zi_gift"></i><br/>惊喜</a>
</div>
<!--头部结束-->
<div class="page__bd">
<!--<a href="javascript:;" class="weui-btn weui-btn_primary">点击展现searchBar</a>-->
<div class="weui-search-bar" id="searchBar">
<form action="/Search/SearchList" class="weui-search-bar__form" method="get">
<div class="weui-search-bar__box">
<i class="weui-icon-search"></i>
<input type="search" class="weui-search-bar__input" name="keyword" id="searchInput" placeholder="搜索" />
<a href="javascript:" class="weui-icon-clear" id="searchClear"></a>
</div>
<label class="weui-search-bar__label" id="searchText" style="transform-origin: 0px 0px 0px; opacity: 1; transform: scale(1, 1);">
<i class="weui-icon-search"></i>
<span>搜索</span>
</label>
</form>
<a href="javascript:" class="weui-search-bar__cancel-btn" id="searchCancel">取消</a>
</div>
<div class="weui-cells searchbar-result" id="searchResult" style="display: none;">
<div class="weui-cell weui-cell_access">
<div class="weui-cell__bd weui-cell_primary">
<p>苹果</p>
</div>
</div>
<div class="weui-cell weui-cell_access">
<div class="weui-cell__bd weui-cell_primary">
<p>apple</p>
</div>
</div>
<div class="weui-cell weui-cell_access">
<div class="weui-cell__bd weui-cell_primary">
<p>pinguo</p>
</div>
</div>
<div class="weui-cell weui-cell_access">
<div class="weui-cell__bd weui-cell_primary">
<p>test</p>
</div>
</div>
</div>
</div>
<!--搜索框结束-->
<div class="page__bd">
<div class="swiper-container">
<div class="swiper-wrapper">
</div>
<!-- Add Pagination -->
<div class="swiper-pagination"></div>
</div>
<form id="form" name="form" method="post" action="/Cart/Cart" style="margin-bottom:10px;">
<input name="id" type="hidden" id="id" value="{SField sid="常规商品数据源" FD="ID" page="0"/}" />
<div class="weui-cells">
<div class="weui-cell">
<div class="weui-cell__bd"><p>编号</p></div>
<div class="weui-cell__ft">{SField sid="常规商品数据源" FD="ProCode" page="0"/}</div>
</div>
<div class="weui-cell">
<div class="weui-cell__bd"><p>品牌</p></div>
<div class="weui-cell__ft">{SField sid="常规商品数据源" FD="brand" page="0"/}</div>
</div>
<div class="weui-cell">
<div class="weui-cell__bd"><p>库存</p></div>
<div class="weui-cell__ft">{SField sid="常规商品数据源" FD="stock" page="0"/}</div>
</div>
<div class="weui-cell">
<div class="weui-cell__bd"><p>市场价</p></div>
<div class="weui-cell__ft"><i class="zi zi_yensign"></i>{ZL:GetMoney({SField sid="常规商品数据源" FD="ShiPrice" page="0"/},2,1)/} 元</div>
</div>
<div class="weui-cell">
<div class="weui-cell__bd"><p>零售价</p></div>
<div class="weui-cell__ft"><span style="color:#f40;"><i class="zi zi_yesign"></i>{ZL:GetMoney({SField sid="常规商品数据源" FD="LinPrice" page="0"/},2,1)/}元</span></div>
</div>
</div>
<div class="weui-btn-area">
<button type="submit" class="weui-btn weui-btn_primary"><i class="zi zi_shoppingcart"></i> 立即购买</button>
<button type="button" class="weui-btn weui-btn_default" onClick="AddCart();"><i class="zi zi_plussquare"></i> 加入购物车</button>
<button type="button" class="weui-btn weui-btn_default" onClick="addfav();"><i class="zi zi_heart"></i> 关注商品</button>
</div>
</form>
<div class="weui-cells__title">商品详情</div>
<article class="weui-article" style="background:#fff;">
<h1>{SField sid="常规商品数据源" FD="Proname" page="0"/}</h1>
{SField sid="常规商品数据源" FD="Procontent" page="0"/}
</article>
</div>
<div class="weui-tabbar page__ft j_bottom">
<a href="/" class="weui-tabbar__item">
<i class="zi z01-icon001 weui-tabbar__icon"></i>
<p class="weui-tabbar__label">首页</p>
</a>
<a href="{ZL:GetNodeListUrl(145)/}" class="weui-tabbar__item">
<i class="zi z01-icon002 weui-tabbar__icon"></i>
<p class="weui-tabbar__label">商家</p>
</a>
<a href="{ZL:GetNodeLinkUrl(177)/}" class="weui-tabbar__item weui-bar__item_on">
<i class="zi z01-icon003 weui-tabbar__icon"></i>
<p class="weui-tabbar__label">商城</p>
</a>
<a href="/User/" class="weui-tabbar__item">
<i class="zi z01-icon004 weui-tabbar__icon"></i>
<p class="weui-tabbar__label">会员</p>
</a>
</div>
<!--foot end-->
<div>
<div class="weui-mask" id="iosMask" style="opacity:1; display: none;"></div>
<div class="weui-actionsheet" id="iosActionsheet">
<div class="weui-actionsheet__menu">
<div class="weui-actionsheet__cell">示例菜单</div>
<div class="weui-actionsheet__cell">示例菜单</div>
<div class="weui-actionsheet__cell">示例菜单</div>
<div class="weui-actionsheet__cell">示例菜单</div>
</div>
<div class="weui-actionsheet__action">
<div class="weui-actionsheet__cell" id="iosActionsheetCancel">取消</div>
</div>
</div>
</div>
<!--下下拉菜单结束-->
</div>
</div>
</div>
</div>
</body>
</html>
<script type="text/javascript" src="/JS/Modal/APIResult.js"></script>
<script>
$(function(){
var $searchBar = $('#searchBar'),
$searchResult = $('#searchResult'),
$searchText = $('#searchText'),
$searchInput = $('#searchInput'),
$searchClear = $('#searchClear'),
$searchCancel = $('#searchCancel');
function hideSearchResult(){
$searchResult.hide();
$searchInput.val('');
}
function cancelSearch(){
hideSearchResult();
$searchBar.removeClass('weui-search-bar_focusing');
$searchText.show();
}
$searchText.on('click', function(){
$searchBar.addClass('weui-search-bar_focusing');
$searchInput.focus();
});
$searchInput
.on('blur', function () {
if(!this.value.length) cancelSearch();
})
.on('input', function(){
if(this.value.length) {
$searchResult.show();
} else {
$searchResult.hide();
}
})
;
$searchClear.on('click', function(){
hideSearchResult();
$searchInput.focus();
});
$searchCancel.on('click', function(){
cancelSearch();
$searchInput.blur();
});
});
// ios
$(function(){
var $iosActionsheet = $('#iosActionsheet');
var $iosMask = $('#iosMask');
function hideActionSheet() {
$iosActionsheet.removeClass('weui-actionsheet_toggle');
$iosMask.fadeOut(200);
}
$iosMask.on('click', hideActionSheet);
$('#iosActionsheetCancel').on('click', hideActionSheet);
$("#showIOSActionSheet").on("click", function(){
$iosActionsheet.addClass('weui-actionsheet_toggle');
$iosMask.fadeIn(200);
});
});
$().ready(function(e) {
var pics='{SField sid="常规商品数据源" FD="pics" page="0"/}';
if(pics!=""){
pics=JSON.parse(pics);
var str="";
for(var i=0;i<pics.length;i++){
str+='<div class="swiper-slide"><img src="{$UploadDir/}'+pics[i].url+'" alt="'+pics[i].desc+'" /></div>';
}
$(".swiper-wrapper").html(str);
var swiper = new Swiper('.swiper-container', {
pagination: '.swiper-pagination',
slidesPerView: 1,
paginationClickable: true,
loop: true,
grabCursor: true,
autoHeight: true,
});
$('.swiper-container').viewer();
}
});
/*加入购物车*/
function AddCart()
{
$.post("/Cart/Cart?ID={SField sid="常规商品数据源" FD="ID" page="0"/}&Pronum=1","",function(data){
alert("加入购物车成功！");
});
};
function addfav(){
$.post("/API/mod/collect.ashx", {action:"add",favurl:"/Shop/{SField sid="常规商品数据源" FD="ID" page="0"/}",infoid:"{SField sid="常规商品数据源" FD="ID" page="0"/}",type:2,title:"{SField sid="常规商品数据源" FD="Title" page="0"/}"},function(data){
var model=JSON.parse(data);
if(APIResult.isok(model)){
alert("收藏成功!");
}
else{
alert("收藏失败!原因:"+model.retmsg);
}
});
}
</script>