活动弹窗

components/cm-module/active-popup/active-popup.vue

@@ -0,0 +1,59 @@
+<template>
+    <view class="active-popup" v-if="visible">
+        <view class="content">
+            <image :src="image" @click="$emit('click')"></image> <text class="close-btn" @click="handleClose"></text>
+        </view>
+    </view>
+</template>
+
+<script>
+export default {
+    name: 'ActivePopup',
+    props: {
+        visible: {
+            type: Boolean,
+            default: false
+        },
+        image: {
+            type: String,
+            default: ''
+        }
+    },
+    methods: {
+        handleClose() {
+            this.$emit('closed')
+        }
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+.active-popup {
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    z-index: 999999;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    width: 100vw;
+    height: 100vh;
+    background: rgba(0, 0, 0, 0.5);
+    .content {
+        position: relative;
+        image {
+            width: 440rpx;
+        }
+        .close-btn {
+            display: block;
+            position: absolute;
+            right: -48rpx;
+            top: -48rpx;
+            width: 48rpx;
+            height: 48rpx;
+            background: url(../../../static/icon-close.png) no-repeat center;
+            background-size: 48rpx 48rpx;
+        }
+    }
+}
+</style>

pages/tabBar/index/index.vue

@@ -78,16 +78,35 @@
         </view>
         <!-- 侧边 -->
         <scroll-top :isScrollTop="isScrollTop" :bottom="160"></scroll-top>
+        <!-- 活动弹窗 -->
+        <active-popup
+            :visible="activePopupVisible"
+            :image="StaticUrl + 'icon-coupons-news.png'"
+            @click="activeClick"
+            @closed="activeClosed"
+        ></active-popup>
+        <!-- 领取优惠券提示 -->
+        <selector-coupons
+            :top="CustomBar"
+            :visible="tipVisible"
+            title="呵呵商城"
+            subTitle="您已获得优惠券奖励，赶紧去领取吧！"
+            :image="StaticUrl + 'logo.png'"
+        ></selector-coupons>
     </view>
 </template>
 
 <script>
 import authorize from '@/common/authorize.js'
 import banner from '@/components/cm-module/homeIndex/banner.vue'
+import ActivePopup from '@/components/cm-module/active-popup/active-popup.vue'
+import SelectorCoupons from '@/components/cm-module/selector-coupons/selector-coupons.vue'
 import { mapGetters, mapMutations, mapActions } from 'vuex'
 export default {
     components: {
-        banner
+        banner,
+        ActivePopup,
+        SelectorCoupons
     },
     data() {
         return {
@@ -117,7 +136,9 @@ export default {
             pageSize: 20,
             hasNextPage: false,
             isScrollTop: false,
-            isRequest: false
+            isRequest: false,
+            activePopupVisible: false, // 活动弹窗
+            tipVisible: true //优惠券领取提示
         }
     },
     filters: {
@@ -131,6 +152,9 @@ export default {
         this.wechatlogin()
         this.GetHomeBanner()
         this.GetHomeProductList()
+        setTimeout(()=>{
+            this.tipVisible = false
+        },5000)
     },
     computed: {
         ...mapGetters(['hasLogin', 'userIdentity', 'userId'])
@@ -171,6 +195,14 @@ export default {
         },
         handAddCarts(pro) {
             this.addToCart({ productId: pro.productId })
+        },
+        activeClick() {
+            this.activePopupVisible = false
+            console.log('点击了活动弹窗')
+        },
+        activeClosed() {
+            this.activePopupVisible = false
+            console.log('活动弹窗关闭')
         }
     },
     onPageScroll(e) {
@@ -206,7 +238,7 @@ export default {
         }
     },
     onShow() {
-        if(this.hasLogin){
+        if (this.hasLogin) {
             this.getCartNumber()
         }
     }

pages/tabBar/user/index.vue

@@ -15,9 +15,7 @@
                     <view class="user-login" v-if="!hasLogin && isRequest" @click="navigator('/pages/login/login')"
                         >登录</view
                     >
-                    <view class="user-text" v-else>
-                        {{ userIdentity == 1 ? userInfo.nickName : userInfo.name }}
-                    </view>
+                    <view class="user-text" v-else> {{ userIdentity == 1 ? userInfo.nickName : userInfo.name }} </view>
                 </view>
                 <!-- 背景图 -->
                 <image class="user-bg" :src="StaticUrl + 'icon-user-bg@2x.png'" mode="widthFix"></image>
@@ -63,6 +61,14 @@
             <!-- 订单状态区域END -->
             <!-- 菜单导航区域 -->
             <view class="place-menu-conten clearfix">
+                <view class="place-menu-cell" @click="navigator()">
+                    <view class="place-left">
+                        <image class="place-menu-icon" :src="StaticUrl + 'icon-coupon.png'" mode=""></image>
+                        <text class="place-menu-title">优惠券</text>
+                        <text class="coupons-count">6</text>
+                    </view>
+                    <text class="iconfont icon-chakangengduo"></text>
+                </view>
                 <view
                     class="place-menu-cell"
                     @click="navigator('/pages/user/activity/activity-list')"
@@ -117,11 +123,11 @@ export default {
             paymentCount: 0, //待付款角标
             waitShipmentsCount: 0, //待收货角标
             shipmentsCount: 0, //已发货角标
-            salesReturnCount: 0, //退货/款角标
+            salesReturnCount: 0 //退货/款角标
         }
     },
     computed: {
-        ...mapGetters(['hasLogin', 'userInfo','userId','userIdentity'])
+        ...mapGetters(['hasLogin', 'userInfo', 'userId', 'userIdentity'])
     },
     filters: {
         countNum(value) {
@@ -129,10 +135,10 @@ export default {
         }
     },
     onShow() {
-      if(this.hasLogin){
-          this.getCartNumber()
-          this.GetUserInfoPersonal()
-      }  
+        if (this.hasLogin) {
+            this.getCartNumber()
+            this.GetUserInfoPersonal()
+        }
     },
     methods: {
         ...mapMutations('app', ['login', 'logout']),
@@ -188,7 +194,7 @@ export default {
         } else {
             uni.stopPullDownRefresh()
         }
-    },
+    }
 }
 </script>
 
@@ -333,7 +339,7 @@ export default {
             border-bottom: none;
         }
         .place-left {
-            width: 600rpx;
+            width: 650rpx;
             height: 100%;
             .place-menu-icon {
                 width: 36rpx;
@@ -342,7 +348,7 @@ export default {
                 float: left;
             }
             .place-menu-title {
-                width: 540rpx;
+                width: 300rpx;
                 margin-left: 16rpx;
                 float: left;
                 height: 36rpx;
@@ -350,6 +356,15 @@ export default {
                 font-size: $font-size-28;
                 color: #333333;
             }
+            .coupons-count{
+                width: 240rpx;
+                float: right;
+                height: 36rpx;
+                line-height: 36rpx;
+                font-size: $font-size-28;
+                text-align: right;
+                color: #FF457B;
+            }
         }
         .iconfont {
             width: 36rpx;
@@ -368,7 +383,7 @@ export default {
 .user-support {
     width: 100%;
     float: left;
-    margin-top: 340rpx;
+    margin-top: 270rpx;
     display: flex;
     flex-direction: column;
     align-items: center;