/* * @Author: code4eat awesomedema@gmail.com * @Date: 2023-01-04 14:12:31 * @LastEditors: code4eat awesomedema@gmail.com * @LastEditTime: 2023-04-19 15:07:25 * @FilePath: /BudgetManaSystem/src/pages/budgetMana/oneBatch/index.tsx * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE */ import BMSPagecontainer from '@/components/BMSPageContainer' import { BMSTable } from '@/components/BMSTable'; import { getComputeDate } from '@/pages/Home/service'; import { ActionType, ProColumns } from '@ant-design/pro-components'; import { Breadcrumb} from 'antd'; import { useEffect, useRef, useState } from 'react'; import { getData, getRedirReportData } from './service'; import './style.less'; import { create, all, string } from 'mathjs' import { useParams } from '@umijs/max'; const config = { number: 'number', precision: 14 } const math = create(all, config as any); // const {search} = location; // const urlparams = new URLSearchParams(search); // const urlReportCode = urlparams.get('reportCode') as string const ReportTemplate = () => { const { reportCode:urlReportCode } = useParams(); const [tableColumn, set_tableColumn] = useState([]); const [currentComputeDate, set_currentComputeDate] = useState(); const [breadCrumbList,set_breadCrumbList] = useState([]); const [tableDataFilterParams, set_tableDataFilterParams] = useState({ reportCode:urlReportCode }); const tableRef = useRef(); const [tableH, set_tableH] = useState(0); const [step,set_step] = useState(0); const reportJumphandle = (reportData:any)=>{ console.log({reportData}); let parameter:{[key:string]:any} = {}; const {redirectParameter = undefined} = reportData; const _step = step + 1; if(redirectParameter){ const tempArr = redirectParameter.split('|'); tempArr.forEach((element:string) => { parameter[`${element}`] = reportData[`${element}`] }); } set_breadCrumbList( [...breadCrumbList, { index:_step, name:reportData[`report_name`], params:{ reportCode:reportData.redirectReportCode, parameter } } ] ); set_step(_step); set_tableDataFilterParams({...tableDataFilterParams,reportCode:reportData.redirectReportCode,parameter}) } const getTableData = async (params: any, sort: any, filter: any) => { const {reportCode,parameter} = params; let resp:any = undefined; if(step != 0){ //报表跳转 resp = await getRedirReportData( reportCode, parameter ); } if(step == 0){ //首次获取表格数据 resp = await getData( reportCode, parameter ); } if (resp) { const { title,data:assignmentData } = resp; const columns = title.map((item: any,index:number) => { return { title: item.name, dataIndex: `${item.columnName}`, key: `${item.columnName}`, width: 100, render:(_:any,record:any)=>{ if(item.redirect){ return reportJumphandle({...item,...record})}>{_} } return {_} } } }); set_tableColumn([ ...columns]); const data = assignmentData.map((item: any) => { let rowData: { [key: string]: any } = {}; for (let i = 0; i < item.length; i++) { rowData[`${title[i].columnName}`] = item[i].value } return { ...item, ...rowData,id:Math.random(), columns } }); return { data, success: true } } return [] } const getCurrentComputeDate = async () => { const resp = await getComputeDate(); set_tableDataFilterParams({...tableDataFilterParams,parameter:{...tableDataFilterParams.parameter,compute_date:resp}}); set_currentComputeDate(resp); } const handleResize = (e: any) => { const wH = e.target.innerHeight; const tableHeight = wH - 290; set_tableH(tableHeight); } function doResize() { setTimeout(() => { const ev: any = new Event('resize'); window.dispatchEvent(ev); }, 0) } //面包屑跳转 const switchHandle = (data:any)=>{ set_step(data.index); const _breadCrumbList = breadCrumbList.filter((a:any)=>a.index<=data.index); set_breadCrumbList([..._breadCrumbList]); set_tableDataFilterParams({...tableDataFilterParams,...data.params}); } useEffect(() => { // 在这里处理路由参数变化的逻辑 set_tableDataFilterParams({reportCode:urlReportCode,parameter:{compute_date:currentComputeDate}}); set_breadCrumbList([{ name:'首页', params:{reportCode:urlReportCode,parameter:{compute_date:currentComputeDate}} }]) }, [urlReportCode]); useEffect(() => { getCurrentComputeDate(); window.addEventListener('resize', (e) => handleResize(e)) //监听窗口大小改变 doResize(); return () => { window.removeEventListener('resize', (e) => handleResize(e)) } }, []) return (
{ breadCrumbList.length>1&&breadCrumbList.map((item:any,index:number)=>{ return ( {index != step && switchHandle(item)}}>{item.name}{index == breadCrumbList.length - 1?'':' / '} ) }) }
{currentComputeDate&& getTableData(params, sort, filter)} />}
) } export default ReportTemplate