https://creverse.com/js/channel/news/list.js

1/**
2 * 청담소식 리스트
3 *
4 * Created by [email protected] on 2019/02/14
5 */
6
7var LIST = "list";
8var SEARCH = "searchList";
9
10$(function() {
11  new Vue({
12    el: "#contents",
13    data: {
14      item: {
15        newsCodes: [
16          {
17            code: "",
18            name: ""
19          }
20        ],
21        newsTopList: [
22          {
23            bdId: "",
24            bdCategory: "",
25            bdTitle: "",
26            bdContents: "",
27            bdCreateDate: "",
28            bdReadCount: "",
29            bdLinkUrl: ""
30          }
31        ],
32        newsList: [
33          {
34            bdId: "",
35            bdCategory: "",
36            bdTitle: "",
37            bdContents: "",
38            bdCreateDate: "",
39            bdReadCount: "",
40            bdLinkUrl: "",
41            bdAttachCount: ""
42          }
43        ],
44        academicScheduleList: []
45      },
46      paging: {
47        lastPageNo: 0
48      },
49      params: {
50        currentPageNo: "1",
51        bdCategory: "",
52        searchField: "bd_title",
53        keyWord: "",
54        flag: "",
55        tab: "",
56        brchType: "",
57        subBrand: ""
58      }
59    },
60    computed: {
61      itemsCount: function() {
62        // 게시물 수
63        return this.paging.totalRecordCount;
64      }
65    },
66    created: function() {
67      $("#contents, footer").css("display", "none");
68
69      $(".card-list").css("display", "none");
70      $(".semester-list").css("display", "none");
71
72      var _this = this;
73      $(window).on("hashchange", function() {
74        _this.fetchData("hashchange");
75      });
76
77      this.params.flag = LIST;
78      this.params.subBrand = document.getElementsByName("subBrand")[0].value;
79      _.merge(this.params, hashbang.params());
80      this.fetchData();
81    },
82    mounted: function() {
83      ui.reInit($jq("#contents"));
84    },
85    updated: function() {
86      // 모바일 상단리스트 슬라이딩 처리
87      this.initSwiper();
88    },
89    methods: {
90      fetchData: function(evt) {
91        // 리스트 데이터
92        var _this = this;
93        $.ajax({

94          method: "GET",
95          url: "/channel/news/list.json",
96          data: _this.params,
97          dataType: "json"
98        }).done(function(r) {
99          if (r.success) {
100            _this.item = r.data.item;
101            //console.log(JSON.stringify(_this.item.academicScheduleList));
102            _this.paging = r.data.paging;
103            _this.$nextTick(function() {
104              $("#contents, footer").css("display", "block");
105              ui.reInit($jq("#contents"));
106              $(window).scrollTop(0);
107            });
108          } else {
109            alert(r.fieldErrors[0].message);
110            $("#" + r.fieldErrors[0].field).focus();
111          }
112        });
113      },
114      goToPage: function(page) {
115        // 페이지 이동
116        if (isMobile.any) {
117          $("#contents, footer").css("display", "none");
118        }
119        var _this = this;
120        _this.params.currentPageNo = page;
121        hashbang.params(this.params);
122        if (isMobile.any) {
123          location.reload();
124        }
125      },
126      search: function() {
127        // 검색 이벤트
128        if (isMobile.any) {
129          $("#contents, footer").css("display", "none");
130        }
131        this.params.currentPageNo = 1;
132        this.params.flag = SEARCH;
133        hashbang.params(this.params);
134        if (isMobile.any) {
135          location.reload();
136        }
137      },
138      itemNo: function(index) {
139        // 게시글 번호
140        var pg = this.paging;

141        return pg.totalRecordCount - (pg.currentPageNo - 1) * pg.recordCountPerPage - index;
142      },
143      diffDays: function(day) {
144        // 날짜 계산
145        return dayjs(new Date()).diff(day, "day");
146      },
147      detail: function(id, link, arg) {
148        var _this = this;
149        // 상세 페이지이동, 링크이동(조회수 증가)
150        if (link) {
151          $.ajax({
152            method: "POST",
153            url: "/channel/news/view-count-update.json",
154            data: { bdId: id },
155            dataType: "json"
156          }).done(function(r) {
157            location.href = link;
158          });
159        } else {
160          var subBrand = _this.params.subBrand;
161          if (subBrand == "i-garten") {
162            location.href = "/brand/igarten/channel/news/detail?bdId=" + id + "&flagD=" + arg + "&ref=" + hashbang.uri();
163          } else {
164            location.href = "/channel/news/detail?bdId=" + id + "&flagD=" + arg + "&ref=" + hashbang.uri();
165          }
166        }
167      },
168      tabMenu: function(bdCategory) {
169        if (isMobile.any) {
170          $("#contents, footer").css("display", "none");
171        }
172        // 탭메뉴 클릭 이벤트
173        var _this = this;
174        _this.params.flag = LIST;
175        _this.params.currentPageNo = 1;
176        _this.params.searchField = "bd_title";
177        _this.params.keyWord = "";
178        _this.params.bdCategory = bdCategory;
179        hashbang.params(_this.params);
180        if (isMobile.any) {
181          location.reload();
182        }
183      },
184
185      format: function(dateStr) {
186        return dayjs(dateStr).format("YYYY.MM.DD");
187      },
188      toLowerCase: function(str) {
189        return str.toLowerCase();
190      },
191      initSwiper: function() {
192        var _this = this;
193        if (_this.params.bdCategory != "Semester") {
194          if ($(".card-list").hasClass("swiper-initialized")) {
195            swiper.destroy();
196          }
197          swiper = new Swiper(".card-list", {
198            direction: "horizontal",
199            spaceBetween: 12,
200            slidesPerView: 4,
201            slidesPerGroup: 1,
202            draggable: false,
203            init: false,
204            initialSlide: 0,
205            breakpoints: {
206              1024: {
207                slidesPerView: 4,
208                slidesPerGroup: 1
209              },
210              768: {
211                slidesPerView: 3,
212                slidesPerGroup: 1
213              },
214              0: {
215                slidesPerView: 1,
216                slidesPerGroup: 1
217              }
218            }
219          });
220        } else {
221          if ($(".semester-list").hasClass("swiper-initialized")) {
222            swiper.destroy();
223          }
224          swiper = new Swiper(".semester-list", {
225            direction: "horizontal",
226            spaceBetween: 12,
227            slidesPerView: 1,
228            slidesPerGroup: 1,
229            initialSlide: 0,
230            draggable: false,
231            init: false
232          });
233        }
234
235        swiper.on("afterInit", function() {
236          if (_this.params.bdCategory != "Semester") {
237            $(".card-list").css("display", "block");
238          } else {
239            $(".semester-list").css("display", "block");
240          }
241        });
242
243        swiper.init();
244
245        if (window.innerWidth < 1024) {
246          if ($(".card-list").hasClass("swiper-no-swiping")) {
247            $(".card-list").removeClass("swiper-no-swiping");
248          }
249        } else {
250          if (!$(".card-list").hasClass("swiper-no-swiping")) {
251            $(".card-list").addClass("swiper-no-swiping");
252          }
253        }
254      }
255    }
256  }); // Vue
257}); // function
258
259var swiper = null;
260
261$(window).resize(function() {
262  if (window.innerWidth < 1024) {
263    if ($(".card-list").hasClass("swiper-no-swiping")) {
264      $(".card-list").removeClass("swiper-no-swiping");
265    }
266  } else {
267    if (!$(".card-list").hasClass("swiper-no-swiping")) {
268      $(".card-list").addClass("swiper-no-swiping");
269    }
270  }
271});