style24
/
style24.front


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332
							<!DOCTYPE html>
<html lang="ko"
	xmlns:th="http://www.thymeleaf.org">
<!--
 *******************************************************************************
 * @source  : GoodsDetailDescFormWeb.html
 * @desc	: 딜 구상상품상세 Page
 *============================================================================
 * STYLE24
 * Copyright(C) 2020 TSIT, All rights reserved.
 *============================================================================
 * VER  DATE		 AUTHOR		 DESCRIPTION
 * ===  ===========  ==========  =============================================
 * 1.0  2021.03.24   eskim	   최초 작성
 *******************************************************************************
 -->
 <div class="cont_head">
	<h3 class="sr-only">상품상세정보</h3>
</div>
<div class="cont_body" th:with="imgGoodsUrl=${@environment.getProperty('upload.goods.view')}, uxImgUrl=${@environment.getProperty('domain.uximage')}, imgUrl=${@environment.getProperty('upload.image.view')}">
	<!-- 상품설명 노출 -->
	<div class="descrp_box" th:if="${goodsInfo.tobeFormYn == 'Y'}">
		<div class="desc_simple"> <!-- 상품 간략설명-->
			<span class="tit_desc" th:if="${goodsInfo.goodsTitle  != null  and !goodsInfo.goodsTitle.empty}" th:utext="${#strings.unescapeJava(#strings.escapeJava(goodsInfo.goodsTitle))}">사이드 밴딩으로 편안한 만능 슬랙스!</span>
			<p class="ptxt01"th:if="${goodsInfo.goodsTitleDesc}" th:utext="${#strings.unescapeJava(#strings.escapeJava(goodsInfo.goodsTitleDesc))}">
				슬림핏에 사이드 밴딩으로 편안함을 더해준 슬랙스입니다. 
			</p>
		</div>
		<div class="desc_character" th:if="${goodsInfo.goodsSpecialDesc != null  and !goodsInfo.goodsSpecialDesc.empty}"> <!-- 상품특징 -->
			<span class="tit_desc">상품특징</span>
			<p class="ptxt01" th:utext="${#strings.unescapeJava(#strings.escapeJava(goodsInfo.goodsSpecialDesc))}">
				- 지퍼플러 장식을 더해 완성도를 높여줌
			</p>
		</div>
	</div>
	<!-- //상품설명 노출 -->
	
	<!-- 관리자 에디터입력 내용   공지 html -->
	<div class="mdhtml_box">
			<th:block th:if="${goodsNoticeList != null and !goodsNoticeList.empty}" >
		<th:block  th:each="goodsNotice, status : ${goodsNoticeList}" th:utext="${#strings.unescapeJava(#strings.escapeJava(goodsNotice.noticeContent))}"></th:block >
			</th:block>
		<!-- 공통상품베너 -->
		<th:block th:if="${goodsBannerList != null and !goodsBannerList.empty}">
		<th:block th:each="goodsBanner, status : ${goodsBannerList}" >
		<th:block th:if="${goodsBanner.strVar1 != null and  not #strings.equals(goodsBanner.strVar1, '#')}">
			<div style="height:100px"></div><!-- 여백용 html -->
			<a th:href="${goodsBanner.strVar1}" target="_blank">
			<img th:src="${imgUrl+goodsBanner.imgPath1}" alt="">
			</a>
		</th:block>
		<th:block th:unless="${goodsBanner.strVar1 != null and  not #strings.equals(goodsBanner.strVar1, '#')}">
			<div style="height:100px"></div><!-- 여백용 html -->
			<img th:src="${imgUrl+goodsBanner.imgPath1}" alt="">
		</th:block>
		</th:block>
		</th:block>
		<th:block th:each="goodsVideo, status : ${goodsVideoList}">
		<div class="movblock">
			<th:block th:if="${goodsVideo.videoGb == 'Y'}">
			<div style="height:100px"></div><!-- 여백용 html -->
			<iframe th:src="${'https://www.youtube.com/embed/'+goodsVideo.kmcKey+'?rel=0'}" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
			</th:block>
			<th:block th:unless="${goodsVideo.videoGb == 'Y'}">
			<div style="height:100px"></div><!-- 여백용 html -->
			<iframe width="100%" height="100%" th:src="${kollusMediaUrl+'/'+goodsVideo.kmcKey +'?player_version=html5'}" frameborder="0" allowfullscreen webkitallowfullscreen mozallowfullscreen></iframe>
			</th:block>
		</div>
		</th:block>
		
		
		<!-- 관리자 에디터입력 내용 노출  상단 html -->
		<th:block  th:if="${goodsInfo.goodsTopDesc != null  and !goodsInfo.goodsTopDesc.empty }" >
		<div style="height:100px"></div><!-- 여백용 html -->
		<th:block th:utext="${#strings.unescapeJava(#strings.escapeJava(goodsInfo.goodsTopDesc))}"></th:block>
		</th:block >
		
		<th:block th:if="${goodsInfo.tobeFormYn == 'N' and goodsInfo.goodsDesc != null  and !goodsInfo.goodsDesc.empty}" >
		<div style="height:100px"></div><!-- 여백용 html -->
		<div id="goodsDescHtml"></div>
		</th:block>
	</div>	
			
	<th:block th:if="${goodsInfo.tobeFormYn == 'Y'}">
	<!-- 착용컷 노출 -->
	<div class="view_outfit_box" th:if="${#strings.contains(goodsImgList,'_C1') 
										or #strings.contains(goodsImgList,'_C2')
										or #strings.contains(goodsImgList,'_C3')
										or #strings.contains(goodsImgList,'_C4')
										or #strings.contains(goodsImgList,'_C5')}">
		<span class="tit_view">OUTFIT VIEW</span>
		<span class="model_info">(모델정보 : 185cm / 78kg / XL 착용)</span>
		<div class="view">
			<th:block th:each="goodsImg, status : ${goodsImgList}" th:if="${#strings.contains(goodsImg.sysImgNm,'_C1') 
																		or #strings.contains(goodsImg.sysImgNm,'_C2')
																		or #strings.contains(goodsImg.sysImgNm,'_C3')
																		or #strings.contains(goodsImg.sysImgNm,'_C4')
																		or #strings.contains(goodsImg.sysImgNm,'_C5')}">
			<img th:src="${imgGoodsUrl+'/'+goodsImg.sysImgNm+'?RS=720'}" alt="" th:onerror="'this.src=\''+@{${uxImgUrl}+ '/images/pc/thumb/bg_item_none.png'}+'\';'">
			</th:block>
		</div>
	</div>
	
	<!-- //착용컷 노출 -->
	<!-- 상품컷 노출 -->
	<div class="view_detail_box" th:if="${#strings.contains(goodsImgList,'_01') or #strings.contains(goodsImgList,'_02')
										or #strings.contains(goodsImgList,'_D1') or #strings.contains(goodsImgList,'_D2')
										or #strings.contains(goodsImgList,'_D3') or #strings.contains(goodsImgList,'_D4')
										or #strings.contains(goodsImgList,'_D5') or #strings.contains(goodsImgList,'_D6')
										or #strings.contains(goodsImgList,'_D7') or #strings.contains(goodsImgList,'_D8')
										or #strings.contains(goodsImgList,'_D9') or #strings.contains(goodsImgList,'_D10')
										or #strings.contains(goodsImgList,'_D11') or #strings.contains(goodsImgList,'_D12')
										or #strings.contains(goodsImgList,'_D13') or #strings.contains(goodsImgList,'_D14')
										or #strings.contains(goodsImgList,'_D15') or #strings.contains(goodsImgList,'_D16')
										or #strings.contains(goodsImgList,'_D17') or #strings.contains(goodsImgList,'_D18')
										or #strings.contains(goodsImgList,'_D19') or #strings.contains(goodsImgList,'_D20')}">
		<span class="tit_view">PRODUCT VIEW</span>
		<div class="view">
			<th:block th:each="goodsImg, status : ${goodsImgList}" th:if="${#strings.contains(goodsImg.sysImgNm,'_01') or #strings.contains(goodsImg.sysImgNm,'_02')
																		or #strings.contains(goodsImg.sysImgNm,'_D1') or #strings.contains(goodsImg.sysImgNm,'_D2')
																		or #strings.contains(goodsImg.sysImgNm,'_D3') or #strings.contains(goodsImg.sysImgNm,'_D4')
																		or #strings.contains(goodsImg.sysImgNm,'_D5') or #strings.contains(goodsImg.sysImgNm,'_D6')
																		or #strings.contains(goodsImg.sysImgNm,'_D7') or #strings.contains(goodsImg.sysImgNm,'_D8')
																		or #strings.contains(goodsImg.sysImgNm,'_D9') or #strings.contains(goodsImg.sysImgNm,'_D10')
																		or #strings.contains(goodsImg.sysImgNm,'_D11') or #strings.contains(goodsImg.sysImgNm,'_D12')
																		or #strings.contains(goodsImg.sysImgNm,'_D13') or #strings.contains(goodsImg.sysImgNm,'_D14')
																		or #strings.contains(goodsImg.sysImgNm,'_D15') or #strings.contains(goodsImg.sysImgNm,'_D16')
																		or #strings.contains(goodsImg.sysImgNm,'_D17') or #strings.contains(goodsImg.sysImgNm,'_D18')
																		or #strings.contains(goodsImg.sysImgNm,'_D19') or #strings.contains(goodsImg.sysImgNm,'_D20')}">
			<img th:src="${imgGoodsUrl+'/'+goodsImg.sysImgNm+'?RS=720'}" alt="" th:onerror="'this.src=\''+@{${uxImgUrl}+ '/images/pc/thumb/bg_item_none.png'}+'\';'">
			</th:block>
		</div>
	</div>
	<!-- //상품컷 노출 -->
	<!-- 원단 노출 -->
	<div class="view_fabric_box" th:if="${#strings.contains(goodsImgList,'_F1')}">
		<span class="tit_view">FABRIC</span>
		<div class="view">
			<th:block th:each="goodsImg, status : ${goodsImgList}" th:if="${#strings.contains(goodsImg.sysImgNm,'_F1')}">
			<img th:src="${imgGoodsUrl+'/'+goodsImg.sysImgNm+'?RS=720'}" alt="" th:onerror="'this.src=\''+@{${uxImgUrl}+ '/images/pc/thumb/bg_item_none.png'}+'\';'">
			</th:block>
		</div>
	</div>
	<!-- //원단 노출 -->
	<!-- 라벨 노출 -->
	<div class="view_label_box" th:if="${#strings.contains(goodsImgList,'_L1') 
										or #strings.contains(goodsImgList,'_L2')}">
		<span class="tit_view">LABEL INFO</span>
		<div class="view">
			<span>
				<th:block th:each="goodsImg, status : ${goodsImgList}" th:if="${#strings.contains(goodsImg.sysImgNm,'_L1') 
																		or #strings.contains(goodsImg.sysImgNm,'_L2')}">
				<img th:src="${imgGoodsUrl+'/'+goodsImg.sysImgNm+'?RS=250'}" alt="" th:onerror="'this.src=\''+@{${uxImgUrl}+ '/images/pc/thumb/bg_item_none.png'}+'\';'">
				</th:block>
			</span>
		</div>
	</div>
	<!-- //라벨 노출 -->
	
	<!-- //네이밍룰 안맞는 이미지 노출 -->
	<div class="view_detail_box" th:if="${not #strings.contains(goodsImgList,'_01')}">
		<div class="view">
			<th:block th:each="goodsImg, status : ${goodsImgList}" >
				<img th:src="${imgGoodsUrl+'/'+goodsImg.sysImgNm+'?RS=720'}" alt="" th:onerror="'this.src=\''+@{${uxImgUrl}+ '/images/pc/thumb/bg_item_none.png'}+'\';'">
				</th:block>
		</div>
	</div>
	</th:block>
		
	<!-- 관리자 에디터입력 내용 노출  하다단 html -->
	<div class="mdhtml_box" th:if="${goodsInfo.goodsDownDesc != null  and !goodsInfo.goodsDownDesc.empty}" th:utext="${#strings.unescapeJava(#strings.escapeJava(goodsInfo.goodsDownDesc))}"></div>
		
	<!-- 브랜드 노출 -->
	<div class="brand_box">
		<p class="name" th:text="${goodsInfo.brandGroupNm}">TBJ 티비제이</p>
		<a href="javascript:void(0);" class="btn btn_default" th:onclick="cfnGoToBrandMain([[${goodsInfo.brandGroupNo}]])" ><span>브랜드 홈 바로가기</span></a>
	</div>
	<!-- //브랜드 노출 -->
	<!-- 상품필수정보 노출 -->
	<div class="required_box" >
		<div class="area_infotbl" th:if="${goodsInfo.goodsType == 'G056_N' and goodsNotiList != null and !goodsNotiList.empty}">
			<span class="title">상품고시정보</span>
			<div class="tbl type1 mt30">
				<table>
					<tbody>
						<tr  th:each="goodsNoti, status : ${goodsNotiList}" >
							<th th:text="${goodsNoti.niItemNm}">스타일</th>
							<td th:text="${goodsNoti.niContent}">F94U-MD01XA60F0</td>
						</tr>
					</tbody>
				</table>
			</div>
		</div>
		<div class="area_infotbl" th:if="${goodsInfo.goodsType == 'G056_S' and goodsComposeList != null and !goodsComposeList.empty}">
			<span class="title">상품고시정보</span>
			<th:block th:each="goodsCompose, status : ${goodsComposeList}">
			<div class="tbl type1 mt30">
				<table>
					<tbody>
						<tr  th:each="goodsNoti, status : ${goodsCompose.goodsNotiList}" >
							<th th:text="${goodsNoti.niItemNm}">스타일</th>
							<td th:text="${goodsNoti.niContent}">F94U-MD01XA60F0</td>
						</tr>
					</tbody>
				</table>
			</div>
			</th:block>
		</div>
		
		<th:block th:if="${goodsSafeNo != null}" >
			<th:block th:if="${goodsSafeNo.certTargetGb == 'G083_3'}" >  <!-- 상세별도표시 -->
		<div class="area_kcl no-mark">
			<p class="tit normal"><th:block th:if="${goodsSafeNo.certFormNm}" th:text="${goodsSafeNo.certFormNm}"></th:block>
								<th:block th:if="${goodsSafeNo.certTypeNm}" th:text="${' ' + goodsSafeNo.certTypeNm}"></th:block> / 제품 상세정보 내 별도 표기</p>
			<p class="normal">제품 상세정보 내 표기되어 있습니다. 상품 정보를 확인해주세요.</p>
			<p class="t_info dot_info">해당 인증정보는 판매자가 등록한 것으로 등록정보에 대한 일체의 책임은 판매자에게 있습니다.</p>
		</div>	
			</th:block>
			<th:block th:unless="${goodsSafeNo.certTargetGb == 'G083_3'}" > <!-- 인증 -->
				<th:block th:if="${goodsSafeNo.certType == 'G081_3'}" > <!-- 공급자적합성 -->
		<div class="area_kcl">
			<i class="ico ico_kcl"></i>
			<p class="tit normal"><th:block th:if="${goodsSafeNo.certFormNm}" th:text="${goodsSafeNo.certFormNm}"></th:block>
									<th:block th:if="${goodsSafeNo.certTypeNm}" th:text="${' ' + goodsSafeNo.certTypeNm}"></th:block> / 공급자적합성확인</p>
			<p class="normal">공급자 적합성 확인 품목으로 국가통합인증을 필함</p>
			<p class="t_info dot_info">해당 인증정보는 판매자가 등록한 것으로 등록정보에 대한 일체의 책임은 판매자에게 있습니다.</p>
		</div>
				</th:block>
				<th:block th:unless="${goodsSafeNo.certType == 'G081_3'}" > <!-- 공급자적합성 외 -->
		<div class="area_kcl" >
			<i class="ico ico_kcl"></i>
			<th:block th:if="${goodsSafeNo.certFormGb != 'G084_4' and  goodsSafeNo.certFormGb != 'G084_5' }">
			<p class="tit normal" >
				<th:block th:if="${goodsSafeNo.certDiv}" th:text="${goodsSafeNo.certDiv}"></th:block>
				<th:block th:if="${goodsSafeNo.certOrganName}" th:text="${' /' + goodsSafeNo.certOrganName}"></th:block>
			</p>
			</th:block>
			<th:block th:unless="${goodsSafeNo.certFormGb != 'G084_4' and  goodsSafeNo.certFormGb != 'G084_5' }">
			<p class="tit normal">
				<th:block th:if="${goodsSafeNo.certFormNm}" th:text="${goodsSafeNo.certFormNm}"></th:block>
				<th:block th:if="${goodsSafeNo.certTypeNm}" th:text="${' ' + goodsSafeNo.certTypeNm}"></th:block>
			</p>
			</th:block>
			<p class="normal" >
				<th:block th:if="${goodsSafeNo.certNum}" th:text="${'인증번호: ' + goodsSafeNo.certNum}"></th:block>
				<th:block th:if="${goodsSafeNo.certFormGb != 'G084_4' and  goodsSafeNo.certFormGb != 'G084_5' }">
				<a th:href="@{http://www.safetykorea.kr/search/searchPop(certNum=${goodsSafeNo.certNum})}" target="_blank" class="linktxt3">상세보기</a>
				</th:block>
			</p>
			<p class="t_info dot_info">
				해당 인증정보는 판매자가 등록한 것으로 등록정보에 대한 일체의 책임은 판매자에게 있습니다.
			</p>
		</div>
				</th:block>
			</th:block>
		</th:block>
		
		<div class="area_infotbl">
			<span class="title">상품기본정보</span>
			<div class="tbl type1 mt30">
				<table>
					<tbody>
						<tr>
							<th>상품코드</th>
							<td th:text="${goodsInfo.goodsCd}">14443216</td>
						</tr>
						<tr>
							<th>상품구분</th>
							<td th:text="${goodsInfo.goodsGbNm}">병행수입</td>
						</tr>
						<tr>
							<th>브랜드</th>
							<td th:text="${goodsInfo.brandGroupNm}">TBJ</td>
						</tr>
						<tr>
							<th>상품명</th>
							<td th:text="${goodsInfo.goodsNm}">남성 테이퍼드 핏 겨울 기모면 스판 올 밴딩 팬츠</td>
						</tr>
						<th:block th:if="${goodsInfo.goodsType == 'G056_N' and goodsNotiList != null and !goodsNotiList.empty}">
									<th:block th:each="goodsNoti, status : ${goodsNotiList}"  th:if="${goodsNoti.niItemCd == 'G005_005'}">
									<tr>
										<th th:text="${goodsNoti.niItemNm}">제조사</th>
										<td th:text="${goodsNoti.niContent}"></td>
									</tr>
									</th:block>
									</th:block>
						<tr>
							<th>제조국</th>
							<td th:text="${goodsInfo.originNm}">베트남</td>
						</tr>
					</tbody>
				</table>
			</div>
			<p class="t_info dot_info mt20">
				주문제작 상품의 경우 주문 후 제작되어 판매되는 상품으로 제작 시점부터 반품/교환이 어려울 수 있습니다.
			</p>
		</div>
	</div>
	<!-- //상품필수정보 노출 -->
