签到页面调整

pages/signIn/record/record.json

@@ -1,8 +1,6 @@
 {
+  "navigationBarTitleText": "签到记录",
   "usingComponents": {
-    "topbar": "../../../components/topbar",
     "custom-page": "../../../components/customPage/customPage"
-  },
-  "navigationStyle":"custom",
-  "navigationBarTextStyle": "white"
+  }
 }

pages/signIn/record/record.wxml

@@ -1,117 +1,91 @@
 <!--pages/signIn/record/record.wxml-->
-<!-- 首部信息 -->
-<custom-page head-bg-image="https://dy.shpr.top/luckDraw/per_head.png" bind:reachbottom="scrollToBottom">
-  <topbar wx:if="{{!isLogin}}" slot="head" title="签到优惠券" topbar-title-class="record-topbar" />
-  <topbar wx:if="{{noCoupon}}" slot="head" title="签到优惠券" topbar-title-class="record-topbar" />
-  <topbar wx:if="{{noDetail}}" slot="head" title="获取明细" topbar-title-class="record-topbar" />
-  <topbar wx:if="{{noUtility}}" slot="head" title="使用/失效" topbar-title-class="record-topbar" />
-
-  <view slot="body">
-    <view class="head flex-column">
-      <view class="head_num" wx:if="{{!isLogin}}">{{notUseNum}}</view>
-      <view class="head_num" wx:if="{{isLogin}}">{{notUseNum?notUseNum:0}}</view>
-      <view class="head_text" wx:if="{{isLogin}}">请在优惠券有效期内尽快使用</view>
-      <button class="sigin-isLogin" wx:if="{{!isLogin}}" open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber">登录</button>
-    </view>
-    <!-- 中部说明 -->
-    <view class="explain flex-row">
-      <view class="explain-left flex-column" catchtap="{{isLogin?'getCoupon':''}}">
-        <view class="explain-discount">签到优惠券</view>
-        <view class="{{noCoupon?'explain-column':'explain-columnNo'}}"></view>
-      </view>
-      <view class="explain-center flex-column" catchtap="{{isLogin?'getDetail':''}}">
-        <view class="explain-detailed">获取明细</view>
-        <view class="{{noDetail?'explain-column':'explain-columnNo'}}"></view>
-      </view>
-      <view class="explain-right flex-column" catchtap="{{isLogin?'getUtility':''}}">
-        <view class="explain-utility">使用/失效</view>
-        <view class="{{noUtility?'explain-column':'explain-columnNo'}}"></view>
-      </view>
-    </view>
-
-    <!-- 使用内容 -->
-    <view class="content">
-      <!-- 主要内容 -->
-      <view class="check-in-content flex-column">
-        <!-- 优惠券内容 -->
-        <view hidden="{{hiddenCoupon}}">
-            <view wx:for="{{couponList}}" wx:key="index" data-id="{{item.id}}"  class="{{item.coupon.couponType == 'C'?'coupon flex-row':'coupon2 flex-row'}}">
-              <view class="coupon-left flex-row">
-                <!-- 代金券 -->
-                <view class="coupon-left-symbol" wx:if="{{item.coupon.couponType == 'C'}}">￥</view>
-                <view class="{{item.coupon.formatReduceCost.length > 3 ?'coupon-left-numSmall':'coupon-left-num'}}" wx:if="{{item.coupon.couponType == 'C'}}">{{item.coupon.formatReduceCost ?item.coupon.formatReduceCost:0}}</view>
-                <!-- 折扣券 -->
-                <view class="{{item.coupon.formatDiscount.length > 3 ?'coupon-left-numSmall':'coupon-left-num'}}" wx:if="{{item.coupon.couponType == 'D'}}">{{item.coupon.formatDiscount ?item.coupon.formatDiscount:0}}</view>
-                <view class="coupon-left-symbol" wx:if="{{item.coupon.couponType == 'D'}}" style="font-size: 16px;">折</view>
-              </view>
-              <view class="coupon-center flex-column">
-                <view class="coupon-center-upper">{{item.coupon.couponTitle}}</view>
-                <view class="coupon-center-bm flex-row">
-                  <view class="coupon-center-block1"></view>
-                  <view class="coupon-center-middle" wx:if="{{item.coupon.formatLeastCost == '0'}}">无门槛</view>
-                  <view class="coupon-center-middle" wx:if="{{item.coupon.formatLeastCost != '0'}}">满{{item.coupon.formatLeastCost}}使用</view>
-                  <view class="coupon-center-block2"></view>
-                </view>
-                <view class="coupon-center-lower">{{item.coupon.couponBeginTimestamp}}-{{item.coupon.couponEndTimestamp}}</view>
-              </view>
-              <view class="coupon-right">
-                <view class="{{item.coupon.couponType == 'C'?'coupon-right-usenow flex-row':'coupon-right-usenow2 flex-row'}}">
-                  <navigator class="btn_exchange" target="miniProgram" app-id="wxd92a2d29f8022f40" path="pages/index/index" open-type='navigate'>
-                  </navigator>
-                </view>
-              </view>
-            </view>
-        </view>
-        <!-- 获得明细 -->
-        <view class="detailed flex-column" hidden="{{hiddenDetail}}">
-          <view class="detailed-content" wx:for="{{detailList}}" wx:key="index" data-id="{{item.id}}">
-            <view class="detailed-sign flex-row">
-              <view class="detailed-sign-index flex-column">
-                <view class="detailed-sign-text">{{item.source =='1'?'签到':'任务'}}</view>
-                <view class="detailed-sign-date">{{item.crateTime}}</view>
-              </view>
-              <view class="detailed-coupon flex-column">
-                <view class="detailed-coupon-text">{{item.coupon.couponTitle}}</view>
-              </view>
-            </view>
-            <view class="detailed-date flex-column">
-              <view class="detailed-date-lower"></view>
-            </view>
+<!-- 导航说明 -->
+<view class="explain flex-row">
+  <view class="explain-left flex-column" catchtap="{{isLogin?'getCoupon':''}}">
+    <view class="explain-discount">签到优惠券</view>
+    <view class="{{noCoupon?'explain-column':'explain-columnNo'}}"></view>
+  </view>
+  <view class="explain-center flex-column" catchtap="{{isLogin?'getDetail':''}}">
+    <view class="explain-detailed">获取明细</view>
+    <view class="{{noDetail?'explain-column':'explain-columnNo'}}"></view>
+  </view>
+  <view class="explain-right flex-column" catchtap="{{isLogin?'getUtility':''}}">
+    <view class="explain-utility">使用/失效</view>
+    <view class="{{noUtility?'explain-column':'explain-columnNo'}}"></view>
+  </view>
+</view>
+<!-- 主要内容 -->
+<view class="check-in-content flex-column">
+  <button class="luck-draw-cz" wx:if="{{!isLogin}}" open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber">请登录</button>
+  <!-- 优惠券内容 -->
+  <view hidden="{{hiddenCoupon}}">
+    <view wx:for="{{couponList}}" wx:key="index" data-id="{{item.id}}">
+      <navigator class="{{item.coupon.couponType == 'C'?'coupon-list2 flex-row':'coupon-list flex-row'}}" target="miniProgram" app-id="wxd92a2d29f8022f40" path="pages/index/index" extra-data="{foo: 'bar'}" open-type='navigate'>
+        <view class="coupon-info flex-column">
+          <viwe class="coupon-info-tittle">{{item.coupon.couponTitle}}</viwe>
+          <view class="coupon-center-bm flex-row">
+            <view class="coupon-center-block1"></view>
+            <view class="coupon-center-middle" wx:if="{{item.coupon.formatLeastCost == '0'}}">无门槛</view>
+            <view class="coupon-center-middle" wx:if="{{item.coupon.formatLeastCost != '0'}}">满{{item.coupon.formatLeastCost}}元使用</view>
+            <view class="coupon-center-block2"></view>
           </view>
