feat(user/order): 新增订单评价功能

- 添加订单评价页面组件
- 实现订单信息和商品列表展示
- 添加评价功能相关的样式和布局
- 优化订单列表页面,增加申请退款和查看物流等功能

src/user/order/components/OrderList.tsx

@@ -11,6 +11,7 @@ import {ShopOrderGoods} from "@/api/shop/shopOrderGoods/model";
 import {copyText} from "@/utils/common";
 import PaymentCountdown from "@/components/PaymentCountdown";
 import {PaymentType} from "@/utils/payment";
+import {goTo, switchTab} from "@/utils/navigation";
 
 // 判断订单是否支付已过期
 const isPaymentExpired = (createTime: string, timeoutHours: number = 24): boolean => {
@@ -314,6 +315,66 @@ function OrderList(props: OrderListProps) {
     setOrderToConfirmReceive(null);
   };
 
+  // 申请退款 (待发货状态)
+  const applyRefund = (order: ShopOrder) => {
+    // 跳转到退款申请页面
+    Taro.navigateTo({
+      url: `/user/order/refund/index?orderId=${order.orderId}&orderNo=${order.orderNo}`
+    });
+  };
+
+  // 查看物流 (待收货状态)
+  const viewLogistics = (order: ShopOrder) => {
+    // 跳转到物流查询页面
+    Taro.navigateTo({
+      url: `/user/order/logistics/index?orderId=${order.orderId}&orderNo=${order.orderNo}&expressNo=${order.transactionId || ''}&expressCompany=SF`
+    });
+  };
+
+  // 再次购买 (已完成状态)
+  const buyAgain = (order: ShopOrder) => {
+    console.log('再次购买:', order);
+    goTo(`/shop/orderConfirm/index?goodsId=${order.orderGoods[0].goodsId}`)
+    // Taro.showToast({
+    //   title: '再次购买功能开发中',
+    //   icon: 'none'
+    // });
+  };
+
+  // 评价商品 (已完成状态)
+  const evaluateGoods = (order: ShopOrder) => {
+    // 跳转到评价页面
+    Taro.navigateTo({
+      url: `/user/order/evaluate/index?orderId=${order.orderId}&orderNo=${order.orderNo}`
+    });
+  };
+
+  // 查看进度 (退款/售后状态)
+  const viewProgress = (order: ShopOrder) => {
+    // 根据订单状态确定售后类型
+    let afterSaleType = 'refund' // 默认退款
+
+    if (order.orderStatus === 4) {
+      afterSaleType = 'refund' // 退款申请中
+    } else if (order.orderStatus === 7) {
+      afterSaleType = 'return' // 退货申请中
+    }
+
+    // 跳转到售后进度页面
+    Taro.navigateTo({
+      url: `/user/order/progress/index?orderId=${order.orderId}&orderNo=${order.orderNo}&type=${afterSaleType}`
+    });
+  };
+
+  // 撤销申请 (退款/售后状态)
+  const cancelApplication = (order: ShopOrder) => {
+    console.log('撤销申请:', order);
+    Taro.showToast({
+      title: '撤销申请功能开发中',
+      icon: 'none'
+    });
+  };
+
   // 取消订单
   const cancelOrder = (order: ShopOrder) => {
     setOrderToCancel(order);
@@ -393,7 +454,7 @@ function OrderList(props: OrderListProps) {
         return;
       }
 
-      Taro.showLoading({ title: '发起支付...' });
+      Taro.showLoading({title: '发起支付...'});
 
       // 构建商品数据
       const goodsItems = order.orderGoods?.map(goods => ({
@@ -446,7 +507,7 @@ function OrderList(props: OrderListProps) {
 
       // 跳转到订单页面
       setTimeout(() => {
-        Taro.navigateTo({ url: '/user/order/order' });
+        Taro.navigateTo({url: '/user/order/order'});
       }, 2000);
 
     } catch (error: any) {
@@ -473,7 +534,6 @@ function OrderList(props: OrderListProps) {
   };
 
 
-
   useEffect(() => {
     void reload(true); // 首次加载或tab切换时重置页码
   }, [tapIndex]); // 只监听tapIndex变化，避免reload依赖循环
@@ -594,108 +654,151 @@ function OrderList(props: OrderListProps) {
                 return true;
               })
               ?.map((item, index) => {
-              return (
-                <Cell key={index} style={{padding: '16px'}}
-                      onClick={() => Taro.navigateTo({url: `/shop/orderDetail/index?orderId=${item.orderId}`})}>
-                  <Space direction={'vertical'} className={'w-full flex flex-col'}>
-                    <View className={'order-no flex justify-between'}>
-                      <View className={'flex items-center'}>
-                        <Text className={'text-gray-600 font-bold text-sm'}
-                              onClick={(e) => {
-                                e.stopPropagation();
-                                copyText(`${item.orderNo}`)
-                              }}>{item.orderNo}</Text>
+                return (
+                  <Cell key={index} style={{padding: '16px'}}
+                        onClick={() => Taro.navigateTo({url: `/shop/orderDetail/index?orderId=${item.orderId}`})}>
+                    <Space direction={'vertical'} className={'w-full flex flex-col'}>
+                      <View className={'order-no flex justify-between'}>
+                        <View className={'flex items-center'}>
+                          <Text className={'text-gray-600 font-bold text-sm'}
+                                onClick={(e) => {
+                                  e.stopPropagation();
+                                  copyText(`${item.orderNo}`)
+                                }}>{item.orderNo}</Text>
+                        </View>
+                        {/* 右侧显示合并的状态和倒计时 */}
+                        <View className={`${getOrderStatusColor(item)} font-medium`}>
+                          {!item.payStatus && item.orderStatus !== 2 ? (
+                            <PaymentCountdown
+                              createTime={item.createTime}
+                              payStatus={item.payStatus}
+                              realTime={false}
+                              showSeconds={false}
+                              mode={'badge'}
+                            />
+                          ) : (
+                            getOrderStatusText(item)
+                          )}
+                        </View>
                       </View>
-                      {/* 右侧显示合并的状态和倒计时 */}
-                      <View className={`${getOrderStatusColor(item)} font-medium`}>
-                        {!item.payStatus && item.orderStatus !== 2 ? (
-                          <PaymentCountdown
-                            createTime={item.createTime}
-                            payStatus={item.payStatus}
-                            realTime={false}
-                            showSeconds={false}
-                            mode={'badge'}
-                          />
+                      <View
+                        className={'create-time text-gray-400 text-xs'}>{dayjs(item.createTime).format('YYYY年MM月DD日 HH:mm:ss')}</View>
+
+                      {/* 商品信息 */}
+                      <View className={'goods-info'}>
+                        {item.orderGoods && item.orderGoods.length > 0 ? (
+                          item.orderGoods.map((goods, goodsIndex) => (
+                            <View key={goodsIndex} className={'flex items-center mb-2'}>
+                              <Image
+                                src={goods.image || '/default-goods.png'}
+                                width="50"
+                                height="50"
+                                lazyLoad={false}
+                                className={'rounded'}
+                              />
+                              <View className={'ml-2 flex flex-col flex-1'}>
+                                <Text className={'text-sm font-bold'}>{goods.goodsName}</Text>
+                                {goods.spec && <Text className={'text-gray-500 text-xs'}>规格：{goods.spec}</Text>}
+                                <Text className={'text-gray-500 text-xs'}>数量：{goods.totalNum}</Text>
+                              </View>
+                              <Text className={'text-sm'}>￥{goods.price}</Text>
+                            </View>
+                          ))
                         ) : (
-                          getOrderStatusText(item)
+                          <View className={'flex items-center'}>
+                            <Avatar
+                              src='/default-goods.png'
+                              size={'50'}
+                              shape={'square'}
+                            />
+                            <View className={'ml-2'}>
+                              <Text className={'text-sm'}>{item.title || '订单商品'}</Text>
+                              <Text className={'text-gray-400 text-xs'}>{item.totalNum}件商品</Text>
+                            </View>
+                          </View>
                         )}
                       </View>
-                    </View>
-                    <View
-                      className={'create-time text-gray-400 text-xs'}>{dayjs(item.createTime).format('YYYY年MM月DD日 HH:mm:ss')}</View>
 
-                    {/* 商品信息 */}
-                    <View className={'goods-info'}>
-                      {item.orderGoods && item.orderGoods.length > 0 ? (
-                        item.orderGoods.map((goods, goodsIndex) => (
-                          <View key={goodsIndex} className={'flex items-center mb-2'}>
-                            <Image
-                              src={goods.image || '/default-goods.png'}
-                              width="50"
-                              height="50"
-                              lazyLoad={false}
-                              className={'rounded'}
-                            />
-                            <View className={'ml-2 flex flex-col flex-1'}>
-                              <Text className={'text-sm font-bold'}>{goods.goodsName}</Text>
-                              {goods.spec && <Text className={'text-gray-500 text-xs'}>规格：{goods.spec}</Text>}
-                              <Text className={'text-gray-500 text-xs'}>数量：{goods.totalNum}</Text>
-                            </View>
-                            <Text className={'text-sm'}>￥{goods.price}</Text>
-                          </View>
-                        ))
-                      ) : (
-                        <View className={'flex items-center'}>
-                          <Avatar
-                            src='/default-goods.png'
-                            size={'50'}
-                            shape={'square'}
-                          />
-                          <View className={'ml-2'}>
-                            <Text className={'text-sm'}>{item.title || '订单商品'}</Text>
-                            <Text className={'text-gray-400 text-xs'}>{item.totalNum}件商品</Text>
-                          </View>
-                        </View>
-                      )}
-                    </View>
+                      <Text className={'w-full text-right'}>实付金额：￥{item.payPrice}</Text>
 
-                    <Text className={'w-full text-right'}>实付金额：￥{item.payPrice}</Text>
+                      {/* 操作按钮 */}
+                      <Space className={'btn flex justify-end'}>
+                        {/* 待付款状态：显示取消订单和立即支付 */}
+                        {(!item.payStatus) && item.orderStatus !== 2 && (
+                          <Space>
+                            <Button size={'small'} onClick={(e) => {
+                              e.stopPropagation();
+                              void cancelOrder(item);
+                            }}>取消订单</Button>
+                            <Button size={'small'} type="primary" onClick={(e) => {
+                              e.stopPropagation();
+                              void payOrder(item);
+                            }}>立即支付</Button>
+                          </Space>
+                        )}
 
-                    {/* 操作按钮 */}
-                    <Space className={'btn flex justify-end'}>
-                      {/* 待付款状态：显示取消订单和立即支付 */}
-                      {(!item.payStatus) && item.orderStatus !== 2 && (
-                        <Space>
+                        {/* 待发货状态：显示申请退款 */}
+                        {item.payStatus && item.deliveryStatus === 10 && item.orderStatus !== 2 && item.orderStatus !== 4 && (
                           <Button size={'small'} onClick={(e) => {
                             e.stopPropagation();
-                            void cancelOrder(item);
-                          }}>取消订单</Button>
+                            applyRefund(item);
+                          }}>申请退款</Button>
+                        )}
+
+                        {/* 待收货状态：显示查看物流和确认收货 */}
+                        {item.deliveryStatus === 20 && item.orderStatus !== 2 && (
+                          <Space>
+                            <Button size={'small'} onClick={(e) => {
+                              e.stopPropagation();
+                              viewLogistics(item);
+                            }}>查看物流</Button>
+                            <Button size={'small'} type="primary" onClick={(e) => {
+                              e.stopPropagation();
+                              confirmReceive(item);
+                            }}>确认收货</Button>
+                          </Space>
+                        )}
+
+                        {/* 已完成状态：显示再次购买、评价商品、申请退款 */}
+                        {item.orderStatus === 1 && (
+                          <Space>
+                            <Button size={'small'} onClick={(e) => {
+                              e.stopPropagation();
+                              buyAgain(item);
+                            }}>再次购买</Button>
+                            <Button size={'small'} onClick={(e) => {
+                              e.stopPropagation();
+                              evaluateGoods(item);
+                            }}>评价商品</Button>
+                            <Button size={'small'} onClick={(e) => {
+                              e.stopPropagation();
+                              applyRefund(item);
+                            }}>申请退款</Button>
+                          </Space>
+                        )}
+
+                        {/* 退款/售后状态：显示查看进度和撤销申请 */}
+                        {(item.orderStatus === 4 || item.orderStatus === 7) && (
+                          <Space>
+                            <Button size={'small'} onClick={(e) => {
+                              e.stopPropagation();
+                              viewProgress(item);
+                            }}>查看进度</Button>
+                          </Space>
+                        )}
+
+                        {/* 退款成功状态：显示再次购买 */}
+                        {item.orderStatus === 6 && (
                           <Button size={'small'} type="primary" onClick={(e) => {
                             e.stopPropagation();
-                            void payOrder(item);
-                          }}>立即支付</Button>
-                        </Space>
-                      )}
-                      {/* 待收货状态：显示确认收货 */}
-                      {item.deliveryStatus === 20 && (
-                        <Button size={'small'} type="primary" onClick={(e) => {
-                          e.stopPropagation();
-                          confirmReceive(item);
-                        }}>确认收货</Button>
-                      )}
-                      {/* 已完成状态：显示申请退款 */}
-                      {item.orderStatus === 1 && (
-                        <Button size={'small'} onClick={(e) => {
-                          e.stopPropagation();
-                          console.log('申请退款')
-                        }}>申请退款</Button>
-                      )}
-                      {/* 退款相关状态的按钮可以在这里添加 */}
+                            buyAgain(item);
+                          }}>再次购买</Button>
+                        )}
+                      </Space>
                     </Space>
-                  </Space>
-                </Cell>
-              )
-            })}
+                  </Cell>
+                )
+              })}
           </InfiniteLoading>
         )}
       </View>