<!doctype html>
<!--[if IE 6]><html id="ie6" dir="ltr" lang="zh-TW"><![endif]-->
<!--[if IE 7]><html id="ie7" dir="ltr" lang="zh-TW"><![endif]-->
<!--[if IE 8]><html id="ie8" dir="ltr" lang="zh-TW"><![endif]-->
<!--[if !(IE 6) | !(IE 7) | !(IE 8)  ]><!-->
<html dir="ltr" lang="zh-TW">
<!--<![endif]-->
<head>
<!--[if lt IE 9]><script src="/js/html5.js"></script><![endif]-->
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0">
<title><?# webTitle ?></title>	
<meta name="author" content="<?# webTitle ?>" />
<meta name="copyright" content="<?# webName ?>版權所有" />
<meta name="description" content="<?# webDescription ?>" />
<meta name="distribution" content="Taiwan" /> 
<meta name="keywords" content="<?# webKeyword ?>" />
<meta name="format-detection" content="telephone=no" />
<meta property="og:url" content="<?# RelLink ?><?# REQUESTURI ?>" />
<meta property="og:type" content="website" />
<meta property="og:title" content="<?# ogTitle ?>" />
<meta property="og:description" content="<?# ogDescription ?>" />
<meta property="og:image" content="<?# ogImage ?>" />
<link href="/less/<?# webTemplates ?>/main.less" rel="stylesheet/less">
<link href="/less/<?# webTemplates ?>/layout.less" rel="stylesheet/less">
<link href="/css/<?# webTemplates ?>/main.css" rel="stylesheet">
<link href="/css/<?# webTemplates ?>/layout.css" rel="stylesheet">
<link href="/css/<?# webTemplates ?>/product.css" rel="stylesheet">
<script src="/jquery/jquery-1.10.js"></script>
<script>
	if('<?# alertMsg ?>' != ''){
		alert('<?# alertMsg ?>');
		if('<?# goBack ?>' == 'Y') history.back();
	}
	if('<?# locationHref ?>' != '') location.href = '<?# locationHref ?>';
