增加价格筛选

src/components/toolbar/index.vue

@@ -15,7 +15,7 @@
       <div class="text">报名咨询</div>
     </div>
     <div class="item">
-      <img src="@/assets/top.png" class="img" alt="" />
+      <img src="@/assets/top.png" class="img" alt="" @click="scollTop" />
       <div class="text">返回顶部</div>
     </div>
   </div>
@@ -29,7 +29,9 @@ export default {
     ...mapGetters(["userInfo"]),
   },
   data() {
-    return {};
+    return {
+      scrollTimer: null,
+    };
   },
   methods: {
     go(path) {
@@ -37,6 +39,18 @@ export default {
         path,
       });
     },
+    scollTop() {
+      clearInterval(this.scrollTimer);
+      this.scrollTimer = setInterval(() => {
+        const top = document.documentElement.scrollTop;
+        const speed = top / 10;
+        if (document.documentElement.scrollTop !== 0) {
+          document.documentElement.scrollTop -= speed;
+        } else {
+          clearInterval(this.scrollTimer);
+        }
+      }, 16);
+    },
   },
 };
 </script>

src/pages/bank-list/index.vue

@@ -80,9 +80,27 @@
           <div class="course-list">
             <div class="course-list__header">
               <div class="sort-list">
-                <div class="sort-list__item active">综合排序</div>
-                <div class="sort-list__item">低价优先</div>
-                <div class="sort-list__item">高价优先</div>
+                <div
+                  class="sort-list__item"
+                  @click="changeSort(1)"
+                  :class="{ active: params.sortType == 1 ? true : false }"
+                >
+                  综合排序
+                </div>
+                <div
+                  class="sort-list__item"
+                  @click="changeSort(2)"
+                  :class="{ active: params.sortType == 2 ? true : false }"
+                >
+                  低价优先
+                </div>
+                <div
+                  class="sort-list__item"
+                  @click="changeSort(3)"
+                  :class="{ active: params.sortType == 3 ? true : false }"
+                >
+                  高价优先
+                </div>
               </div>
             </div>
             <div class="course-list__body">
@@ -159,6 +177,7 @@ export default {
         pageSize: 12,
         goodsStatus: 1,
         goodsType: 2,
+        sortType: 1,
       },
       goodsList: [],
     };
@@ -168,6 +187,11 @@ export default {
     this.changeSubject();
   },
   methods: {
+    changeSort(sortType) {
+      if (this.params.sortType == sortType) return;
+      this.params.sortType = sortType;
+      this.changeSubject();
+    },
     currentChange(e) {
       this.params.pageNum = e;
       this.changeSubject();

src/pages/course-list/index.vue

@@ -80,9 +80,27 @@
           <div class="course-list">
             <div class="course-list__header">
               <div class="sort-list">
-                <div class="sort-list__item active">综合排序</div>
-                <div class="sort-list__item">低价优先</div>
-                <div class="sort-list__item">高价优先</div>
+                <div
+                  class="sort-list__item"
+                  @click="changeSort(1)"
+                  :class="{ active: params.sortType == 1 ? true : false }"
+                >
+                  综合排序
+                </div>
+                <div
+                  class="sort-list__item"
+                  @click="changeSort(2)"
+                  :class="{ active: params.sortType == 2 ? true : false }"
+                >
+                  低价优先
+                </div>
+                <div
+                  class="sort-list__item"
+                  @click="changeSort(3)"
+                  :class="{ active: params.sortType == 3 ? true : false }"
+                >
+                  高价优先
+                </div>
               </div>
             </div>
             <div class="course-list__body">
@@ -159,6 +177,7 @@ export default {
         pageSize: 12,
         goodsStatus: 1,
         goodsType: 1,
+        sortType: 1,
       },
       goodsList: [],
     };
@@ -168,6 +187,11 @@ export default {
     this.changeSubject();
   },
   methods: {
+    changeSort(sortType) {
+      if (this.params.sortType == sortType) return;
+      this.params.sortType = sortType;
+      this.changeSubject();
+    },
     currentChange(e) {
       this.params.pageNum = e;
       this.changeSubject();