현금영수증 리스트
This commit is contained in:
focp212@naver.com
@@ -22,9 +22,13 @@ import {
|
||||
SettlementPaymentMethod,
|
||||
SettlementsHistoryContent,
|
||||
ListDateGroupProps,
|
||||
SettlementsTransactionListContent
|
||||
SettlementsTransactionListContent,
|
||||
SettlementsHistoryParams,
|
||||
SettlementsHistoryResponse,
|
||||
SettlementsHistorySummaryParams,
|
||||
SettlementsHistorySummaryResponse
|
||||
} from '../model/types';
|
||||
import { SortTypeKeys } from '@/entities/common/model/types';
|
||||
import { DefaultRequestPagination, SortTypeKeys } from '@/entities/common/model/types';
|
||||
import { useStore } from '@/shared/model/store';
|
||||
|
||||
export interface ListWrapProps {
|
||||
@@ -40,14 +44,14 @@ export const ListWrap = ({
|
||||
const userMid = useStore.getState().UserStore.mid;
|
||||
|
||||
const [sortType, setSortType] = useState<SortTypeKeys>(SortTypeKeys.LATEST);
|
||||
const [settlementDateListItems, setSettlementDateListItems] = useState<Record<string, Array<SettlementsHistoryContent>>>({});
|
||||
const [transactionDatelistItems, setTransactionDateListItems] = useState<Record<string, Array<SettlementsTransactionListContent>>>({});
|
||||
const [settlementDateListItems, setSettlementDateListItems] = useState<Array<SettlementsHistoryContent>>([]);
|
||||
const [transactionDatelistItems, setTransactionDateListItems] = useState<Array<SettlementsTransactionListContent>>([]);
|
||||
const [filterOn, setFilterOn] = useState<boolean>(false);
|
||||
const [pageParam, setPageParam] = useState(DEFAULT_PAGE_PARAM);
|
||||
const [pageParam, setPageParam] = useState<DefaultRequestPagination>(DEFAULT_PAGE_PARAM);
|
||||
const [mid, setMid] = useState<string>(userMid);
|
||||
const [periodType, setPeriodType] = useState<SettlementPeriodType>(SettlementPeriodType.SETTLEMENT_DATE);
|
||||
const [startDate, setStartDate] = useState(startDateFromCalendar? moment(startDateFromCalendar).format('YYYY-MM-DD'): moment().format('YYYY-MM-DD'));
|
||||
const [endDate, setEndDate] = useState(endDateFromCalendar? moment(endDateFromCalendar).format('YYYY-MM-DD'): moment().format('YYYY-MM-DD'));
|
||||
const [startDate, setStartDate] = useState(startDateFromCalendar? moment(startDateFromCalendar).format('YYYYMMDD'): moment().format('YYYYMMDD'));
|
||||
const [endDate, setEndDate] = useState(endDateFromCalendar? moment(endDateFromCalendar).format('YYYYMMDD'): moment().format('YYYYMMDD'));
|
||||
const [paymentMethod, setPaymentMethod] = useState<SettlementPaymentMethod>(SettlementPaymentMethod.ALL);
|
||||
|
||||
const [settlementAmount, setSettlementAmount] = useState<number>();
|
||||
@@ -61,7 +65,7 @@ export const ListWrap = ({
|
||||
const [authFeeAmount, setAuthFeeAmount] = useState<number>();
|
||||
const [vatAmount, setVatAmount] = useState<number>();
|
||||
const [preSettlementCancelOffset, setPreSettlementCancelOffset] = useState<number>();
|
||||
|
||||
const [transactionIds, setTransactionIds] = useState<Array<string>>([]);
|
||||
const [isOpenSummary, setIsOpenSummary] = useState<boolean>(false);
|
||||
|
||||
const { mutateAsync: settlementsHistory } = useSettlementsHistoryMutation();
|
||||
@@ -83,24 +87,28 @@ export const ListWrap = ({
|
||||
sortType?: SortTypeKeys,
|
||||
val?: string
|
||||
}) => {
|
||||
let listSummaryParams = {
|
||||
let listSummaryParams: SettlementsHistorySummaryParams = {
|
||||
mid: mid,
|
||||
periodType: periodType,
|
||||
startDate: startDate,
|
||||
endDate: endDate,
|
||||
paymentMethod: paymentMethod,
|
||||
};
|
||||
pageParam.sortType = (option?.sortType)? option.sortType: sortType;
|
||||
setPageParam(pageParam);
|
||||
|
||||
let listParams = {
|
||||
let listParams: SettlementsHistoryParams = {
|
||||
...listSummaryParams,
|
||||
...{pagination: pageParam}
|
||||
...{
|
||||
page: pageParam
|
||||
}
|
||||
};
|
||||
settlementsHistory(listParams).then((rs) => {
|
||||
setSettlementDateListItems(assembleData(rs.content));
|
||||
if(listParams.page){
|
||||
listParams.page.sortType = (option?.sortType)? option.sortType: sortType;
|
||||
setPageParam(listParams.page);
|
||||
}
|
||||
|
||||
settlementsHistory(listParams).then((rs: SettlementsHistoryResponse) => {
|
||||
setSettlementDateListItems(rs.content);
|
||||
});
|
||||
settlementsHistorySummary(listSummaryParams).then((rs) => {
|
||||
settlementsHistorySummary(listSummaryParams).then((rs: SettlementsHistorySummaryResponse) => {
|
||||
setSettlementAmount(rs.settlementAmount);
|
||||
setTransactionAmount(rs.transactionAmount);
|
||||
setPgFeeAmount(rs.pgFeeAmount);
|
||||
@@ -113,27 +121,28 @@ export const ListWrap = ({
|
||||
sortType?: SortTypeKeys,
|
||||
val?: string
|
||||
}) => {
|
||||
pageParam.sortType = (option?.sortType)? option.sortType: sortType;
|
||||
setPageParam(pageParam);
|
||||
let params = {
|
||||
mid: mid,
|
||||
periodType: periodType,
|
||||
startDate: startDate,
|
||||
endDate: endDate,
|
||||
paymentMethod: paymentMethod,
|
||||
pagination: pageParam
|
||||
page: pageParam
|
||||
};
|
||||
|
||||
let summaryParams = {
|
||||
...params,
|
||||
transactionIds: [
|
||||
"TXN_20250608_001",
|
||||
"TXN_20250608_002"
|
||||
]
|
||||
...{
|
||||
transactionIds: transactionIds
|
||||
}
|
||||
};
|
||||
|
||||
if(params.page){
|
||||
params.page.sortType = (option?.sortType)? option.sortType: sortType;
|
||||
setPageParam(params.page);
|
||||
}
|
||||
|
||||
settlementsTransactionList(params).then((rs) => {
|
||||
setTransactionDateListItems(assembleData(rs.content));
|
||||
setTransactionDateListItems(rs.content);
|
||||
});
|
||||
settlementsTransactionSummary(summaryParams).then((rs) => {
|
||||
setSettlementAmount(rs.settlementAmount);
|
||||
@@ -145,22 +154,7 @@ export const ListWrap = ({
|
||||
setPreSettlementCancelOffset(rs.preSettlementCancelOffset);
|
||||
});
|
||||
};
|
||||
|
||||
const assembleData = (content: Array<SettlementsHistoryContent>) => {
|
||||
let data: any = {};
|
||||
if(content && content.length > 0){
|
||||
for(let i=0;i<content?.length;i++){
|
||||
let groupDate = moment(content[i]?.settlementDate).format('YYYYMMDD');
|
||||
if(!!groupDate && !data.hasOwnProperty(groupDate)){
|
||||
data[groupDate] = [];
|
||||
}
|
||||
if(!!groupDate && data.hasOwnProperty(groupDate)){
|
||||
data[groupDate].push(content[i]);
|
||||
}
|
||||
}
|
||||
}
|
||||
return data;
|
||||
};
|
||||
|
||||
const onClickToSort = (sort: SortTypeKeys) => {
|
||||
setSortType(sort);
|
||||
if(periodType === SettlementPeriodType.SETTLEMENT_DATE){
|
||||
@@ -185,40 +179,111 @@ export const ListWrap = ({
|
||||
}
|
||||
}
|
||||
};
|
||||
useEffect(() => {
|
||||
setTransactionIds([
|
||||
'TXN_20250608_001',
|
||||
'TXN_20250608_002'
|
||||
]);
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
callList();
|
||||
}, [periodType]);
|
||||
|
||||
const getSettlementDateListDateGroup = () => {
|
||||
let rs = [];
|
||||
if(Object.keys(settlementDateListItems).length > 0){
|
||||
for (const [key, value] of Object.entries(settlementDateListItems)) {
|
||||
rs.push(
|
||||
<ListDateGroup
|
||||
key={ key }
|
||||
periodType={ periodType }
|
||||
date={ key }
|
||||
items={ value }
|
||||
></ListDateGroup>
|
||||
);
|
||||
let date = '';
|
||||
let list: Array<SettlementsHistoryContent> = [];
|
||||
|
||||
if(settlementDateListItems){
|
||||
|
||||
}
|
||||
for(let i=0;i<settlementDateListItems.length;i++){
|
||||
let listItem = settlementDateListItems[i];
|
||||
if(!!listItem){
|
||||
let settlementDateTime = listItem?.settlementDate;
|
||||
let settlementDate = settlementDateTime?.substr(0, 8);
|
||||
|
||||
if(settlementDateListItems[i] && settlementDate){
|
||||
if(i === 0){
|
||||
date = settlementDate;
|
||||
}
|
||||
if(date !== settlementDate){
|
||||
date = settlementDate;
|
||||
if(list.length > 0){
|
||||
rs.push(
|
||||
<ListDateGroup
|
||||
key={ date + '-' + i }
|
||||
periodType={ periodType }
|
||||
date={ date }
|
||||
items={ list }
|
||||
></ListDateGroup>
|
||||
);
|
||||
}
|
||||
list = [];
|
||||
}
|
||||
list.push(listItem);
|
||||
}
|
||||
}
|
||||
}
|
||||
if(list.length > 0){
|
||||
rs.push(
|
||||
<ListDateGroup
|
||||
key={ date + '-last' }
|
||||
periodType={ periodType }
|
||||
date={ date }
|
||||
items={ list }
|
||||
></ListDateGroup>
|
||||
);
|
||||
}
|
||||
|
||||
return rs;
|
||||
};
|
||||
const getTransactionDateListDateGroup = () => {
|
||||
let rs = [];
|
||||
if(Object.keys(transactionDatelistItems).length > 0){
|
||||
for (const [key, value] of Object.entries(transactionDatelistItems)) {
|
||||
rs.push(
|
||||
<ListDateGroup
|
||||
key={ key }
|
||||
periodType={ periodType }
|
||||
date={ key }
|
||||
items={ value }
|
||||
></ListDateGroup>
|
||||
);
|
||||
let date = '';
|
||||
let list: Array<SettlementsTransactionListContent> = [];
|
||||
|
||||
for(let i=0;i<transactionDatelistItems.length;i++){
|
||||
let listItem = transactionDatelistItems[i];
|
||||
if(!!listItem){
|
||||
let settlementDateTime = listItem.settlementDate;
|
||||
let settlementDate = settlementDateTime?.substr(0, 8);
|
||||
|
||||
if(settlementDate){
|
||||
if(i === 0){
|
||||
date = settlementDate;
|
||||
}
|
||||
if(date !== settlementDate){
|
||||
date = settlementDate;
|
||||
if(list.length > 0){
|
||||
rs.push(
|
||||
<ListDateGroup
|
||||
key={ date + '-' + i }
|
||||
periodType={ periodType }
|
||||
date={ date }
|
||||
items={ list }
|
||||
></ListDateGroup>
|
||||
);
|
||||
}
|
||||
list = [];
|
||||
}
|
||||
list.push(listItem);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
if(list.length > 0){
|
||||
rs.push(
|
||||
<ListDateGroup
|
||||
key={ date + '-last' }
|
||||
periodType={ periodType }
|
||||
date={ date }
|
||||
items={ list }
|
||||
></ListDateGroup>
|
||||
);
|
||||
}
|
||||
|
||||
return rs;
|
||||
};
|
||||
const onClickToOpenFilter = () => {
|
||||
|
||||
Reference in New Issue
Block a user