[TV앱테스트]Dropdown 메뉴에 현재 선택된 메뉴에 체크 표시 등이 없음

[CLM] https://harmony.lge.com:8443/issue/browse/SHOPTIME-2354
 
[DESC]
 - TDropdown에서 스타일변경.
 -  카테고리 / 체크아웃부분에서 각자 클래스 추가하여 다른 스타일 적용되도록변경.
This commit is contained in:
junghoon86.park
2024-05-28 10:36:08 +09:00
parent 87543c345e
commit 90cddf259d
8 changed files with 291 additions and 100 deletions

View File

@@ -1,36 +1,33 @@
import React, {
useCallback,
useEffect,
useState,
} from 'react';
import React, { useCallback, useEffect, useRef, useState } from "react";
import {
useDispatch,
useSelector,
} from 'react-redux';
import { useDispatch, useSelector } from "react-redux";
import { Job } from "@enact/core/util";
import Spotlight from "@enact/spotlight";
import {
getMyInfoCheckoutInfo,
getTaxInfos,
} from '../../actions/checkoutActions';
import { changeAppStatus } from '../../actions/commonActions';
import { getShoptimeTerms } from '../../actions/empActions';
import { popPanel } from '../../actions/panelActions';
import TBody from '../../components/TBody/TBody';
import TFullPopup from '../../components/TFullPopup/TFullPopup';
import THeader from '../../components/THeader/THeader';
import TPanel from '../../components/TPanel/TPanel';
import TScroller from '../../components/TScroller/TScroller';
import { $L } from '../../utils/helperMethods';
import css from './CheckOutPanel.module.less';
import CheckoutQRCode from './components/CheckoutQRCode';
import CheckOutTerms from './components/CheckOutTerms';
import PinCode from './components/PinCode';
import PinCodeInput from './components/PinCodeInput';
import FixedSideBar from './container/FixedSideBar';
import InformationContainer from './container/InformationContainer';
import OrderItemsSideBar from './container/OrderItemsSideBar';
import SummaryContainer from './container/SummaryCotainer';
} from "../../actions/checkoutActions";
import { changeAppStatus } from "../../actions/commonActions";
import { getShoptimeTerms } from "../../actions/empActions";
import { popPanel } from "../../actions/panelActions";
import TBody from "../../components/TBody/TBody";
import TFullPopup from "../../components/TFullPopup/TFullPopup";
import THeader from "../../components/THeader/THeader";
import TPanel from "../../components/TPanel/TPanel";
import TScroller from "../../components/TScroller/TScroller";
import useScrollTo from "../../hooks/useScrollTo";
import { $L } from "../../utils/helperMethods";
import css from "./CheckOutPanel.module.less";
import CheckoutQRCode from "./components/CheckoutQRCode";
import CheckOutTerms from "./components/CheckOutTerms";
import PinCode from "./components/PinCode";
import PinCodeInput from "./components/PinCodeInput";
import FixedSideBar from "./container/FixedSideBar";
import InformationContainer from "./container/InformationContainer";
import OrderItemsSideBar from "./container/OrderItemsSideBar";
import SummaryContainer from "./container/SummaryCotainer";
export default function CheckOutPanel() {
const dispatch = useDispatch();
@@ -55,6 +52,10 @@ export default function CheckOutPanel() {
const [offerSideBarOpen, setOfferSideBarOpen] = useState(false);
const [placeOrderPopup, setPlaceOrderPopup] = useState(false);
const { getScrollTo: getScrollToBody, scrollTop: scrollTopBody } =
useScrollTo();
const spotJob = useRef(new Job((func) => func(), 1000));
useEffect(() => {
dispatch(getShoptimeTerms());
@@ -96,6 +97,15 @@ export default function CheckOutPanel() {
);
}, [dispatch, infoForCheckoutData, productData]);
useEffect(() => {
spotJob.current.start(() => {
Spotlight.focus("spotlightId_backBtn");
});
return () => {
spotJob.current.stop();
};
}, []);
const onBackClick = useCallback(() => {
dispatch(popPanel());
}, [dispatch]);
@@ -114,7 +124,7 @@ export default function CheckOutPanel() {
isTabActivated={false}
spotlightDisabled={orderSideBarOpen || offerSideBarOpen}
>
<TBody className={css.tbody}>
<TBody className={css.tbody} cbScrollTo={getScrollToBody}>
<THeader
className={css.theader}
title="CHECKOUT"
@@ -126,6 +136,7 @@ export default function CheckOutPanel() {
<InformationContainer
toggleOrderSideBar={toggleOrderSideBar}
toggleOfferSideBar={toggleOfferSideBar}
scrollTopBody={scrollTopBody}
/>
</div>
{/* <CheckoutQRCode open={false} /> */}