</script>
<?# headHTML ?>
</head>
<body<?# JumpBody ?>>
<?# bodyTopHTML ?>
<div class="webBox" style="<?# JumpStyle ?>">
<?# JumpHTML ?>
<?# JumpScript ?>
<div class="wrapper">
    <?# header ?>
	<?# banner ?>
	<div class="pos_rel" id="wrap">
		<div class="workframe">
			<div class="waylink">
                <ol class="nowrap_box">
                    <li class="d_inblock"><a class="d_inblock" href="/" title="首頁">首頁</a></li>
                    <li class="d_inblock"><a class="d_inblock" href="<?# htLink4 ?>" title="產品">產品</a></li>
                    <php:repeater id="listR">
                    <template>
                    <li class="d_inblock"><a class="d_inblock" href="<?# Link ?>" title="<?# Name ?>"><?# Name ?></a></li>
                    </template>
                    </php:repeater>
                    <li class="d_inblock"><?# CategoryName ?></li>
                </ol>
            </div>
			<h2 class="talign_center txt_primary_5 pag_tit"><?# CategoryName ?></h2>
			<aside class="pos_rel">
				<ul class="talign_center nowrap_box" id="category_nav">
					<li<?# categoryClass ?>><h4 class="pos_rel"><a class="d_inblock" href="<?# htLink4 ?>" title="全部產品">全部產品</a></h4></li>
					<php:repeater id="listC">
					<template>
					<li<?# className ?> data-type="1">
						<h4 class="pos_rel"><a class="d_inblock" href="<?# link ?>" title="<?# CategoryName ?>"><?# CategoryName ?></a><?# iLabel ?></h4>
						<?# SubList ?>
					</li>
					</template>
					</php:repeater>
				</ul>
			</aside>
			<div id="content_wrap">
				<div class="nowrap_box" id="productdetail">
					<div class="col_lg_6 col_md_7 d_md_inblock" id="imglist">
						<svg class="pos_rel svg_clip" viewBox="0 0 200 215" xmlns="http://www.w3.org/2000/svg">
							<clipPath id="clip_product_detail" clipPathUnits="objectBoundingBox"><path class="trans_none_box path_animate" transform="scale(0.005, 0.00465)" d="M195.615 76.3313C207.734 112.243 194.173 157.778 161.857 182.198C129.685 206.474 78.7591 209.491 44.1351 185.646C9.51103 161.657 -8.95512 110.806 4.31743 73.3148C17.59 35.8233 62.6012 11.8345 104.15 12.9836C145.555 14.1328 183.497 40.4199 195.615 76.3313Z" data-to="M195.44 76.88 C208.72 118.64 191.83 169.04 157.12 193.98 122.43 218.86 69.77 218.12 37.22 193.71 4.59 169.22 -7.97 121.03 5.1 79.62 18.04 38.28 56.71 3.77 97.73 2.99 138.78 2.13 182.16 35.14 195.44 76.88"></path></clipPath>
							<clipPath id="clip_product_detail_m" clipPathUnits="objectBoundingBox"><path transform="scale(0.005, 0.00465)" d="M0,109.88C-.29,78.47,3.61,54.26,14.29,41.61,27.64,24.93,41.85,14.89,56.77,10.37A130.25,130.25,0,0,1,100,.18c23.62-1,45.6,1.8,65,10.53,9.53,3.62,18.51,8.5,23.56,22.41,5.29,11.48,9.82,26.89,11.42,57.4.43,24.21-.17,47.34-5.71,65.2-5.6,19.85-16.28,34.05-33.37,41.1-15.92,7.46-32,14.89-73.71,18-16.88.86-31.95-1.35-45.5-6.12-12.11-4.51-22.44-13.78-29.09-32.94A272.39,272.39,0,0,1,2.34,133.14C1.26,128.31.51,119.68,0,109.88Z"></path></clipPath>
						</svg>
						<div class="col_lg_10 col_md_11">
							<div class="over_hid pos_rel clip">
                                <svg class="pos_rel" viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg"></svg>
                                <img class="pos_abs atag_item img_cover" src="<?# IconImage ?>" alt="<?# ProductName ?>" />
								<a class="pos_abs d_block atag_item" href="<?# IconImage ?>" data-fancybox="gallery" title="<?# ProductName ?>"></a>
							</div>
							<php:repeater id="listPI">
							<template>
							<div class="over_hid pos_rel clip">
                                <svg class="pos_rel" viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg"></svg>
                                <img class="pos_abs atag_item img_cover" src="<?# Image ?>" />
								<a class="pos_abs d_block atag_item" href="<?# Image ?>" data-fancybox="gallery"></a>
							</div>
							</template>
							</php:repeater>
						</div>
					</div>
					<div class="col_lg_6 col_md_5 d_md_inblock" id="productinfo">
						<a class="d_inblock d_inblock bg_primary_5 talign_center txt_white_5 txt_clamp more_btn cate" href="<?# CategoryLink ?>"><?# CategoryName ?></a>
						<h1 class="d_block txt_primary_5 title"><?# ProductName ?></h1>
						<p class="txt"<?# NoStyle ?>><label class="d_inblock">編號</label><font class="d_inblock"><?# ProductNO ?></font></p>
						<div<?# sellStyle ?>><p class="txt"<?# oldPriceStyle ?>><label class="d_inblock">原價</label><font class="d_inblock">NT&#36; <?# OldPrice ?></font></p></div>
						<article class="txt_gray_6"><?# Introduction ?></article>
						<div class="shopbox">
							<div<?# sellStyle ?>><p class="txt price sell_box"<?# priceStyle ?>><label class="d_inblock">特價</label><font class="d_inblock txt_triadic2_5">NT&#36; <?# Price ?></font></p></div>
							<p class="txt" id="orderfunction"<?# orderStyle ?>>
								<label class="d_inblock">數量</label>
                                <a class="d_inblock txt_secondary_5 talign_center limit" href="javascript:void(0);" data-action="plusBtn" data-type="1">-</a>
                                <input class="d_inblock talign_center" type="text" id="q" name="q" value="1">
                                <a class="d_inblock txt_secondary_5 talign_center" href="javascript:void(0);" data-action="plusBtn" data-type="2">+</a>
							</p>
							<div class="buyBtns nowrap_box">
								<a class="col_6 d_inblock talign_center bg_primary_5 txt_white_5 addcar" id="buy" href="javascript:void(0);" title="加入購物車"<?# orderStyle ?>>加入購物車</a>
								<a class="col_6 d_inblock talign_center bg_secondary_5 txt_white_5 ask" href="<?# askLink ?>" title="諮詢此商品">諮詢此商品</a>
							</div>
						</div>
					</div>
				</div>
				<div id="tabs_box">
                    <div id="productTabs">
                        <ul class="talign_center nowrap_box tabs">
                            <php:repeater id="listT">
                            <template>
                            <li class="d_inblock"><a class="pos_rel d_block" href="#tab<?# NO ?>"><?# Title ?></a></li>
                            </template>
                            </php:repeater>
                            <li class="d_inblock"<?# SpStyle ?>><a class="pos_rel d_block" href="#tabSp">規格</a></li>
                        </ul>
                        <div id="tabs_container">
                            <php:repeater id="listD">
                            <template>
                            <div id="tab<?# NO ?>" class="tab_content"><?# Description ?></div>
                            </template>
                            </php:repeater>
                            <div id="tabSp" class="tab_content"<?# SpStyle ?>><?# Specification ?></div>
                        </div>
                    </div>
				</div>
				<div class="nowrap_box" id="google_shere">
					<div class="row col_xs_offset_6 d_xs_inblock"><?# GoogleSearch ?></div>
					<div class="row col_xs_offset_6 d_xs_inblock" id="community">
						<ul class="talign_xs_right nowrap_box">
							<li class="d_inblock"><div class="fb-share-button" data-href="<?# RelLink ?><?# REQUESTURI ?>" data-layout="button" data-size="small"><a target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2F<?# RelLink ?><?# REQUESTURI ?>%2F&amp;src=sdkpreparse" class="fb-xfbml-parse-ignore">分享</a></div></li>
							<li class="d_inblock"><a href="https://twitter.com/share" class="twitter-share-button" data-lang="zh-tw" data-dnt="true">推文</a><script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script></li>
							<li class="d_inblock"><div class="line-it-button" data-lang="zh_Hant" data-type="like" data-url="<?# RelLink ?><?# REQUESTURI ?>" data-share="true" style="display: none;"></div></li>
						</ul>
					</div>
				</div>
			</div>
		</div>
    	<?# footer ?>
	</div>
