<!DOCTYPE html>
<html lang="ko"
	xmlns:th="http://www.thymeleaf.org">
<!--
 *******************************************************************************
 * @source  : GoodsOtherFormMob.html
 * @desc    : 상품 안내
 *============================================================================
 * STYLE24
 * Copyright(C) 2020 TSIT, All rights reserved.
 *============================================================================
 * VER  DATE         AUTHOR      DESCRIPTION
 * ===  ===========  ==========  =============================================
 * 1.0  2021.04.05   eskim        최초 작성
 *******************************************************************************
 -->
<th:block th:if="${goodsList != null and !goodsList.empty}" th:with="imgGoodsUrl=${@environment.getProperty('upload.goods.view')}, uxImgUrl=${@environment.getProperty('domain.uximage')}">
	<h3 class="tit">
	<th:block th:if="${params.goodsOtherGb =='together'}" th:text="${'이 상품과 함께 본 상품'}"></th:block>
	<th:block th:if="${params.goodsOtherGb =='recommend'}" th:text="${params.brandGroupNm +' 추천상품'}"></th:block>
	<th:block th:if="${params.goodsOtherGb =='like'}" th:text="${'이 상품과 비슷한 상품'}"></th:block>
	</h3>
	<div class="area_slider">
		<div class="swiper-container">
			<div class="swiper-wrapper">
				<div class="swiper-slide" th:each="result, status : ${goodsList}">
					<div class="item_prod">
						<div class="item_state">
							<button type="button" class="itemLike" th:classappend="${result.product.itemId == 'Y'}? 'likeit active' : ''"  onclick="cfnPutWishList(this);" th:attr="goodsCd=${result.product.itemId}, goodsNm=${result.product.itemName}, ithrCd=${params.ithrCd}, contentsLoc='', planDtlSq=''">관심상품 추가</button>
							<a href="javascript:void(0);" th:onclick="cfnGoToGoodsDetail([[${result.product.itemId}]], '',[[${params.ithrCd}]],'','','pc_detail');" class="itemLink" >
								<div class="itemPic">
									<img alt="" class="vLHTC pd_img" th:src="${result.product.itemImage+'?RS=156'}" th:onerror="'this.src=\''+@{${uxImgUrl}+ '/images/pc/thumb/bg_item_none.png'}+'\';'">
								</div>
								<p class="itemBrand" th:text="${result.product.brandName}">BRAND NAME1</p>
								<div class="itemName" th:text="${result.product.itemName}">남성 로고 자카드 방풍 패딩</div>
								<p class="itemPrice">
									<span class="itemPrice_original" th:if="${result.product.originalPrice != result.product.salePrice}" th:text="${#numbers.formatInteger(result.product.originalPrice, 0,'COMMA')}">1,000,000</span>
									<th:block th:text="${#numbers.formatInteger(result.product.salePrice, 0,'COMMA')}"></th:block>
									<span class="itemPercent" th:if="${result.product.originalPrice != result.product.salePrice}"  th:text="${(result.product.originalPrice == 0 ? 0 : #numbers.formatDecimal((result.product.originalPrice - result.product.salePrice) / (result.product.originalPrice * 1.0) * 100, 1, 0)) + '%'}">0%</span>
								</p>
							</a>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</th:block>
<script th:inline="javascript">
/*<![CDATA[*/

	//슬라이드 - 함께하면 할인되는 다다익선 상품
	/* var togetherItemSwiper = new Swiper('.pd .pd_together .area_slider .swiper-container', {
		slidesPerView: 3,
		spaceBetween: 8,
	});  */ 
	$(document).ready( function() {
		let goodsList = [[${goodsList}]];
		if (goodsList != null){
			$('#otherGoodsArea').css('display','block');	
		}
		
	
		//슬라이드 - 이 상품과 함께 본 상품 
		var otherItemSwiper = new Swiper('.pd .pd_clickother .area_slider .swiper-container', {
			slidesPerView: 2,
			spaceBetween: 8,
		});	
		//슬라이드 - 동일브랜드 상품 추천
		var rcmdItemSwiper = new Swiper('.pd .pd_samebrand .area_slider .swiper-container', {
			slidesPerView: 3,
			spaceBetween: 8,
		}); 
	
		//슬라이드 - 이 상품과 비슷한 상품 
		var relateItemSwiper = new Swiper('.pd .pd_relate .area_slider .swiper-container', {
			slidesPerView: 3,
			spaceBetween: 8,
		});	 
	});
	
	window.onload = function(){
		
		// 위시처리- 로그인 되어 있을시
//		if (cfCheckLogin()) {
//			//이상품과 함께본 상품
//			let targetT = $('#goodsTogetherbArea').find('.item_state').find('.itemLike');
//			let targetTSize = targetT.length;
//			
//			targetT.each(function(){
//				let goodsCd = $(this).attr('goodscd');
//				let url = "/mypage/wish/list/check/"+goodsCd;
//				var result = '';
//				$.ajax({
//					type: 'get'
//					, async: false
//					, url: url
//					, success: function (data) {
//						//likeit active
//						if ("Y" == data){
//							$(this).addClass('likeit').addClass('active');
//						}
//					}
//				});
//			});
//			
//		}
	};
	
	
/*]]>*/
</script>	


</html>