【商品详情】

1. 接入优惠劵逻辑

api/promotion/coupon.js

@@ -0,0 +1,7 @@
+import request from "@/utils/request.js";
+
+export function takeCoupon(templateId) {
+  return request.post("app-api/promotion/coupon/take", {
+    templateId
+  });
+}

api/promotion/couponTemplate.js

@@ -0,0 +1,8 @@
+import request from "@/utils/request.js";
+
+export function getCouponTemplateList(spuId, useType) {
+  return request.get("app-api/promotion/coupon-template/list", {
+    spuId,
+    useType
+  });
+}

components/couponListWindow/index.vue

@@ -6,18 +6,20 @@
 				<view :class="['acea-row', 'row-middle', type === 2 ? 'on' : '']" @click="setType(2)">商品券</view>
 				<view :class="['acea-row', 'row-middle', type === 3 ? 'on' : '']" @click="setType(3)">品类券</view>
 			</view>
-			<!-- <view class="occupy" v-if="!orderShow"></view> -->
-			<!-- <view class='title'>优惠券<text class='iconfont icon-guanbi' @click='close'></text></view> -->
 			<view class='coupon-list' :style="{'margin-top':!orderShow?'0':'50rpx'}">
 				<block v-if="coupon.list.length">
-					<!-- <view class='item acea-row row-center-wrapper' v-for="(item,index) in coupon.list" :key='index'> -->
 					<view class='item acea-row row-center-wrapper' v-for="(item,index) in coupon.list"
-						@click="getCouponUser(index,item.id)" :key='index'>
+						@click="getCouponUser(index, item.id)" :key='index'>
-						<view class='money acea-row row-column row-center-wrapper' :class='item.isUse?"moneyGray":""'>
+            <!-- 金额 -->
-							<view>￥<text class='num'>{{item.money?Number(item.money):''}}</text></view>
+						<view class='money acea-row row-column row-center-wrapper' :class='item.takeStatus?"moneyGray":""'>
-							<view class="pic-num">满{{item.minPrice}}元可用</view>
+							<view>￥
+                <text v-if="item.discountType === 1" class='num'>{{ fen2yuan(item.discountPrice) }}</text>
+                <text v-else class='num'>{{ (item.discountPercent / 10.0).toFixed(1) }} 折</text>
+              </view>
+							<view class="pic-num">满 {{ fen2yuan(item.usePrice) }} 元可用</view>
 						</view>
 						<view class='text'>
+              <!-- 类型 -->
 							<view class='condition line2'>
 								<span class='line-title' :class='item.isUse?"gray":""' v-if='item.useType===1'>通用</span>
 								<span class='line-title' :class='item.isUse?"gray":""'
@@ -25,12 +27,13 @@
 								<span class='line-title' :class='item.isUse?"gray":""' v-else>商品</span>
 								<span>{{item.name}}</span>
 							</view>
+              <!-- 领取类型 -->
 							<view class='data acea-row row-between-wrapper'>
-								<view v-if="item.day>0">领取后{{item.day}}天内可用</view>
+								<view v-if="item.validityType > 1">领取后 {{ item.fixedEndTerm }} 天内可用</view>
 								<view v-else>
-									{{ item.useStartTimeStr&& item.useEndTimeStr ? item.useStartTimeStr + " - " + item.useEndTimeStr : ""}}
+									{{ formatDate(item.validStartTime) + " - " + formatDate(item.validEndTime) }}
 								</view>
-								<view class='bnt gray' v-if="item.isUse">{{item.use_title || '已领取'}}</view>
+								<view class='bnt gray' v-if="item.takeStatus">{{item.use_title || '已领取'}}</view>
 								<view class='bnt bg-color' v-else>{{coupon.statusTile || '立即领取'}}</view>
 							</view>
 						</view>
@@ -41,21 +44,19 @@
 					<image src='../../static/images/noCoupon.png'></image>
 				</view>
 			</view>
-			
 		</view>
-		<view class='mask' catchtouchmove="true" :hidden='coupon.coupon==false' @click='close'></view>
+		<view class='mask' catchtouchmove="true" :hidden='!coupon.coupon' @click='close'></view>
 	</view>
 </template>
 
 <script>
