my_loan/htmldev/shiningWxMini/pages/businessGoodsManage/businessGoodsManage.js

const { getProductList, postProductDelete, postProductUp } = require('./api/index')

Page({

  /**
   * 页面的初始数据
   */
  data: {
    tabs: [
      {
        name: '全部',
        value: '0'
      },
      {
        name: '已上架',
        value: '1'
      },
      {
        name: '未上架',
        value: '2'
      },
      {
        name: '预售',
        value: '3'
      }
    ],
    active: '0',
    current: 0, // 轮播图默认选中
    pageSize: 20,
    originScrollViewData: [],
    booDeleteOrder: false,
    booLock: false,
    refresherThreshold: 60, // 自定义下拉刷新阈值
    itemData: {}, // 当前选中的商品
    booProductUp: false
  },
  // 下拉刷新加锁
  freshing: false,
  timer: null,

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    const { tabvalue = '' } = options
    if (tabvalue && this.data.tabs.findIndex(item => item.value === tabvalue) > -1) {
      this.setData({
        active: tabvalue,
        current: tabvalue * 1
      })
    }
    this.setOriginScrollViewData()
  },

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

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

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

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {
    clearTimeout(this.timer)
  },
  bindCallBack() {
    this.onRefresh({ detail: { dy: this.data.refresherThreshold } })
  },
  jumpOrderDetail(e) {
    const { item } = e.currentTarget.dataset

    wx.navigateTo({
      url: '/pages/businessGoodsEdit/businessGoodsEdit?product_id=' + item.id
    })
  },
  setOriginScrollViewData() {
    const temp = []
    for (let i = 0; i < this.data.tabs.length; i++) {
      temp.push({
        finished: false, // 所有数据是否加载完
        isRefresh: false, // 是否下拉刷新
        isFetchLock: false, // 接口调用加锁
        pageNum: 0,
        list: [],
        scrollY: 0,
        isFirst: true // 是否首次获取列表
      })
    }

    this.setData({
      originScrollViewData: temp
    }, () => {
      this.fetOrderList()
    })
  },
  changeTabs(e) {
    const value = e.currentTarget.dataset.value
    const index = this.data.tabs.findIndex(item => item.value === value)
    const temp = this.data.originScrollViewData[index]

    this.setData({
      active: value,
      current: index
    }, () => {
      if (temp.isFirst) {
        this.fetOrderList()
      }
    })
  },
  handleSwiper(e) {
    const { current, source } = e.detail
    const item = this.data.tabs[current]
    if (source) {
      this.setData({
        active: item.value
      }, () => {
        const temp = this.data.originScrollViewData[current]
        if (temp.isFirst) {
          this.fetOrderList()
        }
      })
    }
  },
  async fetOrderList() {
    const that = this
    const _tab = that.data.tabs.findIndex(item => item.value === that.data.active)
    const temp = that.data.originScrollViewData[_tab]

    if (Object.prototype.toString.call(temp) !== '[object Object]') {
      return
    }

    if (temp.finished) {
      return
    }

    if (temp.isFetchLock) {
      return
    }

    that.setData({
      ['originScrollViewData[' + _tab + '].isFetchLock']: true,
      ['originScrollViewData[' + _tab + '].pageNum']: temp.pageNum + 1
    })
    try {
      const { status, data, msg } = await getProductList({
        pageNum: that.data.originScrollViewData[_tab].pageNum,
        pageSize: that.data.pageSize,
        type: that.data.tabs[_tab].value
      })
      if (status) {
        const { list } = data
        if (Array.isArray(list)) {
          // product_status 商品状态(0未上架1已上架2审核中3审核未通过)
          // product_sale_at 预售(0非预售  时间戳代表预售时间)
          const tempList = list.map(item => {
            return {
              ...item,
              ...that.getStatusTextAndColor(item.product_status, item.product_check_status)
            }
          })
          const _list = temp.isRefresh ? [].concat(tempList) : that.data.originScrollViewData[_tab].list.concat(tempList)

          that.setData({
            ['originScrollViewData[' + _tab + '].list']: _list,
            ['originScrollViewData[' + _tab + '].finished']: list.length < 10,
            ['originScrollViewData[' + _tab + '].isRefresh']: false,
            ['originScrollViewData[' + _tab + '].isFetchLock']: false,
            ['originScrollViewData[' + _tab + '].isFirst']: false
          })
        }
      } else {
        wx.showToast({
          title: msg,
          icon: 'none'
        })
      }
    } catch (e) {}
    if (that.freshing) {
      that.freshing = false
    }
  },
  onRefresh(e) {
    const { dy } = e.detail
    if (dy < this.data.refresherThreshold || this.freshing) {
      return
    }
    const _tab = this.data.tabs.findIndex(item => item.value === this.data.active)
    this.freshing = true
    // 这里设置延时的目的：页面数据不足一屏时，更好的展示下拉刷新动画
    this.timer = setTimeout(() => {
      clearTimeout(this.timer)
      this.setData({
        ['originScrollViewData[' + _tab + '].pageNum']: 0,
        pageSize: 20,
        ['originScrollViewData[' + _tab + '].finished']: false,
        ['originScrollViewData[' + _tab + '].isRefresh']: true,
        ['originScrollViewData[' + _tab + '].isFetchLock']: false
      }, () => {
        this.fetOrderList()
      })
    }, 1000)
  },
  showDeleteOrder(e) {
    const { item } = e.currentTarget.dataset

    this.setData({
      booDeleteOrder: true,
      itemData: item
    })
  },
  hideDeleteOrder() {
    this.setData({
      booDeleteOrder: false,
      itemData: {}
    })
  },
  handleProductUp(e) {
    const { item } = e.currentTarget.dataset

    this.setData({
      booProductUp: true,
      itemData: item
    })
  },
  hideProductUp() {
    this.setData({
      booProductUp: false,
      itemData: {}
    })
  },
  async confirmProductUp() {
    const { id, product_status } = this.data.itemData

    this.setData({
      booLock: true
    })
    try {
      const { status, msg } = await postProductUp(id, product_status === 0 ? 1 : 0)
      let _msg = ''
      if (status) {
        _msg = '商品' + (product_status === 0 ? '上架' : '下架') + '成功'
        // 更新全部：去除各个列表中有相同id的
        const originScrollViewData = this.data.originScrollViewData
        for (let i = 0; i < originScrollViewData.length; i++) {
          const _list = originScrollViewData[i].list
          const _delIndex = _list.findIndex(item => item.id === id)
          if (_delIndex > -1) {
            _list.splice(_delIndex, 1, {
              ...this.data.itemData,
              product_status: product_status === 0 ? 1 : 0,
              ...this.getStatusTextAndColor(product_status === 0 ? 1 : 0, this.data.itemData.product_check_status)
            })
            this.setData({
              ['originScrollViewData[' + i + '].list']: _list
            })
          }
        }

        this.hideProductUp()
      } else {
        _msg = msg
      }
      wx.showToast({
        title: _msg,
        icon: 'none'
      })
    } catch (err) {}

    this.setData({
      booLock: false
    })
  },
  async confirmDeleteOrder() {
    const { id } = this.data.itemData

    this.setData({
      booLock: true
    })
    try {
      const { status, msg } = await postProductDelete(id)
      let _msg = ''
      if (status) {
        _msg = '商品删除成功'
        // 更新全部：去除各个列表中有相同id的
        const originScrollViewData = this.data.originScrollViewData
        for (let i = 0; i < originScrollViewData.length; i++) {
          const _list = originScrollViewData[i].list
          const _delIndex = _list.findIndex(item => item.id === id)
          if (_delIndex > -1) {
            _list.splice(_delIndex, 1)
            this.setData({
              ['originScrollViewData[' + i + '].list']: _list
            })
          }
        }

        this.hideDeleteOrder()
      } else {
        _msg = msg
      }
      wx.showToast({
        title: _msg,
        icon: 'none'
      })
    } catch (err) {}

    this.setData({
      booLock: false
    })
  },
  getStatusTextAndColor(productStatus, productCheckStatus) {
    // product_check_status 0未审核 1审核成功 2审核失败
    // product_status 0 未上架 1 上架

    let color = 'col-0'
    let text = ''

    if (productCheckStatus === 0) {
      color = 'col-1'
      text = '审核中'
    } else if (productCheckStatus === 2) {
      color = 'col-3'
      text = '审核未通过'
    } else if (productCheckStatus === 1 && productStatus === 1) {
      color = 'col-2'
      text = '已上架'
    } else if (productCheckStatus === 1 && productStatus === 0) {
      text = '未上架'
    }

    return {
      product_status_text: text,
      product_status_color: color
    }
  }
})