绿满眶商城微信小程序-uniapp
peng
15 小时以前 7318243a22f764392040c3bf0942691237a93604
pages/commodity-square/commoditySquare.vue
@@ -1,6 +1,9 @@
<template>
   <view class="container">
      <input type="text" v-show="false" v-model="flushDom" />
      <view class="search">
         <u-search class="nav-search" @blur='searchGoods' placeholder="搜索商品" :show-action="false"></u-search>
      </view>
      <view class="commoditySquare">
         <view class="left" style="width: 310rpx;">
            <view class="commoditySquareItem" v-for="(item,index) in goodsList1"
@@ -45,14 +48,14 @@
         <view class="openShowLeft" @click="showDrawer('showLeft')" v-if="!showLeft">
            <uni-icons type="right" size="30"></uni-icons>
         </view>
         <uni-drawer ref="showLeft" mode="left" width="120" @change="change($event,'showLeft')"
            class="navigationLeft">
            <view class="typeNavigation">
         <uni-drawer ref="showLeft" mode="left" width="120" height="94vh" @change="change($event,'showLeft')"
            :cus-style="true" class="navigationLeft">
            <scroll-view class="typeNavigation" :scroll-y="true" show-scrollbar="false">
               <view class="typeNavigationItem" :class="{typeNavigationItemCheck:currentCategort ==item.id}"
                  @click="chooseCategory(item.id)" v-for="item in categoryList" :key="item.id">
                  {{item.name}}
               </view>
            </view>
            </scroll-view>
         </uni-drawer>
      </view>
      <view style="display: flex;align-items: center;justify-content: center;margin-top: 20rpx;" v-if="canLoadMore">
@@ -97,6 +100,14 @@
         }
      },
      methods: {
         async searchGoods(keyWard) {
            this.getGoodsParam.keyword = keyWard
            this.getGoodsParam.pageNumber = 1
            this.getGoodsParam.categoryId = ''
            this.goodsList1 = []
            this.goodsList2 = []
            await this.getgoodsData();
         },
         confirm() {},
         // 打开窗口
         showDrawer(e) {
@@ -132,67 +143,7 @@
            let list = await getCategoryList(0);
            this.categoryList = list.data.result
         },
         async chooseCategory(id) {
            if (this.currentCategort === id) return
            this.canLoadMore = false;
            this.currentCategort = id
            this.getGoodsParam.categoryId = id
            this.getGoodsParam.keyword = ''
            this.getGoodsParam.pageNumber = 1
            const goodsList = await getGoodsList(this.getGoodsParam);
            const sts = await getSTSToken();
            const stsUrl = sts.data.data.endpoint
            // 处理数据
            goodsList.data.result.records.forEach(item => {
               if (item.thumbnail !== '' && item.thumbnail !== null && item.thumbnail.indexOf('http') ===
                  -1) {
                  item.thumbnail = stsUrl + '/' + item.thumbnail
               }
               if (item.goodsVideo !== '' && item.goodsVideo !== null && item.goodsVideo.indexOf(
                     'http') === -1) {
                  item.goodsVideo = stsUrl + '/' + item.goodsVideo
               }
            })
            //平分给两个数组
            const middle = Math.ceil(goodsList.data.result.records.length / 2);
            this.goodsList1 = goodsList.data.result.records.slice(0, middle);
            this.goodsList2 = goodsList.data.result.records.slice(middle);
            this.maxPages = goodsList.data.result.pages
            console.log(this.maxPages)
         }
      },
      onShow() {
         this.showDrawer('showLeft')
      },
      async onLoad() {
         await this.loadCategoryList();
         this.getGoodsParam.pageNumber = 1
         this.getGoodsParam.categoryId = ""
         this.getGoodsParam.keyword = ""
         const goodsList = await getGoodsList(this.getGoodsParam);
         const sts = await getSTSToken();
         const stsUrl = sts.data.data.endpoint
         // 处理数据
         goodsList.data.result.records.forEach(item => {
            if (item.thumbnail !== '' && item.thumbnail !== null && item.thumbnail.indexOf('http') ===
               -1) {
               item.thumbnail = stsUrl + '/' + item.thumbnail
            }
            if (item.goodsVideo !== '' && item.goodsVideo !== null && item.goodsVideo.indexOf(
                  'http') === -1) {
               item.goodsVideo = stsUrl + '/' + item.goodsVideo
            }
         })
         //平分给两个数组
         const middle = Math.ceil(goodsList.data.result.records.length / 2);
         this.goodsList1 = goodsList.data.result.records.slice(0, middle);
         this.goodsList2 = goodsList.data.result.records.slice(middle);
         this.maxPages = goodsList.data.result.pages
         console.log(this.maxPages)
      },
      async onReachBottom() {
         if (this.getGoodsParam.pageNumber < this.maxPages) {
            this.getGoodsParam.pageNumber++;
         async getgoodsData() {
            const goodsList = await getGoodsList(this.getGoodsParam);
            const sts = await getSTSToken();
            const stsUrl = sts.data.data.endpoint
@@ -212,6 +163,33 @@
            this.goodsList1 = [...this.goodsList1, ...goodsList.data.result.records.slice(0, middle)];
            this.goodsList2 = [...this.goodsList2, ...goodsList.data.result.records.slice(middle)];
            this.maxPages = goodsList.data.result.pages
         },
         async chooseCategory(id) {
            this.canLoadMore = false;
            this.currentCategort = id
            this.getGoodsParam.categoryId = id
            this.getGoodsParam.keyword = ''
            this.getGoodsParam.pageNumber = 1
            this.goodsList1 = [];
            this.goodsList2 = [];
            await this.getgoodsData();
            console.log(this.maxPages)
         }
      },
      onShow() {
         this.showDrawer('showLeft')
      },
      async onLoad() {
         await this.loadCategoryList();
         this.getGoodsParam.pageNumber = 1
         this.getGoodsParam.categoryId = ""
         this.getGoodsParam.keyword = ""
         await this.getgoodsData()
      },
      async onReachBottom() {
         if (this.getGoodsParam.pageNumber < this.maxPages) {
            this.getGoodsParam.pageNumber++;
            await this.getgoodsData()
         } else {
            this.canLoadMore = true;
         }
@@ -265,8 +243,16 @@
   .openShowLeft {
      position: fixed;
      top: 30rpx;
      top: 120rpx;
      left: 0;
      align-items: center;
      justify-content: flex-start;
      background-color: #b6b6b6;
      opacity: 0.8;
      z-index: 999;
      height: 70rpx;
      width: 50rpx;
      border-radius: 0 50% 50% 0;
   }
   .navigationLeft {
@@ -303,8 +289,10 @@
   .typeNavigation {
      box-sizing: border-box;
      padding: 10rpx;
      position: relative;
      height: 100%;
      // position: relative;
   }
   .typeNavigationItem {
@@ -327,4 +315,13 @@
      top: 20rpx;
      right: 0;
   }
   .nav-search {
      padding-left: 30rpx !important;
      padding-right: 20rpx !important;
      // position: fixed;
      // top: 0;
      // width: 500rpx;
      // z-index: 9999;
   }
</style>