- 구 알림톡 상세페이지 삭제
This commit is contained in:
@@ -1,111 +0,0 @@
|
|||||||
import { PATHS } from '@/shared/constants/paths';
|
|
||||||
import { useNavigate } from '@/shared/lib/hooks/use-navigate';
|
|
||||||
import { HeaderType } from '@/entities/common/model/types';
|
|
||||||
import {
|
|
||||||
useSetHeaderTitle,
|
|
||||||
useSetHeaderType,
|
|
||||||
useSetFooterMode,
|
|
||||||
useSetOnBack
|
|
||||||
} from '@/widgets/sub-layout/use-sub-layout';
|
|
||||||
import { useLocation } from 'react-router';
|
|
||||||
import { useEffect, useState } from 'react';
|
|
||||||
import { ExtensionAlimtalkDetailParams, ExtensionAlimtalkDetailResponse } from '@/entities/additional-service/model/alimtalk/types';
|
|
||||||
import { useExtensionAlimtalkDetailMutation } from '@/entities/additional-service/api/alimtalk/use-extansion-alimtalk-detail-mutation';
|
|
||||||
import moment from 'moment';
|
|
||||||
import { getAlimtalkAlimClText, getAlimtalkSendClTypeText, getAlimtalkSendTypeText, getAlimtalkServiceCodeText } from '@/entities/additional-service/model/alimtalk/constant';
|
|
||||||
import { useTranslation } from 'react-i18next';
|
|
||||||
|
|
||||||
export const AlimtalkDetailPage = () => {
|
|
||||||
const { navigate } = useNavigate();
|
|
||||||
const { t } = useTranslation();
|
|
||||||
const location = useLocation();
|
|
||||||
|
|
||||||
const tid = location.state.tid;
|
|
||||||
const mid = location.state.mid;
|
|
||||||
|
|
||||||
const [detail, setDetail] = useState<ExtensionAlimtalkDetailResponse>();
|
|
||||||
|
|
||||||
const { mutateAsync: extensionAlimtalkDetail } = useExtensionAlimtalkDetailMutation();
|
|
||||||
|
|
||||||
const callDetail = () => {
|
|
||||||
let params: ExtensionAlimtalkDetailParams = {
|
|
||||||
mid: mid,
|
|
||||||
tid: tid
|
|
||||||
};
|
|
||||||
|
|
||||||
extensionAlimtalkDetail(params).then((rs: ExtensionAlimtalkDetailResponse) => {
|
|
||||||
setDetail(rs);
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
useSetHeaderTitle(t('additionalService.alimtalk.detailTitle'));
|
|
||||||
useSetHeaderType(HeaderType.LeftArrow);
|
|
||||||
useSetFooterMode(false);
|
|
||||||
useSetOnBack(() => {
|
|
||||||
navigate(PATHS.additionalService.alimtalk.list);
|
|
||||||
});
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
callDetail();
|
|
||||||
}, []);
|
|
||||||
|
|
||||||
const getDate = (date?: string) => {
|
|
||||||
return (date)? moment(date, 'YYYYMMDDHHmmss').format('YYYY.MM.DD HH:mm:ss'): '';
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<main className="full-height">
|
|
||||||
<div className="tab-content">
|
|
||||||
<div className="tab-pane sub active">
|
|
||||||
<div className="pay-top">
|
|
||||||
<div className="num-amount">
|
|
||||||
<span className="amount">{ detail?.receiverName }</span>
|
|
||||||
</div>
|
|
||||||
<div className="num-store">{ detail?.companyName }</div>
|
|
||||||
<div className="num-day">{ getDate(detail?.sendDate) }</div>
|
|
||||||
</div>
|
|
||||||
<div className="detail-divider"></div>
|
|
||||||
<div className="pay-detail">
|
|
||||||
<div className="detail-title">{t('additionalService.alimtalk.transactionInfo')}</div>
|
|
||||||
<ul className="kv-list">
|
|
||||||
<li className="kv-row">
|
|
||||||
<span className="k">MID</span>
|
|
||||||
<span className="v">{ detail?.mid }</span>
|
|
||||||
</li>
|
|
||||||
<li className="kv-row">
|
|
||||||
<span className="k">TID</span>
|
|
||||||
<span className="v">{ detail?.tid }</span>
|
|
||||||
</li>
|
|
||||||
<li className="kv-row">
|
|
||||||
<span className="k">{t('additionalService.alimtalk.serviceName')}</span>
|
|
||||||
<span className="v">{ detail?.extensionServiceName }</span>
|
|
||||||
</li>
|
|
||||||
<li className="kv-row">
|
|
||||||
<span className="k">{t('additionalService.alimtalk.sendKind')}</span>
|
|
||||||
<span className="v">{ getAlimtalkSendTypeText(t)(detail?.sendType) }</span>
|
|
||||||
</li>
|
|
||||||
<li className="kv-row">
|
|
||||||
<span className="k">{t('additionalService.alimtalk.buyerName')}</span>
|
|
||||||
<span className="v">{detail?.receiverName }</span>
|
|
||||||
</li>
|
|
||||||
<li className="kv-row">
|
|
||||||
<span className="k">{t('additionalService.alimtalk.paymentService')}</span>
|
|
||||||
<span className="v">{ getAlimtalkServiceCodeText(t)(detail?.serviceCode) }</span>
|
|
||||||
</li>
|
|
||||||
<li className="kv-row">
|
|
||||||
<span className="k">{t('additionalService.alimtalk.notificationDivision')}</span>
|
|
||||||
<span className="v">{ getAlimtalkAlimClText(t)(detail?.alimCl) }</span>
|
|
||||||
</li>
|
|
||||||
<li className="kv-row">
|
|
||||||
<span className="k">{t('additionalService.alimtalk.sendDivision')}</span>
|
|
||||||
<span className="v">{ getAlimtalkSendClTypeText(t)(detail?.sendCl) }</span>
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</main>
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
Reference in New Issue
Block a user