积分流水界面修改

src/pages/integralWater/integralWater.js

@@ -13,16 +13,42 @@ wxService.page({
     pageNo: 1,
     pageSize: 30,
     integralList: [],
-    noMore: false
+    noMore: false,
+    memberPoint: {
+      total: '--',
+      expirePoint: 0,
+      expireDate: ''
+    }
   },
   /**
    * 生命周期函数--监听页面加载
    */
-  onLoad() {},
+  onLoad() { },
   /**
    * 生命周期函数--监听页面初次渲染完成
    */
-  onReady: function () {},
+  onReady: function () { },
+  //查询会员积分信息
+  getMemberIntegrateInfo() {
+    // wx.showLoading({
+    //   title: '数据请求中..',
+    // });
+    const { memberId } = wx.getStorageSync('_baseUserInfo')
+    if (!memberId) {
+      return;
+    }
+
+    wxService.get(`/member/memberPoint/getMemberPointInfo?memberId=${memberId}`).then(res => {
+      let data = res.data.data ? res.data.data : {};
+      this.data.memberPoint.total = data.point ? data.point : 0;
+      this.data.memberPoint.expirePoint = data.pointWillExpired ? data.pointWillExpired : 0;
+      let expireDate = data.pointExpiredTime ? data.pointExpiredTime : '';
+      this.data.memberPoint.expireDate = expireDate;
+      this.setData({
+        memberPoint: this.data.memberPoint
+      });
+    });
+  },
   /**
    * 生命周期函数--监听页面显示
    */
@@ -31,13 +57,15 @@ wxService.page({
     this.getIntegralList()
     // 查询会员积分信息
     this.getMemberPointInfo()
+    this.getMemberIntegrateInfo();
   },
   // 查询会员积分信息
-  getMemberPointInfo(){
+  getMemberPointInfo() {
     wx.showLoading({
       title: '加载中'
     })
     wxService.get(`/member/memberPoint/getMyPointInfo`).then(res => {
+      if (res) {
         const { result, data } = res.data
         if (result == 0) {
           wx.hideLoading()
@@ -45,7 +73,7 @@ wxService.page({
             integralNum: data.point
           })
         }
-
+      }
     })
   },
   getIntegralList() {
@@ -56,14 +84,16 @@ wxService.page({
       pageNo: this.data.pageNo,
       pageSize: this.data.pageSize
     }
-    wxService.post(`/member/memberPointLog/findPage?pageNo=${this.data.pageNo}&pageSize=${this.data.pageSize}`, params).then(res=> {
-      const {result,data} = res.data
-      if(result == 0){
+    wxService.post(`/member/memberPointLog/findPage?pageNo=${this.data.pageNo}&pageSize=${this.data.pageSize}`, params).then(res => {
+      if (res) {
+        const { result, data } = res.data
+        if (result == 0) {
           wx.hideLoading()
           this.setData({
-           integralList: data.content.slice(0,30)
+            integralList: data.content.slice(0, 30)
           })
         }
+      }
     })
   },
   // 点击跳转至会员规则页
@@ -73,16 +103,15 @@ wxService.page({
   // 去积分商城
   handleGoIntegralMall() {
     // wxService.router(`/pages/IntegralMall/IntegralMall`)
-    wxService.router(`/subPackage/page/pages/IntegralMallGoods/IntegralMallGoods`);
+    wxService.router(`/subPackage/page/pages/IntegralMallGoods/IntegralMallGoods`)
   },
   // 消费详情
   handleGoDetail(e) {
-    const {memberId,
-      expandInfo} = e.currentTarget.dataset
+    const { memberid, expandinfo } = e.currentTarget.dataset
     // orderNo 存在 跳转订单详情
-    if(expandInfo && expandInfo.orderNo){
-      let orderNo = expandInfo.orderNo
-      wxService.router(`/pages/consumptionDetails/consumptionDetails`).search({orderNo})
+    if (expandinfo && expandinfo.orderNo) {
+      let orderNo = expandinfo.orderNo
+      wxService.router(`/pages/consumptionDetails/consumptionDetails`).search({ orderNo })
     }
   },
   /**

src/pages/integralWater/integralWater.wxml

 <!--pages/integralWater.wxml-->
 <view class='integral'>
-	<view class="integral-detail">
+  <!-- <view class="integral-detail">
       <view class="integral-num">
         <view class="num-current">{{integralNum}}</view>
         <view class="num-title">当前积分</view>
       </view>
       <view class="integral-vip-rules" bindtap="handleGoMemberRulesRules">积分规则</view>
+  </view> -->
+
+  <view class='mall-title'>
+		<view class='title-num-point'>
+			<view class='title-img-point'>
+				<view class='img-point'>
+					<image class="point-img" src='/assets/imgs/integral_exchange/point.png' mode="widthFix" />
+				</view>
+				<view class='text-point'>
+					{{memberPoint.total}}
+				</view>
+			</view>
+			<view class='integral-vip-rules' bindtap="handleGoMemberRulesRules">积分规则</view>
+		</view>
+		<view class='title-time-point' wx:if="{{memberPoint.expirePoint > 0}}">
+      {{memberPoint.expirePoint}} 积分将于 {{memberPoint.expireDate}} 清零
+    </view>
+    <view class='title-time-point' wx:if="{{memberPoint.expirePoint == 0}}">
+      暂无将过期积分
+    </view>
 	</view>
 
   <view wx:if="{{!integralList.length}}" class="detail-list-no">还没有任何积分记录</view>
   <view wx:if="{{integralList.length}}">
     <view class="integral-tips">
       <view class="tips-detail">显示你最近30笔变动明细</view>
-			<span class="tips-much">这么多积分</span>
-			<span class="tips-gomall" bindtap="handleGoIntegralMall"> 去积分商城看看>>> </span>
+      <span class="tips-much">这么多积分</span><span class="tips-gomall" bindtap="handleGoIntegralMall"> 去积分商城看看>>> </span>
     </view>
     <!--积分列表-->
     <view>
-			<view
-			 class="detail-integral"
-			 wx:for="{{integralList}}"
-			 wx:for-item="item"
-			 data-memberId="{{item.memberId}}"
-			 data-expandInfo="{{item.expandInfo}}"
-			 wx:for-index="k"
-			 wx:key="{{k}}"
-			 bindtap="handleGoDetail"
-			>
+      <view class="detail-integral" wx:for="{{integralList}}" wx:for-item="item" data-memberId = "{{item.memberId}}" data-expandInfo= "{{item.expandInfo}}" wx:for-index="k" wx:key="{{k}}" bindtap="handleGoDetail">
         <view class="detail-left">
           <view class="detail-title">{{item.changeTypeDesc}}</view>
           <view class="detail-time">{{item.changeTime}}</view>
         </view>
         <view class="detail-num {{item.operation==true ? 'add' : 'less'}}">{{item.operation == 1? '+':''}}{{item.operation*item.changeValue}}</view>
       </view>
-			<no-more wx:if="{{noMore}}" />
+      <no-more wx:if="{{noMore}}"/>
     </view>
   </view>
 </view>
-<!--goHome-->
-<go-home/>
-

src/pages/integralWater/integralWater.wxss

 /* pages/integralWater.wxss */
+page{
+  background: #ffffff;
+}
 .integral{
-  margin: 30rpx;
   padding-bottom: 50rpx;
+  border-top: 1px solid rgba(151, 151, 151, 0.1);
 }
 .detail-left{
   width: 50%;
 }
+
+.text-point {
+  color: rgba(51, 51, 51, 1);
+  font-size: 42rpx;
+  margin-left: 10rpx;
+}
+.mall-title {
+  height: 150rpx;
+  padding-left: 50rpx;
+  padding-right: 42rpx;
+  box-sizing: border-box;
+  background-color: rgba(255, 255, 255, 1);
+  box-shadow: 0px 0px 8px 5px rgba(0, 0, 0, 0.05),
+    0px 0px 3px 0px rgba(0, 0, 0, 0.03);
+  
+}
+.title-num-point {
+  padding-top: 30rpx;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+.integral-vip-rules {
+  width: 133rpx;
+  height: 42rpx;
+  line-height: 42rpx;
+  border-radius: 34rpx;
+  font-size: 23rpx;
+  text-align: center;
+  border: 1px solid rgba(204, 204, 204, 1);
+}
+.title-time-point {
+  color: rgba(102, 102, 102, 1);
+  font-size: 24rpx;
+  text-align: left;
+  padding-top: 3rpx;
+  margin-top: 15rpx;
+}
+
+.point-img {
+  width: 28rpx;
+  height: 36rpx;
+}
+
+.title-img-point {
+  display: flex;
+  align-items: center;
+}
+
 .integral-detail{
   border-radius: 10rpx;
-  padding-left: 43%;
+  padding-left: 30rpx;
   height: 150rpx;
   box-shadow: 0 0 10px #ccc ;
   background-repeat: no-repeat;
@@ -21,7 +73,7 @@
   text-align:center;
   padding-top: 34rpx;
 }
-.integral-vip-rules{
+/* .integral-vip-rules{
   width:100rpx;
   height:33rpx;
   line-height: 33rpx;
@@ -37,7 +89,7 @@
   vertical-align:top;
   margin-top: 25rpx;
   margin-bottom: 40rpx;
-}
+} */
 .num-current {
   font-size: 36rpx;
   color: #333;
@@ -47,11 +99,12 @@
   color:#666
 }
 .integral-tips {
-  padding: 45rpx 0
+  padding: 45rpx 30rpx;
 }
 .tips-detail{
   font-size: 24rpx;
   color: #333;
+  margin-bottom: 10rpx;
 }
 .tips-much {
   font-size: 28rpx;
@@ -75,7 +128,7 @@
 .detail-num{
   font-size: 25rpx;
   text-align: left;
-  width:10%;
+  width: auto;
   padding-top:20rpx;
 }
 .add {
@@ -87,7 +140,7 @@
 .detail-integral{
   display: flex;
   justify-content: space-between;
-  padding: 0 60rpx 0 30rpx;
+  padding: 0 40rpx;
   margin-bottom: 20rpx;
 }
 .detail-list-no {