GNB 데이터 가공 및 패널작업(미완성)
This commit is contained in:
@@ -77,6 +77,9 @@ const TabItemBase = ({
|
||||
return null;
|
||||
}
|
||||
}, [focused, selected, expanded]);
|
||||
|
||||
delete rest.hasChildren;
|
||||
delete rest.getChildren;
|
||||
return (
|
||||
<SpottableComponent
|
||||
ref={itemRef}
|
||||
|
||||
@@ -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,92 +121,47 @@ 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 }],
|
||||
},
|
||||
],
|
||||
target: [{ name: panel_names.SEARCH_PANEL }],
|
||||
},
|
||||
{
|
||||
icons: HomeIcon,
|
||||
title: "",
|
||||
children: [
|
||||
{
|
||||
title: "43534543",
|
||||
target: [{ name: panel_names.HOME_PANEL }],
|
||||
},
|
||||
],
|
||||
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 }],
|
||||
},
|
||||
],
|
||||
target: [{ name: panel_names.ON_SALE_PANEL }],
|
||||
},
|
||||
{
|
||||
icons: TrendingNowIcon,
|
||||
title: "",
|
||||
children: [
|
||||
{
|
||||
title: "",
|
||||
target: [{ name: panel_names.TRENDING_NOW_PANEL }],
|
||||
},
|
||||
],
|
||||
target: [{ name: panel_names.TRENDING_NOW_PANEL }],
|
||||
},
|
||||
{
|
||||
icons: HotPicksIcon,
|
||||
title: "",
|
||||
children: [
|
||||
{
|
||||
title: "",
|
||||
target: [{ name: panel_names.HOT_PICKS_PANEL }],
|
||||
},
|
||||
],
|
||||
target: [{ name: panel_names.HOT_PICKS_PANEL }],
|
||||
},
|
||||
{
|
||||
icons: CartIcon,
|
||||
title: "",
|
||||
children: [
|
||||
{
|
||||
title: "",
|
||||
target: [{ name: panel_names.CART_PANEL }],
|
||||
},
|
||||
],
|
||||
target: [{ name: panel_names.CART_PANEL }],
|
||||
},
|
||||
|
||||
//메뉴 추가 필요 20240112 chw
|
||||
@@ -214,44 +173,72 @@ 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);
|
||||
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,
|
||||
};
|
||||
|
||||
for (let i = 0; i < menuItems.length; i++) {
|
||||
menuItems[i].title = title[i];
|
||||
menuItems[i].children.title = title[i];
|
||||
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,
|
||||
}));
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
console.log("#menuItems", menuItems);
|
||||
return menuItems;
|
||||
};
|
||||
}, [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}
|
||||
|
||||
Reference in New Issue
Block a user