✨ feat: 优化码单管理

src/context/ContextShop/index.tsx

@@ -1,17 +1,77 @@
 import React, { useContext, useReducer } from 'react'
-import { useDispatch } from 'react-redux'
-import { CustomPrintCalculationApi } from '@/api/codeManage'
-import type { CodeParam } from '@/reducers/codeData'
-import { useSelector } from '@/reducers/hooks'
+import type { saleModeType } from '@/common/enum'
 
 interface params {
-  state: CodeParam
-  dispatch: React.Dispatch<any>
+  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 }
+  recommendSubmitStatus?: boolean
+}
+
+export interface ActionsMap {
+  setInitData: StateType
+  updateProduct: StateType
+  setRecommendSubmit: 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() {
@@ -21,17 +81,29 @@ function createCtx<A extends {} | null>() {
   }
   return [useCtx, ctx.Provider] as const
 }
-export const [useCurrenCode, CurrentProvider] = createCtx<params>()
+export const [useCurrenShop, CurrentProvider] = createCtx<params>()
 
 // https://dev.to/elisealcala/react-context-with-usereducer-and-typescript-4obm
 export default (props: PropsType) => {
-  const initialState = { count: 0 }
-  function reducer(state, action) {
+  const initialState = {
+    list: [],
+    statistics: {
+      product_number: 0,
+      color_number: 0,
+      roll_number: 0,
+      length_number: 0,
+      price_number: 0,
+    },
+    recommendSubmitStatus: false,
+  }
+  function reducer(state: StateType, action: Actions) {
     switch (action.type) {
-      case 'increment':
-        return { count: state.count + 1 }
-      case 'decrement':
-        return { count: state.count - 1 }
+      case 'setInitData':
+        return onInitData(state, action)
+      case 'updateProduct':
+        return onUpdateData(state, action)
+      case 'setRecommendSubmit':
+        return { ...state, recommendSubmitStatus: action.data.recommendSubmitStatus }
       default:
         return state
     }
@@ -41,3 +113,37 @@ export default (props: PropsType) => {
     <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, recommendSubmitStatus: data.recommendSubmitStatus, statistics }
+}
+
+// 更新数据
+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 }
+}

src/context/ContextShop/reducers.ts

@@ -0,0 +1,72 @@
+type ActionMap<M extends Record<string, any>> = {
+  [Key in keyof M]: M[Key] extends undefined
+    ? {
+      type: Key
+    }
+    : {
+      type: Key
+      payload: M[Key]
+    }
+}
+
+export enum Types {
+  Create = 'CREATE_PRODUCT',
+  Delete = 'DELETE_PRODUCT',
+  Add = 'ADD_PRODUCT',
+}
+
+// Product
+
+interface ProductType {
+  id: number
+  name: string
+  price: number
+}
+
+interface ProductPayload {
+  [Types.Create]: {
+    id: number
+    name: string
+    price: number
+  }
+  [Types.Delete]: {
+    id: number
+  }
+}
+
+export type ProductActions = ActionMap<ProductPayload>[keyof ActionMap<ProductPayload>]
+
+export const productReducer = (state: ProductType[], action: ProductActions | ShoppingCartActions) => {
+  switch (action.type) {
+    case Types.Create:
+      return [
+        ...state,
+        {
+          id: action.payload.id,
+          name: action.payload.name,
+          price: action.payload.price,
+        },
+      ]
+    case Types.Delete:
+      return [
+        ...state.filter(product => product.id !== action.payload.id),
+      ]
+    default:
+      return state
+  }
+}
+
+interface ShoppingCartPayload {
+  [Types.Add]: undefined
+}
+
+export type ShoppingCartActions = ActionMap<ShoppingCartPayload>[keyof ActionMap<ShoppingCartPayload>]
+
+export const shoppingCartReducer = (state: number, action: ProductActions | ShoppingCartActions) => {
+  switch (action.type) {
+    case Types.Add:
+      return state + 1
+    default:
+      return state
+  }
+}