我的礼包

taiyuan
1 parent 6d3288d9
Showing 7 changed files with 459 additions and 7 deletions
app.json
app.wxss
packageA/pages/myGift/myGift.js
packageA/pages/myGift/myGift.json
packageA/pages/myGift/myGift.wxml
packageA/pages/myGift/myGift.wxss
utils/filter.wxs
@@ -137,8 +137,9 @@
 				 "pages/my_service/tment_order_list",
 				 "pages/my_service/beauty_deta",
 				 "pages/profile/profile",
-         "pages/parseHtml/parseHtml"
-         
+         "pages/parseHtml/parseHtml",
+         "pages/myGift/myGift",
+				 "pages/myGiftDetails/myGiftDetails"
       ]
  
   },
@@ -50,6 +50,11 @@
 .pdr40 {
 	padding-right: 40rpx;
 }
+
+.pdr80 {
+	padding-right: 80rpx;
+}
+
 .pdh10 {
 	padding-left: 10rpx;
 	padding-right: 10rpx;
@@ -58,9 +63,13 @@
 	padding-left: 20rpx;
 	padding-right: 20rpx;
 }
+.pdv10 {
+	padding-top: 10rpx;
+	padding-bottom: 10rpx;
+}
 .pdv20 {
-	padding-top: 30rpx;
-	padding-bottom: 30rpx;
+	padding-top: 20rpx;
+	padding-bottom: 20rpx;
 }
 .pdv30 {
 	padding-top: 30rpx;
@@ -140,6 +149,14 @@
 	font-weight: bold;
 }
  
+.mgl10 {
+	margin-left: 10rpx;
+}
+
+.mgb10 {
+	margin-bottom: 10rpx;
+}
+
 .mgl20 {
 	margin-left: 20rpx;
 }
@@ -635,6 +652,10 @@ background: #ffe3e2;
 	line-height: 1;
 }
  
+.lh {
+	line-height: 1.4;
+}
+
  
  
  
