[디테일 패널] 파트너사 이미지 노출 수정 / 마커 위치수정
- 현재 qvc로 고정되어있는 파트너사 이미지 변경. - productallsection 마커 위치 수정.
This commit is contained in:
@@ -1,21 +1,40 @@
|
|||||||
// src/views/DetailPanel/DetailPanel.new.jsx
|
// src/views/DetailPanel/DetailPanel.new.jsx
|
||||||
import React, { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react';
|
import React, {
|
||||||
|
useCallback,
|
||||||
|
useEffect,
|
||||||
|
useLayoutEffect,
|
||||||
|
useMemo,
|
||||||
|
useRef,
|
||||||
|
useState,
|
||||||
|
} from 'react';
|
||||||
|
|
||||||
import { useDispatch, useSelector } from 'react-redux';
|
import {
|
||||||
|
useDispatch,
|
||||||
|
useSelector,
|
||||||
|
} from 'react-redux';
|
||||||
|
|
||||||
import Spotlight from '@enact/spotlight';
|
import Spotlight from '@enact/spotlight';
|
||||||
import { setContainerLastFocusedElement } from '@enact/spotlight/src/container';
|
import { setContainerLastFocusedElement } from '@enact/spotlight/src/container';
|
||||||
|
|
||||||
import { getDeviceAdditionInfo } from '../../actions/deviceActions';
|
import { getDeviceAdditionInfo } from '../../actions/deviceActions';
|
||||||
import { getThemeCurationDetailInfo } from '../../actions/homeActions';
|
import { getThemeCurationDetailInfo } from '../../actions/homeActions';
|
||||||
import { getMainCategoryDetail, getMainYouMayLike } from '../../actions/mainActions';
|
import {
|
||||||
import { popPanel, updatePanel } from '../../actions/panelActions';
|
getMainCategoryDetail,
|
||||||
|
getMainYouMayLike,
|
||||||
|
} from '../../actions/mainActions';
|
||||||
|
import {
|
||||||
|
popPanel,
|
||||||
|
updatePanel,
|
||||||
|
} from '../../actions/panelActions';
|
||||||
import {
|
import {
|
||||||
finishVideoPreview,
|
finishVideoPreview,
|
||||||
pauseFullscreenVideo,
|
pauseFullscreenVideo,
|
||||||
resumeFullscreenVideo,
|
resumeFullscreenVideo,
|
||||||
} from '../../actions/playActions';
|
} from '../../actions/playActions';
|
||||||
import { clearProductDetail, getProductOptionId } from '../../actions/productActions';
|
import {
|
||||||
|
clearProductDetail,
|
||||||
|
getProductOptionId,
|
||||||
|
} from '../../actions/productActions';
|
||||||
import TBody from '../../components/TBody/TBody';
|
import TBody from '../../components/TBody/TBody';
|
||||||
import TPanel from '../../components/TPanel/TPanel';
|
import TPanel from '../../components/TPanel/TPanel';
|
||||||
import { panel_names } from '../../utils/Config';
|
import { panel_names } from '../../utils/Config';
|
||||||
@@ -667,6 +686,7 @@ export default function DetailPanel({ panelInfo, isOnTop, spotlightId }) {
|
|||||||
onSpotlightLeft={onSpotlightUpTButton}
|
onSpotlightLeft={onSpotlightUpTButton}
|
||||||
marqueeDisabled={false}
|
marqueeDisabled={false}
|
||||||
ariaLabel={ariaLabel}
|
ariaLabel={ariaLabel}
|
||||||
|
logoImg={productData?.patncLogoPath}
|
||||||
/>
|
/>
|
||||||
<TBody
|
<TBody
|
||||||
className={css.tbody}
|
className={css.tbody}
|
||||||
|
|||||||
@@ -854,11 +854,7 @@ export default function ProductAllSection({
|
|||||||
spotlightRestrict="none"
|
spotlightRestrict="none"
|
||||||
onScroll={handleScroll}
|
onScroll={handleScroll}
|
||||||
>
|
>
|
||||||
<div className={css.productDetail}>
|
<div className={css.productDetail}>
|
||||||
<div
|
|
||||||
id="scroll-marker-product-details"
|
|
||||||
className={css.scrollMarker}
|
|
||||||
></div>
|
|
||||||
{/* <LayoutSample onClick={handleLayoutSampleClick} /> */}
|
{/* <LayoutSample onClick={handleLayoutSampleClick} /> */}
|
||||||
<div
|
<div
|
||||||
id="product-details-section"
|
id="product-details-section"
|
||||||
@@ -915,6 +911,10 @@ export default function ProductAllSection({
|
|||||||
))
|
))
|
||||||
: !hasVideo && <ProductDetail productInfo={productData} />}
|
: !hasVideo && <ProductDetail productInfo={productData} />}
|
||||||
</div>
|
</div>
|
||||||
|
<div
|
||||||
|
id="scroll-marker-product-details"
|
||||||
|
className={css.scrollMarker}
|
||||||
|
></div>
|
||||||
<div
|
<div
|
||||||
id="product-description-section"
|
id="product-description-section"
|
||||||
ref={descriptionRef}
|
ref={descriptionRef}
|
||||||
|
|||||||
@@ -12,7 +12,6 @@ import Spottable from '@enact/spotlight/Spottable';
|
|||||||
|
|
||||||
import defaultLogoImg
|
import defaultLogoImg
|
||||||
from '../../../../assets/images/ic-tab-partners-default@3x.png';
|
from '../../../../assets/images/ic-tab-partners-default@3x.png';
|
||||||
import qvcLogoImg from '../../../../assets/images/icons/ic-partners-qvc@3x.png';
|
|
||||||
import { $L } from '../../../utils/helperMethods';
|
import { $L } from '../../../utils/helperMethods';
|
||||||
import css from './THeaderCustom.module.less';
|
import css from './THeaderCustom.module.less';
|
||||||
|
|
||||||
@@ -34,6 +33,7 @@ export default function THeaderCustom({
|
|||||||
ariaLabel,
|
ariaLabel,
|
||||||
children,
|
children,
|
||||||
kind,
|
kind,
|
||||||
|
logoImg,
|
||||||
...rest
|
...rest
|
||||||
}) {
|
}) {
|
||||||
const convertedTitle = useMemo(() => {
|
const convertedTitle = useMemo(() => {
|
||||||
@@ -84,7 +84,7 @@ export default function THeaderCustom({
|
|||||||
<div
|
<div
|
||||||
className={css.centerImage}
|
className={css.centerImage}
|
||||||
style={{
|
style={{
|
||||||
backgroundImage: `url("${qvcLogoImg}")`,
|
backgroundImage: `url("${logoImg}")`,
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
|
|||||||
Reference in New Issue
Block a user