x

src/store/modules/xianhuo/xianhuo.js

@@ -14,9 +14,11 @@ const state = {
   zyFilter: false,
   zyClass: false,
   zyRank: false,
-  classData:[],
+  classData: [],
   classLight: {},
   zyFilterData: {}, //过滤数据
+  zyData: [],
+  total: 0,
 }
 const mutations = {
   xianhuo(state, payload) {
@@ -30,6 +32,8 @@ const mutations = {
       state.classData = payload.data;
     } else if (payload.type == "class_light") {
       state.classLight = payload.data;
+    } else if (payload.type == "zydata") {
+      state.zyData = payload.data
     }
   }
 }
@@ -40,36 +44,46 @@ const actions = {
     Services.getZyData(qs.stringify(payload.data)).then((res) => {
       let data = res.data;
       if (data.error_code == 0) {
+        state.total = data.data.total;
         if (data.data.aggs) {
-          commit("xianhuo", {//过滤数据
+          commit("xianhuo", { //过滤数据
             type: "filter",
             bool: true,
             data: data.data.aggs,
           })
         }
-        if (data.data.class) {//分类数据
+        if (data.data.class) { //分类数据
           commit("xianhuo", {
             type: "class",
             bool: true,
             data: data.data.class,
           })
         }
-        if (data.data.class_light) {//分类选中数据
+        if (data.data.class_light) { //分类选中数据
           commit("xianhuo", {
             type: "class_light",
             data: data.data.class_light,
           })
         }
-        if (data.data.total !== 0) {//数据总数
+        if (data.data.total !== 0) { //数据总数
           commit("xianhuo", {
             type: "rank",
             bool: true,
             data: data.data.aggs
           })
         }
+        if (data.data.data.data_list) {
+          commit('xianhuo', {
+            type: 'zydata',
+            data: data.data.data.data_list
+          })
+        }
+
+      } else {
 
-      } else {}
-    }).catch(function (err) {});
+      }
+    }).catch(function (err) {
+    });
   }
 }
 

src/views/xianhuo/xianhuo.vue

@@ -6,7 +6,8 @@
         <div class="search-list">
           <div class="self-ichunt">
             <div class="search-sift">
-              <div class="title-cut" v-show="zyRank">
+              <!-- <div class="title-cut" v-show="zyRank"> -->
+              <div class="title-cut">
                 <p class="fr xuan" @click="openRight">
                   <span class="font">筛选</span>
                   <i class="icon iconfont icon-shaixuan"></i>
@@ -35,7 +36,8 @@
                   </li>
                 </ul>
               </div>
-              <div class="sift-box" v-show="zyFilter||zyClass">
+              <!-- <div class="sift-box" v-show="zyFilter||zyClass"> -->
+              <div class="sift-box">
                 <dl :class="{'p_act': zyFilterInit == 0}">
                   <dt
                     @click="changeZyFilterInit(0)"
@@ -139,6 +141,18 @@
           </div>
         </div>
       </div>
+      <div class="content_scroll">
+        <van-list
+          v-model="loading"
+          :finished="finished"
+          finished-text="我是有底线的噢"
+          @load="onLoad"
+          error-text="请求失败，点击重新加载"
+          :immediate-check="true"
+        >
+          <GoodsOne :dataList="zyData"></GoodsOne>
+        </van-list>
+      </div>
     </div>
     <rightSelect
       v-show="isShowRight"
@@ -156,15 +170,18 @@
 </template>
 <script>
 import Header from "@/views/common/Header.vue";
-import { Icon, Field } from "vant";
+import { Icon, Field, List, Cell } from "vant";
 import { mapState } from "vuex";
 import rightSelect from "./rightSelect";
+import GoodsOne from "@/views/common/GoodsOne.vue";
 export default {
   name: "xianhuo",
   components: {
     Header,
     "van-icon": Icon,
-    rightSelect
+    rightSelect,
+    "van-list": List,
+    GoodsOne
   },
   data() {
     return {
@@ -184,12 +201,14 @@ export default {
       firstClassName: "", //第一级数据的name，
       secondClassName: "", //第二级数据的name
       isResetData: false, //是否重置数据
-      isShowRight: false //是否展示右侧
+      isShowRight: false, //是否展示右侧
+      list: [],
+      loading: false,
+      finished: false,
+      p: 1
     };
   },
-  created() {
-    this.getZyData();
-  },
+  created() {},
   computed: {
     ...mapState({
       zyFilter: state => state.xianhuo.zyFilter,
@@ -197,7 +216,9 @@ export default {
       zyRank: state => state.xianhuo.zyRank,
       classData: state => state.xianhuo.classData,
       classLight: state => state.xianhuo.classLight,
-      zyFilterData: state => state.xianhuo.zyFilterData
+      zyFilterData: state => state.xianhuo.zyFilterData,
+      zyData: state => state.xianhuo.zyData,
+      total: state => state.xianhuo.total
     })
   },
   watch: {
@@ -222,6 +243,9 @@ export default {
     }
   },
   methods: {
+    onLoad() {
+      this.getZyData();
+    },
     toSearch() {},
     resetRight() {
       this.getZyData();
@@ -463,10 +487,16 @@ export default {
 }
 .xianhuo {
   font-family: "Helvetica Neue", Helvetica, sans-serif;
+  position: absolute;
+  top: 44px;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  overflow: hidden;
+  * {
+    box-sizing: border-box;
+  }
   .search-cont {
-    * {
-      box-sizing: border-box;
-    }
     .search-sift {
       width: 100%;
       position: relative;
@@ -679,6 +709,21 @@ export default {
       }
     }
   }
+  .content_scroll {
+    position: absolute;
+    top: 80px;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    overflow: hidden;
+    overflow-y: auto;
+    background-color: #efeff4;
+    .oneDataGoods {
+      background-color: #fff;
+      padding-left: 15px;
+      margin-left: 0;
+    }
+  }
 }
 </style>