test

2025-10-16 18:10:11 +09:00
parent fd502d71b2
commit f4e2fe4769
14 changed files with 421 additions and 138 deletions
--- a/src/entities/transaction/ui/all-transaction-list.tsx
+++ b/src/entities/transaction/ui/all-transaction-list.tsx
@@ -5,7 +5,6 @@ export const AllTransactionList = ({
  transactionCategory,
  listItems 
 }: AllTransactionListProps) => {
-  
  const getListDateGroup = () => {
    let rs = [];
    let date = '';
@@ -13,13 +12,16 @@ export const AllTransactionList = ({
    for(let i=0;i<listItems.length;i++){
      let transactionDateTime = listItems[i].transactionDateTime;
      let transactionDate = transactionDateTime.substr(0, 8);
+      if(i === 0){
+        date = transactionDate;
+      }
      if(date !== transactionDate){
        date = transactionDate;
        if(list.length > 0){
          rs.push(
            <ListDateGroup
              transactionCategory={ transactionCategory }
-              key={ date }
+              key={ date + '-' + i }
              date={ date }
              items={ list }
            ></ListDateGroup>
@@ -29,6 +31,16 @@ export const AllTransactionList = ({
      }
      list.push(listItems[i]);
    }
+    if(list.length > 0){
+      rs.push(
+        <ListDateGroup
+          transactionCategory={ transactionCategory }
+          key={ date + '-last' }
+          date={ date }
+          items={ list }
+        ></ListDateGroup>
+      )
+    }
    return rs;
  };

--- a/src/entities/transaction/ui/filter/all-transaction-filter.tsx
+++ b/src/entities/transaction/ui/filter/all-transaction-filter.tsx
@@ -12,6 +12,7 @@ import {
  AllTransactionStatusCodeBtnGroup,
  AllTransactionServiceCodeOptionsGroup,
  AllTransactionCardBankCodeOptionsGroup,
+  AllTracsactionStatusCode,
 } from '@/entities/transaction/model/contant';
 import { 
  AllTransactionFilterProps,
@@ -79,7 +80,7 @@ export const AllTransactionFilter = ({

  const midOptions = useStore.getState().UserStore.selectOptionsMids;

-  console.log(serviceCodeOptions)
+  const [statusCodeBtns, setStatusCodeBtns] = useState<Array<Record<string, string>>>();

  const onClickToClose = () => {
    setFilterOn(false);
@@ -112,53 +113,68 @@ export const AllTransactionFilter = ({
    setSearchValue(filterSearchValue);
    onClickToClose();
  };
+
+  
  
  let setSearchClOptions = (value: string) => {
    let options = [];
    setFilterServiceCode(value);

-    /*
-    if(value === AllTransactionServiceCode.ALL){
+    if(value === ''){

    }
-    else if(value === AllTransactionServiceCode.CREDIT_CARD){
+    else if(value === '01'){
      options.push({name: '카드번호', value: AllTransactionSearchCl.CARD_NO});
      options.push({name: '승인번호', value: AllTransactionSearchCl.CARD_APPROVAL_NO});
    }
-    else if(value === AllTransactionServiceCode.VIRTUAL_ACCOUNT){
+    else if(value === '02'){
+      options.push({name: '구매자명', value: AllTransactionSearchCl.BANK_BUYER_NM});
+    }
+    else if(value === '03'){
      options.push({name: '가상계좌번호', value: AllTransactionSearchCl.VACCT_NO});
      options.push({name: '입금자명', value: AllTransactionSearchCl.VACCT_DEPOSIT_NM});
    }
-    else if(value === AllTransactionServiceCode.ACCOUNT_TRANSFER){
-      options.push({name: '구매자명', value: AllTransactionSearchCl.BANK_BUYER_NM});
-    }
-    else if(value === AllTransactionServiceCode.ACCOUNT_SIMPLE_TRANSFER){
-      
-    }
-    else if(value === AllTransactionServiceCode.MOBILE_PAYMENT){
+    else if(value === '05'){
      options.push({name: '휴대폰번호', value: AllTransactionSearchCl.TEL_NO});
    }
-    else if(value === AllTransactionServiceCode.SSGMONEY){
+    else if(value === '14'){
      options.push({name: '상품권번호', value: AllTransactionSearchCl.SSGMONEY_GIFT_NO}); 
    }
-    else if(value === AllTransactionServiceCode.SSGBANK){
+    else if(value === '21'){
      options.push({name: '승인번호', value: AllTransactionSearchCl.SSGBANK_APPROVAL_NO}); 
    }
-    else if(value === AllTransactionServiceCode.CULT){
+    else if(value === '24'){
+      options.push({name: '고객ID', value: AllTransactionSearchCl.CMSBANK_USER_ID}); 
+    }
+    else if(value === '26'){
      options.push({name: '컬처랜드ID', value: AllTransactionSearchCl.SSGBANK_APPROVAL_NO}); 
    }
-    else if(value === AllTransactionServiceCode.TMONEY){
-      options.push({name: '티머니번호', value: AllTransactionSearchCl.TMONEY_CARD_NO}); 
+    else if(value === '31'){
+      options.push({name: '카드번호', value: AllTransactionSearchCl.TMONEY_CARD_NO}); 
    }
    setSearchClOptionsGroup(options);
-    */
+    
+  };
+  
+  const onChangeServiceCode = (val: string) => {
+    let list = AllTracsactionStatusCode.filter((value, index) => {
+      return val === value.serviceCode;
+    })[0]?.list;
+    let btns = list?.map((value, index) => {
+      return {
+        name: value.ko,
+        value: value.code
+      }
+    });
+    setStatusCodeBtns(btns);
+    setSearchClOptions(val);
  };

-  /*
+
  useEffect(() => {
-    setFilterDeliveryStatus(deliveryStatus);
-  }, [deliveryStatus]);
-  */
+    onChangeServiceCode(serviceCode);
+    setFilterServiceCode(serviceCode);
+  }, [serviceCode]);

  return (
    <>
@@ -213,7 +229,7 @@ export const AllTransactionFilter = ({
            <FilterButtonGroups
              title='거래상태'
              activeValue={ filterStatusCode }
-              btnGroups={ AllTransactionStatusCodeBtnGroup }
+              btnGroups={ statusCodeBtns }
              setter={ setFilterStatusCode }
            ></FilterButtonGroups>

@@ -221,7 +237,7 @@ export const AllTransactionFilter = ({
            <FilterSelect
              title='결제수단'
              selectValue={ filterServiceCode }
-              selectSetter={ setSearchClOptions }
+              selectSetter={ onChangeServiceCode }
              selectOptions={ serviceCodeOptions }
            ></FilterSelect>
            }
--- a/src/entities/transaction/ui/list-date-group.tsx
+++ b/src/entities/transaction/ui/list-date-group.tsx
@@ -2,6 +2,7 @@ import moment from 'moment';
 import 'moment/dist/locale/ko';
 import { ListDateGroupProps } from '../model/types';
 import { ListItem } from './list-item';
+import { useStore } from '@/shared/model/store';

 export const ListDateGroup = ({
  transactionCategory,
@@ -9,16 +10,35 @@ export const ListDateGroup = ({
  items
 }: ListDateGroupProps) => {
  moment.locale('ko');
+  let serviceCodes = useStore.getState().CommonStore.serviceCodes;
  const getStateDate = () => {
    let stateDate = moment(date).format('YY.MM.DD(ddd)');
    return stateDate;
  };

+  const getServiceName = (serviceCode: string) => {
+    let serviceName = '';
+    for(let i=0;i<serviceCodes.length;i++){
+      if(serviceCodes[i].value === serviceCode){
+        serviceName = serviceCodes[i].name;
+        break;
+      }
+    }
+    return serviceName;
+  };
+
  const getListItem = () => {
    let rs = [];
+    console.log('items', items)
    if(!!items && items.length>0){
      for(let i=0;i<items.length;i++){
        let key = 'ListItem-'+i;
+        let serviceName = '';
+        let serviceCode = items[i]?.serviceCode
+        if(serviceCode){
+          serviceName = getServiceName(serviceCode);
+        }
+        
        rs.push(
          <ListItem
            transactionCategory={ transactionCategory }
@@ -27,7 +47,8 @@ export const ListDateGroup = ({
            mid={ items[i]?.mid }
            statusCode={ items[i]?.statusCode }
            installmentMonth={ items[i]?.installmentMonth }
-            serviceCode={ items[i]?.serviceCode }
+            serviceName={ serviceName }
+            serviceCode={ serviceCode }
            serviceDetailName={ items[i]?.serviceDetailName }
            goodsAmount={ items[i]?.goodsAmount }

--- a/src/entities/transaction/ui/list-item.tsx
+++ b/src/entities/transaction/ui/list-item.tsx
@@ -3,11 +3,13 @@ import { PATHS } from '@/shared/constants/paths';
 import { useNavigate } from '@/shared/lib/hooks/use-navigate';
 import { ListItemProps, TransactionCategory } from '../model/types';
 import moment from 'moment';
+import { useStore } from '@/shared/model/store';
+import { AllTracsactionStatusCode } from '../model/contant';

 export const ListItem = ({
  transactionCategory,
  tid, mid, statusCode,
-  installmentMonth, serviceCode,
+  installmentMonth, serviceName, serviceCode,
  serviceDetailName, goodsAmount,
  id, amount, customerName, issueNumber,
  issueStatus, paymentMethod, processResult, 
@@ -94,15 +96,20 @@ export const ListItem = ({
  const getTitle = () => {
    let str = '';
    if(transactionCategory === TransactionCategory.AllTransaction){
-      let strDetailName = serviceDetailName?.split('|').join(',');
+      let strDetailName = '';
+      if(serviceDetailName){
+        strDetailName = serviceDetailName?.split('|').join(',');
+      }
      if(strDetailName){
        let last = strDetailName.slice(-1);
        if(last === ','){
          strDetailName = strDetailName.substring(0, strDetailName.length - 1);
        }
-        str = `(${strDetailName})`;
+        str = `${serviceName}(${strDetailName})`;
+      }
+      else{
+        str = `${serviceName}`;
      }
-      
    }
    else if(transactionCategory === TransactionCategory.CashReceipt){
      str = `${customerName}(${issueNumber})`
@@ -116,14 +123,39 @@ export const ListItem = ({
    return str;
  };

+  const getStatusName = () => {
+    let str;
+    if(transactionCategory === TransactionCategory.AllTransaction){
+      Loop1: 
+      for(let i=0;i<AllTracsactionStatusCode.length;i++){
+        if(serviceCode === AllTracsactionStatusCode[i]?.serviceCode){
+          let list = AllTracsactionStatusCode[i]?.list;
+          if(!!list){
+            Loop2:
+            for(let j=0;j<list.length;j++){
+              if(list[j]?.code === statusCode){
+                str = list[j]?.ko;
+                break Loop1;
+              }
+            }
+          }
+        }
+      }
+    }
+    return str || '';
+  };
+
  const getDetail = () => {
    let rs = [];
    if(transactionCategory === TransactionCategory.AllTransaction){
      rs.push(
-        <div className="transaction-details">
+        <div 
+          className="transaction-details"
+          key={ tid }
+        >
          <span>{ getTime() }</span>
          <span className="separator">|</span>
-          <span>{ statusCode }</span>
+          <span>{ getStatusName() }</span>
          <span className="separator">|</span>
          <span>{ mid }</span>
          {
--- a/src/entities/transaction/ui/section/important-info-section.tsx
+++ b/src/entities/transaction/ui/section/important-info-section.tsx
@@ -1,53 +1,104 @@
 import moment from 'moment';
 import { NumericFormat } from 'react-number-format';
 import { InfoSectionProps, TransactionCategory } from '../../model/types';
+import { useStore } from '@/shared/model/store';
+import { AllTracsactionStatusCode } from '../../model/contant';

 export const ImportantInfoSection = ({
  transactionCategory,
  importantInfo,
  serviceCode
-  }: InfoSectionProps) => {
+}: InfoSectionProps) => {
+  let serviceCodes = useStore.getState().CommonStore.serviceCodes;
+  let serviceName = '';
+  let statusName = '';
+
+  const getServiceName = (serviceCode: string) => {
+    let serviceName = '';
+    for(let i=0;i<serviceCodes.length;i++){
+      if(serviceCodes[i].value === serviceCode){
+        serviceName = serviceCodes[i].name;
+        break;
+      }
+    }
+    return serviceName;
+  };
+
+  const getStatusName = (serviceCode: string, statusCode: string) => {
+    let str;
+    if(transactionCategory === TransactionCategory.AllTransaction){
+      Loop1: 
+      for(let i=0;i<AllTracsactionStatusCode.length;i++){
+        if(serviceCode === AllTracsactionStatusCode[i]?.serviceCode){
+          let list = AllTracsactionStatusCode[i]?.list;
+          if(!!list){
+            Loop2:
+            for(let j=0;j<list.length;j++){
+              if(list[j]?.code === statusCode){
+                str = list[j]?.ko;
+                break Loop1;
+              }
+            }
+          }
+        }
+      }
+    }
+    return str || '';
+  };
  
+  if(serviceCode){
+    serviceName = getServiceName(serviceCode);
+    if(importantInfo){
+      importantInfo.serviceName = serviceName;
+    }
+  }
+  if(serviceCode && importantInfo?.transactionStatus){
+    statusName = getStatusName(serviceCode, importantInfo.transactionStatus);
+    if(importantInfo){
+      importantInfo.statusName = statusName;
+    }
+  }
+
  const subItems: Record<string, Record<string, string>> = {
-    ordNo: {name: '주문번호', type: 'string'},
+    moid: {name: '주문번호', type: 'string'},
    tid: {name: 'TID', type: 'string'},
-    tradeStatus: {name: '거래상태', type: 'string'},
-    tradeMethod: {name: '거래수단', type: 'string'},
+    statusName: {name: '거래상태', type: 'string'},
+    serviceName: {name: '거래수단', type: 'string'},
    approvalDate: {name: '승인일', type: 'date'},
-    tradeDate: {name: '거래일', type: 'date'},
+    transactionDate: {name: '거래일', type: 'date'},
    requestDate: {name: '요청일', type: 'date'},
    cancelDate: {name: '취소일', type: 'date'},
-    productName: {name: '상품명', type: 'string'}
+    goodsName: {name: '상품명', type: 'string'}
  };
  
  const openSubItems: Record<string, Array<string>> = {
    // 신용카드
-    '01': ['ordNo', 'tid', 'tradeStatus', 'tradeMethod', 
-      'approvalDate', 'cancelDate', 'productName'],
+    '01': ['moid', 'tid', 'statusName', 'serviceName', 
+      'approvalDate', 'cancelDate', 'goodsName'],
    // 계좌이체
-    '02': ['ordNo', 'tid', 'tradeStatus', 'tradeMethod',
-      'tradeDate', 'cancelDate', 'productName'],
+    '02': ['moid', 'tid', 'statusName', 'serviceName',
+      'transactionDate', 'cancelDate', 'goodsName'],
    // 가상계좌
-    '03': ['ordNo', 'tid', 'tradeStatus', 'tradeMethod', 
-      'requestDate', 'cancelDate', 'productName'],
+    '03': ['moid', 'tid', 'statusName', 'serviceName', 
+      'requestDate', 'cancelDate', 'goodsName'],
    // 휴대폰
-    '04': ['ordNo', 'tid', 'tradeStatus', 'tradeMethod', 
-      'tradeDate', 'cancelDate', 'productName'],
-    // 계좌간편결제
-    '26': ['ordNo', 'tid', 'tradeStatus', 'tradeMethod', 
-      'tradeDate', 'cancelDate', 'productName'],
-    // SSG머니
-    '21': ['ordNo', 'tid', 'tradeStatus', 'tradeMethod', 
-      'tradeDate', 'cancelDate', 'productName'],
-    // SSG은행계좌
-    '24': ['ordNo', 'tid', 'tradeStatus', 'tradeMethod', 
-      'tradeDate', 'cancelDate', 'productName'],
+    '05': ['moid', 'tid', 'statusName', 'serviceName', 
+      'transactionDate', 'cancelDate', 'goodsName'],
    // 문화상품권
-    '14': ['ordNo', 'tid', 'tradeStatus', 'tradeMethod', 
-      'tradeDate', 'cancelDate', 'productName'],
+    '14': ['moid', 'tid', 'statusName', 'serviceName', 
+      'transactionDate', 'cancelDate', 'goodsName'],
+    // SSG머니
+    '21': ['moid', 'tid', 'statusName', 'serviceName', 
+      'transactionDate', 'cancelDate', 'goodsName'],
+    // SSG은행계좌
+    '24': ['moid', 'tid', 'statusName', 'serviceName', 
+      'transactionDate', 'cancelDate', 'goodsName'],
+    // 계좌간편결제
+    '26': ['moid', 'tid', 'statusName', 'serviceName', 
+      'transactionDate', 'cancelDate', 'goodsName'],
    // 티머니페이
-    '31': ['ordNo', 'tid', 'tradeStatus', 'tradeMethod', 
-      'tradeDate', 'cancelDate', 'productName'],
+    '31': ['moid', 'tid', 'statusName', 'serviceName', 
+      'transactionDate', 'cancelDate', 'goodsName'],
  };
  
  const checkValue = (val: any) => {
@@ -56,7 +107,7 @@ export const ImportantInfoSection = ({
  let newImportantInfo: Record<string, any> | undefined = importantInfo;
  const subLi = () => {
    let rs = [];
-
+    
    if(!!newImportantInfo && !!serviceCode && !!openSubItems[serviceCode]){
      for(let i=0;i<openSubItems[serviceCode].length;i++){
        let k = openSubItems[serviceCode][i];
@@ -100,7 +151,9 @@ export const ImportantInfoSection = ({
          { (transactionCategory === TransactionCategory.AllTransaction) && 
            subLi()
          }
-          { (transactionCategory === TransactionCategory.Escrow) && 
+          { 
+          /*
+          (transactionCategory === TransactionCategory.Escrow) && 
            <>
              <li className="kv-row">
                <span className="k">주문번호</span>
@@ -120,17 +173,18 @@ export const ImportantInfoSection = ({
              </li>
              <li className="kv-row">
                <span className="k">승인일</span>
-                <span className="v">{ moment(importantInfo?.approvalDateTime).format('YYYY.MM.DD HH:mm:ss') }</span>
+                <span className="v">{ moment(importantInfo?.approvalDate).format('YYYY.MM.DD') }</span>
              </li>
              <li className="kv-row">
                <span className="k">취소일</span>
-                <span className="v">{ importantInfo?.cancelDate }</span>
+                <span className="v">{ moment(importantInfo?.cancelDate).format('YYYY.MM.DD') }</span>
              </li>
              <li className="kv-row">
                <span className="k">상품명</span>
-                <span className="v">{ importantInfo?.productName }</span>
+                <span className="v">{ importantInfo?.goodsName }</span>
              </li>
            </>
+            */
          }
          
        </ul>
--- a/src/entities/transaction/ui/section/settlement-info-section.tsx
+++ b/src/entities/transaction/ui/section/settlement-info-section.tsx
@@ -14,40 +14,40 @@ export const SettlementInfoSection = ({
 }: InfoSectionProps) => {
  
  const subItems: Record<string, Record<string, string>> = {
-    approvalSettleDate: {name: '승인정산일', type: 'date'},
-    approvalSettleAmount: {name: '승인정산금액', type: 'number'},
-    cancelSettleDate: {name: '취소정산일', type: 'date'},
-    cancelSettleAmount: {name: '취소정산금액', type: 'number'},
+    approvalSettlementDate: {name: '승인정산일', type: 'date'},
+    approvalSettlementAmount: {name: '승인정산금액', type: 'number'},
+    cancelSettlementDate: {name: '취소정산일', type: 'date'},
+    cancelSettlementAmount: {name: '취소정산금액', type: 'number'},
  };

  const openSubItems: Record<string, Array<string>> = {
    // 신용카드
-    '01': ['approvalSettleDate', 'approvalSettleAmount', 
-      'cancelSettleDate', 'cancelSettleAmount'],
+    '01': ['approvalSettlementDate', 'approvalSettlementAmount', 
+      'cancelSettlementDate', 'cancelSettlementAmount'],
    // 계좌이체
-    '02': ['approvalSettleDate', 'approvalSettleAmount', 
-      'cancelSettleDate', 'cancelSettleAmount'],
+    '02': ['approvalSettlementDate', 'approvalSettlementAmount', 
+      'cancelSettlementDate', 'cancelSettlementAmount'],
    // 가상계좌
-    '03': ['approvalSettleDate', 'approvalSettleAmount', 
-      'cancelSettleDate', 'cancelSettleAmount'],
+    '03': ['approvalSettlementDate', 'approvalSettlementAmount', 
+      'cancelSettlementDate', 'cancelSettlementAmount'],
    // 휴대폰
-    '04': ['approvalSettleDate', 'approvalSettleAmount', 
-      'cancelSettleDate', 'cancelSettleAmount'],
-    // 계좌간편결제
-    '26': ['approvalSettleDate', 'approvalSettleAmount', 
-      'cancelSettleDate', 'cancelSettleAmount'],
-    // SSG머니
-    '21': ['approvalSettleDate', 'approvalSettleAmount', 
-      'cancelSettleDate', 'cancelSettleAmount'],
-    // SSG은행계좌
-    '24': ['approvalSettleDate', 'approvalSettleAmount', 
-      'cancelSettleDate', 'cancelSettleAmount'],
+    '05': ['approvalSettlementDate', 'approvalSettlementAmount', 
+      'cancelSettlementDate', 'cancelSettlementAmount'],
    // 문화상품권
-    '14': ['approvalSettleDate', 'approvalSettleAmount', 
-      'cancelSettleDate', 'cancelSettleAmount'],
+    '14': ['approvalSettlementDate', 'approvalSettlementAmount', 
+      'cancelSettlementDate', 'cancelSettlementAmount'],
+    // SSG머니
+    '21': ['approvalSettlementDate', 'approvalSettlementAmount', 
+      'cancelSettlementDate', 'cancelSettlementAmount'],
+    // SSG은행계좌
+    '24': ['approvalSettlementDate', 'approvalSettlementAmount', 
+      'cancelSettlementDate', 'cancelSettlementAmount'],
+    // 계좌간편결제
+    '26': ['approvalSettlementDate', 'approvalSettlementAmount', 
+      'cancelSettlementDate', 'cancelSettlementAmount'],
    // 티머니페이
-    '31': ['approvalSettleDate', 'approvalSettleAmount', 
-      'cancelSettleDate', 'cancelSettleAmount'],
+    '31': ['approvalSettlementDate', 'approvalSettlementAmount', 
+      'cancelSettlementDate', 'cancelSettlementAmount'],
  };

  const checkValue = (val: any) => {