!108 【功能完善】商城: 积分商城

Merge pull request !108 from puhui999/master

pages/activity/point/list.vue

@@ -1,18 +1,6 @@
 <!-- 积分商城：商品列表  -->
 <template>
   <s-layout title="积分商城" navbar="normal" :leftWidth="0" :rightWidth="0">
-    <!-- 筛选 -->
-    <su-sticky bgColor="#fff">
-      <view class="ss-flex">
-        <view class="ss-flex-1">
-
-        </view>
-        <view class="list-icon" @tap="iconStatus = !iconStatus">
-          <text v-if="iconStatus" class="sicon-goods-list" />
-          <text v-else class="sicon-goods-card" />
-        </view>
-      </view>
-    </su-sticky>
     <scroll-view
       class="scroll-box"
       :style="{ height: pageHeight + 'rpx' }"
@@ -20,7 +8,7 @@
       :scroll-with-animation="false"
       :enable-back-to-top="true"
     >
-      <s-point-card ref="sPointCardRef" :property="sPointCardData" class="ss-p-x-20 ss-m-t-20"/>
+      <s-point-card ref="sPointCardRef" class="ss-p-x-20 ss-m-t-20"/>
       <s-empty
         v-if="activityTotal === 0"
         icon="/static/goods-empty.png"
@@ -40,7 +28,7 @@
 <script setup>
   import sheep from '@/sheep';
   import { onLoad, onReachBottom } from '@dcloudio/uni-app';
-  import { computed, reactive, ref } from 'vue';
+  import { reactive, ref } from 'vue';
   import PointApi from '@/sheep/api/promotion/point';
   import SLayout from '@/sheep/components/s-layout/s-layout.vue';
 
@@ -50,32 +38,7 @@
   const pageHeight =
     (safeArea.height + safeAreaInsets.bottom) * 2 + statusBarHeight - sheep.$platform.navbar - 350;
 
-  const sPointCardData = ref({
-    'layoutType': 'twoCol',
-  });
-  // 布局类型
-  const LayoutTypeEnum = {
-    // 单列大图
-    ONE_COL_BIG_IMG: 'oneColBigImg',
-    // 双列
-    TWO_COL: 'twoCol',
-  };
   const sPointCardRef = ref();
-  // true - 单列布局；false - 双列布局
-  const iconStatus = computed({
-    get() {
-      return sPointCardData.value.layoutType === LayoutTypeEnum.ONE_COL_BIG_IMG;
-    },
-    set(newValue) {
-      newValue ? (sPointCardData.value.layoutType = LayoutTypeEnum.ONE_COL_BIG_IMG) :
-        (sPointCardData.value.layoutType = LayoutTypeEnum.TWO_COL);
-      // 只有双列布局时需要
-      if (sPointCardData.value.layoutType === LayoutTypeEnum.TWO_COL) {
-        // 分列
-        sPointCardRef.value.calculateGoodsColumn();
-      }
-    },
-  });
   // 查询活动列表
   const activityPageParams = reactive({
     pageNo: 1, // 页码

pages/goods/point.vue

@@ -31,15 +31,14 @@
         <view class="title-card detail-card ss-p-y-40 ss-p-x-20">
           <view class="ss-flex ss-row-between ss-col-center ss-m-b-18">
             <view class="price-box ss-flex ss-col-bottom">
-              <view v-if="getShowPrice.price > 0" class="price-text"> ￥{{ getShowPrice.price }}</view>
-              <text v-if="getShowPrice.price > 0 && getShowPrice.point > 0">+</text>
               <image
                 :src="sheep.$url.static('/static/img/shop/goods/score1.svg')"
                 class="point-img"
               ></image>
-              <view class="point-text ss-m-r-16">
+              <text class="point-text ss-m-r-16">
                 {{ getShowPrice.point }}
-              </view>
+                {{ !getShowPrice.price || getShowPrice.price === 0 ? '' : `+￥${getShowPrice.price}` }}
+              </text>
             </view>
             <view class="sales-text">
               {{ formatExchange(state.goodsInfo.sales_show_type, state.goodsInfo.sales) }}
@@ -95,8 +94,15 @@
             "
             :disabled="state.goodsInfo.stock === 0"
           >
-            <view class="price-text">
+            <view class="price-box ss-flex">
-              {{ getShowPriceText }}
+              <image
+                :src="sheep.$url.static('/static/img/shop/goods/score1.svg')"
+                style="width: 36rpx;height: 36rpx;margin: 0 4rpx;"
+              ></image>
+              <text class="point-text ss-m-r-16">
+                {{ getShowPrice.point }}
+                {{ !getShowPrice.price || getShowPrice.price === 0 ? '' : `+￥${getShowPrice.price}` }}
+              </text>
             </view>
             <view v-if="state.goodsInfo.stock === 0">已售罄</view>
             <view v-else>立即兑换</view>
@@ -203,6 +209,15 @@
     };
   });
 
