refactor(product-container): 重构商品容器组件并添加文档注释

重构商品过滤逻辑，将过滤函数改为计算属性
为所有方法添加详细的JSDoc注释
修复商品列表项的key使用cellId替代id

src/pages/index/components/product-container.vue

@@ -40,43 +40,68 @@ const showCartPopup = ref<boolean>(false)
 
 const searchQuery = ref<string>('')
 
-// 点击分类导航
+/**
+ * 处理分类导航点击事件
+ * @param index - 被点击的分类索引
+ */
 function handleCategoryClick(index: number) {
   activeCategory.value = index
 }
 
-// 打开商品详情弹窗
+/**
+ * 打开商品详情弹窗
+ * @param productId - 要显示详情的商品ID
+ */
 function showProductDetail(productId: number) {
   currentProductId.value = productId
   showDetailPopup.value = true
 }
 
+/**
+ * 处理添加商品到购物车
+ * @param product - 要添加到购物车的商品对象
+ */
 function handleAddToCart(product: any) {
   cartStore.addToCart(product)
 }
 
+/**
+ * 处理从购物车移除商品
+ * @param cellId - 要移除的商品格子ID
+ */
 function handleRemoveFromCart(cellId: number) {
   cartStore.removeFromCart(cellId)
 }
 
+/**
+ * 获取购物车中指定商品的数量
+ * @param cellId - 商品的格子ID
+ * @returns 购物车中该商品的数量，如果没有则返回0
+ */
 function getCartItemCount(cellId: number) {
   const item = cartItems.value.find(item => item.product.cellId === cellId)
   return item ? item.quantity : 0
 }
 
-function filterProductsByName(products: any[], query: string) {
+/**
-  if (!query) return products
+ * 计算当前显示的商品列表
-  return products.filter(p =>
+ * 根据选中的分类和搜索查询条件过滤商品
-    p.name.toLowerCase().includes(query.toLowerCase())
+ */
-  )
-}
-
 const currentProducts = computed(() => {
-  const filteredByCategory = categories.value.filter(c => c.label === labels.value[activeCategory.value]?.id)
+  // 先按分类过滤
-  return filterProductsByName(filteredByCategory, searchQuery.value)
+  const filteredByCategory = categories.value.filter(c => c.label === labels.value[activeCategory.value]?.id);
+  
+  // 再按搜索查询过滤
+  if (!searchQuery.value) return filteredByCategory;
+  return filteredByCategory.filter(p =>
+    p.name.toLowerCase().includes(searchQuery.value.trim().toLowerCase())
+  );
 })
 
-// 结算方法
+/**
+ * 处理结算操作
+ * 触发checkout事件，通知父组件进行结算
+ */
 function handleCheckout() {
   emit('checkout')
 }
@@ -109,7 +134,7 @@ function handleCheckout() {
       </view>
 
       <view class="category-section">
-        <view v-for="product in currentProducts" :key="product.id" class="product-item">
+        <view v-for="product in currentProducts" :key="product.cellId" class="product-item">
           <view class="product-content">
             <view class="product-image-wrapper" @click.stop="showProductDetail(product.id)">
               <wd-img