fix: 修复退款详情页逻辑并重构专题页数据加载

pages-car/components/buy-order-item.vue

@@ -177,7 +177,7 @@
                 }
                 if (type === 'detail') {
                     // 跳转至退款详情页
-                    const id = this.order.refundOrderId || this.order.orderId;
+                    const id = this.order.refundOrderId;
                     uni.navigateTo({
                         url: `/pages-car/pages/refund-detail?refundOrderId=${id}`
                     });

pages-car/pages/refund-detail.vue

@@ -6,7 +6,8 @@
 				<view class="status-title">请等待平台处理</view>
 				<!-- 倒计时 -->
 				<view class="status-desc" v-if="orderInfo.restAuditSecond > 0">
-					{{ formatCountDown(orderInfo.restAuditSecond) }}后平台未处理将自动同意
+					<u-count-down :timestamp="orderInfo.restAuditSecond" separator="zh" :show-seconds="false"
+						@end="getDetail" font-size="26" color="#999" bg-color="transparent"></u-count-down>后平台未处理将自动同意
 				</view>
 				<view class="status-tip">您已成功发起退款申请，请耐心等待平台处理</view>
 			</template>
@@ -28,7 +29,8 @@
 				<image :src="goods.cover" mode="aspectFill" class="goods-cover"></image>
 				<view class="goods-info">
 					<view class="goods-title u-line-2">{{ goods.bookName }}</view>
-					<view class="goods-sku" v-if="goods.isbn">品相：{{ goods.conditionName || '默认' }}</view>
+					<view class="goods-sku" v-if="goods.isbn">品相：{{ conditionTypeMap[goods.conditionType] || '默认' }}
+					</view>
 					<view class="price-box">
 						<text class="price">¥{{ goods.price }}</text>
 						<text class="num">x{{ goods.refundNum }}</text>
@@ -50,12 +52,13 @@
 				<view class="value flex-row link-text">
 					<text>查看</text>
 					<!-- <u-icon name="arrow-right" color="#38C148" size="24"></u-icon> -->
-					<image src="/static/images/arrow-right-green.png" style="width: 24rpx; height: 24rpx;" v-if="false"></image> 
+					<image src="/static/images/arrow-right-green.png" style="width: 24rpx; height: 24rpx;" v-if="false">
+					</image>
 					<!-- 使用文字或默认图标 -->
 					<u-icon name="lightning-fill" color="#38C148" size="28" style="margin-left: 6rpx;"></u-icon>
 				</view>
 			</view>
-			
+
 			<view class="row">
 				<text class="label">退款原因</text>
 				<text class="value">{{ orderInfo.refundReason }}</text>
@@ -71,8 +74,9 @@
 			<view class="row">
 				<text class="label">退款编号</text>
 				<view class="value flex-row">
-					<text>{{ orderInfo.refundOrderId }}</text>
-					<u-icon name="copy" size="28" color="#333" style="margin-left: 10rpx;" @click="copyOrderNo"></u-icon>
+					<text>{{ refundOrderId }}</text>
+					<image src="/pages-mine/static/copy.png" style="width: 28rpx; height: 28rpx; margin-left: 10rpx;"
+						@click="copyOrderNo"></image>
 				</view>
 			</view>
 		</view>
@@ -84,20 +88,20 @@
 				<u-icon name="server-man" size="60" color="#666"></u-icon>
 			</view>
 			<view class="btn-group">
-				<u-button v-if="orderInfo.showComplaint == 1" size="mini" shape="circle" plain :custom-style="btnStyle"
+				<u-button v-if="orderInfo.showComplaint == 1" shape="circle" plain :custom-style="btnStyle"
 					@click="handleAction('complaint')">投诉</u-button>
-				
-				<u-button v-if="orderInfo.showCancel == 1" size="mini" shape="circle" plain :custom-style="btnStyle"
+
+				<u-button v-if="orderInfo.showCancel == 1" shape="circle" plain :custom-style="btnStyle"
 					@click="handleAction('cancel')">撤销申请</u-button>
-				
-				<u-button v-if="orderInfo.showModifyApply == 1" size="mini" shape="circle" type="success" :custom-style="primaryBtnStyle"
-					@click="handleAction('modify')">修改申请</u-button>
-					
-				<u-button v-if="orderInfo.showClose == 1" size="mini" shape="circle" plain :custom-style="btnStyle"
+
+				<u-button v-if="orderInfo.showModifyApply == 1" shape="circle" type="success"
+					:custom-style="primaryBtnStyle" @click="handleAction('modify')">修改申请</u-button>
+
+				<u-button v-if="orderInfo.showClose == 1" shape="circle" plain :custom-style="btnStyle"
 					@click="handleAction('close')">关闭退款</u-button>
 			</view>
 		</view>
-		
+
 		<!-- 占位符 -->
 		<view style="height: 120rpx;" v-if="showBottomBar"></view>
 	</view>
@@ -107,6 +111,12 @@
 	export default {
 		data() {
 			return {
+				conditionTypeMap: {
+					'1': '良好',
+					'2': '中等',
+					'3': '次品',
+					'4': '全新'
+				},
 				refundOrderId: '',
 				orderInfo: {
 					status: '',
@@ -121,7 +131,6 @@
 					showComplaint: 0,
 					showClose: 0
 				},
-				timer: null,
 				btnStyle: {
 					marginLeft: '20rpx',
 					minWidth: '160rpx',
@@ -129,7 +138,8 @@
 					lineHeight: '64rpx',
 					padding: '0 20rpx',
 					color: '#666',
-					borderColor: '#ccc'
+					borderColor: '#ccc',
+					fontSize: '28rpx',
 				},
 				primaryBtnStyle: {
 					marginLeft: '20rpx',
@@ -161,9 +171,6 @@
 				this.getDetail();
 			}
 		},
-		onUnload() {
-			if (this.timer) clearInterval(this.timer);
-		},
 		methods: {
 			getDetail() {
 				this.$u.api.getNewRefundOrderDetailAjax({
@@ -171,9 +178,6 @@
 				}).then(res => {
 					if (res.code == 200) {
 						this.orderInfo = res.data;
-						if (this.orderInfo.restAuditSecond > 0) {
-							this.startTimer();
-						}
 					}
 				});
 			},
@@ -189,31 +193,6 @@
 				};
 				return map[status] || '处理中';
 			},
-			formatCountDown(seconds) {
-				if (seconds <= 0) return '0分';
-				const d = Math.floor(seconds / 86400);
-				const h = Math.floor((seconds % 86400) / 3600);
-				const m = Math.floor((seconds % 3600) / 60);
-				
-				let str = '';
-				if (d > 0) str += `${d}天`;
-				if (h > 0) str += `${h}时`;
-				if (m > 0) str += `${m}分`;
-				if (!str) str = '即将';
-				return str;
-			},
-			startTimer() {
-				if (this.timer) clearInterval(this.timer);
-				this.timer = setInterval(() => {
-					if (this.orderInfo.restAuditSecond > 0) {
-						this.orderInfo.restAuditSecond--;
-					} else {
-						clearInterval(this.timer);
-						// 倒计时结束，刷新页面
-						this.getDetail();
-					}
-				}, 1000);
-			},
 			copyOrderNo() {
 				uni.setClipboardData({
 					data: String(this.orderInfo.refundOrderId || ''),
@@ -253,9 +232,8 @@
 						uni.showToast({ title: '修改申请', icon: 'none' });
 						break;
 					case 'complaint':
-						// 投诉
 						uni.navigateTo({
-							url: `/pages-car/pages/complaint?orderId=${this.orderInfo.orderId}`
+							url: `/pages-car/pages/complaint?orderId=${this.orderInfo.originOrderId}`
 						});
 						break;
 					case 'close':
@@ -273,46 +251,46 @@
 		min-height: 100vh;
 		background-color: #F5F5F5;
 		padding-bottom: 20rpx;
-		
+
 		.status-header {
 			background-color: #fff;
 			padding: 40rpx 30rpx;
 			text-align: center;
 			margin-bottom: 20rpx;
-			
+
 			.status-title {
 				font-size: 36rpx;
 				font-weight: bold;
 				color: #333;
 				margin-bottom: 20rpx;
 			}
-			
+
 			.status-desc {
 				font-size: 26rpx;
 				color: #999;
 				margin-bottom: 10rpx;
 			}
-			
+
 			.status-tip {
 				font-size: 24rpx;
 				color: #999;
 			}
-			
+
 			.refund-amount-box {
 				margin-top: 30rpx;
 				border-top: 1rpx solid #eee;
 				padding-top: 30rpx;
-				
+
 				.amount-row {
 					display: flex;
 					justify-content: space-between;
 					align-items: center;
 					font-size: 30rpx;
-					
+
 					.label {
 						color: #333;
 					}
-					
+
 					.value {
 						color: #333;
 						font-weight: bold;
@@ -320,22 +298,22 @@
 				}
 			}
 		}
-		
+
 		.info-card {
 			background-color: #fff;
 			margin: 20rpx;
 			border-radius: 16rpx;
 			padding: 30rpx;
-			
+
 			&.goods-card {
 				.goods-item {
 					display: flex;
 					margin-bottom: 20rpx;
-					
+
 					&:last-child {
 						margin-bottom: 0;
 					}
-					
+
 					.goods-cover {
 						width: 140rpx;
 						height: 140rpx;
@@ -343,39 +321,39 @@
 						margin-right: 20rpx;
 						flex-shrink: 0;
 					}
-					
+
 					.goods-info {
 						flex: 1;
 						position: relative;
-						
+
 						.goods-title {
 							font-size: 28rpx;
 							color: #333;
 							margin-bottom: 10rpx;
 						}
-						
+
 						.goods-sku {
 							font-size: 24rpx;
 							color: #999;
 							margin-bottom: 10rpx;
 						}
-						
+
 						.price-box {
 							display: flex;
 							justify-content: space-between;
 							align-items: center;
-							
+
 							.price {
 								font-size: 28rpx;
 								color: #333;
 							}
-							
+
 							.num {
 								font-size: 24rpx;
 								color: #999;
 							}
 						}
-						
+
 						.refund-status-tag {
 							position: absolute;
 							right: 0;
@@ -383,7 +361,7 @@
 							transform: translateY(-50%);
 							font-size: 24rpx;
 							color: #999;
-							
+
 							&.red-tag {
 								color: #ff3b30;
 								border: 1rpx solid #ff3b30;
@@ -395,30 +373,30 @@
 					}
 				}
 			}
-			
+
 			&.detail-card {
 				.row {
 					display: flex;
 					justify-content: space-between;
 					margin-bottom: 20rpx;
 					font-size: 26rpx;
-					
+
 					&:last-child {
 						margin-bottom: 0;
 					}
-					
+
 					.label {
 						color: #999;
 					}
-					
+
 					.value {
 						color: #333;
-						
+
 						&.flex-row {
 							display: flex;
 							align-items: center;
 						}
-						
+
 						&.link-text {
 							color: #38C148; // 使用主题色
 							display: flex;
@@ -428,7 +406,7 @@
 				}
 			}
 		}
-		
+
 		.bottom-bar {
 			position: fixed;
 			bottom: 0;
@@ -440,13 +418,13 @@
 			display: flex;
 			justify-content: space-between;
 			align-items: center;
-			box-shadow: 0 -2rpx 10rpx rgba(0,0,0,0.05);
+			box-shadow: 0 -2rpx 10rpx rgba(0, 0, 0, 0.05);
 			z-index: 100;
-			
+
 			.service-btn {
 				padding: 10rpx;
 			}
-			
+
 			.btn-group {
 				display: flex;
 				align-items: center;

pages-sell/pages/topic.vue

@@ -9,7 +9,7 @@
 		<!-- Header Content -->
 		<view class="header-content">
 			<view class="title-area">
-				<text class="main-title">【考试】大学英语四六级</text>
+				<text class="main-title">{{ showName }}</text>
 			</view>
 		</view>
 
@@ -19,10 +19,11 @@
 				@add-cart="handleAddToCart"></RecommendItem>
 
 			<!-- Change Batch Button -->
-			<view class="refresh-fab" @click="changeBatch">
+			<view class="refresh-fab" @click="changeBatch" v-if="total > pageSize">
 				<view class="refresh-bg"></view>
 				<view class="refresh-content">
-					<image src="/pages-sell/static/topic/icon-refresh.png" class="refresh-icon" mode="widthFix" style="width: 32rpx"></image>
+					<image src="/pages-sell/static/topic/icon-refresh.png" class="refresh-icon" mode="widthFix"
+						style="width: 32rpx"></image>
 					<text class="refresh-text">换一批</text>
 				</view>
 			</view>
@@ -31,201 +32,181 @@
 </template>
 
 <script>
-import RecommendItem from '../components/recommend-item/index.vue'
-import Navbar from '@/components/navbar/navbar.vue'
-
-export default {
-	components: {
-		RecommendItem,
-		Navbar
-	},
-	data() {
-		return {
-			currentIndex: 0,
-			pageSize: 5,
-			allBooks: [],
-			bookList: []
-		}
-	},
-	created() {
-		this.initBooks();
-		this.updateBookList();
-	},
-	methods: {
-		initBooks() {
-			const baseBooks = [
-				{
-					title: '山河岁月',
-					author: '本书编写组',
-					price: '6.80',
-					originalPrice: '36.80',
-					cover: '/static/img/1.png',
-					desc: '“山河岁月”以宏大的历史视野，讲述了...'
-				},
-				{
-					title: '平凡的世界',
-					author: '路遥',
-					price: '12.80',
-					originalPrice: '45.00',
-					cover: '/static/img/1.png',
-					desc: '中国当代城乡社会生活的巨大变迁...'
-				},
-				{
-					title: '活着',
-					author: '余华',
-					price: '9.90',
-					originalPrice: '28.00',
-					cover: '/static/img/1.png',
-					desc: '讲述了人如何去承受巨大的苦难...'
-				},
-				{
-					title: '三体',
-					author: '刘慈欣',
-					price: '15.50',
-					originalPrice: '38.00',
-					cover: '/static/img/1.png',
-					desc: '地球文明在宇宙中的兴衰历程...'
-				},
-				{
-					title: '百年孤独',
-					author: '马尔克斯',
-					price: '18.00',
-					originalPrice: '55.00',
-					cover: '/static/img/1.png',
-					desc: '布恩迪亚家族七代人的传奇故事...'
-				}
-			];
-			
-			// Generate more data for demonstration
-			this.allBooks = [];
-			for (let i = 0; i < 4; i++) {
-				this.allBooks.push(...baseBooks.map((b, idx) => ({
-					...b,
-					id: i * 10 + idx + 1,
-					title: `${b.title} ${i > 0 ? i + 1 : ''}`
-				})));
-			}
+	import RecommendItem from '../components/recommend-item/index.vue'
+	import Navbar from '@/components/navbar/navbar.vue'
+
+	export default {
+		components: {
+			RecommendItem,
+			Navbar
 		},
-		updateBookList() {
-			const start = this.currentIndex * this.pageSize;
-			const end = start + this.pageSize;
-			this.bookList = this.allBooks.slice(start, end);
-			
-			uni.pageScrollTo({
-				scrollTop: 0,
-				duration: 300
-			});
+		data() {
+			return {
+				cateId: '',
+				pageNum: 1,
+				pageSize: 5,
+				total: 0,
+				bookList: [],
+				showName: ''
+			}
 		},
-		changeBatch() {
-			const maxIndex = Math.ceil(this.allBooks.length / this.pageSize) - 1;
-			if (this.currentIndex < maxIndex) {
-				this.currentIndex++;
-			} else {
-				this.currentIndex = 0;
+		onLoad(options) {
+			if (options.cateId || options.id) {
+				this.cateId = options.cateId || options.id;
+				this.loadData();
 			}
-			
-			// Simple loading effect
-			uni.showLoading({ title: '加载中' });
-			setTimeout(() => {
-				this.updateBookList();
-				uni.hideLoading();
-			}, 300);
 		},
-		handleAddToCart(data) {
-			console.log('Add to cart:', data);
-			uni.showToast({
-				title: '已加入购物车',
-				icon: 'success'
-			});
+		methods: {
+			loadData() {
+				uni.showLoading({ title: '加载中' });
+				this.$u.api.getBookListByCateIdAjax({
+					cateId: this.cateId,
+					pageNum: this.pageNum,
+					pageSize: this.pageSize
+				}).then(res => {
+					uni.hideLoading();
+					if (res.code == 200) {
+						const data = res.data;
+						this.showName = data.showName || '图书专题';
+						this.total = data.bookPageList.total;
+
+						this.bookList = data.bookPageList.rows.map(item => {
+							return {
+								title: item.bookName,
+								author: '', // API doesn't return author currently
+								price: item.bookPrice,
+								originalPrice: item.bookOriginalPrice,
+								cover: item.bookImg,
+								desc: item.bookShortReview,
+								id: item.bookId || item.id,
+								isbn: item.bookIsbn
+							}
+						});
+
+						// Scroll to top when data changes
+						uni.pageScrollTo({
+							scrollTop: 0,
+							duration: 300
+						});
+					}
+				}).catch(() => {
+					uni.hideLoading();
+				});
+			},
+			changeBatch() {
+				const maxPages = Math.ceil(this.total / this.pageSize);
+				if (this.pageNum < maxPages) {
+					this.pageNum++;
+				} else {
+					this.pageNum = 1;
+				}
+				this.loadData();
+			},
+			handleAddToCart(data) {
+				console.log('Add to cart:', data);
+				// Implement actual add to cart logic if needed, or keep toast
+				this.$u.api.addShopCartAjax({
+					bookId: data.id,
+					num: 1
+				}).then(res => {
+					if (res.code == 200) {
+						uni.showToast({
+							title: '已加入购物车',
+							icon: 'success'
+						});
+					}
+				});
+			}
 		}
 	}
-}
 </script>
 
 <style lang="scss" scoped>
-.feature-page {
-	min-height: 100vh;
-	background-color: #F8F8F8;
-	position: relative;
-}
-
-.header-bg {
-	position: fixed;
-	top: 0;
-	left: 0;
-	width: 100%;
-	z-index: 0;
-}
-
-.header-content {
-	position: relative;
-	z-index: 1;
-	padding: 0 40rpx;
-	display: flex;
-	flex-direction: column;
-	align-items: center;
-	justify-content: center;
-	min-height: 200rpx;
-
-	.title-area {
-		width: 100%;
-		.main-title {
-			font-family: YouSheBiaoTiHei;
-			font-weight: 400;
-			font-size: 60rpx;
-			color: #FFFFFF;
-			text-shadow: 2px 2px 4px #0C256D;
-			text-align: center;
-		}
+	.feature-page {
+		min-height: 100vh;
+		background-color: #F8F8F8;
+		position: relative;
 	}
-}
-
-.list-container {
-	position: relative;
-	z-index: 1;
-	background-color: #fff;
-	border-radius: 40rpx 40rpx 0 0;
-	padding: 10rpx 40rpx 40rpx;
-	min-height: calc(100vh - 360rpx);
-}
-
-.refresh-fab {
-	position: fixed;
-	right: 30rpx;
-	bottom: 30%;
-	width: 108rpx;
-	height: 108rpx;
-	border-radius: 50%;
-	z-index: 100;
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	overflow: hidden;
-	
-	.refresh-bg {
-		position: absolute;
+
+	.header-bg {
+		position: fixed;
 		top: 0;
 		left: 0;
 		width: 100%;
-		height: 100%;
-		background-color: #000000;
-		opacity: 0.2; /* Adjusted for visibility, user said 0.1 but that might be too faint for white text bg */
-		z-index: 1;
+		z-index: 0;
 	}
-	
-	.refresh-content {
+
+	.header-content {
 		position: relative;
-		z-index: 2;
+		z-index: 1;
+		padding: 0 40rpx;
 		display: flex;
 		flex-direction: column;
 		align-items: center;
 		justify-content: center;
-		
-		.refresh-text {
-			font-size: 20rpx;
-			color: #FFFFFF;
-			margin-top: 4rpx;
+		min-height: 200rpx;
+
+		.title-area {
+			width: 100%;
+
+			.main-title {
+				font-family: YouSheBiaoTiHei;
+				font-weight: 400;
+				font-size: 60rpx;
+				color: #FFFFFF;
+				text-shadow: 2px 2px 4px #0C256D;
+				text-align: center;
+			}
+		}
+	}
+
+	.list-container {
+		position: relative;
+		z-index: 1;
+		background-color: #fff;
+		border-radius: 40rpx 40rpx 0 0;
+		padding: 10rpx 40rpx 40rpx;
+		min-height: calc(100vh - 360rpx);
+	}
+
+	.refresh-fab {
+		position: fixed;
+		right: 30rpx;
+		bottom: 30%;
+		width: 108rpx;
+		height: 108rpx;
+		border-radius: 50%;
+		z-index: 100;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		overflow: hidden;
+
+		.refresh-bg {
+			position: absolute;
+			top: 0;
+			left: 0;
+			width: 100%;
+			height: 100%;
+			background-color: #000000;
+			opacity: 0.2;
+			/* Adjusted for visibility, user said 0.1 but that might be too faint for white text bg */
+			z-index: 1;
+		}
+
+		.refresh-content {
+			position: relative;
+			z-index: 2;
+			display: flex;
+			flex-direction: column;
+			align-items: center;
+			justify-content: center;
+
+			.refresh-text {
+				font-size: 20rpx;
+				color: #FFFFFF;
+				margin-top: 4rpx;
+			}
 		}
 	}
-}
 </style>