Merge branch 'dev' of ssh://git.online.zzfzyc.com:10022/mp/spider_cloud_warehouse into 订单页

project.private.config.json

@@ -158,8 +158,8 @@
         },
         {
           "name": "",
-          "pathName": "pages/collectionDetail/index",
+          "pathName": "pages/submitOrder/index",
-          "query": "",
+          "query": "purchaser_id=642&sale_mode=1&shopping_cart_product_color_list%5B2%5D=58994&shopping_cart_product_color_list%5B3%5D=58995",
           "launchMode": "default",
           "scene": null
         }

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

@@ -19,11 +19,11 @@ export default memo<PropsType>((props) => {
 
   const selectCallBack = () => {
     setSelectAll(true)
-    onSelectCheckbox && onSelectCheckbox(isSelectAll)
+    onSelectCheckbox && onSelectCheckbox(true)
   }
   const closeCallBack = () => {
     setSelectAll(false)
-    onSelectCheckbox && onSelectCheckbox(isSelectAll)
+    onSelectCheckbox && onSelectCheckbox(false)
 
   }
 

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

@@ -22,7 +22,7 @@ export default memo<PropsType>((props) => {
         <Text className={styles.moneyText}>预估金额：</Text>
         <Text className={styles.moneyNumber}>
           <Text className={styles.unit}>¥</Text>
-          {formatPriceDiv(amount)}
+          {amount}
         </Text>
       </View>
       <View className={styles.bottomRight}>

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

@@ -5,12 +5,13 @@ import { FC, memo, ReactNode, useCallback, useEffect, useState } from 'react'
 import classnames from 'classnames'
 import styles from './index.module.scss'
 import { debounce } from '@/common/util'
-import { formatPriceDiv } from '@/common/format'
+import { formatImgUrl, formatPriceDiv } from '@/common/format'
 import { EnumSaleMode } from '@/common/Enumerate'
 import { useNeedMemoCallback } from '@/use/useCommon'
-import {selectList} from '../../config'
+import { selectList } from '../../config'
 import { useShoppingContext, useWatch } from '../../context'
 type PropsType = {
+  purchaserId: number
   item: Record<string, any> & object
   orderType: EnumSaleMode
 }
@@ -19,15 +20,14 @@ type PropsType = {
 
 const ColorKindItem: FC<PropsType> = memo(
   (props) => {
-    const { item, orderType = EnumSaleMode.Bulk} = props
+    const { purchaserId, item, orderType = EnumSaleMode.Bulk } = props
-    const { setChangedCheckbox } = useShoppingContext()
+    console.log('重新渲染 ColorKindItem', item.id, orderType, purchaserId)
-    console.log('重新渲染 ColorKindItem', item.id, orderType)
+    const { setChangedCheckbox, colorStore } = useShoppingContext()
-
+    // @ts-ignore
-    const { checked } = useWatch(item?.id)
+    const { checked } = useWatch(purchaserId, item?.id)
-
 
     //格式化金额
-    const formatPirce = useCallback((price) => {
+    const formatPrice = useCallback((price) => {
       return Number(formatPriceDiv(price))
     }, [])
 
@@ -43,21 +43,26 @@ const ColorKindItem: FC<PropsType> = memo(
 
     const handleSelect = () => {
       console.log('handleSelect')
-      setChangedCheckbox({id: item?.id, checked: true})
+      setChangedCheckbox({
-      // onChecked && onChecked({ ...item, checked: true })
+        purchaserId: purchaserId,
+        goodsKind: { [item.id]: { id: item.id, estimate_amount: item.estimate_amount, checked: true } },
+        checked: colorStore[purchaserId].checked,
+      })
     }
     const handleClose = () => {
-      setChangedCheckbox({ id: item?.id, checked: false })
+      setChangedCheckbox({
-      // onUnChecked && onUnChecked({ ...item, checked: false })
+        purchaserId: purchaserId,
+        goodsKind: { [item.id]: { id: item.id, estimate_amount: item.estimate_amount, checked: false } },
+        checked: colorStore[purchaserId].checked,
+      })
     }
 
     const getInputValue = debounce(async (num, item) => {
       if (item.sale_mode === EnumSaleMode.Bulk) {
         item.roll = num
-      }else{
+      } else {
         item.length = num
-      } 
+      }
-      // onChecked && onChecked({ ...item, checked: true })
     }, 300)
 
     return (
@@ -68,17 +73,19 @@ const ColorKindItem: FC<PropsType> = memo(
         customClassName={classnames(styles.checkbox, checked ? styles.selected : '')}
         customTextClass={styles.colorKindItem}>
         <View className={styles['colorKindItem__left']}>
-          <Image className={styles['colorKindItem__left--image']} mode='aspectFill' src='https://test.cdn.zzfzyc.com/mall/no_img.png'></Image>
+          <Image className={styles['colorKindItem__left--image']} mode='aspectFill' src={formatImgUrl(item.product_color_texture_url)}></Image>
         </View>
         <View className={styles['colorKindItem__center']}>
-          <Text className={styles['colorKindItem__center--title']}>001# 环保黑 环保黑 环保黑 环保黑 环保黑 环保黑</Text>
+          <Text className={styles['colorKindItem__center--title']}>
+            {item.product_code}# {item.product_name}
+          </Text>
           <View className={styles['colorKindItem__center--detail']}>
-            <Text className={styles['colorKindItem__center--ID']}>6002#220G</Text>
+            <Text className={styles['colorKindItem__center--ID']}>{item.product_color_code}</Text>
-            <Text className={styles['colorKindItem__center--description']}>流线棉拉架卫衣</Text>
+            <Text className={styles['colorKindItem__center--description']}>{item.product_color_name}</Text>
           </View>
         </View>
         <View className={styles['colorKindItem__right']}>
-          <View className={styles['colorKindItem__right--price']}>￥ 37.50/kg</View>
+          <View className={styles['colorKindItem__right--price']}>￥ {formatPrice(item.sale_price)}/kg</View>
           <View className={styles['colorKindItem__right--counter']}>
             <Counter
               onBlue={(e) => getInputValue(e, item)}
@@ -98,8 +105,11 @@ const ColorKindItem: FC<PropsType> = memo(
   (preProp, nextProp) => {
     const stringifyPreProp = JSON.stringify(preProp.item)
     const stringifyNextProp = JSON.stringify(nextProp.item)
-    console.log('memo==>', preProp, nextProp);
+    console.log('memo==>', preProp, nextProp)
     let needMemoized = true
+    if (preProp.purchaserId !== nextProp.purchaserId) {
+      needMemoized = false
+    }
     if (preProp.orderType !== nextProp.orderType) {
       needMemoized = false
     }

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

@@ -1,8 +1,13 @@
 import { FC, ReactNode, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react'
 import { InternalShoppingCartAction, ShoppingCartAction, ShoppingContext, useShoppingCart } from '../../context'
-import { ColorMeta, ColorStore, ShoppingContextValue } from '../../context'
+import { GoodsMeta, ColorStore, ShoppingContextValue } from '../../context'
 
-export type TriggerCheckboxOptions = { colorStore: ColorStore; changedCheckbox: ColorMeta }
+export type TriggerCheckboxOptions = {
+  colorStore: ColorStore
+  changedCheckbox: GoodsMeta
+  currentCheckedPurchaserId: ShoppingContextValue['currentCheckedPurchaserId']
+  setSelectedAmount: ShoppingContextValue['setSelectedAmount']
+}
 
 export interface ShoppingCartPropsType {
   initialValues?: ColorStore
@@ -23,12 +28,15 @@ export const ShoppingCart: FC<ShoppingCartPropsType> = (props) => {
   onTriggerCheckboxRef.current = onTriggerCheckbox
 
   const [colorStore, setColorStore] = useState<ColorStore>(() => initialValues || {})
-  const [changedCheckbox, setChangedCheckbox] = useState<ColorMeta>({})
+  const [changedCheckbox, setChangedCheckbox] = useState<GoodsMeta>({} as GoodsMeta)
   // 当前高亮的客户
   const [currentCheckedPurchaserId, setCurrentCheckedPurchaserId] = useState<number>(-1)
+  const [currentCheckedSaleMode, setCurrentCheckedSaleMode] = useState<number>(0)
   // 是否管理状态
   const [isManageStatus, setManageStatus] = useState(false)
 
+  const [selectedAmount, setSelectedAmount] = useState(0)
+
   const ctx: ShoppingContextValue = useMemo(() => {
     console.log('useMemo ShoppingContextValue')
     return {
@@ -36,13 +44,26 @@ export const ShoppingCart: FC<ShoppingCartPropsType> = (props) => {
       setManageStatus,
       currentCheckedPurchaserId, // 当前高亮的客户
       setCurrentCheckedPurchaserId, // 设置高亮当前客户
+      currentCheckedSaleMode,
+      setCurrentCheckedSaleMode,
       colorStore,
-      setChangedCheckbox(color) {
+      setChangedCheckbox(changedGoods) {
-        setColorStore((prev) => ({ ...prev, [color.id as number]: color }))
+        console.log('changedGoods==>', colorStore, changedGoods)
-        setChangedCheckbox(color)
+        setColorStore((prev) => ({
+          ...prev,
+          [changedGoods.purchaserId as number]: {
+            purchaserId: changedGoods.purchaserId,
+            goodsKind: { ...prev[changedGoods.purchaserId]?.goodsKind, ...changedGoods.goodsKind },
+            checked: changedGoods.checked,
+          },
+        }))
+        setChangedCheckbox(changedGoods)
       },
+      setColorStore,
+      selectedAmount,
+      setSelectedAmount,
     }
-  }, [colorStore, currentCheckedPurchaserId, isManageStatus])
+  }, [colorStore, currentCheckedPurchaserId, isManageStatus, selectedAmount])
   // 暴露给外界
   useImperativeHandle(
     ref.__INTERNAL__,
@@ -60,8 +81,10 @@ export const ShoppingCart: FC<ShoppingCartPropsType> = (props) => {
     onTriggerCheckboxRef.current?.({
       colorStore,
       changedCheckbox,
+      currentCheckedPurchaserId,
+      setSelectedAmount,
     })
-  }, [colorStore, changedCheckbox])
+  }, [colorStore, changedCheckbox, currentCheckedPurchaserId])
 
   return <ShoppingContext.Provider value={ctx}>{children}</ShoppingContext.Provider>
 }

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

@@ -35,6 +35,8 @@ export default memo<PropsType>((props) => {
   console.log('props==>', props)
   const { itemData } = props
 
+  const { setCurrentCheckedSaleMode } = useShoppingContext()
+
   console.log('重新渲染 shoppingCartItem')
   const [openDetail, setOpenDetail] = useState(false)
 
@@ -47,6 +49,9 @@ export default memo<PropsType>((props) => {
 
   const onSelectOrderType = (type: EnumSaleMode) => {
     setSelect(type)
+    setCurrentCheckedSaleMode(type)
+    // 重置预估金额
+    setSelectedAmount(0)
   }
 
   const saleModeList = useRef({
@@ -60,53 +65,20 @@ export default memo<PropsType>((props) => {
     weight_cut_color_list: itemData?.weight_cut_color_list,
   }
 
-  // const handleChecked = useCallback(
+  const { setChangedCheckbox, currentCheckedPurchaserId, setCurrentCheckedPurchaserId, isManageStatus, setSelectedAmount, colorStore } = useShoppingContext()
-  //   (current: any) => {
-  //     console.log('handleChecked', current)
-  //     const tempList = itemData?.[BackEndSaleModeListFieldMap[selected]].map((item) => {
-  //       if (item.id === current.id) {
-  //         item = current
-  //       }
-  //       return item
-  //     })
-  //     setMockList((pre) => {
-  //       return {
-  //         ...pre,
-  //         [selected]: tempList,
-  //       }
-  //     })
-  //   },
-  //   [mockList, selected],
-  // )
-
-  // const handleUnChecked = useCallback(
-  //   (current: any) => {
-  //     console.log('handleChecked', current)
-  //     const tempList = itemData?.[BackEndSaleModeListFieldMap[selected]].map((item) => {
-  //       if (item.id === current.id) {
-  //         item = current
-  //       }
-  //       return item
-  //     })
-  //     setMockList((pre) => {
-  //       return {
-  //         ...pre,
-  //         [selected]: tempList,
-  //       }
-  //     })
-  //   },
-  //   [mockList, selected],
-  // )
-
-  const { setChangedCheckbox, currentCheckedPurchaserId, setCurrentCheckedPurchaserId, isManageStatus } = useShoppingContext()
 
   const memoList = useMemo(() => {
     return itemData?.[BackEndSaleModeListFieldMap[selected]].length !== 0 ? (
       itemData?.[BackEndSaleModeListFieldMap[selected]].map((item) => {
+        console.log('memoList itemData', item)
         // 初始化选中状态
-        setChangedCheckbox({ id: item.id, checked: false })
+        setChangedCheckbox({
+          purchaserId: itemData.purchaser_id,
+          goodsKind: { [item.id]: { id: item.id, estimate_amount: item.estimate_amount, checked: false } },
+          checked: false,
+        })
 
-        return <ColorKindItem key={item.id} item={item} orderType={selected}></ColorKindItem>
+        return <ColorKindItem purchaserId={itemData.purchaser_id} key={item.id} item={item} orderType={selected}></ColorKindItem>
       })
     ) : (
       <View className={styles.noList}>暂无数据</View>
@@ -117,17 +89,42 @@ export default memo<PropsType>((props) => {
     if (currentCheckedPurchaserId === itemData?.purchaser_id) {
       return
     }
+    console.log('handleClickLayout')
+    setSelectedAmount(0)
+    setCurrentCheckedSaleMode(selected)
     setCurrentCheckedPurchaserId(itemData?.purchaser_id as number)
   }
 
-  // const { isManager } = useContext(ShoppingContext)
+  const handleChecked = () => {
+    console.log('handleChecked')
+    // 初始化选中状态
+    setChangedCheckbox({
+      purchaserId: itemData?.purchaser_id!,
+      checked: true,
+    })
+  }
+  const handleUnchecked = () => {
+    console.log('handleUnchecked')
+    // 初始化选中状态
+    setChangedCheckbox({
+      purchaserId: itemData?.purchaser_id!,
+      checked: false,
+    })
+  }
 
   return (
     <LayoutBlock
       circle
       customClassName={classnames(styles.layout, itemData?.purchaser_id === currentCheckedPurchaserId ? styles.selected : '')}
       onClick={handleClickLayout}>
-      <MCheckbox hiddenCheckboxIcon={!isManageStatus} customClassName={styles['checkbox']} customTextClass={styles['checkbox--text']} triggerLabel={false}>
+      <MCheckbox
+        hiddenCheckboxIcon={!isManageStatus}
+        onSelect={handleChecked}
+        onClose={handleUnchecked}
+        status={colorStore[itemData?.purchaser_id!]?.checked}
+        customClassName={styles['checkbox']}
+        customTextClass={styles['checkbox--text']}
+        triggerLabel={false}>
         <View className='flex-row justify-between' onClick={handleOpenDetail}>
           <View className={styles.topItem}>
             <View className='flex-row items-center'>

src/pages/shopping/context/index.ts

@@ -1,30 +1,57 @@
+import { EnumSaleMode } from '@/common/Enumerate'
 import React, { useRef } from 'react'
 import { useContext } from 'react'
 
 /**
  * 456: {
- *  id: 456,
+ *  purchaserId: 456,
- *  checked: true
+ *  colorKind: {
+ *    4562: {
+ *      id: 4562,
+ *      checked: false
+ *    }
+ *  }
  * },
  * 457: {
- *  id: 457,
+ *  purchaserId: 457,
- *  checked: true
+ *  colorKind: {
+ *    4562: {
+ *      id: 4562,
+ *      checked: false
+ *    }
+ *  }
  * }
  */
-export type ColorStore = Record<string, any>
+export type ColorStore = {
+  [purchaserId: GoodsMeta['purchaserId']]: GoodsMeta
+}
 
-export interface ColorMeta {
+export type Goods = {
-  id?: number
+  id: number
-  checked?: boolean
+  estimate_amount: number // 预估金额
+  checked: boolean
+}
+// 分组
+export interface GoodsMeta {
+  purchaserId: number
+  goodsKind?: {
+    [id: number]: Goods
+  }
+  checked: boolean
 }
 
 export interface ShoppingContextValue {
   isManageStatus: boolean
   setManageStatus: (isManageStatus: boolean) => void
-  currentCheckedPurchaserId: number
+  currentCheckedPurchaserId: number // 当前高亮的客户ID
   setCurrentCheckedPurchaserId: (purchaserId: number) => void
+  currentCheckedSaleMode: number
+  setCurrentCheckedSaleMode: (saleMode: number) => void
   colorStore: ColorStore
-  setChangedCheckbox: (color: ColorMeta) => void
+  setColorStore: (colorStore: React.SetStateAction<ColorStore>) => void
+  setChangedCheckbox: (changedGoods: GoodsMeta) => void
+  selectedAmount: number
+  setSelectedAmount: (amount: React.SetStateAction<number>) => void
 }
 
 export const ShoppingContext = React.createContext<ShoppingContextValue | null>(null)
@@ -37,10 +64,9 @@ export function useShoppingContext() {
   return ctx
 }
 
-export function useWatch(id: ColorMeta['id']) {
+export function useWatch(purchaserId: GoodsMeta['purchaserId'], id: number) {
   const { colorStore } = useShoppingContext()
-  console.log('colorStore==>', colorStore)
+  return id ? colorStore[purchaserId]['goodsKind']![id] : colorStore[purchaserId]['goodsKind']
-  return id ? colorStore[id] : colorStore
 }
 
 export interface ShoppingCartAction {

src/pages/shopping/context/shoppingStore.ts

@@ -0,0 +1,36 @@
+import { GoodsMeta, ColorStore } from '.'
+// 用于优化数据流 结合发布订阅 更新组件内部状态可以组件自己处理
+
+export type SubscribeCallback = (changedGoods: GoodsMeta) => void
+
+export class ShoppingStore {
+  // 全局缓存
+  private store: ColorStore = {}
+  // 监听器数组
+  private observers: SubscribeCallback[] = []
+
+  constructor(initialValue: ColorStore) {
+    initialValue && this.updateStore(initialValue)
+  }
+  // 更新全局缓存
+  private updateStore(nextStore: ColorStore) {
+    this.store = nextStore
+  }
+  // 订阅
+  subscribe(callback: SubscribeCallback) {
+    this.observers.push(callback)
+    // 取消订阅
+    return () => {
+      this.observers = this.observers.filter((fn: SubscribeCallback) => {
+        return callback !== fn // 引用地址
+      })
+    }
+  }
+  // 通知
+  notify(changedGoods: GoodsMeta) {
+    // 循环调用
+    this.observers.forEach((callback) => {
+      callback(changedGoods)
+    })
+  }
+}

src/pages/shopping/index.module.scss

@@ -17,7 +17,7 @@
 }
 .flexBox {
   display: flex;
-  width: 150px;
+  margin-left: 24px;
   align-items: center;
   justify-content: flex-end;
 }

src/pages/shopping/index.tsx

@@ -1,7 +1,7 @@
 import Search from '@/components/search'
 import { View } from '@tarojs/components'
 import Taro, { useDidShow } from '@tarojs/taro'
-import React, { FC, useCallback, useContext, useEffect, useMemo, useRef, useState } from 'react'
+import React, { FC, memo, useCallback, useContext, useEffect, useMemo, useRef, useState } from 'react'
 import styles from './index.module.scss'
 import classnames from 'classnames'
 import IconText from '@/components/iconText'
@@ -11,67 +11,62 @@ import BottomBtns from '@/components/BottomBtns'
 import { formatPriceDiv } from '@/common/format'
 import BottomSettleBar from './components/bottomSettleBar'
 import BottomEditBar from './components/bottomEditBar'
-import { ShoppingCartListApi } from '@/api/index'
+import { ShoppingCartDeleteApi, ShoppingCartListApi } from '@/api/index'
 import { dataLoadingStatus } from '@/common/util'
 import { ShoppingCart, TriggerCheckboxOptions } from './components/shoppingCart/index'
-import {  useShoppingCart, useShoppingContext } from './context'
+import { GoodsMeta, Goods, useShoppingCart, useShoppingContext } from './context'
+import { alert, goLink } from '@/common/common'
 
-export const Shopping: FC = () => {
+export const Shopping: FC = memo(() => {
-
+  // 计算总的预估金额
-  const [checkboxData, setCheckboxData] = useState<Partial<TriggerCheckboxOptions>>({})
+  const handleTriggerCheckbox = useCallback(({ colorStore, changedCheckbox, currentCheckedPurchaserId, setSelectedAmount }) => {
-  
-  const handleTriggerCheckbox = ({ colorStore, changedCheckbox }) => {
     console.log('handleTriggerCheckbox==>', colorStore, changedCheckbox)
-    setCheckboxData({ colorStore, changedCheckbox })
+    const targetGoodsKind = colorStore?.[currentCheckedPurchaserId]?.['goodsKind']
-  }
+
+    if (targetGoodsKind) {
+      const result = Object.values(targetGoodsKind).reduce((prev: number, value: Goods) => {
+        console.log('value==>', value)
+        if (value.checked) {
+          return prev + Number(formatPriceDiv(value.estimate_amount))
+        }
+        return prev
+      }, 0) as number
+      console.log('result==>', result)
+      // 同步修改上下文的 预估金额
+      setSelectedAmount(result)
+    } else {
+      setSelectedAmount(0)
+    }
+  }, [])
   return (
     <ShoppingCart onTriggerCheckbox={handleTriggerCheckbox}>
-      <ShoppingCartContainer checkboxData={checkboxData} />
+      <ShoppingCartContainer />
     </ShoppingCart>
   )
-}
+})
 
-interface InternalContainer {
+interface InternalContainer {}
-  checkboxData?: Partial<TriggerCheckboxOptions>
-}
 
-const ShoppingCartContainer:FC<InternalContainer> = (props) => {
+const ShoppingCartContainer: FC<InternalContainer> = () => {
-
+  const { isManageStatus, setManageStatus, selectedAmount, currentCheckedPurchaserId, currentCheckedSaleMode, colorStore, setColorStore } = useShoppingContext()
-  const { checkboxData } = props
-
-  const { isManageStatus, setManageStatus } = useShoppingContext()
-
-  //输入了搜索关键字
-  const getSearchData = useCallback((e) => {
-    // pageNum.current.page = 1
-    // setOrderData(() => ({ list: [], total: 0 }))
-    // setSearchField((val) => ({ ...val, name: e, size: 10 }))
-  }, [])
-
-  const shoppingCart = useShoppingCart()
-  console.log('shoppingCart==>', shoppingCart)
 
   // 管理
   const onStartToManage = () => {
     setManageStatus(!isManageStatus)
-    // shoppingCart.setManageStatus(!isManageStatus)
-  }
-
-  const [selectedAmount, setSelectedAmount] = useState(0)
-
-  // 结算
-  const handleSettleAccount = () => {}
-  // 删除
-  const handleDelete = () => {}
-
-  const handleSelectAllCheckbox = (isSelectAll: boolean) => {
-    console.log('handleSelectAllCheckbox', isSelectAll)
   }
 
   const [listHeight, setListHeight] = useState('auto')
 
   const { fetchData, state } = ShoppingCartListApi()
 
+  // 输入了搜索关键字
+  const getSearchData = useCallback((e) => {
+    fetchData({ short_name_or_phone: e })
+    // pageNum.current.page = 1
+    // setOrderData(() => ({ list: [], total: 0 }))
+    // setSearchField((val) => ({ ...val, name: e, size: 10 }))
+  }, [])
+
   const [shoppingCartData, setShoppingCartData] = useState<{ list: ShoppingCartData[]; total: number }>({ list: [], total: 0 })
 
   //数据加载状态
@@ -102,7 +97,57 @@ const ShoppingCartContainer:FC<InternalContainer> = (props) => {
     setShoppingCartData({ list: state.data, total: state.data.length })
   }, [state])
 
-  
+  // 结算
+  const handleSettleAccount = () => {
+    const targetGoodsKind = colorStore?.[currentCheckedPurchaserId]?.['goodsKind']
+    if (!targetGoodsKind) return
+    goLink('/pages/submitOrder/index', {
+      purchaser_id: currentCheckedPurchaserId,
+      sale_mode: currentCheckedSaleMode,
+      shopping_cart_product_color_list: Object.values(targetGoodsKind).map((item: Goods) => {
+        if (item.checked) {
+          return item.id
+        }
+      }),
+    })
+  }
+
+  const { fetchData: deleteApi } = ShoppingCartDeleteApi()
+
+  // TODO: 批量删除商品
+  const handleDelete = async () => {
+    const targetGoodsKind = colorStore?.[currentCheckedPurchaserId]?.['goodsKind']
+    if (targetGoodsKind && Object.values(targetGoodsKind).every((item: Goods) => !item.checked)) {
+      return Taro.showToast({ title: '请选择商品', icon: 'error' })
+    }
+    Taro.showModal({
+      title: '要取消这些商品吗？',
+      success: async function (res) {
+        if (res.confirm) {
+          const res = await deleteApi()
+          if (res.success) {
+            alert.success('取消成功')
+            fetchData()
+          } else {
+            alert.none(res.msg)
+          }
+        }
+      },
+    })
+  }
+  // 全选
+  const handleSelectAllCheckbox = (isSelectAll: boolean) => {
+    console.log('handleSelectAllCheckbox', isSelectAll)
+    const tempObject = colorStore
+    Object.entries(colorStore).forEach(([key,value])=>{
+      tempObject[key] = {
+        ...value,
+        checked: isSelectAll,
+      }
+    })
+    console.log(tempObject)
+    setColorStore(() => tempObject)
+  }
 
   return (
     <View className={classnames('flex-col', styles.shopping)} id='shoppingContainer'>
@@ -126,13 +171,13 @@ const ShoppingCartContainer:FC<InternalContainer> = (props) => {
               })}
           </InfiniteScroll>
         </View>
-        <View id='bottomBar'>
+      </View>
-          {isManageStatus ? (
+      <View id='bottomBar'>
-            <BottomEditBar onDelete={handleDelete} onSelectCheckbox={handleSelectAllCheckbox}></BottomEditBar>
+        {isManageStatus ? (
-          ) : (
+          <BottomEditBar onDelete={handleDelete} onSelectCheckbox={(isAll) => handleSelectAllCheckbox(isAll)}></BottomEditBar>
-            <BottomSettleBar onSettleAccount={handleSettleAccount} amount={selectedAmount}></BottomSettleBar>
+        ) : (
-          )}
+          <BottomSettleBar onSettleAccount={handleSettleAccount} amount={selectedAmount}></BottomSettleBar>
-        </View>
+        )}
       </View>
     </View>
   )