fashion-ssr-vue3/pages/cart/useCart.ts

import { changeQuantityApi, getCartListApi, removeCartApi, submitOrderApi } from '~/api/model/cart'
import { numberToTwoDecimals } from '~/utils/number'

const brandCount = ref(0)
const selectedCount = ref(0)
const orderTotal = ref(0)
const checkAll = ref(false)
const isIndeterminate = ref(false)
const submitLoading = ref(false)
const checkedCart = ref<any>([])
const checkedIds = ref<any>([])
const cartList = ref<any>([])

export function useCart() {
  /**
   * 计算当前id对应list
   * @param key
   */
  const calCheckedGoods = () => {
    const checkedList = cartList.value.filter((item: any) => checkedIds.value.includes(item.merchandiseId))
    const brandList = checkedList.map((item: any) => item.brandId)
    brandCount.value = [...new Set(brandList)].length
    selectedCount.value = checkedList.length
    let totalSum = 0
    checkedList.forEach((item: any) => {
      totalSum += item.price * item.quantity
    })
    orderTotal.value = +totalSum
  }
  /**
   * 全选
   * @param val
   */
  const handleCheckAllChange = (val: boolean) => {
    const allIds = cartList.value.map((item: any) => item.merchandiseId)
    checkedCart.value = val ? allIds : []
    checkedIds.value = val ? allIds : []
    isIndeterminate.value = false
    calCheckedGoods()
  }
  /**
   * 单个选择
   * @param value
   */
  const handleCheckedChange = (value: string[]) => {
    const checkedCount = value.length
    checkAll.value = checkedCount === cartList.value.length
    checkedIds.value = value
    checkedCart.value = value
    isIndeterminate.value = checkedCount > 0 && checkedCount < cartList.value.length
    calCheckedGoods()
  }

  const getCartList = async () => {
    try {
      const result: any = await getCartListApi()
      cartList.value = result
      // commonStore.setCartGoodsNumber(data.items.length)
    }
    catch (error) {
      console.log(error)
    }
  }
  const removeCart = async (item: any) => {
    try {
      await removeCartApi({ mid: item.merchandiseId })
      cartList.value = cartList.value.filter((items: any) => items.merchandiseId !== item.merchandiseId)
      const surplusChecked = checkedIds.value.filter((items: any) => items !== item.merchandiseId)
      ElMessage({
        message: 'remove cart successfully',
        type: 'success',
        plain: true,
      })
      handleCheckedChange(surplusChecked)
    }
    catch (error) {
      console.log(error)
    }
  }

  /**
   * 提交订单
   */
  const submitOrder = async () => {
    try {
      submitLoading.value = true
      await submitOrderApi({ mids: checkedIds.value })
      checkAll.value = false
      checkedIds.value = []
      checkedCart.value = []
      selectedCount.value = 0
      isIndeterminate.value = false
      ElMessage({
        message: 'Order Submitted Successfully',
        type: 'success',
        plain: true,
      })
      submitLoading.value = false
      const router = useRouter()
      router.push({ path: '/submit-order' })
    }
    catch (error) {
      console.log(error)
      submitLoading.value = false
    }
  }

  const handleChange = async (e: any, item: any) => {
    try {
      // const res: any = await changeQuantityApi({
      //   mid: item.merchandiseId,
      //   quantity: item.quantity,
      // })
      // item.price = res.price
      calCheckedGoods()
    }
    catch (error) {
      console.log(error)
    }
  }
  return {
    brandCount,
    selectedCount,
    checkAll,
    isIndeterminate,
    checkedCart,
    orderTotal,
    cartList,
    submitLoading,
    handleCheckAllChange,
    handleChange,
    getCartList,
    removeCart,
    handleCheckedChange,
    submitOrder,
  }
}