import React, { useContext, useReducer } from 'react'
import type { saleModeType } from '@/common/enum'

interface params {
  state: StateType
  dispatch: React.Dispatch<Actions>
}
interface PropsType {
  children: React.ReactNode
}

export interface ColorType {
  estimate_amount: number
  id: number
  lab: { a: number; b: number; l: number }
  length: number
  product_color_code: string
  product_color_id: number
  product_color_name: string
  rgb: { b: number; g: number; r: number }
  roll: number
  sale_mode: number
  sale_mode_name: string
  sale_offset: number
  sale_price: number
  standard_price: number
  texture_url: string
  weight_error: number
  index_str: string
  checked: boolean
  has_screw_recommend: boolean
  is_screw_recommend: boolean
}
export interface ProductType {
  color_list: ColorType[]
  product_code: string
  product_id: number
  product_name: string
  index_str: string
  checked: boolean
}

export interface StateType {
  list: ProductType[]
  modeNumber?: {
    0: number
    1: number
    2: number
  }
  statistics?: {
    product_number: number
    color_number: number
    roll_number: number
    length_number: number
    price_number: number
  }
  sale_mode?: saleModeType
  checkList?: { [key in number]: boolean }
  recommendId?: number
  delCommendId?: number
}

export interface ActionsMap {
  setInitData: StateType
  updateProduct: StateType
  setRecommendId: StateType
  setDelCommendId: StateType
}

export type Actions = {
  [Key in keyof ActionsMap]: {
    type: Key
    data: ActionsMap[Key]
  }
}[keyof ActionsMap]

function createCtx<A extends {} | null>() {
  const ctx = React.createContext<A | undefined>(undefined)
  function useCtx() {
    const c = useContext(ctx)
    if (c === undefined) { throw new Error('useCtx must be inside a Provider with a value') }
    return c
  }
  return [useCtx, ctx.Provider] as const
}
export const [useCurrenShop, CurrentProvider] = createCtx<params>()

export default (props: PropsType) => {
  const initialState = {
    list: [],
    statistics: {
      product_number: 0,
      color_number: 0,
      roll_number: 0,
      length_number: 0,
      price_number: 0,
    },
    recommendId: 0,
    delCommendId: 0,
  }
  function reducer(state: StateType, action: Actions) {
    switch (action.type) {
      case 'setInitData':
        return onInitData(state, action)
      case 'updateProduct':
        return onUpdateData(state, action)
      case 'setRecommendId':
        return { ...state, recommendId: action.data.recommendId }
      case 'setDelCommendId':
        return { ...state, delCommendId: action.data.delCommendId }
      default:
        return state
    }
  }
  const [state, dispatch] = useReducer(reducer, initialState)
  return (
    <CurrentProvider value={{ state, dispatch }} children={props.children}></CurrentProvider>
  )
}

// 初始化数据
const onInitData = (state: StateType, action: Actions) => {
  const { data } = action
  const statistics = { product_number: 0, color_number: 0, roll_number: 0, length_number: 0, price_number: 0 }
  data.list?.map((item, index) => {
    item.index_str = index.toString()
    item.checked = false
    item.color_list?.map((citem, cindex) => {
      citem.index_str = `${index},${cindex}`
      citem.checked = false
    })
  })
  return { ...state, list: data.list, sale_mode: data.sale_mode, recommendId: 0, statistics, delCommendId: 0 }
}

// 更新数据
const onUpdateData = (state: StateType, action: Actions) => {
  const { data } = action
  const statistics = { product_number: 0, color_number: 0, roll_number: 0, length_number: 0, price_number: 0 }
  data.list?.map((item, index) => {
    item.color_list?.map((citem) => {
      if (citem.checked) {
        statistics.color_number += 1
        statistics.price_number += citem.estimate_amount
        statistics.roll_number += citem.roll
        statistics.length_number += citem.length
      }
    })
    if (item.checked) { statistics.product_number += 1 }
  })
  console.log('data:::', data.list)
  return { ...state, list: data.list, statistics }
}
