[新增] 全局获取手机信息的方法，并导出屏幕各个部位可用高度

[优化] 首页可滑动页面切换tab

App.vue

@@ -1,10 +1,16 @@
 <script>
 	export default {
 		globalData: {
-			wxlogin: () => {}
+			wxlogin: () => {}, // 登录方法
+			screenWidth: 0, // 屏幕宽度
+			statusBarH: 0, // 状态栏的高度
+			screenHeight: 0, // 屏幕高度
+			customBarH: 0, // 标题导航栏高度
+			windowHeight: 0, // 窗口可用高度，窗口总高度 - 状态栏的高度
 		},
 		onLaunch: function() {
 			this.disableConsole();
+			this.getSystemInfo();
 			this.getUserInfo();
 		},
 		onShow: function() {
@@ -13,6 +19,28 @@
 			// #endif
 		},
 		methods: {
+			// 获取手机设备信息
+			getSystemInfo(){
+				let res = uni.getSystemInfoSync();
+				this.globalData.screenWidth = res.screenWidth;
+				this.globalData.statusBarH = res.statusBarHeight;
+				this.globalData.screenHeight = res.screenHeight;
+				this.globalData.customBarH = res.statusBarHeight + 45;
+				this.globalData.windowHeight = res.windowHeight - (res.statusBarHeight - 20);
+				// #ifdef MP
+				setTimeout(() => {
+					let custom = uni.getMenuButtonBoundingClientRect()
+					this.globalData.customBarH = custom.bottom + custom.top - res.statusBarHeight;
+				
+					if (this.globalData.customBarH <= 0) {
+						this.globalData.customBarH = 40 + this.globalData.statusBarH;
+					}
+				}, 30);
+				// #endif 
+				// #ifdef MP-ALIPAY  
+				this.globalData.customBarH = res.statusBarHeight + res.titleBarHeight;
+				// #endif  
+			},
 			// 获取用户信息
 			getUserInfo(){
 				this.globalData.wxlogin = this.wxlogin;

pages/index/index.vue

@@ -3,7 +3,9 @@
 		<view class="ctab" v-if="tab_list.length">
 			<u-tabs :list="tab_list" :is-scroll="true" :show-bar="false" :current="current" @change="change"></u-tabs>
 		</view>
-		<view class="com" v-for="(tab, tabIndex) in tab_list" v-if="tabIndex == current" :key="tab.id">
+		<swiper :style="{height: 'calc('+ windowHeight +'px - 110rpx)', width: '750rpx'}" :current="current" @change="swiperChange">
+			<swiper-item v-for="(tab, tabIndex) in tab_list" :key="tabIndex">
+				<scroll-view class="com" :scroll-y="true" :refresher-enabled="true" :refresher-triggered="isRefresher" @scrolltolower="onScrolltolower" @refresherrefresh="onRefresherrefresh">
 					<view class="lf-row-between list" v-for="(item, index) in tab.list" :key="item.id" @click="toDetail(item)">
 						<view class="left">
 							<image :src="item.cover" mode="aspectFill"></image>
@@ -31,14 +33,16 @@
 							</view>
 						</view>
 					</view>
-			<!-- 加载 -->
+					<!-- 空数据的情况 -->
 					<view class="loading-more">
 						<text v-if="tab.list.length" :class="{'loading-more-text': tab.loadingClass}">{{ tab.loadingText }}</text>
 						<my-nocontent v-else></my-nocontent>
 					</view>
 					<!-- 回到顶部 -->
 					<u-back-top :scroll-top="pageScrollTop" :custom-style="{background: 'rgba(51, 51 51, 0.3)'}"></u-back-top>
-		</view>
+				</scroll-view>
+			</swiper-item>
+		</swiper>
 	</view>
 </template>
 
@@ -49,10 +53,13 @@
 				tab_list: [],
 				current: 0, // tab下表
 				pageSize: 10,
-				shareInfo: {}
+				shareInfo: {},
+				windowHeight: 0, // 屏幕可用高度
+				isRefresher: false // scroll-view下拉刷新状态，当前默认没有触发
 			}
 		},
 		onLoad() {
+			this.windowHeight = getApp().globalData.windowHeight;
 			this.getCategoryList();
 			this.getShareInfo();
 		},
@@ -70,8 +77,12 @@
 					this.getGoodsList(); // tab下没有数据，请求第一页
 				}
 			},
+			// 滑块下标值变化
+			swiperChange(event){
+				this.current = event.detail.current;
+			},
 			// 获取分类tab
-			getCategoryList(){
+			getCategoryList(options = {}){
 				this.$http(this.API.API_CATEGORY_LIST).then(res => {
 					let res_list = res.data || [];
 					let tab_list = res_list.map(item => {
@@ -85,7 +96,12 @@
 							page: 1,
 							isPage: true
 						}
-					})
+					});
+					if(options.type == 'pageRefresh'){
+						uni.stopPullDownRefresh();
+					}else if(options.type == 'scrollRefresh'){
+						this.isRefresher = false;
+					}
 					this.tab_list = tab_list;
 					this.getGoodsList();
 				})
@@ -116,18 +132,25 @@
 			// 去到详情页
 			toDetail(item){
 				this.$url('/pages/goodsDetail/index?id='+ item.id);
-			}
 			},
-		onReachBottom(){
+			// 页面触底，加载下一页
+			onScrolltolower(){
 				let tab_item = this.tab_list[this.current];
 				if(tab_item.isPage){
 					tab_item.page = tab_item.page + 1;
 					this.getGoodsList();
 				}
 			},
+			// scroll-view 下拉刷新
+			onRefresherrefresh(){
+				this.isRefresher = true;
+				this.getCategoryList({type: 'scrollRefresh'});
+			}
+		},
+		// page 下拉刷新
 		onPullDownRefresh(){
 			// 新版逻辑，刷新则整个数据全部重新获取
-			this.getCategoryList();
+			this.getCategoryList({type: 'pageRefresh'});
 			
 			// 旧版逻辑，刷新只刷tab下的商品列表
 			// let tab_item = this.tab_list[this.current];
@@ -136,7 +159,6 @@
 			// tab_item.loadingClass = true;
 			// tab_item.loadingText = '正在加载中';
 			// this.getGoodsList();
-			uni.stopPullDownRefresh()
 		},
 		onShareAppMessage(){
 			let shareInfo = {
@@ -169,6 +191,7 @@
 	// 商品列表
 	.com{
 		width: 100%;
+		height: 100%;
 		overflow: hidden;
 		.list{
 			border-radius: 10rpx;