@@ -646,9 +667,9 @@ background: #ffe3e2;
 /* 图标字体(ty) */
 @font-face {
   font-family: 'iconfont';  /* Project id 2054717 */
-  src: url('//at.alicdn.com/t/font_2054717_hcnqrwwkh97.woff2?t=1620986106765') format('woff2'),
-       url('//at.alicdn.com/t/font_2054717_hcnqrwwkh97.woff?t=1620986106765') format('woff'),
-       url('//at.alicdn.com/t/font_2054717_hcnqrwwkh97.ttf?t=1620986106765') format('truetype');
+  src: url('//at.alicdn.com/t/font_2054717_f0lv6m3iryg.woff2?t=1621240949872') format('woff2'),
+       url('//at.alicdn.com/t/font_2054717_f0lv6m3iryg.woff?t=1621240949872') format('woff'),
+       url('//at.alicdn.com/t/font_2054717_f0lv6m3iryg.ttf?t=1621240949872') format('truetype');
 }
  
 .iconfont {
+// packageA//pages/myGift/myGift.js
+const app = getApp();
+let self = null;
+
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+		tabArr: ['礼包列表', '我的礼包'],
+		currentIndex: 0,
+		
+		list: null,
+		isLoading: false, // 检测是否已经发送请求,防止重复发送请求
+		noMore: false, // 检测是否有更多数据,true为没有更多数据,false为还有数据
+		pageNum: 1, // 当前页数
+  },
+	
+	clickTab(e) {
+		let index = e.target.dataset.index;
+		let url = '';
+		let data = {
+			store_id: app.globalData.setting.stoid,
+		};
+		
+		this.setData({
+			list: null,
+			pageNum: 1,
+			noMore: false,
+			currentIndex: index,
+		});
+		
+		if(index == 0) {
+			url = '/api/weshop/libao/libaoFormvip/page';
+			data.user_id = app.globalData.user_id;
+		} else if(index == 1) {
+			url = '/api/weshop/libao/libaoForm/page';
+		};
+		
+		this.getData(true, url, data);		
+	},
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+		self = this;
+		app.isLogin().then(function(data) {//进入页面前已经授权登录成功
+			self.setData({
+				userInfo: data,
+			});
+		});
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+		if(app.globalData.userInfo) {
+			if(!this.data.isLogin) {
+				this.setData({
+					userInfo: app.globalData.userInfo,
+					imghost: app.globalData.setting.imghost,
+					isLogin: true,
+				});
+				
+				this.getData(true, '/api/weshop/libao/libaoFormvip/page', {
+					store_id: app.globalData.setting.stoid,
+					user_id: app.globalData.user_id,
+				});				
+			};
+		};
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+		this.scrollToLower('/api/weshop/libao/libaoFormvip/page', {
+			store_id: app.globalData.setting.stoid,
+			user_id: app.globalData.user_id,
+		});
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+
+  },
+	
+	/**
+	 * 请求数据
+	 */
+	getData: function(isInit, url, data) {
+		app.request.promiseGet(url, {
+			data: data,
+			isShowLoading: true,
+		})
+		.then(function(res) {
+			if(res.data.code == 0) {
+				
+				self.setData({
+					isLoading: false
+				});
+				
+				if(isInit) {// 第一次加载
+					self.setData({
+						list: res.data.data
+					});
+				} else {
+					self.setData({
+						'list.pageData': self.data.list.pageData.concat(res.data.data.pageData)
+					});
+				};
+				
+				if((res.data.data.pageData.length == 0) || (res.data.data.pageSize * res.data.data.page >= res.data.data.total)) {
+					self.setData({
+						noMore: true
+					});
+				};
+				
+			} else {
+				self.setData({
+					'list.pageData': []
+				});
+			};
+			
+		})
+		.catch(function(err) {
+			console.log('出错拉！！！！',err);
+			self.setData({
+				'list.pageData': []
+			});
+		});
+	},
+	
+	
+	/**
+	 * 上拉加载
+	 */
+	scrollToLower(url, requestData) {
+		// 数据总量
+		let total = this.data.list.total;
+		// 单页最大数据量
+		let pageSize = this.data.list.pageSize;
+		// 如果数据总量不为0且小于或等于单页最大数据量，说明数据已全部加载，显示‘没有更多了’
+		if((total != 0)&&(total <= pageSize)) {
+			this.setData({
+				noMore: true
+			});
+		};
+		
+		if(!this.data.isLoading && !this.data.noMore) {
+			this.setData({
+				isLoading: true,
+				pageNum: this.data.pageNum + 1
+			});
+			requestData.page = this.data.pageNum;
+			this.getData(false, url, requestData);
+		};
+	},
+	
+	/**
+	 * 点击跳转
+	 */
+	goto(e) {
+		let url = '';
+		if(e.target.dataset.url) {
+			url = e.target.dataset.url;
+		} else {
+			url = e.currentTarget.dataset.url;
+		}
+		app.goto(url);
+	},
+})
 \ No newline at end of file
+{
+	"navigationBarTitleText": "我的礼包",
+	"enablePullDownRefresh": false,
+	"usingComponents": {
+		"warn": "/components/long_warn/long_warn",
+		"nav_b": "/components/nav_b/nav_b"
+	}
+}
 \ No newline at end of file