</div>
<div class="btn_more_box covered">
	<button type="button" class="btn btn_default btn_md">
		<span>상세정보 더보기</span>
	</button>
</div>

<script th:inline="javascript">
/*<![CDATA[*/

// 상품상세 asis html  이지미 경로 수정
   $(document).ready( function() {
   	 $(".pd_descrp_pop .cont_body").find('img').each(function() {
			let tmpImgSrc = $(this).attr('src');
			if (tmpImgSrc.indexOf('Upload') == 1 ){  // /Upload
				$(this).attr('src' , tmpImgSrc.replace('/Upload', _imgUrl+"/Local").replace('/Upload/Local', "/Local"));
			}
		});
   //210526_ 추가 : 이미지 style 속성 제거
	$(".mdhtml_box style").remove();$(".mdhtml_box img").removeAttr("style");
   	
	});
	
 //상품상세 적용
	// 입점 html 에 태그가 정상적이지 않아 스크립트로 처리
	let goodsDesc = [[${goodsInfo.goodsDesc}]];
	if ("N" == [[${goodsInfo.tobeFormYn}]] && !gagajf.isNull(goodsDesc)){
		$('#goodsDescHtml').html([[${#strings.unescapeJava(#strings.escapeJava(goodsInfo.goodsDesc))}]]);
	}
	
/*]]>*/
</script>	
</html>