gift.js 8.66 KB
import cartModel from '../../../models/cart/cart';
import giftModel from '../../../models/cart/gift';
import formatImage from '../../../utils/formatImage';

// 获取应用实例
let app = getApp();
let Picker = require('../../goodsDetail/picker/picker.js');

const screenWidth = app.globalData.systemInfo.screenWidth;

Page({
  /**
   * 页面的初始数据
   */
  data: {
    isGift: false,
    screen_width: screenWidth,
    current_section_title: '.',
    promotion_data_ary: [],
    current_skn: '',
    selectedSKU: '',

    // picker 需要的数据
    pickerData: {
      view: {
        isShow: false,
        isSoldOutSoon: false, // 是否显示即将售罄
        goodsList: [],
        sizeList: [],
        image: '',
        goodPrice: '',
        price: '',
        buyNumber: 1,
        minusButtonEnable: false,
        plusButtonEnable: false,
        buyButtonEnable: true,
      },
      sourceType: 'goodsDetail',
    },
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function(options) {
    this._isGift = +options.is_gift > 0;
    this._status = +(options.status || 0);
    this.queryGiftPageData(options.promotion_id);
    this._isGift && this.setData({isGift: true});

    Picker.init(this);
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function() {
    wx.setNavigationBarTitle({
      title: this._isGift ? '领取赠品' : '换购商品'
    });
  },
  showToast(title) {
    wx.showToast({
      title: title,
      icon: 'none',
      duration: 1000
    });
  },
  onPressProduct: function(event) {
    let cdata = event.currentTarget.dataset;
    let product_skn = cdata.productSkn;

    this.setData({ current_skn: product_skn });
    Picker.promotion_id = cdata.item.promotion_id;

    let that = this;

    giftModel.productGift({
      product_skn,
      promotion_id: cdata.item.promotion_id
    }).then(data => {
      if (!data || data.code !== 200) {
        return;
      }

      let colorSelected = false;
      let color_length = 0;

      if (data.data.goods_list) {
        color_length = data.data.goods_list.length;
      }
      let ImgUrls = [];

      data.data.goods_list.map((item, index) => {
        let images = formatImage.image(item.color_image, 75, 100);

        ImgUrls = [...ImgUrls, images];
        if (index === 0 && color_length === 1) {
          item.selected = true;
          colorSelected = true;
        }
      });

      let isSoldOutSoon = false;
      let tags = data.data.tags;

      if (tags) {
        tags.map((item) => {
          if (item === 'is_soon_sold_out') {
            isSoldOutSoon = true;
          }
        });
      }

      // pickerData
      let temData = that.data.pickerData;

      temData.view.goodsList = data.data.goods_list;
      temData.view.isSoldOutSoon = isSoldOutSoon;

      // 默认显示第一种颜色的尺码
      temData.view.sizeList = data.data.goods_list.length > 0 ? data.data.goods_list[0].size_list : [];

      // 根据库存设置该尺码是否可以选择
      let size_length = 0;

      if (temData.view.sizeList) {
        size_length = temData.view.sizeList.length;
      }
      temData.view.sizeList && temData.view.sizeList.map((item, index) => {
        item.enable = item.storage_number > 0 ? true : false;

        if (index === 0 && size_length === 1 && colorSelected) {
          // 当颜色被选中 并且只有一个size 时 才会自动 做选中尺码操作
          temData.view.buyButtonEnable = item.enable;
          if (item.enable) {
            item.selected = true;
            that.setData({
              selectedSKU: item.product_sku,
            });
          }
        }
      });

      temData.view.image = ImgUrls.length > 0 ? ImgUrls[0] : '';
      temData.view.price = data.data.format_market_price;
      temData.view.goodPrice = data.data.format_sales_price;

      that.setData({
        pickerData: temData,
      });

      Picker.pickerShow(that);
    }).catch(console.log);
  },

  // 点击选择颜色
  colorTap: function(event) {
    // 更新各个颜色的选中状态
    let that = this;
    let tempData = that.data.pickerData;

    // 先遍历将所有颜色、尺码置为未选中状态
    tempData.view.goodsList && tempData.view.goodsList.map(item => {
      item.selected = false;
      item.size_list.map(subItem => {
        subItem.selected = false;
        subItem.enable = subItem.storage_number > 0 ? true : false;
      });
    });

    // 将当前颜色置为选中状态
    let tempItem = event.target.dataset.key;

    // 遍历颜色尺码,根据库存切换显示状态
    tempItem && tempItem.size_list && tempItem.size_list.map(item => {
      item.enable = item.storage_number > 0 ? true : false;
    });

    tempItem.selected = true;

    // 重置库存、当前选中sku的值
    tempData.storageNumber = 0;
    tempData.selectedSKU = 0;

    tempData.view.goodsList[Number(event.target.id)] = tempItem;
    tempData.view.sizeList = tempItem.size_list;

    // 将购买数量设为初始状态
    tempData.view.buyNumber = 1;

    this.setData({
      pickerData: tempData,
    });
  },

  // 点击选择尺码
  sizeTap: function(event) {
    let that = this;
    let tempData = that.data.pickerData;

    // 现遍历将所有尺码置为未选中状态
    tempData.view.sizeList && tempData.view.sizeList.map(item => {
      item.selected = false;
    });

    // 将当前尺码置为选中状态
    let tempItem = event.currentTarget.dataset.key;

    tempItem.selected = true;
    tempData.view.sizeList[parseInt(event.currentTarget.id)] = tempItem;

    // 设置数量加减按钮启用状态
    tempData.view.buyButtonEnable = true;

    // 将购买数量设为初始状态
    tempData.view.buyNumber = 1;

    // console.log(event)
    if (tempItem.storage_number <= 0) {
      this.showToast('该尺码已经售罄');
      tempData.view.buyButtonEnable = false;
    }
    this.setData({
      pickerData: tempData,
      selectedSKU: tempItem.storage_number > 0 ? tempItem.product_sku : 0,
      storageNumber: tempItem.storage_number,
    });
  },

  // 增加购买数量
  bindPlus: function() {

  },

  // 减少购买数量
  bindMinus: function() {

  },

  pickerTap: function(event) {
    if (event.target.id === 'picker-bg') {
      let that = this;

      Picker.pickerHide(event, that);
      this.resetPickerData();
    }
  },

  resetPickerData: function() {
    let pickerData = this.data.pickerData;

    pickerData.view.buyNumber = 1;
    this.setData({
      pickerData,
      selectedSKU: 0,
      storageNumber: 0,
      curProcessGoodsItem: {},
    });
  },

  // 添加加价购商品到购物车
  confirmChoose: function() {
    let select_sku = this.data.selectedSKU;
    let select_skn = this.data.current_skn;
    let goods_type = this._isGift ? 1 : 2;
    let promotion_id = Picker.promotion_id;

    if (!select_sku) {
      return this.showToast('请选择颜色或尺码');
    }

    Picker.pickerHide(this);
    this.resetPickerData();

    let status = this._status;

    if (status === 10) {
      cartModel.addToShoppingCart({
        product_sku: select_sku,
        promotion_id: promotion_id,
        buy_number: 1,
        selected: 'Y',
        goods_type: goods_type,
        edit_product_sku: 0,
      }).then(json => {
        if (json && json.code) {
          wx.navigateBack({});
        }
      });
    } else if (status === 30) {
      giftModel.editCartGiftGoods({
        new_product_skn: select_skn,
        new_product_sku: select_sku,
        promotion_id: promotion_id,
        goods_type: goods_type,
        buy_number: 1,
      }).then(json => {
        if (json && json.code) {
          wx.navigateBack({});
        }
      });
    } else {
      wx.navigateBack({});
    }
  },

  /**
   * 查询购物车数据,包括普通购物车和预售购物车
   */
  queryGiftPageData: function(promotionIds) {
    giftModel.getPromotionGifts({
      promotion_ids: promotionIds
    }).then(json => {
      if (json && json.code && json.code === 200) {
        let data = json.data;
        let promotion_data_ary = data.arrays;

        if (promotion_data_ary.length) {

          promotion_data_ary.map(item => {
            item.goods_list.map(obj => {
              let default_images = formatImage.image(obj.goods_images, 75, 100);
              let default_last_price = obj.last_price ? obj.last_price : 0;

              obj.last_price = '¥' + default_last_price.toFixed(2);
              obj.goods_images = default_images;
            });
          });

          let title = promotion_data_ary[0].promotion_title;

          this.setData({ current_section_title: title });
        }
        this.setData({ promotion_data_ary });

        // console.log(this.data);
      }
    });
  }
});