108 lines
2.8 KiB
JavaScript
108 lines
2.8 KiB
JavaScript
import React, { Fragment, useCallback, useState } from 'react';
|
|
|
|
import { AnimatedPageWrapper } from '../../components/common/Layout'
|
|
import { CommonSearchBar } from '../../components/ServiceManage';
|
|
import { Title, FormWrapper } from '../../styles/Components';
|
|
import { authType } from '../../assets/data';
|
|
import { useModal, withAuth } from '../../hooks/hook';
|
|
import { CaliTable } from '../../components/common';
|
|
import tableInfo from '../../assets/data/pages/historyTable.json';
|
|
import useEnhancedCommonSearch from '../../hooks/useEnhancedCommonSearch';
|
|
import FrontPagination from '../../components/common/Pagination/FrontPagination';
|
|
import { INITIAL_CURRENT_PAGE, INITIAL_PAGE_LIMIT, INITIAL_PAGE_SIZE } from '../../assets/data/adminConstants';
|
|
import LogDetailModal from '../../components/common/modal/LogDetailModal';
|
|
|
|
const LogView = () => {
|
|
const [detailData, setDetailData] = useState({});
|
|
const [currentPage, setCurrentPage] = useState(INITIAL_CURRENT_PAGE);
|
|
const [displayData, setDisplayData] = useState([]);
|
|
|
|
const {
|
|
modalState,
|
|
handleModalView,
|
|
handleModalClose
|
|
} = useModal({
|
|
detail: 'hidden',
|
|
});
|
|
|
|
const {
|
|
config,
|
|
searchParams,
|
|
data: dataList,
|
|
handleSearch,
|
|
handleReset,
|
|
updateSearchParams,
|
|
loading
|
|
} = useEnhancedCommonSearch("historySearch");
|
|
|
|
const handleClientPageChange = useCallback((slicedData) => {
|
|
setDisplayData(slicedData);
|
|
}, []);
|
|
|
|
const handleAction = async (action, item = null) => {
|
|
switch (action) {
|
|
case "detail":
|
|
handleModalView('detail');
|
|
setDetailData(item.data);
|
|
break;
|
|
|
|
default:
|
|
break;
|
|
}
|
|
};
|
|
|
|
return (
|
|
<AnimatedPageWrapper>
|
|
<Title>사용 이력 조회</Title>
|
|
|
|
{/* 조회조건 */}
|
|
<FormWrapper>
|
|
<CommonSearchBar
|
|
config={config}
|
|
searchParams={searchParams}
|
|
onSearch={(newParams, executeSearch = true) => {
|
|
if (executeSearch) {
|
|
handleSearch(newParams);
|
|
} else {
|
|
updateSearchParams(newParams);
|
|
}
|
|
}}
|
|
onReset={handleReset}
|
|
/>
|
|
</FormWrapper>
|
|
|
|
{/* 조회테이블 */}
|
|
<CaliTable
|
|
columns={tableInfo.columns}
|
|
data={displayData}
|
|
onAction={(action, item) => handleAction(action, item)}
|
|
// refProp={tableRef}
|
|
loading={loading}
|
|
/>
|
|
|
|
{/* 페이징 */}
|
|
{dataList?.list &&
|
|
<FrontPagination
|
|
data={dataList.list}
|
|
itemsPerPage={INITIAL_PAGE_SIZE}
|
|
currentPage={currentPage}
|
|
setCurrentPage={setCurrentPage}
|
|
pageLimit={INITIAL_PAGE_LIMIT}
|
|
onPageChange={handleClientPageChange}
|
|
/>}
|
|
|
|
{/* 상세 */}
|
|
<LogDetailModal
|
|
viewMode="data"
|
|
detailView={modalState.detailModal}
|
|
handleDetailView={() => handleModalClose('detail')}
|
|
detailData={detailData}
|
|
title="상세정보"
|
|
/>
|
|
|
|
</AnimatedPageWrapper>
|
|
);
|
|
};
|
|
|
|
export default withAuth(authType.adminLogSearchRead)(LogView);
|