我的礼包和礼包列表分页实现

前端研发-钱巧玲
1 parent 8ed9ba58
Showing 10 changed files with 418 additions and 340 deletions
pages/giftpack/buygiftpack/giftpackbuy.js
pages/giftpack/buygiftpack/giftpackbuy.json
pages/giftpack/buygiftpack/giftpackbuy.wxml
pages/giftpack/buygiftpack/giftpackbuy.wxss
pages/giftpack/giftpacklist/giftpacklist.js
pages/giftpack/giftpacklist/giftpacklist.wxml
pages/giftpack/mygiftpack/mygiftpack.js
pages/giftpack/mygiftpack/mygiftpack.wxml
pages/giftpack/mygiftpack/mygiftpack.wxss
pages/user/index/index.wxml
+var i = require("../../../utils/util.js");
 var e = getApp(),
   a = e.globalData.setting,
   os = a,
@@ -12,14 +13,18 @@ Page({
     wareCard: [],
     page: 0,
     pageSize: 10,
-    isEmpty: true,
+    isEmpty: false,
     loadingType: 0, //定义加载方式 0---contentdown  1---contentrefresh 2---contentnomore
     contentText: {
       contentdown: '加载更多',
       contentrefresh: '加载中...',
       contentnomore: '已加载全部'
     },
-    is_read:0,//礼包列表是否全部加载完毕
+    ismore: 0, //数据是否全部加载完成
+    is_read: 0, //是否查询过我的礼包接口
+    curpage: 1, //当前分页数
+    pageSize: 3, //页大小
+    total: 0, //总数量
   },
   onLoad: function(options) {
     var th = this;
@@ -27,10 +32,7 @@ Page({
     my_confirm.open_cancel(0);
     th.setData({
       getStorageID: a.stoid,
-      getUserID: d.user_id,
-      pages: 1,
-      pageSize: 10,
-      loadingType: 0
+      getUserID: d.user_id
     })
     th.getList();
   },
@@ -47,7 +49,7 @@ Page({
   GetBuyPrice: function(e) {
     var that = this.data;
     var th = this;
-    var id = e.currentTarget.dataset.id;//活动id
+    var id = e.currentTarget.dataset.id; //活动id
     var my_confirm = th.selectComponent("#my_confirm"); //组件的id
     my_confirm.open(
       "是否确定购买该礼包",
@@ -76,20 +78,20 @@ Page({
           header: {
             'content-type': 'application/json'
           }, // 设置请求的 header
-          success: function (res) {
+          success: function(res) {
             if (res.data.code == 0) {
-              res=res.data.data;
+              res = res.data.data;
               wx.requestPayment({
                 timeStamp: String(res.timeStamp),
                 nonceStr: res.nonceStr,
                 package: res.packageValue,
                 signType: res.signType,
                 paySign: res.paySign,
-                success: function (n) {
-                        
+                success: function(n) {
+
                 },
-                fail: function (n) {
-                  
+                fail: function(n) {
+
                 }
               });
             } else {
@@ -108,7 +110,7 @@ Page({
   GetBuyIntegral: function(e) {
     var that = this.data;
     var th = this;
-    var id = e.currentTarget.dataset.id;//活动id
+    var id = e.currentTarget.dataset.id; //活动id
     var my_confirm = th.selectComponent("#my_confirm"); //组件的id
     my_confirm.open(
       "是否确定兑换该礼包",
@@ -136,7 +138,7 @@ Page({
           header: {
             'content-type': 'application/json'
           }, // 设置请求的 header
-          success: function (res) {
+          success: function(res) {
             if (res.data.code == 0) {
               getApp().my_warnning("兑换成功！", 1, th);
             } else {
@@ -147,59 +149,35 @@ Page({
       })
-
   },
   getList: function(e) {
-    var _this = this; //上拉加载
-    var that = this.data;
-    if (that.loadingType != 0) {
-      return false;
-    }
-    // that.loadingType = 1;
-    _this.setData({
-      loadingType: 1
-    })
+    var th = this;
     getApp().request.get('/api/weshop/marketing/giftbag/page', {
       data: {
-        "storeId": that.getStorageID, //商家ID
-        "userId": that.getUserID, //用户ID
-        "page": that.pages,
-        "pageSize": that.pageSize
+        storeId: th.data.getStorageID, //商家ID
+        userId: th.data.getUserID, //用户ID
+        page: th.data.pages,
+        pageSize: th.data.pageSize
       },
       success: function success(res) {
+        wx.hideLoading();
         if (res.data.code == 0) {
-          if (res.data.data.total > 0) {
-            _this.setData({
-              isEmpty: false
-            })
-          } else {
-            _this.setData({
-              isEmpty: true
-            })
-          }
-          if (res.data.data.pageData.length == 0) {
-            _this.setData({
-              loadingType: 2
-            })
-          } else {
-            var wareCard = that.wareCard;
-            var is_read = 0;
-            if (wareCard.length < res.data.data.total) {
-              for (var i = 0; i < res.data.data.pageData.length; i++) {
-                wareCard.push(res.data.data.pageData[i]);
-              }
-            }else{
-              is_read:1
-            }
-            _this.setData({
-              wareCard: wareCard,
-              is_read: is_read,
-              loadingType: 0
-            })
-
-          }
+          th.data.curpage++;
+          var arr1 = th.data.wareCard;
+          var arr2 = res.data.data.pageData;
+          var arr3 = [...arr1, ...arr2];
+          var ismore = 0;
+          if (arr3.length == res.data.data.total) ismore = 1
+          th.setData({
+            wareCard: arr3,
+            total: res.data.data.total,
+            ismore: ismore,
+            is_read: 1
+          }), wx.stopPullDownRefresh(); //停止下拉刷新
         } else {
-          getApp().my_warnning(res.data.msg, 0, _this);
+          th.setData({
+            is_read: 1
+          })
         }
       }
     })
@@ -215,11 +193,22 @@ Page({
     });
   },
   //不销毁界面跳转
-  navigateTo:function(e){
+  navigateTo: function(e) {
     var th = this;
     var url = e.currentTarget.dataset.url;
     wx.navigateTo({
       url: url,
     })
-  }
+  },
+  //下拉事件
+  onReachBottom: function() {
+    var th = this;
+    if (th.data.total <= th.data.pageSize) return;
+    if (th.data.ismore) return;
+    wx.showLoading({
+      title: '加载中...',
+    })
+    th.getList();
+  },
+
 })
 \ No newline at end of file
 {
   "navigationBarTitleText": "礼包列表",
   "navigationStyle": "custom",
+  "enablePullDownRefresh": false,
   "usingComponents": {
     "warn": "/components/long_warn/long_warn",
     "my_confirm": "/components/my_confirm/my_confirm"
@@ -21,7 +21,7 @@
           <view class="content_ware_title">
             <text bindtap="__e">{{items.giftTitle}}</text>
           </view>
-          <view class="content_ware_type">
+          <view class="content_ware_type flex">
             <block wx:if="{{items.payMoney>0}}">
               <text>{{"￥"+items.payMoney}}</text>
             </block>
@@ -34,19 +34,20 @@
                 <view>积分</view>
               </view>
             </block>
-            </view>
-            <view class="content_ware_price">
-              <text class="ellipsis-1">{{"原价:￥"+items.giftPosPrice}}</text>
-            </view>
-            <view class="content_ware_time">
-              <text class="ellipsis-1">{{"活动时间:"+items.endTime}}</text>
-            </view>
           </view>
-        </view>
-        <view class="content_box_button">
-          <view class="box_button_remark">
-            <text>{{"已售:"+items.giftQty+"件"}}</text>
+          <view class="content_ware_price">
+            <text class="ellipsis-1">{{"原价:￥"+items.giftPosPrice}}</text>
+          </view>
+          <view class="content_ware_time">
+            <text class="ellipsis-1">{{"活动时间:"+items.endTime}}</text>
           </view>
+        </view>
+      </view>
+      <view class="content_box_button">
+        <view class="box_button_remark">
+          <text>{{"已售:"+items.giftQty+"件"}}</text>
+        </view>
+        <view class="flex-vertical">
           <block wx:if="{{items.payMoney>0}}">
             <view class="box_button_buy" bindtap="GetBuyPrice" data-id="{{items.lbId}}">
               <button>立即购买</button>
@@ -59,8 +60,9 @@
           </block>
         </view>
       </view>
+    </view>
   </block>
-  <block wx:if="{{isEmpty==true && wareCard.length<2}}">
+  <block wx:if="{{is_read && wareCard.length<1}}">
     <view class="foot_empty">
       <view>
         <image src="{{iurl+'/miniapp/images/giftbag/gift07.png'}}" lazy-load="true"></image>
@@ -73,10 +75,13 @@
       </view>
     </view>
   </block>
-  <view wx:if="{{is_read}}" class="foot_box">
-    <text>———— 到底了 ————</text>
-  </view>
+  <!-- 加载完毕并且数据大于=页大小 -->
+  <view class="After_all flex-center" wx:if="{{ismore && wareCard.length>=3}}">
+    <view class="Line"></view>
+    <view class="end fs26">到底了</view>
+    <view class="Line"></view>
   </view>
-  <!-- 引入提示组件 -->
-  <warn id="warn"></warn>
-  <my_confirm id="my_confirm"></my_confirm>
 \ No newline at end of file
+</view>
+<!-- 引入提示组件 -->
+<warn id="warn"></warn>
+<my_confirm id="my_confirm"></my_confirm>
 \ No newline at end of file
@@ -29,6 +29,7 @@ page {
   margin: 0rpx 20rpx 0rpx 20rpx;
   -webkit-align-content: center;
   align-content: center;
+  margin-bottom: 10rpx;
 }
 .top_title_box {
@@ -60,8 +61,9 @@ page {
 .content_box {
   background-color: #fff;
-  margin: 10rpx 20rpx 0rpx 20rpx;
+  margin: 0rpx 20rpx;
   border-radius: 10rpx;
+  margin-bottom: 10rpx;
 }
 .content_box_ware {
@@ -149,7 +151,7 @@ page {
 }
 .box_button_remark {
-  margin-left: 5rpx;
+ 
 }
 .box_button_remark text {
@@ -162,24 +164,20 @@ page {
   width: 160rpx;
   height: 50rpx;
   font-size: 20rpx;
-  background: #d41c34;
-  color: #fff;
+  background: #fff;
+  color: #000;
   line-height: 50rpx;
 }
-.box_button_dui {
-  text-align: right;
-  margin: 22rpx 25rpx 0rpx 0rpx;
-}
-
 .box_button_dui button {
   display: inline-block;
   width: 160rpx;
   height: 50rpx;
   font-size: 20rpx;
-  background: #fff;
-  color: #000;
+  background: #d41c34;
+  color: #fff;
   line-height: 50rpx;
+  margin-left: 20rpx;
 }
 .foot_box {
@@ -229,3 +227,17 @@ page {
   font-size: 28rpx;
   color: #fff;
 }
+.After_all {
+  height: 80rpx;
+  margin-bottom: 10rpx;
+  color: rgb(255, 255, 255);
+}
+
+.After_all .Line {
+  border-top: 3rpx solid rgb(255, 255, 255);
+  width: 130rpx;
+}
+
+.After_all .end {
+  margin: 0rpx 15rpx;
+}
 \ No newline at end of file
@@ -33,20 +33,26 @@ Page({
       getGiftID: options.lbId,
       orderSn: options.orderSn
     })
-  },
-  onShow: function() {
-    var th = this;
-    if (th.data.isBuy == 0) {
+    if (options.isBuy == 0) {
       th.GetMyGiftList();
     } else {
       th.GetBuyGiftList();
     }
-
-    // this.giftRemark = this.giftRemark.replace(/<p><img/gi, "<p class='img'><img");
     th.setData({
       giftRemark: th.data.giftRemark.replace(/<p><img/gi, "<p class='img'><img")
     })
   },
+  onShow: function() {
+    // var th = this;
+    // if (th.data.isBuy == 0) {
+    //   th.GetMyGiftList();
+    // } else {
+    //   th.GetBuyGiftList();
+    // }
+    // th.setData({
+    //   giftRemark: th.data.giftRemark.replace(/<p><img/gi, "<p class='img'><img")
+    // })
+  },
   GetBuyPrice: function (e) {
     var that = this.data;
     var th = this;
@@ -63,7 +63,7 @@
             <text class="data-v-3a5b7e36"></text>
           </view>
           <view class="box_ware_item_qty data-v-3a5b7e36">
-            <text class="data-v-3a5b7e36">{{"数量:"+item.num}}</text>
+            <text class="data-v-3a5b7e36 ellipsis-1">{{"数量:"+item.num}}</text>
           </view>
           <view class="box_ware_code data-v-3a5b7e36">
             <block wx:if="{{isBuy==0&item.lbType==1}}">
@@ -71,7 +71,7 @@
             </block>
             <block wx:if="{{isBuy==0&item.lbType==2}}">
               <image src="{{iurl+'/miniapp/images/giftbag/gift06.png'}}" bindtap="__e" class="data-v-3a5b7e36" lazy-load="true"></image>
-            </block>
+            </block> 
             <block wx:if="{{isBuy==0&item.lbType==3}}">
               <image src="{{iurl+'/miniapp/images/giftbag/gift06.png'}}" bindtap="__e" class="data-v-3a5b7e36" lazy-load="true"></image>
             </block>
+var i = require("../../../utils/util.js")
 var e = getApp(),
   a = e.globalData.setting,
   os = a,
@@ -6,20 +7,24 @@ var e = getApp(),
 Page({
   data: {
     iurl: a.imghost, //图片前缀网址
-    getDate: new Date().getTime(),
+    getDate: "",
     getStorageID: '',
     getUserID: '',
     wareCard: [],
     pages: 0,
     pageSize: 10,
-    isEmpty: true,
+    isEmpty: false,
     loadingType: 0, //定义加载方式 0---contentdown  1---contentrefresh 2---contentnomore
     contentText: {
       contentdown: '加载更多',
       contentrefresh: '加载中...',
       contentnomore: '已加载全部'
     },
-    is_resad:0,//数据是否全部加载完成
+    ismore:0,//数据是否全部加载完成
+    is_read:0,//是否查询过我的礼包接口
+    curpage: 1, //当前分页数
+    pageSize: 3, //页大小
+    total: 0, //总数量
   },
   onLoad: function(options) {
@@ -30,8 +35,9 @@ Page({
       getStorageID: a.stoid,
       getUserID: d.user_id,
       pages: 1,
-      pageSize: 10,
-      loadingType: 0
+      pageSize: 3,
+      loadingType: 0,
+      getDate: i.formatTime(new Date().getTime())
     })
     th.getList();
   },
@@ -65,93 +71,91 @@ Page({
   //   },
   getList: function() {
-    var _this = this; //上拉加载
-    var that = this.data;
-    if (that.loadingType != 0) {
-      return false;
-    }
-    // that.loadingType = 1;
-    _this.setData({
-      loadingType: 1
-    })
+    var th = this;
+    // if (th.data.loadingType) {
+    //   return false;
+    // }
+    // // that.loadingType = 1;
+    // th.setData({
+    //   loadingType: 1
+    // })
     getApp().request.get('/api/weshop/marketing/my/giftbag/page', {
       data: {
         // "storeId": this.getStorageID, //商家ID
         // "userId": this.getUserID, //用户ID
         // "page": this.pages,
         // "pageSize": this.pageSize
-        "storeId": that.getStorageID, //商家ID
-        "userId": that.getUserID, //用户ID
-        "page": that.pages,
-        "pageSize": that.pageSize
+        storeId: th.data.getStorageID, //商家ID
+        userId: th.data.getUserID, //用户ID
+        page: th.data.curpage,
+        pageSize: th.data.pageSize
       },
       success: function success(res) {
+        wx.hideLoading();
         if (res.data.code == 0) {
-          console.log(res.data.data);
-          if (res.data.data.total > 0) {
-            // _this.isEmpty = false;
-            _this.setData({
-              isEmpty: false
-            })
-          } else {
-            // _this.isEmpty = true;
-            _this.setData({
-              isEmpty: true
-            })
-          }
-          if (res.data.data.pageData.length == 0) {
-            // _this.loadingType = 2;
-            _this.setData({
-              loadingType: 2
-            })
-          } else {
-            var wareCard = that.wareCard;
-            var is_resad = 0;
-            // if (_this.wareCard.length < res.data.data.pageData.length) {
-            if (wareCard.length < res.data.data.total) {
-              for (var i = 0; i < res.data.data.pageData.length; i++) {
-                wareCard.push(res.data.data.pageData[i]);
-              }
-            }else{
-              is_resad=1
-            }
-            _this.setData({
-              wareCard: wareCard,
-              is_resad: is_resad
-            })
-
-            // _this.loadingType = 0;
-            _this.setData({
-              loadingType: 0
-            })
-          }
+          th.data.curpage++;
+          var arr1 = th.data.wareCard;
+          var arr2 = res.data.data.pageData;
+          var arr3 = [...arr1, ...arr2];
+          var ismore = 0;
+          if (arr3.length == res.data.data.total) ismore = 1
+          th.setData({
+            wareCard: arr3,
+            total: res.data.data.total,
+            ismore: ismore,
+            is_read:1
+          }), wx.stopPullDownRefresh(); //停止下拉刷新
         } else {
- 
+          th.setData({
+            is_read: 1
+          })
         }
+       // if (res.data.code == 0) {
+        //   if (res.data.data.total > 0) {
+        //     // _this.isEmpty = false;
+        //     _this.setData({
+        //       isEmpty: false
+        //     })
+        //   } else {
+        //     // _this.isEmpty = true;
+        //     _this.setData({
+        //       isEmpty: true
+        //     })
+        //   }
+        //   if (res.data.data.pageData.length == 0) {
+        //     // _this.loadingType = 2;
+        //     _this.setData({
+        //       loadingType: 2
+        //     })
+        //   } else {
+        //     var wareCard = that.wareCard;
+        //     var is_resad = 0;
+        //     // if (_this.wareCard.length < res.data.data.pageData.length) {
+        //     if (wareCard.length < res.data.data.total) {
+        //       for (var i = 0; i < res.data.data.pageData.length; i++) {
+        //         wareCard.push(res.data.data.pageData[i]);
+        //       }
+        //     }else{
+        //       is_resad=1
+        //     }
+        //     _this.setData({
+        //       wareCard: wareCard,
+        //       is_resad: is_resad
+        //     })
+
+        //     // _this.loadingType = 0;
+        //     _this.setData({
+        //       loadingType: 0
+        //     })
+        //   }
+        // } else {
+
+        // }
       }
+      
     });
   },
-  TimeToDate: function(num) { //时间戳数据处理 是按秒来转换
-    var date = new Date(num * 1000);
-    //时间戳为10位需*1000，时间戳为13位的话不需乘1000
-    var y = date.getFullYear();
-    var MM = date.getMonth() + 1;
-    MM = MM < 10 ? '0' + MM : MM; //月补0
-    var d = date.getDate();
-    d = d < 10 ? '0' + d : d; //天补0
-    var h = date.getHours();
-    h = h < 10 ? '0' + h : h; //小时补0
-    var m = date.getMinutes();
-    m = m < 10 ? '0' + m : m; //分钟补0
-    var s = date.getSeconds();
-    s = s < 10 ? '0' + s : s; //秒补0
-    return y + '-' + MM + '-' + d + ' ' + h + ':' + m + ':' + s;
-  },
-  DateToTime: function DateToTime(TimeNum) { //时间转换成时间戳
-    var Time = new Date(TimeNum);
-    return Time.getTime() / 1000;
-  },
   //销毁界面跳转
   redirectTo: function (e) {
     var th = this;
@@ -168,6 +172,16 @@ Page({
     wx.navigateTo({
       url: url,
     })
-  }
+  },
+  //下拉事件
+  onReachBottom: function () {
+    var th = this;
+    if (th.data.total <= th.data.pageSize) return;
+    if (th.data.ismore) return;
+    wx.showLoading({
+      title: '加载中...',
+    })
+    th.getList();
+  },
 });
 \ No newline at end of file
 <view class="top_img">
   <view class="top_img">
     <!-- <image src="{{$GetInfo.imgHttp+'/miniapp/images/giftbag/gift00.jpg'}}"></image> -->
-    <image src="{{iurl+'/miniapp/images/giftbag/gift00.jpg'}}"></image>
+    <image src="{{iurl+'/miniapp/images/giftbag/gift00.jpg'}}" lazy-load="true"></image>
   </view>
   <view class="top_title">
     <view class="top_title_box">
@@ -20,7 +20,7 @@
           <image src="{{iurl+item.lbUrl}}" lazy-load="true"></image>
           <block wx:if="{{item.actType!=0}}">
             <view class="{{[item.actType==1?'content_box_img_title content_box_img_ground1':item.actType==2?'content_box_img_title content_box_img_ground2':item.actType==4?'content_box_img_title content_box_img_ground3':'content_box_img_title content_box_img_ground4']}}">
-              <image src="{{iurl+'/miniapp/images/giftbag/gift01.png'}}"></image>
+              <image src="{{iurl+'/miniapp/images/giftbag/gift01.png'}}" lazy-load="true"></image>
               <!-- <block wx:if="{{item.$orig.actType==1}}"> -->
               <block wx:if="{{item.actType==1}}">
                 <text>新人有礼</text>
@@ -71,10 +71,9 @@
             <text>{{"原价:￥"+item.giftPosPrice}}</text>
           </view>
           <view class="content_ware_time">
-            <!-- <block wx:if="{{getDate>item.endTime}}"> -->
-            <!-- <text>{{"兑换截至日期:"+item.endTime}}</text> -->
-            <text>{{"兑换截至日期:"+getDate}}</text>
-            <!-- </block> -->
+            <block wx:if="{{getDate>item.endTime}}">
+            <text>{{"兑换截至日期:"+item.endTime}}</text>
+            </block>
             <block wx:if="{{getDate<item.starTime}}">
               <text>{{"距兑换开始时间: "+item.starTime}}</text>
             </block>
@@ -86,7 +85,7 @@
       </view>
     </view>
   </block>
-  <block wx:if="{{isEmpty==true}}">
+  <block wx:if="{{is_read && wareCard.length<1}}">
     <view class="foot_empty">
       <view>
         <image src="{{iurl+'/miniapp/images/giftbag/gift07.png'}}" lazy-load="true"></image>
@@ -99,10 +98,16 @@
       </view>
     </view>
   </block>
-  <block wx:if="{{is_resad}}">
-  <view class="foot_box">
+  <block wx:if="{{ismore}}">
+  <!-- <view class="foot_box">
     <text>———— 到底了 ————</text>
-  </view>
+  </view> -->
+    <!-- 加载完毕并且数据大于=页大小 -->
+    <view class="After_all flex-center" wx:if="{{ismore && wareCard.length>=3}}">
+      <view class="Line"></view>
+      <view class="end fs26">到底了</view>
+      <view class="Line"></view>
+    </view>
   </block>
 </view>
 <!-- 引入提示组件 -->
-
-
 /*引用样式路径*/
 @charset "UTF-8";
+
 /* Author XGQ
  * 2019-11-12
  */
+
 .top_img {
-	-webkit-align-content: center;
-	        align-content: center;
+  -webkit-align-content: center;
+  align-content: center;
 }
+
 .top_img image {
-	width: 100%;
-	height: 660rpx;
+  width: 100%;
+  height: 660rpx;
 }
+
 .top_title {
-	display: -webkit-box;
-	display: -webkit-flex;
-	display: flex;
-	background-color: #FFFFFF;
-	height: 85rpx;
-	border-radius: 10rpx 10rpx 0rpx 0rpx;
-	margin: 0rpx 20rpx 0rpx 20rpx;
-	-webkit-align-content: center;
-	        align-content: center;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: flex;
+  background-color: #fff;
+  height: 85rpx;
+  border-radius: 10rpx 10rpx 0rpx 0rpx;
+  margin: 0rpx 20rpx 0rpx 20rpx;
+  -webkit-align-content: center;
+  align-content: center;
+  margin-bottom: 10rpx;
 }
+
 .top_title_box {
-	width: 49%;
-	-webkit-align-content: center;
-	        align-content: center;
-	text-align: center;
-	padding: 15rpx;
+  width: 49%;
+  -webkit-align-content: center;
+  align-content: center;
+  text-align: center;
+  padding: 15rpx;
 }
+
 .top_title_box_S {
-	width: 1%;
-	-webkit-align-content: center;
-	        align-content: center;
-	text-align: center;
-	margin: 20rpx 0rpx 20rpx 0rpx;
-	border-left: #000000 solid 3rpx;
+  width: 1%;
+  -webkit-align-content: center;
+  align-content: center;
+  text-align: center;
+  margin: 20rpx 0rpx 20rpx 0rpx;
+  border-left: #000 solid 3rpx;
 }
+
 .top_title_redtext {
-	font-size: 30rpx;
-	color: #d61b30;
+  font-size: 30rpx;
+  color: #d61b30;
 }
+
 .top_title_blacktext {
-	font-size: 30rpx;
-	color: #000000;
+  font-size: 30rpx;
+  color: #000;
 }
+
 .content_box {
-	background-color: #FFFFFF;
-	height: 375rpx;
-	margin: 10rpx 20rpx 0rpx 20rpx;
-	border-radius: 10rpx;
+  background-color: #fff;
+  height: 375rpx;
+  margin: 0rpx 20rpx;
+  border-radius: 10rpx;
+  margin-bottom: 10rpx;
 }
+
 .content_box_ware {
-	border-bottom: #f5f5f5 solid 2rpx;
-	display: -webkit-box;
-	display: -webkit-flex;
-	display: flex;
+  border-bottom: #f5f5f5 solid 2rpx;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: flex;
 }
+
 .content_box_img {
-	margin: 20rpx 20rpx 20rpx 25rpx;
-	width: 35%;
-	display: -webkit-box;
-	display: -webkit-flex;
-	display: flex;
-	font-size: 8rpx;
-	position: relative;
+  margin: 20rpx 20rpx 20rpx 25rpx;
+  width: 35%;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: flex;
+  font-size: 8rpx;
+  position: relative;
 }
+
 .content_box_img image {
-	width: 100%;
-	height: 230rpx;
+  width: 100%;
+  height: 230rpx;
 }
+
 .content_box_img_title {
-	position: absolute;
-	background: #D01119;
-	display: -webkit-box;
-	display: -webkit-flex;
-	display: flex;
-	padding: 8rpx;
-	border-radius: 0rpx 0rpx 10rpx 0rpx;
+  position: absolute;
+  background: #d01119;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: flex;
+  padding: 8rpx;
+  border-radius: 0rpx 0rpx 10rpx 0rpx;
 }
-.content_box_img_ground1{
-	background: #fb6451;
+
+.content_box_img_ground1 {
+  background: #fb6451;
 }
-.content_box_img_ground2{
-	background: #ffb72d;
+
+.content_box_img_ground2 {
+  background: #ffb72d;
 }
-.content_box_img_ground3{
-	background: #9be0e5;
+
+.content_box_img_ground3 {
+  background: #9be0e5;
 }
-.content_box_img_ground4{
-	background: #4784ef;
+
+.content_box_img_ground4 {
+  background: #4784ef;
 }
+
 .content_box_img_title image {
-	width: 30rpx;
-	height: 30rpx;
+  width: 30rpx;
+  height: 30rpx;
 }
+
 .content_box_img_title text {
-	font-size: 20rpx;
-	color: #FFFFFF;
-	line-height: 25rpx;
-	padding-top: 5rpx;
+  font-size: 20rpx;
+  color: #fff;
+  line-height: 25rpx;
+  padding-top: 5rpx;
 }
+
 .content_box_title {
-	width: 65%;
-	margin: 25rpx 25rpx 10rpx 0rpx;
-	position: relative;
+  width: 65%;
+  margin: 25rpx 25rpx 10rpx 0rpx;
+  position: relative;
 }
+
 .content_ware_title {
-	font-size: 30rpx;
-	word-break: break-all;
-	/*属性规定自动换行的处理方法。normal(使用浏览器默认的换行规则。),break-all(允许在单词内换行。),keep-all(只能在半角空格或连字符处换行。)*/
-	text-overflow: ellipsis;
-	display: -webkit-box;
-	/** 对象作为伸缩盒子模型显示 **/
-	-webkit-box-orient: vertical;
-	/** 设置或检索伸缩盒对象的子元素的排列方式 **/
-	-webkit-line-clamp: 2;
-	/** 显示的行数 **/
-	overflow: hidden;
-	/** 隐藏超出的内容 **/
+  font-size: 30rpx;
+  word-break: break-all;
+  /*属性规定自动换行的处理方法。normal(使用浏览器默认的换行规则。),break-all(允许在单词内换行。),keep-all(只能在半角空格或连字符处换行。)*/
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  /** 对象作为伸缩盒子模型显示 **/
+  -webkit-box-orient: vertical;
+  /** 设置或检索伸缩盒对象的子元素的排列方式 **/
+  -webkit-line-clamp: 2;
+  /** 显示的行数 **/
+  overflow: hidden;
+  /** 隐藏超出的内容 **/
 }
+
 .content_ware_type {
-	font-size: 28rpx;
-	color: #c61a34;
-	margin-top: 10rpx;
-	position: absolute;
-	left: 0;
-	bottom: 100rpx;
+  font-size: 28rpx;
+  color: #c61a34;
+  margin-top: 10rpx;
+  position: absolute;
+  left: 0;
+  bottom: 100rpx;
 }
+
 .content_ware_price {
-	font-size: 20rpx;
-	color: #b9b5b5;
-	margin-top: 2rpx;
-	text-decoration: line-through;
-    position: absolute;
-    left: 0;
-    bottom: 70rpx;
+  font-size: 20rpx;
+  color: #b9b5b5;
+  margin-top: 2rpx;
+  text-decoration: line-through;
+  position: absolute;
+  left: 0;
+  bottom: 70rpx;
 }
+
 .content_ware_time {
-	font-size: 25rpx;
-	color: #c61a34;
-	margin-top: 20rpx;
-	position: absolute;
-	left: 0;
-	bottom: 25rpx;
+  font-size: 25rpx;
+  color: #c61a34;
+  margin-top: 20rpx;
+  position: absolute;
+  left: 0;
+  bottom: 25rpx;
 }
+
 .content_box_button {
-	text-align: right;
-	margin: 20rpx 25rpx 20rpx 20rpx;
+  text-align: right;
+  margin: 20rpx 25rpx 20rpx 20rpx;
 }
+
 .content_box_button button {
-	display: inline-block;
-	width: 160rpx;
-	height: 50rpx;
-	font-size: 25rpx;
-	background: #d41c34;
-	color: #FFFFFF;
-	line-height: 50rpx;
+  display: inline-block;
+  width: 160rpx;
+  height: 50rpx;
+  font-size: 25rpx;
+  background: #d41c34;
+  color: #fff;
+  line-height: 50rpx;
 }
+
 .foot_box {
-	-webkit-align-content: center;
-	        align-content: center;
-	text-align: center;
-	margin-top: 15rpx;
-	margin-bottom: 50rpx;
+  -webkit-align-content: center;
+  align-content: center;
+  text-align: center;
+  margin-top: 15rpx;
+  margin-bottom: 50rpx;
 }
+
 .foot_box text {
-	font-size: 25rpx;
-	color: #FFFFFF;
-}
-.foot_empty{
-	background-color: #FFFFFF;
-	height: 375rpx;
-	margin: 10rpx 20rpx 0rpx 20rpx;
-	border-radius: 10rpx;
-	text-align: center;
-	padding: 150rpx 0rpx 300rpx 0rpx;
-	-webkit-box-pack: center;
-	-webkit-justify-content: center;
-	        justify-content: center;
-}
-.foot_empty image{
-	width: 400rpx;
-	height: 273rpx;
-}
-.foot_empty text{
-	font-size: 30rpx;
-	color: #999999;
-}
-.foot_empty_button{
-	background: #ff6363;
-	margin: 60rpx 230rpx 0rpx 230rpx;
-	padding: 10rpx;
-	border-radius: 70rpx;
-    line-height: 40rpx;
-}
-.foot_empty_button text{
-	font-size: 28rpx;
-	color: #FFFFFF;
+  font-size: 25rpx;
+  color: #fff;
+}
+
+.foot_empty {
+  background-color: #fff;
+  height: 375rpx;
+  margin: 10rpx 20rpx 0rpx 20rpx;
+  border-radius: 10rpx;
+  text-align: center;
+  padding: 150rpx 0rpx 300rpx 0rpx;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
 }
+
+.foot_empty image {
+  width: 400rpx;
+  height: 273rpx;
+}
+
+.foot_empty text {
+  font-size: 30rpx;
+  color: #999;
+}
+
+.foot_empty_button {
+  background: #ff6363;
+  margin: 60rpx 230rpx 0rpx 230rpx;
+  padding: 10rpx;
+  border-radius: 70rpx;
+  line-height: 40rpx;
+}
+
+.foot_empty_button text {
+  font-size: 28rpx;
+  color: #fff;
+}
+
 page {
-	background-color: #fb7454;
+  background-color: #fb7454;
+}
+.After_all {
+  height: 80rpx;
+  margin-bottom: 10rpx;
+  color: rgb(255, 255, 255);
+}
+
+.After_all .Line {
+  border-top: 3rpx solid rgb(255, 255, 255);
+  width: 130rpx;
+}
+
+.After_all .end {
+  margin: 0rpx 15rpx;
 }
@@ -216,14 +216,12 @@
 					<image class="xc-center-img " src="{{iurl}}/miniapp/images/yyservice/myservice.png"></image>
 					<view class="four-level-word">我的服务</view>
 				</view>
-        <view class="item t-c" data-url="/pages/giftpack/buygiftpack/giftpackbuy" bindtap="goto">
+        <view class="item t-c" data-url="/pages/giftpack/mygiftpack/mygiftpack" bindtap="goto">
 					<image class="xc-center-img " src="{{iurl}}/miniapp/images/yyservice/myservice.png"></image>
 					<view class="four-level-word">我的礼包</view>
 				</view>
       </view>
-
-
     </view>
   </view>
   <view style='width:100%;height:73rpx;'>