- ars,SMS,KeyIn 수정

2025-10-28 20:29:34 +09:00
parent 84ade896c4
commit 7a8cafe7bb
16 changed files with 153 additions and 96 deletions
--- a/src/entities/additional-service/model/ars/types.ts
+++ b/src/entities/additional-service/model/ars/types.ts
@@ -39,11 +39,14 @@ export interface ExtensionArsListParams {
 };
 export interface ArsListContent {
  tid?: string;
-  paymentDate?: string;
-  paymentStatus?: PaymentStatus | string;
-  orderStatus?: OrderStatus;
-  arsPaymentMethod?: string;
+  orderDate?: string;
+  orderTime?: string;
+  buyerName?: 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;
+    };
+  };
+};
--- a/src/entities/additional-service/model/key-in/types.ts
+++ b/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;
-  expMon: string;
+  cardExpire: string;
  instmnt: string;
  amount: number;
  productName: string;
--- a/src/entities/additional-service/model/sms-payment/types.ts
+++ b/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;
-  paymentStatus?: string;
+  buyerName?: string;
+  buyerPhoneLast4?: string;
+  sendDate?: string;
+  amount?: number;
+  smsTypeName?: string;
  smsCl?: string;
+  resendEnabled?: boolean;
 }

 export interface SmsPaymentListProps {
--- a/src/entities/additional-service/ui/filter/ars-filter.tsx
+++ b/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 [filterToDate, setFilterToDate] = useState<string>(moment(toDate).format('YYYY.MM.DD'));
+  const [filterFromDate, setFilterFromDate] = useState<string>(moment(fromDate).format('YYYYMMDD'));
+  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);
--- a/src/entities/additional-service/ui/list-date-group.tsx
+++ b/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}
--- a/src/entities/additional-service/ui/list-item.tsx
+++ b/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,
-
-  accountName,
-
-  submallId, settlementDate, companyName,
-
-  orderStatus, arsPaymentMethod,
+  transactionTime,transactionCode,transactionType,
+  accountName,submallId, settlementDate, companyName,orderStatus,

  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,
-          amount: amount
+          tid: tid
        }
      });
    }
@@ -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 = time?.substring(0, 2) + ':' + time?.substring(2, 4);
+      timeStr = orderTime?.substring(0, 2) + ':' + orderTime?.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>
      )
    }
--- a/src/entities/additional-service/ui/sms-payment/sms-payment-filter.tsx
+++ b/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 [filterToDate, setFilterToDate] = useState<string>(moment(toDate).format('YYYY.MM.DD'));
+  const [filterFromDate, setFilterFromDate] = useState<string>(moment(fromDate).format('YYYYMMDD'));
+  const [filterToDate, setFilterToDate] = useState<string>(moment(toDate).format('YYYYMMDD'));
  const [filterSmsCl, setFilterSmsCl] = useState<SmsCl>(smsCl);
  
  const midOptions = useStore.getState().UserStore.selectOptionsMids;
--- a/src/entities/additional-service/ui/sms-payment/sms-payment-list.tsx
+++ b/src/entities/additional-service/ui/sms-payment/sms-payment-list.tsx
@@ -1,5 +1,4 @@
-import { SmsPaymentListItem, SmsPaymentListProps } from '../../model/sms-payment/types';
-import { AdditionalServiceCategory } from '../../model/types';
+import { SmsPaymentListProps } from '../../model/sms-payment/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;
-        paymentDate = paymentDate?.substring(0, 8);
-        if(!!paymentDate) {
+        let sendDate = items?.sendDate;
+        sendDate = sendDate?.substring(0, 8);
+        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);
--- a/src/entities/alarm/ui/login-type-bottom-sheet.tsx
+++ b/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': ''}` }
-                onClick={ () => onChangeLoginType('ID') }
+                className={`${(loginType === LoginType.ID) ? 'selected' : ''}`}
+                onClick={() => onChangeLoginType('ID')}
              >{t('settings.loginType.idPassword')}</li>
              <li
-                className={ `${(loginType === LoginType.BIOMETRIC)? 'selected': ''}` }
-                onClick={ () => onChangeLoginType('BIOMETRIC') }
+                className={`${(loginType === LoginType.BIOMETRIC) ? 'selected' : ''}`}
+                onClick={() => onChangeLoginType('BIOMETRIC')}
              >{t('settings.loginType.biometric')}</li>
            </ul>
          </div>
--- a/src/pages/additional-service/ars/detail-page.tsx
+++ b/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>
            )}
--- a/src/pages/additional-service/ars/list-page.tsx
+++ b/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 itemDate = paymentDate.substring(0, 8);
+        let orderDate = item?.orderDate || '';
+        let itemDate = orderDate.substring(0, 8);
        if (!!itemDate) {
          if (i === 0) {
            date = itemDate;
--- a/src/pages/additional-service/ars/request-page.tsx
+++ b/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) => {
-      console.log(rs)
-      setResultMessage('결제 신청이 완료되었습니다');
+    arsApply(arsApplyParams)
+    .then((rs: ExtensionArsApplyResponse) => {
+      if (rs.status === true) {
        setSuccessPageOn(true);
-    }).catch(() => {
-
-    }).finally(() => {
-
-    });
+      } else {
+        const errorMessage = rs.error?.message || '신청을 실패하였습니다.';
+        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
-                      type="text"
+                    <select
                      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>
-                      <option selected>일시불</option>
-                      <option>일시불</option>
+                    <select
+                      disabled
+                      value={instmntMonth}
+                      onChange={(e: ChangeEvent<HTMLSelectElement>) => setInstmntMonth(e.target.value)}
+                    >
+                      <option value="00">일시불</option>
                    </select>
                  </div>
                </div>
--- a/src/pages/additional-service/key-in-payment/key-in-payment-page.tsx
+++ b/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,
--- a/src/pages/additional-service/key-in-payment/requeset-page.tsx
+++ b/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,
-            expMon: expMon,
+            cardExpire: cardExpire,
            instmnt: instmnt,
            amount: amount,
            productName: productName,
--- a/src/pages/setting/setting-page.tsx
+++ b/src/pages/setting/setting-page.tsx
@@ -440,6 +440,7 @@ export const SettingPage = () => {
          loginType={ loginType }
          setLoginType={ handleSetLoginType }
          onBiometricRegistered={ loadLoginType }
+          isAndroid={ isAndroid }
        ></LoginTypeBottomSheet>
      }
      { !!serviceLanguageBottomSheetOn &&
--- a/src/shared/api/api-url-additional-service.ts
+++ b/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: 부가서비스 조회