-
+          <viwe class="coupon-info-date">{{item.coupon.couponBeginTimestamp}}-{{item.coupon.couponEndTimestamp}}</viwe>
         </view>
-        <!-- 使用/失效 -->
-        <view class="detailed flex-column" hidden="{{hiddenUtility}}">
-          <view class="detailed-content" wx:for="{{stateList}}" wx:key="index" data-id="{{item.id}}">
-            <view class="detailed-sign flex-row">
-              <view class="detailed-sign-index flex-column">
-                <view class="detailed-sign-text">{{item.coupon.couponTitle}}</view>
-                <view class="detailed-sign-date">{{item.crateTime}}</view>
-              </view>
-              <view class="detailed-coupon flex-column" style="color: #8F8F8F;" wx:if="{{item.invalid}}">已失效</view>
-              <view class="detailed-coupon flex-column" style="color: #8F8F8F;" wx:elif="{{item.used}}">已使用</view>
-              <view class="detailed-coupon flex-column" style="color: #8F8F8F;" wx:else="{{!item.used}}">未使用</view>
-            </view>
-            <view class="detailed-date flex-column">
-              <view class="detailed-date-lower"></view>
-            </view>
+        <view class="coupon-numText flex-column">
+          <view class="coupon-num flex-row">
+            <!-- 折扣券 -->
+            <view class="{{item.coupon.formatDiscount.length > 3 ?'coupon-num-numSmall':'coupon-num-num'}}" wx:if="{{item.coupon.couponType == 'D'}}">{{item.coupon.formatDiscount ?item.coupon.formatDiscount:0}}</view>
+            <view class="{{item.coupon.formatDiscount.length > 3 ?'coupon-num-hanSmall':'coupon-num-han'}}" wx:if="{{item.coupon.couponType == 'D'}}">折</view>
+            <!-- 代金券 -->
+            <view class="{{item.coupon.formatReduceCost.length > 3 ?'coupon-num-hanSmall':'coupon-num-han'}}" wx:if="{{item.coupon.couponType == 'C'}}">￥</view>
+            <view class="{{item.coupon.formatReduceCost.length > 3 ?'coupon-num-numSmall':'coupon-num-num'}}" wx:if="{{item.coupon.couponType == 'C'}}">{{item.coupon.formatReduceCost ?item.coupon.formatReduceCost:0}}</view>
           </view>
