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

[SHOPTIME-2278] SHOWS, ITEM 위치 순서 변경. ITEM 탭이 먼저 나오도록수정

Browse Source
This commit is contained in:
yonghyon
2024-10-10 16:02:06 +09:00
parent 9b12e9bfec
commit 23f4464954
1 changed files with 20 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
com.twin.app.shoptime/src/views/CategoryPanel/CategoryPanel.jsx
View File

@@ -52,8 +52,10 @@ const TabContainer = SpotlightContainerDecorator(
"div"
);
const INDEX_ITEM = 0;
const INDEX_SHOWS = 1;
const getButtonTabList = () => {
return [$L("SHOWS"), $L("ITEM")];
return [$L("ITEM"), $L("SHOWS")];
};
let buttonTabList = null;
@@ -82,7 +84,7 @@ const CategoryPanel = ({ panelInfo, isOnTop, spotlightId }) => {
partnerInfos,
} = categoryDatas || {};
const [tab, setTab] = useState(panelInfo.tab ? panelInfo.tab : 0);
const [tab, setTab] = useState(panelInfo.tab ? panelInfo.tab : INDEX_ITEM);
const tabRef = usePrevious(tab);
const categoryDatasRef = usePrevious(categoryDatas);
const [dropDownTab, setDropDownTab] = useState(
@@ -115,7 +117,7 @@ const CategoryPanel = ({ panelInfo, isOnTop, spotlightId }) => {
useEffect(() => {
let nowMenu;
if (tab === 0) {
if (tab === INDEX_SHOWS) {
if (categoryShowInfos) {
nowMenu =
categoryShowInfos?.subCatShowList.length === 0
@@ -124,7 +126,7 @@ const CategoryPanel = ({ panelInfo, isOnTop, spotlightId }) => {
}
}
if (tab === 1) {
if (tab === INDEX_ITEM) {
if (categoryItemInfos) {
nowMenu =
categoryItemInfos?.subCatItemList.length === 0
@@ -140,7 +142,7 @@ const CategoryPanel = ({ panelInfo, isOnTop, spotlightId }) => {
useEffect(() => {
if (isSendedLogGNBExcuted) {
const cnttTpNm = tab === 0 ? "Show" : "Item";
const cnttTpNm = tab === INDEX_SHOWS ? "Show" : "Item";
const sortTpNm = dropDownTab === 0 ? "New" : "Popular";
logTimerRef.current = setTimeout(() => {
@@ -170,7 +172,7 @@ const CategoryPanel = ({ panelInfo, isOnTop, spotlightId }) => {
]);
const reload = useCallback(() => {
const tabType = tabRef.current === 0 ? "CAT00101" : "CAT00102";
const tabType = tabRef.current === INDEX_SHOWS ? "CAT00101" : "CAT00102";
const filterType = dropDownTabRef.current === 0 ? "CAT00202" : "CAT00201";
const pageSize = "20";
if (
@@ -207,7 +209,7 @@ const CategoryPanel = ({ panelInfo, isOnTop, spotlightId }) => {
setContainerLastFocusedElement(null, [
SpotlightIds.CATEGORY_CONTENTS_BOX,
]);
setTab(panelInfo.tab ? panelInfo.tab : 0);
setTab(panelInfo.tab ? panelInfo.tab : INDEX_ITEM);
Spotlight.focus("tab-" + panelInfo.tab);
} else if (panelInfo.currentSpot) {
Spotlight.focus(panelInfo.currentSpot);
@@ -315,15 +317,10 @@ const CategoryPanel = ({ panelInfo, isOnTop, spotlightId }) => {
//onScroll* event can't use Callback
const onScrollStop = useCallback((ev) => {
const targetContentsBoxId =
tabRef.current === 0
? SpotlightIds.SHOW_CONTENTS_BOX
: SpotlightIds.CATEGORY_CONTENTS_BOX;
const targetKey =
tabRef.current === 0 ? "categoryShowInfos" : "categoryItemInfos";
tabRef.current === INDEX_SHOWS ? SpotlightIds.SHOW_CONTENTS_BOX : SpotlightIds.CATEGORY_CONTENTS_BOX;
const targetKey = tabRef.current === INDEX_SHOWS ? "categoryShowInfos" : "categoryItemInfos";
const targetData = categoryDatasRef.current[targetKey];
const subKey = targetData?.subCatItemList
? "subCatItemList"
: "subCatShowList";
const subKey = targetData?.subCatItemList ? "subCatItemList" : "subCatShowList";
const spottableDescendants = getSpottableDescendants(targetContentsBoxId);
const visibleIndexes = [];
@@ -352,10 +349,8 @@ const CategoryPanel = ({ panelInfo, isOnTop, spotlightId }) => {
}, []);
const showGotoTopButton = useMemo(() => {
const targetData = tab === 0 ? categoryShowInfos : categoryItemInfos;
const subKey = targetData?.subCatItemList
? "subCatItemList"
: "subCatShowList";
const targetData = tab === INDEX_SHOWS ? categoryShowInfos : categoryItemInfos;
const subKey = targetData?.subCatItemList ? "subCatItemList" : "subCatShowList";
if (!targetData || !targetData[subKey] || targetData.total < 5) {
return false;
@@ -366,14 +361,10 @@ const CategoryPanel = ({ panelInfo, isOnTop, spotlightId }) => {
}, [tab, categoryShowInfos, categoryItemInfos]);
const itemCountNumbers = useMemo(() => {
if (categoryItemInfos && tab === 1) {
return categoryItemInfos.subCatItemList.length > 0
? categoryItemInfos.total
: "0";
} else if (categoryShowInfos && tab === 0) {
return categoryShowInfos.subCatShowList.length > 0
? categoryShowInfos.total
: "0";
if (categoryItemInfos && tab === INDEX_ITEM) {
return categoryItemInfos.subCatItemList.length > 0 ? categoryItemInfos.total : "0";
} else if (categoryShowInfos && tab === INDEX_SHOWS) {
return categoryShowInfos.subCatShowList.length > 0 ? categoryShowInfos.total : "0";
} else {
return;
}
@@ -447,8 +438,8 @@ const CategoryPanel = ({ panelInfo, isOnTop, spotlightId }) => {
</TDropDown>
</TabContainer>
)}
{tab === 0 && <ShowContents onClick={handleItemClick} />}
{tab === 1 && <ItemContents onClick={handleItemClick} />}
{tab === INDEX_ITEM && <ItemContents onClick={handleItemClick} />}
{tab === INDEX_SHOWS && <ShowContents onClick={handleItemClick} />}
</Container>
{showGotoTopButton && (
<TButton