115 lines
3.7 KiB
TypeScript
115 lines
3.7 KiB
TypeScript
import moment from 'moment';
|
|
import 'moment/dist/locale/ko';
|
|
import 'moment/dist/locale/en-gb';
|
|
import { ListDateGroupProps } from '../model/types';
|
|
import { ListItem } from './list-item';
|
|
import { useStore } from '@/shared/model/store';
|
|
import { useTranslation } from 'react-i18next';
|
|
|
|
export const ListDateGroup = ({
|
|
transactionCategory,
|
|
date,
|
|
items,
|
|
setDetailData
|
|
}: ListDateGroupProps) => {
|
|
const { t, i18n } = useTranslation();
|
|
|
|
// Set moment locale based on current language
|
|
const currentLocale = i18n.language === 'ko' ? 'ko' : 'en-gb';
|
|
moment.locale(currentLocale);
|
|
|
|
let serviceCodes = useStore.getState().CommonStore.serviceCodes;
|
|
const getStateDate = () => {
|
|
let stateDate = moment(date).format('YY.MM.DD(ddd)');
|
|
return stateDate;
|
|
};
|
|
|
|
const getLocalizedServiceCodeName = (name?: string): string => {
|
|
if (!name) return '';
|
|
|
|
const nameMap: Record<string, string> = {
|
|
'전체': t('transaction.constants.all'),
|
|
'신용카드': t('transaction.constants.creditCard'),
|
|
'계좌이체': t('transaction.constants.accountTransfer'),
|
|
'가상계좌': t('transaction.constants.virtualAccount'),
|
|
'휴대폰': t('transaction.constants.mobilePayment'),
|
|
'문화상품권': t('transaction.constants.cultureLand'),
|
|
'(구)SSG머니': t('transaction.constants.ssgMoney'),
|
|
'SSG은행계좌결제': t('transaction.constants.ssgBank'),
|
|
'계좌간편결제': t('transaction.constants.accountSimpleTransfer'),
|
|
'티머니페이': t('transaction.constants.tmoneyPay'),
|
|
};
|
|
|
|
return nameMap[name] || name;
|
|
};
|
|
|
|
const getServiceName = (serviceCode: string) => {
|
|
let serviceName = '';
|
|
for(let i=0;i<serviceCodes.length;i++){
|
|
if(serviceCodes[i].value === serviceCode){
|
|
serviceName = getLocalizedServiceCodeName(serviceCodes[i].name);
|
|
break;
|
|
}
|
|
}
|
|
return serviceName;
|
|
};
|
|
|
|
const getListItem = () => {
|
|
let rs = [];
|
|
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 }
|
|
key={ key }
|
|
tid={ items[i]?.tid }
|
|
mid={ items[i]?.mid }
|
|
statusCode={ items[i]?.statusCode }
|
|
installmentMonth={ items[i]?.installmentMonth }
|
|
serviceName={ serviceName }
|
|
serviceCode={ serviceCode }
|
|
serviceDetailName={ items[i]?.serviceDetailName }
|
|
goodsAmount={ items[i]?.goodsAmount }
|
|
|
|
approvalNumber={ items[i]?.approvalNumber }
|
|
amount={ items[i]?.amount }
|
|
customerName={ items[i]?.customerName }
|
|
issueNumber={ items[i]?.issueNumber }
|
|
paymentMethod={ items[i]?.paymentMethod }
|
|
processResult={ items[i]?.processResult }
|
|
transactionType={ items[i]?.transactionType }
|
|
transactionDateTime={ items[i]?.transactionDateTime }
|
|
|
|
transactionAmount={ items[i]?.transactionAmount }
|
|
deliveryStatus={ items[i]?.deliveryStatus }
|
|
settlementStatus={ items[i]?.settlementStatus }
|
|
cancelStatus={ items[i]?.cancelStatus }
|
|
|
|
billKey={ items[i]?.billKey }
|
|
orderNumber={ items[i]?.orderNumber }
|
|
|
|
setDetailData={ setDetailData }
|
|
></ListItem>
|
|
)
|
|
}
|
|
}
|
|
|
|
return rs;
|
|
};
|
|
|
|
return (
|
|
<>
|
|
<div className="date-group">
|
|
<div className="date-header">{ getStateDate() }</div>
|
|
{ getListItem() }
|
|
</div>
|
|
</>
|
|
);
|
|
}; |