import * as Types from './types';
import {getArticleImageSize} from 'utils/image-handler';
import { get, has } from 'lodash';
import Vue from 'vue';

function articlefield(type, thumb) {
  if (type === 'article') {
    return `article${thumb ? 'Thumb' : ''}List`;
  } else if (type === 'topic') {
    return `article${thumb ? 'Thumb' : ''}ListByTopic`;
  } else if (type === 'userArticle') {
    return `articleUser${thumb ? 'Thumb' : ''}List`;
  }
  return '';
}

function updateAuthorStates(state, item) {
  if (has(item, 'hasAttention')) {
    Vue.set(state.authorStates, `${item.authorUid}-${item.authorType}`, {
      hasAttention: item.hasAttention
    });
  }
}

function updateArticleState(state, item) {
  let articleState = state.articleStates[item.articleId] || {};

  Vue.set(state.articleStates, item.articleId, {
    hasAttention: item.hasAttention || articleState.hasAttention,
    hasFavor: item.hasFavor || articleState.hasFavor,
    hasPraise: item.hasPraise || articleState.hasPraise,
    commentCount: item.commentCount || articleState.commentCount || 0,
    favoriteCount: item.favoriteCount || articleState.favoriteCount || 0,
    praiseCount: item.praiseCount || articleState.praiseCount || 0,
    comments: item.comments || articleState.comments
  });
  updateAuthorStates(state, item);
}

function setArticleList(state, data, type, thumb) {
  data.forEach((item, index) => {
    get(item, 'productList', []).forEach(product => {
      product.favorite = false;
    });
    item.blockIndex = 1;
    item.lazy = index >= 1;
    item.isExpand = false;
    item.introHeight = 0;
    item.introCollapseHeight = 0;

    const thumbs = state[articlefield(type, true)];

    if (thumbs) {
      const find = thumbs.find(thumbItem => thumbItem.articleId === item.articleId);

      if (find) {
        item.introHeight = find.introHeight;
        item.introCollapseHeight = find.introCollapseHeight;
      }
    }
    if (!thumb) {
      updateArticleState(state, item);
    } else {
      item.comments = [];
      item.hasAttention = '';
      item.hasFavor = '';
      item.hasPraise = '';
      item.commentCount = 0;
      item.favoriteCount = 0;
      item.praiseCount = 0;
    }
    const imageBlocks = get(item, 'blockList', []).filter(block => block.templateKey === 'image');

    imageBlocks.forEach((img, inx) => {
      let {width, height} = getArticleImageSize({
        width: img.width,
        height: img.height,
        minScale: inx === 0 ? (3 / 4) : 0
      });

      img.width = parseInt(width, 10);
      img.height = parseInt(height, 10);
    });
  });

  if (articlefield(type, thumb)) {
    state[articlefield(type, thumb)] = state[articlefield(type, thumb)].concat(data);
  }
}