+          <!-- <jumpmallapp>去使用</jumpmallapp> -->
+          <view class="coupon-num-text">立即使用</view>
+        </view>
+      </navigator>
+    </view>
+  </view>
 
+  <!-- 获取明细 -->
+  <view hidden="{{hiddenDetail}}">
+    <view class="detailed-content" wx:for="{{detailList}}" wx:key="index" data-id="{{item.id}}">
+      <view class="detailed-sign flex-row">
+        <view class="detailed-sign-index flex-column">
+          <view class="detailed-sign-text">{{item.source =='1'?'签到':'任务'}}</view>
+          <view class="detailed-sign-date">{{item.crateTime}}</view>
         </view>
-        <view class="no_result" wx:if="{{noResult}}">———— 抱歉，您暂无可用优惠券 ————</view>
-        <view class="no_result" wx:if="{{noMore}}">———— 更多优惠券 | 敬请期待 ————</view>
+        <view class="detailed-coupon flex-column">
+          <view class="detailed-coupon-text">{{item.coupon.couponTitle}}</view>
+        </view>
+      </view>
+      <view class="detailed-date flex-column">
+        <view class="detailed-date-lower"></view>
       </view>
     </view>
   </view>
-</custom-page>
 
-<!-- 使用wxs 手机号码中间四位显示为*号 -->
-<wxs module="phone">
-  var toHide = function (array) {
-    var mphone = array.substring(0, 3) + '****' + array.substring(7);
-    return mphone;
-  }
-  module.exports.toHide = toHide;
-</wxs>
+  <!-- 使用/失效 -->
+  <view hidden="{{hiddenUtility}}">
+    <view class="detailed-content" wx:for="{{stateList}}" wx:key="index" data-id="{{item.id}}">
+      <view class="detailed-sign flex-row">
+        <view class="detailed-sign-index flex-column">
+          <view class="detailed-sign-text">{{item.coupon.couponTitle}}</view>
+          <view class="detailed-sign-date">{{item.crateTime}}</view>
+        </view>
+        <view class="detailed-coupon flex-column"  wx:if="{{item.invalid}}">已失效</view>
+        <view class="detailed-coupon flex-column"  wx:elif="{{item.used}}">已使用</view>
+        <view class="detailed-coupon flex-column"  wx:else="{{!item.used}}">未使用</view>
+      </view>
+      <view class="detailed-date flex-column">
+        <view class="detailed-date-lower"></view>
+      </view>
+    </view>
+  </view>
+  <view class="no_result" wx:if="{{noResult}}">———— 抱歉，您暂无可用优惠券 ————</view>
+  <view class="no_result" wx:if="{{noMore}}">—— 人家也是有底线的 ——</view>
+</view>
 <!-- 底部导航 -->
