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

GNB 데이터 가공 및 패널작업(미완성)

Browse Source
This commit is contained in:
고동영
2024-01-29 16:55:55 +09:00
parent ec10549915
commit 6262b09365
2 changed files with 75 additions and 84 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
com.twin.app.shoptime/src/components/TabLayout/TabItem.jsx
View File

@@ -77,6 +77,9 @@ const TabItemBase = ({
return null;
}
}, [focused, selected, expanded]);
delete rest.hasChildren;
delete rest.getChildren;
return (
<SpottableComponent
ref={itemRef}

148
com.twin.app.shoptime/src/components/TabLayout/TabLayout.jsx
View File

@@ -82,14 +82,18 @@ const deActivateTabJabFunc = (func) => {
};
let deActivateTabJob = new Job(deActivateTabJabFunc, 2000);
const clearPanelSwitching = (ref) => {
if (ref) {
ref.current = false;
}
};
let panelSwitchingJob = new Job(clearPanelSwitching, 500);
const COLLABSED_MAIN = 0;
const ACTIVATED_MAIN = 1;
const ACTIVATED_SUB = 2;
const EXTRA_AREA = 3;
const MAIN_TITLE = 0;
const SUB_TITLE = 1;
const PANELS_HAS_TAB = [
panel_names.CART_PANEL,
panel_names.CATEGORY_PANEL,
@@ -117,93 +121,48 @@ export default function TabLayout({ topPanelName, onTabActivated }) {
{
icons: CategoryIcon,
title: "",
children: [
{
title: "",
target: [{ name: panel_names.CATEGORY_PANEL }],
},
],
children: [],
},
{
icons: MyPageIcon,
title: "",
children: [
{
title: "",
target: [{ name: panel_names.MY_PAGE_PANEL }],
},
],
children: [],
},
{
icons: SearchIcon,
title: "",
children: [
{
title: "12323232",
target: [{ name: panel_names.SEARCH_PANEL }],
},
],
},
{
icons: HomeIcon,
title: "",
children: [
{
title: "43534543",
target: [{ name: panel_names.HOME_PANEL }],
},
],
},
{
icons: FeaturedBrandIcon,
title: "",
children: [
{
title: "dsadasd",
target: [{ name: panel_names.FEATURED_BRANDS_PANEL }],
},
],
children: [],
},
{
icons: OnSaleIcon,
title: "",
children: [
{
title: "",
target: [{ name: panel_names.ON_SALE_PANEL }],
},
],
},
{
icons: TrendingNowIcon,
title: "",
children: [
{
title: "",
target: [{ name: panel_names.TRENDING_NOW_PANEL }],
},
],
},
{
icons: HotPicksIcon,
title: "",
children: [
{
title: "",
target: [{ name: panel_names.HOT_PICKS_PANEL }],
},
],
},
{
icons: CartIcon,
title: "",
children: [
{
title: "",
target: [{ name: panel_names.CART_PANEL }],
},
],
},
//메뉴 추가 필요 20240112 chw
],
@@ -214,45 +173,73 @@ export default function TabLayout({ topPanelName, onTabActivated }) {
let result = [];
switch (type) {
case "gnb":
case "Category":
data?.homeCategory.map((item) => {
result.push(item.lgCatNm);
});
return result;
case "GNB":
data?.gnb.map((item) => {
result.push(item.menuNm);
});
console.log("#result", result);
return result;
case "homeCategory":
return "123123";
case "msgInfos":
case "Featured Brands":
data?.shortFeaturedBrands.map((item) => {
result.push(item.patncLogoPath);
});
return result;
case "mypage":
return result;
case "shortCategory":
return result;
case "shortFeaturedBrands":
case "My Page":
data?.mypage.map((item) => {
result.push(item.menuNm);
});
return result;
}
return null;
};
const dataDivide = () => {
const dataDivide = useCallback(() => {
let keys = ["Category", "Featured Brands", "My Page"];
if (data) {
// console.log("data", data);
// Object.keys(data).map((key) => {
// title = getMenuData(key);
// return title;
// });
let mainTitle = getMenuData("GNB");
const title = getMenuData("gnb");
// const subTitle = getMenuData(menu);
for (let i = 0; i < menuItems.length; i++) {
menuItems[i].title = title[i];
menuItems[i].children.title = title[i];
}
}
console.log("#menuItems", menuItems);
return menuItems;
mainTitle = mainTitle.sort((a, b) => {
const order = {
Category: 0,
"My Page": 1,
Search: 2,
Home: 3,
"Featured Brands": 4,
"On sale": 5,
"Trending Now": 6,
"Hot Picks": 7,
Cart: 8,
};
return order[a] - order[b];
});
for (let i = 0; i < mainTitle.length; i++) {
menuItems[i].title = mainTitle[i];
}
for (let j = 0; j < keys.length; j++) {
const currentKey = keys[j];
const subTitle = getMenuData(currentKey);
if (subTitle && subTitle.length > 0) {
for (let i = 0; i < mainTitle.length; i++) {
if (mainTitle[i] === currentKey) {
menuItems[i].children = subTitle.map((title) => ({
title,
}));
}
}
}
}
}
}, [data, menuItems]);
const makeTabmenu = useCallback(() => {
const t = [];
@@ -356,13 +343,13 @@ export default function TabLayout({ topPanelName, onTabActivated }) {
if (target) {
dispatch(resetPanels(target));
deActivateTab();
// panelSwitching.current = true;
// panelSwitchingJob.start(panelSwitching);
panelSwitching.current = true;
panelSwitchingJob.start(panelSwitching);
} else if (cursorVisible) {
setMainExpanded(true);
}
},
[deActivateTab, dispatch]
[cursorVisible, deActivateTab, dispatch]
);
const onClickSubItem = useCallback(
@@ -484,6 +471,7 @@ export default function TabLayout({ topPanelName, onTabActivated }) {
{tabActivated &&
tabs.map((item, index) => (
<TabItem
{...item}
key={"tabitemExpanded" + index}
onClick={handleNavigation}
deActivateTab={deActivateTab}