huai-sian 3 년 전
부모
커밋
e348442eee
6개의 변경된 파일145개의 추가작업 그리고 18개의 파일을 삭제
  1. 5 0
      css/list-style.css
  2. 0 0
      css/list-style.css.map
  3. 4 0
      css/list-style.scss
  4. 2 2
      index_designerList.html
  5. 98 2
      js/index.js
  6. 36 14
      json/designers.json

+ 5 - 0
css/list-style.css

@@ -718,6 +718,11 @@ a {
   border-bottom: 2px solid #EE7800;
 }
 
+.infoContent .likeSee span {
+  color: #727679;
+  font-size: .9rem;
+}
+
 .infoContent .likeSee__divider {
   height: 12px;
   display: inline-block;

파일 크기가 너무 크기때문에 변경 상태를 표시하지 않습니다.
+ 0 - 0
css/list-style.css.map


+ 4 - 0
css/list-style.scss

@@ -574,6 +574,10 @@ a {
         }
     }
     .likeSee {
+        span {
+            color: #727679;
+            font-size: .9rem;
+        }
         &__divider {
             height: 12px;
             display: inline-block;

+ 2 - 2
index_designerList.html

@@ -1083,9 +1083,9 @@
                     </li> -->
                   </ul>
                   <div class="likeSee" hidden>
-                    <a href="">人氣</a>
+                    <span class="likeSee__views">人氣</span>
                     <span class="likeSee__divider"></span>
-                    <a href="">最新</a>
+                    <span class="likeSee__sort">最新</span>
                   </div>
                   <aside class="nav-collapse-fixed" id="nav-collapse">
                     <ul class="nav d-flex nav-collpase flex-wrap pill-aside" id="pills-tab" role="tablist">

+ 98 - 2
js/index.js

@@ -2,6 +2,32 @@ let userAgent;
 let isSafari = false;
 let browserName;
 
+let filter;
+
+$('.likeSee__views').click(function() {
+    window.location.href = './index_designerList.html'
+})
+
+$('.likeSee__sort').click(function() {
+    window.location.href = './index_designerList.html?q=dateSort'
+})
+
+function getpathId(){
+    let query = window.location.search.split('?').pop();
+    return query.split('=')[1];
+}
+
+function getQuery() {
+    let query = getpathId();
+    if(query == 'dateSort'){
+        filter = 'dateSort';
+    } else {
+        filter = 'views';
+    }
+}
+
+getQuery();
+
 // pagination variables
 let num_per_page = 9;
 let n = 0;
@@ -38,6 +64,10 @@ window.onload = function(){
     }).done(function (msg) {
         designer = [...msg][id];
         console.log(designer)
+        designer['Content'][0]['Carddata'].sort(function (a, b){
+            return a[filter] > b[filter]? -1:1;
+        })
+        console.log(designer['Content'][0]['Carddata']);
         renderinfoCard(designer)
         renderTab(designer['Content'])
         renderTabContent(designer['Content'])
@@ -305,7 +335,73 @@ function loadMore(designer) {
     let nowTab = document.querySelector('.infoContent .tab-pane.show')
     if(nowTab === document.querySelector('#pills-intro')) {
         let pageNum = Math.ceil(totalPages.intro / 9);
-        if ($(this).scrollTop() > 2300) {
+        if ($(this).scrollTop() > 1800) {
+            if(n >= pageNum) {
+                n = pageNum;
+                return;
+              } else {
+                n ++;
+                console.log('test');
+                let append = '';
+                let d = designer['Content'][0].Carddata.slice(9*n, (9*n)+9);
+                for(let j = 0;j < d.length; j ++) {
+                    append += `<div class="col-md-4">
+                                    <a href="" target="_blank">
+                                    <div class="card">
+                                        <div class="card__bgImg" style="background-image: url(${d[j]['imgURL']});">
+                                        </div>
+                                        <div class="card-body">
+                                        <h5 class="card-title card__title mt-0">${d[j]['title']}</h5>
+                                        <p class="card-text mb-0">
+                                            <a href="" class="card__tag" target="_blank">混搭風</a>
+                                            <a href="" class="card__tag" target="_blank">混搭風</a>
+                                            <a href="" class="card__tag" target="_blank">混搭風</a>
+                                        </p>
+                                        </div>
+                                    </div>
+                                    </a>
+                                </div>`
+                }
+                $('#pills-intro .work__row').append(append);
+            }
+        
+        }
+    } else if (nowTab === document.querySelector('#pills-video')) {
+        let pageNum = Math.ceil(totalPages.intro / 9);
+        if ($(this).scrollTop() > 1800) {
+            if(n >= pageNum) {
+                n = pageNum;
+                return;
+              } else {
+                n ++;
+                console.log('test');
+                let append = '';
+                let d = designer['Content'][0].Carddata.slice(9*n, (9*n)+9);
+                for(let j = 0;j < d.length; j ++) {
+                    append += `<div class="col-md-4">
+                                    <a href="" target="_blank">
+                                    <div class="card">
+                                        <div class="card__bgImg" style="background-image: url(${d[j]['imgURL']});">
+                                        </div>
+                                        <div class="card-body">
+                                        <h5 class="card-title card__title mt-0">${d[j]['title']}</h5>
+                                        <p class="card-text mb-0">
+                                            <a href="" class="card__tag" target="_blank">混搭風</a>
+                                            <a href="" class="card__tag" target="_blank">混搭風</a>
+                                            <a href="" class="card__tag" target="_blank">混搭風</a>
+                                        </p>
+                                        </div>
+                                    </div>
+                                    </a>
+                                </div>`
+                }
+                $('#pills-video .work__row').append(append);
+            }
+        
+        }
+    } else if (nowTab === document.querySelector('#pills-columns')) {
+        let pageNum = Math.ceil(totalPages.intro / 9);
+        if ($(this).scrollTop() > 1800) {
             if(n >= pageNum) {
                 n = pageNum;
                 return;
@@ -332,7 +428,7 @@ function loadMore(designer) {
                                     </a>
                                 </div>`
                 }
-                $('.work__row').append(append);
+                $('#pills-columns .work__row').append(append);
             }
         
         }

+ 36 - 14
json/designers.json

@@ -65,9 +65,9 @@
           "Carddata": [
             { 
               "imgURL": "https://images.hhh.com.tw/uploads/_hcase_orig/designer494_39_05.jpg",
-              "title": "藏岳│混搭風│26坪",
+              "title": "藏岳│混搭風│999坪",
               "tags": [
-                { 
+                {
                   "name": "混搭風",
                   "link": ""
                 },
@@ -79,11 +79,13 @@
                   "name": "混搭風",
                   "link": ""
                 }
-              ]
+              ],
+              "views": 999,
+              "dateSort": 1
             },
             { 
               "imgURL": "https://images.hhh.com.tw/uploads/_hcase_orig/designer494_39_05.jpg",
-              "title": "藏岳│混搭風│26坪",
+              "title": "藏岳│混搭風│1030坪",
               "tags": [
                 { 
                   "name": "混搭風",
@@ -97,7 +99,9 @@
                   "name": "混搭風",
                   "link": ""
                 }
-              ]
+              ],
+              "views": 1030,
+              "dateSort": 2
             },
             { 
               "imgURL": "https://images.hhh.com.tw/uploads/_hcase_orig/designer494_39_05.jpg",
@@ -115,7 +119,9 @@
                   "name": "混搭風",
                   "link": ""
                 }
-              ]
+              ],
+              "views": 1011,
+              "dateSort": 3
             },
             { 
               "imgURL": "https://images.hhh.com.tw/uploads/_hcase_orig/designer494_39_05.jpg",
@@ -133,7 +139,9 @@
                   "name": "混搭風",
                   "link": ""
                 }
-              ]
+              ],
+              "views": 990,
+              "dateSort": 4
             },
             { 
               "imgURL": "https://images.hhh.com.tw/uploads/_hcase_orig/designer494_39_05.jpg",
@@ -151,7 +159,9 @@
                   "name": "混搭風",
                   "link": ""
                 }
-              ]
+              ],
+              "views": 899,
+              "dateSort": 5
             },
             { 
               "imgURL": "https://images.hhh.com.tw/uploads/_hcase_orig/designer494_39_05.jpg",
@@ -169,7 +179,9 @@
                   "name": "混搭風",
                   "link": ""
                 }
-              ]
+              ],
+              "views": 800,
+              "dateSort": 6
             },
             { 
               "imgURL": "https://images.hhh.com.tw/uploads/_hcase_orig/designer494_39_05.jpg",
@@ -187,7 +199,9 @@
                   "name": "混搭風",
                   "link": ""
                 }
-              ]
+              ],
+              "views": 950,
+              "dateSort": 7
             },
             { 
               "imgURL": "https://images.hhh.com.tw/uploads/_hcase_orig/designer494_39_05.jpg",
@@ -205,7 +219,9 @@
                   "name": "混搭風",
                   "link": ""
                 }
-              ]
+              ],
+              "views": 920,
+              "dateSort": 8
             },
             { 
               "imgURL": "https://images.hhh.com.tw/uploads/_hcase_orig/designer494_39_05.jpg",
@@ -223,7 +239,9 @@
                   "name": "混搭風",
                   "link": ""
                 }
-              ]
+              ],
+              "views": 940,
+              "dateSort": 9
             },
             { 
               "imgURL": "https://images.hhh.com.tw/uploads/_hcase_orig/designer494_39_05.jpg",
@@ -241,7 +259,9 @@
                   "name": "混搭風",
                   "link": ""
                 }
-              ]
+              ],
+              "views": 970,
+              "dateSort": 10
             },
             { 
               "imgURL": "https://images.hhh.com.tw/uploads/_hcase_orig/designer494_39_05.jpg",
@@ -259,7 +279,9 @@
                   "name": "混搭風",
                   "link": ""
                 }
-              ]
+              ],
+              "views": 985,
+              "dateSort": 11
             }
           ]
         },

이 변경점에서 너무 많은 파일들이 변경되어 몇몇 파일들은 표시되지 않았습니다.