에러코드 및 에러메세지 정의 / 에러 코드별 팝업 일괄 적용 (MainView)

This commit is contained in:
hyunwoo93.cha
2024-11-07 11:17:47 +09:00
parent 7a2e249a16
commit 3c22e318ec
10 changed files with 140 additions and 94 deletions

View File

@@ -358,7 +358,8 @@ function AppBase(props) {
}, [dispatch]);
return (
<ErrorBoundary>
// <ErrorBoundary>
<>
{webOSVersion === "" ? null : Number(webOSVersion) < 4 ? (
<NotSupportedVersion />
) : (
@@ -371,7 +372,8 @@ function AppBase(props) {
}
/>
)}
</ErrorBoundary>
</>
// </ErrorBoundary>
);
}

View File

@@ -31,6 +31,8 @@ export const types = {
SET_SYSTEM_TERMINATION: "SET_SYSTEM_TERMINATION",
SET_DEEP_LINK: "SET_DEEP_LINK",
SET_SECOND_LAYER_INFO: "SET_SECOND_LAYER_INFO",
SET_ERROR_MESSAGE: "SET_ERROR_MESSAGE",
CLEAR_ERROR_MESSAGE: "CLEAR_ERROR_MESSAGE",
// billing actions
GET_MY_INFO_BILLING_SEARCH: "GET_MY_INFO_BILLING_SEARCH",
@@ -164,7 +166,6 @@ export const types = {
UPDATE_SELECTED_BILLING_ADDR: "UPDATE_SELECTED_BILLING_ADDR",
UPDATE_SELECTED_COUPON: "UPDATE_SELECTED_COUPON",
GET_CHECKOUT_TOTAL_AMT: "GET_CHECKOUT_TOTAL_AMT",
GET_CHECKOUT_TOTAL_AMT_ERROR: "GET_CHECKOUT_TOTAL_AMT_ERROR",
CHECKOUT_DATA_RESET: "CHECKOUT_DATA_RESET",
// order actions

View File

@@ -1,7 +1,7 @@
import { URLS } from "../api/apiConfig";
import { TAxios } from "../api/TAxios";
import { types } from "./actionTypes";
import { changeAppStatus } from "./commonActions";
import { changeAppStatus, showError } from "./commonActions";
// 회원 주문 취소/반품/교환 사유 조회 (IF-LGSP-347)
export const getMyinfoOrderCancelColumnsSearch =
@@ -14,12 +14,16 @@ export const getMyinfoOrderCancelColumnsSearch =
response.data
);
if (response.data.retCode === 0) {
dispatch({
type: types.GET_MY_INFO_ORDER_CANCEL_COLUMNS_SEARCH,
payload: response.data.data,
});
if (callback) callback();
} else {
dispatch(showError(response.data.retCode, response.data.retMsg));
}
};
const onFail = (error) => {
@@ -82,10 +86,14 @@ export const updateOrderPartialCancel = (params) => (dispatch, getState) => {
const onSuccess = (response) => {
console.log("updateOrderPartialCancel onSuccess ", response.data);
if (response.data.retCode === 0) {
dispatch({
type: types.UPDATE_ORDER_PARTIAL_CANCEL,
payload: response.data.data,
});
} else {
dispatch(showError(response.data.retCode, response.data.retMsg));
}
};
const onFail = (error) => {
@@ -116,14 +124,18 @@ export const paymentTotalCancel =
const onSuccess = (response) => {
console.log("paymentTotalCancel onSuccess ", response.data);
if (response.data.retCode === 0) {
dispatch({
type: types.PAYMENT_TOTAL_CANCEL,
payload: response.data.data,
});
dispatch(changeAppStatus({ showLoadingPanel: { show: false } }));
if (callback) callback(response.data);
} else {
dispatch(showError(response.data.retCode, response.data.retMsg));
}
dispatch(changeAppStatus({ showLoadingPanel: { show: false } }));
};
const onFail = (error) => {

View File

@@ -1,7 +1,7 @@
import { URLS } from "../api/apiConfig";
import { TAxios } from "../api/TAxios";
import { types } from "./actionTypes";
import { changeAppStatus } from "./commonActions";
import { changeAppStatus, showError } from "./commonActions";
// 회원 체크아웃 정보 조회 IF-LGSP-345
export const getMyInfoCheckoutInfo =
@@ -48,14 +48,18 @@ export const insertMyInfoCheckoutOrder =
const onSuccess = (response) => {
console.log("insertMyInfoCheckoutOrder onSuccess: ", response.data);
if (response.data.retCode === 0) {
dispatch({
type: types.INSERT_MY_INFO_CHECKOUT_ORDER,
payload: response.data.data,
});
dispatch(changeAppStatus({ showLoadingPanel: { show: false } }));
if (callback) callback(response);
} else {
dispatch(showError(response.data.retCode, response.data.retMsg, true));
}
dispatch(changeAppStatus({ showLoadingPanel: { show: false } }));
};
const onFail = (error) => {
@@ -100,13 +104,7 @@ export const getCheckoutTotalAmt =
if (callback) callback(response.data);
} else {
dispatch({
type: types.GET_CHECKOUT_TOTAL_AMT_ERROR,
payload: {
retCode: response.data.retCode,
retMsg: response.data.retMsg,
},
});
dispatch(showError(response.data.retCode, response.data.retMsg, true));
}
dispatch(changeAppStatus({ showLoadingPanel: { show: false } }));

View File

@@ -4,6 +4,7 @@ import appinfo from "../../webos-meta/appinfo.json";
import appinfo35 from "../../webos-meta/appinfo35.json";
import appinfo79 from "../../webos-meta/appinfo79.json";
import * as lunaSend from "../lunaSend";
import * as Config from "../utils/Config";
import { types } from "./actionTypes";
export const changeAppStatus = (status) => ({
@@ -87,7 +88,8 @@ export const getSystemSettings = () => (dispatch, getState) => {
dispatch(
changeAppStatus({
captionEnable:
res.settings.captionEnable === "on" || res.settings.captionEnable === true,
res.settings.captionEnable === "on" ||
res.settings.captionEnable === true,
})
);
}
@@ -468,6 +470,33 @@ export const setGNBMenu = (menu) => ({
payload: menu,
});
export const setErrorMessage = (errorCode, errorMsg) => ({
type: types.SET_ERROR_MESSAGE,
payload: {
errorCode,
errorMsg,
},
});
export const clearErrorMessage = () => ({
type: types.CLEAR_ERROR_MESSAGE,
});
export const showError =
(errorCode, errorMsg, shouldPopPanel = false) =>
(dispatch) => {
dispatch(setErrorMessage(errorCode, errorMsg));
dispatch(
setShowPopup(Config.ACTIVE_POPUP.errorPopup, {
data: {
errorCode,
errorMsg,
shouldPopPanel,
},
})
);
};
//luna-send -f -n 1 luna://com.webos.service.db/delKind '{"id": "com.lgshop.app:5"}' -a "com.lgshop.app"
export const deleteOldDb8Datas = () => (dispatch) => {
for (let i = 1; i < 10; i++) {

View File

@@ -8,7 +8,6 @@ const initialState = {
checkoutTotalData: {},
selectedCoupons: {},
checkoutOrderData: {},
checkoutTotalError: null,
};
export const checkoutReducer = (state = initialState, action) => {
@@ -29,17 +28,6 @@ export const checkoutReducer = (state = initialState, action) => {
return {
...state,
checkoutTotalData: action.payload,
checkoutTotalError: null,
};
case types.GET_CHECKOUT_TOTAL_AMT_ERROR:
return {
...state,
checkoutTotalData: {},
checkoutTotalError: {
retCode: action.payload.retCode,
retMsg: action.payload.retMsg,
},
};
case types.INSERT_MY_INFO_CHECKOUT_ORDER:

View File

@@ -383,6 +383,7 @@ export default function CheckOutPanel({ panelInfo }) {
</TPopUp>
)}
{/*
{activePopup === Config.ACTIVE_POPUP.errorPopup && (
<TPopUp
kind="errorPopup"
@@ -393,7 +394,7 @@ export default function CheckOutPanel({ panelInfo }) {
button1Text={$L("CLOSE")}
onClick={handlePopPanel}
/>
)}
)} */}
<TFullPopup
open={placeOrderPopup}

View File

@@ -29,42 +29,14 @@ export default function SummaryContainer({
currSignLoc,
doSendLogPaymentEntry,
}) {
const dispatch = useDispatch();
const { popupVisible, activePopup } = useSelector(
(state) => state.common.popup
);
const priceTotalData = useSelector(
(state) => state.checkout?.checkoutTotalData
);
const checkoutTotalError = useSelector(
(state) => state.checkout?.checkoutTotalError
);
const productList = useSelector(
(state) => state.checkout?.checkoutData.productList?.[0]
);
useEffect(() => {
if (checkoutTotalError) {
dispatch(setShowPopup(Config.ACTIVE_POPUP.checkoutErrorPopup));
}
}, [checkoutTotalError]);
const errorMessage = useMemo(() => {
if (checkoutTotalError) {
return getErrorMessage(
checkoutTotalError.retCode,
checkoutTotalError.retMsg
);
}
return null;
}, [checkoutTotalError]);
const handleCloseErrorPopup = useCallback(() => {
dispatch(setHidePopup());
dispatch(popPanel());
}, [dispatch]);
const items = useMemo(
() => [
{
@@ -206,22 +178,6 @@ export default function SummaryContainer({
</TButton>
</div>
</Container>
{activePopup === Config.ACTIVE_POPUP.checkoutErrorPopup && (
<TPopUp
kind="errorPopup"
open={popupVisible}
onClose={handleCloseErrorPopup}
className={css.checkoutErrorPopup}
>
<div className={css.popupContainer}>
<p className={css.errMsg}>{errorMessage}</p>
<TButton className={css.popupBtn} onClick={handleCloseErrorPopup}>
{$L("OK")}
</TButton>
</div>
</TPopUp>
)}
</>
);
}

View File

@@ -25,6 +25,7 @@ import {
alertToast,
changeAppStatus,
changeLocalSettings,
clearErrorMessage,
setExitApp,
setHidePopup,
setShowPopup,
@@ -40,18 +41,23 @@ import {
getMyUpcomingAlertShow,
setMyTermsWithdraw,
} from "../../actions/myPageActions";
import { pushPanel, resetPanels } from "../../actions/panelActions";
import { popPanel, pushPanel, resetPanels } from "../../actions/panelActions";
import EndOfServicePopUp from "../../components/EndOfServicePopUp/EndOfServicePopUp";
import Loader from "../../components/Loader/Loader";
import { convertUtcToLocal } from "../../components/MediaPlayer/util";
import PreloadImage from "../../components/PreloadImage/PreloadImage";
import SystemNotification from "../../components/SystemNotification/SystemNotification";
import TabLayout from "../../components/TabLayout/TabLayout";
import TButton from "../../components/TButton/TButton";
import TPopUp from "../../components/TPopUp/TPopUp";
import usePrevious from "../../hooks/usePrevious";
import * as Config from "../../utils/Config";
import { panel_names } from "../../utils/Config";
import { $L, getSpottableDescendants } from "../../utils/helperMethods";
import {
$L,
getErrorMessage,
getSpottableDescendants,
} from "../../utils/helperMethods";
import { SpotlightIds } from "../../utils/SpotlightIds";
import CartPanel from "../CartPanel/CartPanel";
import CategoryPanel from "../CategoryPanel/CategoryPanel";
@@ -134,6 +140,7 @@ export default function MainView({ className }) {
popupVisible,
activePopup,
data: errorCode,
data: popupData,
} = useSelector((state) => state.common.popup);
const {
showLoadingPanel,
@@ -597,6 +604,15 @@ export default function MainView({ className }) {
}
}, [webOSVersion]);
const handleErrorPopupClose = useCallback(() => {
if (popupData?.shouldPopPanel) {
dispatch(popPanel());
}
dispatch(clearErrorMessage());
dispatch(setHidePopup());
}, [dispatch, popupData]);
return (
<div
className={classNames(css.mainViewWrap, className)}
@@ -666,6 +682,25 @@ export default function MainView({ className }) {
/>
)}
{activePopup === Config.ACTIVE_POPUP.errorPopup && (
<TPopUp
kind="errorPopup"
open={popupVisible}
onClose={handleErrorPopupClose}
className={css.errorPopup}
>
<div className={css.popupContainer}>
<p className={css.errMsg}>
{popupData &&
getErrorMessage(popupData.errorCode, popupData.errorMsg)}
</p>
<TButton className={css.popupBtn} onClick={handleErrorPopupClose}>
{$L("OK")}
</TButton>
</div>
</TPopUp>
)}
{(loadingComplete &&
activePopup === Config.ACTIVE_POPUP.unSupportedCountryPopup) ||
(loadingComplete &&

View File

@@ -1,5 +1,6 @@
@import "../../style/CommonStyle.module.less";
@import "../../style/utils.module.less";
.mainViewWrap {
height: 100vh;
background-color: #fff;
@@ -18,3 +19,26 @@
}
}
}
.errorPopup {
> div > div > div > div {
padding: 50px 0 !important;
}
.popupContainer {
width: 780px;
.flex(@display: flex, @justifyCenter: center, @alignCenter: center, @direction: column);
p {
width: 100%;
font-size: 28px;
color: #222222;
text-align: center;
}
.popupBtn {
.size(@w: 300px , @h: 78px);
margin-top: 38px;
}
}
}