- ars,SMS,KeyIn 수정

src/entities/additional-service/model/ars/types.ts

@@ -39,11 +39,14 @@ export interface ExtensionArsListParams {
 };
 export interface ArsListContent {
   tid?: string;
-  paymentDate?: string;
+  orderDate?: string;
-  paymentStatus?: PaymentStatus | string;
+  orderTime?: string;
-  orderStatus?: OrderStatus;
+  buyerName?: string;
-  arsPaymentMethod?: string;
+  buyerPhoneLast4?: string;
+  orderStatus?: string;
+  transactionType?: string;
   amount?: number;
+  statusColor?: string;
 };
 export interface ExtensionArsListResponse extends DefaulResponsePagination {
   content: Array<ArsListContent>;
@@ -67,6 +70,7 @@ export interface ExtensionArsDetailResponse {
   corpName: string;
   mid: string;
   arsPaymentMethod: string;
+  amount: string;
   paymentStatus: PaymentStatus;
   orderStatus: string;
   paymentDate: string;
@@ -89,4 +93,16 @@ export interface ExtensionArsApplyParams {
   email: string;
   arsPaymentMethod: string;
 };
-export interface ExtensionArsApplyResponse {};
+export interface ExtensionArsApplyResponse {
+  status: boolean;
+  error?: {
+    root?: string;
+    errKey?: string;
+    code?: string;
+    message?: string;
+    timestamp?: string;
+    details?: {
+      path?: string;
+    };
+  };
+};

src/entities/additional-service/model/key-in/types.ts

@@ -93,8 +93,7 @@ export interface ExtensionKeyinDownloadExcelResponse {
 
 export interface ExtensionKeyinApplyParams extends ExtensionRequestParams {
   cardNo: string;
-  expYear: string;
+  cardExpire: string;
-  expMon: string;
   instmnt: string;
   amount: number;
   productName: string;

src/entities/additional-service/model/sms-payment/types.ts

@@ -2,7 +2,7 @@ import { DefaulResponsePagination, DefaultRequestPagination } from '@/entities/c
 import { AdditionalServiceCategory, ExtensionRequestParams, FilterProps, ListItemProps } from '../types';
 
 export enum SmsCl {
-  ALL = "",
+  ALL = "ALL",
   VACCOUNT_REQ = "VACCOUNT_REQ",
   VACCOUNT_REQ_DEPOSIT = "VACCOUNT_REQ_DEPOSIT"
 }
@@ -15,9 +15,13 @@ export enum SmsPaymentSearchCl {
 export interface SmsPaymentListItem {
   mid?: string;
   tid?: string;
-  paymentDate?: string;
+  buyerName?: string;
-  paymentStatus?: string;
+  buyerPhoneLast4?: string;
+  sendDate?: string;
+  amount?: number;
+  smsTypeName?: string;
   smsCl?: string;
+  resendEnabled?: boolean;
 }
 
 export interface SmsPaymentListProps {

src/entities/additional-service/ui/filter/ars-filter.tsx

@@ -60,8 +60,8 @@ export const ArsFilter = ({
 
   const [filterMid, setFilterMid] = useState<string>(mid);
   const [filterMoid, setFilterMoid] = useState<string>(moid);
-  const [filterFromDate, setFilterFromDate] = useState<string>(moment(fromDate).format('YYYY.MM.DD'));
+  const [filterFromDate, setFilterFromDate] = useState<string>(moment(fromDate).format('YYYYMMDD'));
-  const [filterToDate, setFilterToDate] = useState<string>(moment(toDate).format('YYYY.MM.DD'));
+  const [filterToDate, setFilterToDate] = useState<string>(moment(toDate).format('YYYYMMDD'));
   const [filterPaymentStatus, setFilterPaymentStatus] = useState<PaymentStatus>(paymentStatus);
   const [filterOrderStatus, setFilterOrderStatus] = useState<OrderStatus>(orderStatus);
   const [filterMinAmount, setFilterMinAmount] = useState<number | undefined>(minAmount);
@@ -75,7 +75,7 @@ export const ArsFilter = ({
 
   const onClickToSetFilter = () => {
     setMid(filterMid);
-    setFilterMoid(filterMoid);
+    setMoid(filterMoid);
     setFromDate(filterFromDate);
     setToDate(filterToDate);
     setPaymentStatus(filterPaymentStatus);

src/entities/additional-service/ui/list-date-group.tsx

@@ -27,7 +27,7 @@ export const ListDateGroup = ({
             key={ key }
             mid={ mid }
             tid={ items[i]?.tid }
-            paymentDate= { items[i]?.paymentDate}
+            orderDate= { items[i]?.orderDate}
             paymentStatus={ items[i]?.paymentStatus}
             requestDate={ items[i]?.requestDate }
             requestTime={ items[i]?.requestTime}
@@ -58,9 +58,10 @@ export const ListDateGroup = ({
             status={ items[i]?.status }
 
             orderStatus={ items[i]?.orderStatus }
-            arsPaymentMethod={ items[i]?.arsPaymentMethod }
+            orderTime={ items[i]?.orderTime }
-
+            buyerPhoneLast4={ items[i]?.buyerPhoneLast4 }
             buyerName={ items[i]?.buyerName}
+            statusColor={ items[i]?.statusColor}
             cursorId={ items[i]?.cursorId}
             subReqId={ items[i]?.subReqId}
             requestId={ items[i]?.requestId}

src/entities/additional-service/ui/list-item.tsx

@@ -16,16 +16,12 @@ import { getPayoutStatusText } from '../model/payout/constant';
 
 export const ListItem = ({
   additionalServiceCategory,
-  mid, tid, paymentDate, paymentStatus,
+  mid, tid, orderDate, paymentStatus,
-
+  orderTime,buyerPhoneLast4,statusColor,
   applicationDate, requestDate, bankName, accountNo, resultStatus, resultMessage,
   amount, sendMethod, processStatus, registDate,
-
+  transactionTime,transactionCode,transactionType,
-  accountName,
+  accountName,submallId, settlementDate, companyName,orderStatus,
-
-  submallId, settlementDate, companyName,
-
-  orderStatus, arsPaymentMethod,
 
   alimCl, sendType, sendCl,
   paymentMethod, receiverName,
@@ -36,6 +32,7 @@ export const ListItem = ({
 
   smsCl, groupId, userMallId, transType,
   authResult, failReason, requestTime,
+  resendEnabled,
   onResendClick
 }: ListItemProps) => {
   const { navigate } = useNavigate();
@@ -59,16 +56,16 @@ export const ListItem = ({
   const getDotClass = (str?: string) => {
     let rs = '';
     if (additionalServiceCategory === AdditionalServiceCategory.KeyInPayment) {
-      if (paymentStatus === '') {
+      if (transactionType === '') {
         rs = '';
       }
-      else if (paymentStatus === "APPROVAL") {
+      else if (transactionType === "APPROVAL") {
         rs = 'blue';
       }
-      else if (paymentStatus === "ALL_CANCEL") {
+      else if (transactionType === "FULL_CANCEL") {
         rs = 'gray';
       }
-      else if (paymentStatus === 'AFTER_CANCEL') {
+      else if (transactionType === 'PARTIAL_CANCEL') {
         rs = 'gray';
       }
 
@@ -143,6 +140,12 @@ export const ListItem = ({
       } else if (status === "FAIL") {
         rs = 'gray';
       }
+    } else if (additionalServiceCategory === AdditionalServiceCategory.Ars) {
+      if (paymentStatus === "PENDING" || paymentStatus === "SUCCESS") {
+        rs = 'blue';
+      } else {
+        rs = 'gray';
+      }
     }
     return rs;
 
@@ -231,8 +234,7 @@ export const ListItem = ({
         state: {
           additionalServiceCategory: additionalServiceCategory,
           mid: mid,
-          tid: tid,
+          tid: tid
-          amount: amount
         }
       });
     }
@@ -261,7 +263,7 @@ export const ListItem = ({
   const getTime = () => {
     let timeStr = '';
     if (additionalServiceCategory === AdditionalServiceCategory.KeyInPayment) {
-      let time = paymentDate?.substring(8, 12);
+      let time = transactionTime?.substring(0, 4);
       timeStr = time?.substring(0, 2) + ':' + time?.substring(2, 4);
     }
     else if (additionalServiceCategory === AdditionalServiceCategory.AccountHolderAuth) {
@@ -289,8 +291,7 @@ export const ListItem = ({
       }
     }
     else if (additionalServiceCategory === AdditionalServiceCategory.Ars) {
-      let time = paymentDate?.substring(8, 12);
+      timeStr = orderTime?.substring(0, 2) + ':' + orderTime?.substring(2, 4);
-      timeStr = time?.substring(0, 2) + ':' + time?.substring(2, 4);
     }
     else if (additionalServiceCategory === AdditionalServiceCategory.Alimtalk) {
       let time = sendDate?.substring(8, 12);
@@ -323,7 +324,7 @@ export const ListItem = ({
       statusText = getSmsClName(smsCl);
     }
     else if (additionalServiceCategory === AdditionalServiceCategory.KeyInPayment) {
-      statusText = getKeyInPaymentPaymentStatusName(paymentStatus)
+      statusText = getKeyInPaymentPaymentStatusName(transactionType)
     }
     else if (additionalServiceCategory === AdditionalServiceCategory.Ars) {
       statusText = getArsPaymentStatusName(paymentStatus)
@@ -337,7 +338,7 @@ export const ListItem = ({
   const getTitle = () => {
     let str: string | undefined = '';
     if (additionalServiceCategory === AdditionalServiceCategory.KeyInPayment) {
-      str = `${tid}(${amount})`;
+      str = `${transactionCode}`;
     }
     else if (additionalServiceCategory === AdditionalServiceCategory.AccountHolderAuth) {
       str = `${accountName}(${accountNo})`;
@@ -363,10 +364,15 @@ export const ListItem = ({
       str = `${accountName}(${accountNo})`;
     }
     else if (additionalServiceCategory === AdditionalServiceCategory.SMSPayment) {
-      str = `${paymentDate}(${paymentStatus})[추후 수정 필요]`
+      if (buyerPhoneLast4) {
+        str = `${buyerName}(${buyerPhoneLast4})`
+      } else {
+        str = `${buyerName}`
+      }
+      
     }
     else if (additionalServiceCategory === AdditionalServiceCategory.Ars) {
-      str = '이름(' + tid + ')';
+      str = `${buyerName}(${tid})`;
     }
     else if (additionalServiceCategory === AdditionalServiceCategory.Alimtalk) {
       str = `${receiverName}(${getAlimtalkSendTypeText(sendType)})`;
@@ -493,7 +499,7 @@ export const ListItem = ({
           <span className="separator">|</span>
           <span>{getArsOrderStatusName(orderStatus)}</span>
           <span className="separator">|</span>
-          <span>{arsPaymentMethod}</span>
+          <span>{transactionType}</span>
         </div>
       );
     }
@@ -625,12 +631,12 @@ export const ListItem = ({
         >{getAlimtalkSendClTypeText(sendCl)}</div>
       );
     }
-    else if (additionalServiceCategory === AdditionalServiceCategory.SMSPayment && onResendClick && tid) {
+    else if (additionalServiceCategory === AdditionalServiceCategory.SMSPayment && onResendClick && resendEnabled) {
       rs.push(
         <div
           key="sms-payment-amount"
           className={`status-label success`}
-          onClick={() => mid && tid && onResendClick(mid, tid)}
+          onClick={() => mid && onResendClick(mid, tid || '')}
         >{'재발송'}</div>
       )
     }

src/entities/additional-service/ui/sms-payment/sms-payment-filter.tsx

@@ -30,8 +30,8 @@ export const SmsPaymentFilter = ({
   const [filterMid, setFilterMid] = useState<string>(mid);
   const [filterSearchCl, setFilterSearchCl] = useState<SmsPaymentSearchCl>(searchCl);
   const [filterSearchValue, setFilterSearchValue] = useState<string>(searchValue);
-  const [filterFromDate, setFilterFromDate] = useState<string>(moment(fromDate).format('YYYY.MM.DD'));
+  const [filterFromDate, setFilterFromDate] = useState<string>(moment(fromDate).format('YYYYMMDD'));
-  const [filterToDate, setFilterToDate] = useState<string>(moment(toDate).format('YYYY.MM.DD'));
+  const [filterToDate, setFilterToDate] = useState<string>(moment(toDate).format('YYYYMMDD'));
   const [filterSmsCl, setFilterSmsCl] = useState<SmsCl>(smsCl);
   
   const midOptions = useStore.getState().UserStore.selectOptionsMids;

src/entities/additional-service/ui/sms-payment/sms-payment-list.tsx

@@ -1,5 +1,4 @@
-import { SmsPaymentListItem, SmsPaymentListProps } from '../../model/sms-payment/types';
+import { SmsPaymentListProps } from '../../model/sms-payment/types';
-import { AdditionalServiceCategory } from '../../model/types';
 import { ListDateGroup } from '../list-date-group';
 
 export const SmsPaymentList = ({
@@ -16,24 +15,26 @@ export const SmsPaymentList = ({
     for (let i = 0; i < listItems.length; i++) {
       let items = listItems[i];
       if(!!items) {
-        let paymentDate = items?.paymentDate;
+        let sendDate = items?.sendDate;
-        paymentDate = paymentDate?.substring(0, 8);
+        sendDate = sendDate?.substring(0, 8);
-        if(!!paymentDate) {
+        if(!!sendDate) {
           if(i === 0) {
-            date = paymentDate;
+            date = sendDate;
           }
-          if(date !== paymentDate) {
+          if(date !== sendDate) {
             if(list.length > 0) {
               rs.push(
                 <ListDateGroup
+                onResendClick={onResendClick}
                 additionalServiceCategory={additionalServiceCategory}
                 key={ date + '-' + i}
+                mid={mid}
                 date={ date }
                 items={ list }
                 ></ListDateGroup>
               );
             }
-            date = paymentDate;
+            date = sendDate;
             list = [];
           }
           list.push(items);

src/entities/alarm/ui/login-type-bottom-sheet.tsx

@@ -9,13 +9,15 @@ export interface LoginTypeBottomSheetProps {
   loginType: LoginType;
   setLoginType: (loginType: string) => void;
   onBiometricRegistered?: () => void;
+  isAndroid: boolean;
 };
 
 export const LoginTypeBottomSheet = ({
   setLoginTypeBottomSheetOn,
   loginType,
   setLoginType,
-  onBiometricRegistered
+  onBiometricRegistered,
+  isAndroid
 }: LoginTypeBottomSheetProps) => {
   const { t } = useTranslation();
   const { registerBiometric, setLoginType: setLoginTypeNative } = useAppBridge();
@@ -25,6 +27,14 @@ export const LoginTypeBottomSheet = ({
   };
   const onChangeLoginType = async (type: string) => {
     if (loginType !== type) {
+      if (isAndroid) {
+        setLoginTypeNative(type).then(() => {
+            setLoginType(type);
+            onClickToClose();
+          }).catch(() => {
+            onClickToClose();
+          });
+      } else {
         if (type === 'BIOMETRIC') {
           onClickToClose();
           registerBiometric().then(() => {
@@ -41,6 +51,8 @@ export const LoginTypeBottomSheet = ({
           });
         }
       }
+
+    }
   };
 
   return (
@@ -55,9 +67,9 @@ export const LoginTypeBottomSheet = ({
               type="button"
             >
               <img
-                src={ IMAGE_ROOT + '/ico_close.svg' }
+                src={IMAGE_ROOT + '/ico_close.svg'}
                 alt={t('common.close')}
-                onClick={ onClickToClose }
+                onClick={onClickToClose}
               />
             </button>
           </div>
@@ -67,12 +79,12 @@ export const LoginTypeBottomSheet = ({
           <div className="bottom-section">
             <ul className="list-style-circle link">
               <li
-                className={ `${(loginType === LoginType.ID)? 'selected': ''}` }
+                className={`${(loginType === LoginType.ID) ? 'selected' : ''}`}
-                onClick={ () => onChangeLoginType('ID') }
+                onClick={() => onChangeLoginType('ID')}
               >{t('settings.loginType.idPassword')}</li>
               <li
-                className={ `${(loginType === LoginType.BIOMETRIC)? 'selected': ''}` }
+                className={`${(loginType === LoginType.BIOMETRIC) ? 'selected' : ''}`}
-                onClick={ () => onChangeLoginType('BIOMETRIC') }
+                onClick={() => onChangeLoginType('BIOMETRIC')}
               >{t('settings.loginType.biometric')}</li>
             </ul>
           </div>

src/pages/additional-service/ars/detail-page.tsx

@@ -30,7 +30,6 @@ export const ArsDetailPage = () => {
 
   const tid = location.state.tid;
   const mid = location.state.mid;
-  const amount = location.state.amount;
 
   const [detail, setDetail] = useState<ExtensionArsDetailResponse>();
   const [bottomSheetOn, setBottomSheetOn] = useState<boolean>(false);
@@ -86,7 +85,7 @@ export const ArsDetailPage = () => {
               <div className="num-amount">
                 <span className="amount">
                   <NumericFormat
-                    value={ amount } 
+                    value={ detail?.amount } 
                     thousandSeparator
                     displayType="text"
                     suffix='원'
@@ -153,7 +152,7 @@ export const ArsDetailPage = () => {
                 <button
                   className="btn-50 btn-blue flex-1"
                   onClick={ () => onClickToOpenResendBottomSheet() }
-                  disabled={ detail?.orderStatus !== OrderStatus.PENDING }
+                  //disabled={ detail?.orderStatus !== OrderStatus.PENDING }
                 >SMS 재전송</button>
               </div>
             )}

src/pages/additional-service/ars/list-page.tsx

@@ -187,8 +187,8 @@ export const ArsListPage = () => {
     for (let i = 0; i < listItems.length; i++) {
       let item = listItems[i];
       if (!!item) {
-        let paymentDate = item?.paymentDate || '';
+        let orderDate = item?.orderDate || '';
-        let itemDate = paymentDate.substring(0, 8);
+        let itemDate = orderDate.substring(0, 8);
         if (!!itemDate) {
           if (i === 0) {
             date = itemDate;

src/pages/additional-service/ars/request-page.tsx

@@ -11,13 +11,17 @@ import {
   useSetFooterMode,
   useSetOnBack
 } from '@/widgets/sub-layout/use-sub-layout';
-import { ArsPaymentMethod, ExtensionArsApplyParams } from '@/entities/additional-service/model/ars/types';
+import { ArsPaymentMethod, ExtensionArsApplyParams, ExtensionArsApplyResponse } from '@/entities/additional-service/model/ars/types';
 import { ArsRequestSuccessPage } from './request-success-page';
+import { useStore } from '@/shared/model/store';
+import { snackBar } from '@/shared/lib';
 
 export const ArsRequestPage = () => {
   const { navigate } = useNavigate();
   const location = useLocation();
 
+  const midOptions = useStore.getState().UserStore.selectOptionsMids
+
   const { mid: receivedMid } = location.state || {};
 
   const { mutateAsync: arsApply } = useExtensionArsApplyMutation();
@@ -26,7 +30,7 @@ export const ArsRequestPage = () => {
   const [moid, setMoid] = useState<string>('');
   const [goodsName, setGoodsName] = useState<string>('');
   const [amount, setAmount] = useState<number>(0);
-  const [instmntMonth, setInstmntMonth] = useState<string>('');
+  const [instmntMonth, setInstmntMonth] = useState<string>('00');
   const [buyerName, setBuyerName] = useState<string>('');
   const [phoneNumber, setPhoneNumber] = useState<string>('');
   const [email, setEamil] = useState<string>('');
@@ -53,15 +57,18 @@ export const ArsRequestPage = () => {
       email: email,
       arsPaymentMethod: arsPaymentMethod,
     };
-    arsApply(arsApplyParams).then((rs) => {
+    arsApply(arsApplyParams)
-      console.log(rs)
+    .then((rs: ExtensionArsApplyResponse) => {
-      setResultMessage('결제 신청이 완료되었습니다');
+      if (rs.status === true) {
         setSuccessPageOn(true);
-    }).catch(() => {
+      } else {
-
+        const errorMessage = rs.error?.message || '신청을 실패하였습니다.';
-    }).finally(() => {
+        snackBar(`[실패] ${errorMessage}`);
-
+      }
-    });
+    })
+    .catch((error) => {
+      snackBar(`[실패] ${error?.response?.data?.message || error?.response?.data?.error?.message}` || '[실패] 신청을 실패하였습니다.')
+    })
 
   };
 
@@ -116,10 +123,19 @@ export const ArsRequestPage = () => {
                 <div className="billing-row">
                   <div className="billing-label">가맹점 <span>*</span></div>
                   <div className="billing-field">
-                    <input
+                    <select
-                      type="text"
                       value={mid}
-                    />
+                      onChange={(e: ChangeEvent<HTMLSelectElement>) => setMid(e.target.value)}
+                    >
+                      {
+                        midOptions.map((value) => (
+                          <option
+                            key={value.value}
+                            value={value.value}
+                          >{value.name}</option>
+                        ))
+                      }
+                    </select>
                   </div>
                 </div>
 
@@ -164,9 +180,12 @@ export const ArsRequestPage = () => {
                 <div className="billing-row">
                   <div className="billing-label">할부기간 <span>*</span></div>
                   <div className="billing-field">
-                    <select disabled>
+                    <select
-                      <option selected>일시불</option>
+                      disabled
-                      <option>일시불</option>
+                      value={instmntMonth}
+                      onChange={(e: ChangeEvent<HTMLSelectElement>) => setInstmntMonth(e.target.value)}
+                    >
+                      <option value="00">일시불</option>
                     </select>
                   </div>
                 </div>

src/pages/additional-service/key-in-payment/key-in-payment-page.tsx

@@ -77,7 +77,7 @@ export const KeyInPaymentPage = () => {
   const callList = (type?: string) => {
     setOnActionIntersect(false);
     let listParams = {
-      mid: mid,
+      mid: 'nictest02m',
       startDate: startDate,
       endDate: endDate,
       transactionType: transactionType,

src/pages/additional-service/key-in-payment/requeset-page.tsx

@@ -64,12 +64,11 @@ export const KeyInPaymentRequestPage = () => {
 
     const callKeyInPaymentRequest = () => {
         const cardNo = `${cardNo1}${cardNo2}${cardNo3}${cardNo4}`;
-
+        const cardExpire = `${expMon}${expYear}`
         let keyInApplyParams = {
             mid: mid,
             cardNo: cardNo,
-            expYear: expYear,
+            cardExpire: cardExpire,
-            expMon: expMon,
             instmnt: instmnt,
             amount: amount,
             productName: productName,

src/pages/setting/setting-page.tsx

@@ -440,6 +440,7 @@ export const SettingPage = () => {
           loginType={ loginType }
           setLoginType={ handleSetLoginType }
           onBiometricRegistered={ loadLoginType }
+          isAndroid={ isAndroid }
         ></LoginTypeBottomSheet>
       }
       { !!serviceLanguageBottomSheetOn &&

src/shared/api/api-url-additional-service.ts

@@ -91,7 +91,7 @@ export const API_URL_ADDITIONAL_SERVICE = {
   },
   extensionSmsDetail: () => {
     // POST: SMS 결제 통보 상세 조회
-    return `${API_BASE_URL}/api/v1/${API_URL_KEY}/extension/sms/detail`;
+    return `${API_BASE_URL}/api/v1/${API_URL_KEY}/extension/sms/resend-info`;
   },
   extensionList: () => {
     // POST: 부가서비스 조회