签到页面

components/topbar.js

@@ -1,3 +1,5 @@
+const { isEmpty } = require("../utils/util")
+
 // components/topbar.js
 Component({
     externalClasses: ['topbar-class', 'topbar-title-class', 'back-color-class'],
@@ -8,6 +10,14 @@ Component({
         title: {
             type: String,
             value: ''
+        },
+        backColor: {
+            type: String,
+            value: ''
+        },
+        titleColor: {
+            type: String,
+            value: ''
         }
     },
     /**
@@ -18,19 +28,25 @@ Component({
     },
 
     attached: function() {
-        var url =getCurrentPages()[getCurrentPages().length-1].route
-
         let dwObj = wx.getMenuButtonBoundingClientRect()
         let navHeight_ = (dwObj.top + dwObj.height)
         let capsuleTop_ = dwObj.top
         let windowHeight = wx.getSystemInfoSync().windowHeight
-
-        this.setData({
+        const data = {
             navHeight: navHeight_,
             capsuleTop:capsuleTop_, 
             capHeight: dwObj.height,
             bodyHeight: windowHeight - navHeight_,
-        });
+        }
+        
+        if (!isEmpty(this.data.backColor)) {
+            data.backStyle = "color:" + this.data.backColor + ";";
+        }
+        if (!isEmpty(this.data.titleColor)) {
+            data.titleStyle = "color:" + this.data.titleColor + ";"
+        }
+        
+        this.setData(data);
     },
 
     /**

components/topbar.wxml

@@ -1,9 +1,9 @@
 <!--components/topbar.wxml-->
 <view class="topbar topbar-class" style="top:{{capsuleTop + 3}}px; left: 28rpx;">
    <view class="back" catchtap="handleBack">
-      <text class="back-iconfont back-color-class" />
+      <text class="back-iconfont back-color-class" style="{{backStyle}}" />
    </view>
 
-   <view class="title topbar-title-class">{{title}}</view>
+   <view class="title topbar-title-class" style="{{titleStyle}}">{{title}}</view>
 
 </view>

pages/signIn/activity/activity.js

@@ -134,11 +134,20 @@ Page({
         this.setData({
             mainColor: color,
             secColor: newColor,
+            thirdColor: "rgb(" + this.toRGB(color) + ", 0.3)",
             backGroundStyle:  "background: linear-gradient(" +color+", "+ newColor+ ", "+color+");",
             grayBackGroudStyle: "background: #c6c6c6"
         })
     },
 
+    toRGB(hex) {
+        const list = [hex.substr(1,2), hex.substr(3,2), hex.substr(5,2)]
+        list[0] = parseInt(list[0] , 16)
+        list[1] = parseInt(list[1] , 16)
+        list[2] = parseInt(list[2] , 16)
+        return list.join(',')
+    },
+
     popMessage(message) {
         app.showToast(message, "none")
     },

pages/signIn/activity/activity.wxml

@@ -2,29 +2,28 @@
 <view wx:if="{{showPage}}">
 
 <custom-page head-bg-image="{{activity.themePic}}" bind:sizes="handlePageSizes">
-    <topbar slot="head" title="签到中心" topbar-title-class="title-color" back-color-class="title-color" />
+    <topbar slot="head" title="签到中心" back-color="{{mainColor}}" title-color="{{mainColor}}" />
     <!-- 页面主体 -->
     <view slot="body" class="sign-scroll-body">
-        <view class="sign-info-extra">
+        <view class="sign-info-extra" style="color: {{mainColor}};">
             <view class="coupon_num_box">
-            <view class="my_coupon_title">签到优惠券</view>
-            <view class="_num_arear">
-                <text class="_num">{{notUseNum}}</text>
-                <text class="_unit">张</text>
-                <view class="_btn" wx:if="{{notUseNum > 0}}">
-                <jumpmallapp>去使用</jumpmallapp>
+                <view class="my_coupon_title">签到优惠券</view>
+                <view class="_num_arear">
+                    <text class="_num">{{notUseNum}}</text>
+                    <text class="_unit">张</text>
+                    <view class="_btn" style="border-color: {{mainColor}};" wx:if="{{notUseNum > 0}}">
+                    <jumpmallapp>去使用</jumpmallapp>
+                    </view>
                 </view>
-            </view>
-            </view>
-            <view class="_look_btn" catchtap="toRecordDetailPage">明细 | 查看</view>
+                <view class="_look_btn" catchtap="toRecordDetailPage">明细 | 查看</view>
+            </view> 
         </view>
         <!-- 签到卡片 -->
-        <view class="sign-card-box">
+        <view class="sign-card-box" style="border-color: {{thirdColor}};">
             <view class="sign-item-box">
                 <view class="_left">
                     <view class="_item" wx:for="{{signInNodes}}" wx:key="index" >
                         <image class="_figure" src="{{item.figure}}" mode="aspectFill" />
-                        <view class="_no" style="{{item.textBgGround}}">{{item.text}}</view>
                         <image wx:if="{{item.isSignIn == -1}}" class="_lose_sign_in" src="/images/signIn/losesign.png" />
                         <image wx:if="{{item.isSignIn == 1}}" class="_finish_sign_in" src="/images/signIn/finishsign.png" />
                     </view>
@@ -32,7 +31,6 @@
                 <view class="_right">
                     <view class="_item">
                         <image class="_figure" src="{{lastSignInNode.figure}}" mode="aspectFill" />
-                        <view class="_no" style="{{lastSignInNode.textBgGround}}">{{lastSignInNode.text}}</view>
                         <image wx:if="{{lastSignInNode.isSignIn == -1}}" class="_lose_sign_in" src="/images/signIn/losesign.png" />
                         <image wx:if="{{lastSignInNode.isSignIn == 1}}" class="_finish_sign_in" src="/images/signIn/finishsign.png" />
                     </view>
@@ -40,7 +38,7 @@
             </view>
             
             <block wx:if="{{todayIsSigned}}">
-                <view class="_sign_in_btn">今日已签到</view>
+                <view class="_sign_in_btn" style="background-color:{{thirdColor}};">今日已签到</view>
             </block>
             <block wx:else>
                 <view class="_sign_in_btn" style="{{backGroundStyle}}" catchtap="tapSignIn">

pages/signIn/activity/activity.wxss

@@ -44,30 +44,26 @@ page {
     box-sizing: border-box;
     padding: 20rpx 0 20rpx 80rpx;
 }
-
-.coupon_num_box {
-    color: #EA443A;
-}
 .my_coupon_title {
     font-size: 24rpx;
     font-weight: 400;
 }
 .coupon_num_box ._num_arear {
-    padding: 18rpx 0  0 20rpx;
+    padding: 10rpx 0  0 0rpx;
     box-sizing: border-box;
-    height: 162rpx;
+    height: 150rpx;
     width: 480rpx;
     white-space: nowrap;
 }
 ._num_arear ._num {
-    font-size: 128rpx;
+    font-size: 104rpx;
     vertical-align: baseline;
-    height: 144rpx;
+    height: 140rpx;
     display: inline-block;
 }
 ._num_arear ._unit {
     padding-left: 10rpx;
-    font-size: 52rpx;
+    font-size: 48rpx;
     font-weight: 400;
     vertical-align: baseline;
     display: inline-block;
@@ -87,9 +83,7 @@ page {
 .sign-info-extra ._look_btn {
     width: 180rpx;
     box-sizing: border-box;
-    padding: 140rpx 60rpx 0 0;
     font-size: 24rpx;
-    color: #fff;
     font-weight: 400;
 }
 
@@ -102,6 +96,8 @@ page {
     border-radius: 8px;
     box-sizing: border-box;
     padding: 56rpx 40rpx 40rpx 40rpx;
+    border-width: 2rpx;
+    border-style: solid;
 }
 
 .sign-item-box {