diff --git a/com.twin.app.shoptime/src/components/TPopUp/TPopUp.jsx b/com.twin.app.shoptime/src/components/TPopUp/TPopUp.jsx index 8e649902..917d4927 100644 --- a/com.twin.app.shoptime/src/components/TPopUp/TPopUp.jsx +++ b/com.twin.app.shoptime/src/components/TPopUp/TPopUp.jsx @@ -1,22 +1,38 @@ -import React, { useCallback, useEffect, useMemo } from "react"; +import React, { + useCallback, + useEffect, + useMemo, +} from 'react'; -import classNames from "classnames"; -import { useDispatch, useSelector } from "react-redux"; +import classNames from 'classnames'; +import { + useDispatch, + useSelector, +} from 'react-redux'; -import Alert from "@enact/sandstone/Alert"; -import Spotlight from "@enact/spotlight"; -import SpotlightContainerDecorator from "@enact/spotlight/SpotlightContainerDecorator"; -import Spottable from "@enact/spotlight/Spottable"; +import Alert from '@enact/sandstone/Alert'; +import Spotlight from '@enact/spotlight'; +import SpotlightContainerDecorator + from '@enact/spotlight/SpotlightContainerDecorator'; +import Spottable from '@enact/spotlight/Spottable'; -import defaultImageItem from "../../../assets/images/img-thumb-empty-product@3x.png"; -import { cancelFocusElement, focusElement } from "../../actions/commonActions"; -import { SpotlightIds } from "../../utils/SpotlightIds"; -import CustomImage from "../CustomImage/CustomImage"; -import TButton from "../TButton/TButton"; -import css from "../TPopUp/TPopUp.module.less"; -import { $L, scaleH, scaleW } from "../../utils/helperMethods"; -import TButtonTab from "../TButtonTab/TButtonTab"; -import TButtonScroller from "../TButtonScroller/TButtonScroller"; +import defaultImageItem + from '../../../assets/images/img-thumb-empty-product@3x.png'; +import { + cancelFocusElement, + focusElement, +} from '../../actions/commonActions'; +import { + $L, + scaleH, + scaleW, +} from '../../utils/helperMethods'; +import { SpotlightIds } from '../../utils/SpotlightIds'; +import CustomImage from '../CustomImage/CustomImage'; +import TButton from '../TButton/TButton'; +import TButtonScroller from '../TButtonScroller/TButtonScroller'; +import TButtonTab from '../TButtonTab/TButtonTab'; +import css from '../TPopUp/TPopUp.module.less'; const Container = SpotlightContainerDecorator( { enterTo: "default-element" }, @@ -46,6 +62,7 @@ const KINDS = [ "introTermsPopup", "optionPopup", "eventBannerPopup", + "energyPopup", "supportPopup", "exitPopup", "couponPopup", @@ -64,15 +81,14 @@ const KINDS = [ "trackPackagePopup", "optionalAgreement", "wideLeftPopup", - "normal", + "normal", ]; export const CONTENT_TYPES = { - TERMS: 'terms', - DEFAULT: 'default' + TERMS: "terms", + DEFAULT: "default", }; - export default function TPopUp({ kind, children, @@ -110,7 +126,7 @@ export default function TPopUp({ }) { const dispatch = useDispatch(); const popupVisible = useSelector((state) => state.common.popup.popupVisible); - const httpHeader = useSelector((state) => state.common.httpHeader); + const httpHeader = useSelector((state) => state.common.httpHeader); // useEffect(() => { // if (popupVisible) { @@ -133,14 +149,16 @@ export default function TPopUp({ // } // }, [spotlightId, popupVisible]); - useEffect(() => { if (popupVisible) { let focusTarget; if (spotlightId) { // console.log("focusTarget-1", spotlightId); focusTarget = spotlightId; - } else if (kind === "introTermsPopup" || contentType === CONTENT_TYPES.TERMS) { + } else if ( + kind === "introTermsPopup" || + contentType === CONTENT_TYPES.TERMS + ) { // console.log("focusTarget-2", "tPopupBtn1"); focusTarget = "tPopupBtn1"; } else { @@ -148,7 +166,7 @@ export default function TPopUp({ focusTarget = SpotlightIds.TPOPUP; } - const timerId = setTimeout(() => { + const timerId = setTimeout(() => { console.log("focusTarget", focusTarget); Spotlight.focus(focusTarget); }, 200); @@ -181,28 +199,29 @@ export default function TPopUp({ } return ButtonContainer; }, [kind]); - - + // optionalAgreement // 자동으로 Yes/No 버튼 텍스트 설정 - + const finalButton1Text = useMemo(() => { if (kind === "optionalAgreement" && !button1Text) { return "Yes"; } return button1Text; }, [kind, button1Text]); - + const finalButton2Text = useMemo(() => { if (kind === "optionalAgreement" && !button2Text) { return "No"; } return button2Text; }, [kind, button2Text]); - + // optionalAgreement일 경우 항상 버튼 표시 const shouldShowButtons = useMemo(() => { - return hasButton || kind === "optionalAgreement" || kind === "introTermsPopup"; + return ( + hasButton || kind === "optionalAgreement" || kind === "introTermsPopup" + ); }, [hasButton, kind]); //------------------------------------------------------- @@ -306,7 +325,7 @@ export default function TPopUp({ // 약관 제목 매핑 함수 const getTermsTitle = useCallback((trmsTpCd) => { - switch(trmsTpCd) { + switch (trmsTpCd) { case "MST00401": return $L("Privacy Policy"); case "MST00402": @@ -347,20 +366,22 @@ export default function TPopUp({ ); }, [termsData, getTermsTitle]); - // 약관 동의 핸들러 - const handleTermsAgree = useCallback((e) => { - if (onTermsAgree) { - onTermsAgree(e); - } - if (onClick) { - onClick(e); - } - }, [onTermsAgree, onClick]); + const handleTermsAgree = useCallback( + (e) => { + if (onTermsAgree) { + onTermsAgree(e); + } + if (onClick) { + onClick(e); + } + }, + [onTermsAgree, onClick] + ); // 컨텐츠 타입별 렌더링 함수 const renderContent = useMemo(() => { - switch(contentType) { + switch (contentType) { case CONTENT_TYPES.TERMS: return renderTermsContent(); default: @@ -368,7 +389,6 @@ export default function TPopUp({ } }, [contentType, children, renderTermsContent]); - return ( 0 && itemListDatasItem.map((item, index) => { - const { imgUrl, offerInfo, patnrId, prdtId, prdtNm, priceInfo } = - item; + const { + imgUrl, + offerInfo, + patnrId, + prdtId, + prdtNm, + priceInfo, + euEnrgLblInfos, + } = item; return ( - = 5} + euEnrgLblInfos={euEnrgLblInfos} /> ); })} diff --git a/com.twin.app.shoptime/src/views/DetailPanel/ProductAllSection/ProductAllSection.module.less b/com.twin.app.shoptime/src/views/DetailPanel/ProductAllSection/ProductAllSection.module.less index 1f481a63..30fb06fe 100644 --- a/com.twin.app.shoptime/src/views/DetailPanel/ProductAllSection/ProductAllSection.module.less +++ b/com.twin.app.shoptime/src/views/DetailPanel/ProductAllSection/ProductAllSection.module.less @@ -290,8 +290,8 @@ } &.active { - outline: 2px solid @PRIMARY_COLOR_RED !important; - + background: #4f172c; + outline: 2px solid #4f172c; .shopByMobileText { color: white !important; } @@ -410,7 +410,8 @@ } &.active { - border: 4px solid @PRIMARY_COLOR_RED; + border: 4px solid #4f172c; + background: #4f172c; } } diff --git a/com.twin.app.shoptime/src/views/HomePanel/BestSeller/BestSeller.jsx b/com.twin.app.shoptime/src/views/HomePanel/BestSeller/BestSeller.jsx index eff4bdab..b2d739a0 100644 --- a/com.twin.app.shoptime/src/views/HomePanel/BestSeller/BestSeller.jsx +++ b/com.twin.app.shoptime/src/views/HomePanel/BestSeller/BestSeller.jsx @@ -229,6 +229,7 @@ const BestSeller = ({ patncNm, catNm, foryou, + euEnrgLblInfos, }, itemIndex ) => { @@ -267,6 +268,7 @@ const BestSeller = ({ firstLabel={rankText} label={itemIndex * 1 + 1 + " of " + bestSellerNewData.length} lastLabel=" go to detail, button" + euEnrgLblInfos={euEnrgLblInfos} > {foryou === true && }