1

frontend/src/app/pages/orders/orders.ts

@@ -1,4 +1,4 @@
-import { Component, ChangeDetectionStrategy, signal, computed, OnInit, inject } from '@angular/core';
+import { Component, ChangeDetectionStrategy, signal, computed, OnInit, inject } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { Router, RouterLink } from '@angular/router';
 import { MatButtonModule } from '@angular/material/button';
@@ -11,6 +11,11 @@ import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
 import { OrderService } from '../../services/order.service';
 import { Order, OrderStatus, OrderStatusLabels } from '../../models/order.model';
 
+/**
+ * 订单列表页面组件
+ * 连接到OrderService获取真实订单数据
+ * Requirements: 8.4 - 消费者查看订单列表
+ */
 @Component({
   selector: 'app-orders',
   imports: [
@@ -79,7 +84,7 @@ export class OrdersComponent implements OnInit {
       },
       error: (err) => {
         this.loading.set(false);
-        this.showMessage(err.message || 'Failed to load orders');
+        this.showMessage(err.message || '加载订单失败');
       }
     });
   }
@@ -109,45 +114,59 @@ export class OrdersComponent implements OnInit {
 
   payOrder(order: Order) {
     this.router.navigate(['/payment'], {
-      queryParams: { orderId: order.id, orderNo: order.orderNo, amount: order.totalAmount }
+      queryParams: { 
+        orderId: order.id, 
+        orderNo: order.orderNo,
+        amount: order.totalAmount 
+      }
     });
   }
 
   cancelOrder(order: Order) {
     if (!this.orderService.canCancel(order)) {
-      this.showMessage('Cannot cancel this order');
+      this.showMessage('该订单无法取消');
       return;
     }
-    if (confirm('Are you sure you want to cancel this order?')) {
-      this.orderService.cancelOrder(order.id, 'User cancelled').subscribe({
+    
+    if (confirm('确定要取消该订单吗？')) {
+      this.orderService.cancelOrder(order.id, '用户主动取消').subscribe({
         next: (updatedOrder) => {
-          this.allOrders.update(orders => orders.map(o => o.id === updatedOrder.id ? updatedOrder : o));
-          this.showMessage('Order cancelled');
+          this.allOrders.update(orders => 
+            orders.map(o => o.id === updatedOrder.id ? updatedOrder : o)
+          );
+          this.showMessage('订单已取消');
         },
-        error: (err) => this.showMessage(err.message || 'Failed to cancel order')
+        error: (err) => {
+          this.showMessage(err.message || '取消订单失败');
+        }
       });
     }
   }
 
   confirmReceived(order: Order) {
     if (!this.orderService.canConfirmReceipt(order)) {
-      this.showMessage('Cannot confirm receipt for this order');
+      this.showMessage('该订单无法确认收货');
       return;
     }
-    if (confirm('Confirm you have received the goods?')) {
+    
+    if (confirm('确定已收到商品吗？')) {
       this.orderService.confirmReceipt(order.id).subscribe({
         next: (updatedOrder) => {
-          this.allOrders.update(orders => orders.map(o => o.id === updatedOrder.id ? updatedOrder : o));
-          this.showMessage('Receipt confirmed');
+          this.allOrders.update(orders => 
+            orders.map(o => o.id === updatedOrder.id ? updatedOrder : o)
+          );
+          this.showMessage('已确认收货');
         },
-        error: (err) => this.showMessage(err.message || 'Failed to confirm receipt')
+        error: (err) => {
+          this.showMessage(err.message || '确认收货失败');
+        }
       });
     }
   }
 
   applyRefund(order: Order) {
     if (!this.orderService.canApplyRefund(order)) {
-      this.showMessage('Cannot apply refund for this order');
+      this.showMessage('该订单无法申请退款');
       return;
     }
     this.router.navigate(['/after-sales'], { queryParams: { orderId: order.id } });
@@ -162,21 +181,25 @@ export class OrdersComponent implements OnInit {
   }
 
   private showMessage(message: string) {
-    this.snackBar.open(message, 'Close', { duration: 2000, horizontalPosition: 'center', verticalPosition: 'top' });
+    this.snackBar.open(message, '关闭', {
+      duration: 2000,
+      horizontalPosition: 'center',
+      verticalPosition: 'top'
+    });
   }
 
   trackByOrderId(_index: number, order: Order): string {
     return order.id;
   }
-
+  
   canCancel(order: Order): boolean {
     return this.orderService.canCancel(order);
   }
-
+  
   canConfirmReceipt(order: Order): boolean {
     return this.orderService.canConfirmReceipt(order);
   }
-
+  
   canApplyRefund(order: Order): boolean {
     return this.orderService.canApplyRefund(order);
   }