[장바구니] 노출관련 및 api에 맞춰 작업 #1
- 현재 추가는 안됌. - 삭제, 갯수 조절에 대해서는 정상작동. - 금액 노출 정상적이지 않는 부분에 대해서 수정
This commit is contained in:
@@ -40,12 +40,6 @@ export const cartReducer = (state = initialState, action) => {
|
||||
cartList: [...state.getMyinfoCartSearch.cartList, action.payload],
|
||||
totalCount: (state.getMyinfoCartSearch.totalCount || 0) + 1,
|
||||
},
|
||||
lastAction: {
|
||||
type: "insert",
|
||||
data: action.payload,
|
||||
timestamp: Date.now(),
|
||||
},
|
||||
error: null,
|
||||
};
|
||||
|
||||
// 장바구니에서 상품 삭제
|
||||
@@ -54,17 +48,11 @@ export const cartReducer = (state = initialState, action) => {
|
||||
...state,
|
||||
getMyinfoCartSearch: {
|
||||
...state.getMyinfoCartSearch,
|
||||
cartList: state.getMyinfoCartSearch.cartList.filter(
|
||||
cartList: (state.getMyinfoCartSearch.cartList || []).filter(
|
||||
item => item.prodSno !== action.payload.prodSno
|
||||
),
|
||||
totalCount: Math.max(0, (state.getMyinfoCartSearch.totalCount || 0) - 1),
|
||||
},
|
||||
lastAction: {
|
||||
type: "delete",
|
||||
data: action.payload,
|
||||
timestamp: Date.now(),
|
||||
},
|
||||
error: null,
|
||||
};
|
||||
|
||||
case types.UPDATE_MY_INFO_CART:
|
||||
@@ -72,13 +60,12 @@ export const cartReducer = (state = initialState, action) => {
|
||||
...state,
|
||||
getMyinfoCartSearch: {
|
||||
...state.getMyinfoCartSearch,
|
||||
cartList: state.getMyinfoCartSearch.cartList.map(item =>
|
||||
cartList: (state.getMyinfoCartSearch.cartList || []).map(item =>
|
||||
item.prodSno === action.payload.prodSno
|
||||
? { ...item, ...action.payload }
|
||||
: item
|
||||
),
|
||||
},
|
||||
error: null,
|
||||
};
|
||||
|
||||
// 장바구니에 상품 추가 (addToCart - 로컬 상태용)
|
||||
|
||||
@@ -11,20 +11,17 @@ import {
|
||||
useSelector,
|
||||
} from 'react-redux';
|
||||
|
||||
import Spotlight from '@enact/spotlight';
|
||||
import SpotlightContainerDecorator
|
||||
from '@enact/spotlight/SpotlightContainerDecorator';
|
||||
|
||||
import logoImage from '../../../assets/images/ic-partners-qvc@3x.png';
|
||||
import defaultImage from '../../../assets/images/img-thumb-empty-144@3x.png';
|
||||
import {
|
||||
deleteMyinfoCart,
|
||||
removeFromCart,
|
||||
updateCartItem,
|
||||
updateMyinfoCart,
|
||||
} from '../../actions/cartActions';
|
||||
import {
|
||||
removeFromMockCart,
|
||||
setMockCartItemQuantity,
|
||||
updateSelectedItems,
|
||||
} from '../../actions/mockCartActions';
|
||||
import CustomImage from '../../components/CustomImage/CustomImage';
|
||||
@@ -98,6 +95,7 @@ const CartProduct = ({ cartInfo, getScrollTo, scrollTop }) => {
|
||||
// 항상 호출되어야 하는 Hook들
|
||||
const fallbackCartData = useSelector((state) => state.cart.getMyinfoCartSearch.cartInfo);
|
||||
const selectedItems = useSelector((state) => state.mockCart.selectedItems || []);
|
||||
const userNumber = useSelector((state) => state.common.appStatus.loginUserData.userNumber);
|
||||
|
||||
// 실제 장바구니 데이터와 Mock 데이터 중 선택
|
||||
const cartData = cartInfo || fallbackCartData;
|
||||
@@ -158,32 +156,38 @@ const CartProduct = ({ cartInfo, getScrollTo, scrollTop }) => {
|
||||
};
|
||||
|
||||
// 수량 조절 핸들러
|
||||
const handleDecreseClick = useCallback((prodSno, currentQty) => {
|
||||
const handleDecreseClick = useCallback((prodSno, patnrId, prdtId, currentQty) => {
|
||||
if (currentQty > 1) {
|
||||
const newQty = currentQty - 1;
|
||||
|
||||
if (isMockMode) {
|
||||
dispatch(setMockCartItemQuantity(prodSno, newQty));
|
||||
// dispatch(setMockCartItemQuantity(prodSno, newQty));
|
||||
} else {
|
||||
// 실제 API 호출을 위한 사용자 정보 필요
|
||||
const { userNumber } = store.getState().common.appStatus.loginUserData;
|
||||
|
||||
if (userNumber) {
|
||||
dispatch(updateCartItem({ mbrNo: userNumber, cartSno: prodSno, prodQty: newQty }));
|
||||
dispatch(updateMyinfoCart({
|
||||
mbrNo: userNumber,
|
||||
patnrId,
|
||||
prdtId,
|
||||
prodSno,
|
||||
prodQty: newQty
|
||||
}));
|
||||
}
|
||||
}
|
||||
}
|
||||
}, [dispatch, isMockMode]);
|
||||
|
||||
const handleIncreseClick = useCallback((prodSno, currentQty) => {
|
||||
const handleIncreseClick = useCallback((prodSno, patnrId, prdtId, currentQty) => {
|
||||
const newQty = currentQty + 1;
|
||||
|
||||
if (isMockMode) {
|
||||
dispatch(setMockCartItemQuantity(prodSno, newQty));
|
||||
// dispatch(setMockCartItemQuantity(prodSno, newQty));
|
||||
} else {
|
||||
// 실제 API 호출을 위한 사용자 정보 필요
|
||||
const { userNumber } = store.getState().common.appStatus.loginUserData;
|
||||
|
||||
if (userNumber) {
|
||||
dispatch(updateCartItem({ mbrNo: userNumber, cartSno: prodSno, prodQty: newQty }));
|
||||
dispatch(updateMyinfoCart({ mbrNo: userNumber, patnrId, prdtId, prodSno, prodQty: newQty }));
|
||||
}
|
||||
}
|
||||
}, [dispatch, isMockMode]);
|
||||
@@ -266,19 +270,14 @@ const CartProduct = ({ cartInfo, getScrollTo, scrollTop }) => {
|
||||
);
|
||||
|
||||
//장바구니 삭제
|
||||
const deleteCart = (patnrId, prdtId, prodSno) => {
|
||||
const { userNumber } = store.getState().common.appStatus.loginUserData;
|
||||
console.log("###test",userNumber,
|
||||
patnrId,
|
||||
prdtId,
|
||||
prodSno)
|
||||
// dispatch(deleteMyinfoCart({
|
||||
// mbrNo : userNumber,
|
||||
// patnrId,
|
||||
// prdtId,
|
||||
// prodSno
|
||||
// }))
|
||||
}
|
||||
const deleteCart = useCallback((patnrId, prdtId, prodSno) => {
|
||||
dispatch(deleteMyinfoCart({
|
||||
mbrNo : userNumber,
|
||||
patnrId: String(patnrId),
|
||||
prdtId : String(prdtId),
|
||||
prodSno : String(prodSno)
|
||||
}))
|
||||
},[dispatch])
|
||||
|
||||
return (
|
||||
<>
|
||||
@@ -430,13 +429,13 @@ const CartProduct = ({ cartInfo, getScrollTo, scrollTop }) => {
|
||||
item.prodQty === 1 ? css.dimm : ""
|
||||
)}
|
||||
size="cartEa"
|
||||
onClick={() => handleDecreseClick(item.prodSno, item.prodQty)}
|
||||
onClick={() => handleDecreseClick(item.prodSno, item.patnrId, item.prdtId, item.prodQty)}
|
||||
spotlightId={"pd_ea_decrese"}
|
||||
spotlightDisabled={item.prodQty === 1}
|
||||
/>
|
||||
<div className={css.ea}>{item.prodQty}</div>
|
||||
<TButton
|
||||
onClick={() => handleIncreseClick(item.prodSno, item.prodQty)}
|
||||
onClick={() => handleIncreseClick(item.prodSno, item.patnrId, item.prdtId, item.prodQty)}
|
||||
className={css.plusBox}
|
||||
spotlightId={"pd_ea_increse"}
|
||||
size="cartEa"
|
||||
|
||||
@@ -30,7 +30,10 @@ import {
|
||||
sendLogPaymentEntry,
|
||||
sendLogTotalRecommend,
|
||||
} from '../../actions/logActions';
|
||||
import { popPanel, updatePanel } from '../../actions/panelActions';
|
||||
import {
|
||||
popPanel,
|
||||
updatePanel,
|
||||
} from '../../actions/panelActions';
|
||||
import TBody from '../../components/TBody/TBody';
|
||||
import TButton from '../../components/TButton/TButton';
|
||||
import TButtonScroller from '../../components/TButtonScroller/TButtonScroller';
|
||||
@@ -615,7 +618,7 @@ export default function CheckOutPanel({ panelInfo }) {
|
||||
<TBody className={css.tbody} cbScrollTo={getScrollToBody}>
|
||||
<THeader className={css.theader} title="CHECKOUT" onBackButton onClick={onBackClick} />
|
||||
<div className={css.Wrap}>
|
||||
{BUYNOW_CONFIG.isMockMode() ? (
|
||||
{/* {BUYNOW_CONFIG.isMockMode() ? (
|
||||
<SummaryContainerMock
|
||||
setPlaceOrderPopup={setPlaceOrderPopup}
|
||||
empTermsData={empTermsData}
|
||||
@@ -629,7 +632,7 @@ export default function CheckOutPanel({ panelInfo }) {
|
||||
defaultPrice={panelInfo?.defaultPrice}
|
||||
fromCartPanel={panelInfo?.fromCartPanel}
|
||||
/>
|
||||
) : (
|
||||
) : ( */}
|
||||
<SummaryContainer
|
||||
setPlaceOrderPopup={setPlaceOrderPopup}
|
||||
empTermsData={empTermsData}
|
||||
@@ -638,8 +641,8 @@ export default function CheckOutPanel({ panelInfo }) {
|
||||
currSignLoc={currSignLoc}
|
||||
doSendLogPaymentEntry={doSendLogPaymentEntry}
|
||||
/>
|
||||
)}
|
||||
{BUYNOW_CONFIG.isMockMode() ? (
|
||||
{/* )} */}
|
||||
{/* {BUYNOW_CONFIG.isMockMode() ? (
|
||||
<InformationContainerMock
|
||||
toggleOrderSideBar={toggleOrderSideBar}
|
||||
toggleOfferSideBar={toggleOfferSideBar}
|
||||
@@ -647,14 +650,14 @@ export default function CheckOutPanel({ panelInfo }) {
|
||||
doSendLogMyInfoEdit={doSendLogMyInfoEdit}
|
||||
orderItemsCount={orderItemsCount}
|
||||
/>
|
||||
) : (
|
||||
) : ( */}
|
||||
<InformationContainer
|
||||
toggleOrderSideBar={toggleOrderSideBar}
|
||||
toggleOfferSideBar={toggleOfferSideBar}
|
||||
scrollTopBody={scrollTopBody}
|
||||
doSendLogMyInfoEdit={doSendLogMyInfoEdit}
|
||||
/>
|
||||
)}
|
||||
{/* )} */}
|
||||
</div>
|
||||
</TBody>
|
||||
</TPanel>
|
||||
|
||||
@@ -41,7 +41,6 @@ export default memo(function OrderItemCard({
|
||||
const priceTotalData = useSelector(
|
||||
(state) => state.checkout?.checkoutTotalData
|
||||
);
|
||||
console.log("###priceTotalData",priceTotalData);
|
||||
|
||||
const formattedPrices = useMemo(() => {
|
||||
return {
|
||||
@@ -83,7 +82,7 @@ export default memo(function OrderItemCard({
|
||||
<p className={css.priceWrap}>
|
||||
<span className={css.itemPrice}>
|
||||
<span className={css.discountedPrice}>
|
||||
$ {(price * prodQty).toLocaleString('en-US', {
|
||||
$ {(Number(price) * Number(prodQty)).toLocaleString('en-US', {
|
||||
minimumFractionDigits: 2,
|
||||
maximumFractionDigits: 2
|
||||
})}
|
||||
|
||||
@@ -165,7 +165,7 @@ export default function OrderItemsSideBar({
|
||||
patncLogPath={item.patncLogPath}
|
||||
prdtId={item.prdtId}
|
||||
expsPrdtNo={item.expsPrdtNo}
|
||||
price={item.price >= item.originalPrice ? item.originalPrice : item.price}
|
||||
price={item.price2 >= item.price3 ? item.price3 : item.price2}
|
||||
currSign={item.currSign}
|
||||
currSignLoc={item.currSignLoc}
|
||||
shippingCharge={item.shippingCharge}
|
||||
|
||||
@@ -1,21 +1,32 @@
|
||||
import React, { useCallback, useEffect, useMemo } from "react";
|
||||
import React, {
|
||||
useCallback,
|
||||
useEffect,
|
||||
useMemo,
|
||||
} from 'react';
|
||||
|
||||
import { useDispatch, useSelector } from "react-redux";
|
||||
import {
|
||||
useDispatch,
|
||||
useSelector,
|
||||
} from 'react-redux';
|
||||
|
||||
import SpotlightContainerDecorator from "@enact/spotlight/SpotlightContainerDecorator";
|
||||
import SpotlightContainerDecorator
|
||||
from '@enact/spotlight/SpotlightContainerDecorator';
|
||||
|
||||
import { setHidePopup, setShowPopup } from "../../../actions/commonActions";
|
||||
import { popPanel } from "../../../actions/panelActions";
|
||||
import TButton from "../../../components/TButton/TButton";
|
||||
import TPopUp from "../../../components/TPopUp/TPopUp";
|
||||
import * as Config from "../../../utils/Config";
|
||||
import {
|
||||
setHidePopup,
|
||||
setShowPopup,
|
||||
} from '../../../actions/commonActions';
|
||||
import { sendLogTotalRecommend } from '../../../actions/logActions';
|
||||
import { popPanel } from '../../../actions/panelActions';
|
||||
import TButton from '../../../components/TButton/TButton';
|
||||
import TPopUp from '../../../components/TPopUp/TPopUp';
|
||||
import * as Config from '../../../utils/Config';
|
||||
import {
|
||||
$L,
|
||||
formatCurrencyValue,
|
||||
getErrorMessage,
|
||||
} from "../../../utils/helperMethods";
|
||||
import css from "./SummaryContainer.module.less";
|
||||
import { sendLogTotalRecommend } from "../../../actions/logActions";
|
||||
} from '../../../utils/helperMethods';
|
||||
import css from './SummaryContainer.module.less';
|
||||
|
||||
const Container = SpotlightContainerDecorator(
|
||||
{ enterTo: "last-focused" },
|
||||
@@ -51,12 +62,12 @@ export default function SummaryContainer({
|
||||
|
||||
// Mock Mode: priceTotalData가 없으면 가짜 데이터 제공
|
||||
const effectivePriceTotalData = hasValidPriceTotalData ? priceTotalData : {
|
||||
totProdPrc: 521.66,
|
||||
totProdPrc: 0.00,
|
||||
totDcAmt: 0,
|
||||
totDlvrAmt: 0,
|
||||
ordPmtNoTaxAmt: 521.66,
|
||||
ordTotTaxAmt: 50,
|
||||
ordPmtReqAmt: 571.66
|
||||
ordPmtNoTaxAmt: 0.0,
|
||||
ordTotTaxAmt: 0,
|
||||
ordPmtReqAmt: 0.00,
|
||||
};
|
||||
|
||||
const items = useMemo(
|
||||
|
||||
Reference in New Issue
Block a user