optrader/shoptime
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

통합로그 No.27 AL_SBM 수정

Browse Source
This commit is contained in:
jiwon93.son
2025-10-15 17:18:54 +09:00
parent 55009a6afd
commit c0d5cd4e1e
2 changed files with 87 additions and 81 deletions
Download Patch File Download Diff File Expand all files Collapse all files

150
com.twin.app.shoptime/src/views/DetailPanel/DetailPanel.jsx
View File

@@ -4,51 +4,51 @@ import React, {
useMemo,
useRef,
useState,
} from 'react';
} from "react";
import { useDispatch, useSelector } from 'react-redux';
import { useDispatch, useSelector } from "react-redux";
import Spotlight from '@enact/spotlight';
import { setContainerLastFocusedElement } from '@enact/spotlight/src/container';
import Spotlight from "@enact/spotlight";
import { setContainerLastFocusedElement } from "@enact/spotlight/src/container";
import {
changeAppStatus,
changeLocalSettings,
setHidePopup,
} from '../../actions/commonActions';
import { clearCouponInfo } from '../../actions/couponActions';
import { getDeviceAdditionInfo } from '../../actions/deviceActions';
} from "../../actions/commonActions";
import { clearCouponInfo } from "../../actions/couponActions";
import { getDeviceAdditionInfo } from "../../actions/deviceActions";
import {
clearThemeDetail,
getThemeCurationDetailInfo,
getThemeHotelDetailInfo,
} from '../../actions/homeActions';
} from "../../actions/homeActions";
import {
getMainCategoryDetail,
getMainYouMayLike,
} from '../../actions/mainActions';
import { popPanel, updatePanel } from '../../actions/panelActions';
import { finishVideoPreview } from '../../actions/playActions';
} from "../../actions/mainActions";
import { popPanel, updatePanel } from "../../actions/panelActions";
import { finishVideoPreview } from "../../actions/playActions";
import {
clearProductDetail,
getProductGroup,
getProductImageLength,
getProductOptionId,
} from '../../actions/productActions';
import MobileSendPopUp from '../../components/MobileSend/MobileSendPopUp';
import TBody from '../../components/TBody/TBody';
import THeader from '../../components/THeader/THeader';
import TPanel from '../../components/TPanel/TPanel';
import * as Config from '../../utils/Config';
import { panel_names } from '../../utils/Config';
import { $L, getQRCodeUrl } from '../../utils/helperMethods';
import css from './DetailPanel.module.less';
import GroupProduct from './GroupProduct/GroupProduct';
import SingleProduct from './SingleProduct/SingleProduct';
import ThemeProduct from './ThemeProduct/ThemeProduct';
import UnableProduct from './UnableProduct/UnableProduct';
import YouMayLike from './YouMayLike/YouMayLike';
import { now } from 'lodash';
} from "../../actions/productActions";
import MobileSendPopUp from "../../components/MobileSend/MobileSendPopUp";
import TBody from "../../components/TBody/TBody";
import THeader from "../../components/THeader/THeader";
import TPanel from "../../components/TPanel/TPanel";
import * as Config from "../../utils/Config";
import { panel_names } from "../../utils/Config";
import { $L, getQRCodeUrl } from "../../utils/helperMethods";
import css from "./DetailPanel.module.less";
import GroupProduct from "./GroupProduct/GroupProduct";
import SingleProduct from "./SingleProduct/SingleProduct";
import ThemeProduct from "./ThemeProduct/ThemeProduct";
import UnableProduct from "./UnableProduct/UnableProduct";
import YouMayLike from "./YouMayLike/YouMayLike";
import { now } from "lodash";
export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
const dispatch = useDispatch();
@@ -85,7 +85,7 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
);
const panels = useSelector((state) => state.panels.panels);
const [lgCatCd, setLgCatCd] = useState('');
const [lgCatCd, setLgCatCd] = useState("");
const [isYouMayLikeOpened, setIsYouMayLikeOpened] = useState(false);
const [selectedIndex, setSelectedIndex] = useState(0);
@@ -93,7 +93,7 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
useEffect(() => {
dispatch(getProductOptionId(undefined));
if (panelInfo?.type === 'hotel') {
if (panelInfo?.type === "hotel") {
dispatch(
getThemeHotelDetailInfo({
patnrId: panelInfo?.patnrId,
@@ -102,7 +102,7 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
);
}
if (panelInfo?.type === 'theme') {
if (panelInfo?.type === "theme") {
dispatch(
getThemeCurationDetailInfo({
patnrId: panelInfo?.patnrId,
@@ -117,7 +117,7 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
getMainCategoryDetail({
patnrId: panelInfo?.patnrId,
prdtId: panelInfo?.prdtId,
liveReqFlag: panelInfo?.liveReqFlag ? panelInfo?.liveReqFlag : 'N',
liveReqFlag: panelInfo?.liveReqFlag ? panelInfo?.liveReqFlag : "N",
})
);
}
@@ -153,7 +153,7 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
}, [panelInfo?.curationId, panelInfo?.patnrId, panelInfo?.prdtId, lgCatCd]);
useEffect(() => {
if (productData?.pmtSuptYn === 'Y' && productData?.grPrdtProcYn === 'Y') {
if (productData?.pmtSuptYn === "Y" && productData?.grPrdtProcYn === "Y") {
dispatch(
getProductGroup({
patnrId: panelInfo?.patnrId,
@@ -199,14 +199,14 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
prdtId: productInfo?.prdtId,
entryMenu: entryMenu,
nowMenu: nowMenu,
liveFlag: 'Y',
qrType: 'billingDetail',
liveFlag: "Y",
qrType: "billingDetail",
});
}, [serverHOST, serverType, deviceInfo, entryMenu, productInfo]);
const onSpotlightUpTButton = (e) => {
e.stopPropagation();
Spotlight.focus('spotlightId_backBtn');
Spotlight.focus("spotlightId_backBtn");
};
const onClick = useCallback(
@@ -235,8 +235,8 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
const handleSMSonClose = useCallback(() => {
dispatch(setHidePopup());
setTimeout(() => {
Spotlight.focus('spotlightId_backBtn');
Spotlight.focus('shopbymobile_Btn');
Spotlight.focus("spotlightId_backBtn");
Spotlight.focus("shopbymobile_Btn");
}, 0);
}, [dispatch]);
@@ -245,7 +245,7 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
const prdtId =
themeProductInfos &&
themeProductInfos.length > 0 &&
panelInfo?.type === 'theme'
panelInfo?.type === "theme"
? themeProductInfos[selectedIndex].prdtId
: panelInfo?.prdtId;
@@ -272,7 +272,7 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
patnrId: panelInfo?.patnrId,
date: formattedDate,
expireTime: currentDate.getTime() + 1000 * 60 * 60 * 24 * 14,
cntryCd: httpHeader['X-Device-Country'],
cntryCd: httpHeader["X-Device-Country"],
});
if (recentItems.length >= 51) {
@@ -295,19 +295,19 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
setLgCatCd(productData.catCd);
} else if (
themeProductInfos &&
themeProductInfos[selectedIndex]?.pmtSuptYn === 'N' &&
themeProductInfos[selectedIndex]?.pmtSuptYn === "N" &&
panelInfo?.curationId
) {
setLgCatCd(themeProductInfos[selectedIndex]?.catCd);
} else {
setLgCatCd('');
setLgCatCd("");
}
}, [productData, themeProductInfos, selectedIndex, panelInfo?.curationId]);
const mobileSendPopUpProductImg = useMemo(() => {
if (panelInfo?.type === 'theme' && themeProductInfos) {
if (panelInfo?.type === "theme" && themeProductInfos) {
return themeProductInfos[selectedIndex]?.imgUrls600[0];
} else if (panelInfo?.type === 'hotel' && hotelInfos) {
} else if (panelInfo?.type === "hotel" && hotelInfos) {
return hotelInfos[selectedIndex]?.hotelImgUrl;
} else {
return productData?.imgUrls600[0];
@@ -321,9 +321,9 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
]);
const mobileSendPopUpSubtitle = useMemo(() => {
if (panelInfo?.type === 'theme' && themeProductInfos) {
if (panelInfo?.type === "theme" && themeProductInfos) {
return themeProductInfos[selectedIndex]?.prdtNm;
} else if (panelInfo?.type === 'hotel' && hotelInfos) {
} else if (panelInfo?.type === "hotel" && hotelInfos) {
return hotelInfos[selectedIndex]?.hotelNm;
} else {
return productData?.prdtNm;
@@ -338,27 +338,27 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
const isBillingProductVisible = useMemo(() => {
return (
productData?.pmtSuptYn === 'Y' &&
productData?.grPrdtProcYn === 'N' &&
productData?.pmtSuptYn === "Y" &&
productData?.grPrdtProcYn === "N" &&
panelInfo?.prdtId &&
webOSVersion >= '6.0'
webOSVersion >= "6.0"
);
}, [productData, webOSVersion, panelInfo?.prdtId]);
const isUnavailableProductVisible = useMemo(() => {
return (
productData?.pmtSuptYn === 'N' ||
(productData?.pmtSuptYn === 'Y' &&
productData?.grPrdtProcYn === 'N' &&
webOSVersion < '6.0' &&
productData?.pmtSuptYn === "N" ||
(productData?.pmtSuptYn === "Y" &&
productData?.grPrdtProcYn === "N" &&
webOSVersion < "6.0" &&
panelInfo?.prdtId)
);
}, [productData, webOSVersion, panelInfo?.prdtId]);
const isGroupProductVisible = useMemo(() => {
return (
productData?.pmtSuptYn === 'Y' &&
productData?.grPrdtProcYn === 'Y' &&
productData?.pmtSuptYn === "Y" &&
productData?.grPrdtProcYn === "Y" &&
groupInfos &&
groupInfos.length > 0
);
@@ -393,12 +393,12 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
(hotelInfos && hotelInfos.length > 0)) &&
selectedIndex !== undefined
) {
if (panelInfo?.type === 'theme') {
if (panelInfo?.type === "theme") {
const imgUrls600 = themeProductInfos[selectedIndex]?.imgUrls600 || [];
dispatch(getProductImageLength({ imageLength: imgUrls600.length }));
return;
}
if (panelInfo?.type === 'hotel') {
if (panelInfo?.type === "hotel") {
const imgUrls600 = hotelInfos[selectedIndex]?.imgUrls600 || [];
dispatch(getProductImageLength({ imageLength: imgUrls600.length }));
}
@@ -410,7 +410,7 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
dispatch(clearProductDetail());
dispatch(clearThemeDetail());
dispatch(clearCouponInfo());
setContainerLastFocusedElement(null, ['indicator-GridListContainer']);
setContainerLastFocusedElement(null, ["indicator-GridListContainer"]);
};
}, [dispatch]);
@@ -426,8 +426,8 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
className={css.header}
title={
(panelInfo?.prdtId && productData?.prdtNm) ||
(panelInfo?.type === 'hotel' && hotelData?.hotelInfo.curationNm) ||
(panelInfo?.type === 'theme' && themeData?.themeInfo[0]?.curationNm)
(panelInfo?.type === "hotel" && hotelData?.hotelInfo.curationNm) ||
(panelInfo?.type === "theme" && themeData?.themeInfo[0]?.curationNm)
}
onBackButton
onClick={onClick(false)}
@@ -437,8 +437,8 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
marqueeDisabled={false}
ariaLabel={
(panelInfo?.prdtId && productData?.prdtNm) ||
(panelInfo?.type === 'hotel' && hotelData?.hotelInfo.curationNm) ||
(panelInfo?.type === 'theme' && themeData?.themeInfo[0]?.curationNm)
(panelInfo?.type === "hotel" && hotelData?.hotelInfo.curationNm) ||
(panelInfo?.type === "theme" && themeData?.themeInfo[0]?.curationNm)
}
/>
<TBody
@@ -515,9 +515,9 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
{lgCatCd && youmaylikeData && youmaylikeData.length > 0 && isOnTop && (
<YouMayLike
isUnable={
productData?.pmtSuptYn === 'N' ||
panelInfo?.type === 'hotel' ||
panelInfo?.type === 'theme'
productData?.pmtSuptYn === "N" ||
panelInfo?.type === "hotel" ||
panelInfo?.type === "theme"
}
panelInfo={panelInfo}
setSelectedIndex={setSelectedIndex}
@@ -529,35 +529,41 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
<MobileSendPopUp
open={popupVisible}
onClose={handleSMSonClose}
title={$L('Send a purchase link for this item via SMS')}
title={$L("Send a purchase link for this item via SMS")}
subTitle={mobileSendPopUpSubtitle}
patncNm={productData?.patncNm}
patncNm={
panelInfo?.type === "theme" &&
themeProductInfos &&
themeProductInfos[selectedIndex]
? themeProductInfos[selectedIndex].patncNm
: productData?.patncNm
}
productImg={mobileSendPopUpProductImg}
patnrId={panelInfo?.patnrId}
prdtId={
panelInfo?.type === 'theme' &&
panelInfo?.type === "theme" &&
themeProductInfos &&
themeProductInfos[selectedIndex]
? themeProductInfos[selectedIndex].prdtId
: panelInfo?.prdtId
}
smsTpCd={panelInfo?.type === 'hotel' ? 'APP00205' : 'APP00201'}
smsTpCd={panelInfo?.type === "hotel" ? "APP00205" : "APP00201"}
curationId={panelInfo?.curationId}
curationNm={panelInfo?.curationNm}
hotelId={
panelInfo?.type === 'hotel' && hotelInfos[selectedIndex]?.hotelId
panelInfo?.type === "hotel" && hotelInfos[selectedIndex]?.hotelId
}
hotelNm={
panelInfo?.type === 'hotel' && hotelInfos[selectedIndex]?.hotelNm
panelInfo?.type === "hotel" && hotelInfos[selectedIndex]?.hotelNm
}
hotelDtlUrl={
panelInfo?.type === 'hotel' &&
panelInfo?.type === "hotel" &&
hotelInfos[selectedIndex]?.hotelDetailInfo?.hotelDtlUrl
}
productPrice={panelInfo?.type === 'hotel' && Price()}
productPrice={panelInfo?.type === "hotel" && Price()}
shopByMobileLogRef={shopByMobileLogRef}
spotlightId="shopbymobile_Btn"
smsText={productInfo?.pmtSuptYn === 'Y' ? detailUrl : undefined}
smsText={productInfo?.pmtSuptYn === "Y" ? detailUrl : undefined}
/>
)}
</>