epp/weixin-miniprogram/pages/shop/shop.js

// pages/shop/shop.js

const toggleCustomTabBar = require('../../custom-tab-bar/toggleCustomTabBar')

const goodService = require("../../services/good")

Page({

  /**
   * 页面的初始数据
   */
  data: {
    // 筛选条件
    sidebarActiveId: -1,
    searchText: '',

    // 数据
    sidebarList: [
      {
        id: -1,
        categoryName: "全部分类",
      },
      // {
      //   id: 1,
      //   title: "1",
      // },
      // {
      //   id: 2,
      //   title: "防疫物资",
      // },
      // {
      //   id: 3,
      //   title: "111",
      // },
      // {
      //   id: 4,
      //   title: "111",
      // },
      // {
      //   id: 5,
      //   title: "111",
      // },
    ],

    tabbarList: [
      // {
      //   id: 1,
      //   goodsName: "温度计",
      //   counterPrice: "10.00",
      //   retailPrice: "12.00",
      //   picUrl: "https://cdn-we-retail.ym.tencent.com/tsr/goods/gh-2b.png?imageMogr2/thumbnail/320x320/quality/70/strip/format/webp",
      // },
      // {
      //   id: 2,
      //   goodsName: "医用口罩",
      //   counterPrice: "100.00",
      //   retailPrice: "12.50",
      //   picUrl: "https://cdn-we-retail.ym.tencent.com/tsr/goods/muy-3a.png?imageMogr2/thumbnail/320x320/quality/70/strip/format/webp",
      // }
    ]
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    toggleCustomTabBar.toggle(this)
    this.loadPageData();
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {
    toggleCustomTabBar.toggle(this)
  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {
    console.log('sidebarActiveId', this.data.sidebarActiveId)
    this.updatePageData()
  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  },


  bindSearchInput(e) {
    this.setData({
      searchText: e.detail.value,
    })
    this.updatePageData()
  },
  clearSearchInput() {
    this.setData({
      searchText: '',
      sidebarActiveId: -1,
    })
    this.updatePageData()
  },

  sidebarItemTap(event) {
    console.log("sidebarActiveId", this.data.sidebarActiveId)
    // 清除原来的选中项，并设置新的选中项
    // console.log("event.target", event.target)
    // console.log("event.currentTarget", event.currentTarget)
    let dataset = event.currentTarget.dataset
    console.log("dataset", dataset)
    if (this.data.sidebarActiveId === dataset.item.id) {
      console.log("点的分类已选中，跳过")
      return // 点的分类就是当前激活的分类，直接跳过
    }
    this.setData({
      sidebarActiveId: dataset.item.id,
    })
    this.updatePageData()
    return
  },

  loadPageData() {
    (async () => {
      let goodCategoryListPromise = goodService.getGoodCategoryList()
      let goodListPromise = goodService.getGoodList(this.data.sidebarActiveId, this.data.searchText)
      Promise.all([
        goodCategoryListPromise,
        goodListPromise,
      ]).then(data => {
        let goodCategoryList = data[0]
        let goodList = data[1]
        console.log("goodCategoryList", goodCategoryList)
        console.log("goodList", goodList)
        goodCategoryList.unshift({
          id: -1,
          categoryName: "全部分类",
          order: 0
        })
        console.log("goodCategoryList", goodCategoryList)
        this.setData({
          sidebarList: goodCategoryList,
          tabbarList: goodList,
        })
      })
    })();
  },

  updatePageData() {
    this.setData({
      tabbarList: [],
    });
    (async () => {
      let goodListPromise = goodService.getGoodList(this.data.sidebarActiveId, this.data.searchText)
      Promise.all([
        goodListPromise,
      ]).then(data => {
        let goodList = data[0]
        console.log("goodList", goodList)
        this.setData({
          tabbarList: goodList,
        })
        // wx.nextTick(() => {
        // })
      })
    })();


    (async () => {
      let goodCategoryListPromise = goodService.getGoodCategoryList()
      Promise.all([
        goodCategoryListPromise,
      ]).then(data => {
        let goodCategoryList = data[0]
        console.log("goodCategoryList", goodCategoryList)
        goodCategoryList.unshift({
          id: -1,
          categoryName: "全部分类",
          order: 0
        })
        console.log("goodCategoryList", goodCategoryList)
        this.setData({
          sidebarList: goodCategoryList,
        })
        // wx.nextTick(() => {
        // })
      })
    })();
  }
})