alphabetBrandList.js 7.25 KB
// pages/goodsList/alphabetBrandList.js

let app = getApp();
const screenHeight = app.globalData.systemInfo.screenHeight;
const windowWidth = app.globalData.systemInfo.windowWidth;
const windowHeight = app.globalData.systemInfo.windowHeight;
const scale = windowWidth / 375;

Page({
  data: {
    windowWidth,
    windowHeight,
    screenHeight,
    scale,
    alphabetList: [],
    alpha: '',
    windowHeight: '',
    filterData: {},
    filterList: [],
    filterIndex: 0,
    storageKey: '',
    currentFilter: {},
    multiSelect: false,
    selectItemsIds: '',
    selectItemsName: '',
    selectedItems: [],
    allSelect: false,
  },

  onLoad: function (options) {
    let key = options.storageKey;
    let start = options.index;
    let that = this;
    wx.getStorage({
      key: key,
      success: function (res) {
        if (res.data.length > 0) {
          let filterData = res.data;
          let currentFilter = filterData.slice(start, parseInt(start) + 1)[0];
          let filterList = currentFilter.allItemList;
          if (!filterList) {
            return;
          }
          that.setData({
            filterData: filterData,
            filterIndex: start,
            storageKey: key,
            currentFilter: currentFilter,
            filterList: filterList,
            multiSelect: currentFilter.multiSelect,
            selectItemsIds: currentFilter.selectItemsIds ? currentFilter.selectItemsIds : '',
            selectItemsName: currentFilter.selectItemsName ? currentFilter.selectItemsName : '',
            selectedItems: currentFilter.selectedItems ? currentFilter.selectedItems : [],
          });
          that.parseData();
        }
      },
    })
  },

  handlerAlphaTap(e) {
    // console.log(e);
    let { ap } = e.target.dataset;
    this.setData({ alpha: ap });
    // console.log( e.target);
  },

  // 选择品牌
  selectBrand: function (event) {
    let cell = event.currentTarget.dataset.item;
    if (this.data.multiSelect) {
      this.multiSelectBrand(cell);
      return;
    }
    let selectedItems = this.data.selectedItems;
    let alphabetList = this.data.alphabetList;
    selectedItems = [];
    if (!cell.isSelected) {
      cell.isSelected = true;
      selectedItems.push(cell);
    }
    alphabetList.map((items) => {
      items.brandInfo.map((item) => {
        if (cell.itemId == item.itemId) {
          item.isSelected = !item.isSelected
        } else {
          item.isSelected = false;
        }
      });
    });
    this.setData({
      alphabetList,
      selectedItems,
      allSelect: selectedItems.length == 0
    });
    this.submitBrand();
  },

  //多选
  multiSelectBrand: function (currentItem) {
    let selectedItems = this.data.selectedItems;
    let cell = currentItem;
    let alphabetList = this.data.alphabetList;
    for (let i = 0; i < alphabetList.length; i++) {
      let items = alphabetList[i];
      if (cell.alif == items.initial) {
        for (let j = 0; j < items.brandInfo.length; j++) {
          let item = items.brandInfo[j];
          if (cell.itemId == item.itemId) {
            item.isSelected = !item.isSelected;
            if (item.isSelected) {
              cell.isSelected = true;
              selectedItems.push(cell); //添加
            } else {
              for (let k = 0; k < selectedItems.length; k++) {
                let current = selectedItems[k];
                if (cell.itemId == current.itemId) {
                  selectedItems.splice(k, 1); //删除
                  break
                }
              }
            }
            break;
          }
        }
        break;
      };
    }
    this.setData({
      alphabetList,
      selectedItems,
      allSelect: selectedItems.length == 0
    });
  },

  // 移除选中的品牌
  deleteBrand: function (event) {
    let index = event.currentTarget.dataset.index;
    if (index == -1) {
      return;
    }
    // 1. 从当前选中的数组中移除
    let selectedItems = this.data.selectedItems;
    selectedItems.splice(index, 1);

    // 2. 更换数组的选中状态
    let cell = event.currentTarget.dataset.item;
    let alphabetList = this.data.alphabetList;
    for (let i = 0; i < alphabetList.length; i++) {
      let items = alphabetList[i];
      if (cell.alif == items.initial) {
        for (let j = 0; j < items.brandInfo.length; j++) {
          let item = items.brandInfo[j];
          if (cell.itemId == item.itemId) {
            item.isSelected = false;
            break;
          }
        }
        break;
      };
    }

    this.setData({
      alphabetList: alphabetList,
      selectedItems: selectedItems,
      allSelect: selectedItems.length == 0
    });
  },

  // 清空选中的品牌
  clearBrand: function (event) {
    let alphabetList = this.data.alphabetList;
    alphabetList.map((items) => {
      items.brandInfo.map((item) => {
        item.isSelected = false;
      });
    });
    this.setData({
      alphabetList,
      selectedItems: [],
      allSelect: true
    });
  },

  //返回上一页
  submitBrand: function () {
    var selectItemsName = '';
    var selectItemsIds = '';
    let selectedItems = this.data.selectedItems;
    selectedItems && selectedItems.map((item, index) => {
      selectItemsName = selectItemsName + item.itemName + ',';
      selectItemsIds = selectItemsIds + item.itemId + ',';
    });
    selectItemsName = selectItemsName.slice(0, selectItemsName.length - 1);
    selectItemsIds = selectItemsIds.slice(0, selectItemsIds.length - 1);
    let currentFilter = this.data.currentFilter;
    currentFilter.selectItemsName = selectItemsName;
    currentFilter.selectItemsIds = selectItemsIds;
    currentFilter.selectedItems = selectedItems;

    var filterData = this.data.filterData;
    filterData.splice(this.data.filterIndex, 1, currentFilter);

    this.setData({
      filterData,
      selectItemsIds: selectItemsIds,
      selectItemsName: selectItemsName,
    })

    wx.setStorage({
      key: this.data.storageKey,
      data: filterData
    })

    wx.navigateBack({
      delta: 1
    })
  },

  //解析数据
  parseData: function () {
    //检索的首字母
    let letter = []; //存储检索字母
    let alif = /^[a-zA-Z].*/g; //匹配规则
    let allItemList = this.data.filterList;
    allItemList.map((item) => {
      item.isSelected = false;
      if (item.alif.match(alif)) {
        if (letter.indexOf(item.alif) < 0) {
          letter.push(item.alif);
        }
      } else {
        item.alif = 'Top';
        if (letter.indexOf('Top') < 0) {
          letter.push('Top');
        }
      }
    });

    let alphabetList = [];
    letter.map((initial) => {
      let brandInfo = [];
      let alphabet = {};
      alphabet.initial = initial;
      allItemList.map((item) => {
        if (initial == item.alif) {
          brandInfo.push(item);
        }
      })
      alphabet.brandInfo = brandInfo;
      alphabetList.push(alphabet);
    });
    let selectedItems = this.data.selectedItems;
    alphabetList.map((items) => {
      items.brandInfo.map((item) => {
        selectedItems && selectedItems.map((selectId) => {
          if (selectId.itemId == item.itemId) {
            item.isSelected = true;
          }
        });
      });
    });
    this.setData({
      alphabetList,
      selectedItems,
      windowHeight: windowHeight,
      allSelect: selectedItems.length == 0
    });
  }
})