-	import {
+  import * as Util from '@/utils/util.js';
-		setCouponReceive
+  import dayjs from "@/plugin/dayjs/dayjs.min.js";
-	} from '@/api/api.js';
+  import * as CouponApi from '@/api/promotion/coupon.js';
-	export default {
+  export default {
 		props: {
-			//打开状态 0=领取优惠券,1=使用优惠券
 			openType: {
-				type: Number,
+				type: Number, // 打开状态 0=领取优惠券, 1=使用优惠券
 				default: 0,
 			},
 			coupon: {
@@ -64,9 +65,8 @@
 					return {};
 				}
 			},
-			//下单页面使用优惠券组件不展示tab切换页
 			orderShow: {
-				type: String,
+				type: String, // 下单页面使用优惠券组件不展示 tab 切换页
 				default: function() {
 					return '';
 				}
@@ -74,41 +74,45 @@
 		},
 		data() {
 			return {
-               type: 1
+        type: 1 // 使用类型
 			};
 		},
-
 		methods: {
 			close: function() {
 				this.type = 1
 				this.$emit('ChangCouponsClone');
 			},
 			getCouponUser: function(index, id) {
-				let that = this;
+        // 领取优惠劵时，如果已经领取，则直接跳过
-				let list = that.coupon.list;
+				let list = this.coupon.list;
-				if (list[index].isUse == true && this.openType == 0) return true;
+				if (list[index].takeStatus && this.openType === 0) {
+          return true;
+        }
 				switch (this.openType) {
-					case 0:
+					case 0: // 领取优惠券
-						//领取优惠券
+            CouponApi.takeCoupon(id).then(res => {
-						let ids = [];
+              this.$util.Tips({
-						ids.push(id);
-						setCouponReceive(id).then(res => {
-							that.$emit('ChangCouponsUseState', index);
-							that.$util.Tips({
 								title: "领取成功"
 							});
-							that.$emit('ChangCoupons', list[index]);
+              this.$emit('ChangCoupons', list[index]);
 						})
 						break;
-					case 1:
+					case 1: // 使用优惠劵
-						that.$emit('ChangCoupons', index);
+            this.$emit('ChangCoupons', index);
 						break;
 				}
 			},
 			setType: function(type) {
 				this.type = type;
 				this.$emit('tabCouponType', type);
-			}
+			},
+
+      fen2yuan(price) {
+        return Util.fen2yuan(price)
+      },
+      formatDate: function(date) {
+        return dayjs(date).format("YYYY-MM-DD");
+      }
 		}
 	}
 </script>

components/userEvaluation/index.vue

@@ -14,7 +14,11 @@
 							</view>
 							<view class="time">{{ formatDate(item.createTime) }}</view>
 						</view>
-						<view class="sku">规格：{{ item.sku?item.sku:'无' }}</view>
+						<view class="sku">规格：
+              <text v-for="(property, propertyIndex) in item.skuProperties" :key="propertyIndex" style="padding-right: 2px">
+                {{ property.valueName }}
+              </text>
+            </view>
 					</view>
 					<view class="evaluate-infor">{{ item.content }}</view>
 					<view class="imgList acea-row" v-if="item.picUrls && item.picUrls.length > 0">

pages/goods_details/index.vue

@@ -43,13 +43,15 @@
 									销量:{{ spu.salesCount}} {{ spu.unitName }}
 								</view>
 							</view>
-              <!-- 优惠劵 TODO 芋艿：待接入 -->
+              <!-- 优惠劵 -->
 							<view v-if="coupon.list.length > 0 && type==='normal'"
 								class='coupon acea-row row-between-wrapper' @click='couponTap'>
 								<view class='hide line1 acea-row'>
 									优惠券：
 									<view class='activity'>
-										满{{ coupon.list[0].minPrice }}减{{ coupon.list[0].money }}
+										满{{ fen2yuan(coupon.list[0].usePrice) }}
+                    <text v-if="coupon.list[0].discountType === 1"> 减 {{ fen2yuan(coupon.list[0].discountPrice) }} 元</text>
+                    <text v-else>打 {{ (coupon.list[0].discountPercent / 10.0).toFixed(1) }} 折</text>
                   </view>
 								</view>
 								<view class='iconfont icon-jiantou'></view>
@@ -228,9 +230,13 @@
       @close="closeAttr"
     />
 		<home></home>
-    <!-- 优惠劵弹窗 TODO 芋艿：待实现 -->
+    <!-- 优惠劵弹窗 -->
-		<couponListWindow :coupon='coupon' @ChangCouponsClone="ChangCouponsClone" @ChangCoupons="ChangCoupons"
+		<couponListWindow
-			@ChangCouponsUseState="ChangCouponsUseState" @tabCouponType="tabCouponType"></couponListWindow>
+      :coupon='coupon'
+      @ChangCouponsClone="ChangCouponsClone"
+      @ChangCoupons="ChangCoupons"
+      @tabCouponType="tabCouponType"
+    />
 		<!-- 分享按钮 -->
 		<view class="generate-posters acea-row row-middle" :class="posters ? 'on' : ''">
 			<!-- #ifndef MP -->
@@ -281,9 +287,6 @@
 		getProductGood
 	} from '@/api/store.js';
 	import { spread } from "@/api/user";
-	import {
-		getCoupons
-	} from '@/api/api.js';
 	import { toLogin } from '@/libs/login.js';
 	import { mapGetters } from "vuex";
 	import { imageBase64 } from "@/api/public";
@@ -297,13 +300,13 @@
   import * as ProductSpuApi from '@/api/product/spu.js';
   import * as ProductFavoriteApi from '@/api/product/favorite.js';
   import * as ProductCommentApi from '@/api/product/comment.js';
+  import * as CouponTemplateApi from '@/api/promotion/couponTemplate.js';
   import * as TradeCartApi from '@/api/trade/cart.js';
   import * as Util from '@/utils/util.js';
   import * as ProductUtil from '@/utils/product.js';
   // #ifdef MP
 	import { base64src } from '@/utils/base64src.js'
 	import { getQrcode } from '@/api/api.js';
-  import {getCommentList} from "../../api/product/comment";
 	// #endif
 	const app = getApp();
 	export default {
@@ -346,14 +349,11 @@
         // ========== 收藏相关的变量 ==========
         userCollect: false,
 
-        // ========== 优惠劵相关的变量 ② TODO ==========
+        // ========== 优惠劵相关的变量 ==========
-        couponList: [], // 优惠券 TODO 芋艿：待实现
-        // 属性是否打开 TODO 待实现
         coupon: {
-          coupon: false,
+          coupon: false, // 弹窗是否打开
-          type: 1,
+          type: 1, // 筛选的优惠劵类型
-          list: [],
+          list: [], // 优惠劵列表
-          count: []
         },
 
         // ========== 营销活动相关的变量 ③ TODO ==========
@@ -809,6 +809,50 @@
         }
       },
 
+      // ========== 优惠劵相关方法 ==========
+      /**
+       * 获取优惠券
+       */
+      getCouponList(useType) {
+        CouponTemplateApi.getCouponTemplateList(this.id, useType).then(res => {
+          this.$set(this.coupon, 'list', res.data);
+        })
+      },
+      /**
+       * 打开优惠券弹窗
+       */
+      couponTap: function() {
+        if (!this.isLogin) {
+          toLogin();
+          return
+        }
+        this.getCouponList(1);
+        this.$set(this.coupon, 'coupon', true);
+      },
+      /**
+       * 关闭优惠劵弹窗
+       */
+      ChangCouponsClone: function() {
+        this.$set(this.coupon, 'coupon', false)
+      },
+      /**
+       * 切换优惠劵弹窗的使用类型
+       *
+       * @param useType 使用类型
+       */
+      tabCouponType(useType) {
+        this.$set(this.coupon, 'type', useType);
+        this.getCouponList(useType);
+      },
+      /**
+       * 领取完毕后，刷新下优惠劵列表
+       */
+      ChangCoupons: function(coupon) {
+        // let couponList = this.$util.ArrayRemove(this.couponList, 'id', coupon.id);
+        // this.$set(this, 'coupon.couponList', couponList);
+        this.getCouponList(this.coupon.type);
+      },
+
       // === TODO 芋艿：未处理 ====
 
 			kefuClick() {
@@ -867,18 +911,6 @@
 					})
 				}
 			},