+<wxs module="filter" src="../../../utils/filter.wxs"></wxs>
+<view>
+	<view class="tab-title" bindtap="clickTab">
+		<view class="tab-title-item {{currentIndex == index ? 'active':''}}" wx:for="{{tabArr}}" data-index="{{index}}">{{item}}</view>
+	</view>
+	<view class="tab-content">
+		<block wx:if="{{currentIndex == 0}}">
+			<view class="tab-item" wx:for="{{list.pageData}}">
+				<!-- 图片 -->
+				<view class="img-container"><image src="{{imghost + item.lburl}}" class="img" mode="aspectFit"/></view>
+				<view class="desc-container">
+					<!-- 标题 -->
+					<view class="mgb10 ellipsis-2 lh taj">{{item.lbtitle}}</view>
+					<!-- 价格 -->
+					<view class="flex jc_sb ai-center pdb10">
+						<view class="flex ai-center">
+							<view class="c-red fs28"><text class="rmb">{{item.lbprice}}</text>/{{item.lbintegral}}积分</view>
+							<view class="fs22 c-a4 line-through mgl10">零售价{{item.oldprice}}</view>
+						</view>
+						<view class="fs24 c-a4">已售{{item.salenum}}件</view>
+					</view>
+					<!-- 时间 -->
+					<view class="date pdb20">活动截止日期{{filter.format_time(item.expdate)}}</view>
+					<!-- 按钮 -->
+					<view class="btn-container">
+						<view class="btn exchange">立即兑换</view>
+						<view class="btn buy">立即购买</view>
+					</view>
+				</view>
+			</view>
+		</block>
+		
+		<block wx:else>
+			<view class="tab-item flex pd20" wx:for="{{list.pageData}}">
+				<view class="img-container2"><image src="{{imghost + item.lburl}}" class="img" mode="aspectFit"/></view>
+				<view class="flex fdc jc_sb">
+					<view>
+						<!-- 标题 -->
+						<view class="mgb10 ellipsis-2 lh taj">{{item.lbtitle}}</view>
+						<!-- 时间 -->
+						<view class="date pdb20">活动截止日期{{filter.format_time(item.endtime)}}</view>
+					</view>
+					<!-- 说明 -->
+					<view class="c-red fs24">*请到线下门店兑换</view>
+				</view>
+			</view>
+		</block>
+		
+		<view class="noMore" hidden="{{!noMore}}" wx:if="{{list.pageData.length !== 0}}">—— 已经到底了 ——</view>
+	</view>
+</view>
+@charset "utf-8";
+
+.c-a4 {
+	color: #a4a4a4;
+}
+
+.c-red {
+	color: #FF6768;
+}
+
+.h88 {
+	height: 88rpx;
+}
+
+
+page {
+	background-color: #f0f0f0;
+}
+
+.tab-title {
+	display: flex;
+	position: sticky;
+	background-color: white;
+	top: 0;
+	font-size: 30rpx;
+}
+
+.tab-title::after {
+	position: absolute;
+	content: '';
+	width: 2rpx;
+	height: 40%;
+	background-color: #f0f0f0;
+	top: 0;
+	bottom: 0;
+	left: 0;
+	right: 0;
+	margin: auto;
+}
+
+.tab-title-item {
+	flex: 1;
+	text-align: center;
+	padding-top: 20rpx;
+	padding-bottom: 20rpx;
+	position: relative;
+}
+
+.tab-title-item.active {
+	color: #FF6768;
+	font-weight: bold;
+	
+}
+
+.tab-title-item::after {
+	position: absolute;
+	content: '';
+	left: 100%;
+	bottom: 0;
+	width: 0;
+	border-bottom: 2rpx solid #FF6768;
+	/* height: 3rpx; */
+	transition: 0.2s all linear;
+}
+
+.tab-title-item.active::after {
+	/* left: 100%; */
+	width: 100%;
+	left: 0;
+	/* background-color: #FF6768; */
+	/* transition-delay: 0.1s; */
+}
+
+.tab-title-item.active ~ .tab-title-item::after {
+	/* width: 100%; */
+	left: 0;
+}
+
+.tab-content {
+	padding-top: 20rpx;
+	padding-left: 20rpx;
+	padding-right: 20rpx;
+}
+
+.tab-item {
+	background-color: white;
+	border-radius: 10rpx;
+	overflow: hidden;
+}
+
+.tab-item ~ .tab-item {
+	margin-top: 20rpx;
+}
+
+.img-container {
+	background-color: #dedede;
+	height: 300rpx;
+}
+
+.img-container2 {
+	width: 200rpx;
+	height: 200rpx;
+	background-color: #dedede;
+	margin-right: 20rpx;
+	flex-shrink: 0;
+}
+
+.img {
+	display: block;
+	width: 100%;
+	height: 100%;
+}
+
+.desc-container {
+	padding: 20rpx;
+}
+
+
+
+.rmb::before {
+	content: '￥';
+}
+
+.date {
+	color: #a4a4a4;
+	font-size: 24rpx;
+}
+
+.btn-container {
+	display: flex;
+	justify-content: space-around;
+	font-size: 26rpx;
+}
+
+.btn {
+	padding: 20rpx;
+	flex: 1;
+	text-align: center;
+}
+
+.btn.exchange {
+	background-color: #FF6768;
+	color: white;
+}
+
+.btn.buy {
+	background-color: #FACAD6;
+	color: #FF6768;
+}
+
+.noMore {
+	padding: 20rpx;
+	color: #bbb;
+	text-align: center;
+	font-size: 22rpx;
+}
 \ No newline at end of file
@@ -118,6 +118,15 @@ var filters = {
 	},
  
  
+	in_arr: function(index, arr) {
+		if(arr.indexOf(index) != -1) {
+			return true;
+		} else {
+			return false;
+		};
+	},
+	
+	
  
  
 };
@@ -131,4 +140,5 @@ module.exports = {
 	show_gui_ge: filters.show_gui_ge,
 	show_default: filters.show_default,
 	status: filters.status,
+	in_arr: filters.in_arr,
 }
 \ No newline at end of file