홈배너 API 추가

com.twin.app.shoptime/src/App/App.js

@@ -6,7 +6,7 @@ import ThemeDecorator from "@enact/sandstone/ThemeDecorator";
 
 import { getBrandList } from "../features/brand/brandsSlice";
 import { getAuthenticationCode } from "../features/device/deviceSlice";
-import { getHomeMenu } from "../features/home/homeSlice";
+import { getHomeMenu, getHomeLayout, getHomeMainContents } from "../features/home/homeSlice";
 import { getMyRecommandedKeyword } from "../features/mypage/myPageSlice";
 import { getOnSaleInfo } from "../features/onSale/onSaleSlice";
 import { getSubCategory } from "../features/main/mainSlice";
@@ -20,6 +20,8 @@ function AppBase(props) {
   useEffect(() => {
     dispatch(getAuthenticationCode());
     dispatch(getHomeMenu());
+    dispatch(getHomeLayout());
+    dispatch(getHomeMainContents());
     dispatch(getOnSaleInfo({ categoryIncFlag: "Y", lgCatCd: "" }));
     dispatch(getBrandList());
     dispatch(getMyRecommandedKeyword());

com.twin.app.shoptime/src/api/apiConfig.js

@@ -13,6 +13,8 @@ export const URLS = {
   //home controller
   GET_HOME_TERMS: "/lgsp/v1/home/terms.lge",
   GET_HOME_MENU: "/lgsp/v1/home/menu.lge",
+  GET_HOME_LAYOUT: "/lgsp/v1/home/homeLayout.lge",
+  GET_HOME_MAIN_CONTENTS: "/lgsp/v1/home/homeContentsInfo.lge",
 
   //brand-controller
   GET_BRAND_LIST: "/lgsp/v1/brand/info.lge",

com.twin.app.shoptime/src/components/Home/HomeBanner/HomeBannerTemplate1.jsx

@@ -0,0 +1,40 @@
+import React, {
+  useCallback,
+  useEffect,
+  useState,
+  useMemo,
+  useRef,
+} from "react";
+
+import classNames from "classnames";
+
+import { Job } from "@enact/core/util";
+import { SpotlightContainerDecorator } from "@enact/spotlight/SpotlightContainerDecorator";
+import { shallowEqual, useDispatch, useSelector } from "react-redux";
+import Spotlight from "@enact/spotlight";
+import Marquee from "@enact/sandstone/Marquee";
+import Spottable from "@enact/spotlight/Spottable";
+
+import CustomImage from "../../CustomImage/CustomImage";
+import ViedoPlayer from "@enact/sandstone/VideoPlayer";
+import css from "./Template.module.less";
+import { getAdDetailAMD, getHomeTerms } from "../../../api/homeApi";
+
+import banner2 from "../../../../assets/Image/img-home-banner-h-02.png";
+import banner3 from "../../../../assets/Image/img-home-banner-v-01.png";
+import banner4 from "../../../../assets/Image/img-home-banner-v-02.png";
+
+const SpottableComponent = Spottable("div");
+
+const Container = SpotlightContainerDecorator(
+  {
+    enterTo: "default-element",
+  },
+  "div"
+);
+
+export default function HomeBannerTemplate1 () {
+    return(
+      <p> 템플릿1</p>
+    )   
+}

com.twin.app.shoptime/src/components/Home/HomeBanner/HomeBannerTemplate2.jsx

@@ -0,0 +1,8 @@
+export default function HomeBannerTemplate2 () {
+
+    return(
+        <p>템플릿2</p>
+    )
+   
+
+}

com.twin.app.shoptime/src/components/Home/HomeBanner/HomeBannerTemplate3.jsx

@@ -0,0 +1,5 @@
+export default function HomeBannerTemplate3 () {
+    return(
+        <p>템플릿3</p>
+    )
+}

com.twin.app.shoptime/src/features/home/homeSlice.js

@@ -60,9 +60,67 @@ export const getHomeMenu = createAsyncThunk(
   }
 );
 
+// HOME LAYOUT 정보 조회 IF-LGSP-300
+export const getHomeLayout = createAsyncThunk(
+  "home/getHomeLayout",
+
+  async (_, thunkAPI) => {
+    const onSuccess = (response) => {
+      console.log("getHomeLayout onSuccess", response.data);
+
+      thunkAPI.dispatch(homeSlice.actions.updateLayoutData(response.data));
+    };
+
+    const onFail = (error) => {
+      console.error("getHomeLayout onFail", error);
+    };
+
+    TAxios(
+      thunkAPI.dispatch,
+      thunkAPI.getState,
+      "get",
+      URLS.GET_HOME_LAYOUT,
+      {},
+      {},
+      onSuccess,
+      onFail
+    );
+  }
+);
+
+// HOME Main Contents Banner 정보 조회 IF-LGSP-301
+export const getHomeMainContents = createAsyncThunk(
+  "home/getHomeMainContents",
+
+  async (_, thunkAPI) => {
+    const onSuccess = (response) => {
+      console.log("getHomeMainContents onSuccess", response.data);
+
+      thunkAPI.dispatch(homeSlice.actions.updateMainContentsData(response.data));
+    };
+
+    const onFail = (error) => {
+      console.error("getHomeMainContents onFail", error);
+    };
+
+    TAxios(
+      thunkAPI.dispatch,
+      thunkAPI.getState,
+      "get",
+      URLS.GET_HOME_MAIN_CONTENTS,
+      {},
+      {},
+      onSuccess,
+      onFail
+    );
+  }
+);
+
 const initialState = {
   termsData: {},
   menuData: {},
+  layoutData: {},
+  mainContentsData: {}
 };
 
 export const homeSlice = createSlice({
@@ -79,6 +137,6 @@ export const homeSlice = createSlice({
   },
 });
 
-export const { updateTermsData, updateMenuData } = homeSlice.actions;
+export const { updateTermsData, updateMenuData, updateLayoutData, updateMainContentsData } = homeSlice.actions;
 
 export default homeSlice.reducer;