|
|
@@ -18,165 +18,82 @@
|
|
|
-->
|
|
|
<body>
|
|
|
<th:block layout:fragment="content">
|
|
|
- <main role="" id="" class="container dp">
|
|
|
-
|
|
|
- <section class="content dp_Bulletship">
|
|
|
- <div class="inner wide">
|
|
|
- <div class="Bulletship_head">
|
|
|
- <img src="/images/mo/thumb/bullet_bg1.png" alt="오늘 사서 오늘 입자 AM 10시까지 주문하면 당일 도착 대상지역 서울, 경기, 인천 외 일부 지역 제외">
|
|
|
- </div>
|
|
|
- <div class="Bulletship_body">
|
|
|
- <div class="inner">
|
|
|
- <div class="ico-area">
|
|
|
- <img src="/images/mo/ico_bulltet-house.png" alt="지붕이 그려진 아이콘입니다">
|
|
|
+ <main role="" id="" class="container dp">
|
|
|
+ <section class="content">
|
|
|
+ <div class="inner wide">
|
|
|
+ <div class="bulletship">
|
|
|
+ <div class="Bulletship_head">
|
|
|
+ <img src="/images/mo/thumb/bullet_bg1.png" alt="오늘 사서 오늘 입자 AM 10시까지 주문하면 당일 도착 대상지역 서울, 경기, 인천 외 일부 지역 제외">
|
|
|
+ </div>
|
|
|
+ <div class="Bulletship_body">
|
|
|
+ <div>
|
|
|
+ <div class="ico-area">
|
|
|
+ <img src="/images/mo/ico_bulltet-house.png" alt="지붕이 그려진 아이콘입니다">
|
|
|
+ </div>
|
|
|
+ <div class="txt-area" id="shotHtml">
|
|
|
+ <!-- 배송가능지역 -->
|
|
|
+
|
|
|
+ <!-- // 배송가능지역 -->
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- <div class="txt-area">
|
|
|
- <!-- 배송가능지역 -->
|
|
|
- <p class="bulltetship-time">오전10시 이전 주문 당일도착</p>
|
|
|
- <p class="bulltetship-check"><span class="c_primary">총알배송이 가능한 지역</span>인지<br> 확인해보세요!</p>
|
|
|
-
|
|
|
- <div class="btn_group_flex">
|
|
|
- <div>
|
|
|
- <button class="btn btn_default" id="btn_bulletship_pop">
|
|
|
- <span>내 배송지 확인하기</span>
|
|
|
- </button>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <p class="bulltetship-disc ptxt01">서울·경기·인천 중 일부지역은 총알배송이 불가합니다.</p>
|
|
|
- <!-- // 배송가능지역 -->
|
|
|
- </div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- <div class="Bulletship_foot">
|
|
|
- <div class="inner custom-inner">
|
|
|
- <ul class="clear">
|
|
|
- <li>
|
|
|
- <div class="img-box">
|
|
|
- <img src="/images/mo/ico_bulltet-order.png" alt="택배차가 그려진 아이콘입니다">
|
|
|
- </div>
|
|
|
- <div class="txt-box">
|
|
|
- <span class="tit">주문/도착</span>
|
|
|
- <p class="disc">오전 10시 전 주문완료하면 <br>당일 밤 12시까지 도착</p>
|
|
|
- </div>
|
|
|
- </li>
|
|
|
- <li>
|
|
|
- <div class="img-box">
|
|
|
- <img src="/images/mo/ico_bulltet-delivery.png" alt="달력이 그려진 아이콘입니다">
|
|
|
- </div>
|
|
|
- <div class="txt-box">
|
|
|
- <span class="tit">배송일</span>
|
|
|
- <p class="disc">월, 화, 수, 목, 금 <br class="mo-only">(영업일 기준, 공휴일 휴무)</p>
|
|
|
- </div>
|
|
|
- </li>
|
|
|
- <li>
|
|
|
- <div class="img-box">
|
|
|
- <img src="/images/mo/ico_bulltet-object.png" alt="쇼핑백이 그려진 아이콘입니다">
|
|
|
- </div>
|
|
|
- <div class="txt-box">
|
|
|
- <span class="tit">대상상품</span>
|
|
|
- <p class="disc ptxt01">한세 패밀리 브랜드 <br class="mo-only">(스타일24 직배송 한정)</p>
|
|
|
- </div>
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
+ <div class="Bulletship_foot" >
|
|
|
+ <div>
|
|
|
+ <ul class="clear">
|
|
|
+ <li>
|
|
|
+ <div class="img-box">
|
|
|
+ <img src="/images/mo/ico_bulltet-order.png" alt="택배차가 그려진 아이콘입니다">
|
|
|
+ </div>
|
|
|
+ <div class="txt-box">
|
|
|
+ <span class="tit">주문/도착</span>
|
|
|
+ <p class="disc">오전 10시 전 주문완료하면 <br>당일 밤 12시까지 도착</p>
|
|
|
+ </div>
|
|
|
+ </li>
|
|
|
+ <li>
|
|
|
+ <div class="img-box">
|
|
|
+ <img src="/images/mo/ico_bulltet-delivery.png" alt="달력이 그려진 아이콘입니다">
|
|
|
+ </div>
|
|
|
+ <div class="txt-box">
|
|
|
+ <span class="tit">배송일</span>
|
|
|
+ <p class="disc">월, 화, 수, 목, 금 <br class="mo-only">(영업일 기준, 공휴일 휴무)</p>
|
|
|
+ </div>
|
|
|
+ </li>
|
|
|
+ <li>
|
|
|
+ <div class="img-box">
|
|
|
+ <img src="/images/mo/ico_bulltet-object.png" alt="쇼핑백이 그려진 아이콘입니다">
|
|
|
+ </div>
|
|
|
+ <div class="txt-box">
|
|
|
+ <span class="tit">대상상품</span>
|
|
|
+ <p class="disc ptxt01">한세 패밀리 브랜드 <br class="mo-only">(스타일24 직배송 한정)</p>
|
|
|
+ </div>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
-
|
|
|
- <!-- 210415_드롭박스 위치수정 -->
|
|
|
- <div class="items_option">
|
|
|
- <div class="open_categori">
|
|
|
- <a id="filter">모이몰른
|
|
|
- <!-- 210415_select > a태그로 변경 -->
|
|
|
- <!--<option value="hide">모이몰른</option>
|
|
|
- <option value="Test_SELECT_OPTION_1" rel="icon-temperature">모이몰른</option>
|
|
|
- <option value="Test_SELECT_OPTION_2">모이몰른</option>
|
|
|
- <option value="Test_SELECT_OPTION_3">모이몰른</option>-->
|
|
|
- </a>
|
|
|
+ </div>
|
|
|
+ <div class="inner wide">
|
|
|
+ <div class="dp_listItems_cont type1">
|
|
|
+ <!-- 210415_드롭박스 위치수정 -->
|
|
|
+ <div class="items_option">
|
|
|
+ <div class="open_categori" style="position: relative; width: 100%; z-index: 0;">
|
|
|
+ <a id="filter"></a>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="inner">
|
|
|
- <div class="delivery_item">
|
|
|
- <h2 class="dp_subtitle dp_another_st">모이몰른</h2>
|
|
|
- <div class="item_list">
|
|
|
- <div class="itemsGrp"> <!-- itemsGrp rank hot deal -->
|
|
|
- <div class="item_prod">
|
|
|
- <div class="item_state">
|
|
|
- <button type="button" class="itemLike">관심상품 추가</button>
|
|
|
- <a href="#none" class="itemLink">
|
|
|
- <div class="itemPic">
|
|
|
- <img class="vLHTC pd_img" src="/images/mo/thumb/prod1.jpg" alt="">
|
|
|
- </div>
|
|
|
- <p class="itemBrand">BRAND NAME</p>
|
|
|
- <div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
|
|
|
- <p class="itemPrice">
|
|
|
- <span class="itemPrice_original">89,000</span>
|
|
|
- 80,100
|
|
|
- <span class="itemPercent">10%</span>
|
|
|
- </p>
|
|
|
- <div class="itemcolorchip">
|
|
|
- <span class="chip_color35" value="ABM">BEIGE</span>
|
|
|
- <span class="chip_color54" value="BDS">BLACK</span>
|
|
|
- <span class="chip_color40" value="YBR">WHITE</span>
|
|
|
- </div>
|
|
|
- <p class="itemBadge">
|
|
|
- <span class="badge13">베스트 </span>
|
|
|
- </p>
|
|
|
- <div class="itemComment">#주문 폭주 상품</div>
|
|
|
- </a>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="item_prod">
|
|
|
- <div class="item_state">
|
|
|
- <button type="button" class="itemLike">관심상품 추가</button>
|
|
|
- <a href="#none" class="itemLink">
|
|
|
- <div class="itemPic">
|
|
|
- <img class="vLHTC pd_img" src="/images/mo/thumb/prod1.jpg" alt="">
|
|
|
- </div>
|
|
|
- <p class="itemBrand">BRAND NAME</p>
|
|
|
- <div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
|
|
|
- <p class="itemPrice">
|
|
|
- <span class="itemPrice_original">89,000</span>
|
|
|
- 80,100
|
|
|
- <span class="itemPercent">10%</span>
|
|
|
- </p>
|
|
|
- <div class="itemcolorchip">
|
|
|
- <span class="chip_color35" value="ABM">BEIGE</span>
|
|
|
- <span class="chip_color54" value="BDS">BLACK</span>
|
|
|
- <span class="chip_color40" value="YBR">WHITE</span>
|
|
|
- </div>
|
|
|
- <p class="itemBadge">
|
|
|
- <span class="badge13">베스트 </span>
|
|
|
- </p>
|
|
|
- <div class="itemComment">#주문 폭주 상품</div>
|
|
|
- </a>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="item_prod">
|
|
|
- <div class="item_state">
|
|
|
- <button type="button" class="itemLike">관심상품 추가</button>
|
|
|
- <a href="#none" class="itemLink">
|
|
|
- <div class="itemPic">
|
|
|
- <img class="vLHTC pd_img" src="/images/mo/thumb/prod1.jpg" alt="">
|
|
|
- </div>
|
|
|
- <p class="itemBrand">BRAND NAME</p>
|
|
|
- <div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
|
|
|
- <p class="itemPrice">
|
|
|
- <span class="itemPrice_original">89,000</span>
|
|
|
- 80,100
|
|
|
- <span class="itemPercent">10%</span>
|
|
|
- </p>
|
|
|
- <div class="itemcolorchip">
|
|
|
- <span class="chip_color35" value="ABM">BEIGE</span>
|
|
|
- <span class="chip_color54" value="BDS">BLACK</span>
|
|
|
- <span class="chip_color40" value="YBR">WHITE</span>
|
|
|
- </div>
|
|
|
- <p class="itemBadge">
|
|
|
- <span class="badge13">베스트 </span>
|
|
|
- </p>
|
|
|
- <div class="itemComment">#주문 폭주 상품</div>
|
|
|
- </a>
|
|
|
- </div>
|
|
|
+ <div id="cornerList"></div>
|
|
|
+<!-- <div class="inner">
|
|
|
+ <div class="dp_listItems_wrap type1">
|
|
|
+ <h2 class="dp_subtitle">겨울 아우터 재입고</h2>
|
|
|
+ <div class="list_content"> 데이터 없을시 클래스 nodata 추가
|
|
|
+ <div class="list_defult">
|
|
|
+ <div>
|
|
|
+ <p>선택하신 조건에 맞는 상품이 없습니다.<br>필터를 변경해 보세요.</p>
|
|
|
</div>
|
|
|
+ <button type="button" class="btn btn_default"><span>선택한 필터 초기화</span></button>
|
|
|
+ </div>
|
|
|
+ <div class="itemsGrp">
|
|
|
<div class="item_prod">
|
|
|
<div class="item_state">
|
|
|
<button type="button" class="itemLike">관심상품 추가</button>
|
|
|
@@ -206,140 +123,42 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
- <div class="inner">
|
|
|
- <div class="delivery_item">
|
|
|
- <h2 class="dp_subtitle">컬리수</h2>
|
|
|
- <div class="item_list">
|
|
|
- <div class="itemsGrp"> <!-- itemsGrp rank hot deal -->
|
|
|
- <div class="item_prod">
|
|
|
- <div class="item_state">
|
|
|
- <button type="button" class="itemLike">관심상품 추가</button>
|
|
|
- <a href="#none" class="itemLink">
|
|
|
- <div class="itemPic">
|
|
|
- <img class="vLHTC pd_img" src="/images/mo/thumb/prod1.jpg" alt="">
|
|
|
- </div>
|
|
|
- <p class="itemBrand">BRAND NAME</p>
|
|
|
- <div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
|
|
|
- <p class="itemPrice">
|
|
|
- <span class="itemPrice_original">89,000</span>
|
|
|
- 80,100
|
|
|
- <span class="itemPercent">10%</span>
|
|
|
- </p>
|
|
|
- <div class="itemcolorchip">
|
|
|
- <span class="chip_color35" value="ABM">BEIGE</span>
|
|
|
- <span class="chip_color54" value="BDS">BLACK</span>
|
|
|
- <span class="chip_color40" value="YBR">WHITE</span>
|
|
|
- </div>
|
|
|
- <p class="itemBadge">
|
|
|
- <span class="badge13">베스트 </span>
|
|
|
- </p>
|
|
|
- <div class="itemComment">#주문 폭주 상품</div>
|
|
|
- </a>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="item_prod">
|
|
|
- <div class="item_state">
|
|
|
- <button type="button" class="itemLike">관심상품 추가</button>
|
|
|
- <a href="#none" class="itemLink">
|
|
|
- <div class="itemPic">
|
|
|
- <img class="vLHTC pd_img" src="/images/mo/thumb/prod1.jpg" alt="">
|
|
|
- </div>
|
|
|
- <p class="itemBrand">BRAND NAME</p>
|
|
|
- <div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
|
|
|
- <p class="itemPrice">
|
|
|
- <span class="itemPrice_original">89,000</span>
|
|
|
- 80,100
|
|
|
- <span class="itemPercent">10%</span>
|
|
|
- </p>
|
|
|
- <div class="itemcolorchip">
|
|
|
- <span class="chip_color35" value="ABM">BEIGE</span>
|
|
|
- <span class="chip_color54" value="BDS">BLACK</span>
|
|
|
- <span class="chip_color40" value="YBR">WHITE</span>
|
|
|
- </div>
|
|
|
- <p class="itemBadge">
|
|
|
- <span class="badge13">베스트 </span>
|
|
|
- </p>
|
|
|
- <div class="itemComment">#주문 폭주 상품</div>
|
|
|
- </a>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="item_prod">
|
|
|
- <div class="item_state">
|
|
|
- <button type="button" class="itemLike">관심상품 추가</button>
|
|
|
- <a href="#none" class="itemLink">
|
|
|
- <div class="itemPic">
|
|
|
- <img class="vLHTC pd_img" src="/images/mo/thumb/prod1.jpg" alt="">
|
|
|
- </div>
|
|
|
- <p class="itemBrand">BRAND NAME</p>
|
|
|
- <div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
|
|
|
- <p class="itemPrice">
|
|
|
- <span class="itemPrice_original">89,000</span>
|
|
|
- 80,100
|
|
|
- <span class="itemPercent">10%</span>
|
|
|
- </p>
|
|
|
- <div class="itemcolorchip">
|
|
|
- <span class="chip_color35" value="ABM">BEIGE</span>
|
|
|
- <span class="chip_color54" value="BDS">BLACK</span>
|
|
|
- <span class="chip_color40" value="YBR">WHITE</span>
|
|
|
- </div>
|
|
|
- <p class="itemBadge">
|
|
|
- <span class="badge13">베스트 </span>
|
|
|
- </p>
|
|
|
- <div class="itemComment">#주문 폭주 상품</div>
|
|
|
- </a>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="item_prod">
|
|
|
- <div class="item_state">
|
|
|
- <button type="button" class="itemLike">관심상품 추가</button>
|
|
|
- <a href="#none" class="itemLink">
|
|
|
- <div class="itemPic">
|
|
|
- <img class="vLHTC pd_img" src="/images/mo/thumb/prod1.jpg" alt="">
|
|
|
- </div>
|
|
|
- <p class="itemBrand">BRAND NAME</p>
|
|
|
- <div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
|
|
|
- <p class="itemPrice">
|
|
|
- <span class="itemPrice_original">89,000</span>
|
|
|
- 80,100
|
|
|
- <span class="itemPercent">10%</span>
|
|
|
- </p>
|
|
|
- <div class="itemcolorchip">
|
|
|
- <span class="chip_color35" value="ABM">BEIGE</span>
|
|
|
- <span class="chip_color54" value="BDS">BLACK</span>
|
|
|
- <span class="chip_color40" value="YBR">WHITE</span>
|
|
|
- </div>
|
|
|
- <p class="itemBadge">
|
|
|
- <span class="badge13">베스트 </span>
|
|
|
- </p>
|
|
|
- <div class="itemComment">#주문 폭주 상품</div>
|
|
|
- </a>
|
|
|
- </div>
|
|
|
+ </div> -->
|
|
|
+<!-- <div class="inner">
|
|
|
+ <div class="dp_listItems_wrap type2">
|
|
|
+ <h2 class="dp_subtitle">2021 신상 아우터</h2>
|
|
|
+ <div class="itemsGrp">
|
|
|
+ <div class="item_prod">
|
|
|
+ <div class="item_state">
|
|
|
+ <button type="button" class="itemLike">관심상품 추가</button>
|
|
|
+ <a href="#none" class="itemLink">
|
|
|
+ <div class="itemPic">
|
|
|
+ <img class="vLHTC pd_img" src="/images/mo/thumb/prod1.jpg" alt="">
|
|
|
+ </div>
|
|
|
+ <p class="itemBrand">BRAND NAME</p>
|
|
|
+ <div class="itemName">남성 헤링본 기모 팬츠 헤링본 기모 팬츠</div>
|
|
|
+ <p class="itemPrice">
|
|
|
+ <span class="itemPrice_original">89,000</span>
|
|
|
+ 80,100
|
|
|
+ <span class="itemPercent">10%</span>
|
|
|
+ </p>
|
|
|
+ <div class="itemcolorchip">
|
|
|
+ <span class="chip_color35" value="ABM">BEIGE</span>
|
|
|
+ <span class="chip_color54" value="BDS">BLACK</span>
|
|
|
+ <span class="chip_color40" value="YBR">WHITE</span>
|
|
|
+ </div>
|
|
|
+ <p class="itemBadge">
|
|
|
+ <span class="badge13">베스트 </span>
|
|
|
+ </p>
|
|
|
+ <div class="itemComment">#주문 폭주 상품</div>
|
|
|
+ </a>
|
|
|
</div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
+ </div> -->
|
|
|
</section>
|
|
|
|
|
|
- <!-- 배송검색팝업 -->
|
|
|
- <div class="modal fade dp_pop bulletShip_pop" id="bulletShipPop" tabindex="-1" role="dialog" aria-labelledby="modalScrollLabel" aria-hidden="true">
|
|
|
- <div class="modal-dialog" role="document">
|
|
|
- <div class="modal-content">
|
|
|
- <div class="modal-header">
|
|
|
- <h5 class="modal-title" id="modalScrollLabel"><span class="sr-only">배송팝업</span></h5>
|
|
|
- </div>
|
|
|
- <div class="modal-body">
|
|
|
- <div class="pop_cont"></div>
|
|
|
- </div>
|
|
|
- <div class="modal-footer">
|
|
|
- <button type="button" id="" class="btn btn_dark"><span>계속 쇼핑하기</span></button>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!-- //배송검색팝업 -->
|
|
|
-
|
|
|
<!-- 카테고리 -->
|
|
|
<div class="category_box brand">
|
|
|
<div class="lap">
|
|
|
@@ -348,15 +167,15 @@
|
|
|
<!-- 카테고리 선택 -->
|
|
|
<div class="selcet_list">
|
|
|
<ul>
|
|
|
- <li class="active"><a href="javascript:void(0)">모이몰론</a></li>
|
|
|
- <li><a href="javascript:void(0)">모이몰론</a></li>
|
|
|
- <li><a href="javascript:void(0)">모이몰론</a></li>
|
|
|
- <li><a href="javascript:void(0)">모이몰론</a></li>
|
|
|
- <li><a href="javascript:void(0)">모이몰론</a></li>
|
|
|
- <li><a href="javascript:void(0)">모이몰론</a></li>
|
|
|
- <li><a href="javascript:void(0)">모이몰론</a></li>
|
|
|
- <li><a href="javascript:void(0)">모이몰론</a></li>
|
|
|
- <li><a href="javascript:void(0)">모이몰론</a></li>
|
|
|
+ <li class="active"><a href="javascript:void(0)">모이몰른</a></li>
|
|
|
+ <li><a href="javascript:void(0)">모이몰른</a></li>
|
|
|
+ <li><a href="javascript:void(0)">모이몰른</a></li>
|
|
|
+ <li><a href="javascript:void(0)">모이몰른</a></li>
|
|
|
+ <li><a href="javascript:void(0)">모이몰른</a></li>
|
|
|
+ <li><a href="javascript:void(0)">모이몰른</a></li>
|
|
|
+ <li><a href="javascript:void(0)">모이몰른</a></li>
|
|
|
+ <li><a href="javascript:void(0)">모이몰른</a></li>
|
|
|
+ <li><a href="javascript:void(0)">모이몰른</a></li>
|
|
|
</ul>
|
|
|
</div>
|
|
|
<!-- //카테고리 선택 -->
|
|
|
@@ -374,17 +193,277 @@
|
|
|
</div>
|
|
|
<div class="popup_con">
|
|
|
<div class="button_list clear">
|
|
|
- <button type="button" class="on"><span>모이몰른</span></button>
|
|
|
- <button type="button"><span>모이몰른</span></button>
|
|
|
- <button type="button"><span>모이몰른</span></button>
|
|
|
+ <th:block th:if="${planCornerList!=null}" th:each="a, cornerStat : ${planCornerList}">
|
|
|
+ <button type="button" th:onclick="fnCornerClick([[${cornerStat.index+1}]], [[${a.cornerNm}]])"><span th:text="${a.cornerNm}"></span></button>
|
|
|
+ </th:block>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</main>
|
|
|
-
|
|
|
+
|
|
|
+ <!-- 배송검색팝업 -->
|
|
|
+ <div class="modal fade dp_pop bulletShip_pop" id="bulletShipPop" tabindex="-1" role="dialog" aria-labelledby="modalScrollLabel" aria-hidden="true">
|
|
|
+ <div class="modal-dialog" role="document">
|
|
|
+ <div class="modal-content">
|
|
|
+ <div class="modal-header">
|
|
|
+ <h5 class="modal-title" id="modalScrollLabel"><span class="sr-only">배송팝업</span></h5>
|
|
|
+ </div>
|
|
|
+ <div class="modal-body">
|
|
|
+ <div class="pop_cont">
|
|
|
+ <div>
|
|
|
+ <div class="ico-area">
|
|
|
+ <img src="/images/mo/ico_bulltet-house.png"
|
|
|
+ alt="지붕이 그려진 아이콘입니다">
|
|
|
+ </div>
|
|
|
+ <div class="possible-popup" id="classPop">
|
|
|
+ <p class="">고객님이 찾으시는 지역은</p>
|
|
|
+ <p class="bulltetship-check">
|
|
|
+ <span class="c_primary" id="shotAdr"></span> 가능 지역
|
|
|
+ </p>
|
|
|
+ <div class="input-address" id="addr">
|
|
|
+
|
|
|
+ </div>
|
|
|
+ <p class="possible-notice c_gray" id="infoTxt">
|
|
|
+
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="modal-footer">
|
|
|
+ <button type="button" id="" class="btn btn_dark" onclick="$.modal.close();"><span>계속 쇼핑하기</span></button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- //배송검색팝업 -->
|
|
|
<script th:inline="javascript">
|
|
|
+let custAddr = [[${custAddr}]];
|
|
|
+let customerInfo = [[${customerInfo}]];
|
|
|
+let goodsView =[[${@environment.getProperty('upload.goods.view')}]]
|
|
|
+let planCornerList = [[${planCornerList}]];
|
|
|
+let planCornerGoodsList = [[${planCornerGoodsList}]];
|
|
|
+if(planCornerList.length>0){
|
|
|
+ var html = '';
|
|
|
+ $.each(planCornerList, function(idx, item) {
|
|
|
+ html += '<div class="inner" id="type'+idx+'">';
|
|
|
+ html += ' <div class="dp_listItems_wrap type'+idx+'">';
|
|
|
+ html += ' <h2 class="dp_subtitle">'+item.cornerNm+'</h2>';
|
|
|
+ html += ' <div class="itemsGrp">';
|
|
|
+ $.each(planCornerGoodsList, function(idx2, item2) {
|
|
|
+ if (item2.cornerNm == item.cornerNm) {
|
|
|
+ html += ' <div class="item_prod">';
|
|
|
+ html += ' <div class="item_state">';
|
|
|
+ if(item2.likeIt === 'likeit'){
|
|
|
+ html += ' <button type="button" class="itemLike likeit active" onclick="cfnPutWishList(this);" goodsCd=\''+item2.goodsCd+'\', ithrCd=\'\', contentsLoc=\'\', planDtlSq=\'\'>관심상품 추가</button>';
|
|
|
+ }else{
|
|
|
+ html += ' <button type="button" class="itemLike" onclick="cfnPutWishList(this);" goodsCd=\''+item2.goodsCd+'\', ithrCd=\'\', contentsLoc=\'\', planDtlSq=\'\'>관심상품 추가</button>';
|
|
|
+ }
|
|
|
+
|
|
|
+ html += ' <a href="javascript:void(0);" onclick="cfnGoToGoodsDetail(\'' + item2.goodsCd + '\')" class="itemLink">';
|
|
|
+ html += ' <div class="itemPic">';
|
|
|
+ html += ' <img class="vLHTC pd_img" src="'+ goodsView +'/'+item2.sysImgNm +'">';
|
|
|
+ html += ' </div>';
|
|
|
+ html += ' <p class="itemBrand">'+item2.brandGroupNm+'</p>';
|
|
|
+ html += ' <div class="itemName">'+item2.goodsNm+'</div>';
|
|
|
+ html += ' <p class="itemPrice">';
|
|
|
+ if (item2.currPrice != item2.listPrice) {
|
|
|
+ html += ' <span class="itemPrice_original">'+item2.listPrice.addComma()+'</span>';
|
|
|
+ }
|
|
|
+ html += item2.currPrice.addComma();
|
|
|
+ if (item2.dcRate != 0) {
|
|
|
+ html += ' <span class=" itemPercent">'+item2.dcRate.addComma()+'%</span>';
|
|
|
+ }
|
|
|
+ html += ' </p>';
|
|
|
+ html += ' <div class="itemcolorchip">';
|
|
|
+ if(!gagajf.isNull(item2.colorChips)){
|
|
|
+ var colorArr = item2.colorChips.split(",");
|
|
|
+ var colorCd = '';
|
|
|
+ var rgbColor = '';
|
|
|
+ for(let i=0; i<colorArr.length; i++){
|
|
|
+ var colorInfo = colorArr[i].split(":");
|
|
|
+ colorCd = colorInfo[0];
|
|
|
+ rgbColor = colorInfo[1];
|
|
|
+ if(rgbColor=='#FFFFFF'){
|
|
|
+ html += ' <span class="chip_color" style="background-color: '+rgbColor+';border:1px solid #aaa;" value="'+colorCd+'">'+colorCd+'</span>';
|
|
|
+ }else{
|
|
|
+ html += ' <span class="chip_color" style="background-color: '+rgbColor+'" value="'+colorCd+'">'+colorCd+'</span>';
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ html += ' </div>';
|
|
|
+ if(!gagajf.isNull(item2.icon)){
|
|
|
+ var iconArr = item2.icon.split(",");
|
|
|
+ var iconGb = '';
|
|
|
+ var iconNm = '';
|
|
|
+ html += ' <p class="itemBadge">';
|
|
|
+ for(let i=0; i<iconArr.length; i++){
|
|
|
+ var iconInfo = iconArr[i].split(":");
|
|
|
+ iconGb = iconInfo[0];
|
|
|
+ iconNm = iconInfo[1];
|
|
|
+ html += ' <span class="badge13" value="'+iconGb+'">'+iconNm+' </span>';
|
|
|
+ }
|
|
|
+ html += ' </p>';
|
|
|
+ }
|
|
|
+ if(item2.goodsTnm != null){
|
|
|
+ html += ' <div class="itemComment">'+item2.goodsTnm+'</div>';
|
|
|
+ }
|
|
|
+ html += ' </a>';
|
|
|
+ html += ' </div>';
|
|
|
+ html += ' </div>';
|
|
|
+ }
|
|
|
+ });
|
|
|
+ html += ' </div>';
|
|
|
+ html += ' </div>';
|
|
|
+ html += '</div>';
|
|
|
+ });
|
|
|
+
|
|
|
+ $("#cornerList").append(html);
|
|
|
+
|
|
|
+}
|
|
|
+var shotBody = function () {
|
|
|
+ if (!cfCheckLogin() || (custAddr == null || custAddr == '')) {
|
|
|
+ html = '';
|
|
|
+ html += '<p class="bulltetship-time">오전10시 이전 주문 당일도착</p>';
|
|
|
+ html += '<p class="bulltetship-check"><span class="c_primary">총알배송이 가능한 지역</span>인지<br> 확인해보세요!</p>';
|
|
|
+ html += ' <div class="btn_group_flex">';
|
|
|
+ html += ' <div>';
|
|
|
+ html += ' <button class="btn btn_default" id="btn_bulletship_pop" onclick="fnOpenDaumAddr();">';
|
|
|
+ html += ' <span>내 배송지 확인하기</span>';
|
|
|
+ html += ' </button>';
|
|
|
+ html += ' </div>';
|
|
|
+ html += ' </div>';
|
|
|
+ html += '<p class="bulltetship-disc ptxt01">서울·경기·인천 중 일부지역은 총알배송이 불가합니다.</p>';
|
|
|
+
|
|
|
+ $("#shotHtml").append(html);
|
|
|
+ }else{
|
|
|
+ html = '';
|
|
|
+ html += ' <span class="costumer-name">'+customerInfo.custNm+'</span>님의 배송지는';
|
|
|
+ if (custAddr.shotDelvUseYn === 'Y') {
|
|
|
+ html += '<p class="bulltetship-check"><span class="c_primary">총알배송</span> 지역</p>';
|
|
|
+ }else{
|
|
|
+ html += '<p class="bulltetship-check"><span class="c_primary">일반배송</span> 지역</p>';
|
|
|
+ }
|
|
|
+ html += '<div class="input-address">';
|
|
|
+ html += custAddr.recipBaseAddr+' <br>'+custAddr.recipDtlAddr;
|
|
|
+ html += '</div>';
|
|
|
+ html += '<div class="btn_group_flex">';
|
|
|
+ html += ' <div>';
|
|
|
+ html += ' <button class="btn btn_default btn_block" id="btn_bulletship_pop" onclick="fnOpenDaumAddr();">';
|
|
|
+ html += ' <span>다른 배송지 확인하기</span>';
|
|
|
+ html += ' </button>';
|
|
|
+ html += ' </div>';
|
|
|
+ html += '</div>';
|
|
|
+
|
|
|
+ $("#shotHtml").append(html);
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+//우편번호 DAUM을 이용한 우편번호 팝업 레이어
|
|
|
+var fnOpenDaumAddr = function() {
|
|
|
+ let daumZip = new daum.Postcode({
|
|
|
+ oncomplete: function(data) {
|
|
|
+ // data.zonecode
|
|
|
+
|
|
|
+ $.ajax( {
|
|
|
+ type : "GET",
|
|
|
+ url : '/planning/shot/delivery/confirm?recipZipcode='+data.zonecode,
|
|
|
+ dataType : 'json',
|
|
|
+ success : function(result) {
|
|
|
+ if (result != null) {
|
|
|
+ $('#addr').text(cfnGetDaumRoadAddr(data));
|
|
|
+ if(result.shotYn.shotDelvUseYn == "Y"){
|
|
|
+ $("#classPop").attr("class","possible-popup");
|
|
|
+ $('#shotAdr').text("총알배송");
|
|
|
+ $("#infoTxt").html("오늘 오전 10시까지 주문하시면 오늘 도착합니다. <br>(토, 일, 공휴일 휴무)")
|
|
|
+
|
|
|
+ }else{
|
|
|
+ $("#classPop").attr("class","impossible-popup");
|
|
|
+ $('#shotAdr').text("일반배송");
|
|
|
+ $("#infoTxt").html("주문시간/배송지에 따라 2~3일 이내 도착합니다.<br> (일, 공휴일 휴무)")
|
|
|
+ }
|
|
|
+
|
|
|
+ $("#bulletShipPop").modal("show");
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ cfnCloseDaumAddr();
|
|
|
+ },
|
|
|
+ width: '100%'
|
|
|
+ });
|
|
|
+ cfnOpenDaumAddr(daumZip);
|
|
|
+}
|
|
|
+
|
|
|
+var fnCornerClick = function (result1,result2) {
|
|
|
+ var num = result1 - 1;
|
|
|
+ $("#filter").text(result2);
|
|
|
+ //var offset = $('.dp_listItems_cont.type'+(result1)).offset(); //선택한 태그의 위치를 반환
|
|
|
+ var offset = $('#type'+num).offset(); //선택한 태그의 위치를 반환
|
|
|
+ //animate()메서드를 이용해서 선택한 태그의 스크롤 위치를 지정해서 0.4초 동안 부드럽게 해당 위치로 이동함
|
|
|
+ $('html').animate({scrollTop : offset.top}, 400);
|
|
|
+
|
|
|
+}
|
|
|
+
|
|
|
+$(document).ready(function(){
|
|
|
+ shotBody();
|
|
|
+ $("#filter").text(planCornerList[0].cornerNm);
|
|
|
+ // 다른기획전
|
|
|
+ var other_promotion_slide = new Swiper('.other_promotion_slide .swiper-container', {
|
|
|
+ slidesPerView: 2,
|
|
|
+ spaceBetween: 8,
|
|
|
+ centerMode: true,
|
|
|
+ });
|
|
|
+
|
|
|
+ $(window).scroll(function(){
|
|
|
+ var scrollTop= $(window).scrollTop();
|
|
|
+ var itemTop=$('.dp .dp_listItems_cont').offset().top;
|
|
|
+
|
|
|
+ if (scrollTop >= itemTop){
|
|
|
+ $('.dp .dp_listItems_cont .items_option').addClass('fix');
|
|
|
+ } else {
|
|
|
+ $('.dp .dp_listItems_cont .items_option').removeClass('fix');
|
|
|
+ }
|
|
|
+
|
|
|
+ });
|
|
|
+
|
|
|
+ // 아이템스라이드(리스트갯수1)
|
|
|
+ var dp_listItems_cont1 = new Swiper('.dp_listItems_cont .swiper-container.item01', {
|
|
|
+ slidesPerView: 1,
|
|
|
+ spaceBetween: 0,
|
|
|
+ centerMode: true,
|
|
|
+ pagination: {
|
|
|
+ el: '.dp_listItems_cont .swiper-container.item01 .swiper-pagination',
|
|
|
+ },
|
|
|
+ });
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ //기간 선택 팝업
|
|
|
+ $(document).on("click", ".open_categori", function(){
|
|
|
+ $('#odDatePop').show().addClass("active");
|
|
|
+ $("body").css({"overflow":"hidden"});
|
|
|
+ });
|
|
|
+ //팝업_닫기
|
|
|
+ $('.popup_close').on("click",function(){
|
|
|
+ $('.popup_box').hide().removeClass('active');
|
|
|
+ $("body").css({"overflow":"visible"});
|
|
|
+ });
|
|
|
+ // 210415_팝업 테두리 선택 추가
|
|
|
+ $(document).ready(function(){
|
|
|
+ $(document).on('click','.popup_box .button_list button',function(){
|
|
|
+ $('.popup_box .button_list button').removeClass('on');
|
|
|
+ $(this).addClass('on');
|
|
|
+ });
|
|
|
+ });
|
|
|
+
|
|
|
+ $("#bulletShipPop_close").click(function() {
|
|
|
+ $.modal.close();
|
|
|
+ });
|
|
|
|
|
|
+});
|
|
|
</script>
|
|
|
</th:block>
|
|
|
|
jsshin