소스 검색

```
feat(mibiShop): 微币商城商品列表增加会员价格显示和动画效果

- 为商品列表项添加 list_item_animation 类名以支持动画效果
- 根据用户会员类型显示不同的价格信息:
- 会员用户显示折扣价格和原价格的删除线对比
- 普通用户显示原价格
- 价格显示逻辑区分会员等级(1或2)和其他用户类型
```

zhangningning 1 개월 전
부모
커밋
5db2398e65
1개의 변경된 파일8개의 추가작업 그리고 2개의 파일을 삭제
  1. 8 2
      src/pages/mibiShop/mibiShop.vue

+ 8 - 2
src/pages/mibiShop/mibiShop.vue

@@ -2,7 +2,7 @@
   <div class="mibiShop container-height">
     <Breadcrumb />
     <div class="list">
-      <div class="list_item bg_color_fff border_radius_16 box_shadow_card"
+      <div class="list_item bg_color_fff border_radius_16 box_shadow_card list_item_animation"
       v-for="item in list" :key="item"
       >
         <img :src="item.imageUrl" alt="" style="width: 291.2px; height: 291.2px;border-radius: 16px 16px 0 0;" class="bg_color_f5">
@@ -11,7 +11,13 @@
             {{item.itemName}}
           </div>
           <div class="flex-center-between">
-            <div class="bold color_price font_size20">{{item.points}}{{$t('common.mibi')}}</div>
+            <div v-if="appStore.userInfo?.memberType==1 || appStore.userInfo?.memberType==2">
+              <div class="font_size20">
+                <span class="bold color_price "> {{item.discountPoints}} {{$t('common.mibi')}}</span>
+                <span class="line_through gray999 mr10 ml10 font_size14">({{item.points}}){{$t('common.mibi')}}</span>
+              </div>
+            </div>
+            <div class="bold color_price font_size20" v-else>{{item.points}}{{$t('common.mibi')}}</div>
             <div class="border_radius_4 lijiduihuan  color_fff gradient font_size14 flex-center mt10"
              @click="confirmBuy({
                 callback:initList,