优惠券相关修改

components/views/cm-coupon-area/cm-coupon-area.vue

@@ -13,7 +13,15 @@
         >
             <template v-slot:slide="{ row }">
                 <view class="swiper-slide">
-                    <cm-coupon :couponData="row" :controlType="row.controlType" @click="onCouponClick"></cm-coupon>
+                    <template v-if="row.type !== 'tip'">
+                        <cm-coupon :couponData="row" :controlType="row.controlType" @click="onCouponClick"></cm-coupon>
+                    </template>
+                    <template v-else>
+                        <view class="coupon-tip" :class="'coupon-tip-' + row.id" @click="onCouponTipClick(row)">
+                            <view class="text" v-text="row.name"></view>
+                            <view class="control">点击查看</view>
+                        </view>
+                    </template>
                 </view>
             </template>
         </cm-simple-swiper>
@@ -50,6 +58,9 @@ export default {
         },
         onCouponClick(coupon) {
             this.$emit('click', coupon)
+        },
+        onCouponTipClick(item) {
+            this.$router.navigateTo('coupon/coupon-description?entryType=' + item.id)
         }
     }
 }
@@ -60,4 +71,72 @@ export default {
     box-sizing: border-box;
     padding: 12rpx 0;
 }
+
+.coupon-tip {
+    $bg-entry-1: url('https://static.caimei365.com/app/mini-hehe/icon/bg-coupon-desc-entry-01.png');
+    $bg-entry-2: url('https://static.caimei365.com/app/mini-hehe/icon/bg-coupon-desc-entry-02.png');
+    $bg-entry-3: url('https://static.caimei365.com/app/mini-hehe/icon/bg-coupon-desc-entry-03.png');
+
+    $width: 702rpx;
+    $height: 200rpx;
+
+    @extend .cm-flex-center;
+    flex-direction: column;
+    align-items: flex-start;
+    box-sizing: border-box;
+    padding-left: 32rpx;
+    width: $width;
+    height: $height;
+    background-position: center;
+    background-repeat: no-repeat;
+    background-size: $width $height;
+
+    &.coupon-tip-1 {
+        background-image: $bg-entry-1;
+        .text {
+            color: #ee6531;
+        }
+    }
+
+    &.coupon-tip-2 {
+        background-image: $bg-entry-2;
+        .text {
+            color: #4197ef;
+        }
+    }
+
+    &.coupon-tip-3 {
+        background-image: $bg-entry-3;
+        .text {
+            color: #ff445e;
+        }
+    }
+
+    .text {
+        margin-bottom: 24rpx;
+        font-size: 46rpx;
+        font-weight: bold;
+    }
+
+    .control {
+        @extend .cm-flex-center;
+        width: 160rpx;
+        height: 40rpx;
+        background: linear-gradient(90deg, #ff903b 0%, #fc2744 100%);
+        border-radius: 20rpx;
+        font-size: 24rpx;
+        color: #fff;
+
+        &::after {
+            content: '';
+            display: block;
+            margin-left: 12rpx;
+            width: 0;
+            height: 0;
+            border-style: solid;
+            border-width: 10rpx 0 10rpx 16rpx;
+            border-color: transparent transparent transparent #fff;
+        }
+    }
+}
 </style>

components/views/cm-coupon/cm-coupon.vue

@@ -47,7 +47,7 @@
 
 <script>
 import UButton from './u-button.vue'
-import { mapActions } from 'vuex'
+import { mapActions, mapGetters } from 'vuex'
 
 export default {
     name: 'cm-coupon',
@@ -116,6 +116,7 @@ export default {
         }
     },
     computed: {
+        ...mapGetters(['userId']),
         checkedClass() {
             return this.checked ? 'icon-xuanze' : 'icon-weixuanze'
         },
@@ -170,6 +171,7 @@ export default {
         },
         // 领取优惠券
         async clickReceive() {
+            if (!userId) return this.$router.navigateTo('authorize/login-custom')
             try {
                 await this.receiveCoupon(this.couponData)
                 this.$emit('click', this.couponData)

components/views/cm-simple-swiper/cm-simple-swiper.vue

@@ -117,7 +117,7 @@ export default {
             const result = []
             const count = this.rows * this.columns
             // 一屏仅有一个时
-            if (count === 1 || !this.autoFill) {
+            if (count === 1) {
                 return list
             }
             let start = 0
@@ -127,7 +127,7 @@ export default {
                     break
                 }
                 const slice = list.slice(start, start + count)
-                if (slice.length < count) {
+                if (slice.length < count && this.autoFill) {
                     slice.push(...this.fullArray(count - slice.length))
                 }
                 result.push(slice)

pages/tabBar/home/home.vue

@@ -51,6 +51,7 @@ import { fetchHomeCarousel, fetchHomeNavbar, fetchHomeFloorData, fetchHomeCoupon
 import { fetchProductFloorList } from '@/services/api/goods.js'
 import { shareDataResult } from '@/common/share.helper.js'
 import { mapActions, mapGetters } from 'vuex'
+
 export default {
     data() {
         return {
@@ -180,13 +181,37 @@ export default {
         async fetchCouponList() {
             try {
                 const resultCouponData = await fetchHomeCouponList({ userId: this.userId })
-                this.couponList = resultCouponData.data.map(item => {
-                    item.controlType = 'receive'
-                    return item
-                })
+                this.couponList = [
+                    ...resultCouponData.data.map(item => {
+                        item.controlType = 'receive'
+                        return item
+                    }),
+                    ...this.generateCouponTips()
+                ]
             } catch (e) {
                 console.log('获取优惠券列表失败')
             }
+        },
+
+        // 生成优惠券说明
+        generateCouponTips() {
+            return [
+                {
+                    type: 'tip',
+                    id: 1,
+                    name: '好友邀请券福利'
+                },
+                {
+                    type: 'tip',
+                    id: 2,
+                    name: '好友消费券福利'
+                },
+                {
+                    type: 'tip',
+                    id: 3,
+                    name: '分享券福利'
+                }
+            ]
         }
     }
 }

pages/views/activity/activity-area.vue

@@ -73,9 +73,9 @@ export default {
                 const { data } = await fetchProductActivityAreaList(this.listQuery)
                 this.hasNextPage = data.hasNextPage
                 if (this.isRefresh) {
-                    this.activityList = data.list
+                    this.activityList = data.results
                 } else {
-                    this.activityList = [...this.activityList, ...data.list]
+                    this.activityList = [...this.activityList, ...data.results]
                 }
             } catch (e) {
                 console.log(e)

pages/views/coupon/config/description.js

@@ -1,5 +1,6 @@
 export default [{
     id: 1,
+    type: 'tip',
     title: '好友邀请券福利来袭啦',
     tip: '好友邀请券获取规则',
     content: '用户登录呵呵商城后，可通过商城首页或商城右上角按钮以及商品详情分享至好友，当好友通过您分享的链接进行注册登录后，您就可以获得一张好友邀请券的领券资格。',
@@ -10,11 +11,13 @@ export default [{
     }
 }, {
     id: 2,
+    type: 'tip',
     title: '好友消费券福利来袭啦',
     tip: '好友消费券获取规则',
     content: '用户登录呵呵商城后，可通过商城首页或商城右上角按钮以及商品详情分享至好友，当好友通过您分享的链接进行注册登录后，每消费一笔订单后，您就可以获得一张好友消费券的领券资格。'
 }, {
     id: 3,
+    type: 'tip',
     title: '分享券福利来袭',
     tip: '分享券获取规则',
     content: '用户登录呵呵商城后，每消费一笔订单后在支付完成页面点击分享给微信好友或生成海报分享后，您就可以获得一张好友消费券的领券资格。'

pages/views/goods/goods-coupon-list.vue

@@ -1,8 +1,143 @@
 <template>
+    <view class="goods-list">
+        <tui-skeleton v-if="isRequest" :loadingType="3" :isLoading="true"></tui-skeleton>
+        <view class="sticky-top">
+            <!-- 搜索框 -->
+            <cm-simple-search @search="onSearch" @cancel="onCancel" v-model="listQuery.productName"></cm-simple-search>
+        </view>
+        <!-- 商品列表 -->
+        <view class="product-list">
+            <view class="product-item" v-for="(product, index) in productList" :key="product.productId">
+                <cm-product :data="product"></cm-product>
+            </view>
+        </view>
+        <!-- 加载更多 -->
+        <cm-loadmore :hasNextPage="hasNextPage" :isLoading="isLoading" :visiable="!hideLoadmore"></cm-loadmore>
+        <!-- 安全区域 -->
+        <cm-safe-area-bottom v-if="hideLoadmore"></cm-safe-area-bottom>
+        <!-- 购物车 -->
+        <cm-drag :cartNum="kindCount" @btnClick="toCart"></cm-drag>
+    </view>
 </template>
 
 <script>
+import { fetchProductByCoupon } from '@/services/api/coupon.js'
+import { debounce } from '@/common/utils.js'
+import { mapGetters } from 'vuex'
+import { makeQuery } from '@/pages/views/goods/config/config.js'
+export default {
+    data() {
+        return {
+            isRequest: true,
+            listQuery: {
+                productName: '',
+                userId: '',
+                couponId: '',
+                pageNum: 1,
+                pageSize: 12
+            },
+            navInfo: {},
+            productList: [],
+            hasNextPage: true,
+            total: 0,
+            isLoading: false
+        }
+    },
+    computed: {
+        ...mapGetters(['userId', 'kindCount']),
+        hideLoadmore() {
+            return this.isRequest || this.productList.length <= this.listQuery.pageSize
+        }
+    },
+    onReachBottom() {
+        this.loadMore()
+    },
+    onLoad(options) {
+        this.initQueryList(options)
+    },
+    methods: {
+        // 跳转到购物车
+        toCart() {
+            this.$router.redirectTo('cart/cart')
+        },
+
+        // 搜索商品
+        onSearch() {
+            this.filterProductList()
+        },
+
+        // 取消搜索
+        onCancel() {
+            this.listQuery.name = ''
+            this.filterProductList()
+        },
+
+        // 筛选商品
+        onFilter(e) {
+            const { current, sort } = e
+            if (current === 0) {
+                // 综合排序
+                this.listQuery.sortType = 1
+            } else if (current === 1) {
+                // 价格高低
+                this.listQuery.sortType = sort === 'desc' ? 3 : 2
+            } else {
+                // 最新上架
+                this.listQuery.sortType = 4
+            }
+            this.filterProductList()
+        },
+
+        // 初始化查询参数
+        initQueryList(options) {
+            this.listQuery.userId = this.userId
+            this.listQuery.couponId = options.couponId
+            this.fetchProductList()
+        },
+
+        // 加载更多
+        loadMore() {
+            if (!this.hasNextPage) return
+            this.isLoading = true
+            this.fetchProductList()
+        },
+
+        // 搜索商品
+        filterProductList() {
+            this.productList = []
+            this.listQuery.pageNum = 1
+            this.fetchProductList()
+        },
+
+        // 获取商品列表
+        fetchProductList: debounce(async function() {
+            try {
+                const resultProductData = await fetchProductByCoupon(this.listQuery)
+                this.productList = [...this.productList, ...resultProductData.data.list]
+                this.hasNextPage = resultProductData.data.hasNextPage
+                this.total = resultProductData.data.total
+                this.listQuery.pageNum++
+                this.isRequest = false
+                this.isLoading = false
+            } catch (e) {
+                console.log(e)
+                console.log('获取商品列表失败')
+            }
+        }, 200)
+    }
+}
 </script>
 
-<style>
-</style>
+<style lang="scss" scoped>
+.goods-list {
+    box-sizing: border-box;
+    min-height: 100vh;
+    .product-list {
+        display: grid;
+        grid-template-columns: repeat(3, 1fr);
+        grid-row-gap: 16rpx;
+        grid-column-gap: 16rpx;
+        padding: 16rpx 24rpx;
+    }
+}
+</style>

services/api/goods.js

@@ -66,7 +66,7 @@ export function searchProductList(params) {
 /* 活动专区(分销者) */
 export function fetchProductActivityAreaList(params) {
     return request({
-        url: '/product/activityArea',
+        url: '/product/activity/list',
         method: 'GET',
         params
     })