fix: ui

pages/order-list/order-list.vue

@@ -21,7 +21,7 @@
 			@change="onFilterSwiperChange"
 		>
 			<swiper-item v-for="(item, index) in filterOptions" :key="item.value ?? 'all'" class="order-swiper-item">
-			<scroll-view v-if="filterIndex === index" scroll-y class="scroll-container" :style="scrollViewStyle" @scrolltolower="loadMore">
+			<scroll-view v-if="filterIndex === index" scroll-y class="scroll-container" @scrolltolower="loadMore">
 			<view v-if="orderList.length === 0 && !loading" class="empty-state">
 				<image class="empty-icon" src="/static/order.png" mode="aspectFit" alt="我的订单"></image>
 				<view class="empty-title">暂无订单</view>
@@ -84,7 +84,7 @@
 </template>
 
 <script setup>
-	import { ref, reactive, computed, nextTick, onMounted } from 'vue';
+	import { ref, reactive, computed, onMounted } from 'vue';
 	import { onShow } from '@dcloudio/uni-app';
 	import { orderApi } from '@/api/index.js';
 	import RenewalPaymentPopup from '@/components/RenewalPaymentPopup.vue';
@@ -102,7 +102,6 @@
 	const noMore = ref(false);
 	const page = ref(1);
 	const renewalPopupRef = ref(null);
-	const scrollViewHeight = ref(0);
 	const pageSize = 10;
 	const filterIndex = ref(0);
 	const filterOptions = [
@@ -113,29 +112,10 @@
 		{ label: '已退款', value: 4 }
 	];
 
-	const scrollViewStyle = computed(() => scrollViewHeight.value > 0
-		? { height: `${scrollViewHeight.value}px`, flex: 'none' }
-		: {});
 	const filterIndicatorStyle = computed(() => ({
 		left: `calc(${filterIndex.value * 20}% + 8rpx)`
 	}));
 
-	const updateScrollViewHeight = () => {
-		const windowInfo = typeof uni.getWindowInfo === 'function'
-			? uni.getWindowInfo()
-			: uni.getSystemInfoSync();
-		const windowHeight = Number(windowInfo?.windowHeight || 0);
-		if (!windowHeight) return;
-
-		uni.createSelectorQuery()
-			.select('.filter-tabs')
-			.boundingClientRect((rect) => {
-				if (!rect) return;
-				scrollViewHeight.value = Math.max(Math.floor(windowHeight - rect.bottom), 1);
-			})
-			.exec();
-	};
-
 	const getStatusClass = (status) => {
 		const classMap = {
 			1: 'tag-warning',
@@ -276,7 +256,6 @@
 
 	onMounted(() => {
 		loadOrderList();
-		nextTick(updateScrollViewHeight);
 	});
 </script>
 
@@ -516,6 +495,9 @@
 		padding: 0;
 		gap: 0;
 		padding-top: 0;
+		height: 100%;
+		min-height: 0;
+		overflow: hidden;
 	}
 
 	.filter-tabs {
@@ -602,8 +584,9 @@
 	}
 
 	.order-swiper {
-		flex: 1;
-		height: 0;
+		flex: 1 1 0;
+		height: auto;
+		overflow: hidden;
 	}
 
 	.order-swiper-item {
@@ -611,8 +594,8 @@
 	}
 
 	.scroll-container {
-		flex: 1 1 0;
-		height: auto;
+		flex: none;
+		height: 100%;
 		min-height: 0;
 		width: 100%;
 		box-sizing: border-box;