Merge branch 'zzf-orderDetail'

src/app/(public)/customer/(has-dashboard)/order/view/order_id/[id]/_components/OrderAddressCard.tsx

@@ -1,10 +1,11 @@
-import type { CustomerOrder } from "@/types/customer/accountOrderDetail/order";
+// import type { CustomerOrder } from "@/types/customer/accountOrderDetail/order";
+import type { OrderDetails } from "@/types/customer/type";
 
 // 提取地址类型
-type OrderAddressItem = CustomerOrder["addresses"]["edges"][number]["node"];
+type OrderAddressItem = OrderDetails["addresses"]["edges"][number]["node"];
 
 interface Props {
-  orderData: CustomerOrder;
+  orderData: OrderDetails;
 }
 
 const getFullAddress = (address: OrderAddressItem) => {

src/app/(public)/customer/(has-dashboard)/order/view/order_id/[id]/_components/OrderInfoBlock.tsx

@@ -1,7 +1,8 @@
-import type { CustomerOrder } from "@/types/customer/accountOrderDetail/order";
+// import type { CustomerOrder } from "@/types/customer/accountOrderDetail/order";
+import type { OrderDetails } from "@/types/customer/type";
 import Image from "next/image";
 interface Props {
-  orderData: CustomerOrder;
+  orderData: OrderDetails;
 }
 export default function PromotionDetails({ orderData }: Props) {
   const money = (value: number) =>
@@ -12,12 +13,12 @@ export default function PromotionDetails({ orderData }: Props) {
 
   // 各个优惠金额，取绝对值用于展示
   const couponDiscount = Math.abs(orderData.discountAmount ?? 0);
-  const giftCardAmt = Math.abs(orderData.giftcardAmount ?? 0);
+  const giftCardAmt = Math.abs(Number(orderData.giftcardAmount ?? 0));
   const rewardPointsAmt = Math.abs(orderData.rewardPointsAmount ?? 0);
   const vipPlusAmt = orderData.vipPlusAmount
     ? Number(orderData.vipPlusAmount)
     : 0;
-  const vipDiscountAmt = Math.abs(orderData.vipDiscountAmount ?? 0);
+  const vipDiscountAmt = Math.abs(Number(orderData.vipDiscountAmount ?? 0));
   const earnedPoints = orderData.rewardPointsEarned ?? 0;
   return (
     <section

src/app/(public)/customer/(has-dashboard)/order/view/order_id/[id]/_components/ProductList.tsx

@@ -1,7 +1,8 @@
 // ProductList.tsx
-import type { CustomerOrder } from "@/types/customer/accountOrderDetail/order";
+// import type { CustomerOrder } from "@/types/customer/accountOrderDetail/order";
+import type { OrderDetails } from "@/types/customer/type";
 interface Props {
-  orderData: CustomerOrder;
+  orderData: OrderDetails;
 }
 const formatDate = (date: string) => {
   if (!date) return "";

src/app/(public)/customer/(has-dashboard)/order/view/order_id/[id]/page.tsx

@@ -5,10 +5,12 @@ import OrderAddressCard from "./_components/OrderAddressCard";
 // import PriceSummary from "./_components/PriceSummary";
 // import {restApiFetch} from "@utils/bagisto/index";
 import { serverGraphqlFetch } from "@/utils/bagisto/index";
-import {
-GET_ORDER_DETAIL_BY_ID
-} from "@/graphql";
-import type { CustomerOrderResponse } from "@/types/customer/accountOrderDetail/order";
+import type { OrderDetailsData } from "@/types/customer/type";
+// import {
+// GET_ORDER_DETAIL_BY_ID
+// } from "@/graphql";
+import { GET_ORDER_DETAILS } from "@/graphql";
+// import type { CustomerOrderResponse } from "@/types/customer/accountOrderDetail/order";
 // import type {  OrderData,OrderApiResponse } from "@/types/api/customer/order/vieworder";
 type Params = {
   id: string;
@@ -27,15 +29,21 @@ export default async function OrderDetail({ params }: { params: Params }) {
   //   isRoute: false
   // }
   // );
-  const { data: orderDetailData } = await serverGraphqlFetch<
-    CustomerOrderResponse,
-    { id: number }
-  >({
-    query: GET_ORDER_DETAIL_BY_ID,
-    variables: {
-      id: Number(orderId),
-    },
-  });
+  // const { data: orderDetailData } = await serverGraphqlFetch<
+  //   CustomerOrderResponse,
+  //   { id: number }
+  // >({
+  //   query: GET_ORDER_DETAIL_BY_ID,
+  //   variables: {
+  //     id: Number(orderId),
+  //   },
+  // });
+  const {data: orderDetailData} = await serverGraphqlFetch<OrderDetailsData,{id:string}>({
+        query: GET_ORDER_DETAILS,
+        variables: {
+            id:orderId
+        }
+    }); 
   console.log("父组件 orderDetailData:", orderDetailData?.customerOrder); 
   // const orderData: OrderData = res.body.data;
   // console.log("父组件 orderData:", orderData, !!orderData); 
@@ -45,19 +53,20 @@ export default async function OrderDetail({ params }: { params: Params }) {
     return <div>Loading / 订单不存在</div>;
   }
   return (
+    
     <div className="min-h-screen bg-white">
       {/* 顶部固定导航栏（客户端组件：返回按钮） */}
       <OrderHeader title="Orders Information" />
 
       {/* 商品列表：循环渲染，自动兼容1件或多件商品 */}
           <ProductList
-        orderData={orderDetailData?.customerOrder}
+        orderData={customerOrder}
       />
 
       <div className="">
         {/* 收货信息、支付信息区块 */}
-        <OrderInfoBlock orderData={orderDetailData?.customerOrder} />
-         <OrderAddressCard orderData={orderDetailData?.customerOrder}/>
+        <OrderInfoBlock orderData={customerOrder} />
+         <OrderAddressCard orderData={customerOrder}/>
         {/* 分享按钮区域 */}
         <div className="my-6">
           <h3 className="text-lg font-bold mb-4">Share order:</h3>

src/graphql/catalog/queries/GetOrderDetailById.ts

@@ -1,71 +0,0 @@
-import { gql, type TypedDocumentNode } from "@apollo/client";
-import type { CustomerOrderResponse } from "@/types/customer/accountOrderDetail/order";
-
-export const GET_ORDER_DETAIL_BY_ID: TypedDocumentNode<CustomerOrderResponse> = gql`
-query GetCustomerOrder($id: ID!) {
-  customerOrder(id: $id) {
-    id
-    incrementId
-    status
-    createdAt
-    customerFullName
-    subTotal
-    grandTotal
-    discountAmount
-    couponCode
-    giftcardNumber
-    giftcardAmount
-    rewardPointsUsed
-    rewardPointsAmount
-    rewardPointsEarned
-    vipPlusAmount
-    vipDiscountAmount
-    shippingAmount
-    shippingTitle
-    shippingInsuranceAmount
-    taxAmount
-    totalItemCount
-    totalQtyOrdered
-    items {
-      edges {
-        node {
-          id
-          sku
-          name
-          qtyOrdered
-          price
-          total
-          type
-          baseImage
-        }
-      }
-    }
-    addresses {
-      edges {
-        node {
-          addressType
-          firstName
-          lastName
-          phone
-          address
-          city
-          state
-          country
-          postcode
-        }
-      }
-    }
-    payment {
-      method
-      methodTitle
-    }
-    shipments {
-      edges {
-        node {
-          id
-        }
-      }
-    }
-  }
-}
-`;

src/graphql/catalog/queries/index.ts

@@ -13,4 +13,3 @@ export { GET_CATEHORY_BY_ID } from "./GetCategoryById";
 export { GET_PRODUCT_BY_ID } from "./GetProductById";
 export { GET_CATEGORY_ATTR_FILTERS } from "./CategoryAttributeFilters";
 export { CATEGORY_PRODUCTS } from "./GetCategoryProducts";
-export { GET_ORDER_DETAIL_BY_ID } from "./GetOrderDetailById";

src/graphql/customer/query/GetOrderDetails.ts

@@ -9,6 +9,7 @@ export const GET_ORDER_DETAILS: TypedDocumentNode<OrderDetailsData> = gql`
     id
     _id
     status
+    customerFullName
     channelName
     customerEmail
     customerFirstName
@@ -103,6 +104,13 @@ export const GET_ORDER_DETAILS: TypedDocumentNode<OrderDetailsData> = gql`
         }
       }
     }
+    shipments {
+      edges {
+        node {
+          id
+        }
+      }
+    }
     createdAt
     updatedAt
   }

src/types/customer/accountOrderDetail/order.ts

@@ -1,94 +0,0 @@
-// @/types/order/customer-order.ts
-export type CustomerOrderResponse = {
-  // data: {
-    customerOrder: CustomerOrder;
-  // };
-};
-
-export type CustomerOrder = {
-  id: string;
-  incrementId: string;
-  status: string;
-  createdAt: string;
-  customerFullName: string;
-  subTotal: number;
-  grandTotal: number;
-  discountAmount: number;
-  couponCode: string | null;
-  giftcardNumber: string | null;
-  giftcardAmount: number | null;
-  rewardPointsUsed: number;
-  rewardPointsAmount: number;
-  rewardPointsEarned: number;
-  vipPlusAmount: number | null;
-  vipDiscountAmount: number | null;
-  shippingAmount: number;
-  shippingTitle: string;
-  shippingInsuranceAmount: string;
-  taxAmount: number;
-  totalItemCount: number;
-  totalQtyOrdered: number;
-  items: OrderItemConnection;
-  addresses: OrderAddressConnection;
-  payment: OrderPayment;
-  shipments: OrderShipmentConnection;
-};
-
-// 商品列表
-export type OrderItemConnection = {
-  edges: Array<{
-    node: OrderItem;
-  }>;
-};
-
-export type OrderItem = {
-  id: string;
-  sku: string;
-  name: string;
-  qtyOrdered: number;
-  price: number;
-  total: number;
-  type: string;
-  baseImage: string; // 这里是JSON字符串，后续需要JSON.parse解析
-};
-
-// 地址
-export type OrderAddressConnection = {
-  edges: Array<{
-    node: OrderAddress;
-  }>;
-};
-
-export type OrderAddress = {
-  addressType: string;
-  firstName: string;
-  lastName: string;
-  phone: string;
-  address: string;
-  city: string;
-  state: string;
-  country: string;
-  postcode: string;
-};
-
-// 支付信息
-export type OrderPayment = {
-  method: string;
-  methodTitle: string;
-};
-
-// 发货信息
-export type OrderShipmentConnection = {
-  edges: Array<{
-    node: {
-      id: string;
-    };
-  }>;
-};
-
-export type BaseImageRaw = {
-  small_image_url: string;
-  medium_image_url: string;
-  large_image_url: string;
-  original_image_url: string;
-};

src/types/customer/order.ts

@@ -82,6 +82,7 @@ export interface OrderDetails {
     id: string;
     _id: number;
     status: string;
+    customerFullName: string;
     channelName: string;
     customerEmail: string;
     customerFirstName: string;
@@ -131,9 +132,18 @@ export interface OrderDetails {
     addresses: AddressListInOrderDetails;
     createdAt: string;
     updatedAt: string;
-  
+    shipments: OrderShipmentConnection;
 }
 
+// 发货信息
+export type OrderShipmentConnection = {
+  edges: Array<{
+    node: {
+      id: string;
+    };
+  }>;
+};
+
 export interface OrderDetailsData {
   customerOrder: OrderDetails | null;
 }