From f194b55a30fd20dd23190493ee445f3ecc7cb3ee Mon Sep 17 00:00:00 2001 From: "sungmin.in" Date: Tue, 7 May 2024 18:55:13 +0900 Subject: [PATCH] =?UTF-8?q?[=EB=A7=88=EC=9D=B4=EC=98=A4=EB=8D=94=EC=8A=A4]?= =?UTF-8?q?=20=EB=AA=A9=EB=8D=B0=EC=9D=B4=ED=84=B0=20=EC=B6=94=EA=B0=80=20?= =?UTF-8?q?/=20=EA=B8=B0=EB=8A=A5=20=EA=B5=AC=ED=98=84=EC=A4=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- com.twin.app.shoptime/assets/mock/temp.json | 92 +++ .../src/actions/orderActions.js | 7 +- .../MyPageSub/MyOrders/MyOrders.jsx | 51 +- .../MyOrders/OrderList/OrderList.jsx | 563 +++++++----------- 4 files changed, 347 insertions(+), 366 deletions(-) create mode 100644 com.twin.app.shoptime/assets/mock/temp.json diff --git a/com.twin.app.shoptime/assets/mock/temp.json b/com.twin.app.shoptime/assets/mock/temp.json new file mode 100644 index 00000000..08a45760 --- /dev/null +++ b/com.twin.app.shoptime/assets/mock/temp.json @@ -0,0 +1,92 @@ +{ + "retCode": 0, + "retMsg": "Success", + "data": { + "orderInfo": [ + { + "mbrNo": "US2201180082892", + "ordNo": "t8202307200126612", + "storReqNo": null, + "cntryCd": "US", + "dlvrEmalAddr": "US2306190103418@email.co.kr", + "dlvrCtpt": "00001111114", + "dlvrOdrLnm": "ddd", + "dlvrOdrFnm": "ffff", + "dlvrZpcd": "12345", + "dlvrStatNm": "fdfd", + "dlvrCityNm": "San Francisco", + "dlvrDtlAddr": "Lyon St, San Francisco", + "bilEmalAddr": "billemail@email.co.kr", + "bilCtpt": "12345", + "bilOdrLnm": "LNM", + "bilOdrFnm": "FNM", + "bilZpcd": "12345", + "bilStatNm": "STATS", + "bilCityNm": "San Francisco", + "bilDtlAddr": "Lyon St, San Francisco", + "cardNo": "1234123412341234", + "cardKnd": "[연동x]MasterCard", + "cardVldTerm": "0912", + "cardSecCd": "123", + "ordPmtReqAmt": "64.15", + "totProdPrc": "65.0", + "totProdQty": "1", + "totDlvrAmt": "3.5", + "ordTotTaxAmt": "0.15", + "totDcAmt": "1.0", + "orderProductInfo": [ + { + "mbrNo": "US2201180082892", + "ordNo": "t8202307200126612", + "cntryCd": "US", + "patnrId": "1", + "prdtId": "A523924", + "prodSno": 34, + "prodPrc": "65.0", + "prodQty": "1", + "taxAmt": "0.2", + "dlvrAmt": "3.5", + "shptmDlvrStCd": "ORD00201", + "shptmOrdStCd": "ORD00601", + "ordReqDtt": "2023-07-25 06:49:16", + "cnclReqDtt": null, + "rtunReqDtt": null, + "intchReqDtt": null, + "shptmChngRsnCd": null, + "chngRsnCtnt": null, + "prdtOpt": [ + { + "mbrNo": "US2201180082892", + "ordNo": "t8202307200126612", + "cntryCd": "US", + "patnrId": "1", + "prdtId": "A523924", + "prodSno": 34, + "prodOptSno": "3", + "prodOptCdCval": "111", + "prodOptTpCdCval": "", + "optNm": "Color", + "prodOptCval": "red" + } + ], + "orderProductCouponInfo": [ + { + "mbrNo": "US2201180082892", + "ordNo": "t8202307200126612", + "cntryCd": "US", + "patnrId": "1", + "prdtId": "A523924", + "prodSno": 34, + "cpnSno": "49", + "cpnCdCval": "c02", + "cpnCdSeq": "1", + "dcAmt": "1.0" + } + ] + } + ], + "orderProductCoupontUse": null + } + ] + } +} diff --git a/com.twin.app.shoptime/src/actions/orderActions.js b/com.twin.app.shoptime/src/actions/orderActions.js index 4dbc50db..7d15d15e 100644 --- a/com.twin.app.shoptime/src/actions/orderActions.js +++ b/com.twin.app.shoptime/src/actions/orderActions.js @@ -1,9 +1,12 @@ +import axios from "axios"; + +import tempData from "../../assets/mock/temp.json"; import { URLS } from "../api/apiConfig"; import { TAxios } from "../api/TAxios"; import { types } from "./actionTypes"; import { getTermsAgreeYn } from "./commonActions"; -// 회원 주문 정보 조회 (IF-LGSP-340) +// 회원 주문 정보 조회 (IF-LGSP-340) --> MOCK 데이터 사용 API 완성후 변경 2024.05.07 export const getMyinfoOrderSearch = (params) => (dispatch, getState) => { const { mbrNo, @@ -21,7 +24,7 @@ export const getMyinfoOrderSearch = (params) => (dispatch, getState) => { dispatch({ type: types.GET_MY_INFO_ORDER_SEARCH, - payload: response.data.data, + payload: tempData, }); }; diff --git a/com.twin.app.shoptime/src/views/MyPagePanel/MyPageSub/MyOrders/MyOrders.jsx b/com.twin.app.shoptime/src/views/MyPagePanel/MyPageSub/MyOrders/MyOrders.jsx index 003e57a5..a93b8bd3 100644 --- a/com.twin.app.shoptime/src/views/MyPagePanel/MyPageSub/MyOrders/MyOrders.jsx +++ b/com.twin.app.shoptime/src/views/MyPagePanel/MyPageSub/MyOrders/MyOrders.jsx @@ -8,6 +8,15 @@ import SpotlightContainerDecorator from "@enact/spotlight/SpotlightContainerDeco import Spottable from "@enact/spotlight/Spottable"; import noOrderImg from "../../../../../assets/images/img-my-info-billing@3x.png"; +// getMyinfoOrderSearch : 회원 주문 정보 조회 +// getMyinfoOrderDetailSearch : 회원 주문 상세 정보 조회 +// getMyinfoOrderShippingSearch : 회원 주문 배송 상세 정보 조회 +import { + getMyinfoOrderDetailSearch, + getMyinfoOrderSearch, + getMyinfoOrderShippingSearch, + tempGetInfo, +} from "../../../../actions/orderActions"; import TBody from "../../../../components/TBody/TBody"; import TButtonTab, { LIST_TYPE, @@ -26,6 +35,8 @@ const TabContainer = SpotlightContainerDecorator( ); export default function MyOrders({ title, cbScrollTo }) { + const { appStatus } = useSelector((state) => state.common); + const [selectedTab, setSelectedTab] = useState(0); const [dropDownTab, setDropDownTab] = useState(0); @@ -39,6 +50,17 @@ export default function MyOrders({ title, cbScrollTo }) { const { userInfo } = useSelector( (state) => state.common.appStatus.loginUserData ); + + const orderInfoData = useSelector((state) => state.order.orderInfoData.data); + const orderInfo = orderInfoData?.orderInfo; + const orderProductInfo = orderInfo?.orderProductInfo; + const orderProductCouponInfo = orderProductInfo?.orderProductCouponInfo; + + // console.log(orderInfoData, "orderInfoData"); + // console.log(orderInfo, "orderInfo"); + // console.log(orderProductInfo, "orderProductInfo"); + // console.log(orderProductCouponInfo, "orderProductCouponInfo"); + const handleItemClick = useCallback( ({ index, ...rest }) => { console.log("#TButtonTab onItemClick", index, rest); @@ -50,7 +72,9 @@ export default function MyOrders({ title, cbScrollTo }) { const [orderPopOpen, setOrderPopOpen] = useState(false); const [orderTrackOpen, setOrderTrackOpen] = useState(false); const [orderCancelOpen, setOrderCancelOpen] = useState(false); + let timerRef = useRef(); + const onClose = useCallback(() => { setPopOpen(true); }, []); @@ -78,6 +102,28 @@ export default function MyOrders({ title, cbScrollTo }) { clearTimeout(timerRef.current); }; }, []); + + // 현재 MOCK 데이터 사용 + useEffect(() => { + if ( + appStatus && + appStatus.loginUserData && + appStatus.loginUserData.userInfo + ) { + dispatch( + getMyinfoOrderSearch({ + mbrNo: appStatus.loginUserData.userInfo, + srchMonth: dropDownTab === 0 ? 3 : 6, + }) + ); + } + // dispatch(getMyinfoOrderShippingSearch()); + }, [dispatch, dropDownTab]); + + const handleSelectFilter = useCallback(({ selected }) => { + setDropDownTab(selected); + }, []); + return ( <> @@ -95,6 +141,7 @@ export default function MyOrders({ title, cbScrollTo }) { className={css.dropdown} selectedIndex={dropDownTab && dropDownTab} width="small" + onSelect={handleSelectFilter} > {filterMethods} @@ -114,8 +161,8 @@ export default function MyOrders({ title, cbScrollTo }) { */}
- {selectedTab === 0 && } - {selectedTab === 1 && } + {selectedTab === 0 && } + {selectedTab === 1 && }
diff --git a/com.twin.app.shoptime/src/views/MyPagePanel/MyPageSub/MyOrders/OrderList/OrderList.jsx b/com.twin.app.shoptime/src/views/MyPagePanel/MyPageSub/MyOrders/OrderList/OrderList.jsx index e8c45928..bd7eac0a 100644 --- a/com.twin.app.shoptime/src/views/MyPagePanel/MyPageSub/MyOrders/OrderList/OrderList.jsx +++ b/com.twin.app.shoptime/src/views/MyPagePanel/MyPageSub/MyOrders/OrderList/OrderList.jsx @@ -1,4 +1,4 @@ -import React from "react"; +import React, { useCallback, useEffect, useState } from "react"; import Spottable from "@enact/spotlight/Spottable"; @@ -7,393 +7,232 @@ import { $L } from "../../../../../utils/helperMethods"; import css from "./OrderList.module.less"; const SpottableComponent = Spottable("div"); -export default function OrderList() { +export default function OrderList({ orderInfo }) { + // console.log(orderInfo, "아더인포!!!"); + + const [orderInfoCount, setOrederInfoCount] = useState(); + + // 주문 취소 + const onCancel = useCallback(() => {}, []); + + useEffect(() => { + if (orderInfo) { + setOrederInfoCount(orderInfo.length); + } + }, [orderInfo]); + + console.log(orderInfo, "orderInfo"); + return ( <> -
-
-

- ORDER NUMBER : AA12349575h6 -

- - {$L("Cancel order")} - -
- -
-
-
-
-

payment method

- Mastercard / ****-1199 + {orderInfo && + orderInfo.map((order, index) => { + return ( +
+
+

+ ORDER NUMBER :{" "} + {order.ordNo} +

+ + {$L("Cancel order")} +
-
-

order date

- January 5, 2023 -
-
-
-
    -
  • -
    item
    -
    4
    -
    • -
  • -
    item total
    -
    $90.40
    -
    • -
  • -
    option
    -
    $4.40
    -
    • -
  • -
    s&h
    -
    $11.00
    -
    • -
  • -
    tax
    -
    $5.00
    -
    • -
  • -
    coupon
    -
    -$10.00
    -
    • -
-
-
-
-
order total
-
$ 95.80
-
-
-
    - {/* 여기부터 아이템 리스트들 */} -
  • -
    -
    - - Preparing for shipment - - {/* 색상별 뿌려주는 틀림. - Shipping - Canceled - Completed - */} - Arriving January 10~ January 15 {/* 문구 다틀릴예정 */} -
    - - {$L("view order details")} - -
    -
    +
    +
    -
    -
    - - IHWIP XL Everyday Essentials Crossbody with 2 Straps -
    -
    -
    -
    -
      -
    • ID: A565145
      • -
    • Qty: 1
      • -
    • Silver Metallic / XL
      • -
    -
    - $38.09 - | - OPTION: $5.50 - | - S&H: $5.50 -
    -
    -
    +
    +

    payment method

    + + {order.cardKnd} / {order.cardNo} + +
    +
    +

    order date

    + January 5, 2023
    • - - VIEW CANCELLATION DETAILS - - - BUY IT AGAIN - - - VIEW CANCELLATION DETAILS - - - BUY IT AGAIN - - {/* 버튼은 4개까지만 복사해서 쓰면댐 */} +
      item
      +
      ${order?.totProdQty}
      +
      • +
    • +
      item total
      +
      {order?.totProdPrc}
      +
      • +
    • +
      option
      +
      ${order?.totOptPrc}
      +
      • +
    • +
      s&h
      +
      ${order?.totDlvrAmt}
      +
      • +
    • +
      tax
      +
      ${order?.ordTotTaxAmt}
      +
      • +
    • +
      coupon
      +
      -${order?.totDcAmt}
    -
    • -
  • -
    -
    - - Preparing for shipment - - {/* 색상별 뿌려주는 틀림. +
    +
    order total
    +
    $ 95.80
    +
    +
    +
      + {/* 여기부터 아이템 리스트들 */} +
    • +
      +
      + + Preparing for shipment + + {/* 색상별 뿌려주는 틀림. Shipping Canceled Completed */} - Arriving January 10~ January 15 {/* 문구 다틀릴예정 */} -
      + Arriving January 10~ January 15{" "} + {/* 문구 다틀릴예정 */} +
      - - {$L("view order details")} - -
    -
    -
    -
    -
    - - IHWIP XL Everyday Essentials Crossbody with 2 Straps + + {$L("view order details")} +
    -
    -
    -
    -
      -
    • ID: A565145
      • -
    • Qty: 1
      • -
    • Silver Metallic / XL
      • -
    -
    - $38.09 - | - OPTION: $5.50 - | - S&H: $5.50 +
    +
    +
    +
    + + IHWIP XL Everyday Essentials Crossbody with 2 + Straps +
    +
    +
    +
    +
      +
    • ID: A565145
      • +
    • Qty: 1
      • +
    • Silver Metallic / XL
      • +
    +
    + $38.09 + | + OPTION: $5.50 + | + S&H: $5.50 +
    +
    +
    +
    +
      +
    • + + VIEW CANCELLATION DETAILS + + + BUY IT AGAIN + + + VIEW CANCELLATION DETAILS + + + BUY IT AGAIN + + {/* 버튼은 4개까지만 복사해서 쓰면댐 */} +
      • +
    +
    -
    -
    -
    -
      -
    • - - VIEW CANCELLATION DETAILS - - - BUY IT AGAIN - - - VIEW CANCELLATION DETAILS - - - BUY IT AGAIN - - {/* 버튼은 4개까지만 복사해서 쓰면댐 */} -
      • -
    -
    -
    -
    • -
-
-
-
-
-
-

- ORDER NUMBER : AA12349575h6 -

- - {$L("Cancel order")} - -
+ +
  • +
    +
    + + Preparing for shipment + + {/* 색상별 뿌려주는 틀림. + Shipping + Canceled + Completed + */} + Arriving January 10~ January 15{" "} + {/* 문구 다틀릴예정 */} +
    -
    -
    -
    -
    -

    payment method

    - Mastercard / ****-1199 -
    -
    -

    order date

    - January 5, 2023 + + {$L("view order details")} + +
    +
    +
    +
    +
    + + IHWIP XL Everyday Essentials Crossbody with 2 + Straps +
    +
    +
    +
    +
      +
    • ID: A565145
      • +
    • Qty: 1
      • +
    • Silver Metallic / XL
      • +
    +
    + $38.09 + | + OPTION: $5.50 + | + S&H: $5.50 +
    +
    +
    +
    +
    +
    +
      +
    • + + VIEW CANCELLATION DETAILS + + + BUY IT AGAIN + + + VIEW CANCELLATION DETAILS + + + BUY IT AGAIN + + {/* 버튼은 4개까지만 복사해서 쓰면댐 */} +
      • +
    +
    +
    +
    • + +
    -
    -
      -
    • -
      item
      -
      4
      -
      • -
    • -
      item total
      -
      $90.40
      -
      • -
    • -
      option
      -
      $4.40
      -
      • -
    • -
      s&h
      -
      $11.00
      -
      • -
    • -
      tax
      -
      $5.00
      -
      • -
    • -
      coupon
      -
      -$10.00
      -
      • -
    -
    - -
    -
    order total
    -
    $ 95.80
    -
    -
    -
      - {/* 여기부터 아이템 리스트들 */} -
    • -
      -
      - - Preparing for shipment - - {/* 색상별 뿌려주는 틀림. - Shipping - Canceled - Completed - */} - Arriving January 10~ January 15 {/* 문구 다틀릴예정 */} -
      - - - {$L("view order details")} - -
      -
      -
      -
      -
      - - IHWIP XL Everyday Essentials Crossbody with 2 Straps -
      -
      -
      -
      -
        -
      • ID: A565145
        • -
      • Qty: 1
        • -
      • Silver Metallic / XL
        • -
      -
      - $38.09 - | - OPTION: $5.50 - | - S&H: $5.50 -
      -
      -
      -
      -
      -
      -
        -
      • - - VIEW CANCELLATION DETAILS - - - BUY IT AGAIN - - - VIEW CANCELLATION DETAILS - - - BUY IT AGAIN - - {/* 버튼은 4개까지만 복사해서 쓰면댐 */} -
        • -
      -
      -
      -
      • -
    • -
      -
      - - Preparing for shipment - - {/* 색상별 뿌려주는 틀림. - Shipping - Canceled - Completed - */} - Arriving January 10~ January 15 {/* 문구 다틀릴예정 */} -
      - - - {$L("view order details")} - -
      -
      -
      -
      -
      - - IHWIP XL Everyday Essentials Crossbody with 2 Straps -
      -
      -
      -
      -
        -
      • ID: A565145
        • -
      • Qty: 1
        • -
      • Silver Metallic / XL
        • -
      -
      - $38.09 - | - OPTION: $5.50 - | - S&H: $5.50 -
      -
      -
      -
      -
      -
      -
        -
      • - - VIEW CANCELLATION DETAILS - - - BUY IT AGAIN - - - VIEW CANCELLATION DETAILS - - - BUY IT AGAIN - - {/* 버튼은 4개까지만 복사해서 쓰면댐 */} -
        • -
      -
      -
      -
      • -
    -
    - - + ); + })} ); }