+  const getShowPriceText = computed(() => {
+    let priceText = `￥${fen2yuan(state.goodsInfo.price)}`;
+    if (!isEmpty(state.selectedSku)) {
+      const sku = state.selectedSku;
+      priceText = `${sku.point}${!sku.pointPrice ? '' : `+￥${fen2yuan(sku.pointPrice)}`}`;
+    }
+    return priceText;
+  });
+
   // 查询活动
   const getActivity = async (id) => {
     const { data } = await PointApi.getPointActivity(id);
@@ -277,6 +292,7 @@
         height: 36rpx;
         margin: 0 4rpx;
       }
+
       .point-text {
         font-size: 42rpx;
         font-weight: 500;
@@ -284,6 +300,7 @@
         line-height: 36rpx;
         font-family: OPPOSANS;
       }
+
       .price-text {
         font-size: 42rpx;
         font-weight: 500;
@@ -292,6 +309,7 @@
         font-family: OPPOSANS;
       }
     }
+
     .origin-price-text {
       font-size: 26rpx;
       font-weight: 400;

pages/order/confirm.vue

@@ -40,25 +40,37 @@
             </text>
           </view>
         </view>
+        <view v-if="state.orderPayload.pointActivityId" class="order-item ss-flex ss-col-center ss-row-between">
+          <view class="item-title">兑换积分</view>
+          <view class="ss-flex ss-col-center">
+            <image
+              :src="sheep.$url.static('/static/img/shop/goods/score1.svg')"
+              class="score-img"
+            />
+            <text class="item-value ss-m-r-24">
+              {{ state.orderInfo.usePoint }}
+            </text>
+          </view>
+        </view>
         <view
           class="order-item ss-flex ss-col-center ss-row-between"
-          v-if="state.orderInfo.type === 0"
+          v-if="state.orderInfo.type === 0 || state.orderPayload.pointActivityId"
         >
           <view class="item-title">积分抵扣</view>
           <view class="ss-flex ss-col-center">
-            {{ state.pointStatus ? '剩余积分' : '当前积分' }}
+            {{ state.pointStatus || state.orderPayload.pointActivityId ? '剩余积分' : '当前积分' }}
             <image
               :src="sheep.$url.static('/static/img/shop/goods/score1.svg')"
               class="score-img"
             />
             <text class="item-value ss-m-r-24">
               {{
-                state.pointStatus
+                state.pointStatus || state.orderPayload.pointActivityId
                   ? state.orderInfo.totalPoint - state.orderInfo.usePoint
                   : state.orderInfo.totalPoint || 0
               }}
             </text>
-            <checkbox-group @change="changeIntegral">
+            <checkbox-group @change="changeIntegral" v-if="!state.orderPayload.pointActivityId">
               <checkbox
                 :checked="state.pointStatus"
                 :disabled="!state.orderInfo.totalPoint || state.orderInfo.totalPoint <= 0"
@@ -331,7 +343,7 @@
       return;
     }
     state.orderInfo = data;
