|
|
@@ -0,0 +1,588 @@
|
|
|
+<!DOCTYPE html>
|
|
|
+<html lang="ko"
|
|
|
+ xmlns:th="http://www.thymeleaf.org"
|
|
|
+ xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
|
|
|
+ layout:decorator="mob/common/layout/DefaultLayoutMob">
|
|
|
+<!--
|
|
|
+ *******************************************************************************
|
|
|
+ * @source : BrandMainFormMob.html
|
|
|
+ * @desc : 브랜드메인 Page
|
|
|
+ *============================================================================
|
|
|
+ * STYLE24
|
|
|
+ * Copyright(C) 2020 TSIT, All rights reserved.
|
|
|
+ *============================================================================
|
|
|
+ * VER DATE AUTHOR DESCRIPTION
|
|
|
+ * === =========== ========== =============================================
|
|
|
+ * 1.0 2021.05.10 bin2107 최초 작성
|
|
|
+ *******************************************************************************
|
|
|
+ -->
|
|
|
+<body>
|
|
|
+
|
|
|
+<link rel="stylesheet" href="/ux/mo/css/layout_m.css">
|
|
|
+
|
|
|
+<th:block layout:fragment="content">
|
|
|
+<main role="" id="" class="container br">
|
|
|
+ <section class="content br_main">
|
|
|
+ <div class="inner sr-only">
|
|
|
+ <p class="br_subtitle">브랜드 메인</p>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <th:block th:if="${brandMainLayoutList}" th:each="brandMainLayoutData, mainStat : ${brandMainLayoutList}" th:with="contentsLoc=${#strings.replace(brandMainLayoutData.contentsLoc,'SBMM','')},contentsTitle=${brandMainLayoutData.contentsTitle}">
|
|
|
+ <th:block th:if="${brandMainLayoutData.ContentsList != null and !brandMainLayoutData.ContentsList.empty}">
|
|
|
+ <th:block th:if="${contentsLoc=='004'}">
|
|
|
+ <!-- 첫번째 슬라이드 -->
|
|
|
+ <div class="inner wide">
|
|
|
+ <div class="swiper-container submain_visual">
|
|
|
+ <div class="swiper-wrapper">
|
|
|
+ <th:block th:each="ContentsData, ContentsStat : ${brandMainLayoutData.ContentsList}">
|
|
|
+ <div class="swiper-slide">
|
|
|
+ <!-- 210506_추가 : 새창에 띄우기 -->
|
|
|
+ <a th:href="${ContentsData.strVar1}" th:target="${ContentsData.contentsType=='SELF'?'_self':'_blank'}" title="현재 창으로 열기">
|
|
|
+ <div class="img">
|
|
|
+ <img th:src="${@environment.getProperty('domain.image')+ContentsData.imgPath1}" alt="">
|
|
|
+ </div>
|
|
|
+ <div class="txtWrap">
|
|
|
+ <p class="bMainTitle">
|
|
|
+ <input type="hidden" name="mainTitle" th:value="${ContentsData.strTitle1}"/>
|
|
|
+ </p>
|
|
|
+ <p class="txt_xs" th:text="${ContentsData.subText1}">신상 15% 쿠폰 할인</p>
|
|
|
+ </div>
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ </th:block>
|
|
|
+ </div>
|
|
|
+ <!-- Add Pagination -->
|
|
|
+ <div class="swiper-pagination"></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </th:block>
|
|
|
+
|
|
|
+ <th:block th:if="${contentsLoc=='005'}">
|
|
|
+ <th:block th:each="ContentsData, ContentsStat : ${brandMainLayoutData.ContentsList}">
|
|
|
+ <!-- 정보 -->
|
|
|
+ <div class="inner">
|
|
|
+ <div class="br_top_info" id="brandDesc">
|
|
|
+ <p class="br_subtitle" th:text="${contentsTitle}"></p>
|
|
|
+ <p class="cate">
|
|
|
+ <input type="hidden" name="brandTitle" th:value="${ContentsData.strTitle1}">
|
|
|
+ </p>
|
|
|
+ <p class="desc">
|
|
|
+ <input type="hidden" name="brandNote" th:value="${ContentsData.subText1}"/>
|
|
|
+ </p>
|
|
|
+ <div class="btn_group_flex">
|
|
|
+ <div>
|
|
|
+ <button class="btn btn_default">브랜드 사이트<span></span></button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </th:block>
|
|
|
+ </th:block>
|
|
|
+
|
|
|
+ <th:block th:if="${contentsLoc=='007'}">
|
|
|
+ <!-- 뉴아이템 슬라이드 -->
|
|
|
+ <div class="inner" th:if="${brandMainLayoutData.goodsList != null}">
|
|
|
+ <div class="new_item">
|
|
|
+ <p class="br_subtitle" th:text="${contentsTitle}"></p>
|
|
|
+ <div class="area_slider">
|
|
|
+ <div class="swiper-container">
|
|
|
+ <div class="swiper-wrapper">
|
|
|
+ <th:block th:each="goodsData, goodsStat : ${brandMainLayoutData.goodsList}">
|
|
|
+ <th:block th:if="${(goodsStat.index%4)==0 or goodsStat.first}">
|
|
|
+ <div class="swiper-slide">
|
|
|
+ </th:block>
|
|
|
+ <div class="item_prod">
|
|
|
+ <div class="item_state">
|
|
|
+ <button type="button" class="itemLike" th:classappend="${goodsData.likeIt == 'likeit'}? 'likeit' : ''" onclick="cfnPutWishList(this);" th:attr="goodsCd=${goodsData.goodsCd}, ithrCd='', contentsLoc='SBMM007', planDtlSq=''">관심상품 추가</button>
|
|
|
+ <a href="javascript:void(0);" class="itemLink" th:onclick="cfnGoToGoodsDetail([[${goodsData.goodsCd}]], '', '', 'SBMM007');">
|
|
|
+ <div class="itemPic">
|
|
|
+ <img class="vLHTC pd_img" th:src="${@environment.getProperty('upload.goods.view') + '/' + goodsData.sysImgNm}">
|
|
|
+ </div>
|
|
|
+ <p class="itemBrand" th:text="${goodsData.brandGroupNm}"></p>
|
|
|
+ <div class="itemName" th:text="${goodsData.goodsFullNm}"></div>
|
|
|
+ <p class="itemPrice" th:text="${#numbers.formatInteger(goodsData.currPrice,1,'COMMA')}"></p>
|
|
|
+ <div class="itemComment" th:text="${goodsData.goodsTnm}"></div>
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <th:block th:if="${(goodsStat.index%4)== 3 or goodsStat.last}">
|
|
|
+ <th:block th:utext="'</div>'"></th:block>
|
|
|
+ </th:block>
|
|
|
+ </th:block>
|
|
|
+ </div>
|
|
|
+ <!-- Add Pagination -->
|
|
|
+ <div class="swiper-pagination"></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </th:block>
|
|
|
+
|
|
|
+ <th:block th:if="${contentsLoc=='006'}">
|
|
|
+ <!-- 배너 슬라이드 -->
|
|
|
+ <div class="inner wide" th:if="${brandMainLayoutData.ContentsList!=null}">
|
|
|
+ <div class="swiper-container br_second_slide">
|
|
|
+ <div class="swiper-wrapper">
|
|
|
+ <th:block th:each="ContentsData, ContentsStat : ${brandMainLayoutData.ContentsList}">
|
|
|
+ <div class="swiper-slide">
|
|
|
+ <a th:href="${ContentsData.strVar1}" target="_blank" title="새 창으로 열기">
|
|
|
+ <img th:src="${@environment.getProperty('domain.image')+ContentsData.imgPath1}" alt="">
|
|
|
+ <div class="s-text" id="bannerS">
|
|
|
+ <p class="bText">
|
|
|
+ <input type="hidden" name="bannerDesc" th:value="${ContentsData.strTitle1}">
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ </th:block>
|
|
|
+ </div>
|
|
|
+ <!-- Add Pagination -->
|
|
|
+ <div class="swiper-pagination"></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </th:block>
|
|
|
+
|
|
|
+ <th:block th:if="${contentsLoc=='008'}">
|
|
|
+ <!-- 베스트아이템 슬라이드 -->
|
|
|
+ <div class="inner" th:if="${brandMainLayoutData.goodsList != null}">
|
|
|
+ <div class="pd_together best_item">
|
|
|
+ <p class="br_subtitle" th:text="${contentsTitle}">BEST ITEMS</p>
|
|
|
+ <div class="area_slider">
|
|
|
+ <!-- Swiper -->
|
|
|
+ <div class="swiper-container">
|
|
|
+ <div class="swiper-wrapper">
|
|
|
+ <th:block th:each="goodsData, goodsStat : ${brandMainLayoutData.goodsList}">
|
|
|
+ <div class="swiper-slide">
|
|
|
+ <div class="item_prod">
|
|
|
+ <div class="item_state">
|
|
|
+ <button type="button" class="itemLike" th:classappend="${goodsData.likeIt == 'likeit'}? 'likeit' : ''" onclick="cfnPutWishList(this);" th:attr="goodsCd=${goodsData.goodsCd}, ithrCd='', contentsLoc='SBMM008', planDtlSq=''">관심상품 추가</button>
|
|
|
+ <a href="javascript:void(0);" class="itemLink" th:onclick="cfnGoToGoodsDetail([[${goodsData.goodsCd}]], '', '', 'SBMM008');">
|
|
|
+ <div class="shape" th:classappend="${goodsStat.count==1}?'ranker'"><span th:text="${goodsStat.index+1}"></span></div>
|
|
|
+ <div class="itemPic">
|
|
|
+ <img class="vLHTC pd_img" th:src="${@environment.getProperty('upload.goods.view') + '/' + goodsData.sysImgNm}">
|
|
|
+ </div>
|
|
|
+ <p class="itemBrand" th:text="${goodsData.brandGroupNm}">BRAND NAME</p>
|
|
|
+ <div class="itemName"th:text="${goodsData.goodsFullNm}">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
|
|
|
+ <p class="itemPrice">
|
|
|
+ <span class="itemPrice_original" th:text="${#numbers.formatInteger(goodsData.listPrice,1,'COMMA')}">89,000</span>
|
|
|
+ [[${#numbers.formatInteger(goodsData.currPrice,1,'COMMA')}]]
|
|
|
+ <span class="itemPercent" th:if="${goodsData.currPrice != goodsData.listPrice}" th:text="${(goodsData.listPrice == 0 ? 0 : #numbers.formatDecimal((goodsData.listPrice - goodsData.currPrice) / (goodsData.listPrice * 1.0) * 100, 1, 0)) + '%'}">10%</span>
|
|
|
+ </p>
|
|
|
+ <div class="itemComment" th:text="${goodsData.goodsTnm}">#가을 느낌 물씬!!</div>
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </th:block>
|
|
|
+ </div>
|
|
|
+ <!-- Add Pagination -->
|
|
|
+ <div class="swiper-pagination"></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </th:block>
|
|
|
+
|
|
|
+ <th:block th:if="${contentsLoc=='010'}">
|
|
|
+ <!-- 룩북 슬라이드 -->
|
|
|
+ <div class="inner wide" th:if="${brandMainLayoutData.lookbookList != null and !brandMainLayoutData.lookbookList.empty}">
|
|
|
+ <div class="br_lookbook">
|
|
|
+ <p class="br_subtitle" th:text="${contentsTitle}"></p>
|
|
|
+ <div class="recommendedArea">
|
|
|
+ <!-- 상품이미지pic -->
|
|
|
+ <div class="area_slider pic_img">
|
|
|
+ <div class="swiper-container">
|
|
|
+ <div class="swiper-wrapper">
|
|
|
+ <th:block th:each="LookbookData, LookbookStat : ${brandMainLayoutData.lookbookList}">
|
|
|
+ <div class="swiper-slide">
|
|
|
+ <div class="page">
|
|
|
+ <div class="pic">
|
|
|
+ <span class="thumb" th:style="${'background-image:url(' + @environment.getProperty('domain.image') + LookbookData.sysFileNm + ');'}"></span>
|
|
|
+ <!-- 상품피커 -->
|
|
|
+ <th:block th:if="${LookbookData.lookbookGoodsList != null and !LookbookData.lookbookGoodsList.empty}" th:each="lookbookGoods, status : ${LookbookData.lookbookGoodsList}">
|
|
|
+ <div class="item_picker" th:style="${'left:'+lookbookGoods.xlim+'%; top:'+lookbookGoods.ylim+'%;'}">
|
|
|
+ <div>
|
|
|
+ <button type="button" th:onclick="fnGoodsPopup([[${lookbookGoods.sysImgNm}]],[[${lookbookGoods.brandGroupNm}]],[[${lookbookGoods.goodsFullNm}]],[[${lookbookGoods.listPrice}]],[[${lookbookGoods.currPrice}]],[[${lookbookGoods.dcRate}]],[[${lookbookGoods.goodsCd}]])"><span class="ico ico_picker"></span></button>
|
|
|
+ <div class="pick_descr">
|
|
|
+ <a href="javascript:void(0);"></a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </th:block>
|
|
|
+ <!-- //상품피커 -->
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </th:block>
|
|
|
+ </div>
|
|
|
+ <!-- Add Pagination -->
|
|
|
+ <div class="swiper-pagination"></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- //상품이미지pic -->
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </th:block>
|
|
|
+
|
|
|
+ <th:block th:if="${contentsLoc=='009' or contentsLoc=='017' or contentsLoc=='018' or contentsLoc=='019'}">
|
|
|
+ <!-- 엠디픽 슬라이드 -->
|
|
|
+ <div class="inner" th:if="${brandMainLayoutData.goodsList != null}">
|
|
|
+ <div class="pd_together md_item">
|
|
|
+ <p class="br_subtitle" th:text="${contentsTitle}"></p>
|
|
|
+ <div class="area_slider">
|
|
|
+ <!-- Swiper -->
|
|
|
+ <div class="swiper-container">
|
|
|
+ <div class="swiper-wrapper">
|
|
|
+ <th:block th:each="goodsData, goodsStat : ${brandMainLayoutData.goodsList}">
|
|
|
+ <div class="swiper-slide">
|
|
|
+ <div class="item_prod">
|
|
|
+ <div class="item_state">
|
|
|
+ <button type="button" class="itemLike" th:classappend="${goodsData.likeIt == 'likeit'}? 'likeit' : ''" onclick="cfnPutWishList(this);" th:attr="goodsCd=${goodsData.goodsCd}, ithrCd='', contentsLoc=${contentsLoc}, planDtlSq=''">관심상품 추가</button>
|
|
|
+ <a href="javascript:void(0);" class="itemLink" th:onclick="cfnGoToGoodsDetail([[${goodsData.goodsCd}]], '', '', [[${contentsLoc}]]);">
|
|
|
+ <div class="itemPic">
|
|
|
+ <img class="vLHTC pd_img" th:src="${@environment.getProperty('upload.goods.view') + '/' + goodsData.sysImgNm}">
|
|
|
+ </div>
|
|
|
+ <p class="itemBrand" th:text="${goodsData.brandGroupNm}">BRAND NAME</p>
|
|
|
+ <div class="itemName" th:text="${goodsData.goodsFullNm}">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
|
|
|
+ <p class="itemPrice">
|
|
|
+ <span class="itemPrice_original" th:text="${#numbers.formatInteger(goodsData.listPrice,1,'COMMA')}">89,000</span>
|
|
|
+ [[${#numbers.formatInteger(goodsData.currPrice,0,'COMMA')}]]
|
|
|
+ <span class="itemPercent" th:if="${goodsData.currPrice != goodsData.listPrice}" th:text="${(goodsData.listPrice == 0 ? 0 : #numbers.formatDecimal((goodsData.listPrice - goodsData.currPrice) / (goodsData.listPrice * 1.0) * 100, 1, 0)) + '%'}">10%</span>
|
|
|
+ </p>
|
|
|
+ <div class="itemComment" th:text="${goodsData.goodsTnm}">#가을 느낌 물씬!!</div>
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </th:block>
|
|
|
+ </div>
|
|
|
+ <!-- Add Pagination -->
|
|
|
+ <div class="swiper-pagination"></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </th:block>
|
|
|
+
|
|
|
+ <th:block th:if="${contentsLoc=='011'}">
|
|
|
+ <!-- 스페셜샵 슬라이드 -->
|
|
|
+ <div class="inner" th:if="${brandMainLayoutData.planningList != null}">
|
|
|
+ <div class="special_shop">
|
|
|
+ <p class="br_subtitle" th:text="${contentsTitle}"></p>
|
|
|
+ <div class="area_slider">
|
|
|
+ <div class="swiper-container">
|
|
|
+ <div class="swiper-wrapper">
|
|
|
+ <th:block th:each="planningData, planningStat : ${brandMainLayoutData.planningList}">
|
|
|
+ <div class="swiper-slide">
|
|
|
+ <div class="sp_item">
|
|
|
+ <div class="sp_img">
|
|
|
+ <img th:src="${@environment.getProperty('domain.image') + planningData.mainImg}" alt="">
|
|
|
+ <div class="s-text">
|
|
|
+ <p th:text="${planningData.planNm}">단 28시간 퓨어 아우터<br>최대 80%세일</p>
|
|
|
+ <p th:text="${planningData.dtlTitle1}">신상 아우터 7만원~</p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="sp_item">
|
|
|
+ <div class="itemsGrp rowtype">
|
|
|
+ <th:block th:if="${planningData.planningGoodsList != null and !planningData.planningGoodsList.empty}" th:each="planningGoods, status : ${planningData.planningGoodsList}">
|
|
|
+ <div class="item_prod">
|
|
|
+ <div class="item_state">
|
|
|
+ <a href="javascript:void(0);" class="itemLink" th:onclick="cfnGoToGoodsDetail([[${planningGoods.goodsCd}]], '', '', 'SBMM011');">
|
|
|
+ <div class="itemPic">
|
|
|
+ <img class="vLHTC pd_img" th:src="${@environment.getProperty('upload.goods.view') + '/' + planningGoods.sysImgNm}">
|
|
|
+ </div>
|
|
|
+ <p class="itemBrand" th:text="${planningGoods.brandGroupNm}">BRAND NAME</p>
|
|
|
+ <div class="itemName" th:text="${planningGoods.goodsNm}">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
|
|
|
+ <p class="itemPrice">
|
|
|
+ <span class="itemPrice_original" th:text="${#numbers.formatInteger(planningGoods.listPrice,1,'COMMA')}">89,000</span>
|
|
|
+ [[${#numbers.formatInteger(planningGoods.currPrice,0,'COMMA')}]]
|
|
|
+ <span class="itemPercent" th:if="${planningGoods.currPrice != planningGoods.listPrice}" th:text="${(planningGoods.listPrice == 0 ? 0 : #numbers.formatDecimal((planningGoods.listPrice - planningGoods.currPrice) / (planningGoods.listPrice * 1.0) * 100, 1, 0)) + '%'}">10%</span>
|
|
|
+ </p>
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </th:block>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </th:block>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </th:block>
|
|
|
+
|
|
|
+ <th:block th:if="${contentsLoc=='013'}">
|
|
|
+ <!-- brand_product -->
|
|
|
+ <div class="inner" th:if="${brandMainLayoutData.goodsList != null and !brandMainLayoutData.goodsList.empty}">
|
|
|
+ <div class="brand_product">
|
|
|
+ <p class="br_subtitle" th:text="${contentsTitle}"></p>
|
|
|
+ <th:block th:each="goodsData, goodsStat : ${brandMainLayoutData.goodsList}">
|
|
|
+ <th:block th:if="${(goodsStat.index%2)==0 or goodsStat.first}">
|
|
|
+ <div class="itemsGrp">
|
|
|
+ </th:block>
|
|
|
+ <div class="item_prod">
|
|
|
+ <div class="item_state">
|
|
|
+ <button type="button" class="itemLike" th:classappend="${goodsData.likeIt == 'likeit'}? 'likeit' : ''" onclick="cfnPutWishList(this);" th:attr="goodsCd=${goodsData.goodsCd}, ithrCd='', contentsLoc='SBMM013', planDtlSq=''">관심상품 추가</button>
|
|
|
+ <a href="javascript:void(0);" class="itemLink" th:onclick="cfnGoToGoodsDetail([[${goodsData.goodsCd}]], '', '', 'SBMM013');">
|
|
|
+ <div class="itemPic">
|
|
|
+ <img class="vLHTC pd_img" th:src="${@environment.getProperty('upload.goods.view') + '/' + goodsData.sysImgNm}">
|
|
|
+ </div>
|
|
|
+ <p class="itemBrand" th:text="${goodsData.brandGroupNm}">BRAND NAME</p>
|
|
|
+ <div class="itemName" th:text="${goodsData.goodsFullNm}">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
|
|
|
+ <p class="itemPrice">
|
|
|
+ <span class="itemPrice_original" th:text="${#numbers.formatInteger(goodsData.listPrice,1,'COMMA')}">89,000</span>
|
|
|
+ [[${#numbers.formatInteger(goodsData.currPrice,0,'COMMA')}]]
|
|
|
+ <span class="itemPercent" th:if="${goodsData.currPrice != goodsData.listPrice}" th:text="${(goodsData.listPrice == 0 ? 0 : #numbers.formatDecimal((goodsData.listPrice - goodsData.currPrice) / (goodsData.listPrice * 1.0) * 100, 1, 0)) + '%'}">10%</span>
|
|
|
+ </p>
|
|
|
+ <div class="itemcolorchip" th:if="${goodsData.colorArr != null}">
|
|
|
+ <th:block th:each="option, idx : ${goodsData.colorArr}" th:with="colorArray=${#strings.arraySplit(idx.current,':')}">
|
|
|
+ <span th:if="${colorArray[1]=='#FFFFFF'}" th:style="${'background-color:'+colorArray[1]+';border:1px solid #aaa;'}" class="chip_color" th:value="${colorArray[0]}"></span>
|
|
|
+ <span th:if="${colorArray[1]!='#FFFFFF'}" th:style="${'background-color:'+colorArray[1]+';'}" class="chip_color" th:value="${colorArray[0]}"></span>
|
|
|
+ </th:block>
|
|
|
+ </div>
|
|
|
+ <p class="itemBadge" th:if="${goodsData.benefitArr != null}">
|
|
|
+ <th:block th:each="option, idx : ${goodsData.benefitArr}" th:with="iconArray=${#strings.arraySplit(idx.current,':')}" >
|
|
|
+ <span class="badge13" th:if="${idx.index<3}" th:value="${iconArray[0]}" th:text="${iconArray[1]}"></span>
|
|
|
+ </th:block>
|
|
|
+ </p>
|
|
|
+ <div class="itemComment" th:text="${goodsData.goodsTnm}">#주문 폭주 상품</div>
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <th:block th:if="${(goodsStat.index%2)== 1 or goodsStat.last}">
|
|
|
+ <th:block th:utext="'</div>'"></th:block>
|
|
|
+ </th:block>
|
|
|
+ </th:block>
|
|
|
+
|
|
|
+ <div class="btn_group_flex">
|
|
|
+ <div>
|
|
|
+ <button class="btn btn_default" th:onclick="cfnGoToGoodsList([[${brandGroupInfo.brandGroupNo}]],[[${brandGroupInfo.cateGb}]]);">더보기</button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </th:block>
|
|
|
+
|
|
|
+ <th:block th:if="${contentsLoc=='012'}">
|
|
|
+ <!-- 유튜브 슬라이드 -->
|
|
|
+ <div class="inner wide" th:if="${brandMainLayoutData.ContentsList != null}">
|
|
|
+ <div class="youtube">
|
|
|
+ <p class="br_subtitle" th:text="${contentsTitle}">STYLE24 TV</p>
|
|
|
+ <div class="swiper-container br_youtube_slide">
|
|
|
+ <div class="swiper-wrapper">
|
|
|
+ <th:block th:each="item, stat : ${brandMainLayoutData.ContentsList}">
|
|
|
+ <div class="swiper-slide">
|
|
|
+ <div class="movbox">
|
|
|
+ <iframe th:if="${item.strVar1=='Y'}" width="100%" height="100%" th:src="${'https://www.youtube.com/embed/'+item.strVar2+'?rel=0'}" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
|
|
|
+ <iframe th:if="${item.strVar1=='M'}" class="pd_mov" th:src="${'http://v.kr.kollus.com/'+item.strVar2+'?enable_initialize_focus=false'}" allowfullscreen></iframe>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </th:block>
|
|
|
+ </div>
|
|
|
+ <!-- Add Pagination -->
|
|
|
+ <div class="swiper-pagination"></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </th:block>
|
|
|
+
|
|
|
+
|
|
|
+ </th:block>
|
|
|
+ </th:block>
|
|
|
+ </section>
|
|
|
+</main>
|
|
|
+ <script th:inline="javascript">
|
|
|
+ // 픽커모달
|
|
|
+ $(document).ready(function () {
|
|
|
+ $(document).on('click','.item_picker',function(e){
|
|
|
+ $("#reco_pop").modal("show");
|
|
|
+ $("body").addClass("recoPop");
|
|
|
+ return false;
|
|
|
+ });
|
|
|
+ $(document).on('click','#reco_pop .close-modal',function(e){
|
|
|
+ $("body").removeClass("recoPop");
|
|
|
+ return false;
|
|
|
+ });
|
|
|
+
|
|
|
+ var spc = $('.swiper-pagination-current');
|
|
|
+ var spt = $('.swiper-pagination-total');
|
|
|
+ setInterval(function(){
|
|
|
+ for(var i=0; i<spc.length; i++){
|
|
|
+ if(spc[i].innerText.length < 2){
|
|
|
+ var itNum = spc[i].innerText.toString();
|
|
|
+ spc[i].innerText = 0+itNum;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ for(var i=0; i<spt.length; i++){
|
|
|
+ if(spt[i].innerText.length < 2){
|
|
|
+ var itNum2 = spt[i].innerText.toString();
|
|
|
+ spt[i].innerText = 0+itNum2;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }, 10);
|
|
|
+
|
|
|
+
|
|
|
+ var clNum = 0;
|
|
|
+ $(document).on('click', '.br .pnb_mo > button',function(e){
|
|
|
+ if(clNum === 0){
|
|
|
+ $('.br .pnb_mo > button').css("background", "url(/images/mo/ico_btn_narrow.png) center top/1.8rem 2.0rem no-repeat");
|
|
|
+ clNum = 1;
|
|
|
+ } else {
|
|
|
+ $('.br .pnb_mo > button').css("background", "url(/images/mo/ico_btn_expand.png) center top/1.8rem 2.0rem no-repeat");
|
|
|
+ clNum = 0;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ });
|
|
|
+
|
|
|
+ // 서브비주얼 슬라이드
|
|
|
+ var myArray = ["01", "02", "03"];
|
|
|
+ var submainVisualSwiper = new Swiper('.swiper-container.submain_visual', {
|
|
|
+ //210414_자동롤링 추가
|
|
|
+ autoplay : {
|
|
|
+ delay : 3000, // 시간 설정
|
|
|
+ },
|
|
|
+ pagination: {
|
|
|
+ el: '.swiper-pagination',
|
|
|
+ type: 'fraction',
|
|
|
+ //renderCustom: function (swiper, current, total) {
|
|
|
+ // return current + ' of ' + total;
|
|
|
+ //}
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ // 이미지배너 슬라이드
|
|
|
+ var imgBannerSwiper = new Swiper('.swiper-container.br_second_slide', {
|
|
|
+ //210414_자동롤링 추가
|
|
|
+ autoplay : {
|
|
|
+ delay : 3000, // 시간 설정
|
|
|
+ },
|
|
|
+ pagination: {
|
|
|
+ el: '.swiper-pagination',
|
|
|
+ },
|
|
|
+ });
|
|
|
+
|
|
|
+ // 뉴아이템 슬라이드
|
|
|
+ var newItemSwiper = new Swiper('.new_item .area_slider .swiper-container', {
|
|
|
+ slidesPerView: 1,
|
|
|
+ pagination: {
|
|
|
+ el: '.swiper-pagination',
|
|
|
+ },
|
|
|
+ });
|
|
|
+
|
|
|
+ // 베스트아이템 슬라이드
|
|
|
+ var bestItemSwiper = new Swiper('.best_item .area_slider .swiper-container', {
|
|
|
+ slidesPerView: 2,
|
|
|
+ spaceBetween: 8,
|
|
|
+ });
|
|
|
+
|
|
|
+ // 엠디픽 슬라이드
|
|
|
+ var mdItemSwiper = new Swiper('.md_item .area_slider .swiper-container', {
|
|
|
+ slidesPerView: 2,
|
|
|
+ spaceBetween: 8,
|
|
|
+ });
|
|
|
+
|
|
|
+ // 스페셜샵 슬라이드
|
|
|
+ var specialShopSwiper = new Swiper('.special_shop .area_slider .swiper-container', {
|
|
|
+ slidesPerView: 1,
|
|
|
+ spaceBetween: 10,
|
|
|
+ });
|
|
|
+
|
|
|
+ // 룩북 슬라이드
|
|
|
+ var rcmdPicimgSwiper = new Swiper('.recommendedArea .area_slider .swiper-container', {
|
|
|
+ slidesPerView: 1,
|
|
|
+ spaceBetween: 0,
|
|
|
+ pagination: {
|
|
|
+ el: '.swiper-pagination',
|
|
|
+ type: 'fraction',
|
|
|
+ },
|
|
|
+ });
|
|
|
+
|
|
|
+ // 유튜브 슬라이드
|
|
|
+ var swiperYoutu = new Swiper('.swiper-container.br_youtube_slide', {
|
|
|
+ pagination: {
|
|
|
+ el: '.swiper-pagination',
|
|
|
+ },
|
|
|
+ });
|
|
|
+
|
|
|
+ // 브랜드메인 배너 <br> 처리
|
|
|
+ $('.bMainTitle').each(function (){
|
|
|
+ let tag = '';
|
|
|
+ if(!gagajf.isNull($(this).find("input[name=mainTitle]").val())){
|
|
|
+ var brText = $(this).find("input[name=mainTitle]").val().replaceAll("<BR>", "<br>").replaceAll("<bR>", "<br>").replaceAll("<Br>", "<br>").replaceAll("<br/>", "<br>");
|
|
|
+ if(brText.indexOf('<br>') > -1){
|
|
|
+ var reText = brText.split("<br>");
|
|
|
+ tag += reText[0];
|
|
|
+ tag += '<br>';
|
|
|
+ tag += reText[1];
|
|
|
+ }else{
|
|
|
+ tag += brText;
|
|
|
+ }
|
|
|
+ $(this).append(tag);
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ // 브랜드소개 <br> 처리
|
|
|
+ if(!gagajf.isNull($("#brandDesc").find("input[name=brandTitle]").val())){
|
|
|
+ var brandDesc = $("#brandDesc").find("input[name=brandTitle]").val().replaceAll("<BR>", "<br>").replaceAll("<bR>", "<br>").replaceAll("<Br>", "<br>");
|
|
|
+ if(!gagajf.isNull(brandDesc)){
|
|
|
+ if(brandDesc.indexOf('<br>') > -1){
|
|
|
+ let tag = '';
|
|
|
+ var reText = brandDesc.split("<br>");
|
|
|
+ tag += reText[0];
|
|
|
+ tag += '<br>';
|
|
|
+ tag += reText[1];
|
|
|
+ $("#brandDesc .cate").append(tag);
|
|
|
+ }else{
|
|
|
+ let tag = '';
|
|
|
+ tag += brandDesc;
|
|
|
+ $("#brandDesc .cate").append(tag);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ if(!gagajf.isNull($("#brandDesc").find("input[name=brandNote]").val())){
|
|
|
+ var brandDesc = $("#brandDesc").find("input[name=brandNote]").val().replaceAll("<BR>", "<br>").replaceAll("<bR>", "<br>").replaceAll("<Br>", "<br>");
|
|
|
+ if(!gagajf.isNull(brandDesc)){
|
|
|
+ if(brandDesc.indexOf('<br>') > -1){
|
|
|
+ let tag = '';
|
|
|
+ var reText = brandDesc.split("<br>");
|
|
|
+ tag += reText[0];
|
|
|
+ tag += '<br>';
|
|
|
+ tag += reText[1];
|
|
|
+ $("#brandDesc .desc").append(tag);
|
|
|
+ }else{
|
|
|
+ let tag = '';
|
|
|
+ tag += brandDesc;
|
|
|
+ $("#brandDesc .desc").append(tag);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 배너 슬라이더 <br> 처리
|
|
|
+ $('.bText').each(function (){
|
|
|
+ let tag = '';
|
|
|
+ if(!gagajf.isNull($(this).find("input[name=bannerDesc]").val())){
|
|
|
+ var brText = $(this).find("input[name=bannerDesc]").val().replaceAll("<BR>", "<br>").replaceAll("<bR>", "<br>").replaceAll("<Br>", "<br>").replaceAll("<br/>", "<br>");
|
|
|
+ if(brText.indexOf('<br>') > -1){
|
|
|
+ var reText = brText.split("<br>");
|
|
|
+ tag += reText[0];
|
|
|
+ tag += '</p>';
|
|
|
+ tag += '<p>';
|
|
|
+ tag += reText[1];
|
|
|
+ tag += '</p>';
|
|
|
+ }else{
|
|
|
+ tag += brText;
|
|
|
+ }
|
|
|
+ $(this).append(tag);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ </script>
|
|
|
+
|
|
|
+</th:block>
|
|
|
+
|
|
|
+</body>
|
|
|
+</html>
|
bin2107