-			ChangCouponsClone: function() {
-				this.$set(this.coupon, 'coupon', false)
-			},
-			/**
-			 * 领取完毕移除当前页面领取过的优惠券展示
-			 */
-			ChangCoupons: function(e) {
-				let coupon = e;
-				let couponList = this.$util.ArrayRemove(this.couponList, 'id', coupon.id);
-				this.$set(this, 'couponList', couponList);
-				this.getCouponList();
-			},
 
 			/**
 			 * 优品推荐
@@ -909,49 +941,6 @@
 					})
 				});
 			},
-			/**
-			 * 获取优惠券
-			 */
-			getCouponList(type) {
-				let that = this,
-					obj = {
-						page: 1,
-						limit: 20,
-						productId: that.id,
-						type: type
-					};
-				if (type != undefined || type != null) {
-					obj.type = type;
-				} else {
-					obj.type = "";
-				}
-				getCoupons(obj).then(res => {
-					that.$set(that.coupon, 'list', res.data);
-				});
-			},
-			tabCouponType(type) {
-				this.$set(this.coupon, 'type', type);
-				this.getCouponList(type);
-			},
-
-			ChangCouponsUseState(index) {
-				let that = this;
-				that.coupon.list[index].isUse = true;
-				that.$set(that.coupon, 'list', that.coupon.list);
-				that.$set(that.coupon, 'coupon', false);
-			},
-			/**
-			 * 打开优惠券插件
-			 */
-			couponTap: function() {
-				let that = this;
-				if (that.isLogin === false) {
-					toLogin();
-				} else {
-					that.getCouponList(1);
-					that.$set(that.coupon, 'coupon', true);
-				}
-			},
 
       // ========== 分销相关的方法 ==========
       /**