import {
  INumberConfigType,
  ISelectConfigType,
  ITextConfigType,
  TSelectDefaultType,
  IColorConfigType,
  TTextDefaultType,
  TColorDefaultType,
  TNumberDefaultType,
  IModuleListType,
} from 'editorCore/FormComponents/types';
import { commonConfig, commonEditData, ICommonConfig } from '../../common';
import _ from 'lodash';
import { MarketingMix as Component } from 'lwj-mobile-ui';

type TMarketingMixProps = React.ComponentProps<typeof Component>;

export type TMarketingMixEditData = Array<
  ITextConfigType | ISelectConfigType<TMarketingMixProps['theme']> | IModuleListType
>;

type TModuleList = Required<TMarketingMixProps>['moduleList'];
type TItem = TModuleList[0] & {
  /**
   * 数据来源
   * 1 营销活动数据 2 自定义配置
   */
  dataSource: 1 | 2;
  /**
   * 营销活动
   *
   */
  marketingType: 'snap' | 'preSale' | 'goldCoin' | 'groupBuying' | 'crowdfunding';
  /**
   * 跳转目标
   * 1 活动列表页 | 2 商品详情页
   */
  target: 1 | 2;
};

export type TMarketingMixConfig = Pick<ICommonConfig, 'name'> &
  Pick<TMarketingMixProps, 'borderRadius' | 'paddingX' | 'theme'> & {
    moduleList: TItem[];
  };

export interface IMarketingMixSchema {
  editData: TMarketingMixEditData;
  config: TMarketingMixConfig;
}



const MarketingMix: IMarketingMixSchema = {
  editData: [
    commonEditData.name,
    {
      key: 'theme',
      name: '列表样式',
      type: 'Select',
      range: [
        {
          key: 'twoInARow',
          text: '一行二个',
        },
        {
          key: 'fourInARow',
          text: '一行四个',
        },
      ],
    },
    {
      key: 'borderRadius',
      name: '圆角',
      type: 'Number',
      range: [0, 30],
    },
    {
      key: 'paddingX',
      name: '页面边距',
      type: 'Number',
      range: [0, 30],
    },
    {
      key: 'moduleList',
      name: '配置',
      type: 'ModuleList',
    },
  ],
  config: {
    ..._.pick(commonConfig, ['name']),
    theme: 'twoInARow',
    borderRadius: 3,
    paddingX: 15,
    moduleList: getModuleList(),
  },
};

export function getModuleList(color: 'rgba(255, 255, 255, 1)' | 'rgba(14, 191, 169, 1)' = 'rgba(255, 255, 255, 1)') {
  const defaultProductList = [
    {
      id: '10408784',
      name: '商品1',
      cover_path:
        'https://static.liweijia.com/site-php/upload/commodity-goods/57df103db60b73ea0f71187d97f6e54f.png',
      price: 99,
      sales_volume: 99,
      description: '',
      wxapplink: '',
    },
    {
      id: '10357209',
      name: '商品2',
      cover_path:
        'https://static.liweijia.com/site-php/upload/commodity-goods/91200c9ffa04149b904edc05e91c1016.png',
      price: 99,
      sales_volume: 99,
      description: '',
      wxapplink: '',
    },
  ]
  const moduleList: TItem[] = [
    {
      moduleName: '模块1',
      titleName: '标题1',
      dataSource: 1,
      marketingType: "groupBuying",
      target: 1,
      titleTheme: 'greenBlue',
      titleColor: color,
      endTime: '2021/12/24 16:17:09',
      showCountDown: true,
      showPrice: true,
      productList: defaultProductList,
    },
    {
      moduleName: '模块2',
      titleName: '标题2',
      dataSource: 1,
      marketingType: "groupBuying",
      target: 1,
      titleTheme: 'greenBlue',
      titleColor: color,
      endTime: '2021/12/24 16:17:09',
      showCountDown: true,
      showPrice: true,
      productList: defaultProductList,
    },
    {
      moduleName: '模块3',
      titleName: '标题3',
      dataSource: 1,
      marketingType: "groupBuying",
      target: 1,
      titleTheme: 'greenBlue',
      titleColor: color,
      endTime: '2021/12/24 16:17:09',
      showCountDown: true,
      showPrice: true,
      productList: defaultProductList,
    },
    {
      moduleName: '模块4',
      titleName: '标题4',
      dataSource: 1,
      marketingType: "groupBuying",
      target: 1,
      titleTheme: 'greenBlue',
      titleColor: color,
      endTime: '2021/12/24 16:17:09',
      showCountDown: true,
      showPrice: true,
      productList: defaultProductList,
    },
  ]
  return moduleList
}



export default MarketingMix;