优化

src/views/home/components/goods.vue

@@ -3,7 +3,7 @@
     <div class="header">
         <div class="menus">
             <div class="item" :class="{ active: categorysActive == index }" v-for="(item, index) in categorys"
-                :key="item.id" @click="categorysActive = index">
+                :key="item.id" @click="changeCategory(item, index)">
                 <el-text>{{ item.name }}</el-text>
             </div>
         </div>
@@ -20,7 +20,7 @@
         <el-button :icon="shopListType == 'text' ? 'PictureRounded' : 'PriceTag'" @click="changeShopListType"></el-button>
     </div>
     <div class="shop_list" :class="{ img: shopListType == 'img' }">
-        <div class="item_wrap" v-for="item in shopList" :key="item.id" @click="showSkuHandle">
+        <div class="item_wrap" v-for="item in goodsList" :key="item.id" @click="showSkuHandle(item)">
             <div class="item">
                 <div class="dot">2</div>
                 <div class="cover" v-if="shopListType == 'img'">
@@ -48,18 +48,23 @@ const store = useUser();
 
 const skuModalRef = ref(null)
 
-const shopListType = ref('text')
+const shopListType = ref('img')
 
 const categorys = ref([])
 const categorysActive = ref(0)
 
 const commdityName = ref('')
 
-const shopList = ref([])
+const originalGoods = ref([])
+const goodsList = ref([])
 
 // 显示sku
-function showSkuHandle() {
-    skuModalRef.value.show()
+function showSkuHandle(item) {
+    if (item.typeEnum == 'sku') {
+        skuModalRef.value.show(item)
+    } else {
+
+    }
 }
 
 // 切换商品显示模式
@@ -71,6 +76,13 @@ function changeShopListType() {
     }
 }
 
+// 切换分类
+function changeCategory(item, index) {
+    categorysActive.value = index
+    // goodsList.value = originalGoods.value.find(val => val.id == item.categoryId)
+    console.log(originalGoods.value.find(val => val.id == item.categoryId))
+}
+
 // 查询分类信息
 async function queryCategoryAjax() {
     try {
@@ -99,7 +111,8 @@ async function productqueryCommodityInfoAjax() {
             page: 1,
             pageSize: 1000
         })
-        shopList.value = res
+        originalGoods.value = res
+        goodsList.value = res
     } catch (error) {
         console.log(error)
     }