继续完善

2026-01-30 17:29:02 +08:00
parent ab038ec029
commit d57592ca7d
14 changed files with 8003 additions and 407 deletions
--- a/pages/mall/consumer/cart.uvue
+++ b/pages/mall/consumer/cart.uvue
@@ -168,6 +168,7 @@
 <script setup lang="uts">
 import { ref, computed, onMounted } from 'vue'
 import { onShow } from '@dcloudio/uni-app'
+import { supabaseService, type CartItem as SupabaseCartItem } from '@/utils/supabaseService.uts'

 // 响应式数据
 const cartItems = ref<any[]>([])
@@ -269,6 +270,12 @@ const totalPrice = computed(() => {
 		.toFixed(2)
 })

+// 检查店铺是否全选
+const isShopSelected = (shopId: string) => {
+	const group = cartGroups.value.find(g => g.shopId === shopId)
+	return group ? group.items.every(item => item.selected) : false
+}
+
 const toggleManageMode = () => {
 	isManageMode.value = !isManageMode.value
 }
@@ -289,48 +296,68 @@ onShow(() => {
 })

 // 加载数据
-const loadCartData = () => {
+const loadCartData = async () => {
 	loading.value = true
 	
-	// 从本地存储加载购物车数据
-	const cartData = uni.getStorageSync('cart')
-	if (cartData) {
-		try {
-			cartItems.value = JSON.parse(cartData as string) as any[]
-		} catch (e) {
-			console.error('解析购物车数据失败', e)
-			cartItems.value = []
-		}
-	} else {
-		// 如果本地没有数据，使用Mock数据（可选，或者直接为空）
-		// 为了演示效果，这里可以保留一部分Mock数据，或者初始化为空
-		// cartItems.value = [...mockCartItems]
-		cartItems.value = [] 
-	}
-	
-	setTimeout(() => {
-		// 模拟推荐商品加载
+	try {
+		// 从Supabase加载购物车数据
+		const supabaseCartItems = await supabaseService.getCartItems()
+		
+		// 转换数据格式以匹配前端界面
+		const transformedItems = supabaseCartItems.map((item: SupabaseCartItem) => ({
+			id: item.id,
+			shopId: item.shop_id || 'unknown_shop',
+			shopName: item.shop_name || '未知店铺',
+			name: item.product_name || '商品',
+			price: item.product_price || 0,
+			image: item.product_image || '/static/product1.jpg',
+			spec: item.product_specification || '默认规格',
+			quantity: item.quantity || 1,
+			selected: item.selected || false,
+			productId: item.product_id // 保留productId用于后续操作
+		}))
+		
+		cartItems.value = transformedItems
+		
+		// 加载推荐商品（暂时保持Mock数据）
 		recommendProducts.value = [...mockRecommendProducts]
+	} catch (error) {
+		console.error('加载购物车数据失败:', error)
+		// 如果API调用失败，尝试从本地存储加载
+		const cartData = uni.getStorageSync('cart')
+		if (cartData) {
+			try {
+				cartItems.value = JSON.parse(cartData as string) as any[]
+			} catch (e) {
+				console.error('解析购物车数据失败', e)
+				cartItems.value = []
+			}
+		}
+	} finally {
 		loading.value = false
-	}, 500)
+	}
 }

-// 监听购物车数据变化并保存到本地存储
-const saveCartData = () => {
-	uni.setStorageSync('cart', JSON.stringify(cartItems.value))
-}
-
-// 商品操作 - 增加保存逻辑
-const toggleSelect = (itemId: string) => {
+// 商品操作 - 更新选中状态到Supabase
+const toggleSelect = async (itemId: string) => {
 	const index = cartItems.value.findIndex(item => item.id === itemId)
 	if (index !== -1) {
-		cartItems.value[index].selected = !cartItems.value[index].selected
+		const newSelected = !cartItems.value[index].selected
+		cartItems.value[index].selected = newSelected
 		cartItems.value = [...cartItems.value] // 触发响应式更新
-		saveCartData()
+		
+		// 更新到Supabase
+		const success = await supabaseService.updateCartItemSelection(itemId, newSelected)
+		if (!success) {
+			console.error('更新选中状态失败')
+			// 恢复状态
+			cartItems.value[index].selected = !newSelected
+			cartItems.value = [...cartItems.value]
+		}
 	}
 }

-const toggleShopSelect = (shopId: string) => {
+const toggleShopSelect = async (shopId: string) => {
 	const group = cartGroups.value.find((g: any) => g.shopId === shopId)
 	if (!group) return
 	
@@ -338,56 +365,110 @@ const toggleShopSelect = (shopId: string) => {
 	const isAllShopSelected = (group.items as any[]).every((item: any) => item.selected)
 	const newState = !isAllShopSelected
 	
-	// 更新该店铺下所有商品的状态
-	cartItems.value.forEach(item => {
-		if (item.shopId === shopId) {
-			item.selected = newState
-		}
-	})
-	cartItems.value = [...cartItems.value]
-	saveCartData()
-}
-
-const toggleSelectAll = () => {
-	const newSelectedState = !allSelected.value
-	cartItems.value = cartItems.value.map(item => ({
-		...item,
-		selected: newSelectedState
-	}))
-	saveCartData()
-}
-
-const increaseQuantity = (itemId: string) => {
-	const index = cartItems.value.findIndex(item => item.id === itemId)
-	if (index !== -1) {
-		cartItems.value[index].quantity++
+	// 获取该店铺下所有商品的ID
+	const shopItemIds = cartItems.value
+		.filter(item => item.shopId === shopId)
+		.map(item => item.id)
+	
+	// 批量更新到Supabase
+	const success = await supabaseService.batchUpdateCartItemSelection(shopItemIds, newState)
+	
+	if (success) {
+		// 更新本地状态
+		cartItems.value.forEach(item => {
+			if (item.shopId === shopId) {
+				item.selected = newState
+			}
+		})
 		cartItems.value = [...cartItems.value]
-		saveCartData()
+	} else {
+		console.error('批量更新店铺商品选中状态失败')
+		uni.showToast({
+			title: '操作失败',
+			icon: 'none'
+		})
 	}
 }

-const decreaseQuantity = (itemId: string) => {
+const toggleSelectAll = async () => {
+	const newSelectedState = !allSelected.value
+	const selectedItems = cartItems.value.map(item => ({
+		...item,
+		selected: newSelectedState
+	}))
+	
+	// 更新到Supabase
+	const itemIds = cartItems.value.map(item => item.id)
+	const success = await supabaseService.batchUpdateCartItemSelection(itemIds, newSelectedState)
+	
+	if (success) {
+		cartItems.value = selectedItems
+	} else {
+		console.error('批量更新选中状态失败')
+		uni.showToast({
+			title: '操作失败',
+			icon: 'none'
+		})
+	}
+}
+
+const increaseQuantity = async (itemId: string) => {
+	const index = cartItems.value.findIndex(item => item.id === itemId)
+	if (index !== -1) {
+		const newQuantity = cartItems.value[index].quantity + 1
+		cartItems.value[index].quantity = newQuantity
+		cartItems.value = [...cartItems.value]
+		
+		// 更新到Supabase
+		const success = await supabaseService.updateCartItemQuantity(itemId, newQuantity)
+		if (!success) {
+			console.error('更新商品数量失败')
+			// 恢复状态
+			cartItems.value[index].quantity = newQuantity - 1
+			cartItems.value = [...cartItems.value]
+		}
+	}
+}
+
+const decreaseQuantity = async (itemId: string) => {
 	const index = cartItems.value.findIndex(item => item.id === itemId)
 	if (index !== -1) {
 		if (cartItems.value[index].quantity > 1) {
-			cartItems.value[index].quantity--
+			const newQuantity = cartItems.value[index].quantity - 1
+			cartItems.value[index].quantity = newQuantity
 			cartItems.value = [...cartItems.value]
-			saveCartData()
+			
+			// 更新到Supabase
+			const success = await supabaseService.updateCartItemQuantity(itemId, newQuantity)
+			if (!success) {
+				console.error('更新商品数量失败')
+				// 恢复状态
+				cartItems.value[index].quantity = newQuantity + 1
+				cartItems.value = [...cartItems.value]
+			}
 		} else {
 			// 数量为1时，询问是否删除
 			uni.showModal({
 				title: '提示',
 				content: '确定要从购物车移除该商品吗？',
-				success: (res) => {
+				success: async (res) => {
 					if (res.confirm) {
-						cartItems.value.splice(index, 1)
-						cartItems.value = [...cartItems.value]
-						saveCartData()
-						
-						uni.showToast({
-							title: '已移除',
-							icon: 'none'
-						})
+						// 从Supabase删除
+						const success = await supabaseService.deleteCartItem(itemId)
+						if (success) {
+							cartItems.value.splice(index, 1)
+							cartItems.value = [...cartItems.value]
+							uni.showToast({
+								title: '已移除',
+								icon: 'none'
+							})
+						} else {
+							console.error('删除商品失败')
+							uni.showToast({
+								title: '删除失败',
+								icon: 'none'
+							})
+						}
 					}
 				}
 			})
@@ -396,7 +477,7 @@ const decreaseQuantity = (itemId: string) => {
 }

 // 删除商品 - 增加保存逻辑
-const deleteSelectedItems = () => {
+const deleteSelectedItems = async () => {
 	if (selectedCount.value === 0) {
 		uni.showToast({
 			title: '请选择要删除的商品',
@@ -408,19 +489,35 @@ const deleteSelectedItems = () => {
 	uni.showModal({
 		title: '提示',
 		content: `确定要删除选中的 ${selectedCount.value} 件商品吗？`,
-		success: (res) => {
+		success: async (res) => {
 			if (res.confirm) {
-				cartItems.value = cartItems.value.filter(item => !item.selected)
-				saveCartData()
+				// 获取选中的商品ID
+				const selectedItemIds = cartItems.value
+					.filter(item => item.selected)
+					.map(item => item.id)
 				
-				// 如果购物车删空了，退出管理模式
-				if (cartItems.value.length === 0) {
-					isManageMode.value = false
+				// 批量删除到Supabase
+				const success = await supabaseService.batchDeleteCartItems(selectedItemIds)
+				
+				if (success) {
+					// 从本地列表移除
+					cartItems.value = cartItems.value.filter(item => !item.selected)
+					
+					// 如果购物车删空了，退出管理模式
+					if (cartItems.value.length === 0) {
+						isManageMode.value = false
+					}
+					uni.showToast({
+						title: '删除成功',
+						icon: 'success'
+					})
+				} else {
+					console.error('批量删除商品失败')
+					uni.showToast({
+						title: '删除失败',
+						icon: 'none'
+					})
 				}
-				uni.showToast({
-					title: '删除成功',
-					icon: 'success'
-				})
 			}
 		}
 	})
@@ -506,9 +603,6 @@ const goToCheckout = () => {
 		return
 	}
 	
-	// 确保最新状态已保存到本地存储
-	saveCartData()
-	
 	// 获取选中的商品 (直接过滤cartItems，不依赖cartGroups)
 	const selectedItems = cartItems.value
 		.filter(item => item.selected)