GoodsDealDescFormMob.html 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336
  1. <!DOCTYPE html>
  2. <html lang="ko"
  3. xmlns:th="http://www.thymeleaf.org">
  4. <!--
  5. *******************************************************************************
  6. * @source : GoodsDetailDescFormMob.html
  7. * @desc : 딜 구상상품상세 Page
  8. *============================================================================
  9. * STYLE24
  10. * Copyright(C) 2020 TSIT, All rights reserved.
  11. *============================================================================
  12. * VER DATE AUTHOR DESCRIPTION
  13. * === =========== ========== =============================================
  14. * 1.0 2021.04.19 eskim 최초 작성
  15. *******************************************************************************
  16. -->
  17. <div class="content pd_descrp" th:with="imgGoodsUrl=${@environment.getProperty('upload.goods.view')}, uxImgUrl=${@environment.getProperty('domain.uximage')}, imgUrl=${@environment.getProperty('upload.image.view')}">
  18. <div class="cont_head">
  19. <h3 class="sr-only">상품상세정보</h3>
  20. </div>
  21. <div class="cont_body on">
  22. <!-- 상품설명 노출 -->
  23. <div class="descrp_box" th:if="${goodsInfo.tobeFormYn == 'Y'}">
  24. <div class="desc_simple"> <!-- 상품 간략설명-->
  25. <span class="tit_desc" th:if="${goodsInfo.goodsTitle != null and !goodsInfo.goodsTitle.empty}" th:utext="${#strings.unescapeJava(#strings.escapeJava(goodsInfo.goodsTitle))}">사이드 밴딩으로 편안한 만능 슬랙스!</span>
  26. <p class="ptxt01"th:if="${goodsInfo.goodsTitleDesc}" th:utext="${#strings.unescapeJava(#strings.escapeJava(goodsInfo.goodsTitleDesc))}">
  27. 슬림핏에 사이드 밴딩으로 편안함을 더해준 슬랙스입니다.
  28. </p>
  29. </div>
  30. <div class="desc_character" th:if="${goodsInfo.goodsSpecialDesc != null and !goodsInfo.goodsSpecialDesc.empty}"> <!-- 상품특징 -->
  31. <span class="tit_desc">상품특징</span>
  32. <p class="ptxt01" th:utext="${#strings.unescapeJava(#strings.escapeJava(goodsInfo.goodsSpecialDesc))}">
  33. - 지퍼플러 장식을 더해 완성도를 높여줌
  34. </p>
  35. </div>
  36. </div>
  37. <!-- //상품설명 노출 -->
  38. <!-- 관리자 에디터입력 내용 노출 -->
  39. <div class="mdhtml_box">
  40. <th:block th:if="${goodsNoticeList != null and !goodsNoticeList.empty}" >
  41. <th:block th:each="goodsNotice, status : ${goodsNoticeList}" th:utext="${#strings.unescapeJava(#strings.escapeJava(goodsNotice.noticeContent))}"></th:block >
  42. </th:block>
  43. <!-- 관리자 에디터입력 내용 공지 html -->
  44. <th:block th:each="goodsVideo, status : ${goodsVideoList}">
  45. <div class="movblock">
  46. <th:block th:if="${goodsVideo.videoGb == 'Y'}">
  47. <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>
  48. </th:block>
  49. <th:block th:unless="${goodsVideo.videoGb == 'Y'}">
  50. </th:block>
  51. </div>
  52. </th:block>
  53. <!-- 공통상품베너 -->
  54. <th:block th:if="${goodsBannerList != null and !goodsBannerList.empty}">
  55. <th:block th:each="goodsBanner, status : ${goodsBannerList}" >
  56. <th:block th:if="${goodsBanner.strVar1 != null and not #strings.equals(goodsBanner.strVar1, '#')}">
  57. <a th:href="${goodsBanner.strVar1}" target="_blank">
  58. <img th:src="${imgUrl+goodsBanner.imgPath1}" alt="">
  59. </a>
  60. </th:block>
  61. <th:block th:unless="${goodsBanner.strVar1 != null and not #strings.equals(goodsBanner.strVar1, '#')}">
  62. <img th:src="${imgUrl+goodsBanner.imgPath1}" alt="">
  63. </th:block>
  64. </th:block>
  65. </th:block>
  66. <!-- 관리자 에디터입력 내용 노출 상단 html -->
  67. <th:block th:if="${goodsInfo.goodsTopDesc != null and !goodsInfo.goodsTopDesc.empty and goodsInfo.selfGoodsYn =='Y'}" th:utext="${#strings.unescapeJava(#strings.escapeJava(goodsInfo.goodsTopDesc))}"></th:block >
  68. <th:block th:if="${goodsInfo.goodsDesc != null and !goodsInfo.goodsDesc.empty}" th:utext="${#strings.unescapeJava(#strings.escapeJava(goodsInfo.goodsDesc))}"></th:block>
  69. </div>
  70. <th:block th:if="${goodsInfo.tobeFormYn == 'Y'}">
  71. <!-- 착용컷 노출 -->
  72. <div class="view_outfit_box" th:if="${#strings.contains(goodsImgList,'_M1')
  73. or #strings.contains(goodsImgList,'_M2')
  74. or #strings.contains(goodsImgList,'_M3')
  75. or #strings.contains(goodsImgList,'_M4')
  76. or #strings.contains(goodsImgList,'_M5')}">
  77. <span class="tit_view">OUTFIT VIEW</span>
  78. <span class="model_info">(모델정보 : 185cm / 78kg / XL 착용)</span>
  79. <div class="view">
  80. <th:block th:each="goodsImg, status : ${goodsImgList}" th:if="${#strings.contains(goodsImg.sysImgNm,'_M1')
  81. or #strings.contains(goodsImg.sysImgNm,'_M2')
  82. or #strings.contains(goodsImg.sysImgNm,'_M3')
  83. or #strings.contains(goodsImg.sysImgNm,'_M4')
  84. or #strings.contains(goodsImg.sysImgNm,'_M5')}">
  85. <img th:src="${imgGoodsUrl+'/'+goodsImg.sysImgNm+'?RS=360'}" alt="">
  86. </th:block>
  87. </div>
  88. </div>
  89. <!-- //착용컷 노출 -->
  90. <!-- 상품컷 노출 -->
  91. <div class="view_detail_box" th:if="${#strings.contains(goodsImgList,'_01')
  92. or #strings.contains(goodsImgList,'_02')
  93. or #strings.contains(goodsImgList,'_D1')
  94. or #strings.contains(goodsImgList,'_D2')
  95. or #strings.contains(goodsImgList,'_D3')
  96. or #strings.contains(goodsImgList,'_D4')
  97. or #strings.contains(goodsImgList,'_D5')}">
  98. <span class="tit_view">PRODUCT VIEW</span>
  99. <div class="view">
  100. <th:block th:each="goodsImg, status : ${goodsImgList}" th:if="${#strings.contains(goodsImg.sysImgNm,'_01')
  101. or #strings.contains(goodsImg.sysImgNm,'_02')
  102. or #strings.contains(goodsImg.sysImgNm,'_D1')
  103. or #strings.contains(goodsImg.sysImgNm,'_D2')
  104. or #strings.contains(goodsImg.sysImgNm,'_D3')
  105. or #strings.contains(goodsImg.sysImgNm,'_D4')
  106. or #strings.contains(goodsImg.sysImgNm,'_D5')}">
  107. <img th:src="${imgGoodsUrl+'/'+goodsImg.sysImgNm+'?RS=360'}" alt="">
  108. </th:block>
  109. </div>
  110. </div>
  111. <!-- //상품컷 노출 -->
  112. <!-- 원단 노출 -->
  113. <div class="view_fabric_box" th:if="${#strings.contains(goodsImgList,'_S1')}">
  114. <span class="tit_view">FABRIC</span>
  115. <div class="view">
  116. <th:block th:each="goodsImg, status : ${goodsImgList}" th:if="${#strings.contains(goodsImg.sysImgNm,'_S1')}">
  117. <img th:src="${imgGoodsUrl+'/'+goodsImg.sysImgNm}" alt="">
  118. </th:block>
  119. </div>
  120. </div>
  121. <!-- //원단 노출 -->
  122. <!-- 라벨 노출 -->
  123. <div class="view_label_box" th:if="${#strings.contains(goodsImgList,'_L1')
  124. or #strings.contains(goodsImgList,'_L2')}">
  125. <span class="tit_view">LABEL INFO</span>
  126. <div class="view">
  127. <span>
  128. <th:block th:each="goodsImg, status : ${goodsImgList}" th:if="${#strings.contains(goodsImg.sysImgNm,'_L1')
  129. or #strings.contains(goodsImg.sysImgNm,'_L2')}">
  130. <img th:src="${imgGoodsUrl+'/'+goodsImg.sysImgNm}" alt="">
  131. </th:block>
  132. </span>
  133. </div>
  134. </div>
  135. <!-- //라벨 노출 -->
  136. <div class="view_detail_box" th:if="${not #strings.contains(goodsImgList,'_01')}">
  137. <div class="view">
  138. <th:block th:each="goodsImg, status : ${goodsImgList}" >
  139. <img th:src="${imgGoodsUrl+'/'+goodsImg.sysImgNm+'?RS=360'}" alt="">
  140. </th:block>
  141. </div>
  142. </div>
  143. </th:block>
  144. <!-- 관리자 에디터입력 내용 노출 하다단 html -->
  145. <div class="mdhtml_box" th:if="${goodsInfo.goodsDownDesc != null and !goodsInfo.goodsDownDesc.empty}" th:utext="${#strings.unescapeJava(#strings.escapeJava(goodsInfo.goodsDownDesc))}"></div>
  146. <!-- 브랜드 노출 -->
  147. <div class="brand_box">
  148. <p class="name" th:text="${goodsInfo.brandGroupNm}">TBJ 티비제이</p>
  149. <a href="javascript:void(0);" class="btn btn_default" th:onclick="cfnGoToBrandMain([[${goodsInfo.brandGroupNo}]])" ><span>브랜드 홈 바로가기</span></a>
  150. </div>
  151. <!-- //브랜드 노출 -->
  152. <!-- 상품필수정보 노출 -->
  153. <div class="required_box">
  154. <div class="area_infotbl" th:if="${goodsInfo.goodsType == 'G056_N' and goodsNotiList != null and !goodsNotiList.empty}">
  155. <span class="title">상품고시정보</span>
  156. <div class="tbl type1">
  157. <table>
  158. <tbody>
  159. <tr th:each="goodsNoti, status : ${goodsNotiList}" >
  160. <th th:text="${goodsNoti.niItemNm}">스타일</th>
  161. <td th:text="${goodsNoti.niContent}">F94U-MD01XA60F0</td>
  162. </tr>
  163. </tbody>
  164. </table>
  165. </div>
  166. </div>
  167. <div class="area_infotbl" th:if="${goodsInfo.goodsType == 'G056_S' and goodsComposeList != null and !goodsComposeList.empty}">
  168. <span class="title">상품고시정보</span>
  169. <th:block th:each="goodsCompose, status : ${goodsComposeList}">
  170. <div class="tbl type1">
  171. <table>
  172. <tbody>
  173. <tr th:each="goodsNoti, status : ${goodsCompose.goodsNotiList}" >
  174. <th th:text="${goodsNoti.niItemNm}">스타일</th>
  175. <td th:text="${goodsNoti.niContent}">F94U-MD01XA60F0</td>
  176. </tr>
  177. </tbody>
  178. </table>
  179. </div>
  180. </th:block>
  181. </div>
  182. <th:block th:if="${goodsSafeNo != null}" >
  183. <th:block th:if="${goodsSafeNo.certTargetGb == 'G083_3'}" > <!-- 상세별도표시 -->
  184. <div class="area_kcl no-mark">
  185. <div>
  186. <p class="tit normal"><th:block th:if="${goodsSafeNo.certFormNm}" th:text="${goodsSafeNo.certFormNm + '/'}"></th:block> 제품 상세정보 내 별도 표기</p>
  187. <p class="normal">제품 상세정보 내 표기되어 있습니다. 상품 정보를 확인해주세요.</p>
  188. </div>
  189. </div>
  190. </th:block>
  191. <th:block th:unless="${goodsSafeNo.certTargetGb == 'G083_3'}" > <!-- 인증 -->
  192. <th:block th:if="${goodsSafeNo.certType == 'G081_3'}" > <!-- 공급자적합성 -->
  193. <div class="area_kcl">
  194. <div><i class="ico ico_kcl"></i></div>
  195. <div>
  196. <p class="tit normal"><th:block th:text="${goodsSafeNo.certFormNm}"></th:block> / 공급자적합성확인</p>
  197. <p class="normal">공급자 적합성 확인 품목으로 국가통합인증을 필함</p>
  198. </div>
  199. </div>
  200. </th:block>
  201. <th:block th:unless="${goodsSafeNo.certType == 'G081_3'}" > <!-- 공급자적합성 외 -->
  202. <div class="area_kcl" >
  203. <div><i class="ico ico_kcl"></i></div>
  204. <div>
  205. <th:block th:if="${goodsSafeNo.certFormGb != 'G084_4' and goodsSafeNo.certFormGb != 'G084_5' }">
  206. <p class="tit normal" th:text="${goodsSafeNo.certDiv + ' / ' + goodsSafeNo.certOrganName}">어린이제품 안전인증 / 한국건설생활시험연구원(KCL)</p>
  207. </th:block>
  208. <th:block th:unless="${goodsSafeNo.certFormGb != 'G084_4' and goodsSafeNo.certFormGb != 'G084_5' }">
  209. <p class="tit normal" th:text="${goodsSafeNo.certFormNm + ' 안전인증'}"></p>
  210. </th:block>
  211. <p class="normal" >
  212. <th:block th:if="${goodsSafeNo.certFormGb != 'G084_4' and goodsSafeNo.certFormGb != 'G084_5' }">
  213. <span>인증번호:</span> <a class="num" th:href="@{http://www.safetykorea.kr/search/searchPop(certNum=${goodsSafeNo.certNum})}" target="_blank" th:text="${goodsSafeNo.certNum}">CB123A123-1234</a>
  214. </th:block>
  215. <th:block th:uless="${goodsSafeNo.certFormGb != 'G084_4' and goodsSafeNo.certFormGb != 'G084_5' }">
  216. <span>인증번호:</span> <th:block th:text="${goodsSafeNo.certNum}">CB123A123-1234</th:block>
  217. </th:block>
  218. </p>
  219. </div>
  220. </div>
  221. </th:block>
  222. </th:block>
  223. <p class="t_info dot_info mt10">
  224. 해당 인증정보는 판매자가 등록한 것으로 등록정보에 대한 일체의 책임은 판매자에게 있습니다.
  225. </p>
  226. </th:block>
  227. <div class="area_infotbl">
  228. <span class="title">상품기본정보</span>
  229. <th:block th:if="${goodsInfo.goodsType == 'G056_N'} ">
  230. <div class="tbl type1">
  231. <table>
  232. <tbody>
  233. <tr>
  234. <th>상품코드</th>
  235. <td th:text="${goodsInfo.goodsCd}">14443216</td>
  236. </tr>
  237. <tr>
  238. <th>상품구분</th>
  239. <td th:text="${goodsInfo.goodsGbNm}">병행수입</td>
  240. </tr>
  241. <tr>
  242. <th>브랜드</th>
  243. <td th:text="${goodsInfo.brandGroupNm}">TBJ</td>
  244. </tr>
  245. <tr>
  246. <th>상품명</th>
  247. <td th:text="${goodsInfo.goodsNm}">남성 테이퍼드 핏 겨울 기모면 스판 올 밴딩 팬츠</td>
  248. </tr>
  249. <th:block th:if="${goodsNotiList != null and !goodsNotiList.empty}">
  250. <th:block th:each="goodsNoti, status : ${goodsNotiList}" th:if="${goodsNoti.niItemCd == 'G005_005'}">
  251. <tr>
  252. <th th:text="${goodsNoti.niItemNm}">제조사</th>
  253. <td th:text="${goodsNoti.niContent}"></td>
  254. </tr>
  255. </th:block>
  256. </th:block>
  257. <tr>
  258. <th>제조국</th>
  259. <td th:text="${goodsInfo.originNm}">베트남</td>
  260. </tr>
  261. </tbody>
  262. </table>
  263. </div>
  264. </th:block>
  265. <th:block th:unless="${goodsInfo.goodsType == 'G056_N'} ">
  266. <th:block th:if="${goodsComposeList != null and !goodsComposeList.empty}">
  267. <th:block th:each="goodsCompose, status : ${goodsComposeList}">
  268. <div class="tbl type1">
  269. <table>
  270. <tbody>
  271. <tr>
  272. <th>상품코드</th>
  273. <td th:text="${goodsCompose.compsGoodsCd}">14443216</td>
  274. </tr>
  275. <tr>
  276. <th>상품구분</th>
  277. <td th:text="${goodsCompose.goodsGbNm}">병행수입</td>
  278. </tr>
  279. <tr>
  280. <th>브랜드</th>
  281. <td th:text="${goodsCompose.brandGroupNm}">TBJ</td>
  282. </tr>
  283. <tr>
  284. <th>상품명</th>
  285. <td th:text="${goodsCompose.compsGoodsNm}">남성 테이퍼드 핏 겨울 기모면 스판 올 밴딩 팬츠</td>
  286. </tr>
  287. <th:block th:if="${goodsCompose.goodsNotiList != null and !goodsCompose.goodsNotiList.empty}">
  288. <th:block th:each="goodsNoti, status : ${goodsCompose.goodsNotiList}" th:if="${goodsNoti.niItemCd == 'G005_005'}">
  289. <tr>
  290. <th th:text="${goodsNoti.niItemNm}">제조사</th>
  291. <td th:text="${goodsNoti.niContent}"></td>
  292. </tr>
  293. </th:block>
  294. </th:block>
  295. <tr>
  296. <th>제조국</th>
  297. <td th:text="${goodsCompose.originNm}">베트남</td>
  298. </tr>
  299. </tbody>
  300. </table>
  301. </div>
  302. </th:block>
  303. </th:block>
  304. </th:block>
  305. <p class="t_info dot_info mt10">
  306. 주문제작 상품의 경우 주문 후 제작되어 판매되는 상품으로 제작 시점부터 반품/교환이 어려울 수 있습니다.
  307. </p>
  308. </div>
  309. </div>
  310. <!-- //상품필수정보 노출 -->
  311. </div>
  312. </div>
  313. <script th:inline="javascript">
  314. /*<![CDATA[*/
  315. // 상품상세 asis html 이지미 경로 수정
  316. $(document).ready( function() {
  317. $(".pd_descrp_pop .cont_body").find('img').each(function() {
  318. let tmpImgSrc = $(this).attr('src');
  319. if (tmpImgSrc.indexOf('Upload') == 1 ){ // /Upload
  320. $(this).attr('src' , tmpImgSrc.replace('/Upload', _imgUrl+"/Local"));
  321. }
  322. });
  323. });
  324. /*]]>*/
  325. </script>
  326. </html>