Initial commit
This commit is contained in:
sjk
125
miniprogram/pages/order/comment-list/index.js
Normal file
125
miniprogram/pages/order/comment-list/index.js
Normal file
@@ -0,0 +1,125 @@
|
||||
import Toast from 'tdesign-miniprogram/toast/index';
|
||||
import config from '../../../config/index';
|
||||
|
||||
Page({
|
||||
data: {
|
||||
orderNo: '',
|
||||
orderItems: [],
|
||||
loading: true,
|
||||
},
|
||||
|
||||
onLoad(options) {
|
||||
const { orderNo } = options;
|
||||
if (orderNo) {
|
||||
this.setData({ orderNo });
|
||||
this.fetchOrderItems();
|
||||
} else {
|
||||
Toast({
|
||||
context: this,
|
||||
selector: '#t-toast',
|
||||
message: '订单号不能为空',
|
||||
icon: 'error',
|
||||
});
|
||||
setTimeout(() => {
|
||||
wx.navigateBack();
|
||||
}, 1500);
|
||||
}
|
||||
},
|
||||
|
||||
// 获取订单商品列表
|
||||
async fetchOrderItems() {
|
||||
try {
|
||||
wx.showLoading({
|
||||
title: '加载中...',
|
||||
mask: true
|
||||
});
|
||||
|
||||
const token = wx.getStorageSync('token');
|
||||
if (!token) {
|
||||
Toast({
|
||||
context: this,
|
||||
selector: '#t-toast',
|
||||
message: '请先登录',
|
||||
icon: 'error',
|
||||
});
|
||||
setTimeout(() => {
|
||||
wx.navigateTo({
|
||||
url: '/pages/login/index'
|
||||
});
|
||||
}, 1500);
|
||||
return;
|
||||
}
|
||||
|
||||
const res = await new Promise((resolve, reject) => {
|
||||
wx.request({
|
||||
url: `${config.apiBase}/api/v1/orders/${this.data.orderNo}`,
|
||||
method: 'GET',
|
||||
header: {
|
||||
'Content-Type': 'application/json',
|
||||
'Authorization': `Bearer ${token}`
|
||||
},
|
||||
success: resolve,
|
||||
fail: reject
|
||||
});
|
||||
});
|
||||
|
||||
wx.hideLoading();
|
||||
|
||||
if (res.statusCode === 200 && res.data.code === 200) {
|
||||
const order = res.data.data;
|
||||
const orderItems = order.order_items || [];
|
||||
|
||||
// 过滤出可以评论的商品（已确认收货且未评论）
|
||||
const commentableItems = orderItems.filter(item =>
|
||||
order.status === 'completed' && !item.is_commented
|
||||
);
|
||||
|
||||
this.setData({
|
||||
orderItems: commentableItems,
|
||||
loading: false
|
||||
});
|
||||
|
||||
if (commentableItems.length === 0) {
|
||||
Toast({
|
||||
context: this,
|
||||
selector: '#t-toast',
|
||||
message: '暂无可评论的商品',
|
||||
icon: 'info',
|
||||
});
|
||||
}
|
||||
} else {
|
||||
throw new Error(res.data.message || '获取订单信息失败');
|
||||
}
|
||||
} catch (error) {
|
||||
wx.hideLoading();
|
||||
console.error('获取订单商品失败:', error);
|
||||
Toast({
|
||||
context: this,
|
||||
selector: '#t-toast',
|
||||
message: error.message || '网络错误，请重试',
|
||||
icon: 'error',
|
||||
});
|
||||
this.setData({ loading: false });
|
||||
}
|
||||
},
|
||||
|
||||
// 点击评论商品
|
||||
onCommentItem(e) {
|
||||
const { item } = e.currentTarget.dataset;
|
||||
wx.navigateTo({
|
||||
url: `/pages/order/comment/index?orderNo=${this.data.orderNo}&orderItemId=${item.id}`,
|
||||
});
|
||||
},
|
||||
|
||||
// 返回上一页
|
||||
onBack() {
|
||||
wx.navigateBack();
|
||||
},
|
||||
|
||||
// 下拉刷新
|
||||
onPullDownRefresh() {
|
||||
this.fetchOrderItems().finally(() => {
|
||||
wx.stopPullDownRefresh();
|
||||
});
|
||||
}
|
||||
});
|
||||
11
miniprogram/pages/order/comment-list/index.json
Normal file
11
miniprogram/pages/order/comment-list/index.json
Normal file
@@ -0,0 +1,11 @@
|
||||
{
|
||||
"usingComponents": {
|
||||
"t-navbar": "tdesign-miniprogram/navbar/navbar",
|
||||
"t-loading": "tdesign-miniprogram/loading/loading",
|
||||
"t-icon": "tdesign-miniprogram/icon/icon",
|
||||
"t-toast": "tdesign-miniprogram/toast/toast",
|
||||
"price": "/components/price/index"
|
||||
},
|
||||
"navigationStyle": "custom",
|
||||
"enablePullDownRefresh": true
|
||||
}
|
||||
66
miniprogram/pages/order/comment-list/index.wxml
Normal file
66
miniprogram/pages/order/comment-list/index.wxml
Normal file
@@ -0,0 +1,66 @@
|
||||
<view class="comment-list-page">
|
||||
<!-- 导航栏 -->
|
||||
<t-navbar title="选择评价商品" left-arrow bind:left-click="onBack" />
|
||||
|
||||
<!-- 加载状态 -->
|
||||
<view class="loading-container" wx:if="{{loading}}">
|
||||
<t-loading theme="circular" size="48rpx" text="加载中..." />
|
||||
</view>
|
||||
|
||||
<!-- 商品列表 -->
|
||||
<view class="order-items" wx:else>
|
||||
<view
|
||||
class="order-item"
|
||||
wx:for="{{orderItems}}"
|
||||
wx:key="id"
|
||||
bind:tap="onCommentItem"
|
||||
data-item="{{item}}"
|
||||
>
|
||||
<view class="item-content">
|
||||
<!-- 商品图片 -->
|
||||
<image
|
||||
class="product-image"
|
||||
src="{{item.product.images[0] || '/assets/placeholder.png'}}"
|
||||
mode="aspectFill"
|
||||
/>
|
||||
|
||||
<!-- 商品信息 -->
|
||||
<view class="product-info">
|
||||
<view class="product-name">{{item.product.name}}</view>
|
||||
<view class="product-spec" wx:if="{{item.product_spec}}">{{item.product_spec}}</view>
|
||||
<view class="product-price">
|
||||
<price price="{{item.price}}" />
|
||||
<text class="quantity">x{{item.quantity}}</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 评论状态 -->
|
||||
<view class="comment-status">
|
||||
<view class="status-badge" wx:if="{{item.is_commented}}">
|
||||
<t-icon name="check-circle-filled" size="32rpx" color="#52c41a" />
|
||||
<text class="status-text commented">已评价</text>
|
||||
</view>
|
||||
<view class="status-badge" wx:else>
|
||||
<t-icon name="chat" size="32rpx" color="#ff6b35" />
|
||||
<text class="status-text uncommented">待评价</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 箭头 -->
|
||||
<view class="arrow" wx:if="{{!item.is_commented}}">
|
||||
<t-icon name="chevron-right" size="32rpx" color="#999" />
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 空状态 -->
|
||||
<view class="empty-state" wx:if="{{orderItems.length === 0}}">
|
||||
<t-icon name="chat" size="120rpx" color="#ddd" />
|
||||
<text class="empty-text">暂无可评价的商品</text>
|
||||
<text class="empty-desc">所有商品都已评价完成</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- Toast -->
|
||||
<t-toast id="t-toast" />
|
||||
</view>
|
||||
133
miniprogram/pages/order/comment-list/index.wxss
Normal file
133
miniprogram/pages/order/comment-list/index.wxss
Normal file
@@ -0,0 +1,133 @@
|
||||
.comment-list-page {
|
||||
background-color: #f5f5f5;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
/* 加载状态 */
|
||||
.loading-container {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 400rpx;
|
||||
}
|
||||
|
||||
/* 商品列表 */
|
||||
.order-items {
|
||||
padding: 20rpx 0;
|
||||
}
|
||||
|
||||
.order-item {
|
||||
background: #fff;
|
||||
margin-bottom: 20rpx;
|
||||
padding: 32rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.order-item:active {
|
||||
background-color: #f8f8f8;
|
||||
}
|
||||
|
||||
.item-content {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 商品图片 */
|
||||
.product-image {
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
border-radius: 12rpx;
|
||||
margin-right: 24rpx;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
/* 商品信息 */
|
||||
.product-info {
|
||||
flex: 1;
|
||||
margin-right: 24rpx;
|
||||
}
|
||||
|
||||
.product-name {
|
||||
font-size: 32rpx;
|
||||
color: #333;
|
||||
font-weight: 500;
|
||||
margin-bottom: 8rpx;
|
||||
line-height: 1.4;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.product-spec {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
margin-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.product-price {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.quantity {
|
||||
font-size: 28rpx;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
/* 评论状态 */
|
||||
.comment-status {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.status-badge {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 8rpx;
|
||||
}
|
||||
|
||||
.status-text {
|
||||
font-size: 24rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.status-text.commented {
|
||||
color: #52c41a;
|
||||
}
|
||||
|
||||
.status-text.uncommented {
|
||||
color: #ff6b35;
|
||||
}
|
||||
|
||||
/* 箭头 */
|
||||
.arrow {
|
||||
margin-left: 16rpx;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
/* 空状态 */
|
||||
.empty-state {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 120rpx 32rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.empty-text {
|
||||
font-size: 32rpx;
|
||||
color: #666;
|
||||
margin-top: 24rpx;
|
||||
margin-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.empty-desc {
|
||||
font-size: 28rpx;
|
||||
color: #999;
|
||||
}
|
||||
Reference in New Issue
Block a user