🐞 fix(ID1000725): 购物车已选条数计算有误（取消勾选时没做减计算）

src/components/iconText/index.tsx

@@ -31,7 +31,6 @@ const IconText: FC<PropsType> = (props) => {
   const textComponent = children ? children : <Text className={classnames(props.textClassName, styles['text'])} style={textCustomStyle}>{text}</Text>
 
   const component = ()=>{
-    console.log('direction===>',direction);
     if(direction === 'left' || direction === 'top'){
       return <>
       {iconComponent}

src/pages/shopping/components/bottomEditBar/index.tsx

@@ -22,10 +22,10 @@ export default (props: PropsType) => {
 
   const selectCallBack = () => {
     onSelectCheckbox && onSelectCheckbox(true)
-    dispatch({ type: ShoppingDispatchType.UPDATE_MULTIPLE_SELECTION, data: true })
+    dispatch({ type: ShoppingDispatchType.UPDATE_MULTIPLE_SELECTION_STATUS, data: true })
   }
   const closeCallBack = () => {
-    dispatch({ type: ShoppingDispatchType.UPDATE_MULTIPLE_SELECTION, data: false })
+    dispatch({ type: ShoppingDispatchType.UPDATE_MULTIPLE_SELECTION_STATUS, data: false })
     onSelectCheckbox && onSelectCheckbox(false)
   }
 

src/pages/shopping/components/bottomSettleBar/index.tsx

@@ -9,9 +9,8 @@ type PropsType = {
   onSettleAccount?: Function
 }
 
-export default props => {
+export default (props: PropsType) => {
   const { onSettleAccount, amount = 0 } = props
-  console.log('amount==>', amount)
 
   const handleSettle = () => {
     onSettleAccount && onSettleAccount()

src/pages/shopping/components/colorKindItem/index.tsx

@@ -42,26 +42,31 @@ let ColorKindItem: FC<PropsType> = props => {
   const formatUnit = itemData => {
     return itemData.sale_mode == EnumSaleMode.Bulk ? '条' : '米'
   }
-
+  // 选中
   const handleSelect = () => {
     dispatch({
       type: ShoppingDispatchType.UPDATE_CHANGED_CHECKBOX,
       data: {
         purchaserId: purchaserId,
-        multipleSelection: { ...state?.multipleSelection, [itemData.id]: {
+        multipleSelection: { 
-          id: itemData?.id,
+          ...state?.multipleSelection, 
-          estimate_amount: itemData.estimate_amount,
+          [itemData.id]: {
-          product_code: itemData.product_code,
+            id: itemData?.id,
-          product_color_code: itemData.product_color_code,
+            estimate_amount: itemData.estimate_amount,
-          sale_mode: itemData.sale_mode,
+            product_code: itemData.product_code,
-          count: itemData.sale_mode === EnumSaleMode.Bulk ? itemData.roll : Number(formatMeterDiv(itemData.length)),
+            product_color_code: itemData.product_color_code,
-        } },
+            sale_mode: itemData.sale_mode,
+            count: itemData.sale_mode === EnumSaleMode.Bulk ? itemData.roll : Number(formatMeterDiv(itemData.length)),
+          }
+        },
       },
     })
   }
+  // 未选中
   const handleClose = () => {
-    const temp = state?.multipleSelection
+    const temp = {...state?.multipleSelection}
     delete temp?.[itemData.id]
+    console.log('handleClose==>',temp);
     dispatch({
       type: ShoppingDispatchType.UPDATE_CHANGED_CHECKBOX,
       data: {

src/pages/shopping/components/shoppingCart/index.tsx

@@ -1,5 +1,6 @@
 import { FC, ReactNode, useEffect, useMemo, useReducer, useRef } from 'react'
 import {
+  GoodsMeta,
   ShoppingAction,
   ShoppingDispatchContext,
   ShoppingDispatchContextValue,
@@ -11,8 +12,7 @@ import { ColorStore, ShoppingStateContextValue } from '../../context'
 import { ShoppingStore } from '../../context/shoppingStore'
 
 export type TriggerCheckboxOptions = {
-  colorStore: ColorStore
+  multipleSelection: GoodsMeta['multipleSelection']
-  currentCheckedPurchaserId: ShoppingStateContextValue['currentCheckedPurchaserId']
   setSelectedAmount: ShoppingDispatchContextValue['UPDATE_SELECTED_AMOUNT']
 }
 
@@ -42,13 +42,12 @@ export const ShoppingProvider: FC<ShoppingCartPropsType> = props => {
 
   // 这里要在 useEffect 也就是刷新 state 后再调用，否则如果在 onFieldsChangeRef 修改值会覆盖掉上次修改
   useEffect(() => {
-    console.log('onTriggerCheckboxRef start run')
+    console.log('onTriggerCheckboxRef start run', state.colorStore?.[state.currentCheckedPurchaserId]?.multipleSelection)
     onTriggerCheckboxRef.current?.({
-      colorStore: state.colorStore,
+      multipleSelection: state.colorStore?.[state.currentCheckedPurchaserId]?.multipleSelection,
-      currentCheckedPurchaserId: state.currentCheckedPurchaserId,
       setSelectedAmount: amount => dispatch({ type: ShoppingDispatchType.UPDATE_SELECTED_AMOUNT, data: amount }),
     })
-  }, [state.colorStore, state.currentCheckedPurchaserId])
+  }, [state.colorStore?.[state.currentCheckedPurchaserId]?.multipleSelection])
 
   // 加入一个监听，为 onFieldsChange 回调服务
   // useEffect(() => {

src/pages/shopping/components/shoppingCartItem/index.tsx

@@ -86,7 +86,7 @@ let ShoppingCartItem: FC<PropsType> = props => {
     dispatch({ type: ShoppingDispatchType.UPDATE_CURRENT_CHECKED_SALEMODE, data: type })
     // 重置预估金额
     dispatch({ type: ShoppingDispatchType.UPDATE_SELECTED_AMOUNT, data: 0 })
-    dispatch({ type: ShoppingDispatchType.UPDATE_MULTIPLE_SELECTION, data: false })
+    dispatch({ type: ShoppingDispatchType.UPDATE_MULTIPLE_SELECTION_STATUS, data: false })
   }
 
 
@@ -100,7 +100,7 @@ let ShoppingCartItem: FC<PropsType> = props => {
       type: ShoppingDispatchType.UPDATE_CURRENT_CHECKED_PURCHASERID,
       data: itemData?.purchaser_id as number,
     })
-    dispatch({ type: ShoppingDispatchType.UPDATE_MULTIPLE_SELECTION, data: false })
+    dispatch({ type: ShoppingDispatchType.UPDATE_MULTIPLE_SELECTION_STATUS, data: false })
   }
 
   // 统计已选面料
@@ -118,6 +118,7 @@ let ShoppingCartItem: FC<PropsType> = props => {
 
   // 统计已选颜色
   const colorChecked = useMemo(() => {
+    console.log('colorChecked item',multipleSelection);
     if (!multipleSelection || isEmptyObject(multipleSelection)) return 0
     return new Set(
       Object.values(multipleSelection).reduce((prev, item: Goods) => {
@@ -135,13 +136,10 @@ let ShoppingCartItem: FC<PropsType> = props => {
     if (!multipleSelection || isEmptyObject(multipleSelection)) return 0
     return (
       Object.values(multipleSelection).reduce((prev, item: Goods) => {
-        if (selected === EnumSaleMode.Bulk) {
+        return prev + item.count
-          return prev + item.count
-        }
-        return prev
       }, 0) || 0
     )
-  }, [multipleSelection, currentCheckedPurchaserId, selected])
+  }, [multipleSelection, currentCheckedPurchaserId, selected, itemData])
 
   const [isPending, startTransition] = useTransition()
   const { fetchData } = ShoppingCartListApi()
@@ -222,7 +220,7 @@ let ShoppingCartItem: FC<PropsType> = props => {
           <View className={styles.summary}>
             <Text>
               已选 {materialChecked} 种面料，{colorChecked} 个颜色，共{' '}
-              {selected === EnumSaleMode.Bulk ? `${lengthOrRollChecked} 条` : `${formatMeterDiv(lengthOrRollChecked).toLocaleString()} 米`}
+              {selected === EnumSaleMode.Bulk ? `${lengthOrRollChecked} 条` : `${(lengthOrRollChecked).toLocaleString()} 米`}
             </Text>
           </View>
         </View>
@@ -370,12 +368,28 @@ const GoodsList = memo<GoodsListPropType>(props => {
 const withStateSlice = (comp, slice) => {
   const MemoComp = memo(comp, (prevProps, nextProps) => {
     let needMemo = true
+    // const prevCheckedPurchaserId = prevProps.state.currentCheckedPurchaserId
+    // const nextCheckedPurchaserId = nextProps.state.currentCheckedPurchaserId
+    // const purchaser_id = prevProps.itemData.purchaser_id
+    // const prevMultipleSelection = prevProps.state.colorStore[purchaser_id].multipleSelection
+    // const nextMultipleSelection = nextProps.state.colorStore[purchaser_id].multipleSelection
     if (JSON.stringify(prevProps.itemData) !== JSON.stringify(nextProps.itemData)) {
       needMemo = false
     }
+    if(prevProps.itemData.purchaser_name === '牛逼哄哄纺织'){
+      console.log('------withStateSlice props-------');
+      console.log('withStateSlice props prevProps', prevProps);
+      console.log('withStateSlice props nextProps', nextProps);
+      console.log('------withStateSlice props-------');
+    }
     if (JSON.stringify(prevProps.state) !== JSON.stringify(nextProps.state)) {
+      console.log('MultipleSelection 有变化');
       needMemo = false
     }
+    // if (JSON.stringify(prevCheckedPurchaserId) !== JSON.stringify(nextCheckedPurchaserId)) {
+    //   console.log('checkedPurchaserId 有变化');
+    //   needMemo = false
+    // }
     return needMemo
   })
   const Wrapper = (props, ref) => {

src/pages/shopping/context/index.ts

@@ -64,7 +64,7 @@ export interface ShoppingStateContextValue {
 
 export enum ShoppingDispatchType {
   UPDATE_MANAGE_STATUS = 'UPDATE_MANAGE_STATUS',
-  UPDATE_MULTIPLE_SELECTION = 'UPDATE_MULTIPLE_SELECTION',
+  UPDATE_MULTIPLE_SELECTION_STATUS = 'UPDATE_MULTIPLE_SELECTION_STATUS',
   UPDATE_CURRENT_CHECKED_PURCHASERID = 'UPDATE_CURRENT_CHECKED_PURCHASERID',
   UPDATE_CURRENT_CHECKED_SALEMODE = 'UPDATE_CURRENT_CHECKED_SALEMODE',
   UPDATE_COLOR_STORE = 'UPDATE_COLOR_STORE',
@@ -74,7 +74,7 @@ export enum ShoppingDispatchType {
 
 export interface ShoppingDispatchContextValue {
   [ShoppingDispatchType.UPDATE_MANAGE_STATUS]: (isManageStatus: ShoppingStateContextValue['isManageStatus']) => void
-  [ShoppingDispatchType.UPDATE_MULTIPLE_SELECTION]: (isMultipleSelection: ShoppingStateContextValue['isMultipleSelection']) => void
+  [ShoppingDispatchType.UPDATE_MULTIPLE_SELECTION_STATUS]: (isMultipleSelection: ShoppingStateContextValue['isMultipleSelection']) => void
   [ShoppingDispatchType.UPDATE_CURRENT_CHECKED_PURCHASERID]: (purchaserId: ShoppingStateContextValue['currentCheckedPurchaserId']) => void
   [ShoppingDispatchType.UPDATE_CURRENT_CHECKED_SALEMODE]: (saleMode: ShoppingStateContextValue['currentCheckedSaleMode']) => void
   [ShoppingDispatchType.UPDATE_COLOR_STORE]: (colorStore: React.SetStateAction<ColorStore>) => void
@@ -94,7 +94,7 @@ export function shoppingReducer(state: ShoppingStateContextValue, action: Shoppi
     case ShoppingDispatchType.UPDATE_MANAGE_STATUS: {
       return { ...state, isManageStatus: data }
     }
-    case ShoppingDispatchType.UPDATE_MULTIPLE_SELECTION: {
+    case ShoppingDispatchType.UPDATE_MULTIPLE_SELECTION_STATUS: {
       return { ...state, isMultipleSelection: data }
     }
     case ShoppingDispatchType.UPDATE_CURRENT_CHECKED_PURCHASERID: {
@@ -117,7 +117,7 @@ export function shoppingReducer(state: ShoppingStateContextValue, action: Shoppi
           [data.purchaserId as number]: {
             purchaserId: data.purchaserId,
             goodsKind: { ...state.colorStore[data.purchaserId]?.goodsKind, ...data.goodsKind },
-            multipleSelection: data?.multipleSelection ? data.multipleSelection : state.colorStore[data.purchaserId]?.multipleSelection,
+            multipleSelection: data.multipleSelection ? data.multipleSelection : state.colorStore[data.purchaserId]?.multipleSelection,
           },
         },
       }

src/pages/shopping/index.tsx

@@ -18,15 +18,13 @@ import { alert, goLink, isEmptyObject } from '@/common/common'
 
 export const Shopping: FC = memo(() => {
   // 计算总的预估金额
-  const handleTriggerCheckbox = ({ colorStore, currentCheckedPurchaserId, setSelectedAmount }) => {
+  const handleTriggerCheckbox = ({ multipleSelection, setSelectedAmount }) => {
-    const multipleSelection = colorStore?.[currentCheckedPurchaserId]?.multipleSelection
     console.log('handleTriggerCheckbox==>', multipleSelection)
 
     if (multipleSelection) {
-      const result = Object.values(multipleSelection).reduce((prev: number, value: Goods) => {
+      const result = Object.values(multipleSelection).reduce((prev: number , value: Goods) => {
         return prev + Number(formatPriceDiv(value.estimate_amount))
       }, 0) as number
-      console.log('result==>', result)
       // 同步修改上下文的 预估金额
       setSelectedAmount(result)
     } else {