-    state.couponInfo = data.coupons;
+    state.couponInfo = data.coupons || [];
     // 设置收货地址
     if (state.orderInfo.address) {
       addressState.value.addressInfo = state.orderInfo.address;

sheep/api/trade/order.js

@@ -32,6 +32,9 @@ const OrderApi = {
     if (!(data.seckillActivityId > 0)) {
       delete data2.seckillActivityId;
     }
+    if (!(data.pointActivityId > 0)) {
+      delete data2.pointActivityId;
+    }
     // 解决 SpringMVC 接受 List<Item> 参数的问题
     delete data2.items;
     for (let i = 0; i < data.items.length; i++) {

sheep/components/s-goods-column/s-goods-column.vue

@@ -47,7 +47,7 @@
             ></image>
             <text class="point-text ss-m-r-16">
               {{ data.point }}
-              {{ !data.pointPrice || data.pointPrice === 0 ? '' : `+${fen2yuan(data.pointPrice)}元` }}
+              {{ !data.pointPrice || data.pointPrice === 0 ? '' : `+${priceUnit}${fen2yuan(data.pointPrice)}` }}
             </text>
           </view>
           <template v-else>
@@ -107,7 +107,7 @@
             ></image>
             <text class="point-text ss-m-r-16">
               {{ data.point }}
-              {{ !data.pointPrice || data.pointPrice === 0 ? '' : `+${fen2yuan(data.pointPrice)}元` }}
+              {{ !data.pointPrice || data.pointPrice === 0 ? '' : `+${priceUnit}${fen2yuan(data.pointPrice)}` }}
             </text>
           </view>
           <template v-else>
@@ -181,7 +181,7 @@
               ></image>
               <text class="point-text ss-m-r-16">
                 {{ data.point }}
-                {{ !data.pointPrice || data.pointPrice === 0 ? '' : `+${fen2yuan(data.pointPrice)}元` }}
+                {{ !data.pointPrice || data.pointPrice === 0 ? '' : `+${priceUnit}${fen2yuan(data.pointPrice)}` }}
               </text>
             </view>
             <template v-else>
@@ -282,7 +282,7 @@
                 ></image>
                 <text class="point-text ss-m-r-16">
                   {{ data.point }}
-                  {{ !data.pointPrice || data.pointPrice === 0 ? '' : `+${fen2yuan(data.pointPrice)}元` }}
+                  {{ !data.pointPrice || data.pointPrice === 0 ? '' : `+${priceUnit}${fen2yuan(data.pointPrice)}` }}
                 </text>
               </view>
               <template v-else>
@@ -376,7 +376,7 @@
                 ></image>
                 <text class="ss-m-r-16">
                   {{ data.point }}
-                  {{ !data.pointPrice || data.pointPrice === 0 ? '' : `+${fen2yuan(data.pointPrice)}元` }}
+                  {{ !data.pointPrice || data.pointPrice === 0 ? '' : `+${priceUnit}${fen2yuan(data.pointPrice)}` }}
                 </text>
               </view>
               <template v-else>

sheep/components/s-select-seckill-sku/s-select-seckill-sku.vue

@@ -19,8 +19,16 @@
           <view class="goods-title ss-line-2">{{ state.goodsInfo.name }}</view>
           <view class="header-right-bottom ss-flex ss-col-center ss-row-between">
             <!-- 价格 -->
-            <view v-if="state.goodsInfo.activity_type === PromotionActivityTypeEnum.POINT.type" class="price-text">
+            <view v-if="state.goodsInfo.activity_type === PromotionActivityTypeEnum.POINT.type"
-              {{ getShowPriceText }}
+                  class="price-text ss-flex">
+              <image
+                v-if="!isEmpty(state.selectedSku)"
+                :src="sheep.$url.static('/static/img/shop/goods/score1.svg')"
+                class="point-img"
+              ></image>
+              <text class="point-text ss-m-r-16">
+                {{ getShowPriceText }}
+              </text>
             </view>
             <view v-else class="price-text">
               ￥{{ fen2yuan(state.selectedSku.price || state.goodsInfo.price) }}
@@ -124,7 +132,7 @@
     let priceText = `￥${fen2yuan(state.goodsInfo.price)}`;
     if (!isEmpty(state.selectedSku)) {
       const sku = state.selectedSku;
-      priceText = `${sku.point}积分${!sku.pointPrice ? '' : `+￥${fen2yuan(sku.pointPrice)}`}`;
+      priceText = `${sku.point}${!sku.pointPrice ? '' : `+￥${fen2yuan(sku.pointPrice)}`}`;
     }
     return priceText;
   });
@@ -320,6 +328,12 @@
     }
   }
 
+  .point-img {
+    width: 36rpx;
+    height: 36rpx;
+    margin: 0 4rpx;
+  }
+
   .ss-modal-box {
     border-radius: 30rpx 30rpx 0 0;
     max-height: 1000rpx;