</div>
</div>
</body>
</html>
<script>
	$(function(){
		$('#imglist >div').slick({
			autoplay: true,
			dots: false,
			arrows: false,
			fade: true
		});
		
		$('#orderfunction a[data-action="plusBtn"]').click(function(){
			var num = $(this).parent().children('input').val();
			num = ($(this).data('type') == '1') ?(parseInt(num) - 1):(parseInt(num) + 1);
			if(num < 1) num = 1;
			
			$(this).parent().children('input').val(num);
		});
		
		$('a#buy').click(function(){
			var re = /^[0-9]+$/;
			if(!re.test($('#q').val()) || $('#q').val() == "0"){
				alert("購買數量只能輸入大於0的阿拉伯數字!!");
				$('#q').focus();
				return false;
			}
			$.ajax({
				url: '/ajax/cart.php',
				async: false,
				type: 'POST',
				data: {'do':'add','id':'<?# ProductID ?>','q':$('#q').val()},
				dataType: 'json',
				context: $(this),
				success: function(JData){
					alert(JData["msg"]);
					location.href = (JData["err"] == "0") ?'<?# htLink7 ?>':location.href;
				},
				error:function(){
					alert('系統異常!請重新整理頁面再試一次!');
					location.href = location.href;
				}
			});
		});
		
		// 預設顯示第一個 Tab
		var _showTab = 0;
		$('#productTabs').each(function(){
			var $tab = $(this);
			var $defaultLi = $('ul.tabs li', $tab).eq(_showTab).addClass('active');
			$($defaultLi.find('a').attr('href')).siblings().hide();
			$('ul.tabs li', $tab).click(function() {
				var $this = $(this),
				_clickTab = $this.find('a').attr('href');
				$this.addClass('active').siblings('.active').removeClass('active');
				$(_clickTab).stop(false, true).fadeIn().siblings().hide();
				return false;
			}).find('a').focus(function(){
				this.blur();
			});
		});
	});
	document.body.oncopy = event => {
		event.preventDefault();
		let textFont,
			copyFont = window.getSelection(0).toString();
		textFont = (copyFont.length > 10) ?copyFont + '\n\n' + '原文網址: <?# webTitle ?> <?# RelLink ?><?# REQUESTURI ?>\n' + '著作權歸作者所有。商業轉載請聯絡作者獲得授權，非商業轉載請註明出處。':copyFont;
		return (event.clipboardData) ?event.clipboardData.setData('text', textFont):window.clipboardData.setData('text', textFont);// 相容IE
	};
</script>