|
@@ -2,7 +2,7 @@
|
|
* @Author: code4eat awesomedema@gmail.com
|
|
* @Author: code4eat awesomedema@gmail.com
|
|
* @Date: 2023-01-04 14:12:31
|
|
* @Date: 2023-01-04 14:12:31
|
|
* @LastEditors: code4eat awesomedema@gmail.com
|
|
* @LastEditors: code4eat awesomedema@gmail.com
|
|
- * @LastEditTime: 2023-04-19 15:07:25
|
|
|
|
|
|
+ * @LastEditTime: 2023-04-19 18:44:11
|
|
* @FilePath: /BudgetManaSystem/src/pages/budgetMana/oneBatch/index.tsx
|
|
* @FilePath: /BudgetManaSystem/src/pages/budgetMana/oneBatch/index.tsx
|
|
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
|
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
|
|
*/
|
|
*/
|
|
@@ -12,7 +12,7 @@ import BMSPagecontainer from '@/components/BMSPageContainer'
|
|
import { BMSTable } from '@/components/BMSTable';
|
|
import { BMSTable } from '@/components/BMSTable';
|
|
import { getComputeDate } from '@/pages/Home/service';
|
|
import { getComputeDate } from '@/pages/Home/service';
|
|
import { ActionType, ProColumns } from '@ant-design/pro-components';
|
|
import { ActionType, ProColumns } from '@ant-design/pro-components';
|
|
-import { Breadcrumb} from 'antd';
|
|
|
|
|
|
+import { Space, Dropdown, MenuProps } from 'antd';
|
|
import { useEffect, useRef, useState } from 'react';
|
|
import { useEffect, useRef, useState } from 'react';
|
|
import { getData, getRedirReportData } from './service';
|
|
import { getData, getRedirReportData } from './service';
|
|
|
|
|
|
@@ -22,6 +22,7 @@ import './style.less';
|
|
|
|
|
|
import { create, all, string } from 'mathjs'
|
|
import { create, all, string } from 'mathjs'
|
|
import { useParams } from '@umijs/max';
|
|
import { useParams } from '@umijs/max';
|
|
|
|
+import { DownOutlined } from '@ant-design/icons';
|
|
|
|
|
|
const config = {
|
|
const config = {
|
|
number: 'number',
|
|
number: 'number',
|
|
@@ -38,105 +39,130 @@ const math = create(all, config as any);
|
|
const ReportTemplate = () => {
|
|
const ReportTemplate = () => {
|
|
|
|
|
|
|
|
|
|
- const { reportCode:urlReportCode } = useParams();
|
|
|
|
|
|
+ const { reportCode: urlReportCode } = useParams();
|
|
|
|
|
|
const [tableColumn, set_tableColumn] = useState<ProColumns[] | any[]>([]);
|
|
const [tableColumn, set_tableColumn] = useState<ProColumns[] | any[]>([]);
|
|
|
|
|
|
const [currentComputeDate, set_currentComputeDate] = useState<string | undefined>();
|
|
const [currentComputeDate, set_currentComputeDate] = useState<string | undefined>();
|
|
-
|
|
|
|
- const [breadCrumbList,set_breadCrumbList] = useState<any[]>([]);
|
|
|
|
|
|
|
|
- const [tableDataFilterParams, set_tableDataFilterParams] = useState<any | undefined>({ reportCode:urlReportCode });
|
|
|
|
|
|
+ const [breadCrumbList, set_breadCrumbList] = useState<any[]>([]);
|
|
|
|
+
|
|
|
|
+ const [tableDataFilterParams, set_tableDataFilterParams] = useState<any | undefined>({ reportCode: urlReportCode });
|
|
|
|
|
|
const tableRef = useRef<ActionType>();
|
|
const tableRef = useRef<ActionType>();
|
|
|
|
|
|
const [tableH, set_tableH] = useState(0);
|
|
const [tableH, set_tableH] = useState(0);
|
|
|
|
|
|
- const [step,set_step] = 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 reportJumphandle = (reportData: any) => {
|
|
|
|
+ console.log({ reportData });
|
|
|
|
+ let parameter: { [key: string]: any } = {};
|
|
|
|
+ const { redirectParameter = undefined } = reportData;
|
|
const _step = step + 1;
|
|
const _step = step + 1;
|
|
|
|
|
|
- if(redirectParameter){
|
|
|
|
- const tempArr = redirectParameter.split('|');
|
|
|
|
- tempArr.forEach((element:string) => {
|
|
|
|
- parameter[`${element}`] = reportData[`${element}`]
|
|
|
|
- });
|
|
|
|
|
|
+ if (redirectParameter) {
|
|
|
|
+ const tempArr = redirectParameter.split('|');
|
|
|
|
+ tempArr.forEach((element: string) => {
|
|
|
|
+ parameter[`${element}`] = reportData[`${element}`]
|
|
|
|
+ });
|
|
}
|
|
}
|
|
|
|
|
|
set_breadCrumbList(
|
|
set_breadCrumbList(
|
|
[...breadCrumbList,
|
|
[...breadCrumbList,
|
|
- {
|
|
|
|
- index:_step,
|
|
|
|
- name:reportData[`report_name`],
|
|
|
|
- params:{
|
|
|
|
- reportCode:reportData.redirectReportCode,
|
|
|
|
- parameter
|
|
|
|
- }
|
|
|
|
|
|
+ {
|
|
|
|
+ index: _step,
|
|
|
|
+ name: reportData[`report_name`],
|
|
|
|
+ params: {
|
|
|
|
+ reportCode: reportData.redirectReportCode,
|
|
|
|
+ parameter
|
|
}
|
|
}
|
|
|
|
+ }
|
|
]
|
|
]
|
|
);
|
|
);
|
|
set_step(_step);
|
|
set_step(_step);
|
|
-
|
|
|
|
- set_tableDataFilterParams({...tableDataFilterParams,reportCode:reportData.redirectReportCode,parameter})
|
|
|
|
|
|
+
|
|
|
|
+ set_tableDataFilterParams({ ...tableDataFilterParams, reportCode: reportData.redirectReportCode, parameter })
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
const getTableData = async (params: any, sort: any, filter: any) => {
|
|
const getTableData = async (params: any, sort: any, filter: any) => {
|
|
|
|
|
|
- const {reportCode,parameter} = params;
|
|
|
|
|
|
+ const { reportCode, parameter } = params;
|
|
|
|
|
|
- let resp:any = undefined;
|
|
|
|
|
|
+ let resp: any = undefined;
|
|
|
|
|
|
- if(step != 0){
|
|
|
|
- //报表跳转
|
|
|
|
- resp = await getRedirReportData(
|
|
|
|
- reportCode,
|
|
|
|
- parameter
|
|
|
|
- );
|
|
|
|
|
|
+ if (step != 0) {
|
|
|
|
+ //报表跳转
|
|
|
|
+ resp = await getRedirReportData(
|
|
|
|
+ reportCode,
|
|
|
|
+ parameter
|
|
|
|
+ );
|
|
}
|
|
}
|
|
|
|
|
|
- if(step == 0){
|
|
|
|
|
|
+ if (step == 0) {
|
|
//首次获取表格数据
|
|
//首次获取表格数据
|
|
resp = await getData(
|
|
resp = await getData(
|
|
reportCode,
|
|
reportCode,
|
|
parameter
|
|
parameter
|
|
- );
|
|
|
|
|
|
+ );
|
|
}
|
|
}
|
|
|
|
|
|
if (resp) {
|
|
if (resp) {
|
|
|
|
|
|
- const { title,data:assignmentData } = resp;
|
|
|
|
- const columns = title.map((item: any,index:number) => {
|
|
|
|
|
|
+ const { title, data: assignmentData } = resp;
|
|
|
|
+ const columns = title.map((item: any, index: number) => {
|
|
return {
|
|
return {
|
|
title: item.name,
|
|
title: item.name,
|
|
dataIndex: `${item.columnName}`,
|
|
dataIndex: `${item.columnName}`,
|
|
key: `${item.columnName}`,
|
|
key: `${item.columnName}`,
|
|
width: 100,
|
|
width: 100,
|
|
- render:(_:any,record:any)=>{
|
|
|
|
- if(item.redirect){
|
|
|
|
- return <a className='active' onClick={()=>reportJumphandle({...item,...record})}>{_}</a>
|
|
|
|
- }
|
|
|
|
- return <span >{_}</span>
|
|
|
|
|
|
+ render: (_: any, record: any) => {
|
|
|
|
+
|
|
|
|
+ if(item.redirect){
|
|
|
|
+ if (item.redirectData&&item.redirectData.length > 1) {
|
|
|
|
+
|
|
|
|
+ const items:MenuProps['items'] = [
|
|
|
|
+ ...(item.redirectData.map((a:any,index:number)=>({
|
|
|
|
+ key:index,
|
|
|
|
+ label: (
|
|
|
|
+ <a onClick={() => reportJumphandle({ ...item,...record, ...a })}>
|
|
|
|
+ {a.redirectReportName}
|
|
|
|
+ </a>
|
|
|
|
+ ),
|
|
|
|
+ })))
|
|
|
|
+ ];
|
|
|
|
+
|
|
|
|
+ return <Dropdown menu={{ items }}>
|
|
|
|
+ <a onClick={(e) => e.preventDefault()}>
|
|
|
|
+ <Space>
|
|
|
|
+ {_}
|
|
|
|
+ <DownOutlined />
|
|
|
|
+ </Space>
|
|
|
|
+ </a>
|
|
|
|
+ </Dropdown>
|
|
|
|
+ }else {
|
|
|
|
+ return <a className='active' onClick={() => reportJumphandle({ ...item, ...record })}>{_}</a>
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ return <span >{_}</span>
|
|
}
|
|
}
|
|
|
|
|
|
}
|
|
}
|
|
});
|
|
});
|
|
- set_tableColumn([ ...columns]);
|
|
|
|
|
|
+ set_tableColumn([...columns]);
|
|
|
|
|
|
const data = assignmentData.map((item: any) => {
|
|
const data = assignmentData.map((item: any) => {
|
|
|
|
|
|
let rowData: { [key: string]: any } = {};
|
|
let rowData: { [key: string]: any } = {};
|
|
-
|
|
|
|
|
|
+
|
|
for (let i = 0; i < item.length; i++) {
|
|
for (let i = 0; i < item.length; i++) {
|
|
rowData[`${title[i].columnName}`] = item[i].value
|
|
rowData[`${title[i].columnName}`] = item[i].value
|
|
}
|
|
}
|
|
-
|
|
|
|
- return { ...item, ...rowData,id:Math.random(), columns }
|
|
|
|
|
|
+
|
|
|
|
+ return { ...item, ...rowData, id: Math.random(), columns }
|
|
});
|
|
});
|
|
|
|
|
|
return {
|
|
return {
|
|
@@ -151,10 +177,10 @@ const ReportTemplate = () => {
|
|
|
|
|
|
const getCurrentComputeDate = async () => {
|
|
const getCurrentComputeDate = async () => {
|
|
const resp = await getComputeDate();
|
|
const resp = await getComputeDate();
|
|
- set_tableDataFilterParams({...tableDataFilterParams,parameter:{...tableDataFilterParams.parameter,compute_date:resp}});
|
|
|
|
|
|
+ set_tableDataFilterParams({ ...tableDataFilterParams, parameter: { ...tableDataFilterParams.parameter, compute_date: resp } });
|
|
set_currentComputeDate(resp);
|
|
set_currentComputeDate(resp);
|
|
}
|
|
}
|
|
-
|
|
|
|
|
|
+
|
|
|
|
|
|
const handleResize = (e: any) => {
|
|
const handleResize = (e: any) => {
|
|
const wH = e.target.innerHeight;
|
|
const wH = e.target.innerHeight;
|
|
@@ -168,25 +194,25 @@ const ReportTemplate = () => {
|
|
window.dispatchEvent(ev);
|
|
window.dispatchEvent(ev);
|
|
}, 0)
|
|
}, 0)
|
|
}
|
|
}
|
|
-
|
|
|
|
|
|
+
|
|
|
|
|
|
//面包屑跳转
|
|
//面包屑跳转
|
|
- const switchHandle = (data:any)=>{
|
|
|
|
-
|
|
|
|
|
|
+ const switchHandle = (data: any) => {
|
|
|
|
+
|
|
set_step(data.index);
|
|
set_step(data.index);
|
|
- const _breadCrumbList = breadCrumbList.filter((a:any)=>a.index<=data.index);
|
|
|
|
|
|
+ const _breadCrumbList = breadCrumbList.filter((a: any) => a.index <= data.index);
|
|
set_breadCrumbList([..._breadCrumbList]);
|
|
set_breadCrumbList([..._breadCrumbList]);
|
|
- set_tableDataFilterParams({...tableDataFilterParams,...data.params});
|
|
|
|
|
|
+ set_tableDataFilterParams({ ...tableDataFilterParams, ...data.params });
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
useEffect(() => {
|
|
useEffect(() => {
|
|
// 在这里处理路由参数变化的逻辑
|
|
// 在这里处理路由参数变化的逻辑
|
|
- set_tableDataFilterParams({reportCode:urlReportCode,parameter:{compute_date:currentComputeDate}});
|
|
|
|
|
|
+ set_tableDataFilterParams({ reportCode: urlReportCode, parameter: { compute_date: currentComputeDate } });
|
|
set_breadCrumbList([{
|
|
set_breadCrumbList([{
|
|
- name:'首页',
|
|
|
|
- params:{reportCode:urlReportCode,parameter:{compute_date:currentComputeDate}}
|
|
|
|
- }])
|
|
|
|
|
|
+ name: '首页',
|
|
|
|
+ params: { reportCode: urlReportCode, parameter: { compute_date: currentComputeDate } }
|
|
|
|
+ }])
|
|
}, [urlReportCode]);
|
|
}, [urlReportCode]);
|
|
|
|
|
|
|
|
|
|
@@ -204,17 +230,17 @@ const ReportTemplate = () => {
|
|
return (
|
|
return (
|
|
<BMSPagecontainer className='ReportTemplate' title={`核算年月:${currentComputeDate}`}>
|
|
<BMSPagecontainer className='ReportTemplate' title={`核算年月:${currentComputeDate}`}>
|
|
<div className='breadcrumb'>
|
|
<div className='breadcrumb'>
|
|
- {
|
|
|
|
- breadCrumbList.length>1&&breadCrumbList.map((item:any,index:number)=>{
|
|
|
|
- return (
|
|
|
|
-
|
|
|
|
- <span className={index != step?'tab':'tab actived'} key={index} onClick={()=>{index != step && switchHandle(item)}}>{item.name}{index == breadCrumbList.length - 1?'':' / '}</span>
|
|
|
|
- )
|
|
|
|
- })
|
|
|
|
- }
|
|
|
|
|
|
+ {
|
|
|
|
+ breadCrumbList.length > 1 && breadCrumbList.map((item: any, index: number) => {
|
|
|
|
+ return (
|
|
|
|
+
|
|
|
|
+ <span className={index != step ? 'tab' : 'tab actived'} key={index} onClick={() => { index != step && switchHandle(item) }}>{item.name}{index == breadCrumbList.length - 1 ? '' : ' / '}</span>
|
|
|
|
+ )
|
|
|
|
+ })
|
|
|
|
+ }
|
|
</div>
|
|
</div>
|
|
<div className='content'>
|
|
<div className='content'>
|
|
- {currentComputeDate&&<BMSTable actionRef={tableRef} rowKey='id' pagination={false} columns={tableColumn as ProColumns[]}
|
|
|
|
|
|
+ {currentComputeDate && <BMSTable actionRef={tableRef} rowKey='id' pagination={false} columns={tableColumn as ProColumns[]}
|
|
params={tableDataFilterParams}
|
|
params={tableDataFilterParams}
|
|
scroll={{ x: 100 * tableColumn.length, y: tableH }}
|
|
scroll={{ x: 100 * tableColumn.length, y: tableH }}
|
|
request={(params, sort, filter) => getTableData(params, sort, filter)}
|
|
request={(params, sort, filter) => getTableData(params, sort, filter)}
|