feat(): 统计报表开发

test
李神峰 2024-12-23 17:52:42 +08:00
parent 63b98c549c
commit 499b122591
3 changed files with 163 additions and 66 deletions

View File

@ -110,6 +110,18 @@ const apiurl = {
sbgzjl: { sbgzjl: {
page: service_ykz + '/deviceFailureRecord/page', page: service_ykz + '/deviceFailureRecord/page',
export:service_ykz + '/deviceFailureRecord/export' export:service_ykz + '/deviceFailureRecord/export'
},
tjbb: {
swrbb: service_ykz + '/statistics/sdSwRb',//水位日报表
swrbbExport: service_ykz + "/statistics/sdSwRb/export",//水位日报表导出
swnbb: service_ykz + '/statistics/rjswNb',//水位年报表上方表格
swnbbSummary:service_ykz + '/statistics/rjswNb/stat',//水位年报表下方总结栏
swnbbExport: service_ykz + '/statistics/rjswNb/export',//水位年报表导出
jyrbb: service_ykz + '/statistics/sdJyRb',//降雨日报表
jyrbbExport: service_ykz + '/statistics/sdJyRb/export',//降雨日报表导出
jynbb: service_ykz + '/statistics/rjyNb',//降雨年报表上方表格
jynbbExport:service_ykz + '/statistics/rjyNb/export',//降雨年报表下方总结栏
jynbbSummary: service_ykz + '/statistics/rjyNb/stat',//降雨年报表导出
} }
}, },
systemM: { systemM: {

View File

@ -4,33 +4,35 @@ import ToolBar from './toolbar';
import apiurl from '../../../../service/apiurl'; import apiurl from '../../../../service/apiurl';
import usePageTable from '../../../../components/crud/usePageTable2'; import usePageTable from '../../../../components/crud/usePageTable2';
import { createCrudService } from '../../../../components/crud/_'; import { createCrudService } from '../../../../components/crud/_';
import { httppost5 } from '../../../../utils/request'; import { httppost5, httppost2 } from '../../../../utils/request';
import { exportFile } from '../../../../utils/tools.js'; import { exportFile } from '../../../../utils/tools.js';
const url = "http://223.75.53.141:9102/test.by-lyf.tmp" const url = "http://223.75.53.141:9102/test.by-lyf.tmp"
const Page = () => { const Page = () => {
const [searchVal, setSearchVal] = useState(false) const [searchVal, setSearchVal] = useState(false)
const [requsetUrlObj, setRequsetUrlObj] = useState({})
const requsetUrlObjRef = useRef(null)
requsetUrlObjRef.current = requsetUrlObj;
const timeColumns = [ const timeColumns = [
{ title: '日期', key: 'date', dataIndex: 'date', width: 120, align: "center", fixed: "left" }, { title: '日期', key: 'date', dataIndex: 'date', width: 120, align: "center", fixed: "left" },
...Array(16).fill(0).map((item, index) => ({ ...Array(16).fill(0).map((item, index) => ({
title: `${index + 9}`, title: `${index + 9}`,
key: `drpH${index+9}`, key: `rzH${index + 9}`,
dataIndex: `drpH${index+9}`, dataIndex: `rzH${index + 9}`,
width: 80, width: 80,
align: "center", align: "center",
sorter: (a, b) => a[`drpH${index+9}`] - b[`drpH${index+9}`] sorter: (a, b) => a[`rzH${index + 9}`] - b[`rzH${index + 9}`]
})), })),
...Array(8).fill(0).map((item, index) => ({ ...Array(8).fill(0).map((item, index) => ({
title: `${index + 1}`, title: `${index + 1}`,
key: `drpH${index+1}`, key: `rzH${index + 1}`,
dataIndex: `drpH${index+1}`, dataIndex: `rzH${index + 1}`,
width: 80, width: 80,
align: "center", align: "center",
sorter: (a, b) => a[`drpH${index+1}`] - b[`drpH${index+1}`] sorter: (a, b) => a[`rzH${index + 1}`] - b[`rzH${index + 1}`]
})), })),
{ title: '日累计', key: 'drpD', dataIndex: 'drpD', width: 100, align: "center",sorter: (a, b) => a.drpD - b.drpD, }, { title: '平均', key: 'rzAvg ', dataIndex: 'rzAvg', width: 100, align: "center", sorter: (a, b) => a.rzAvg - b.rzAvg},
]; ];
const dayColumns = [ const dayColumns = [
@ -54,27 +56,101 @@ const Page = () => {
})) }))
]; ];
const newTimeColumns = useMemo(() => {
const changeColumns = JSON.parse(JSON.stringify(timeColumns));
changeColumns[changeColumns.length - 1] = {
title: '日累计',
key: 'drpD',
dataIndex: 'drpD',
width: 100,
align: 'center',
sorter: (a, b) => a.drpD - b.drpD
}
const cols = [changeColumns[0]];
changeColumns.forEach((item, i) => {
if (i > 0) {
if (i < 16) {
item.sorter = (a,b) => a[`drpH${i + 9}`] - b[`drpH${i + 9}`]
} else {
item.sorter = (a,b) => a[`drpH${i + 1}`] - b[`drpH${i + 1}`]
}
cols.push({
...item,
key: item.key.replace('rz', 'drp'),
dataIndex: item.dataIndex.replace('rz', 'drp'),
})
}
})
return searchVal.type == 1 ? cols :timeColumns
}, [searchVal])
// const newYearColumns = useMemo(() => {
// return searchVal.type == 1 ? yearColumns.map(item => ({ ...item, key: item.key.replace('rz', 'drp'), dataIndex: item.dataIndex.replace('rz', 'drp') })) : yearColumns
// }, [searchVal])
const width = useMemo(() => { const width = useMemo(() => {
let columns = searchVal.type1 == 0 ? timeColumns : searchVal.type1 == 1 ? dayColumns : yearColumns; let columns = searchVal.type1 == 0 ? timeColumns : searchVal.type1 == 1 ? yearColumns : yearColumns;
return columns.reduce((total, cur) => total + (cur.width), 0) return columns.reduce((total, cur) => total + (cur.width), 0)
}, [searchVal.type1]); }, [searchVal]);
const { tableProps, search, refresh } = usePageTable(createCrudService(apiurl.sbwh.whfabz.page).find_noCode);
const [data, setData] = useState([])
const getData = async (params) => {
try {
const res = await httppost2(requsetUrlObjRef.current?.page, params)
if (res.code == 200) {
setData(res.data)
}
} catch (error) {
console.log(error);
}
}
// 导出 // 导出
const exportExcel = () => { const exportExcel = () => {
let params = { let params = {
...searchVal, ...searchVal,
} }
httppost5(apiurl.pxjh.export, params).then(res => { httppost5(requsetUrlObjRef.current?.export, params).then(res => {
exportFile(`统计报表.xlsx`, res.data) exportFile(`统计报表.xlsx`, res.data)
}) })
} }
useEffect(()=>{
const params = { const getUrl = (name, type) => {
search: { let urlObj;
...searchVal, let obj = {
page: type == 0 ? apiurl.gcyx.tjbb.swrbb : apiurl.gcyx.tjbb.swnbb,
export: type == 0 ? apiurl.gcyx.tjbb.swrbbExport : apiurl.gcyx.tjbb.swnbbExport
}
switch (name) {
case 0:
urlObj = obj
break;
case 1:
urlObj = {
page: type == 0 ? apiurl.gcyx.tjbb.jyrbb : apiurl.gcyx.tjbb.jynbb,
export: type == 0 ? apiurl.gcyx.tjbb.jyrbbExport : apiurl.gcyx.tjbb.jynbbExport
}
break;
case 2:
urlObj = obj
break;
case 3:
urlObj = obj
break;
default:
break;
}
return urlObj
}
useEffect(() => {
if (searchVal) {
// const params = searchVal.type != 1 ? searchVal : { start: searchVal.dateRangeSo.start, end: searchVal.dateRangeSo.end };
const params = { ...searchVal }
setRequsetUrlObj(getUrl(searchVal.type, searchVal.type1))
requsetUrlObjRef.current = getUrl(searchVal.type, searchVal.type1)
getData(params)
} }
};
search(params)
}, [searchVal]) }, [searchVal])
@ -96,9 +172,10 @@ const Page = () => {
<div style={{ textAlign: "right" }}>单位/s</div> <div style={{ textAlign: "right" }}>单位/s</div>
</> </>
)} )}
columns={searchVal.type1 == 0 ? timeColumns : searchVal.type1 == 1 ? dayColumns :yearColumns} columns={searchVal.type1 == 0 ? newTimeColumns : searchVal.type1 == 1 ? yearColumns : yearColumns}
rowKey="inx" rowKey="date"
{...tableProps} dataSource={data}
pagination={false}
scroll={{ x: width, y: "calc( 100vh - 400px )" }} /> scroll={{ x: width, y: "calc( 100vh - 400px )" }} />
</div> </div>
</div> </div>