export default {
  [Types.FETCH_ARTICLE_LIST_REQUEST](state, {refresh}) {
    state.fetchArticleList = true;
    if (refresh) {
      state.articleList = [];
    }
  },
  [Types.FETCH_ARTICLE_LIST_SUCCESS](state, {data, thumb}) {
    state.fetchArticleList = false;
    setArticleList(state, data, 'article', thumb);
  },
  [Types.FETCH_ARTICLE_LIST_FAILD](state) {
    state.fetchArticleList = false;
  },
  [Types.FETCH_ARTICLE_LIST_USER_REQUEST](state, {refresh}) {
    state.fetchArticleUserList = true;
    if (refresh) {
      state.articleUserList = [];
    }
  },
  [Types.FETCH_ARTICLE_LIST_USER_SUCCESS](state, {data, thumb}) {
    state.fetchArticleUserList = false;
    setArticleList(state, data, 'userArticle', thumb);
  },
  [Types.FETCH_ARTICLE_LIST_USER_FAILD](state) {
    state.fetchArticleUserList = false;
  },
  [Types.FETCH_ARTICLE_TOPIC_REQUEST](state, {page}) {
    state.fetchArticleListByTopic = true;
    if (page === 1) {
      state.articleLastedTimeByTopic = 0;
      state.articleListByTopic = [];
    }
  },
  [Types.FETCH_ARTICLE_TOPIC_SUCCESS](state, {data}) {
    state.fetchArticleListByTopic = false;
    state.articleLastedTimeByTopic = data.lastedTime;
    setArticleList(state, data, 'topic');
  },
  [Types.FETCH_ARTICLE_TOPIC_FAILD](state) {
    state.fetchArticleListByTopic = false;
  },
  [Types.FETCH_ARTICLE_PRODUCT_SUCCESS](state, {articles, favs, articleProductType}) {
    articles.forEach(article => {
      if (article.articleProductType === articleProductType) {
        get(article, 'productList', []).forEach(product => {
          const find = favs.find(f => {
            if (articleProductType === 1) {
              return f.id === product.productId;
            } else if (articleProductType === 2) {
              return f.id === product.productSkn;
            }
          });

          if (find) {
            product.favorite = find.favorite;
          }
        });
      }
    });
  },
  [Types.CHANGE_AUTHOR_FOLLOW](state, {authorUid, authorType, follow, type}) {
    updateAuthorStates(state, {
      authorUid,
      authorType,
      hasAttention: follow ? 'Y' : 'N'
    });

    if (articlefield(type)) {
      state[articlefield(type)].forEach(article => {
        if (article.authorUid === authorUid) {
          article.hasAttention = follow ? 'Y' : 'N';
        }
      });
    }
  },
  [Types.CHANGE_ARTICLE_LIST_SLIDE](state, {articleId, index, type}) {
    state[articlefield(type)].forEach(article => {
      if (article.articleId === articleId) {
        article.blockIndex = index;
        return;
      }
    });
  },
  [Types.UPDATE_ARTICLE_STATE](state, {data}) {
    updateArticleState(state, data);
  },
  [Types.UPDATE_ARTICLE_COMMENT_COUNT](state, {articleId, commentCount}) {
    let article = state.articleStates[articleId];

    if (article) {
      article.commentCount = commentCount ? commentCount : (article.commentCount + 1);
      updateArticleState(state, article);
    }
  },
  [Types.ASYNC_ARTICLE_COMMENT](state, {articleId, type}) {
    state[articlefield(type)].forEach(article => {
      if (article.articleId === articleId) {
        article.comments = state.articleStates[articleId].comments;
      }
    });
  },
  [Types.CHANGE_ARTICLE_LIST_INTRO](state, {articleId, isExpand, type}) {
    const find = state[articlefield(type)].find(article => article.articleId === articleId);

    if (find) {
      find.isExpand = isExpand;
    }
  },
  [Types.CHANGE_ARTICLE_LIST_INTRO_HEIGHT](state, {articleId, introHeight, introCollapseHeight, type}) {
    const find = state[articlefield(type)].find(article => article.articleId === articleId);

    if (find) {
      find.introHeight = introHeight || find.introHeight;
      find.introCollapseHeight = introCollapseHeight || find.introCollapseHeight;
    } else {
      const findThumb = state[articlefield(type, true)].find(article => article.articleId === articleId);

      if (findThumb) {
        findThumb.introHeight = introHeight || findThumb.introHeight;
        findThumb.introCollapseHeight = introCollapseHeight || findThumb.introCollapseHeight;
      }
    }
  },
  [Types.GUANG_ARTICLE_CONTENT](state, data) {
    state.fetchArticleDetail = false;
    state.articleDetail = { getArticleContent: data };
  },
  [Types.FETCH_GUANG_FAILED](state) {
    state.fetchArticleDetail = false;
  },
  [Types.FETCH_GUANG_REQUEST](state) {
    state.fetchArticleDetail = true;
  },
  [Types.FETCH_GUANG_SUCCESS](state, data) {
    state.fetchArticleDetail = false;
    state.articleDetail = data;
  },
  [Types.GUANG_DETAIL_PRODUCT_LIST](state, data) {
    state.articleProductList = data;
  },
  [Types.GUANG_CHANGE_PRODUCT_FAV](state, favsList) {
    get(state.articleDetail, 'getArticleContent', []).forEach(c => {
      const products = get(c, 'relatedReco.goods', []);

      products.forEach(p => {
        const fav = favsList.find(i => `${i.id}` === `${p.product_id}`);

        p.favorite = get(fav, 'favorite', false);
      });
    });
  },
  [Types.FETCH_TOPIC_INFO_REQUEST](state, topicId) {
    state.fetchTopicInfo = true;
  },
  [Types.FETCH_TOPIC_INFO_SUCCESS](state, data) {
    state.fetchTopicInfo = false;
    data.hasAttention = data.isAttend === 'Y';
    data.viewModel = data.viewModel || 1;
    state.topicInfo = data;
  },
  [Types.FETCH_TOPIC_INFO_FAILD](state) {
    state.fetchTopicInfo = false;
    state.topicInfo = {};
  },
  [Types.CHANGE_TOPIC_FOLLOW](state, {topicId, follow}) {
    if (+state.topicInfo.topicId === +topicId) {
      state.topicInfo.hasAttention = follow;
    }
  },
  [Types.FETCH_ARTICLE_SINGLE_DETAIL_REQUEST](state, topicId) {
    state.fetchArticleSingleDetail = true;
  },
  [Types.FETCH_ARTICLE_SINGLE_DETAIL_SUCCESS](state, {data, thumb, articleId, result}) {
    state.fetchArticleSingleDetail = false;

    const emptyData = {
      articleId,
      empty: true
    };
    let article = {};

    if (result.code === 200) {
      article = data[0] || {...emptyData};

      if (thumb) {
        article.thumb = true;
        article.comments = [];
        article.hasAttention = '';
        article.hasFavor = '';
        article.hasPraise = '';
        article.commentCount = 0;
        article.favoriteCount = 0;
        article.praiseCount = 0;
      }
    } else if (result.code === 403) {
      article = {...emptyData};
    } else {
      article = {...emptyData, emptyTip: result.message};
    }

    if (!thumb) {
      Object.assign(state.articleSingleDetail, {thumb: false});
    } else {
      state.articleSingleDetail = article;
    }
  },
  [Types.FETCH_ARTICLE_SINGLE_DETAIL_FAILD](state) {
    state.fetchArticleSingleDetail = false;
  },
  [Types.FETCH_DETAIL_RECOMMEND_REQUEST](state, topicId) {
    state.fetchDetailRecommendArticles = true;
  },
  [Types.FETCH_DETAIL_RECOMMEND_SUCCESS](state, {data}) {
    state.fetchDetailRecommendArticles = false;
    setArticleList(state, data, 'detail');
  },
  [Types.FETCH_DETAIL_RECOMMEND_FAILD](state) {
    state.fetchDetailRecommendArticles = false;
  },
};