import React, { useEffect, useState } from 'react';
|
import { Typography, Card, message } from 'antd';
|
import LawSearchForm from '../components/law/LawSearchForm';
|
import LawList from '../components/law/LawList';
|
import PaginationBar from '../components/common/PaginationBar';
|
import { fetchLawList } from '../services/lawService';
|
|
const { Title } = Typography;
|
|
const LawSearchPage = () => {
|
const [loading, setLoading] = useState(false);
|
const [queryParams, setQueryParams] = useState({
|
keyword: '',
|
page: 1,
|
pageSize: 10,
|
});
|
const [data, setData] = useState({
|
list: [],
|
pageInfo: { page: 1, pageSize: 10, total: 0 },
|
});
|
|
const loadData = async (params = queryParams) => {
|
setLoading(true);
|
try {
|
const res = await fetchLawList(params);
|
setData(res);
|
} catch (e) {
|
console.error(e);
|
message.error('加载法律法规列表失败');
|
} finally {
|
setLoading(false);
|
}
|
};
|
|
useEffect(() => {
|
loadData();
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
}, []);
|
|
const handleSearch = (values) => {
|
const newParams = {
|
...queryParams,
|
...values,
|
page: 1,
|
};
|
setQueryParams(newParams);
|
loadData(newParams);
|
};
|
|
const handlePageChange = (page, pageSize) => {
|
const newParams = { ...queryParams, page, pageSize };
|
setQueryParams(newParams);
|
loadData(newParams);
|
};
|
|
return (
|
<div>
|
<Title level={3}>法律法规查询</Title>
|
<Card style={{ marginBottom: 16 }} title="查询条件">
|
<LawSearchForm onSearch={handleSearch} loading={loading} />
|
</Card>
|
|
<Card
|
title={`查询结果（共 ${data.pageInfo.total} 条）`}
|
loading={loading}
|
>
|
<LawList list={data.list} />
|
<PaginationBar
|
page={data.pageInfo.page}
|
pageSize={data.pageInfo.pageSize}
|
total={data.pageInfo.total}
|
onChange={handlePageChange}
|
/>
|
</Card>
|
</div>
|
);
|
};
|
|
export default LawSearchPage;
|
