GoodsOtherFormMob.html 4.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115
  1. <!DOCTYPE html>
  2. <html lang="ko"
  3. xmlns:th="http://www.thymeleaf.org">
  4. <!--
  5. *******************************************************************************
  6. * @source : GoodsOtherFormMob.html
  7. * @desc : 상품 안내
  8. *============================================================================
  9. * STYLE24
  10. * Copyright(C) 2020 TSIT, All rights reserved.
  11. *============================================================================
  12. * VER DATE AUTHOR DESCRIPTION
  13. * === =========== ========== =============================================
  14. * 1.0 2021.04.05 eskim 최초 작성
  15. *******************************************************************************
  16. -->
  17. <th:block th:if="${goodsList != null and !goodsList.empty}" th:with="imgGoodsUrl=${@environment.getProperty('upload.goods.view')}, uxImgUrl=${@environment.getProperty('domain.uximage')}">
  18. <h3 class="tit">
  19. <th:block th:if="${params.goodsOtherGb =='together'}" th:text="${'이 상품과 함께 본 상품'}"></th:block>
  20. <th:block th:if="${params.goodsOtherGb =='recommend'}" th:text="${params.brandGroupNm +' 추천상품'}"></th:block>
  21. <th:block th:if="${params.goodsOtherGb =='like'}" th:text="${'이 상품과 비슷한 상품'}"></th:block>
  22. </h3>
  23. <div class="area_slider">
  24. <div class="swiper-container">
  25. <div class="swiper-wrapper">
  26. <div class="swiper-slide" th:each="result, status : ${goodsList}">
  27. <div class="item_prod">
  28. <div class="item_state">
  29. <button type="button" class="itemLike" th:classappend="${result.product.itemId == 'Y'}? 'likeit active' : ''" onclick="cfnPutWishList(this);" th:attr="goodsCd=${result.product.itemId}, ithrCd=${params.ithrCd}, contentsLoc='', planDtlSq=''">관심상품 추가</button>
  30. <a href="javascript:void(0);" th:onclick="cfnGoToGoodsDetail([[${result.product.itemId}]], '',[[${params.ithrCd}]],'','','pc_detail');" class="itemLink" >
  31. <div class="itemPic">
  32. <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'}+'\';'">
  33. </div>
  34. <p class="itemBrand" th:text="${result.product.brandName}">BRAND NAME1</p>
  35. <div class="itemName" th:text="${result.product.itemName}">남성 로고 자카드 방풍 패딩</div>
  36. <p class="itemPrice">
  37. <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>
  38. <th:block th:text="${#numbers.formatInteger(result.product.salePrice, 0,'COMMA')}"></th:block>
  39. <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>
  40. </p>
  41. </a>
  42. </div>
  43. </div>
  44. </div>
  45. </div>
  46. </div>
  47. </div>
  48. </th:block>
  49. <script th:inline="javascript">
  50. /*<![CDATA[*/
  51. //슬라이드 - 함께하면 할인되는 다다익선 상품
  52. /* var togetherItemSwiper = new Swiper('.pd .pd_together .area_slider .swiper-container', {
  53. slidesPerView: 3,
  54. spaceBetween: 8,
  55. }); */
  56. $(document).ready( function() {
  57. let goodsList = [[${goodsList}]];
  58. if (goodsList != null){
  59. $('#otherGoodsArea').css('display','block');
  60. }
  61. //슬라이드 - 이 상품과 함께 본 상품
  62. var otherItemSwiper = new Swiper('.pd .pd_clickother .area_slider .swiper-container', {
  63. slidesPerView: 2,
  64. spaceBetween: 8,
  65. });
  66. //슬라이드 - 동일브랜드 상품 추천
  67. var rcmdItemSwiper = new Swiper('.pd .pd_samebrand .area_slider .swiper-container', {
  68. slidesPerView: 3,
  69. spaceBetween: 8,
  70. });
  71. //슬라이드 - 이 상품과 비슷한 상품
  72. var relateItemSwiper = new Swiper('.pd .pd_relate .area_slider .swiper-container', {
  73. slidesPerView: 3,
  74. spaceBetween: 8,
  75. });
  76. });
  77. window.onload = function(){
  78. // 위시처리- 로그인 되어 있을시
  79. // if (cfCheckLogin()) {
  80. // //이상품과 함께본 상품
  81. // let targetT = $('#goodsTogetherbArea').find('.item_state').find('.itemLike');
  82. // let targetTSize = targetT.length;
  83. //
  84. // targetT.each(function(){
  85. // let goodsCd = $(this).attr('goodscd');
  86. // let url = "/mypage/wish/list/check/"+goodsCd;
  87. // var result = '';
  88. // $.ajax({
  89. // type: 'get'
  90. // , async: false
  91. // , url: url
  92. // , success: function (data) {
  93. // //likeit active
  94. // if ("Y" == data){
  95. // $(this).addClass('likeit').addClass('active');
  96. // }
  97. // }
  98. // });
  99. // });
  100. //
  101. // }
  102. };
  103. /*]]>*/
  104. </script>
  105. </html>