优化规格

src/components/leftMenu.vue

@@ -159,6 +159,11 @@ const menus = ref([
         justify-content: center;
         align-items: center;
         text-decoration: none;
+        /* 去除下划线 */
+        color: inherit;
+        /* 继承父元素的颜色 */
+        cursor: pointer;
+        /* 修改鼠标指针样式 */
 
         &:first-child {
             border-bottom: 1px solid #666;

src/components/payCard/scanModal.vue

@@ -107,14 +107,10 @@ async function submitHandle() {
 async function checkPayStauts() {
     try {
         const res = await queryOrder({ orderId: props.orderId })
-        loading.value = false
         if (res.status == 'closed') {
             emits('success')
-            scanModalRef.value.close()
         } else {
-            checkPayStatusLoading.value = false
             ElMessage.error(res.payRemark || '支付失败！')
-            scanModalRef.value.loading = false
         }
     } catch (error) {
         console.log(error)
@@ -254,7 +250,7 @@ defineExpose({
     .pay_wait {
         flex: 1;
         padding: 0 var(--el-font-size-base);
-        height: 600px;
+        height: 400px;
         padding-bottom: 100px;
         display: flex;
         flex-direction: column;

src/components/skuModal.vue

@@ -134,35 +134,41 @@ function show(item, t = 'shop') {
     goods.value = item
     type.value = t
     goods.value.selectSpec = JSON.parse(goods.value.selectSpec)
-    goods.value.selectSpec.map((item, index) => {
+    goods.value.selectSpec.map(item => {
+        let arr = []
+        item.selectSpecResult.map(val => {
+            switch (type.value) {
+                case 'shop':
+                    arr.push({
+                        active: false,
+                        name: val
+                    })
+                    break;
+                case 'cart':
+                    // 如果从购物车选择规格需要做选中效果
+                    const skus = goods.value.skuName.split(',')
+                    arr.push({
+                        active: !!skus.find(item => item === val),
+                        name: val
+                    })
+                    break;
+                default:
+                    break;
+            }
+        })
+        item.selectSpecResult = arr
+    })
+
+    let arr = []
+
+    goods.value.selectSpec.map(item => {
         if (item.selectSpecResult.length) {
-            let arr = []
-            item.selectSpecResult.map(val => {
-                switch (type.value) {
-                    case 'shop':
-                        arr.push({
-                            active: false,
-                            name: val
-                        })
-                        break;
-                    case 'cart':
-                        // 如果从购物车选择规格需要做选中效果
-                        const skus = goods.value.skuName.split(',')
-                        arr.push({
-                            active: !!skus.find(item => item === val),
-                            name: val
-                        })
-                        break;
-                    default:
-                        break;
-                }
-            })
-            item.selectSpecResult = arr
-        } else {
-            goods.value.selectSpec.splice(index, 1)
+            arr.push({ ...item })
         }
     })
-    console.log(goods.value)
+
+    goods.value.selectSpec = arr
+
     selectedSuccess()
 }
 

src/views/home/components/goods.vue

@@ -33,12 +33,12 @@
         <el-button :icon="shopListType == 'text' ? 'PictureRounded' : 'PriceTag'"
             @click="changeShopListType"></el-button>
     </div>
-    <div class="shop_list" :class="{ img: shopListType == 'img' }">
+    <div class="shop_list" :class="{ img: shopListType == 'img' }" v-loading="loading">
         <div class="item_wrap" v-for="item in goodsList" :key="item.id" @click="showSkuHandle(item)">
             <div class="item">
                 <div class="dot" v-if="item.orderCount">{{ item.orderCount }}</div>
                 <div class="cover" v-if="shopListType == 'img'">
-                    <el-image :src="item.coverImg" class="el_img" fit="cover"></el-image>
+                    <el-image :src="item.coverImg" class="el_img" fit="cover" lazy></el-image>
                 </div>
                 <div class="name"><el-text line-clamp="2">{{ item.name }}</el-text></div>
                 <div class="item_empty" v-if="shopListType == 'text'"></div>
@@ -78,12 +78,13 @@ const skuModalRef = ref(null)
 
 const shopListType = ref('img')
 
+const categoryId = ref('')
 const categorys = ref([])
 const categorysActive = ref(0)
 
 const commdityName = ref('')
 
-const originalGoods = ref([])
+const loading = ref(false)
 const goodsList = ref([])
 
 const showPopover = ref(false)
@@ -140,16 +141,8 @@ function changeShopListType() {
 function changeCategory(item, index) {
     showPopover.value = false
     categorysActive.value = index
-    if (item.id) {
-        goodsList.value = []
-        originalGoods.value.map(val => {
-            if (val.categoryId == item.id) {
-                goodsList.value.push(val)
-            }
-        })
-    } else {
-        goodsList.value = [...originalGoods.value]
-    }
+    categoryId.value = item.id
+    productqueryCommodityInfoAjax()
 }
 
 // 查询分类信息
@@ -173,17 +166,19 @@ async function queryCategoryAjax() {
 // 查询商品信息
 async function productqueryCommodityInfoAjax() {
     try {
+        loading.value = true
         const res = await productqueryCommodityInfo({
             shopId: store.userInfo.shopId,
-            categoryId: categorys.value[categorysActive.value].id,
+            categoryId: categoryId.value,
             commdityName: commdityName.value,
             page: 1,
             pageSize: 1000,
             masterId: props.masterId
         })
-        originalGoods.value = res
         goodsList.value = res
+        loading.value = false
     } catch (error) {
+        loading.value = false
         console.log(error)
     }
 }