-<tab-bar />
+<!-- <tab-bar /> -->
+
+<custom-preview-image wx:if="{{showCustomPreview}}" src="{{previewImgSrc}}" bind:closeCallback="closePreviewImage" />

pages/signIn/record/record.wxss

@@ -1,10 +1,12 @@
 /* pages/signIn/record/record.wxss */
-.record{
-  width: 750rpx;
-  height: auto;
-  padding-bottom: 119rpx; 
+page{
+  background: #F7F7F7;
+  display:flex;
+  flex-flow: column nowrap;
+  justify-content: left;
+  align-items: center;
+  box-sizing: border-box;
 }
-
 /* 垂直方向布局，水平居中 **/
 .flex-column{
   display: flex;
@@ -21,226 +23,172 @@
   justify-content: center;
 }
 
-.head{
-  width: 750rpx;
-  height: 320rpx;
-}
-
-.head_num{
-  font-size: 136rpx;
-  font-family: Source Han Sans CN;
-  font-weight: 500;
-  color: #FEFEFE;
-  margin-top: 10rpx;
-}
-
-.head_text{
-  font-size: 32rpx;
-  font-family: Source Han Sans CN;
-  font-weight: 400;
-  color: #FEFEFE;
-}
-
-.sigin-isLogin{
-  color: #FEFEFE;
-  font-weight: 400;
-  background-color: transparent;
-  border-style: none;
+.check-in-content{
+  margin: 22rpx;
 }
 
 .explain{
   width: 750rpx;
-  height: 120rpx;
+  height: 98rpx;
+  background: #FFFFFF;
   justify-content: space-between !important;
 }
 
 .explain-left,.explain-center,.explain-right{
-  width: 250rpx;
+  width: 33%;
   text-align: center;
 }
 
+.explain-text{
+  font-size: 18px;
+  font-weight: 600;
+  color: #BF2637;
+}
+
 .explain-discount,.explain-detailed,.explain-utility{
-  font-size: 32rpx;
-  font-family: Source Han Sans CN;
-  font-weight: 400;
-  color: #303030;
+  font-size: 28rpx;
+  font-weight: 500;
+  color: #000000;
 }
 
 
 .explain-column{
-  width: 39px;
-  height: 3px;
-  background: #BF2637;
-  border-radius: 2px;
-  margin-top: 10px;
+  width: 90rpx;
+  height: 4rpx;
+  background: #EA443A;
+  border-radius: 2rpx;
+  margin-top: 8rpx;
 }
 
 .explain-columnNo{
-  width: 39px;
-  height: 3px;
-  border-radius: 2px;
-  margin-top: 10px;
-}
-
-.content{
-  width: 100%;
-  height: auto;
-  background: #F3F3F3;
+  width: 90rpx;
+  height: 4rpx;
+  border-radius: 2rpx;
+  margin-top: 8rpx;
 }
 
-.check-in-content{
-  width: 100%;
-  height: auto;
-  background: #FFFFFF;
-  margin-top: 4px;
-}
-
-.coupon{
-  width: 708rpx;
-  height: 220rpx;
-  background-image: url(https://dy.shpr.top/luckDraw/cash_coupon.png);
+.coupon-list{
+  width: 704rpx;
+  height: 202rpx;
+  background-image: url(https://dy.shpr.top/welfareGo/discount.png);
   background-size: 100% 100%;
-  margin-top: 30rpx;
-  justify-content: left !important;
+  margin-bottom: 17px;
+  justify-content: space-between;
 }
 
-.coupon2{
-  width: 708rpx;
-  height: 220rpx;
-  background-image: url(https://dy.shpr.top/luckDraw/coupon.png);
+.coupon-list2{
+  width: 704rpx;
+  height: 202rpx;
+  background-image: url(https://dy.shpr.top/welfareGo/cash.png);
   background-size: 100% 100%;
-  margin-top: 30rpx;
-  justify-content: left !important;
-}
-
-.coupon-left{
-  width: 220rpx;
-  height: 100%;
-  text-align: center;
-  align-items: flex-end;
-}
-
-.coupon-center{
-  width: 350rpx;
-  height: 100%;
-  align-items: flex-start !important;
+  margin-bottom: 17px;
   justify-content: space-between;
 }
 
-.coupon-right{
-  width: 180rpx;
-  height: 100%;
-}
-
-.coupon-left-symbol{
-  font-size: 20px;
-  font-family: Microsoft YaHei;
-  font-weight: 400;
-  color: #443E5B;
-  line-height: 40px;
-}
-
-.coupon-left-num{
-  font-size: 59px;
-  font-family: Impact;
-  font-weight: 400;
-  color: #443E5B;
-  line-height: 71px;
+.coupon-info{
+  margin-left: 76rpx;
+  align-items: flex-start;
 }
 
-.coupon-left-numSmall{
-  font-size: 36px;
-  font-family: Impact;
-  font-weight: 400;
-  color: #443E5B;
-  line-height: 71px;
+.coupon-info-tittle{
+  width: 400rpx;
+  height: 38rpx;
+  font-size: 17px;
+  font-weight: bold;
+  color: #000000;
+  line-height: 15px;
+  margin-top: 10px;
+  overflow: hidden;
+	white-space: nowrap;
+	text-overflow: ellipsis;
 }
 
-.coupon-left-symbol,.coupon-left-num{
-  margin-bottom: 8px;
+.coupon-center-bm{
+  height: 15px;
+  margin-top: 10px;
+  justify-content: flex-start;
 }
 
-.coupon-center-upper,.coupon-center-bm,.coupon-center-lower{
-  margin-left: 18px;
-}
-.coupon-center-upper{
-  width: 140px;
-  height: 20px;
-  font-size: 20px;
-  font-weight: 500;
-  color: #443E5B;
-  line-height: 19px;
-  margin-top: 24px;
-  overflow: hidden;
-	white-space: nowrap;
-	text-overflow: ellipsis;
+.coupon-center-block1,.coupon-center-block2{
+  width: 5px;
+  height: 5px;
+  background: #443E5B;
+  transform:rotate(45deg);
+  margin: 0 10rpx;
 }
 
 .coupon-center-middle{
-  height: 15px;
-  font-size: 13px;
+  font-size: 10px;
   font-weight: 400;
-  color: #443E5B;
+  color: #444444;
   line-height: 16px;
 }
 
-.coupon-center-lower{
-  width: 146px;
-  height: 15px;
-  font-size: 13px;
+.coupon-info-num{
+  width: 90px;
+  height: 13px;
+  font-size: 10px;
   font-weight: 400;
-  color: #443E5B;
-  line-height: 16px;
-  margin-bottom: 11px;
+  color: #444444;
+  line-height: 15px;
+  margin-top: 15px;
 }
 
-.coupon-right-usenow{
-  width: 162rpx;
-  height: 56rpx;
-  background-image: url(https://dy.shpr.top/luckDraw/cash_use_now.png);
-  background-size: 100% 100%;
-  margin-top: 94rpx;
-  margin-left: -10rpx;
+.coupon-info-date{
+  width: 400rpx;
+  height: 30rpx;
+  font-size: 13px;
+  font-weight: 400;
+  color: #444444;
+  line-height: 15px;
+  margin-top: 10px;
 }
 
-.coupon-right-usenow2{
-  width: 81px;
-  height: 28px;
-  background-image: url(https://dy.shpr.top/luckDraw/coupon_use_now.png);
-  background-size: 100% 100%;
-  margin-top: 47px;
-  margin-left: -10px;
+.coupon-numText{
+  width: 200rpx;
 }
 
-.coupon-center-bm{
-  width: 100px;
-  height: 15px;
+.coupon-num-num{
+  font-size: 46px;
+  font-weight: bold;
+  color: #FFFFFF;
+  line-height: 57px;
 }
 
-.coupon-center-block1,.coupon-center-block2{
-  width: 5px;
-  height: 5px;
-  background: #443E5B;
-  transform:rotate(45deg);
-  margin: 0 10rpx;
+.coupon-num-numSmall{
+  font-size: 32px;
+  font-weight: bold;
+  color: #FFFFFF;
+  line-height: 33px;
+  margin-bottom: 10px;
 }
-
-.btn_exchange{
-  width: 100%;
-  height: 100%;
+.coupon-num-han{
+  font-size: 16px;
+  font-weight: bold;
+  color: #FFFFFF;
+  line-height: 17px;
+  margin-top: 19px;
 }
 
-.no_result {
-  font-size: 24rpx;
-  color: #B1B1B1;
-  line-height: 100rpx;
-  font-weight: 1000;
+.coupon-num-hanSmall{
+  font-size: 16px;
+  font-weight: bold;
+  color: #FFFFFF;
+  line-height: 17px;
+  margin-top: 19px;
+  margin-bottom: 19px;
+}
+.coupon-num-text{
+  font-size: 15px;
+  font-weight: 400;
+  color: #FFF8F8;
+  line-height: 15px;
 }
 
-.detailed{
-  width: 100%;
-  height: auto;
-  background: #F3F3F3;
+.lower-coupon-text{
+  font-size: 22rpx;
+  font-weight: 500;
+  color: #B01717;
 }
 
 .detailed-content{
@@ -279,18 +227,15 @@
 }
 
 .detailed-sign-text{
-  font-size: 18px;
+  font-size: 34rpx;
   font-weight: 500;
-  color: #6E6E6E;
   margin-left: 27px;
   margin-top: 22px;
 }
 
 .detailed-sign-date{
-  font-size: 14px;
-  font-family: Source Han Sans CN;
+  font-size: 26rpx;
   font-weight: 400;
-  color: #6E6E6E;
   margin-left: 26px;
   margin-bottom: 20px;
 }
@@ -302,18 +247,25 @@
 .detailed-coupon-text{
   width: 90%;
   height: 30px;
-  font-size: 18px;
+  font-size: 36rpx;
   font-weight: 500;
-  color: #B01717;
+  color: #EA443A;
   text-align: center;
   overflow: hidden;
 	white-space: nowrap;
 	text-overflow: ellipsis;
 }
 
-.record-topbar{
-  font-size: 56rpx;
+.detailed-coupon{
+  font-size: 36rpx;
   font-weight: 500;
-  color: #ffffff;
+  color: #444444;
 }
 
+.no_result {
+  font-size: 24rpx;
+  color: #B1B1B1;
+  line-height: 100rpx;
+  font-weight: 1000;
+  text-align: center;
+}