fix: 기획자의견 반영 2차수정
This commit is contained in:
@@ -37,38 +37,45 @@ export const getAuthenticationCode = () => (dispatch, getState) => {
|
||||
};
|
||||
|
||||
// IF-LGSP-001 디바이스 등록 및 약관 동의
|
||||
export const registerDevice = (params) => (dispatch, getState) => {
|
||||
const { agreeTerms } = params;
|
||||
export const registerDevice =
|
||||
(params, onSuccessCallback, onFailCallback) => (dispatch, getState) => {
|
||||
const { agreeTerms } = params;
|
||||
|
||||
const onSuccess = (response) => {
|
||||
console.log("registerDevice onSuccess: ", response.data);
|
||||
const onSuccess = (response) => {
|
||||
console.log("registerDevice onSuccess: ", response.data);
|
||||
|
||||
dispatch({
|
||||
type: types.REGISTER_DEVICE,
|
||||
payload: response.data.data,
|
||||
retCode: response.data.retCode,
|
||||
});
|
||||
dispatch(getAuthenticationCode());
|
||||
dispatch(fetchCurrentUserHomeTerms());
|
||||
dispatch({
|
||||
type: types.REGISTER_DEVICE,
|
||||
payload: response.data.data,
|
||||
retCode: response.data.retCode,
|
||||
});
|
||||
dispatch(getAuthenticationCode());
|
||||
dispatch(fetchCurrentUserHomeTerms());
|
||||
if (onSuccessCallback) {
|
||||
onSuccessCallback(response.data);
|
||||
}
|
||||
};
|
||||
|
||||
const onFail = (error) => {
|
||||
console.error("registerDevice onFail: ", error);
|
||||
if (onFailCallback) {
|
||||
onFailCallback(error);
|
||||
}
|
||||
};
|
||||
|
||||
TAxios(
|
||||
dispatch,
|
||||
getState,
|
||||
"post",
|
||||
URLS.REGISTER_DEVICE,
|
||||
{},
|
||||
{ agreeTerms },
|
||||
onSuccess,
|
||||
onFail,
|
||||
true
|
||||
);
|
||||
};
|
||||
|
||||
const onFail = (error) => {
|
||||
console.error("registerDevice onFail: ", error);
|
||||
};
|
||||
|
||||
TAxios(
|
||||
dispatch,
|
||||
getState,
|
||||
"post",
|
||||
URLS.REGISTER_DEVICE,
|
||||
{},
|
||||
{ agreeTerms },
|
||||
onSuccess,
|
||||
onFail,
|
||||
true
|
||||
);
|
||||
};
|
||||
|
||||
// 디바이스 부가 정보 저장 (IF-LGSP-002)
|
||||
export const registerDeviceInfo = (params) => (dispatch, getState) => {
|
||||
const { evntTpCd, evntId, evntApplcnFlag, entryMenu, mbphNo } = params;
|
||||
|
||||
@@ -3,33 +3,41 @@ import { TAxios } from "../api/TAxios";
|
||||
import { types } from "./actionTypes";
|
||||
|
||||
// 이벤트 정보 조회 IF-LGSP-070
|
||||
export const getWelcomeEventInfo = () => (dispatch, getState) => {
|
||||
const onSuccess = (response) => {
|
||||
console.log("getWelcomeEventInfo onSuccess ", response.data);
|
||||
export const getWelcomeEventInfo =
|
||||
(onSuccessCallback, onFailCallback) => (dispatch, getState) => {
|
||||
const onSuccess = (response) => {
|
||||
console.log("getWelcomeEventInfo onSuccess ", response.data);
|
||||
|
||||
dispatch({
|
||||
type: types.GET_WELCOME_EVENT_INFO,
|
||||
payload: response.data.data,
|
||||
retCode: response.data.retCode,
|
||||
});
|
||||
dispatch({
|
||||
type: types.GET_WELCOME_EVENT_INFO,
|
||||
payload: response.data.data,
|
||||
retCode: response.data.retCode,
|
||||
});
|
||||
|
||||
if (onSuccessCallback) {
|
||||
onSuccessCallback(response.data);
|
||||
}
|
||||
};
|
||||
|
||||
const onFail = (error) => {
|
||||
console.error("getWelcomeEventInfo onFail ", error);
|
||||
if (onFailCallback) {
|
||||
onFailCallback(error);
|
||||
}
|
||||
};
|
||||
|
||||
TAxios(
|
||||
dispatch,
|
||||
getState,
|
||||
"get",
|
||||
URLS.GET_WELCOME_EVENT_INFO,
|
||||
{},
|
||||
{},
|
||||
onSuccess,
|
||||
onFail
|
||||
);
|
||||
};
|
||||
|
||||
const onFail = (error) => {
|
||||
console.error("getWelcomeEventInfo onFail ", error);
|
||||
};
|
||||
|
||||
TAxios(
|
||||
dispatch,
|
||||
getState,
|
||||
"get",
|
||||
URLS.GET_WELCOME_EVENT_INFO,
|
||||
{},
|
||||
{},
|
||||
onSuccess,
|
||||
onFail
|
||||
);
|
||||
};
|
||||
|
||||
// 이벤트(쿠폰) 지급 요청 (IF-LGSP-071)
|
||||
export const setEventIssueReq = (params) => (dispatch, getState) => {
|
||||
const { evntTpCd, evntId, mbphNo, cntryCd } = params;
|
||||
|
||||
@@ -183,7 +183,7 @@
|
||||
|
||||
&.optionItem {
|
||||
display: flex;
|
||||
color: red;
|
||||
color: @PRIMARY_COLOR_RED;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -358,10 +358,10 @@
|
||||
.textLayer {
|
||||
width: 100%;
|
||||
padding-bottom: 35px;
|
||||
border-bottom: 1px solid #dadada;
|
||||
border-bottom: 1px solid @COLOR_GRAY02;
|
||||
.text {
|
||||
min-height: 126px;
|
||||
color: #1a1a1a;
|
||||
color: @COLOR_GRAY08;
|
||||
font-size: 36px;
|
||||
line-height: 42px;
|
||||
text-align: left;
|
||||
@@ -384,10 +384,10 @@
|
||||
height: 300px;
|
||||
}
|
||||
&::-webkit-scrollbar-track-piece {
|
||||
background-color: #fff;
|
||||
background-color: @COLOR_WHITE;
|
||||
}
|
||||
&::-webkit-scrollbar-thumb {
|
||||
background-color: #7a808d;
|
||||
background-color: @COLOR_GRAY04;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -403,7 +403,7 @@
|
||||
background: @COLOR_GRAY09;
|
||||
font-size: 30px;
|
||||
&:focus {
|
||||
box-shadow: 0px 18px 28.2px 1.8px rgba(62, 59, 59, 0.4);
|
||||
outline: 4px solid @PRIMARY_COLOR_RED;
|
||||
background-color: @PRIMARY_COLOR_RED;
|
||||
color: @COLOR_WHITE;
|
||||
}
|
||||
@@ -428,7 +428,7 @@
|
||||
background: @COLOR_GRAY09;
|
||||
font-size: 30px;
|
||||
&:focus {
|
||||
box-shadow: 0px 18px 28.2px 1.8px rgba(62, 59, 59, 0.4);
|
||||
outline: 4px solid @PRIMARY_COLOR_RED;
|
||||
background-color: @PRIMARY_COLOR_RED;
|
||||
color: @COLOR_WHITE;
|
||||
}
|
||||
@@ -471,7 +471,7 @@
|
||||
align-items: center;
|
||||
margin-right: 60px;
|
||||
.title {
|
||||
color: #333;
|
||||
color: @COLOR_GRAY06;
|
||||
font-size: 36px;
|
||||
font-weight: bold;
|
||||
margin-bottom: 12px;
|
||||
@@ -490,7 +490,7 @@
|
||||
}
|
||||
|
||||
.text {
|
||||
color: #1a1a1a;
|
||||
color: @COLOR_GRAY08;
|
||||
font-size: 24px;
|
||||
text-align: left;
|
||||
font-weight: normal;
|
||||
@@ -513,7 +513,7 @@
|
||||
font-size: 24px;
|
||||
line-height: 60px;
|
||||
&:focus {
|
||||
box-shadow: 0px 18px 28.2px 1.8px rgba(62, 59, 59, 0.4);
|
||||
outline: 4px solid @PRIMARY_COLOR_RED;
|
||||
background-color: @PRIMARY_COLOR_RED;
|
||||
color: @COLOR_WHITE;
|
||||
}
|
||||
|
||||
@@ -244,8 +244,7 @@ export default function IntroPanel({
|
||||
}, [dispatch]);
|
||||
|
||||
const handleAgree = useCallback(() => {
|
||||
|
||||
if(isProcessing) return;
|
||||
if (isProcessing) return;
|
||||
|
||||
// 필수 약관이 체크되어 있는지 확인
|
||||
if (!termsChecked || !privacyChecked) {
|
||||
@@ -278,24 +277,89 @@ export default function IntroPanel({
|
||||
|
||||
console.log('최종 전송될 agreeTerms:', agreeTerms);
|
||||
|
||||
// registerDevice 호출 - 필수 + 선택 약관 모두 포함
|
||||
dispatch(registerDevice({
|
||||
agreeTerms: agreeTerms
|
||||
}));
|
||||
// dispatch(fetchCurrentUserHomeTerms()); // 중복호출 방지
|
||||
setIsProcessing(false);
|
||||
}, [termsChecked, privacyChecked, optionalChecked, dispatch]);
|
||||
dispatch(
|
||||
registerDevice(
|
||||
{ agreeTerms: agreeTerms },
|
||||
(regDeviceData) => {
|
||||
if (regDeviceData && regDeviceData.retCode === 0) {
|
||||
dispatch(
|
||||
getWelcomeEventInfo((eventInfos) => {
|
||||
if (
|
||||
eventInfos &&
|
||||
Object.keys(eventInfos.data).length > 0 &&
|
||||
webOSVersion
|
||||
) {
|
||||
let displayWelcomeEventPanel = false;
|
||||
|
||||
if (
|
||||
eventInfos.data?.welcomeEventFlag === "Y" ||
|
||||
(eventInfos.data?.welcomeBillCpnEventFlag === "Y" &&
|
||||
Number(webOSVersion) >= 6)
|
||||
) {
|
||||
displayWelcomeEventPanel = true;
|
||||
}
|
||||
|
||||
dispatch(
|
||||
sendLogTerms({ logTpNo: Config.LOG_TP_NO.TERMS.AGREE })
|
||||
);
|
||||
|
||||
if (displayWelcomeEventPanel) {
|
||||
dispatch(
|
||||
pushPanel({
|
||||
name: panel_names.WELCOME_EVENT_PANEL,
|
||||
panelInfo: { eventInfos: eventInfos.data },
|
||||
})
|
||||
);
|
||||
}
|
||||
}
|
||||
dispatch(popPanel(panel_names.INTRO_PANEL));
|
||||
setIsProcessing(false);
|
||||
})
|
||||
);
|
||||
} else {
|
||||
dispatch(
|
||||
setShowPopup(Config.ACTIVE_POPUP.alertPopup, {
|
||||
title: $L("Error"),
|
||||
text: $L("Device registration failed. Please try again."),
|
||||
button1Text: $L("OK"),
|
||||
})
|
||||
);
|
||||
setIsProcessing(false);
|
||||
}
|
||||
},
|
||||
() => {
|
||||
dispatch(
|
||||
setShowPopup(Config.ACTIVE_POPUP.alertPopup, {
|
||||
title: $L("Error"),
|
||||
text: $L("Device registration failed. Please try again."),
|
||||
button1Text: $L("OK"),
|
||||
})
|
||||
);
|
||||
setIsProcessing(false);
|
||||
}
|
||||
)
|
||||
);
|
||||
}, [
|
||||
termsChecked,
|
||||
privacyChecked,
|
||||
optionalChecked,
|
||||
dispatch,
|
||||
isProcessing,
|
||||
webOSVersion,
|
||||
]);
|
||||
|
||||
// 실패 감지를 위한 useEffect 추가
|
||||
useEffect(() => {
|
||||
// isProcessing이 true일 때만 실패 체크 (= handleAgree 클릭 후에만)
|
||||
if (isProcessing && regDeviceData && regDeviceData.retCode !== 0) {
|
||||
console.error('registerDevice 실패:', regDeviceData);
|
||||
dispatch(setShowPopup(Config.ACTIVE_POPUP.alertPopup, {
|
||||
title: $L("Error"),
|
||||
text: $L("Device registration failed. Please try again."),
|
||||
button1Text: $L("OK")
|
||||
}));
|
||||
console.error("registerDevice 실패:", regDeviceData);
|
||||
dispatch(
|
||||
setShowPopup(Config.ACTIVE_POPUP.alertPopup, {
|
||||
title: $L("Error"),
|
||||
text: $L("Device registration failed. Please try again."),
|
||||
button1Text: $L("OK"),
|
||||
})
|
||||
);
|
||||
setIsProcessing(false);
|
||||
}
|
||||
}, [regDeviceData, dispatch, isProcessing]); // isProcessing 의존성 추가
|
||||
@@ -384,7 +448,6 @@ export default function IntroPanel({
|
||||
<div className={css.requiredInfoPanel}>
|
||||
<p className={css.infoText}>{$L("Required Consent")}</p>
|
||||
<p className={css.infoText}>{$L("(Necessary for using the service)")}</p>
|
||||
<p className={css.successText}>{$L("Thank you for agreeing to required terms!")}</p>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -412,12 +475,6 @@ export default function IntroPanel({
|
||||
Spotlight.focus();
|
||||
}, [popupVisible]);
|
||||
|
||||
useEffect(() => {
|
||||
if (regDeviceData && regDeviceData.retCode === 0) {
|
||||
dispatch(getWelcomeEventInfo());
|
||||
}
|
||||
}, [dispatch, regDeviceData]);
|
||||
|
||||
useEffect(() => {
|
||||
if (regDeviceInfoData && regDeviceInfoData.retCode === 0) {
|
||||
dispatch(setHidePopup());
|
||||
@@ -425,32 +482,6 @@ export default function IntroPanel({
|
||||
}
|
||||
}, [dispatch, regDeviceInfoData]);
|
||||
|
||||
useEffect(() => {
|
||||
if (eventInfos && Object.keys(eventInfos).length > 0 && webOSVersion) {
|
||||
let displayWelcomeEventPanel = false;
|
||||
|
||||
if (
|
||||
eventInfos?.welcomeEventFlag === "Y" ||
|
||||
(eventInfos?.welcomeBillCpnEventFlag === "Y" &&
|
||||
Number(webOSVersion) >= 6)
|
||||
) {
|
||||
displayWelcomeEventPanel = true;
|
||||
}
|
||||
setIsProcessing(false);
|
||||
dispatch(popPanel(panel_names.INTRO_PANEL));
|
||||
dispatch(sendLogTerms({ logTpNo: Config.LOG_TP_NO.TERMS.AGREE }));
|
||||
|
||||
if (displayWelcomeEventPanel) {
|
||||
dispatch(
|
||||
pushPanel({
|
||||
name: panel_names.WELCOME_EVENT_PANEL,
|
||||
panelInfo: { eventInfos: eventInfos },
|
||||
})
|
||||
);
|
||||
}
|
||||
}
|
||||
}, [eventInfos, webOSVersion]);
|
||||
|
||||
const description = $L(
|
||||
"Check out more LIVE SHOWS now and enjoy shopping at Shop Time's special price on your TV by agreeing to the LG TV Shopping Terms and Conditions."
|
||||
);
|
||||
|
||||
@@ -183,30 +183,10 @@
|
||||
padding-left: 60px;
|
||||
padding-right: 60px;
|
||||
border-left: 1px #C5C6C9 solid;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
justify-content: center;
|
||||
align-items: flex-start;
|
||||
display: flex;
|
||||
|
||||
.optionalDescription {
|
||||
width: 595px;
|
||||
color: #807F81;
|
||||
font-size: 26px;
|
||||
font-family: 'LG Smart UI';
|
||||
font-weight: 400;
|
||||
line-height: 43px;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
// OptionalTermsInfo 컴포넌트 스타일
|
||||
.termsInfo {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -240,73 +220,25 @@
|
||||
gap: 40px;
|
||||
justify-content: center;
|
||||
|
||||
.agreeButton {
|
||||
width: 450px;
|
||||
height: 100px;
|
||||
// background-color: #C70850 !important;
|
||||
// border: 2px solid #C70850 !important;
|
||||
color: white !important;
|
||||
border-radius: 12px;
|
||||
font-size: 35px;
|
||||
font-family: 'LG Smart UI';
|
||||
font-weight: 700;
|
||||
line-height: 2rem;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s ease;
|
||||
|
||||
// 포커스 상태
|
||||
&.focused:not(:disabled) {
|
||||
background-color: #a40640 !important;
|
||||
border-color: #a40640 !important;
|
||||
color: white !important;
|
||||
transform: scale(1.05);
|
||||
}
|
||||
|
||||
// 호버 효과
|
||||
&:hover:not(:disabled) {
|
||||
background-color: #a40640 !important;
|
||||
border-color: #a40640 !important;
|
||||
color: white !important;
|
||||
transform: scale(1.05);
|
||||
}
|
||||
|
||||
// 비활성화 상태
|
||||
&:disabled {
|
||||
background-color: @COLOR_GRAY03 !important;
|
||||
border-color: @COLOR_GRAY03 !important;
|
||||
cursor: not-allowed;
|
||||
transform: none;
|
||||
}
|
||||
}
|
||||
|
||||
.agreeButton,
|
||||
.disagreeButton {
|
||||
width: 450px;
|
||||
height: 100px;
|
||||
// background-color: #999999 !important;
|
||||
// border: 2px solid #999999 !important;
|
||||
color: white !important;
|
||||
border-radius: 12px;
|
||||
font-size: 35px;
|
||||
font-family: 'LG Smart UI';
|
||||
font-weight: 700;
|
||||
line-height: 2rem;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s ease;
|
||||
margin: 0 20px;
|
||||
font-size: 30px;
|
||||
border-radius: 10px;
|
||||
box-sizing: border-box;
|
||||
line-height: normal;
|
||||
background-color: #999999;
|
||||
color: @COLOR_WHITE;
|
||||
box-shadow: 0 5px 5px #003 0 6px 7px #0000001a;
|
||||
.flex();
|
||||
|
||||
// 포커스 상태
|
||||
&.focused {
|
||||
background-color: #7a7a7a !important;
|
||||
border-color: #7a7a7a !important;
|
||||
color: white !important;
|
||||
transform: scale(1.05);
|
||||
}
|
||||
|
||||
// 호버 효과
|
||||
&:focus,
|
||||
&:hover {
|
||||
background-color: #7a7a7a !important;
|
||||
border-color: #7a7a7a !important;
|
||||
color: white !important;
|
||||
transform: scale(1.05);
|
||||
background-color: @PRIMARY_COLOR_RED;
|
||||
color: @COLOR_WHITE;
|
||||
box-shadow: 0px 18px 28.2px 1.8px rgba(0, 0, 0, 0.4);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -403,11 +335,6 @@
|
||||
// ✅ [추가] 필수 약관 안내 패널 스타일
|
||||
.requiredInfoPanel {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: flex-start; // 왼쪽 정렬
|
||||
}
|
||||
|
||||
.infoText {
|
||||
@@ -425,4 +352,14 @@
|
||||
font-size: 28px;
|
||||
line-height: 1.4;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.optionalDescription {
|
||||
width: 595px;
|
||||
color: #807F81;
|
||||
font-size: 26px;
|
||||
font-family: 'LG Smart UI';
|
||||
font-weight: 400;
|
||||
line-height: 43px;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
@@ -208,6 +208,9 @@ export default function TermsOfService({ title, cbScrollTo }) {
|
||||
({ selected }) => {
|
||||
if (optionalTermsAgree) return;
|
||||
setIsOptionalChecked(selected);
|
||||
if (selected) {
|
||||
Spotlight.focus("optional-agree-button");
|
||||
}
|
||||
},
|
||||
[optionalTermsAgree]
|
||||
);
|
||||
@@ -375,8 +378,9 @@ export default function TermsOfService({ title, cbScrollTo }) {
|
||||
<TButton
|
||||
onClick={handleOptionalDisagree}
|
||||
className={css.disagreeButton}
|
||||
spotlightDisabled={spotlightDisabled}
|
||||
spotlightDisabled={spotlightDisabled || !optionalTermsAgree}
|
||||
spotlightId="optional-disagree-button"
|
||||
disabled={!optionalTermsAgree}
|
||||
>
|
||||
{$L("Do Not Agree")}
|
||||
</TButton>
|
||||
|
||||
@@ -101,39 +101,23 @@
|
||||
color: #888888;
|
||||
}
|
||||
|
||||
.agreeButton {
|
||||
.agreeButton,
|
||||
.disagreeButton {
|
||||
width: 240px;
|
||||
height: 80px;
|
||||
background: #777d8a;
|
||||
box-shadow: 0px 0px 50px rgba(0, 0, 0, 0.5);
|
||||
background: #999999;
|
||||
border-radius: 12px;
|
||||
color: white;
|
||||
font-size: 30px;
|
||||
font-weight: 700;
|
||||
box-shadow: 0 5px 5px #003 0 6px 7px #0000001a;
|
||||
.flex();
|
||||
|
||||
&:not([disabled]) {
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background: #a60641;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.disagreeButton {
|
||||
width: 240px;
|
||||
height: 80px;
|
||||
background: #777d8a;
|
||||
border-radius: 12px;
|
||||
color: #e6e6e6;
|
||||
font-size: 30px;
|
||||
font-weight: 700;
|
||||
|
||||
&:not([disabled]) {
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background: #626771;
|
||||
&:focus,
|
||||
&:hover {
|
||||
&:not([disabled]) {
|
||||
background: @PRIMARY_COLOR_RED;
|
||||
box-shadow: 0px 18px 28.2px 1.8px rgba(0, 0, 0, 0.4);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user