View File

@ -5,7 +5,8 @@ import NormalSelect from '../../../../components/Form/NormalSelect';
import moment from 'moment'; import moment from 'moment';
const { RangePicker } = DatePicker; const { RangePicker } = DatePicker;
const ToolBar = ({ setSearchVal, onSave, storeData, exportFile1 }) => { const ToolBar = ({ setSearchVal, onSave, storeData, exportFile1 }) => {
const start = moment().subtract(7,'days').format('YYYY-MM-DD 00:00:00')
const end = moment().format('YYYY-MM-DD 23:59:59')
const types = [ const types = [
{ {
label: "闸后流量", label: "闸后流量",
@ -30,13 +31,13 @@ const ToolBar = ({ setSearchVal, onSave, storeData, exportFile1 }) => {
label: "日报表", label: "日报表",
value: 0 value: 0
}, },
{ // {
label: "月报表", // label: "月报表",
value: 1 // value: 1
}, // },
{ {
label: "年报表", label: "年报表",
value: 2 value: 1
}, },
] ]
@ -44,29 +45,36 @@ const ToolBar = ({ setSearchVal, onSave, storeData, exportFile1 }) => {
const [form] = Form.useForm(); const [form] = Form.useForm();
const onFinish = (values) => { const onFinish = (values) => {
let dateSo; let dateRangeSo;
if (values.tm) { if (values.tm) {
dateSo = { dateRangeSo = timeType == 0 ? {
start: moment(values.tm[0]).format('YYYY-MM-DD HH:mm:ss'), start: moment(values.tm[0]).format('YYYY-MM-DD HH:mm:ss'),
end: moment(values.tm[1]).format('YYYY-MM-DD HH:mm:ss') end: moment(values.tm[1]).format('YYYY-MM-DD HH:mm:ss')
} } : {year: moment(values.tm).format('YYYY')}
} }
delete values.tm delete values.tm
setSearchVal({...values, dateSo}); const params = timeType == 0 ? dateRangeSo : undefined;
setSearchVal({
...values,
dateRangeSo: params,
year: timeType == 1 ? dateRangeSo.year : undefined
});
} }
const onValuesChange = (val) => { const onValuesChange = (val) => {
if ('type1' in val) { if ('type1' in val) {
setTimeType(val.type1) setTimeType(val.type1)
val.type1 == 1 ? form.setFieldValue('tm', moment()) :
form.setFieldValue('tm',[moment(start),moment(end)])
} }
} }
useEffect(() => { useEffect(() => {
form.setFieldValue('tm',[moment(start),moment(end)])
form.setFieldValue('type1', 0) form.setFieldValue('type1', 0)
setSearchVal({type1:0}) form.setFieldValue('type', 0)
setSearchVal({type1:0,type:0,dateRangeSo:{start:start,end:end}})
}, []) }, [])
return ( return (
<> <>
<div style={{display:'flex',justifyContent:'space-between'}}> <div style={{display:'flex',justifyContent:'space-between'}}>
@ -77,7 +85,7 @@ const ToolBar = ({ setSearchVal, onSave, storeData, exportFile1 }) => {
onFinish={onFinish} onFinish={onFinish}
onValuesChange={onValuesChange} onValuesChange={onValuesChange}
> >
<Form.Item label="统计项目" name="name"> <Form.Item label="统计项目" name="type">
<NormalSelect allowClear style={{ width: '150px' }} options={types} /> <NormalSelect allowClear style={{ width: '150px' }} options={types} />
</Form.Item> </Form.Item>
<Form.Item label="统计维度" name="type1"> <Form.Item label="统计维度" name="type1">
@ -93,7 +101,7 @@ const ToolBar = ({ setSearchVal, onSave, storeData, exportFile1 }) => {
<DatePicker <DatePicker
allowClear allowClear
style={{ width: "150px" }} style={{ width: "150px" }}
picker="month"/> : picker="year"/> :
<DatePicker <DatePicker
allowClear allowClear
style={{ width: "150px" }} style={{ width: "150px" }}