const app = getApp();
const svc = require('../../services/exercise');

const DIM_MAP = {
  bodyPart: 'body-parts',
  equipment: 'equipment',
  target: 'targets',
  muscleGroup: 'muscle-groups',
  type: 'types'
};

function labelForDim(d) {
  return ({
    bodyPart: '按部位',
    equipment: '按器械',
    target: '按目标',
    muscleGroup: '按肌群',
    type: '按类型'
  })[d] || '分类';
}

Page({
  data: {
    statusBarHeight: 20,
    dimension: 'bodyPart',
    title: '分类',
    value: '',
    values: [],
    activeValue: '',
    exercises: [],
    loading: true,
    page: 1,
    pageSize: 20,
    total: 0
  },

  onLoad(query) {
    const dimension = query.dimension || 'bodyPart';
    const value = query.value || '';
    const title = query.title || labelForDim(dimension);
    this.setData({
      statusBarHeight: app.globalData.statusBarHeight || 20,
      dimension,
      value,
      title
    });
    this.loadValues();
  },

  loadValues() {
    this.setData({ loading: true });
    const key = DIM_MAP[this.data.dimension] || 'body-parts';
    svc.getCategories(key).then((items) => {
      this.setData({
        values: items || [],
        activeValue: this.data.value,
        loading: false
      });
      this.loadExercises();
    }).catch(() => {
      this.setData({ loading: false });
    });
  },

  loadExercises() {
    this.setData({ loading: true });
    const params = { page: this.data.page, pageSize: this.data.pageSize };
    params[this.data.dimension] = this.data.activeValue;
    svc.listExercises(params).then((res) => {
      this.setData({
        exercises: (res && res.items) || [],
        total: (res && res.total) || 0,
        loading: false
      });
    }).catch(() => {
      this.setData({ loading: false });
    });
  },

  onValue(e) {
    const value = e.detail.value;
    if (value === this.data.activeValue) return;
    this.setData({ activeValue: value, page: 1 }, () => this.loadExercises());
  },

  onExercise(e) {
    wx.navigateTo({ url: '/pages/detail/detail?id=' + encodeURIComponent(e.detail.id) });
  }
});