1

src/views/cart/index.tsx

@@ -1,12 +1,13 @@
 import { defineComponent, ref } from 'vue'
 import ColHeader from '@/components/col-header'
 import styles from './index.module.less'
-import { Checkbox, SubmitBar, Card, Stepper, CheckboxGroup, Dialog, Toast } from 'vant'
+import { Checkbox, SubmitBar, Card, Stepper, CheckboxGroup, Dialog, Toast, Image } from 'vant'
 import request from '@/helpers/request'
 import { cartConfirm, formateAttr } from './cart'
 import ColResult from '@/components/col-result'
 import { moneyFormat } from '@/helpers/utils'
 import { postMessage } from '@/helpers/native-message'
+import iconSellOut from '../shop-mall/images/icon-sell-out.png'
 
 export default defineComponent({
   name: 'cart',
@@ -50,7 +51,7 @@ export default defineComponent({
         if (code === 200){
           this.cartList = data.map(n => {
             n.stock = n.stock - n.lockStock
-            n.stock = n.stock <= 0 ? 1 : n.stock
+            n.stock = n.stock <= 0 ? 0 : n.stock
             return n
           })
         }
@@ -173,7 +174,7 @@ export default defineComponent({
                 <CheckboxGroup v-model={this.selectItems}>
                   {this.cartList.map((item: any) => (
                     <div class={styles.cartItem}>
-                      <Checkbox name={item.id}>
+                      <Checkbox name={item.id} disabled={item.stock <= 0}>
                         <Card
                           price={moneyFormat(item.price)}
                           desc={formateAttr(item.productAttr)}
@@ -197,6 +198,20 @@ export default defineComponent({
                                 max={item.stock}
                                 integer
                               />
+                            ),
+                            thumb: () => (
+                              <div>
+                                <Image src={item.productPic}></Image>
+                                {item.stock <= 0 && (
+                                  <div class={styles.sellOut}>
+                                    <Image
+                                      src={iconSellOut}
+                                      fit="cover"
+                                      class={styles.sellOutImg}
+                                    />
+                                  </div>
+                                )}
+                              </div>
                             )
                           }}
                         ></Card>