|
|
@@ -0,0 +1,146 @@
|
|
|
+<!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 : AllBrandFormMob.html
|
|
|
+ * @desc : 전체브랜드 Page
|
|
|
+ *============================================================================
|
|
|
+ * STYLE24
|
|
|
+ * Copyright(C) 2020 TSIT, All rights reserved.
|
|
|
+ *============================================================================
|
|
|
+ * VER DATE AUTHOR DESCRIPTION
|
|
|
+ * === =========== ========== =============================================
|
|
|
+ * 1.0 2021.05.02 bin2107 최초 작성
|
|
|
+ *******************************************************************************
|
|
|
+ -->
|
|
|
+<body>
|
|
|
+
|
|
|
+<th:block layout:fragment="content">
|
|
|
+
|
|
|
+ <main role="" id="" class="container br">
|
|
|
+ <!-- page nav: CS 고객센터 -->
|
|
|
+
|
|
|
+ <!-- ★ 컨텐츠 시작 -->
|
|
|
+ <section class="br_search_wrap">
|
|
|
+ <div class="inner wide" th:if="${mainBrandList != null}" th:with="imgUrl=${@environment.getProperty('upload.image.view')}">
|
|
|
+ <div class="hmenu">
|
|
|
+ <div class="swiper-container brand_si">
|
|
|
+ <div class="swiper-wrapper">
|
|
|
+ <div class="swiper-slide" th:each="item, status : ${mainBrandList}">
|
|
|
+ <div>
|
|
|
+ <a href="javascript:void(0);" th:onClick="cfnGoToBrandMain([[${item.brandGroupNo}]]);">
|
|
|
+ <span><img th:src="${imgUrl+item.logoFileNm}" alt=""></span>
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- Add Pagination -->
|
|
|
+ <div class="swiper-pagination"></div>
|
|
|
+ </div>
|
|
|
+ <div class="line"></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="inner">
|
|
|
+ <form id="searchBrandForm" name="searchBrandForm">
|
|
|
+ <div class="brand_title">
|
|
|
+ <input type="text" id="search" name="search" placeholder="브랜드명을 입력해주세요">
|
|
|
+ <!-- <button class="btn_x">X</button> -->
|
|
|
+ <button type="button" onclick="fnSearchBrand();"><img src="/images/mo/cs_search_btn.png" alt=""></button>
|
|
|
+ </div>
|
|
|
+ </form>
|
|
|
+ </div>
|
|
|
+ <div id="idBrandList"></div>
|
|
|
+
|
|
|
+ </section>
|
|
|
+ <!-- ★ 컨텐츠 종료 -->
|
|
|
+
|
|
|
+ </main>
|
|
|
+
|
|
|
+<script th:inline="javascript">
|
|
|
+/*<![CDATA[*/
|
|
|
+ $(document).ready(function(){
|
|
|
+ setHtop();
|
|
|
+ fnCreateAllBrandList();
|
|
|
+ });
|
|
|
+
|
|
|
+ let fnSearchBrand = function(){
|
|
|
+ var searchBrand = $("#searchBrandForm").find("input[name=search]").val();
|
|
|
+ fnCreateAllBrandList(searchBrand);
|
|
|
+ }
|
|
|
+
|
|
|
+ let fnCreateAllBrandList = function (brandGroupNm){
|
|
|
+ let actionUrl = '/display/all/brand/list'
|
|
|
+ if(!gagajf.isNull(brandGroupNm)){
|
|
|
+ actionUrl += '?brandGroupNm='+brandGroupNm;
|
|
|
+ }
|
|
|
+
|
|
|
+ $.getJSON(actionUrl
|
|
|
+ , function(result, status){
|
|
|
+ if(result.length>0){
|
|
|
+ $("#idBrandList").html('');
|
|
|
+ let tag = '';
|
|
|
+ let prevNav = '';
|
|
|
+ $.each(result, function (idx, item){
|
|
|
+ if(prevNav != item.brandInitial){
|
|
|
+ if(idx>0){
|
|
|
+ tag += ' </div>\n';
|
|
|
+ tag += '</div>\n';
|
|
|
+ }
|
|
|
+ tag += '<div class="inner">\n';
|
|
|
+ tag += ' <div class="result">\n';
|
|
|
+ tag += ' <p class="title_abbr">'+item.brandInitial+'</p>\n';
|
|
|
+ tag += ' <div class="brand">\n';
|
|
|
+ $.each(result, function (idx, item2){
|
|
|
+ if(item.brandInitial == item2.brandInitial){
|
|
|
+ tag += ' <a href="javascript:void(0);" onclick="cfnGoToBrandMain('+item2.brandGroupNo+');">'+item2.brandGroupNm+'\n';
|
|
|
+ if(item.dispNmLang=='KR'){
|
|
|
+ tag += '<span>'+item2.brandGroupEnm+'</span>';
|
|
|
+ }else{
|
|
|
+ tag += '<span>'+item2.brandGroupKnm+'</span>';
|
|
|
+ }
|
|
|
+ tag += ' </a>';
|
|
|
+ }
|
|
|
+ });
|
|
|
+ tag += ' </div>\n';
|
|
|
+ }
|
|
|
+ prevNav = item.brandInitial;
|
|
|
+ });
|
|
|
+ tag += ' </div>\n';
|
|
|
+ tag += '</div>\n';
|
|
|
+ $("#idBrandList").html(tag);
|
|
|
+ }else{
|
|
|
+ $("#idBrandList").html('');
|
|
|
+ $("#idNodata").show();
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ function setHtop() {
|
|
|
+ if($('header').hasClass('main')) {
|
|
|
+ $('#htopMain').show();
|
|
|
+ $('#htopSub').hide();
|
|
|
+ } else {
|
|
|
+ $('#htopMain').hide();
|
|
|
+ $('#gnb').hide();
|
|
|
+ $('#htopSub').show();
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ var swiperBrand = new Swiper('.swiper-container.brand_si', {
|
|
|
+ slidesPerView: 3,
|
|
|
+ slidesPerColumn: 2,
|
|
|
+ spaceBetween: 0,
|
|
|
+ pagination: {
|
|
|
+ el: '.swiper-pagination',
|
|
|
+ clickable: true,
|
|
|
+ },
|
|
|
+ });
|
|
|
+</script>
|
|
|
+
|
|
|
+</th:block>
|
|
|
+
|
|
|
+</body>
|
|
|
+</html>
|
bin2107