import wx from '../../../utils/wx';
import Yas from '../../../common/yas';
import searchModel from '../../../models/product/search';

const {windowHeight} = getApp().getSystemInfo();
const app = getApp();

let yas;

Page({
  data: {
    query: '',
    order: '',
    gender: '',
    searched: false,
    productList: [],
    isLoading: false,
    currentPage: 0,
    totalPage: 0,
    noResult: false,
    showLoading: false,
    showNoMore: false,
    showBackTop: false,
    recentKeys: [],
    windowHeight: windowHeight
  },
  onReachBottom: function() {
    if (this.data.currentPage < this.data.totalPage) {
      this.setData({
        showLoading: true
      });
      this.productList({
        query: this.data.query,
        page: this.data.currentPage + 1
      });
    } else {
      this.setData({
        showNoMore: true
      });
    }
  },
  onLoad: function(options) {
    this._baseParams = {
      shop_id: app.getShopId(),
      limit: 20
    };

    this._isSaerch = true; // 标识是否为普通搜索页
    this._searchFn = searchModel.productList;

    yas = new Yas();
    yas.pageOpenReport();

    if (options.title) {
      wx.setNavigationBarTitle({
        title: decodeURIComponent(options.title)
      });
    }

    if (options.promotionId) {
      let title = decodeURIComponent(options.promotionTitle || '');

      title = title ? `【${title}】` : '';
      this.setData({
        placeholder: '搜索该促销活动适用的商品',
        activityTitle: `以下商品参加${title}促销活动`
      });
      this._isSaerch = false;
      this._searchFn = searchModel.promotionProductList;
      this._baseParams.promotion_id = options.promotionId;
      this.productList();
    }

    this.setData({isSearch: this._isSaerch});
  },
  onShow: function() {
    this.getRecentKeys();
  },
  onPageScroll: function({scrollTop}) {
    if (scrollTop > windowHeight * 2 !== this.data.showBackTop) {
      this.setData({
        showBackTop: scrollTop > windowHeight * 2
      });
    }
  },
  backTop: function() {
    wx.pageScrollTo({
      scrollTop: 0
    });
  },
  bindQueryInput: function(e) {
    this.setData({
      query: e.detail.value
    });
  },
  clearQuery: function() {
    this.setData({
      query: ''
    });
  },
  confirmQuery: function(e) {
    let query = e.detail.value.trim();

    if (!query) {
      return wx.showToast({
        title: '请输入检索关键词',
        icon: 'none',
        duration: 1000
      });
    }

    this.setData({query});
    this.data.productList = [];
    this.setRecentKeys(query);
    this.productList({query});
  },
  productList: function(params) {
    if (this.data.isLoading) {
      return;
    }

    params = params || {};
    params.page = params.page || 1;

    this.data.isLoading = true;
    wx.showLoading({title: '加载中'});

    this._searchFn(Object.assign(params, {
      order: this.data.order,
      gender: this.data.gender,
    }, this._baseParams)).then(res => {
      if (res.code === 200) {
        const keyAdapter = {
          skn: 'product_skn',
          salesPrice: 'sales_price',
          marketPrice: 'market_price',
          productName: 'product_name',
          defaultImages: 'default_images'
        };
        let list = [];

        (res.data.product_list || []).forEach(product => {
          let item = {};

          Object.keys(keyAdapter).forEach(key => {
            item[key] = product[keyAdapter[key]];
          });
          list.push(item);
        });

        this.data.isLoading = false;

        list = this.data.productList.concat(list);
        this.setData({
          searched: true,
          showLoading: false,
          productList: list,
          currentPage: params.page,
          totalPage: res.data.page_total,
          noResult: list.length === 0
        });

        if (params.resetScroll) {
          wx.pageScrollTo({
            scrollTop: 0,
            duration: 10
          });
        }
        wx.hideLoading();
      }
    }).catch(() => {
      this.data.isLoading = false;
      wx.hideLoading();
    });
  },
  sortChange: function(e) {
    let params;
    let {curSort, gender} = e.detail;

    this.data.gender = gender;
    this.data.order = curSort;

    params = {
      gender,
      order: curSort,
      page: 1,
      limit: 20,
      query: this.data.query
    };
    this.data.productList = [];
    params.resetScroll = true;
    this.productList(params);
  },

  searchRecent: function(e) {
    const key = e.target.dataset.key;

    this.confirmQuery({
      detail: {
        value: key
      }
    });
  },

  deleteRecent: function() {
    wx.setStorage({
      key: 'search_hot_keys',
      data: []
    });
    this.setData({
      recentKeys: []
    });
  },

  setRecentKeys: function(key) {
    if (!this._isSaerch) {
      return;
    }

    let distinctArr = this.data.recentKeys.filter(item => {
      return item !== key;
    });

    distinctArr.unshift(key);
    wx.setStorage({
      key: 'search_hot_keys',
      data: distinctArr
    });
  },

  getRecentKeys: function() {
    if (!this._isSaerch) {
      return;
    }

    wx.getStorage({
      key: 'search_hot_keys'
    }).then(res => {
      this.setData({
        recentKeys: res.data || []
      });
    });
  }
});