import queryString from 'query-string';
import lodash from 'lodash';
import i18n from '@/vue/i18n';
import { productUrl, shopUrlId, imageUrl } from '@/adapter/shopee/render/utils';
import { getShopeeCategoryId } from '@/api/shopee/client/category';
import { addCommas } from '@/lib/utils/str';
import { getDateOnly, getYearOnly } from '@/lib/utils/moment';

export const tableProductSpy = {
  columns: [
    {
      type: 'selection',
      width: 60,
      align: 'center',
    },
    {
      title: '#',
      key: 'index',
      sortable: true,
      width: 70,
    },
    {
      title: i18n.t('PRODUCT_NAME'),
      key: 'name',
      slot: 'name',
      sortable: true,
      width: 400,
    },
    {
      title: i18n.t('PRODUCT_IMAGE'),
      key: 'image',
      slot: 'image',
      width: 80,
    },
    {
      title: i18n.t('PRODUCT_CATEGORY'),
      key: 'categoryName',
      sortable: true,
    },
    {
      title: i18n.t('PRODUCT_BRAND'),
      key: 'brand',
      sortable: true,
    },
    {
      title: i18n.t('PRODUCT_TIME_CREATE'),
      key: 'showTime',
      sortable: true,
    },
    {
      title: i18n.t('PRODUCT_MODEL_PRICE'),
      key: 'price',
      sortable: true,
      render: (h, params) => {
        return h('span', addCommas(params.row.price));
      },
    },
    {
      title: i18n.t('PRODUCT_MODEL_DISCOUNT'),
      key: 'discount',
    },
    // {
    //   title: i18n.t('PRODUCT_MODEL_STOCK'),
    //   key: 'stock',
    //   sortable: true,
    //   render: (h, params) => {
    //     return h('span', addCommas(params.row.stock));
    //   },
    // },
    {
      title: i18n.t('PRODUCT_MODEL_SOLD'),
      key: 'sold',
      sortable: true,
      render: (h, params) => {
        return h('span', addCommas(params.row.sold));
      },
    },
    {
      title: i18n.t('PRODUCT_MODEL_TOTAL_SALE'),
      key: 'sale',
      sortable: true,
      render: (h, params) => {
        return h('span', addCommas(params.row.sale));
      },
    },
    {
      title: i18n.t('TABLE_ACTION'),
      slot: 'action',
    },
  ],
  rows: [],
};

/**
 *
 * @param {ShopeeSearchItemShop} product
 * @param {number} index
 */
export const renderTableProduct = (product, index = 0) => {
  const productId = product.itemid;
  const shopId = product.shopid;

  const price = product.price / 100000;

  const categoryId = product.global_cat ? product.global_cat.catid.at(-1) : product.catid;

  const categoryData = getShopeeCategoryId(categoryId) || {
    id: categoryId,
    name: categoryId,
    tree: categoryId,
  };

  const spyUrl = queryString.stringifyUrl({
    url: '/shopee/spy/product',
    query: {
      productId,
      shopId,
    },
  });

  const timeCreate = new Date(product.ctime * 1000);

  const categoryName = categoryData.display_name || categoryData.name;
  const categoryTree = categoryData.tree || categoryName;

  return {
    index: index + 1,
    productId,
    shopId,
    categoryId,
    categoryName,
    categoryTree,
    productUrl: productUrl(productId, shopId),
    videoUrl: lodash.get(product, 'video_info_list[0].formats[0].url', ''),
    shopUrl: shopUrlId(shopId),
    spyUrl,
    name: product.name,
    location: product.shop_location,
    shopName: product.shop_name,
    status: product.item_status,
    image: imageUrl(product.image),
    brand: product.brand || 'No Brand',
    stock: product.stock,
    timeCreate,
    showTime: getDateOnly(timeCreate),
    year: getYearOnly(timeCreate),
    price,
    sale: product.historical_sold * price,
    sold: product.historical_sold,
    discount: product.discount || '0%',
    currency: product.currency,
    modelCount: 0,
    likeCount: product.liked_count,
    commentCount: product.cmt_count,
    ratingCount: product.item_rating.rating_count[0],
    ratingStart: product.item_rating.rating_star,
  };
};

export const tableProductVariation = {
  columns: [
    {
      title: i18n.t('PRODUCT_MODEL_NAME'),
      key: 'name',
    },
    {
      title: i18n.t('PRODUCT_IMAGE_NAME'),
      key: 'image',
      slot: 'image',
    },
    {
      title: i18n.t('PRODUCT_MODEL_PRICE_BEFORE_DISCOUNT'),
      key: 'price',
      sortable: true,
      render: (h, params) => {
        return h('span', addCommas(params.row.price));
      },
    },
    {
      title: i18n.t('PRODUCT_MODEL_PRICE'),
      key: 'promotion',
      sortable: true,
      render: (h, params) => {
        return h('span', addCommas(params.row.promotion));
      },
    },
    {
      title: i18n.t('PRODUCT_MODEL_DISCOUNT'),
      key: 'discount',
      render: (h, params) => {
        return h('span', `${params.row.discount}%`);
      },
    },
    {
      title: i18n.t('PRODUCT_MODEL_STOCK'),
      key: 'stock',
      sortable: true,
      render: (h, params) => {
        return h('span', addCommas(params.row.stock));
      },
    },
    {
      title: i18n.t('PRODUCT_MODEL_SOLD'),
      key: 'sold',
      sortable: true,
      render: (h, params) => {
        return h('span', addCommas(params.row.sold));
      },
    },
    {
      title: i18n.t('PRODUCT_MODEL_TOTAL_SALE'),
      key: 'sale',
      sortable: true,
      render: (h, params) => {
        return h('span', addCommas(params.row.sale));
      },
    },
  ],
};

export const tableSpyDashboard = {
  columns: [
    {
      title: i18n.t('PRODUCT_NAME'),
      key: 'name',
      slot: 'name',
      width: 300,
    },
    {
      title: i18n.t('PRODUCT_IMAGE'),
      key: 'image',
      slot: 'image',
      width: 80,
    },
    {
      title: i18n.t('PRODUCT_TIME_CREATE'),
      key: 'showTime',
      width: 120,
    },
    {
      title: i18n.t('SHOP_NAME'),
      key: 'shopName',
      slot: 'shopName',
      width: 150,
    },
    {
      title: i18n.t('PRODUCT_MODEL_PRICE'),
      key: 'promotion',
      render: (h, params) => {
        return h('span', addCommas(params.row.promotion));
      },
    },
    {
      title: i18n.t('PRODUCT_MODEL_DISCOUNT'),
      key: 'discount',
    },
    {
      title: i18n.t('PRODUCT_MODEL_SOLD'),
      key: 'sold',
      render: (h, params) => {
        return h('span', addCommas(params.row.sold));
      },
    },
    {
      title: i18n.t('PRODUCT_MODEL_INCRASE'),
      key: 'soldInc',
      render: (h, params) => {
        return h('span', addCommas(params.row.soldInc));
      },
    },
    {
      title: i18n.t('PRODUCT_MODEL_TOTAL_SALE'),
      key: 'sale',
      render: (h, params) => {
        return h('span', addCommas(params.row.sale));
      },
    },
    {
      title: i18n.t('TABLE_ACTION'),
      slot: 'action',
    },
  ],
};
