update
This commit is contained in:
ylj20011123
parent
4e6fe8ef95
commit
42ecaa9eb3
@ -121,6 +121,17 @@ export default [
|
|||||||
name: 'reports.settlementSummaryTable',
|
name: 'reports.settlementSummaryTable',
|
||||||
component: './reports/settlementSummaryTable/index',
|
component: './reports/settlementSummaryTable/index',
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
path: 'reports/OnlineSettlementOfProjects',
|
||||||
|
name: 'reports.OnlineSettlementOfProjects',
|
||||||
|
component: './reports/OnlineSettlementOfProjects/index',
|
||||||
|
},
|
||||||
|
|
||||||
|
{
|
||||||
|
path: 'reports/settlementProjectForNextMonth',
|
||||||
|
name: 'reports.settlementProjectForNextMonth',
|
||||||
|
component: './reports/settlementProjectForNextMonth/index',
|
||||||
|
},
|
||||||
{
|
{
|
||||||
path: 'reports/ConfirmationDifference',
|
path: 'reports/ConfirmationDifference',
|
||||||
name: 'reports.ConfirmationDifference',
|
name: 'reports.ConfirmationDifference',
|
||||||
@ -1034,6 +1045,12 @@ export default [
|
|||||||
name: 'MallSummaryStatistics',
|
name: 'MallSummaryStatistics',
|
||||||
component: './travelMember/MallSummaryStatistics/index'
|
component: './travelMember/MallSummaryStatistics/index'
|
||||||
},
|
},
|
||||||
|
// 供应商订单统计
|
||||||
|
{
|
||||||
|
path: 'SupplierOrderStatistics',
|
||||||
|
name: 'SupplierOrderStatistics',
|
||||||
|
component: './travelMember/SupplierOrderStatistics/index'
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
]
|
]
|
||||||
|
|||||||
@ -90,13 +90,6 @@ const CardInformationManager: React.FC<{ currentUser: CurrentUser }> = (props) =
|
|||||||
valueType: 'index',
|
valueType: 'index',
|
||||||
align: 'center',
|
align: 'center',
|
||||||
},
|
},
|
||||||
{
|
|
||||||
title: "优惠券类型",
|
|
||||||
dataIndex: "COUPON_TYPES",
|
|
||||||
valueType: 'select',
|
|
||||||
valueEnum: COUPONTYPEObj,
|
|
||||||
hideInTable: true,
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
title: "卡券名称",
|
title: "卡券名称",
|
||||||
dataIndex: "COUPON_NAME",
|
dataIndex: "COUPON_NAME",
|
||||||
@ -115,6 +108,23 @@ const CardInformationManager: React.FC<{ currentUser: CurrentUser }> = (props) =
|
|||||||
}}>{record?.COUPON_NAME}</a> : "-"
|
}}>{record?.COUPON_NAME}</a> : "-"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
title: "优惠券类型",
|
||||||
|
width: 120,
|
||||||
|
dataIndex: "COUPON_TYPES",
|
||||||
|
valueType: 'select',
|
||||||
|
valueEnum: COUPONTYPEObj,
|
||||||
|
hideInTable: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "优惠券类型",
|
||||||
|
width: 120,
|
||||||
|
dataIndex: "COUPON_TYPE",
|
||||||
|
valueType: 'select',
|
||||||
|
valueEnum: COUPONTYPEObj,
|
||||||
|
hideInSearch: true,
|
||||||
|
align: 'center',
|
||||||
|
},
|
||||||
{
|
{
|
||||||
title: "运营单位",
|
title: "运营单位",
|
||||||
dataIndex: "OPERATINGUNIT_NAME",
|
dataIndex: "OPERATINGUNIT_NAME",
|
||||||
@ -330,7 +340,7 @@ const CardInformationManager: React.FC<{ currentUser: CurrentUser }> = (props) =
|
|||||||
setFileList([])
|
setFileList([])
|
||||||
}}
|
}}
|
||||||
confirmLoading={modalLoading}
|
confirmLoading={modalLoading}
|
||||||
width={900}
|
width={1400}
|
||||||
bodyStyle={{
|
bodyStyle={{
|
||||||
height: '700px', // 你可以根据需要调整高度
|
height: '700px', // 你可以根据需要调整高度
|
||||||
overflowY: 'auto',
|
overflowY: 'auto',
|
||||||
|
|||||||
@ -133,7 +133,7 @@ const MerchantInformation: React.FC<{ currentUser: CurrentUser | undefined }> =
|
|||||||
dataIndex: 'searchText',
|
dataIndex: 'searchText',
|
||||||
title: '查询内容',
|
title: '查询内容',
|
||||||
hideInTable: true,
|
hideInTable: true,
|
||||||
fieldProp: {
|
fieldProps: {
|
||||||
placeholder: "请输入商户名称"
|
placeholder: "请输入商户名称"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
@ -169,6 +169,7 @@ const MerchantInformation: React.FC<{ currentUser: CurrentUser | undefined }> =
|
|||||||
fieldProps: {
|
fieldProps: {
|
||||||
treeData: formatTreeData(BUSINESSTRADEYNTree), // 设置树形数据源
|
treeData: formatTreeData(BUSINESSTRADEYNTree), // 设置树形数据源
|
||||||
showSearch: true, // 启用搜索
|
showSearch: true, // 启用搜索
|
||||||
|
allowClear: true,
|
||||||
treeNodeFilterProp: 'label', // 按 label 过滤
|
treeNodeFilterProp: 'label', // 按 label 过滤
|
||||||
treeDefaultExpandAll: true,
|
treeDefaultExpandAll: true,
|
||||||
filterTreeNode: (input: any, treeNode: any) => {
|
filterTreeNode: (input: any, treeNode: any) => {
|
||||||
@ -926,7 +927,7 @@ const MerchantInformation: React.FC<{ currentUser: CurrentUser | undefined }> =
|
|||||||
const req = {
|
const req = {
|
||||||
searchParameter: {
|
searchParameter: {
|
||||||
SERVERPART_IDS: selectedId,
|
SERVERPART_IDS: selectedId,
|
||||||
SHOPTRADES: params?.SHOPTRADES,
|
SHOPTRADES: params?.SHOPTRADE || "",
|
||||||
ISVALID: 1,
|
ISVALID: 1,
|
||||||
ISSHOW: params?.ISSHOW === "-1" ? "" : params?.ISSHOW
|
ISSHOW: params?.ISSHOW === "-1" ? "" : params?.ISSHOW
|
||||||
},
|
},
|
||||||
|
|||||||
@ -163,6 +163,11 @@ const SpringFestival: React.FC<{ currentUser?: CurrentUser }> = (props) => {
|
|||||||
BayonetINClYear: item.BayonetINC.lYearData,
|
BayonetINClYear: item.BayonetINC.lYearData,
|
||||||
BayonetINCcrease: item.BayonetINC.increaseData,
|
BayonetINCcrease: item.BayonetINC.increaseData,
|
||||||
BayonetINCRate: item.BayonetINC.increaseRate,
|
BayonetINCRate: item.BayonetINC.increaseRate,
|
||||||
|
|
||||||
|
SectionFlowINCINCCcur: item.SectionFlowINC.curYearData,
|
||||||
|
SectionFlowINClYear: item.SectionFlowINC.lYearData,
|
||||||
|
SectionFlowINCcrease: item.SectionFlowINC.increaseData,
|
||||||
|
SectionFlowINCRate: item.SectionFlowINC.increaseRate,
|
||||||
})
|
})
|
||||||
// list.push({
|
// list.push({
|
||||||
// SPRegionTypeId:item.SPRegionTypeId,
|
// SPRegionTypeId:item.SPRegionTypeId,
|
||||||
@ -245,6 +250,8 @@ const SpringFestival: React.FC<{ currentUser?: CurrentUser }> = (props) => {
|
|||||||
dataIndex: 'ServerpartName',
|
dataIndex: 'ServerpartName',
|
||||||
aiDataIndex: "ServerpartName",
|
aiDataIndex: "ServerpartName",
|
||||||
hideInSearch: true,
|
hideInSearch: true,
|
||||||
|
width: 120,
|
||||||
|
ellipsis: true,
|
||||||
align: 'center',
|
align: 'center',
|
||||||
render: (_, record) => {
|
render: (_, record) => {
|
||||||
return <a style={{ cursor: 'pointer' }} onClick={() => {
|
return <a style={{ cursor: 'pointer' }} onClick={() => {
|
||||||
@ -421,6 +428,7 @@ const SpringFestival: React.FC<{ currentUser?: CurrentUser }> = (props) => {
|
|||||||
title: `${showCurrentFestivalObj?.curYear}年`,
|
title: `${showCurrentFestivalObj?.curYear}年`,
|
||||||
dataIndex: 'RevenueINCcur',
|
dataIndex: 'RevenueINCcur',
|
||||||
aiDataIndex: "RevenueINCcur",
|
aiDataIndex: "RevenueINCcur",
|
||||||
|
width: 120,
|
||||||
align: 'right',
|
align: 'right',
|
||||||
valueType: 'digit',
|
valueType: 'digit',
|
||||||
sorter: (a, b) => a.RevenueINCcur - b.RevenueINCcur,
|
sorter: (a, b) => a.RevenueINCcur - b.RevenueINCcur,
|
||||||
@ -430,6 +438,7 @@ const SpringFestival: React.FC<{ currentUser?: CurrentUser }> = (props) => {
|
|||||||
title: `${showCurrentFestivalObj?.compareYear}年`,
|
title: `${showCurrentFestivalObj?.compareYear}年`,
|
||||||
dataIndex: 'RevenueINClYear',
|
dataIndex: 'RevenueINClYear',
|
||||||
aiDataIndex: "RevenueINClYear",
|
aiDataIndex: "RevenueINClYear",
|
||||||
|
width: 120,
|
||||||
align: 'right',
|
align: 'right',
|
||||||
valueType: 'digit',
|
valueType: 'digit',
|
||||||
sorter: (a, b) => a.RevenueINClYear - b.RevenueINClYear,
|
sorter: (a, b) => a.RevenueINClYear - b.RevenueINClYear,
|
||||||
@ -439,6 +448,7 @@ const SpringFestival: React.FC<{ currentUser?: CurrentUser }> = (props) => {
|
|||||||
title: '增长',
|
title: '增长',
|
||||||
dataIndex: 'RevenueINCcrease',
|
dataIndex: 'RevenueINCcrease',
|
||||||
aiDataIndex: "RevenueINCcrease",
|
aiDataIndex: "RevenueINCcrease",
|
||||||
|
width: 120,
|
||||||
align: 'right',
|
align: 'right',
|
||||||
valueType: 'digit',
|
valueType: 'digit',
|
||||||
hideInSearch: true,
|
hideInSearch: true,
|
||||||
@ -449,6 +459,7 @@ const SpringFestival: React.FC<{ currentUser?: CurrentUser }> = (props) => {
|
|||||||
title: '增幅',
|
title: '增幅',
|
||||||
dataIndex: 'RevenueINCRate',
|
dataIndex: 'RevenueINCRate',
|
||||||
aiDataIndex: "RevenueINCRate",
|
aiDataIndex: "RevenueINCRate",
|
||||||
|
width: 120,
|
||||||
align: 'center',
|
align: 'center',
|
||||||
hideInSearch: true,
|
hideInSearch: true,
|
||||||
sorter: (a, b) => a.RevenueINCRate - b.RevenueINCRate,
|
sorter: (a, b) => a.RevenueINCRate - b.RevenueINCRate,
|
||||||
@ -471,6 +482,7 @@ const SpringFestival: React.FC<{ currentUser?: CurrentUser }> = (props) => {
|
|||||||
title: `${showCurrentFestivalObj?.curYear}年`,
|
title: `${showCurrentFestivalObj?.curYear}年`,
|
||||||
dataIndex: 'AccountINCCcur',
|
dataIndex: 'AccountINCCcur',
|
||||||
aiDataIndex: "AccountINCCcur",
|
aiDataIndex: "AccountINCCcur",
|
||||||
|
width: 120,
|
||||||
align: 'right',
|
align: 'right',
|
||||||
valueType: 'digit',
|
valueType: 'digit',
|
||||||
sorter: (a, b) => a.AccountINCCcur - b.AccountINCCcur,
|
sorter: (a, b) => a.AccountINCCcur - b.AccountINCCcur,
|
||||||
@ -480,6 +492,7 @@ const SpringFestival: React.FC<{ currentUser?: CurrentUser }> = (props) => {
|
|||||||
title: `${showCurrentFestivalObj?.compareYear}年`,
|
title: `${showCurrentFestivalObj?.compareYear}年`,
|
||||||
dataIndex: 'AccountINClYear',
|
dataIndex: 'AccountINClYear',
|
||||||
aiDataIndex: "AccountINClYear",
|
aiDataIndex: "AccountINClYear",
|
||||||
|
width: 120,
|
||||||
align: 'right',
|
align: 'right',
|
||||||
valueType: 'digit',
|
valueType: 'digit',
|
||||||
sorter: (a, b) => a.AccountINClYear - b.AccountINClYear,
|
sorter: (a, b) => a.AccountINClYear - b.AccountINClYear,
|
||||||
@ -489,6 +502,7 @@ const SpringFestival: React.FC<{ currentUser?: CurrentUser }> = (props) => {
|
|||||||
title: '增长',
|
title: '增长',
|
||||||
dataIndex: 'AccountINCcrease',
|
dataIndex: 'AccountINCcrease',
|
||||||
aiDataIndex: "AccountINCcrease",
|
aiDataIndex: "AccountINCcrease",
|
||||||
|
width: 120,
|
||||||
align: 'right',
|
align: 'right',
|
||||||
valueType: 'digit',
|
valueType: 'digit',
|
||||||
hideInSearch: true,
|
hideInSearch: true,
|
||||||
@ -498,6 +512,7 @@ const SpringFestival: React.FC<{ currentUser?: CurrentUser }> = (props) => {
|
|||||||
title: '增幅',
|
title: '增幅',
|
||||||
dataIndex: 'AccountINCRate',
|
dataIndex: 'AccountINCRate',
|
||||||
aiDataIndex: "AccountINCRate",
|
aiDataIndex: "AccountINCRate",
|
||||||
|
width: 120,
|
||||||
align: 'center',
|
align: 'center',
|
||||||
hideInSearch: true,
|
hideInSearch: true,
|
||||||
sorter: (a, b) => a.AccountINCRate - b.AccountINCRate,
|
sorter: (a, b) => a.AccountINCRate - b.AccountINCRate,
|
||||||
@ -520,6 +535,7 @@ const SpringFestival: React.FC<{ currentUser?: CurrentUser }> = (props) => {
|
|||||||
title: `${showCurrentFestivalObj?.curYear}年`,
|
title: `${showCurrentFestivalObj?.curYear}年`,
|
||||||
dataIndex: 'BayonetINCINCCcur',
|
dataIndex: 'BayonetINCINCCcur',
|
||||||
aiDataIndex: "BayonetINCINCCcur",
|
aiDataIndex: "BayonetINCINCCcur",
|
||||||
|
width: 120,
|
||||||
align: 'right',
|
align: 'right',
|
||||||
valueType: 'digit',
|
valueType: 'digit',
|
||||||
sorter: (a, b) => a.BayonetINCINCCcur - b.BayonetINCINCCcur,
|
sorter: (a, b) => a.BayonetINCINCCcur - b.BayonetINCINCCcur,
|
||||||
@ -529,6 +545,7 @@ const SpringFestival: React.FC<{ currentUser?: CurrentUser }> = (props) => {
|
|||||||
title: `${showCurrentFestivalObj?.compareYear}年`,
|
title: `${showCurrentFestivalObj?.compareYear}年`,
|
||||||
dataIndex: 'BayonetINClYear',
|
dataIndex: 'BayonetINClYear',
|
||||||
aiDataIndex: "BayonetINClYear",
|
aiDataIndex: "BayonetINClYear",
|
||||||
|
width: 120,
|
||||||
align: 'right',
|
align: 'right',
|
||||||
valueType: 'digit',
|
valueType: 'digit',
|
||||||
sorter: (a, b) => a.BayonetINClYear - b.BayonetINClYear,
|
sorter: (a, b) => a.BayonetINClYear - b.BayonetINClYear,
|
||||||
@ -538,6 +555,7 @@ const SpringFestival: React.FC<{ currentUser?: CurrentUser }> = (props) => {
|
|||||||
title: '增长',
|
title: '增长',
|
||||||
dataIndex: 'BayonetINCcrease',
|
dataIndex: 'BayonetINCcrease',
|
||||||
aiDataIndex: "BayonetINCcrease",
|
aiDataIndex: "BayonetINCcrease",
|
||||||
|
width: 120,
|
||||||
align: 'right',
|
align: 'right',
|
||||||
valueType: 'digit',
|
valueType: 'digit',
|
||||||
hideInSearch: true,
|
hideInSearch: true,
|
||||||
@ -547,6 +565,7 @@ const SpringFestival: React.FC<{ currentUser?: CurrentUser }> = (props) => {
|
|||||||
title: '增幅',
|
title: '增幅',
|
||||||
dataIndex: 'BayonetINCRate',
|
dataIndex: 'BayonetINCRate',
|
||||||
aiDataIndex: "BayonetINCRate",
|
aiDataIndex: "BayonetINCRate",
|
||||||
|
width: 120,
|
||||||
align: 'center',
|
align: 'center',
|
||||||
hideInSearch: true,
|
hideInSearch: true,
|
||||||
sorter: (a, b) => a.BayonetINCRate - b.BayonetINCRate,
|
sorter: (a, b) => a.BayonetINCRate - b.BayonetINCRate,
|
||||||
@ -559,6 +578,59 @@ const SpringFestival: React.FC<{ currentUser?: CurrentUser }> = (props) => {
|
|||||||
}
|
}
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
title: '断面流量',
|
||||||
|
dataIndex: 'SectionFlowINC',
|
||||||
|
aiDataIndex: "SectionFlowINC",
|
||||||
|
hideInSearch: true,
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
title: `${showCurrentFestivalObj?.curYear}年`,
|
||||||
|
dataIndex: 'SectionFlowINCINCCcur',
|
||||||
|
aiDataIndex: "SectionFlowINCINCCcur",
|
||||||
|
width: 120,
|
||||||
|
align: 'right',
|
||||||
|
valueType: 'digit',
|
||||||
|
sorter: (a, b) => a.SectionFlowINCINCCcur - b.SectionFlowINCINCCcur,
|
||||||
|
hideInSearch: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: `${showCurrentFestivalObj?.compareYear}年`,
|
||||||
|
dataIndex: 'SectionFlowINClYear',
|
||||||
|
aiDataIndex: "SectionFlowINClYear",
|
||||||
|
width: 120,
|
||||||
|
align: 'right',
|
||||||
|
valueType: 'digit',
|
||||||
|
sorter: (a, b) => a.SectionFlowINClYear - b.SectionFlowINClYear,
|
||||||
|
hideInSearch: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '增长',
|
||||||
|
dataIndex: 'SectionFlowINCcrease',
|
||||||
|
aiDataIndex: "SectionFlowINCcrease",
|
||||||
|
width: 120,
|
||||||
|
align: 'right',
|
||||||
|
valueType: 'digit',
|
||||||
|
hideInSearch: true,
|
||||||
|
sorter: (a, b) => a.SectionFlowINCcrease - b.SectionFlowINCcrease,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '增幅',
|
||||||
|
dataIndex: 'SectionFlowINCRate',
|
||||||
|
aiDataIndex: "SectionFlowINCRate",
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
sorter: (a, b) => a.SectionFlowINCRate - b.SectionFlowINCRate,
|
||||||
|
render: (_, record) => {
|
||||||
|
return <span style={{ color: record.SectionFlowINCRate > 0 ? '#e83944' : record.SectionFlowINCRate < 0 ? '#0e9976' : '' }}>
|
||||||
|
{record.SectionFlowINCRate > 0 ? '+' : record.SectionFlowINCRate < 0 ? '' : ''}
|
||||||
|
{record.SectionFlowINCRate ? `${record.SectionFlowINCRate}%` : ''}
|
||||||
|
</span>
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
]
|
]
|
||||||
|
|
||||||
const exportColumns: any = [
|
const exportColumns: any = [
|
||||||
@ -904,7 +976,7 @@ const SpringFestival: React.FC<{ currentUser?: CurrentUser }> = (props) => {
|
|||||||
id={'table-to-xls'}
|
id={'table-to-xls'}
|
||||||
columns={columns}
|
columns={columns}
|
||||||
bordered={true}
|
bordered={true}
|
||||||
scroll={{ y: 'calc(100vh - 450px)' }}
|
scroll={{ x: "100%", y: 'calc(100vh - 450px)' }}
|
||||||
pagination={false}
|
pagination={false}
|
||||||
dataSource={tableData}
|
dataSource={tableData}
|
||||||
request={async (params) => {
|
request={async (params) => {
|
||||||
|
|||||||
50
src/pages/reports/OnlineSettlementOfProjects/index.less
Normal file
50
src/pages/reports/OnlineSettlementOfProjects/index.less
Normal file
@ -0,0 +1,50 @@
|
|||||||
|
.summaryDrawer{
|
||||||
|
.ant-drawer-content-wrapper{
|
||||||
|
.ant-drawer-content{
|
||||||
|
.ant-drawer-wrapper-body{
|
||||||
|
.ant-drawer-body{
|
||||||
|
.detailTable{
|
||||||
|
.ant-pro-card{
|
||||||
|
.ant-pro-card-body{
|
||||||
|
.ant-pro-table-alert{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
td{
|
||||||
|
mso-number-format: '"0.00"'
|
||||||
|
}
|
||||||
|
.exportTable{
|
||||||
|
.ant-pro-card{
|
||||||
|
.ant-pro-card-body{
|
||||||
|
.ant-table-wrapper{
|
||||||
|
.ant-spin-nested-loading{
|
||||||
|
.ant-spin-container{
|
||||||
|
.ant-table{
|
||||||
|
.ant-table-container{
|
||||||
|
.ant-table-content{
|
||||||
|
table{
|
||||||
|
.ant-table-tbody{
|
||||||
|
tr{
|
||||||
|
td{
|
||||||
|
mso-number-format: '"0.00"'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
891
src/pages/reports/OnlineSettlementOfProjects/index.tsx
Normal file
891
src/pages/reports/OnlineSettlementOfProjects/index.tsx
Normal file
@ -0,0 +1,891 @@
|
|||||||
|
import { connect, useRequest } from "umi";
|
||||||
|
import type { CurrentUser } from "umi";
|
||||||
|
import type { ConnectState } from "@/models/connect";
|
||||||
|
import React, { useRef, useState } from "react";
|
||||||
|
import ProCard from "@ant-design/pro-card";
|
||||||
|
import { MenuFoldOutlined } from "@ant-design/icons";
|
||||||
|
import { Drawer, FormInstance } from "antd";
|
||||||
|
import { Button, message, Space, Spin, Tree } from "antd";
|
||||||
|
import { getServerpartTree, handleFormatNumber } from "@/services/options";
|
||||||
|
import type { ActionType } from "@ant-design/pro-table";
|
||||||
|
import ProTable from "@ant-design/pro-table";
|
||||||
|
import ReactHTMLTableToExcel from "react-html-table-to-excel";
|
||||||
|
import LeftSelectTree from "@/pages/reports/settlementAccount/component/leftSelectTree";
|
||||||
|
import PageTitleBox from "@/components/PageTitleBox";
|
||||||
|
import { handleGetAnnualAccountList, handleGetTableRevenueRecognition } from "../ShopExpenseDetail/service";
|
||||||
|
import moment from 'moment'
|
||||||
|
import { wrapTreeNode } from "@/utils/format";
|
||||||
|
import YearExamineDetailTable from "../settlementAccount/component/YearExamineDetailTable";
|
||||||
|
import './index.less'
|
||||||
|
import * as XLSX from 'xlsx';
|
||||||
|
import session from "@/utils/session";
|
||||||
|
import { handleGetAPPROVALROUTEList } from "@/pages/Setting/serviceConfig/service";
|
||||||
|
|
||||||
|
const OnlineSettlementOfProjects: React.FC<{ currentUser: CurrentUser }> = (props) => {
|
||||||
|
const { currentUser } = props
|
||||||
|
const downloadBtnRef = useRef<any>()
|
||||||
|
const actionRef = useRef<ActionType>();
|
||||||
|
const formRef = useRef<FormInstance>();
|
||||||
|
const [reqDetailList, setReqDetailList] = useState<any>(); // 合计项数据源
|
||||||
|
const [printOut, setPrintOut] = useState<any>(); // 打印数据的内容
|
||||||
|
const [collapsible, setCollapsible] = useState<boolean>(false)
|
||||||
|
const [treeView, setTreeView] = useState<any>()
|
||||||
|
const [printIndex, setPrintIndex] = useState<number>(new Date().getTime())
|
||||||
|
let SETTLEMENT_MODESObj = session.get('SETTLEMENT_MODESObj')
|
||||||
|
|
||||||
|
// 树相关的属性和方法
|
||||||
|
const [selectedId, setSelectedId] = useState<string>()
|
||||||
|
// 导出的加载效果
|
||||||
|
const [showLoading, setShowLoading] = useState<boolean>(false)
|
||||||
|
// 是否显示打印的表格
|
||||||
|
const [showExportTable, setShowExportTable] = useState<boolean>(false)
|
||||||
|
// 查询的条件
|
||||||
|
const [searchParams, setSearchParams] = useState<any>()
|
||||||
|
// 点击门店显示项目应收拆分数据
|
||||||
|
const [showDrawer, setShowDrawer] = useState<any>()
|
||||||
|
// 当前点击行的数据
|
||||||
|
const [currentRow, setCurrentRow] = useState<any>()
|
||||||
|
// 是否显示批量月度审批的按钮
|
||||||
|
const [isShowMonthBtn, setIsShowMonthBtn] = useState<boolean>(false)
|
||||||
|
// 业务环节的枚举
|
||||||
|
const [APPROVALROUTESTATEObj, setAPPROVALROUTESTATEObj] = useState<any>()
|
||||||
|
|
||||||
|
const [columnsStateMap, setColumnsStateMap] = useState<any>({
|
||||||
|
SettlementModes: { show: false },
|
||||||
|
SwitchDate: { show: false },
|
||||||
|
CASHPAY_AMOUNT: { show: false },
|
||||||
|
MOBILEPAY_AMOUNT: { show: false },
|
||||||
|
GUARANTEERATIOAMOUNT: { show: false },
|
||||||
|
BANKACCOUNT_AMOUNT: { show: false },
|
||||||
|
RECEIVABLEAMOUNT: { show: false },
|
||||||
|
PAID_AMOUNT: { show: false },
|
||||||
|
});
|
||||||
|
|
||||||
|
// 拿到业务环节的枚举
|
||||||
|
const { loading: headerTitleLoading, data: tableHeaderObj } = useRequest(async () => {
|
||||||
|
const req: any = {
|
||||||
|
SearchParameter: {
|
||||||
|
APPROVALROUTE_VALID: 1,
|
||||||
|
OPERATION_TYPES: 11
|
||||||
|
},
|
||||||
|
SortStr: 'APPROVALROUTE_STATE asc',
|
||||||
|
PageIndex: 1,
|
||||||
|
PageSize: 999999
|
||||||
|
}
|
||||||
|
const data = await handleGetAPPROVALROUTEList(req)
|
||||||
|
console.log('2222222', data);
|
||||||
|
let obj: any = {}
|
||||||
|
if (data && data.length > 0) {
|
||||||
|
data.forEach((item: any) => {
|
||||||
|
obj[item.APPROVALROUTE_STATE] = item.APPROVALROUTE_NAME
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
setAPPROVALROUTESTATEObj(obj)
|
||||||
|
return []
|
||||||
|
})
|
||||||
|
|
||||||
|
let settlementStateObj: any = {
|
||||||
|
"9": "已结算",
|
||||||
|
"0": "待结算",
|
||||||
|
"-1": "提前退场",
|
||||||
|
}
|
||||||
|
|
||||||
|
const columns: any = [
|
||||||
|
{
|
||||||
|
title: '统计时间',
|
||||||
|
dataIndex: 'search_date',
|
||||||
|
valueType: 'dateRange',
|
||||||
|
hideInTable: true,
|
||||||
|
hideInDescriptions: true,
|
||||||
|
initialValue: [moment().startOf('y'), moment()],
|
||||||
|
search: {
|
||||||
|
transform: (value: any) => {
|
||||||
|
return {
|
||||||
|
StartDate: value[0],
|
||||||
|
EndDate: value[1],
|
||||||
|
};
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
// {
|
||||||
|
// title: '统计日期',
|
||||||
|
// dataIndex: 'StatisticsYear',
|
||||||
|
// valueType: "date",
|
||||||
|
// hideInTable: true,
|
||||||
|
// hideInDescriptions: true,
|
||||||
|
// initialValue: moment().subtract('1', 'month'),
|
||||||
|
// // search: {
|
||||||
|
// // transform: (value: any) => {
|
||||||
|
// // return {
|
||||||
|
// // StartDate: moment(value[0]).format('YYYYMM'),
|
||||||
|
// // EndDate: moment(value[1]).format('YYYYMM'),
|
||||||
|
// // };
|
||||||
|
// // },
|
||||||
|
// // },
|
||||||
|
// fieldProps: {
|
||||||
|
// picker: "year",
|
||||||
|
// format: 'YYYY'
|
||||||
|
// }
|
||||||
|
// },
|
||||||
|
{
|
||||||
|
title: "结算状态",
|
||||||
|
dataIndex: 'SettlementState',
|
||||||
|
valueType: 'select',
|
||||||
|
hideInTable: true,
|
||||||
|
valueEnum: {
|
||||||
|
"9": "已结算",
|
||||||
|
"1": "结算中",
|
||||||
|
"0": "待结算",
|
||||||
|
"-1": "提前退场",
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
{
|
||||||
|
title: "结算类型",
|
||||||
|
dataIndex: 'SettlementType',
|
||||||
|
valueType: 'select',
|
||||||
|
valueEnum: {
|
||||||
|
"1": "线上",
|
||||||
|
"2": "线下"
|
||||||
|
},
|
||||||
|
hideInTable: true
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "结算模式",
|
||||||
|
dataIndex: 'SettlementModes',
|
||||||
|
valueType: 'select',
|
||||||
|
hideInTable: true,
|
||||||
|
valueEnum: SETTLEMENT_MODESObj,
|
||||||
|
fieldProps: {
|
||||||
|
mode: 'multiple', // 开启多选模式
|
||||||
|
},
|
||||||
|
initialValue: ["3000", "4000"]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>管理中心</div>,
|
||||||
|
titleStr: '管理中心',
|
||||||
|
dataIndex: 'SPREGIONTYPE_NAME',
|
||||||
|
width: 200,
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
align: 'center'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>服务区</div>,
|
||||||
|
titleStr: '服务区',
|
||||||
|
dataIndex: 'SERVERPART_NAME',
|
||||||
|
width: 200,
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
align: 'center'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>经营商户</div>,
|
||||||
|
titleStr: '经营商户',
|
||||||
|
dataIndex: 'MERCHANTS_NAME',
|
||||||
|
width: 200,
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
align: 'center'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>门店</div>,
|
||||||
|
titleStr: '门店',
|
||||||
|
dataIndex: 'SERVERPARTSHOP_NAME',
|
||||||
|
width: 150,
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
align: 'center',
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.SERVERPARTSHOP_NAME ? <a onClick={() => {
|
||||||
|
console.log('record', record);
|
||||||
|
|
||||||
|
setCurrentRow({
|
||||||
|
...record,
|
||||||
|
CLOSED_DATE: record?.ClosedDate,
|
||||||
|
SHOPROYALTY_ID: record?.ShopRoyaltyId
|
||||||
|
})
|
||||||
|
setShowDrawer(true)
|
||||||
|
}}>
|
||||||
|
{record?.SERVERPARTSHOP_NAME || ""}
|
||||||
|
</a> : ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>基础信息</div>,
|
||||||
|
dataIndex: 'termInfo',
|
||||||
|
titleStr: '基础信息',
|
||||||
|
// fixed: 'left',
|
||||||
|
hideInSearch: true,
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>期数</div>,
|
||||||
|
titleStr: '期数',
|
||||||
|
dataIndex: 'IndexStr',
|
||||||
|
width: 100,
|
||||||
|
align: 'center',
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.Index > 0 ? `第${record?.Index}期` : "-"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>时限</div>,
|
||||||
|
titleStr: '时限',
|
||||||
|
dataIndex: 'COMPACT_STARTDATECOMPACT_ENDDATE',
|
||||||
|
width: 180,
|
||||||
|
align: 'center',
|
||||||
|
render: (_, record) => {
|
||||||
|
// return record?.IndexDesc || ''
|
||||||
|
return `${record?.COMPACT_STARTDATE || ''}-${record?.COMPACT_ENDDATE || ''}`
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>保底/固定租金</div>,
|
||||||
|
titleStr: '保底/固定租金',
|
||||||
|
exportType: "momeny",
|
||||||
|
align: 'right',
|
||||||
|
width: 140,
|
||||||
|
valueType: 'digit',
|
||||||
|
dataIndex: 'RENTFEE',
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.RENTFEE ? handleFormatNumber(record?.RENTFEE) : record?.RENTFEE === 0 ? '0.00' : '-'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>提成比率</div>,
|
||||||
|
titleStr: '提成比率',
|
||||||
|
exportType: "rate",
|
||||||
|
dataIndex: 'GUARANTEERATIO',
|
||||||
|
align: 'center',
|
||||||
|
width: 120,
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.GUARANTEERATIO ? `${record?.GUARANTEERATIO}%` : ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>结算模式</div>,
|
||||||
|
dataIndex: 'SettlementModes',
|
||||||
|
align: 'center',
|
||||||
|
width: 120,
|
||||||
|
valueType: 'select',
|
||||||
|
valueEnum: SETTLEMENT_MODESObj,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>切换日期</div>,
|
||||||
|
dataIndex: 'SwitchDate',
|
||||||
|
align: 'center',
|
||||||
|
width: 120,
|
||||||
|
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>营业额</div>,
|
||||||
|
titleStr: '营业额',
|
||||||
|
dataIndex: '',
|
||||||
|
hideInSearch: true,
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>现金</div>,
|
||||||
|
titleStr: '现金',
|
||||||
|
exportType: "momeny",
|
||||||
|
align: 'right',
|
||||||
|
width: 120,
|
||||||
|
valueType: 'digit',
|
||||||
|
dataIndex: 'CASHPAY_AMOUNT',
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.CASHPAY_AMOUNT ? handleFormatNumber(record?.CASHPAY_AMOUNT) : record?.CASHPAY_AMOUNT === 0 ? '0.00' : '-'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>移动支付</div>,
|
||||||
|
titleStr: '移动支付',
|
||||||
|
exportType: "momeny",
|
||||||
|
align: 'right',
|
||||||
|
width: 120,
|
||||||
|
valueType: 'digit',
|
||||||
|
dataIndex: 'MOBILEPAY_AMOUNT',
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.MOBILEPAY_AMOUNT ? handleFormatNumber(record?.MOBILEPAY_AMOUNT) : record?.MOBILEPAY_AMOUNT === 0 ? '0.00' : '-'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>小计</div>,
|
||||||
|
titleStr: '小计',
|
||||||
|
exportType: "momeny",
|
||||||
|
align: 'right',
|
||||||
|
valueType: 'digit',
|
||||||
|
width: 120,
|
||||||
|
dataIndex: 'REVENUEDAILY_AMOUNTTotal',
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.REVENUEDAILY_AMOUNTTotal ? handleFormatNumber(record?.REVENUEDAILY_AMOUNTTotal) : record?.REVENUEDAILY_AMOUNTTotal === 0 ? '0.00' : '-'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>提成金额</div>,
|
||||||
|
titleStr: '提成金额',
|
||||||
|
exportType: "momeny",
|
||||||
|
align: 'right',
|
||||||
|
valueType: 'digit',
|
||||||
|
hideInSearch: true,
|
||||||
|
width: 120,
|
||||||
|
dataIndex: 'GUARANTEERATIOAMOUNT',
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.GUARANTEERATIOAMOUNT ? handleFormatNumber(record?.GUARANTEERATIOAMOUNT) : record?.GUARANTEERATIOAMOUNT === 0 ? '0.00' : '-'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>业主收款</div>,
|
||||||
|
titleStr: '业主收款',
|
||||||
|
exportType: "momeny",
|
||||||
|
align: 'right',
|
||||||
|
valueType: 'digit',
|
||||||
|
hideInSearch: true,
|
||||||
|
width: 120,
|
||||||
|
dataIndex: 'BANKACCOUNT_AMOUNT',
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.BANKACCOUNT_AMOUNT ? handleFormatNumber(record?.BANKACCOUNT_AMOUNT) : record?.BANKACCOUNT_AMOUNT === 0 ? '0.00' : '-'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>应收租金</div>,
|
||||||
|
titleStr: '应收租金',
|
||||||
|
exportType: "momeny",
|
||||||
|
align: 'right',
|
||||||
|
width: 120,
|
||||||
|
hideInSearch: true,
|
||||||
|
valueType: 'digit',
|
||||||
|
dataIndex: 'RECEIVABLEAMOUNT',
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.RECEIVABLEAMOUNT ? handleFormatNumber(record?.RECEIVABLEAMOUNT) : record?.RECEIVABLEAMOUNT === 0 ? '0.00' : '-'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>应收费用</div>,
|
||||||
|
titleStr: '应收费用',
|
||||||
|
exportType: "momeny",
|
||||||
|
align: 'right',
|
||||||
|
valueType: 'digit',
|
||||||
|
hideInSearch: true,
|
||||||
|
width: 120,
|
||||||
|
dataIndex: 'SHOPEXPENSE_AMOUNT',
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.SHOPEXPENSE_AMOUNT ? handleFormatNumber(record?.SHOPEXPENSE_AMOUNT) : record?.SHOPEXPENSE_AMOUNT === 0 ? '0.00' : '-'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>已缴费用</div>,
|
||||||
|
titleStr: '已缴费用',
|
||||||
|
exportType: "momeny",
|
||||||
|
align: 'right',
|
||||||
|
valueType: 'digit',
|
||||||
|
hideInSearch: true,
|
||||||
|
width: 120,
|
||||||
|
dataIndex: 'PAID_AMOUNT',
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.PAID_AMOUNT ? handleFormatNumber(record?.PAID_AMOUNT) : record?.PAID_AMOUNT === 0 ? '0.00' : '-'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>退补款</div>,
|
||||||
|
titleStr: '退补款',
|
||||||
|
exportType: "momeny",
|
||||||
|
align: 'right',
|
||||||
|
valueType: 'digit',
|
||||||
|
hideInSearch: true,
|
||||||
|
width: 120,
|
||||||
|
dataIndex: 'REFUND_SUPPLEMENT',
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.REFUND_SUPPLEMENT ? handleFormatNumber(record?.REFUND_SUPPLEMENT) : record?.REFUND_SUPPLEMENT === 0 ? '0.00' : '-'
|
||||||
|
}
|
||||||
|
// fixed: 'right',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>结算月份</div>,
|
||||||
|
titleStr: '结算月份',
|
||||||
|
align: 'center',
|
||||||
|
valueType: 'digit',
|
||||||
|
hideInSearch: true,
|
||||||
|
width: 120,
|
||||||
|
dataIndex: 'STATISTICS_MONTH',
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.STATISTICS_MONTH ? moment(record?.STATISTICS_MONTH).format('MM') + '月' : '-'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>是否结算</div>,
|
||||||
|
titleStr: '是否结算',
|
||||||
|
align: 'center',
|
||||||
|
valueType: 'digit',
|
||||||
|
hideInSearch: true,
|
||||||
|
width: 120,
|
||||||
|
dataIndex: 'settlementStateObjApprovalstate',
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.Approvalstate || record?.Approvalstate === 0 ? settlementStateObj[record?.Approvalstate.toString()] : '-'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>审批环节</div>,
|
||||||
|
titleStr: '审批环节',
|
||||||
|
align: 'center',
|
||||||
|
valueType: 'select',
|
||||||
|
valueEnum: APPROVALROUTESTATEObj,
|
||||||
|
hideInSearch: true,
|
||||||
|
width: 150,
|
||||||
|
dataIndex: 'LastSettlementState',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>备注（收退款）</div>,
|
||||||
|
titleStr: '备注（收退款）',
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
width: 120,
|
||||||
|
dataIndex: 'REFUND_SUPPLEMENTdesc',
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.REFUND_SUPPLEMENT > 0 ? '退款' : record?.REFUND_SUPPLEMENT <= 0 ? '收款' : ''
|
||||||
|
}
|
||||||
|
// REFUND_SUPPLEMENT 大于小于
|
||||||
|
},
|
||||||
|
]
|
||||||
|
|
||||||
|
// 导出方法
|
||||||
|
const handleExportDataToExcel = (isHaveChildren: boolean, isHaveTitle?: boolean) => {
|
||||||
|
// isHaveChildren 判断表头是否有子集
|
||||||
|
|
||||||
|
console.log('1', reqDetailList);
|
||||||
|
|
||||||
|
let columnsNoChildren: any = []
|
||||||
|
// 先创建需要显示的列表头
|
||||||
|
let headerArray: any = isHaveChildren ? [[], []] : []
|
||||||
|
// 需要合并单元格的内容
|
||||||
|
let mergesList: any = []
|
||||||
|
// 因为子集也拆出来了 这样实际的行数会比columns多 所以得知道多了多少
|
||||||
|
let moreColumns: number = 0
|
||||||
|
// 显示的列表有多少个
|
||||||
|
let showItemNumber: number = 0
|
||||||
|
|
||||||
|
let showIndex: number = 0
|
||||||
|
if (columns && columns.length > 0) {
|
||||||
|
columns.forEach((item: any, index: number) => {
|
||||||
|
if (!item.hideInTable) {
|
||||||
|
showItemNumber += 1
|
||||||
|
if (item.children && item.children.length > 0) {
|
||||||
|
mergesList.push({
|
||||||
|
s: { r: 0 + (isHaveTitle ? 1 : 0), c: showIndex },
|
||||||
|
e: { r: 0 + (isHaveTitle ? 1 : 0), c: showIndex + item.children.length - 1 },
|
||||||
|
})
|
||||||
|
moreColumns += item.children.length - 1
|
||||||
|
showIndex += item.children.length
|
||||||
|
item.children.forEach((subItem: any) => {
|
||||||
|
if (!subItem.hideInTable) {
|
||||||
|
columnsNoChildren.push(subItem)
|
||||||
|
headerArray[0].push(item.titleStr)
|
||||||
|
headerArray[1].push(subItem.titleStr)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
columnsNoChildren.push(item)
|
||||||
|
headerArray[0].push(item.titleStr)
|
||||||
|
if (isHaveChildren) {
|
||||||
|
headerArray[1].push(item.titleStr)
|
||||||
|
mergesList.push({
|
||||||
|
s: { r: 0 + (isHaveTitle ? 1 : 0), c: showIndex },
|
||||||
|
e: { r: 1 + (isHaveTitle ? 1 : 0), c: showIndex },
|
||||||
|
})
|
||||||
|
}
|
||||||
|
showIndex += 1
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
console.log('columnsNoChildren', columnsNoChildren);
|
||||||
|
console.log('headerArray', headerArray);
|
||||||
|
console.log('mergesList', mergesList);
|
||||||
|
|
||||||
|
|
||||||
|
// 先创建需要显示的列表头
|
||||||
|
// let headerArray = [
|
||||||
|
// ["管理中心", "服务区", "经营商户", "门店", "基础信息", "基础信息", "基础信息", "基础信息", "营业额", "营业额", "营业额", "提成金额", "业主收款", "应收租金", "应收费用", "已缴费用", "退补款", "结算月份", "是否结算", "备注（收退款）"],
|
||||||
|
// ["管理中心", "服务区", "经营商户", "门店", "期数", "时限", "保底 / 固定租金", "提成比率", "现金", "移动支付", "小计", "提成金额", "业主收款", "应收租金", "应收费用", "已缴费用", "退补款", "结算月份", "是否结算", "备注（收退款）"]
|
||||||
|
// ]
|
||||||
|
|
||||||
|
// 创建一个工作簿
|
||||||
|
const ws = {}
|
||||||
|
|
||||||
|
// 设置列宽：动态计算每列的最大内容长度
|
||||||
|
let colWidths: any = [];
|
||||||
|
// 设置样式：对齐方式
|
||||||
|
const cellStyle: any = {
|
||||||
|
alignment: {
|
||||||
|
horizontal: 'right',
|
||||||
|
vertical: 'right'
|
||||||
|
}
|
||||||
|
};
|
||||||
|
if (headerArray && headerArray.length > 0) {
|
||||||
|
headerArray.forEach((row: any, rowIndex: any) => {
|
||||||
|
row.forEach((cell: any, colIndex: any) => {
|
||||||
|
const cellRef = XLSX.utils.encode_cell({ r: (isHaveChildren ? rowIndex : rowIndex) + (isHaveTitle ? 1 : 0), c: colIndex });
|
||||||
|
// ws[cellRef] = cell;
|
||||||
|
console.log('cellRef', cellRef);
|
||||||
|
|
||||||
|
ws[cellRef] = {
|
||||||
|
v: cell, t: 's', s: cellStyle
|
||||||
|
};
|
||||||
|
const cellLength = getCharWidth((cell && cell.toString()) || '');
|
||||||
|
|
||||||
|
if (!colWidths[colIndex]) {
|
||||||
|
colWidths[colIndex] = cellLength;
|
||||||
|
} else {
|
||||||
|
colWidths[colIndex] = Math.max(colWidths[colIndex], cellLength);
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// 设置工作表的范围（必需）
|
||||||
|
const range = {
|
||||||
|
s: { r: 0, c: 0 }, // 开始行列
|
||||||
|
e: { r: reqDetailList.length + (isHaveChildren ? 2 : 1) + (isHaveTitle ? 1 : 0), c: columnsNoChildren.length } // 结束行列
|
||||||
|
};
|
||||||
|
|
||||||
|
ws["A1"] = {
|
||||||
|
v: `(${searchParams?.StatisticsYear})年度结算汇总表`, t: 's', s: {
|
||||||
|
font: {
|
||||||
|
bold: true, // 字体加粗
|
||||||
|
color: { rgb: "#000" }, // 字体颜色红色
|
||||||
|
sz: 20 // 字号为14
|
||||||
|
},
|
||||||
|
alignment: {
|
||||||
|
horizontal: 'center', // 水平居中
|
||||||
|
vertical: 'center' // 垂直居中
|
||||||
|
},
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
if (isHaveTitle) {
|
||||||
|
mergesList.push(
|
||||||
|
{
|
||||||
|
s: { r: 0, c: 0 },
|
||||||
|
e: { r: 0, c: columnsNoChildren.length },
|
||||||
|
}
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
ws['!merges'] = mergesList
|
||||||
|
|
||||||
|
ws['!ref'] = XLSX.utils.encode_range(range); // 设置单元格范围
|
||||||
|
|
||||||
|
if (reqDetailList && reqDetailList.length > 0) {
|
||||||
|
reqDetailList.forEach((item: any, index: number) => {
|
||||||
|
columnsNoChildren.forEach((subItem: any, subIndex: number) => {
|
||||||
|
for (let key in item) {
|
||||||
|
if (subItem.dataIndex === key) {
|
||||||
|
let res = item[key]
|
||||||
|
const cellRef = XLSX.utils.encode_cell({ r: (isHaveChildren ? index + 2 : index + 1) + (isHaveTitle ? 1 : 0), c: subIndex });
|
||||||
|
// ws[cellRef] = cell;
|
||||||
|
let newRes = res ? subItem.exportType === 'momeny' ? handleFormatNumber(res) : subItem.exportType === 'rate' ? `${res}%` : res : subItem.exportType === 'momeny' ? '0' : ""
|
||||||
|
ws[cellRef] = {
|
||||||
|
v: newRes, t: 's', s: {
|
||||||
|
alignment: {
|
||||||
|
horizontal: 'center', // 水平居中
|
||||||
|
vertical: 'center' // 垂直居中
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
const cellLength = getCharWidth((newRes && newRes.toString()) || '');
|
||||||
|
|
||||||
|
if (!colWidths[subIndex]) {
|
||||||
|
colWidths[subIndex] = cellLength;
|
||||||
|
} else {
|
||||||
|
if (subIndex === 2) {
|
||||||
|
console.log('colWidths[subIndex] ', colWidths[subIndex]);
|
||||||
|
console.log('cellLength.length', cellLength);
|
||||||
|
|
||||||
|
}
|
||||||
|
colWidths[subIndex] = Math.max(colWidths[subIndex], cellLength);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
ws['!cols'] = colWidths.map((width: any) => ({ wch: width + 2 })); // wch 表示字符宽度
|
||||||
|
|
||||||
|
console.log('ws', ws);
|
||||||
|
|
||||||
|
|
||||||
|
// array.forEach((row: any, rowIndex: any) => {
|
||||||
|
// row.forEach((cell: any, colIndex: any) => {
|
||||||
|
// // 通过设置单元格的数值和样式，保留原始格式
|
||||||
|
// const cellRef = XLSX.utils.encode_cell({ r: rowIndex, c: colIndex }); // 跳过表头行
|
||||||
|
// console.log('cellRef', cellRef);
|
||||||
|
|
||||||
|
// if (typeof cell === 'number' && cell.toFixed) {
|
||||||
|
// // 如果是数字，保持两位小数
|
||||||
|
// ws[cellRef].z = '0.00'; // 设置数字格式为两位小数
|
||||||
|
// }
|
||||||
|
// });
|
||||||
|
// });
|
||||||
|
|
||||||
|
// 创建工作簿
|
||||||
|
const wb = XLSX.utils.book_new();
|
||||||
|
XLSX.utils.book_append_sheet(wb, ws, 'Sheet1');
|
||||||
|
|
||||||
|
// 导出 Excel 文件
|
||||||
|
XLSX.writeFile(wb, `(${searchParams?.StatisticsYear})年度结算汇总表.xlsx`);
|
||||||
|
setShowLoading(false)
|
||||||
|
},
|
||||||
|
// 判断字符类型的辅助函数
|
||||||
|
getCharWidth = (cell: any) => {
|
||||||
|
if (!cell) {
|
||||||
|
return ''
|
||||||
|
}
|
||||||
|
if (typeof cell === 'number') {
|
||||||
|
return cell.toString().length > 150 ? 150 : cell.toString().length; // 数字通常和英文字符宽度相同
|
||||||
|
} else if (/[^\x00-\xff]/.test(cell)) {
|
||||||
|
return cell.length * 1.8 > 300 ? 300 : cell.length * 1.8; // 中文字符宽度大约是英文字符的2倍
|
||||||
|
} else {
|
||||||
|
return cell.length > 150 ? 150 : cell.length; // 英文字符的宽度为1
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const exportTable = (e) => {
|
||||||
|
e.stopPropagation(); // 防止Collapse组件收起
|
||||||
|
const main = document.getElementsByClassName(`OnlineSettlementOfProjects${printIndex}`)[0]
|
||||||
|
const thead = main.querySelector('thead').cloneNode(true); // 深克隆DOM节点
|
||||||
|
const tbody = main.querySelector('tbody').cloneNode(true); // 深克隆DOM节点
|
||||||
|
const container = document.querySelector('#hiddenBox');
|
||||||
|
|
||||||
|
// 加个标题
|
||||||
|
const tableTop = document.createElement('div')
|
||||||
|
tableTop.innerText = `(${searchParams?.StatisticsYear})年度结算汇总表`
|
||||||
|
tableTop.setAttribute('style', 'font-size:20px;font-weight:600;display:flex;width:100%;justify-content: center;text-align: center;');
|
||||||
|
|
||||||
|
const tempTable = document.createElement('table');
|
||||||
|
|
||||||
|
tempTable.appendChild(tableTop)
|
||||||
|
tempTable.appendChild(thead);
|
||||||
|
tempTable.appendChild(tbody);
|
||||||
|
|
||||||
|
tempTable.setAttribute('id', 'table-to-xls-OnlineSettlementOfProjects'); // 给table添加id，值与按钮上的table字段对应
|
||||||
|
|
||||||
|
container.appendChild(tempTable); // 把创建的节点添加到页面容器中
|
||||||
|
|
||||||
|
setShowLoading(false)
|
||||||
|
|
||||||
|
downloadBtnRef.current.handleDownload();
|
||||||
|
setShowExportTable(false)
|
||||||
|
tempTable.remove() // 防止重复打印一个内容
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div ref={(el) => {
|
||||||
|
// 打印报表
|
||||||
|
if (!reqDetailList || reqDetailList.length === 0) return;
|
||||||
|
setPrintOut(el);
|
||||||
|
}} >
|
||||||
|
|
||||||
|
{
|
||||||
|
showLoading ?
|
||||||
|
<div
|
||||||
|
style={{
|
||||||
|
width: '100%',
|
||||||
|
height: '100%',
|
||||||
|
background: 'rgba(0,0,0,0.1)',
|
||||||
|
position: 'fixed',
|
||||||
|
zIndex: 5,
|
||||||
|
display: 'flex',
|
||||||
|
alignItems: 'center',
|
||||||
|
justifyContent: 'center'
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<div style={{
|
||||||
|
display: 'flex',
|
||||||
|
alignItems: 'center',
|
||||||
|
justifyContent: 'center',
|
||||||
|
padding: '15px 20px 10px',
|
||||||
|
background: '#fff',
|
||||||
|
borderRadius: '8px',
|
||||||
|
width: '200px'
|
||||||
|
}}>
|
||||||
|
<Spin />
|
||||||
|
<span style={{ marginLeft: '5px' }}>数据导出中...</span>
|
||||||
|
</div>
|
||||||
|
</div> : ''
|
||||||
|
}
|
||||||
|
|
||||||
|
<div className={`OnlineSettlementOfProjects${printIndex}`} style={{ position: 'fixed', zIndex: -1, top: 0, left: 0 }}>
|
||||||
|
{
|
||||||
|
showExportTable && reqDetailList && reqDetailList.length > 0 ?
|
||||||
|
<ProTable
|
||||||
|
className="exportTable"
|
||||||
|
columns={columns}
|
||||||
|
dataSource={reqDetailList}
|
||||||
|
pagination={false}
|
||||||
|
expandable={{
|
||||||
|
defaultExpandAllRows: true
|
||||||
|
}}
|
||||||
|
/> : ''
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
<div id='hiddenBox' style={{ position: 'fixed', zIndex: -1, top: 0, left: 0 }} />
|
||||||
|
|
||||||
|
<div style={{ backgroundColor: '#fff', display: 'flex' }}>
|
||||||
|
<LeftSelectTree setSelectedId={setSelectedId} setCollapsible={setCollapsible} collapsible={collapsible} />
|
||||||
|
<div style={{
|
||||||
|
width: !collapsible ? 'calc(100% - 300px)' : 'calc(100% - 60px)',
|
||||||
|
paddingTop: 0,
|
||||||
|
paddingBottom: 0,
|
||||||
|
paddingRight: 0
|
||||||
|
}}>
|
||||||
|
<ProTable
|
||||||
|
actionRef={actionRef}
|
||||||
|
formRef={formRef}
|
||||||
|
columns={columns}
|
||||||
|
bordered
|
||||||
|
expandable={{
|
||||||
|
expandRowByClick: true
|
||||||
|
}}
|
||||||
|
rowKey={(record: any) => {
|
||||||
|
return `${record?.SPREGIONTYPE_ID}-${record?.SERVERPART_ID}-${record?.SERVERPARTSHOP_ID}-${record?.BUSINESSPROJECT_ID}-${record?.MERCHANTS_ID}-${record?.IndexStr}`
|
||||||
|
}}
|
||||||
|
headerTitle={<PageTitleBox props={props} />}
|
||||||
|
search={{ span: 6 }}
|
||||||
|
scroll={{ x: "max-content", y: 'calc(100vh - 450px)' }}
|
||||||
|
request={async (params) => {
|
||||||
|
if (!selectedId) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
const req: any = {
|
||||||
|
// StatisticsYear: params?.StatisticsYear,
|
||||||
|
StatisticsYear: moment(params?.StartDate).format('YYYY'),
|
||||||
|
ServerpartId: selectedId,
|
||||||
|
SettlementState: params?.SettlementState,
|
||||||
|
SettlementModes: params?.SettlementModes,
|
||||||
|
SettlementType: params?.SettlementType,
|
||||||
|
StartDate: params?.StartDate,
|
||||||
|
EndDate: params?.EndDate
|
||||||
|
// ServerpartIds: selectedId,
|
||||||
|
// // ShopRoyaltyId: compareCurrent?.ShopRoyaltyId,
|
||||||
|
// // BusinessProjectId: compareCurrent?.BUSINESSPROJECT_ID,
|
||||||
|
// startDate: params?.StartDate || '',
|
||||||
|
// endDate: params?.EndDate || '',
|
||||||
|
// SolidType: true
|
||||||
|
}
|
||||||
|
setSearchParams(params)
|
||||||
|
console.log('req', req);
|
||||||
|
|
||||||
|
const data = await handleGetAnnualAccountList(req)
|
||||||
|
let res: any = []
|
||||||
|
let exportData: any = []
|
||||||
|
if (data && data.length > 0) {
|
||||||
|
res = data
|
||||||
|
}
|
||||||
|
console.log('res', res);
|
||||||
|
if (res && res.length > 0) {
|
||||||
|
let exportRes = JSON.parse(JSON.stringify(res))
|
||||||
|
exportRes.forEach((item: any, index: number) => {
|
||||||
|
item.index = `${index + 1}`
|
||||||
|
// item.SPREGIONTYPE_NAME = item.SPREGIONTYPE_NAME.split('管理中心')
|
||||||
|
if (item.children && item.children.length > 0) {
|
||||||
|
item.children.forEach((subItem: any, subIndex: number) => {
|
||||||
|
subItem.index = `${index + 1}-${subIndex + 1}`
|
||||||
|
// subItem.SPREGIONTYPE_NAME = subItem.SPREGIONTYPE_NAME.split('管理中心')
|
||||||
|
// subItem.SERVERPART_NAME = subItem.SERVERPART_NAME.split('服务区')
|
||||||
|
if (subItem.children && subItem.children.length > 0) {
|
||||||
|
subItem.children.forEach((thirdItem: any, thirdIndex: number) => {
|
||||||
|
thirdItem.index = `${index + 1}-${subIndex + 1}-${thirdIndex + 1}`
|
||||||
|
thirdItem.SPREGIONTYPE_NAME = thirdItem.SPREGIONTYPE_NAME.split('管理中心')[0]
|
||||||
|
thirdItem.SERVERPART_NAME = thirdItem.SERVERPART_NAME.split('服务区')[0]
|
||||||
|
|
||||||
|
thirdItem.COMPACT_STARTDATECOMPACT_ENDDATE = `${thirdItem?.COMPACT_STARTDATE || '-'}-${thirdItem?.COMPACT_ENDDATE || '-'}`
|
||||||
|
thirdItem.settlementStateObjApprovalstate = thirdItem?.Approvalstate || thirdItem?.Approvalstate === 0 ? settlementStateObj[thirdItem?.Approvalstate.toString()] : '-'
|
||||||
|
thirdItem.REFUND_SUPPLEMENTdesc = thirdItem?.REFUND_SUPPLEMENT > 0 ? '退款' : thirdItem?.REFUND_SUPPLEMENT <= 0 ? '收款' : ''
|
||||||
|
exportData.push(thirdItem)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
console.log('exportData', exportData);
|
||||||
|
setReqDetailList(exportData)
|
||||||
|
return { data: res, success: true }
|
||||||
|
}
|
||||||
|
setReqDetailList(exportData)
|
||||||
|
return { data: [], success: true }
|
||||||
|
}}
|
||||||
|
toolbar={{
|
||||||
|
actions: [
|
||||||
|
<span style={{ visibility: 'hidden' }}>
|
||||||
|
<ReactHTMLTableToExcel
|
||||||
|
buttonText={'导出excel'}
|
||||||
|
ref={downloadBtnRef}
|
||||||
|
table="table-to-xls-OnlineSettlementOfProjects"
|
||||||
|
filename={`(${moment(searchParams?.StartDate).format('YYYY')})年度结算汇总表`}
|
||||||
|
sheet="sheet1"
|
||||||
|
dataType="String"
|
||||||
|
/>
|
||||||
|
</span>,
|
||||||
|
<Button
|
||||||
|
key="new"
|
||||||
|
type="primary"
|
||||||
|
onClick={(e) => {
|
||||||
|
if (reqDetailList && reqDetailList.length > 0) {
|
||||||
|
setShowLoading(true)
|
||||||
|
setTimeout(() => {
|
||||||
|
setShowExportTable(true)
|
||||||
|
setTimeout(() => {
|
||||||
|
// handleExportDataToExcel(true, true)
|
||||||
|
exportTable(e)
|
||||||
|
}, 100)
|
||||||
|
}, 100)
|
||||||
|
} else {
|
||||||
|
message.error('暂无数据可导出！')
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
导出excel
|
||||||
|
</Button>
|
||||||
|
]
|
||||||
|
}}
|
||||||
|
columnsState={{
|
||||||
|
value: columnsStateMap,
|
||||||
|
onChange: setColumnsStateMap,
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<Drawer
|
||||||
|
width="85%"
|
||||||
|
visible={showDrawer}
|
||||||
|
destroyOnClose
|
||||||
|
onClose={() => {
|
||||||
|
setShowDrawer(false)
|
||||||
|
setCurrentRow(undefined)
|
||||||
|
}}
|
||||||
|
bodyStyle={{ backgroundColor: "#fff", padding: 0 }}
|
||||||
|
closable={false}
|
||||||
|
className="summaryDrawer"
|
||||||
|
>
|
||||||
|
<YearExamineDetailTable parentRow={currentRow} currentApprovalstate={currentRow?.Approvalstate} onRef={null}
|
||||||
|
setIsShowMonthBtn={setIsShowMonthBtn} setIsYearAllowSettlement={false} handleShowSettlementDetail={false} isYear={true}
|
||||||
|
isChangeFile={false} />
|
||||||
|
</Drawer>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default connect(({ user }: ConnectState) => ({
|
||||||
|
currentUser: user.currentUser
|
||||||
|
}))(OnlineSettlementOfProjects);
|
||||||
@ -0,0 +1,405 @@
|
|||||||
|
import { connect } from "umi";
|
||||||
|
import type { ConnectState } from "@/models/connect";
|
||||||
|
import ProTable, { ActionType } from "@ant-design/pro-table";
|
||||||
|
import { useRef } from "react";
|
||||||
|
import { Button, FormInstance, Tooltip } from "antd";
|
||||||
|
import { handleGetProjectPeriodAccount } from "../../ShopExpenseDetail/service";
|
||||||
|
import { wrapTreeNode } from "@/utils/format";
|
||||||
|
import { handleFormatNumber } from "@/services/options";
|
||||||
|
import numeral from 'numeral'
|
||||||
|
|
||||||
|
type DetailProps = {
|
||||||
|
parentRow?: any // 外面的一些行数据
|
||||||
|
}
|
||||||
|
const HistoricalProjects = ({ parentRow }: DetailProps) => {
|
||||||
|
const actionRef = useRef<ActionType>();
|
||||||
|
const formRef = useRef<FormInstance>();
|
||||||
|
|
||||||
|
|
||||||
|
const columns: any = [
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>期限</div>,
|
||||||
|
dataIndex: 'PeriodDesc',
|
||||||
|
align: 'left',
|
||||||
|
width: 250,
|
||||||
|
fixed: 'left',
|
||||||
|
hideInSearch: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>结算状态</div>,
|
||||||
|
dataIndex: 'IsApplySuccess',
|
||||||
|
align: 'right',
|
||||||
|
width: 100,
|
||||||
|
hideInSearch: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '租金信息',
|
||||||
|
dataIndex: '',
|
||||||
|
hideInSearch: true,
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>保底/固定租金</div>,
|
||||||
|
dataIndex: 'MinturnOver',
|
||||||
|
valueType: 'digit',
|
||||||
|
align: 'right',
|
||||||
|
width: 130,
|
||||||
|
hideInSearch: true,
|
||||||
|
render: (_, record) => {
|
||||||
|
const str: string = record?.Remark
|
||||||
|
return record?.MinturnOver ?
|
||||||
|
<Tooltip title={str}>
|
||||||
|
{handleFormatNumber(record?.MinturnOver)}
|
||||||
|
</Tooltip>
|
||||||
|
: record?.MinturnOver === 0 ? '0.00' : '-'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>提成比率</div>,
|
||||||
|
dataIndex: 'GuaranteeRatio',
|
||||||
|
hideInSearch: true,
|
||||||
|
align: 'right',
|
||||||
|
width: 100,
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.GuaranteeRatio ? `${record?.GuaranteeRatio}%` : ''
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '营业额',
|
||||||
|
dataIndex: '',
|
||||||
|
hideInSearch: true,
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>现金</div>,
|
||||||
|
dataIndex: 'CashAmount',
|
||||||
|
valueType: 'digit',
|
||||||
|
align: 'right',
|
||||||
|
width: 80,
|
||||||
|
hideInSearch: true,
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.CashAmount ?
|
||||||
|
`${handleFormatNumber(record?.CashAmount)}${record?.CashCorrect ? `（${record?.CashCorrect > 0 ? '+' : record?.CashCorrect < 0 ? '' : ''}${record?.CashCorrect}）` : ''}`
|
||||||
|
: record?.CashAmount === 0 ? '0.00' : '-'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>微支付</div>,
|
||||||
|
dataIndex: 'MobilePayAmount',
|
||||||
|
valueType: 'digit',
|
||||||
|
align: 'right',
|
||||||
|
width: 100,
|
||||||
|
hideInSearch: true,
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.MobilePayAmount ?
|
||||||
|
`${handleFormatNumber(record?.MobilePayAmount)}${record?.MobilePayCorrect ? `（${record?.MobilePayCorrect > 0 ? '+' : record?.MobilePayCorrect < 0 ? '' : ''}${record?.MobilePayCorrect}）` : ''}`
|
||||||
|
: record?.MobilePayAmount === 0 ? '0.00' : '-'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>小计</div>,
|
||||||
|
dataIndex: 'RevenueAmount',
|
||||||
|
valueType: 'digit',
|
||||||
|
align: 'right',
|
||||||
|
width: 150,
|
||||||
|
hideInSearch: true,
|
||||||
|
render: (_, record) => {
|
||||||
|
return <span style={{ color: '#1890ff' }}>{record?.RevenueAmount ? `${numeral(record?.RevenueAmount).format('0,0.00')}${record?.addRevenueMoney ? `（${record?.addRevenueMoney > 0 ? '+' : record?.addRevenueMoney < 0 ? '-' : ''}${record?.addRevenueMoney}）` : ''}` : '0'}</span>
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>业主收款</div>,
|
||||||
|
dataIndex: 'RoyaltyAmount',
|
||||||
|
valueType: 'digit',
|
||||||
|
width: 100,
|
||||||
|
align: 'right',
|
||||||
|
hideInSearch: true,
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.RoyaltyAmount ? handleFormatNumber(record?.RoyaltyAmount) : record?.RoyaltyAmount === 0 ? '0.00' : '-'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '应收费用',
|
||||||
|
dataIndex: '',
|
||||||
|
hideInSearch: true,
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>合计</div>,
|
||||||
|
dataIndex: 'ReceivableAmount',
|
||||||
|
valueType: 'digit',
|
||||||
|
align: 'right',
|
||||||
|
width: 100,
|
||||||
|
hideInSearch: true,
|
||||||
|
render: (_, record) => {
|
||||||
|
const str: string = `租金(${numeral(record?.GuaranteeFee).format('0.00')}) + 物业费(${numeral(record?.PropertyFee).format('0.00')}) + 房租(${numeral(record?.HouseRent).format('0.00')}) + 罚款(${numeral(record?.BreachPenalty).format('0.00')}) + 电费(${numeral(record?.ElectricityCharge).format('0.00')}) + 水费(${numeral(record?.WaterCharge).format('0.00')}) + 其他(${numeral(record?.OtherFee).format('0.00')})`
|
||||||
|
return record?.ReceivableAmount ?
|
||||||
|
<Tooltip title={str}>
|
||||||
|
<span>
|
||||||
|
{handleFormatNumber(record?.ReceivableAmount)}
|
||||||
|
</span>
|
||||||
|
</Tooltip>
|
||||||
|
: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>租金</div>,
|
||||||
|
dataIndex: 'GuaranteeFee',
|
||||||
|
valueType: 'digit',
|
||||||
|
align: 'right',
|
||||||
|
width: 120,
|
||||||
|
hideInSearch: true,
|
||||||
|
render: (_, record) => {
|
||||||
|
const str: string = `租金(${numeral(record?.MinturnOver).format('0.00')}) ${record?.MinturnOver > (record?.RevenueAmount * (record?.GuaranteeRatio) / 100) ? '>' : '<'} 营业额(${record?.RevenueAmount || 0}) * 提成比率(${record?.GuaranteeRatio ? `${record?.GuaranteeRatio}%` : ''})`
|
||||||
|
return record?.GuaranteeFee ?
|
||||||
|
<Tooltip title={record?.PeriodDesc === '合计' ? '' : str}>
|
||||||
|
<span>{handleFormatNumber(record?.GuaranteeFee)}</span>
|
||||||
|
</Tooltip>
|
||||||
|
: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>物业费</div>,
|
||||||
|
dataIndex: 'PropertyFee',
|
||||||
|
valueType: 'digit',
|
||||||
|
align: 'right',
|
||||||
|
width: 100,
|
||||||
|
hideInSearch: true,
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.PropertyFee ?
|
||||||
|
handleFormatNumber(record?.PropertyFee)
|
||||||
|
: record?.PropertyFee === 0 ? <span style={{ color: 'red' }}>0.00</span> : ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>住宿费</div>,
|
||||||
|
dataIndex: 'HouseRent',
|
||||||
|
valueType: 'digit',
|
||||||
|
align: 'right',
|
||||||
|
width: 80,
|
||||||
|
hideInSearch: true,
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.HouseRent ? handleFormatNumber(record?.HouseRent) : record?.HouseRent === 0 ? '0.00' : '-'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>罚款</div>,
|
||||||
|
dataIndex: 'BreachPenalty',
|
||||||
|
valueType: 'digit',
|
||||||
|
align: 'right',
|
||||||
|
width: 80,
|
||||||
|
hideInSearch: true,
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.BreachPenalty ? handleFormatNumber(record?.BreachPenalty) : record?.BreachPenalty === 0 ? '0.00' : '-'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>电费</div>,
|
||||||
|
dataIndex: 'ElectricityCharge',
|
||||||
|
valueType: 'digit',
|
||||||
|
align: 'right',
|
||||||
|
width: 80,
|
||||||
|
hideInSearch: true,
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.ElectricityCharge ?
|
||||||
|
handleFormatNumber(record?.ElectricityCharge)
|
||||||
|
: record?.ElectricityCharge === 0 ? <span style={{ color: 'red' }}>0.00</span> : ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>水费</div>,
|
||||||
|
dataIndex: 'WaterCharge',
|
||||||
|
valueType: 'digit',
|
||||||
|
align: 'right',
|
||||||
|
width: 80,
|
||||||
|
hideInSearch: true,
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.WaterCharge ?
|
||||||
|
handleFormatNumber(record?.WaterCharge)
|
||||||
|
: record?.WaterCharge === 0 ? <span style={{ color: 'red' }}>0.00</span> : ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>其他</div>,
|
||||||
|
dataIndex: 'OtherFee',
|
||||||
|
valueType: 'digit',
|
||||||
|
align: 'right',
|
||||||
|
width: 80,
|
||||||
|
hideInSearch: true,
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.OtherFee ? handleFormatNumber(record?.OtherFee) : record?.OtherFee === 0 ? '0.00' : '-'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '已缴费用',
|
||||||
|
dataIndex: '',
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>合计</div>,
|
||||||
|
dataIndex: 'PaidFee',
|
||||||
|
valueType: 'digit',
|
||||||
|
align: 'right',
|
||||||
|
width: 100,
|
||||||
|
hideInSearch: true,
|
||||||
|
render: (_, record) => {
|
||||||
|
const str: string = `水费(${numeral(record?.PaidFee_9010).format('0.00')}) + 电费(${numeral(record?.PaidFee_9020).format('0.00')}) + 房租(${numeral(record?.PaidFee_9030).format('0.00')})
|
||||||
|
+ 物业费(${numeral(record?.PaidFee_9050).format('0.00')})+ 租金(${numeral(record?.PaidFee_9090).format('0.00')})+ 其他(${numeral(record?.PaidFee_9099).format('0.00')})`
|
||||||
|
return record?.PaidFee
|
||||||
|
?
|
||||||
|
<Tooltip title={str}>
|
||||||
|
<span>{handleFormatNumber(record?.PaidFee)}</span>
|
||||||
|
</Tooltip>
|
||||||
|
: '0.00'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>水费</div>,
|
||||||
|
dataIndex: 'PaidFee_9010',
|
||||||
|
valueType: 'digit',
|
||||||
|
align: 'right',
|
||||||
|
width: 80,
|
||||||
|
hideInSearch: true,
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.PaidFee_9010 ?
|
||||||
|
handleFormatNumber(record?.PaidFee_9010)
|
||||||
|
: record?.PaidFee_9010 === 0 ? <span style={{ color: 'red' }}>0.00</span> : ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>电费</div>,
|
||||||
|
dataIndex: 'PaidFee_9020',
|
||||||
|
valueType: 'digit',
|
||||||
|
align: 'right',
|
||||||
|
width: 80,
|
||||||
|
hideInSearch: true,
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.PaidFee_9020 ?
|
||||||
|
handleFormatNumber(record?.PaidFee_9020)
|
||||||
|
: record?.PaidFee_9020 === 0 ? <span style={{ color: 'red' }}>0.00</span> : ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>住宿费</div>,
|
||||||
|
dataIndex: 'PaidFee_9030',
|
||||||
|
valueType: 'digit',
|
||||||
|
align: 'right',
|
||||||
|
width: 80,
|
||||||
|
hideInSearch: true,
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.PaidFee_9030 ?
|
||||||
|
handleFormatNumber(record?.PaidFee_9030)
|
||||||
|
: record?.PaidFee_9030 === 0 ? <span style={{ color: 'red' }}>0.00</span> : ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>物业费</div>,
|
||||||
|
dataIndex: 'PaidFee_9050',
|
||||||
|
valueType: 'digit',
|
||||||
|
align: 'right',
|
||||||
|
width: 100,
|
||||||
|
hideInSearch: true,
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.PaidFee_9050 ?
|
||||||
|
handleFormatNumber(record?.PaidFee_9050)
|
||||||
|
: record?.PaidFee_9050 === 0 ? <span style={{ color: 'red' }}>0.00</span> : ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>租金</div>,
|
||||||
|
dataIndex: 'PaidFee_9090',
|
||||||
|
valueType: 'digit',
|
||||||
|
align: 'right',
|
||||||
|
width: 100,
|
||||||
|
hideInSearch: true,
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.PaidFee_9090 ?
|
||||||
|
handleFormatNumber(record?.PaidFee_9090)
|
||||||
|
: record?.PaidFee_9090 === 0 ? <span style={{ color: 'red' }}>0.00</span> : ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>其他</div>,
|
||||||
|
dataIndex: 'PaidFee_9099',
|
||||||
|
valueType: 'digit',
|
||||||
|
align: 'right',
|
||||||
|
width: 100,
|
||||||
|
hideInSearch: true,
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.PaidFee_9099 ?
|
||||||
|
handleFormatNumber(record?.PaidFee_9099)
|
||||||
|
: record?.PaidFee_9099 === 0 ? <span style={{ color: 'red' }}>0.00</span> : ''
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: <div style={{ textAlign: 'center' }}>退补款</div>,
|
||||||
|
dataIndex: 'RefundSupplement',
|
||||||
|
valueType: 'digit',
|
||||||
|
align: 'right',
|
||||||
|
fixed: 'right',
|
||||||
|
width: 100,
|
||||||
|
hideInSearch: true,
|
||||||
|
render: (_, record) => {
|
||||||
|
const str: string = `业主收款(${record?.RoyaltyAmount || 0}) - 应收费用(${record?.ReceivableAmount || 0}) + 已缴费用(${record?.PaidFee || 0})`
|
||||||
|
return record?.RefundSupplement ?
|
||||||
|
<Tooltip title={str}>
|
||||||
|
<span style={{ color: '#9A3D1A', fontWeight: 600 }}>{handleFormatNumber(record?.RefundSupplement)}</span>
|
||||||
|
</Tooltip>
|
||||||
|
: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
]
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div style={{ boxSizing: 'border-box', paddingBottom: "30px" }}>
|
||||||
|
<ProTable
|
||||||
|
rowKey={(record) => {
|
||||||
|
return `${record?.ShopRoyalty_Id}-${record?.PeriodIndexStr}-${record?.StartDate}-${record?.EndDate}-${record?.level}`
|
||||||
|
}}
|
||||||
|
actionRef={actionRef}
|
||||||
|
formRef={formRef}
|
||||||
|
columns={columns}
|
||||||
|
bordered
|
||||||
|
expandable={{
|
||||||
|
expandRowByClick: true
|
||||||
|
}}
|
||||||
|
scroll={{ x: "100%", y: "calc(100vh - 410px)" }}
|
||||||
|
headerTitle={'往期项目'} // 列表表头
|
||||||
|
search={{ span: 6 }}
|
||||||
|
request={async (params) => {
|
||||||
|
console.log('parentRowparentRowparentRowparentRow321', parentRow);
|
||||||
|
if (!parentRow?.BUSINESSPROJECT_ID) {
|
||||||
|
return { data: [], success: true }
|
||||||
|
}
|
||||||
|
|
||||||
|
const req: any = {
|
||||||
|
BUSINESSPROJECT_ID: parentRow?.BUSINESSPROJECT_ID,
|
||||||
|
}
|
||||||
|
const data = await handleGetProjectPeriodAccount(req)
|
||||||
|
console.log('datadatadatadatadatadata321', data);
|
||||||
|
let list: any = data.ProjectPeriodList
|
||||||
|
if (list && list.length > 0) {
|
||||||
|
let res: any = wrapTreeNode(list)
|
||||||
|
console.log('resresresresresresresresres', res);
|
||||||
|
return { data: res, success: true }
|
||||||
|
}
|
||||||
|
return { data: [], success: true }
|
||||||
|
}}
|
||||||
|
toolbar={{
|
||||||
|
actions: []
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default connect(({ user, }: ConnectState) => ({
|
||||||
|
currentUser: user.currentUser,
|
||||||
|
}))(HistoricalProjects);
|
||||||
@ -21,6 +21,7 @@ import { ExclamationCircleOutlined, MinusCircleOutlined, PlusOutlined } from "@a
|
|||||||
import { deletePicture, uploadPicture } from "@/services/picture";
|
import { deletePicture, uploadPicture } from "@/services/picture";
|
||||||
import PrintContent from "./printContent";
|
import PrintContent from "./printContent";
|
||||||
import { handleHighPrecision } from "@/utils/utils";
|
import { handleHighPrecision } from "@/utils/utils";
|
||||||
|
import HistoricalProjects from "./HistoricalProjects";
|
||||||
|
|
||||||
const { confirm } = Modal;
|
const { confirm } = Modal;
|
||||||
type DetailProps = {
|
type DetailProps = {
|
||||||
@ -631,7 +632,6 @@ const YearExamineDetailTable = ({ parentRow, currentApprovalstate, onRef, setIsS
|
|||||||
: ''
|
: ''
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
]
|
]
|
||||||
// 导出excel的columns
|
// 导出excel的columns
|
||||||
const exportColumns: any = [
|
const exportColumns: any = [
|
||||||
@ -2766,6 +2766,15 @@ const YearExamineDetailTable = ({ parentRow, currentApprovalstate, onRef, setIsS
|
|||||||
</ProTable>
|
</ProTable>
|
||||||
|
|
||||||
|
|
||||||
|
{/* 判断当期项目 是不是最后一期 是最后一期的话 就显示 历史期的数据 */}
|
||||||
|
<HistoricalProjects parentRow={parentRow} />
|
||||||
|
{/* {
|
||||||
|
parentRow?.PROJECT_ENDDATE === parentRow?.ENDDATE ?
|
||||||
|
<HistoricalProjects /> : ""
|
||||||
|
} */}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
{/* 导出结算表 */}
|
{/* 导出结算表 */}
|
||||||
<PrintContent pageName={'YearExamineTable'} exportColumns={exportColumns} exportData={exportData} exportSumRow={exportSumRow} type={'year'} />
|
<PrintContent pageName={'YearExamineTable'} exportColumns={exportColumns} exportData={exportData} exportSumRow={exportSumRow} type={'year'} />
|
||||||
|
|
||||||
|
|||||||
@ -874,7 +874,7 @@ const YearExamineProcess = ({ currentUser, onShow, setOnShow, parentRow, setPare
|
|||||||
setCurrentNowState(data.BUSINESSAPPROVAL_STATE)
|
setCurrentNowState(data.BUSINESSAPPROVAL_STATE)
|
||||||
// 拿到下一环节
|
// 拿到下一环节
|
||||||
const nextReq: any = {
|
const nextReq: any = {
|
||||||
OperationType: parentRow?.SETTLEMENT_TYPE === '1' || parentRow?.SETTLEMENT_TYPE === 1 ? 11 : 12,
|
OperationType: parentRow?.SETTLEMENT_TYPE ? parentRow?.SETTLEMENT_TYPE === '1' || parentRow?.SETTLEMENT_TYPE === 1 ? 11 : 12 : parentRow?.Operation_Type ? parentRow?.Operation_Type : "",
|
||||||
CurState: data.BUSINESSAPPROVAL_STATE,
|
CurState: data.BUSINESSAPPROVAL_STATE,
|
||||||
IsValid: 1
|
IsValid: 1
|
||||||
}
|
}
|
||||||
@ -901,12 +901,12 @@ const YearExamineProcess = ({ currentUser, onShow, setOnShow, parentRow, setPare
|
|||||||
|
|
||||||
|
|
||||||
// 剔除 结算时间在2025年4月1日 之后的数据 不给孙青
|
// 剔除 结算时间在2025年4月1日 之后的数据 不给孙青
|
||||||
if (parentRow?.PROJECT_ENDDATE && new Date(parentRow?.PROJECT_ENDDATE).getTime() > new Date('2025-04-01 00:00:00').getTime()) {
|
if (parentRow?.ENDDATE && new Date(parentRow?.ENDDATE).getTime() > new Date('2025-04-01 00:00:00').getTime()) {
|
||||||
list = list.filter((item: any) => item.value !== 827);
|
list = list.filter((item: any) => item.value !== 827);
|
||||||
}
|
}
|
||||||
|
|
||||||
// 剔除 结算时间在2025年4月1日 之前的数据 不给陶杰
|
// 剔除 结算时间在2025年4月1日 之前的数据 不给陶杰
|
||||||
if (parentRow?.PROJECT_ENDDATE && new Date(parentRow?.PROJECT_ENDDATE).getTime() < new Date('2025-04-01 00:00:00').getTime()) {
|
if (parentRow?.ENDDATE && new Date(parentRow?.ENDDATE).getTime() < new Date('2025-04-01 00:00:00').getTime()) {
|
||||||
list = list.filter((item: any) => item.value !== 1802);
|
list = list.filter((item: any) => item.value !== 1802);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
350
src/pages/reports/settlementProjectForNextMonth/index.tsx
Normal file
350
src/pages/reports/settlementProjectForNextMonth/index.tsx
Normal file
@ -0,0 +1,350 @@
|
|||||||
|
import { connect } from "umi";
|
||||||
|
import type { CurrentUser } from "umi";
|
||||||
|
import type { ConnectState } from "@/models/connect";
|
||||||
|
import React, { useRef, useState } from "react";
|
||||||
|
import ProCard from "@ant-design/pro-card";
|
||||||
|
import { MenuFoldOutlined } from "@ant-design/icons";
|
||||||
|
import type { FormInstance } from "antd";
|
||||||
|
import { Button, Drawer, message, Space, Spin, Tree } from "antd";
|
||||||
|
import useRequest from "@ahooksjs/use-request";
|
||||||
|
import { getServerpartTree } from "@/services/options";
|
||||||
|
import type { ActionType } from "@ant-design/pro-table";
|
||||||
|
import ProTable from "@ant-design/pro-table";
|
||||||
|
import ReactHTMLTableToExcel from "react-html-table-to-excel";
|
||||||
|
import LeftSelectTree from "@/pages/reports/settlementAccount/component/leftSelectTree";
|
||||||
|
import PageTitleBox from "@/components/PageTitleBox";
|
||||||
|
import { handleGetWillSettleProject } from "./service";
|
||||||
|
import moment from 'moment'
|
||||||
|
import session from "@/utils/session";
|
||||||
|
import ProjectDetail from "@/pages/BussinessProject/detail";
|
||||||
|
|
||||||
|
|
||||||
|
const settlementProjectForNextMonth: React.FC<{ currentUser: CurrentUser }> = (props) => {
|
||||||
|
const { currentUser } = props
|
||||||
|
const downloadBtnRef = useRef<any>()
|
||||||
|
const actionRef = useRef<ActionType>();
|
||||||
|
const formRef = useRef<FormInstance>();
|
||||||
|
const [reqDetailList, setReqDetailList] = useState<any>(); // 合计项数据源
|
||||||
|
const [printOut, setPrintOut] = useState<any>(); // 打印数据的内容
|
||||||
|
const [collapsible, setCollapsible] = useState<boolean>(false)
|
||||||
|
const [treeView, setTreeView] = useState<any>()
|
||||||
|
const [printIndex, setPrintIndex] = useState<number>(new Date().getTime())
|
||||||
|
|
||||||
|
const [currentRow, setCurrentRow] = useState<any>(undefined) // 选中的当前行
|
||||||
|
|
||||||
|
const [showDetail, setShowDetail] = useState<boolean>(false) // 是否显示详情
|
||||||
|
// 树相关的属性和方法
|
||||||
|
const [selectedId, setSelectedId] = useState<string>()
|
||||||
|
// 导出的加载效果
|
||||||
|
const [showLoading, setShowLoading] = useState<boolean>(false)
|
||||||
|
// 是否显示打印的表格
|
||||||
|
const [showExportTable, setShowExportTable] = useState<boolean>(false)
|
||||||
|
// 查询的条件
|
||||||
|
const [searchParams, setSearchParams] = useState<any>()
|
||||||
|
let SETTLEMENT_MODESObj = session.get('SETTLEMENT_MODESObj')
|
||||||
|
|
||||||
|
const columns: any = [
|
||||||
|
{
|
||||||
|
title: '统计时间',
|
||||||
|
dataIndex: 'search_date',
|
||||||
|
valueType: 'dateRange',
|
||||||
|
hideInTable: true,
|
||||||
|
hideInDescriptions: true,
|
||||||
|
initialValue: [moment().add(1, 'M').startOf('M'), moment().add(1, 'M').endOf('M')],
|
||||||
|
search: {
|
||||||
|
transform: (value: any) => {
|
||||||
|
return {
|
||||||
|
StartDate: value[0],
|
||||||
|
EndDate: value[1],
|
||||||
|
};
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
|
||||||
|
{
|
||||||
|
title: '管理中心',
|
||||||
|
dataIndex: 'SPREGIONTYPE_NAME',
|
||||||
|
width: 200,
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
align: 'center'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '服务区',
|
||||||
|
dataIndex: 'SERVERPART_NAME',
|
||||||
|
width: 200,
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
align: 'center'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '经营商户',
|
||||||
|
dataIndex: 'MERCHANTS_NAME',
|
||||||
|
width: 200,
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
align: 'center'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '门店',
|
||||||
|
dataIndex: 'SERVERPARTSHOP_NAME',
|
||||||
|
width: 200,
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
align: 'center'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '项目名称',
|
||||||
|
dataIndex: 'BUSINESSPROJECT_NAME',
|
||||||
|
width: 200,
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
align: 'center',
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.BUSINESSPROJECT_ID ?
|
||||||
|
<a onClick={() => {
|
||||||
|
setCurrentRow(record)
|
||||||
|
setShowDetail(true)
|
||||||
|
}}>{record?.BUSINESSPROJECT_NAME}</a> : "-"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '经营期数',
|
||||||
|
dataIndex: 'CURRENT_PERIOD',
|
||||||
|
width: 200,
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
align: 'center'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '时限',
|
||||||
|
dataIndex: 'STARTDATEENDDATE',
|
||||||
|
width: 200,
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
align: 'center',
|
||||||
|
render: (_, record) => {
|
||||||
|
return `${record?.STARTDATE ? moment(record?.STARTDATE).format('YYYY/MM/DD') : ""}${record?.ENDDATE ? '-' : ''}${record?.ENDDATE ? moment(record?.ENDDATE).format('YYYY/MM/DD') : ""}`
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "撤场项目",
|
||||||
|
dataIndex: 'PeriodClosed',
|
||||||
|
width: 120,
|
||||||
|
hideInSearch: true,
|
||||||
|
align: 'center',
|
||||||
|
render: (_, record) => {
|
||||||
|
return <span style={{ color: record?.PeriodClosed ? 'red' : '' }}>{record?.PeriodClosed ? '是' : "否"}</span>
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "结算模式",
|
||||||
|
dataIndex: 'SETTLEMENT_MODES',
|
||||||
|
width: 120,
|
||||||
|
hideInSearch: true,
|
||||||
|
align: 'center',
|
||||||
|
valueType: 'select',
|
||||||
|
valueEnum: SETTLEMENT_MODESObj,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "结算日期",
|
||||||
|
dataIndex: 'ENDDATE',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "结算模式",
|
||||||
|
dataIndex: 'SettlementModes',
|
||||||
|
valueType: 'select',
|
||||||
|
hideInTable: true,
|
||||||
|
valueEnum: SETTLEMENT_MODESObj,
|
||||||
|
fieldProps: {
|
||||||
|
mode: 'multiple', // 开启多选模式
|
||||||
|
},
|
||||||
|
initialValue: ["3000", "4000"]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "结算类型",
|
||||||
|
dataIndex: 'SettlementType',
|
||||||
|
valueType: 'select',
|
||||||
|
valueEnum: {
|
||||||
|
"1": "线上",
|
||||||
|
"2": "线下"
|
||||||
|
},
|
||||||
|
hideInTable: true
|
||||||
|
},
|
||||||
|
]
|
||||||
|
|
||||||
|
const exportTable = (e) => {
|
||||||
|
e.stopPropagation(); // 防止Collapse组件收起
|
||||||
|
const main = document.getElementsByClassName(`saleReportHideBox${printIndex}`)[0]
|
||||||
|
const thead = main.querySelector('thead').cloneNode(true); // 深克隆DOM节点
|
||||||
|
const tbody = main.querySelector('tbody').cloneNode(true); // 深克隆DOM节点
|
||||||
|
const container = document.querySelector('#hiddenBox');
|
||||||
|
|
||||||
|
const tempTable = document.createElement('table');
|
||||||
|
tempTable.appendChild(thead);
|
||||||
|
tempTable.appendChild(tbody);
|
||||||
|
|
||||||
|
tempTable.setAttribute('id', 'table-to-xls-settlementProjectForNextMonth'); // 给table添加id，值与按钮上的table字段对应
|
||||||
|
|
||||||
|
container.appendChild(tempTable); // 把创建的节点添加到页面容器中
|
||||||
|
|
||||||
|
setShowLoading(false)
|
||||||
|
|
||||||
|
downloadBtnRef.current.handleDownload();
|
||||||
|
setShowExportTable(false)
|
||||||
|
tempTable.remove() // 防止重复打印一个内容
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div ref={(el) => {
|
||||||
|
// 打印报表
|
||||||
|
if (!reqDetailList || reqDetailList.length === 0) return;
|
||||||
|
setPrintOut(el);
|
||||||
|
}} >
|
||||||
|
|
||||||
|
{
|
||||||
|
showLoading ?
|
||||||
|
<div
|
||||||
|
style={{
|
||||||
|
width: '100%',
|
||||||
|
height: '100%',
|
||||||
|
background: 'rgba(0,0,0,0.1)',
|
||||||
|
position: 'fixed',
|
||||||
|
zIndex: 5,
|
||||||
|
display: 'flex',
|
||||||
|
alignItems: 'center',
|
||||||
|
justifyContent: 'center'
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<div style={{
|
||||||
|
display: 'flex',
|
||||||
|
alignItems: 'center',
|
||||||
|
justifyContent: 'center',
|
||||||
|
padding: '15px 20px 10px',
|
||||||
|
background: '#fff',
|
||||||
|
borderRadius: '8px',
|
||||||
|
width: '200px'
|
||||||
|
}}>
|
||||||
|
<Spin />
|
||||||
|
<span style={{ marginLeft: '5px' }}>数据导出中...</span>
|
||||||
|
</div>
|
||||||
|
</div> : ''
|
||||||
|
}
|
||||||
|
|
||||||
|
<div className={`saleReportHideBox${printIndex}`} style={{ position: 'fixed', zIndex: -1, top: 0, left: 0 }}>
|
||||||
|
{
|
||||||
|
showExportTable && reqDetailList && reqDetailList.length > 0 ?
|
||||||
|
<ProTable
|
||||||
|
columns={columns}
|
||||||
|
dataSource={reqDetailList}
|
||||||
|
pagination={false}
|
||||||
|
expandable={{
|
||||||
|
defaultExpandAllRows: true
|
||||||
|
}}
|
||||||
|
/> : ''
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
<div id='hiddenBox' style={{ position: 'fixed', zIndex: -1, top: 0, left: 0 }} />
|
||||||
|
|
||||||
|
<div style={{ backgroundColor: '#fff', display: 'flex' }}>
|
||||||
|
<LeftSelectTree setSelectedId={setSelectedId} setCollapsible={setCollapsible} collapsible={collapsible} />
|
||||||
|
<div style={{
|
||||||
|
width: !collapsible ? 'calc(100% - 300px)' : 'calc(100% - 60px)',
|
||||||
|
paddingTop: 0,
|
||||||
|
paddingBottom: 0,
|
||||||
|
paddingRight: 0
|
||||||
|
}}>
|
||||||
|
<ProTable
|
||||||
|
actionRef={actionRef}
|
||||||
|
formRef={formRef}
|
||||||
|
columns={columns}
|
||||||
|
bordered
|
||||||
|
expandable={{
|
||||||
|
expandRowByClick: true
|
||||||
|
}}
|
||||||
|
scroll={{ x: "100%", y: "calc(100vh - 410px)" }}
|
||||||
|
headerTitle={<PageTitleBox props={props} />} // 列表表头
|
||||||
|
search={{ span: 6 }}
|
||||||
|
request={async (params) => {
|
||||||
|
if (!selectedId) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
const req: any = {
|
||||||
|
StartDate: params?.StartDate,
|
||||||
|
EndDate: params?.EndDate,
|
||||||
|
ServerpartId: selectedId,
|
||||||
|
SettlementModes: params?.SettlementModes || "",
|
||||||
|
SettlementType: params?.SettlementType || "",
|
||||||
|
}
|
||||||
|
setSearchParams(params)
|
||||||
|
|
||||||
|
const data = await handleGetWillSettleProject(req)
|
||||||
|
console.log('datadatadatadatadata', data);
|
||||||
|
if (data && data.length > 0) {
|
||||||
|
return { data, success: true }
|
||||||
|
}
|
||||||
|
return { data: [], success: true }
|
||||||
|
}}
|
||||||
|
toolbar={{
|
||||||
|
actions: [
|
||||||
|
<span style={{ visibility: 'hidden' }}>
|
||||||
|
<ReactHTMLTableToExcel
|
||||||
|
buttonText={'导出excel'}
|
||||||
|
ref={downloadBtnRef}
|
||||||
|
table="table-to-xls-settlementProjectForNextMonth"
|
||||||
|
filename={`单品销售排行统计${searchParams?.StartDate}-${searchParams?.EndDate}`}
|
||||||
|
sheet="sheet1"
|
||||||
|
/>
|
||||||
|
</span>,
|
||||||
|
<Button
|
||||||
|
key="new"
|
||||||
|
type="primary"
|
||||||
|
onClick={(e) => {
|
||||||
|
if (reqDetailList && reqDetailList.length > 0) {
|
||||||
|
setShowLoading(true)
|
||||||
|
setTimeout(() => {
|
||||||
|
setShowExportTable(true)
|
||||||
|
setTimeout(() => {
|
||||||
|
exportTable(e)
|
||||||
|
}, 100)
|
||||||
|
}, 100)
|
||||||
|
} else {
|
||||||
|
message.error('暂无数据可导出！')
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
导出excel
|
||||||
|
</Button>
|
||||||
|
]
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* 查看项目详情 右侧弹出的抽屉 */}
|
||||||
|
<Drawer
|
||||||
|
width="80%"
|
||||||
|
className="project-drawer"
|
||||||
|
visible={showDetail} // 抽屉弹框是否显示状态
|
||||||
|
onClose={() => { // 关闭抽屉 则在清空选中行数据 并 设置抽屉状态为关闭
|
||||||
|
setCurrentRow(undefined);
|
||||||
|
setShowDetail(false);
|
||||||
|
}}
|
||||||
|
bodyStyle={{ backgroundColor: "#f9f9f9", padding: 0 }}
|
||||||
|
closable={false}
|
||||||
|
>
|
||||||
|
{/* 抽屉打开时 加载项目详情组件 */}
|
||||||
|
{showDetail && <ProjectDetail id={currentRow?.BUSINESSPROJECT_ID} ></ProjectDetail>}
|
||||||
|
</Drawer>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default connect(({ user }: ConnectState) => ({
|
||||||
|
currentUser: user.currentUser
|
||||||
|
}))(settlementProjectForNextMonth);
|
||||||
20
src/pages/reports/settlementProjectForNextMonth/service.ts
Normal file
20
src/pages/reports/settlementProjectForNextMonth/service.ts
Normal file
@ -0,0 +1,20 @@
|
|||||||
|
import request from '@/utils/request';
|
||||||
|
|
||||||
|
export async function handleGetWillSettleProject(params?: any) {
|
||||||
|
const data = await request(`/BusinessProject/GetWillSettleProject`, {
|
||||||
|
method: 'GET',
|
||||||
|
params
|
||||||
|
});
|
||||||
|
|
||||||
|
if (data.Result_Code !== 100) {
|
||||||
|
return {
|
||||||
|
data: [],
|
||||||
|
current: 1,
|
||||||
|
pageSize: 10,
|
||||||
|
total: 0,
|
||||||
|
success: false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return data.Result_Data.List
|
||||||
|
}
|
||||||
|
|
||||||
@ -16,8 +16,9 @@ type DetailProps = {
|
|||||||
modalVisible: boolean //显示属性
|
modalVisible: boolean //显示属性
|
||||||
handleCloseModal: any // 关闭调用的方法
|
handleCloseModal: any // 关闭调用的方法
|
||||||
currentRow: any
|
currentRow: any
|
||||||
|
detailType?: any // 判断是不是点餐的订单详情 可以显示不同内容
|
||||||
}
|
}
|
||||||
const OrderDetailModal = ({ modalVisible, handleCloseModal, currentRow }: DetailProps) => {
|
const OrderDetailModal = ({ modalVisible, handleCloseModal, currentRow, detailType }: DetailProps) => {
|
||||||
const formRef = useRef<FormInstance>();
|
const formRef = useRef<FormInstance>();
|
||||||
const draggleRef = React.createRef<any>()
|
const draggleRef = React.createRef<any>()
|
||||||
const modalRef = useRef<FormInstance>();
|
const modalRef = useRef<FormInstance>();
|
||||||
@ -172,6 +173,28 @@ const OrderDetailModal = ({ modalVisible, handleCloseModal, currentRow }: Detail
|
|||||||
style={{ marginBottom: '16px' }}
|
style={{ marginBottom: '16px' }}
|
||||||
/>
|
/>
|
||||||
</Col>
|
</Col>
|
||||||
|
{
|
||||||
|
detailType === 'food' ?
|
||||||
|
<Col span={8} className="memberInfoDetailItem">
|
||||||
|
<ProFormText
|
||||||
|
name={"SERVERPART_NAME"}
|
||||||
|
label={"服务区"}
|
||||||
|
readonly
|
||||||
|
style={{ marginBottom: '16px' }}
|
||||||
|
/>
|
||||||
|
</Col> : ""
|
||||||
|
}
|
||||||
|
{
|
||||||
|
detailType === 'food' ?
|
||||||
|
<Col span={8} className="memberInfoDetailItem">
|
||||||
|
<ProFormText
|
||||||
|
name={"SHOPNAME"}
|
||||||
|
label={"门店"}
|
||||||
|
readonly
|
||||||
|
style={{ marginBottom: '16px' }}
|
||||||
|
/>
|
||||||
|
</Col> : ""
|
||||||
|
}
|
||||||
<Col span={8} className="memberInfoDetailItem">
|
<Col span={8} className="memberInfoDetailItem">
|
||||||
<ProFormSelect
|
<ProFormSelect
|
||||||
name={"CHANNEL_TYPE"}
|
name={"CHANNEL_TYPE"}
|
||||||
|
|||||||
@ -101,6 +101,14 @@ const BookingMealOrder: React.FC<{ currentUser: CurrentUser | undefined }> = (pr
|
|||||||
}}>{record?.SALEBILL_CODE}</a> : "-"
|
}}>{record?.SALEBILL_CODE}</a> : "-"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
dataIndex: 'SERVERPART_NAME',
|
||||||
|
title: '服务区',
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
width: 150,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
{
|
{
|
||||||
dataIndex: 'SHOPNAME',
|
dataIndex: 'SHOPNAME',
|
||||||
title: '门店名称',
|
title: '门店名称',
|
||||||
@ -325,7 +333,7 @@ const BookingMealOrder: React.FC<{ currentUser: CurrentUser | undefined }> = (pr
|
|||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<OrderDetailModal modalVisible={modalVisible} handleCloseModal={handleCloseModal} currentRow={currentRow} />
|
<OrderDetailModal modalVisible={modalVisible} handleCloseModal={handleCloseModal} currentRow={currentRow} detailType={'food'} />
|
||||||
|
|
||||||
{/* <Modal
|
{/* <Modal
|
||||||
className="BookingMealOrderDetailModal"
|
className="BookingMealOrderDetailModal"
|
||||||
|
|||||||
@ -54,6 +54,10 @@ const GrowthValueRuleConfig: React.FC<{ currentUser: CurrentUser | undefined }>
|
|||||||
const [bounds, setBounds] = useState<{ left: number, right: number, top: number, bottom: number }>() // 移动的位置
|
const [bounds, setBounds] = useState<{ left: number, right: number, top: number, bottom: number }>() // 移动的位置
|
||||||
const [disabled, setDraggleDisabled] = useState<boolean>() // 是否拖动
|
const [disabled, setDraggleDisabled] = useState<boolean>() // 是否拖动
|
||||||
const draggleRef = React.createRef<any>()
|
const draggleRef = React.createRef<any>()
|
||||||
|
// 初始会员等级列表
|
||||||
|
const [defaultMemberLevel, setDefaultMemberLevel] = useState<any>(MEMBERSHIPLEVELYNList)
|
||||||
|
// 晋升后会员等级列表
|
||||||
|
const [promotionMemberLevel, setPromotionMemberLevel] = useState<any>(MEMBERSHIPLEVELYNList)
|
||||||
|
|
||||||
const onDraggaleStart = (event, uiData) => {
|
const onDraggaleStart = (event, uiData) => {
|
||||||
const { clientWidth, clientHeight } = window.document.documentElement;
|
const { clientWidth, clientHeight } = window.document.documentElement;
|
||||||
@ -69,7 +73,6 @@ const GrowthValueRuleConfig: React.FC<{ currentUser: CurrentUser | undefined }>
|
|||||||
});
|
});
|
||||||
};
|
};
|
||||||
// 拖动结束
|
// 拖动结束
|
||||||
|
|
||||||
// 定义列表字段内容
|
// 定义列表字段内容
|
||||||
const columns: any = [
|
const columns: any = [
|
||||||
{
|
{
|
||||||
@ -105,7 +108,7 @@ const GrowthValueRuleConfig: React.FC<{ currentUser: CurrentUser | undefined }>
|
|||||||
title: '会员类型',
|
title: '会员类型',
|
||||||
align: 'center',
|
align: 'center',
|
||||||
width: 120,
|
width: 120,
|
||||||
hideInSearch: true,
|
// hideInSearch: true,
|
||||||
valueType: 'select',
|
valueType: 'select',
|
||||||
valueEnum: MEMBERSHIP_TYPEObj
|
valueEnum: MEMBERSHIP_TYPEObj
|
||||||
},
|
},
|
||||||
@ -133,16 +136,16 @@ const GrowthValueRuleConfig: React.FC<{ currentUser: CurrentUser | undefined }>
|
|||||||
align: 'center',
|
align: 'center',
|
||||||
hideInSearch: true,
|
hideInSearch: true,
|
||||||
},
|
},
|
||||||
{
|
// {
|
||||||
dataIndex: 'GROWTHDAILY_CAP',
|
// dataIndex: 'GROWTHDAILY_CAP',
|
||||||
title: '每日上限',
|
// title: '每日上限',
|
||||||
width: 120,
|
// width: 120,
|
||||||
align: 'center',
|
// align: 'center',
|
||||||
hideInSearch: true,
|
// hideInSearch: true,
|
||||||
},
|
// },
|
||||||
{
|
{
|
||||||
dataIndex: 'GROWTHTOTAL_CAP',
|
dataIndex: 'GROWTHTOTAL_CAP',
|
||||||
title: '总上限值',
|
title: '晋升后成长值',
|
||||||
width: 120,
|
width: 120,
|
||||||
align: 'center',
|
align: 'center',
|
||||||
hideInSearch: true,
|
hideInSearch: true,
|
||||||
@ -222,7 +225,6 @@ const GrowthValueRuleConfig: React.FC<{ currentUser: CurrentUser | undefined }>
|
|||||||
// },
|
// },
|
||||||
];
|
];
|
||||||
|
|
||||||
|
|
||||||
const handelDelete = async (id: number) => {
|
const handelDelete = async (id: number) => {
|
||||||
const result = await handleDeleteGROWTHSETTING({
|
const result = await handleDeleteGROWTHSETTING({
|
||||||
GROWTHSETTINGId: id
|
GROWTHSETTINGId: id
|
||||||
@ -293,7 +295,8 @@ const GrowthValueRuleConfig: React.FC<{ currentUser: CurrentUser | undefined }>
|
|||||||
searchParameter: {
|
searchParameter: {
|
||||||
PROVINCE_CODE: currentUser?.ProvinceCode || "",
|
PROVINCE_CODE: currentUser?.ProvinceCode || "",
|
||||||
OWNERUNIT_ID: 911,
|
OWNERUNIT_ID: 911,
|
||||||
GROWTHSETTING_STATE: params?.GROWTHSETTING_STATE
|
GROWTHSETTING_STATE: params?.GROWTHSETTING_STATE,
|
||||||
|
MEMBERSHIP_TYPES: params?.MEMBERSHIP_TYPE
|
||||||
},
|
},
|
||||||
SortStr: "PROMOTION_LEVEL desc",
|
SortStr: "PROMOTION_LEVEL desc",
|
||||||
PageIndex: 1,
|
PageIndex: 1,
|
||||||
@ -439,7 +442,7 @@ const GrowthValueRuleConfig: React.FC<{ currentUser: CurrentUser | undefined }>
|
|||||||
autoFocusFirstInput
|
autoFocusFirstInput
|
||||||
submitter={false}
|
submitter={false}
|
||||||
preserve={false}
|
preserve={false}
|
||||||
labelCol={{ style: { width: 80 } }}
|
labelCol={{ style: { width: 100 } }}
|
||||||
initialValues={{
|
initialValues={{
|
||||||
...currentRow,
|
...currentRow,
|
||||||
SCORESETTING_STATE: (currentRow?.GROWTHSETTING_STATE || currentRow?.GROWTHSETTING_STATE === 0) ? currentRow?.GROWTHSETTING_STATE : 1,
|
SCORESETTING_STATE: (currentRow?.GROWTHSETTING_STATE || currentRow?.GROWTHSETTING_STATE === 0) ? currentRow?.GROWTHSETTING_STATE : 1,
|
||||||
@ -496,38 +499,6 @@ const GrowthValueRuleConfig: React.FC<{ currentUser: CurrentUser | undefined }>
|
|||||||
options={MEMBERSHIP_TYPEList}
|
options={MEMBERSHIP_TYPEList}
|
||||||
/>
|
/>
|
||||||
</Col>
|
</Col>
|
||||||
<Col span={12}>
|
|
||||||
<ProFormSelect
|
|
||||||
name="MEMBERSHIP_LEVEL"
|
|
||||||
label="会员等级"
|
|
||||||
options={MEMBERSHIPLEVELYNList}
|
|
||||||
/>
|
|
||||||
</Col>
|
|
||||||
<Col span={12}>
|
|
||||||
<ProFormSelect
|
|
||||||
name="PROMOTION_LEVEL"
|
|
||||||
label="晋升等级"
|
|
||||||
options={MEMBERSHIPLEVELYNList}
|
|
||||||
/>
|
|
||||||
</Col>
|
|
||||||
<Col span={12}>
|
|
||||||
<ProFormText
|
|
||||||
name="GROWTH_VALUE"
|
|
||||||
label="所需成长值"
|
|
||||||
/>
|
|
||||||
</Col>
|
|
||||||
<Col span={12}>
|
|
||||||
<ProFormText
|
|
||||||
name="GROWTHDAILY_CAP"
|
|
||||||
label="每日上限"
|
|
||||||
/>
|
|
||||||
</Col>
|
|
||||||
<Col span={12}>
|
|
||||||
<ProFormText
|
|
||||||
name="GROWTHTOTAL_CAP"
|
|
||||||
label="总上限值"
|
|
||||||
/>
|
|
||||||
</Col>
|
|
||||||
<Col span={12}>
|
<Col span={12}>
|
||||||
<ProFormSelect
|
<ProFormSelect
|
||||||
name="GROWTHSETTING_STATE"
|
name="GROWTHSETTING_STATE"
|
||||||
@ -539,6 +510,60 @@ const GrowthValueRuleConfig: React.FC<{ currentUser: CurrentUser | undefined }>
|
|||||||
initialValue={1}
|
initialValue={1}
|
||||||
/>
|
/>
|
||||||
</Col>
|
</Col>
|
||||||
|
<Col span={12}>
|
||||||
|
<ProFormSelect
|
||||||
|
name="MEMBERSHIP_LEVEL"
|
||||||
|
label="会员等级"
|
||||||
|
options={defaultMemberLevel}
|
||||||
|
fieldProps={{
|
||||||
|
onChange: (e: any) => {
|
||||||
|
console.log('e', e);
|
||||||
|
console.log('promotionMemberLevel', promotionMemberLevel);
|
||||||
|
if (promotionMemberLevel && promotionMemberLevel.length > 0) {
|
||||||
|
let list: any = JSON.parse(JSON.stringify(promotionMemberLevel))
|
||||||
|
|
||||||
|
list.forEach((item: any) => {
|
||||||
|
item.disabled = false
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
|
list.forEach((item: any) => {
|
||||||
|
if (Number(item.value) <= Number(e)) {
|
||||||
|
item.disabled = true
|
||||||
|
}
|
||||||
|
})
|
||||||
|
setPromotionMemberLevel(list)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</Col>
|
||||||
|
<Col span={12}>
|
||||||
|
<ProFormSelect
|
||||||
|
name="PROMOTION_LEVEL"
|
||||||
|
label="晋升等级"
|
||||||
|
options={promotionMemberLevel}
|
||||||
|
/>
|
||||||
|
</Col>
|
||||||
|
<Col span={12}>
|
||||||
|
<ProFormText
|
||||||
|
name="GROWTH_VALUE"
|
||||||
|
label="所需成长值"
|
||||||
|
/>
|
||||||
|
</Col>
|
||||||
|
{/* <Col span={12}>
|
||||||
|
<ProFormText
|
||||||
|
name="GROWTHDAILY_CAP"
|
||||||
|
label="每日上限"
|
||||||
|
/>
|
||||||
|
</Col> */}
|
||||||
|
<Col span={12}>
|
||||||
|
<ProFormText
|
||||||
|
name="GROWTHTOTAL_CAP"
|
||||||
|
label="晋升后成长值"
|
||||||
|
/>
|
||||||
|
</Col>
|
||||||
|
|
||||||
|
|
||||||
<Col span={24}>
|
<Col span={24}>
|
||||||
<ProFormTextArea
|
<ProFormTextArea
|
||||||
|
|||||||
@ -366,7 +366,7 @@ const HomepageAds: React.FC<{ currentUser: CurrentUser | undefined }> = (props)
|
|||||||
onFocus={() => { }}
|
onFocus={() => { }}
|
||||||
onBlur={() => { }}
|
onBlur={() => { }}
|
||||||
>
|
>
|
||||||
{currentRow ? '更新会员收货地址' : '新建会员收货地址'}
|
{currentRow ? selectTab === "1" ? '更新首页海报' : '更新首页轮播' : selectTab === "1" ? '新增首页海报' : '新增首页轮播'}
|
||||||
</div>
|
</div>
|
||||||
}
|
}
|
||||||
destroyOnClose={true}
|
destroyOnClose={true}
|
||||||
|
|||||||
@ -52,8 +52,8 @@ const MallOrderManage: React.FC<{ currentUser: CurrentUser }> = (props) => {
|
|||||||
dataIndex: 'searchText',
|
dataIndex: 'searchText',
|
||||||
title: '查询内容',
|
title: '查询内容',
|
||||||
hideInTable: true,
|
hideInTable: true,
|
||||||
fieldProp: {
|
fieldProps: {
|
||||||
placeholder: "请输入供货商/购买的商品/收货人"
|
placeholder: "请输入供货商/购买的商品/订单编号"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@ -373,6 +373,8 @@ const MallOrderManage: React.FC<{ currentUser: CurrentUser }> = (props) => {
|
|||||||
headerTitle={<PageTitleBox props={props} />} // 列表表头
|
headerTitle={<PageTitleBox props={props} />} // 列表表头
|
||||||
search={{ span: 6 }}
|
search={{ span: 6 }}
|
||||||
request={async (params) => {
|
request={async (params) => {
|
||||||
|
console.log('paramsparamsparams', params);
|
||||||
|
|
||||||
const req = {
|
const req = {
|
||||||
SearchParameter: {
|
SearchParameter: {
|
||||||
OWNERUNIT_ID: currentUser?.OwnerUnitId,
|
OWNERUNIT_ID: currentUser?.OwnerUnitId,
|
||||||
@ -380,16 +382,17 @@ const MallOrderManage: React.FC<{ currentUser: CurrentUser }> = (props) => {
|
|||||||
SALEBILL_TYPES: params?.orderType === '0' ? '3000,3001,3002,3010' : params?.orderType,
|
SALEBILL_TYPES: params?.orderType === '0' ? '3000,3001,3002,3010' : params?.orderType,
|
||||||
ORDER_DATE_Start: params?.ORDER_DATE_Start || "",
|
ORDER_DATE_Start: params?.ORDER_DATE_Start || "",
|
||||||
ORDER_DATE_End: params?.ORDER_DATE_End || "",
|
ORDER_DATE_End: params?.ORDER_DATE_End || "",
|
||||||
SALEBILL_STATES: params?.SALEBILL_STATE === "0" ? "1010,2010,3000" : params?.SALEBILL_STATE,
|
SALEBILL_STATES: params?.orderStatus === "0" ? "1010,2010,3000" : params?.orderStatus,
|
||||||
CHANNEL_TYPE: params?.PAY_METHOD === "0" ? "" : params?.PAY_METHOD
|
CHANNEL_TYPE: params?.PAY_METHOD === "0" ? "" : params?.PAY_METHOD,
|
||||||
|
SearchKeyValue: params?.searchText || ""
|
||||||
},
|
},
|
||||||
PageIndex: 1,
|
PageIndex: 1,
|
||||||
PageSize: 999999,
|
PageSize: 999999,
|
||||||
SortStr: "ORDER_DATE desc",
|
SortStr: "ORDER_DATE desc",
|
||||||
keyWord: {
|
// keyWord: {
|
||||||
Key: "MERCHANTS_NAME,ORDER_PERSON,ORDER_PERSONTEL,SALEBILL_CODE,COMMODITY_NAME",
|
// Key: "MERCHANTS_NAME,ORDER_PERSON,ORDER_PERSONTEL,SALEBILL_CODE,COMMODITY_NAME",
|
||||||
Value: params?.searchText || ""
|
// Value: params?.searchText || ""
|
||||||
},
|
// },
|
||||||
}
|
}
|
||||||
console.log('reqreqreqreqreq', req);
|
console.log('reqreqreqreqreq', req);
|
||||||
|
|
||||||
|
|||||||
@ -51,8 +51,8 @@ const OrderAfterSalesManage: React.FC<{ currentUser: CurrentUser }> = (props) =>
|
|||||||
dataIndex: 'searchText',
|
dataIndex: 'searchText',
|
||||||
title: '查询内容',
|
title: '查询内容',
|
||||||
hideInTable: true,
|
hideInTable: true,
|
||||||
fieldProp: {
|
fieldProps: {
|
||||||
placeholder: "请输入购买的商品/订单编号/联系电话/会员名称"
|
placeholder: "请输入购买的商品/订单编号"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@ -78,7 +78,7 @@ const OrderAfterSalesManage: React.FC<{ currentUser: CurrentUser }> = (props) =>
|
|||||||
valueEnum: {
|
valueEnum: {
|
||||||
"0": "全部",
|
"0": "全部",
|
||||||
"8000": "退款申请中",
|
"8000": "退款申请中",
|
||||||
"8020": "退款申请中",
|
"8020": "退款审核中",
|
||||||
"8900": "订单已退款",
|
"8900": "订单已退款",
|
||||||
"9000": "订单已关闭",
|
"9000": "订单已关闭",
|
||||||
},
|
},
|
||||||
@ -170,7 +170,7 @@ const OrderAfterSalesManage: React.FC<{ currentUser: CurrentUser }> = (props) =>
|
|||||||
valueType: "select",
|
valueType: "select",
|
||||||
valueEnum: {
|
valueEnum: {
|
||||||
"8000": "退款申请中",
|
"8000": "退款申请中",
|
||||||
"8020": "退款申请中",
|
"8020": "退款审核中",
|
||||||
"8900": "订单已退款",
|
"8900": "订单已退款",
|
||||||
"9000": "订单已关闭",
|
"9000": "订单已关闭",
|
||||||
},
|
},
|
||||||
@ -276,16 +276,17 @@ const OrderAfterSalesManage: React.FC<{ currentUser: CurrentUser }> = (props) =>
|
|||||||
ORDER_DATE_Start: params?.ORDER_DATE_Start || "",
|
ORDER_DATE_Start: params?.ORDER_DATE_Start || "",
|
||||||
ORDER_DATE_End: params?.ORDER_DATE_End || "",
|
ORDER_DATE_End: params?.ORDER_DATE_End || "",
|
||||||
SALEBILL_STATES: params?.orderStatus === "0" ? "8000,8020,8900,9000" : params?.orderStatus,
|
SALEBILL_STATES: params?.orderStatus === "0" ? "8000,8020,8900,9000" : params?.orderStatus,
|
||||||
SALEBILL_TYPES: "3999"
|
SALEBILL_TYPES: "3999",
|
||||||
|
SearchKeyValue: params?.searchText || ""
|
||||||
// CHANNEL_TYPE: params?.PAY_METHOD === "0" ? "" : params?.PAY_METHOD
|
// CHANNEL_TYPE: params?.PAY_METHOD === "0" ? "" : params?.PAY_METHOD
|
||||||
},
|
},
|
||||||
PageIndex: 1,
|
PageIndex: 1,
|
||||||
PageSize: 999999,
|
PageSize: 999999,
|
||||||
SortStr: "ORDER_DATE desc",
|
SortStr: "ORDER_DATE desc",
|
||||||
keyWord: {
|
// keyWord: {
|
||||||
Key: "ORDER_PERSON,ORDER_PERSONTEL,SALEBILL_CODE,COMMODITY_NAME",
|
// Key: "ORDER_PERSON,ORDER_PERSONTEL,SALEBILL_CODE,COMMODITY_NAME",
|
||||||
Value: params?.searchText || ""
|
// Value: params?.searchText || ""
|
||||||
},
|
// },
|
||||||
|
|
||||||
}
|
}
|
||||||
console.log('reqreqreqreqreq', req);
|
console.log('reqreqreqreqreq', req);
|
||||||
|
|||||||
@ -44,6 +44,7 @@ const LeftSelectMallType = ({ setSelectedId, reload, actionRef, currentUser, wid
|
|||||||
if (USERDEFINEDTYPEList && USERDEFINEDTYPEList.length > 0) {
|
if (USERDEFINEDTYPEList && USERDEFINEDTYPEList.length > 0) {
|
||||||
setTreeView(USERDEFINEDTYPEList)
|
setTreeView(USERDEFINEDTYPEList)
|
||||||
setData(USERDEFINEDTYPEList)
|
setData(USERDEFINEDTYPEList)
|
||||||
|
setAllTreeViews(USERDEFINEDTYPEList)
|
||||||
return USERDEFINEDTYPEList
|
return USERDEFINEDTYPEList
|
||||||
} else {
|
} else {
|
||||||
const req = {
|
const req = {
|
||||||
@ -57,7 +58,7 @@ const LeftSelectMallType = ({ setSelectedId, reload, actionRef, currentUser, wid
|
|||||||
setData(data)
|
setData(data)
|
||||||
|
|
||||||
session.set("USERDEFINEDTYPEList", data)
|
session.set("USERDEFINEDTYPEList", data)
|
||||||
|
setAllTreeViews(data)
|
||||||
return data
|
return data
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -71,18 +72,20 @@ const LeftSelectMallType = ({ setSelectedId, reload, actionRef, currentUser, wid
|
|||||||
// 筛选左侧的服务区树
|
// 筛选左侧的服务区树
|
||||||
const handleFilterServiceTree = async (value?: string) => {
|
const handleFilterServiceTree = async (value?: string) => {
|
||||||
const resList: any = JSON.parse(JSON.stringify(allTreeViews))
|
const resList: any = JSON.parse(JSON.stringify(allTreeViews))
|
||||||
|
console.log('resListresListresListresList', resList);
|
||||||
|
|
||||||
setSelectedId('')
|
setSelectedId('')
|
||||||
if (resList && resList.length > 0 && value) {
|
if (resList && resList.length > 0 && value) {
|
||||||
setTreeView([])
|
setTreeView([])
|
||||||
const list: any = []
|
const list: any = []
|
||||||
resList.forEach((item: any) => {
|
resList.forEach((item: any) => {
|
||||||
if (item.label.indexOf(value) !== -1) {
|
if (item.USERDEFINEDTYPE_NAME.indexOf(value) !== -1) {
|
||||||
list.push(item)
|
list.push(item)
|
||||||
} else {
|
} else {
|
||||||
if (item.children && item.children.length > 0) {
|
if (item.children && item.children.length > 0) {
|
||||||
const childrenList: any = []
|
const childrenList: any = []
|
||||||
item.children.forEach((subItem: any) => {
|
item.children.forEach((subItem: any) => {
|
||||||
if (subItem.label.indexOf(value) !== -1) {
|
if (subItem.USERDEFINEDTYPE_NAME.indexOf(value) !== -1) {
|
||||||
childrenList.push(subItem)
|
childrenList.push(subItem)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
@ -144,9 +147,9 @@ const LeftSelectMallType = ({ setSelectedId, reload, actionRef, currentUser, wid
|
|||||||
className="pageTable-leftnav"
|
className="pageTable-leftnav"
|
||||||
bodyStyle={{ padding: 0, paddingTop: 20, paddingLeft: 20, width: !collapsible ? width ? `${width}px` : "300px" : "60px" }}
|
bodyStyle={{ padding: 0, paddingTop: 20, paddingLeft: 20, width: !collapsible ? width ? `${width}px` : "300px" : "60px" }}
|
||||||
extra={<div className="leftSelectBox">
|
extra={<div className="leftSelectBox">
|
||||||
{/* <img className="searchIcon" src={searchIcon} onClick={() => {
|
<img className="searchIcon" src={searchIcon} onClick={() => {
|
||||||
setShowServiceSearchBox(true)
|
setShowServiceSearchBox(true)
|
||||||
}} /> */}
|
}} />
|
||||||
<MenuFoldOutlined onClick={() => {
|
<MenuFoldOutlined onClick={() => {
|
||||||
setCollapsible(!collapsible);
|
setCollapsible(!collapsible);
|
||||||
}} />
|
}} />
|
||||||
@ -195,32 +198,21 @@ const LeftSelectMallType = ({ setSelectedId, reload, actionRef, currentUser, wid
|
|||||||
>
|
>
|
||||||
{treeView && treeView.length > 0 ? <Tree
|
{treeView && treeView.length > 0 ? <Tree
|
||||||
checkable
|
checkable
|
||||||
treeData={selectOnly
|
treeData={[{
|
||||||
? (isShowAllInTree
|
USERDEFINEDTYPE_NAME: '全部',
|
||||||
? [{
|
value: 0,
|
||||||
label: '全部',
|
USERDEFINEDTYPE_ID: '0-0',
|
||||||
value: 0,
|
children: treeView
|
||||||
key: '0-0',
|
}]}
|
||||||
children: convertTreeForSelectOnly(treeView)
|
|
||||||
}]
|
|
||||||
: convertTreeForSelectOnly(treeView))
|
|
||||||
: (isShowAllInTree
|
|
||||||
? [{
|
|
||||||
USERDEFINEDTYPE_NAME: '全部',
|
|
||||||
value: 0,
|
|
||||||
USERDEFINEDTYPE_ID: '0-0',
|
|
||||||
children: treeView
|
|
||||||
}]
|
|
||||||
: treeView)}
|
|
||||||
blockNode
|
blockNode
|
||||||
// defaultExpandAll={isShowAllInTree ? false : true}
|
// defaultExpandAll={isShowAllInTree ? false : true}
|
||||||
defaultExpandedKeys={isShowAllInTree ? treeShowRow && treeShowRow.length > 0 ? treeShowRow : ['0-0'] : []}
|
defaultExpandedKeys={['0-0']}
|
||||||
onCheck={(checkedKeys: React.Key[] | any, info) => {
|
onCheck={(checkedKeys: React.Key[] | any, info) => {
|
||||||
console.log('checkedKeyscheckedKeyscheckedKeys', checkedKeys);
|
console.log('checkedKeyscheckedKeyscheckedKeys', checkedKeys);
|
||||||
console.log('infoinfoinfoinfoinfoinfo', info);
|
console.log('infoinfoinfoinfoinfoinfo', info);
|
||||||
// 多选逻辑
|
// 多选逻辑
|
||||||
// const selectedIds = info.checkedNodes.filter((n: any) => n?.USERDEFINEDTYPE_PID !== -1)
|
// const selectedIds = info.checkedNodes.filter((n: any) => n?.USERDEFINEDTYPE_PID !== -1)
|
||||||
const selectedIds = info.checkedNodes.filter((n: any) => n?.USERDEFINEDTYPE_ID)
|
const selectedIds = info.checkedNodes.filter((n: any) => n?.USERDEFINEDTYPE_ID !== '0-0')
|
||||||
console.log('selectedIdsselectedIds', selectedIds);
|
console.log('selectedIdsselectedIds', selectedIds);
|
||||||
setSelectedId(selectedIds.map((n: any) => n?.USERDEFINEDTYPE_ID)?.toString() || '')
|
setSelectedId(selectedIds.map((n: any) => n?.USERDEFINEDTYPE_ID)?.toString() || '')
|
||||||
if (reload) {
|
if (reload) {
|
||||||
|
|||||||
@ -960,7 +960,7 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
|
|||||||
// },
|
// },
|
||||||
showSearch: true,
|
showSearch: true,
|
||||||
filterOption: (input, node) =>
|
filterOption: (input, node) =>
|
||||||
(node.BRAND_NAME || '').toLowerCase().includes(input.toLowerCase())
|
(node.label || '').toLowerCase().includes(input.toLowerCase())
|
||||||
}}
|
}}
|
||||||
rules={[
|
rules={[
|
||||||
{
|
{
|
||||||
|
|||||||
@ -253,7 +253,7 @@ const RegistrationRetentionAnalysis: React.FC<{ currentUser: CurrentUser, isComp
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
const handleGetTableData = async () => {
|
const handleGetTableData = async (paramsObj?: any) => {
|
||||||
const res: any = formRef.current?.getFieldsValue()
|
const res: any = formRef.current?.getFieldsValue()
|
||||||
console.log('resresres', res);
|
console.log('resresres', res);
|
||||||
let params: any = {
|
let params: any = {
|
||||||
@ -272,8 +272,8 @@ const RegistrationRetentionAnalysis: React.FC<{ currentUser: CurrentUser, isComp
|
|||||||
USER_MOBILEPHONE: parentDetail?.MEMBERSHIP_MOBILEPHONE
|
USER_MOBILEPHONE: parentDetail?.MEMBERSHIP_MOBILEPHONE
|
||||||
},
|
},
|
||||||
SortStr: 'BEHAVIORRECORD_TIME desc',
|
SortStr: 'BEHAVIORRECORD_TIME desc',
|
||||||
PageIndex: 1,
|
PageIndex: paramsObj.current || 1,
|
||||||
PageSize: 999999
|
PageSize: paramsObj?.pageSize || 999999
|
||||||
} : {
|
} : {
|
||||||
SearchParameter: {
|
SearchParameter: {
|
||||||
BEHAVIORRECORD_TIME_Start: moment(params?.BEHAVIORRECORD_TIME).format('YYYY-MM-DD'),
|
BEHAVIORRECORD_TIME_Start: moment(params?.BEHAVIORRECORD_TIME).format('YYYY-MM-DD'),
|
||||||
@ -403,7 +403,7 @@ const RegistrationRetentionAnalysis: React.FC<{ currentUser: CurrentUser, isComp
|
|||||||
setting: true
|
setting: true
|
||||||
}}
|
}}
|
||||||
request={async (params) => {
|
request={async (params) => {
|
||||||
handleGetTableData()
|
handleGetTableData(params)
|
||||||
// if (!isFirst) {
|
// if (!isFirst) {
|
||||||
// handleGetTableData()
|
// handleGetTableData()
|
||||||
// }
|
// }
|
||||||
|
|||||||
@ -0,0 +1,258 @@
|
|||||||
|
.SupplierOrderStatisticsMain {
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
.SupplierOrderStatisticsTop {
|
||||||
|
width: 100%;
|
||||||
|
background: #FFFFFF;
|
||||||
|
box-shadow: 0px 0px 6px 0px rgba(31, 48, 95, 0.2);
|
||||||
|
border-radius: 4px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 16px;
|
||||||
|
|
||||||
|
.SupplierOrderStatisticsTitleBox {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.SupplierOrderStatisticsTitle {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 18px;
|
||||||
|
color: #333333;
|
||||||
|
line-height: 18px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
margin-left: 12px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.SupplierOrderStatisticsTitle::after {
|
||||||
|
content: "";
|
||||||
|
width: 4px;
|
||||||
|
height: 18px;
|
||||||
|
background: #1492FF;
|
||||||
|
border-radius: 2px;
|
||||||
|
position: absolute;
|
||||||
|
left: -12px;
|
||||||
|
top: 50%;
|
||||||
|
transform: translateY(-50%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.SupplierOrderStatisticsContentBox {
|
||||||
|
width: 100%;
|
||||||
|
margin-top: 16px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
// .SupplierOrderStatisticsItemFirst {
|
||||||
|
// width: 280px;
|
||||||
|
// height: 180px;
|
||||||
|
// background-image: url('../../../assets/detail/staticSumTotalBg.png');
|
||||||
|
// background-size: 100% 100%;
|
||||||
|
// background-repeat: no-repeat;
|
||||||
|
// box-sizing: border-box;
|
||||||
|
// padding: 26px 39px;
|
||||||
|
// margin-right: 16px;
|
||||||
|
|
||||||
|
// .firstItemTitle {
|
||||||
|
// font-family: PingFangSC, PingFang SC;
|
||||||
|
// font-weight: 500;
|
||||||
|
// font-size: 18px;
|
||||||
|
// color: #FFFFFF;
|
||||||
|
// line-height: 13px;
|
||||||
|
// text-align: left;
|
||||||
|
// font-style: normal;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// .firstItemValue {
|
||||||
|
// font-family: DINAlternate, DINAlternate;
|
||||||
|
// font-weight: bold;
|
||||||
|
// font-size: 28px;
|
||||||
|
// color: #FFFFFF;
|
||||||
|
// line-height: 32px;
|
||||||
|
// text-align: left;
|
||||||
|
// font-style: normal;
|
||||||
|
// margin-top: 12px;
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
|
||||||
|
.SupplierOrderStatisticsItemOther {
|
||||||
|
width: 100%;
|
||||||
|
height: 180px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.SupplierOrderStatisticsOtherItem {
|
||||||
|
width: calc((100% - 112px) / 7);
|
||||||
|
height: 100%;
|
||||||
|
background: #F6F9FF;
|
||||||
|
border-radius: 8px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 29px 24px;
|
||||||
|
position: relative;
|
||||||
|
cursor: pointer;
|
||||||
|
|
||||||
|
.otherItemTitle {
|
||||||
|
height: 36px;
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #333333;
|
||||||
|
line-height: 18px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.otherItemValue {
|
||||||
|
font-family: DINAlternate, DINAlternate;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 32px;
|
||||||
|
color: #1492FF;
|
||||||
|
line-height: 38px;
|
||||||
|
text-align: left;
|
||||||
|
margin-top: 17px;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.addLabel {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 12px;
|
||||||
|
color: rgba(0, 0, 0, 0.65);
|
||||||
|
line-height: 12px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
margin-right: 5px;
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.otherItemAddBox {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: 10px;
|
||||||
|
|
||||||
|
|
||||||
|
.addIcon {
|
||||||
|
width: 7px;
|
||||||
|
height: 10px;
|
||||||
|
margin-right: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.addValue {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 16px;
|
||||||
|
color: rgba(0, 0, 0, 0.65);
|
||||||
|
line-height: 16px;
|
||||||
|
text-align: center;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// .otherBgIcon {
|
||||||
|
// width: 76px;
|
||||||
|
// height: 51px;
|
||||||
|
// position: absolute;
|
||||||
|
// top: 29px;
|
||||||
|
// right: 4px;
|
||||||
|
// background-image: url(../../../assets/detail/otherBgIcon.png);
|
||||||
|
// background-repeat: no-repeat;
|
||||||
|
// background-size: 100% 100%;
|
||||||
|
// }
|
||||||
|
}
|
||||||
|
|
||||||
|
.SupplierOrderStatisticsOtherItemSelect {
|
||||||
|
background-image: url('../../../assets/detail/staticSumTotalBg.png');
|
||||||
|
background-size: 100% 100%;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
|
||||||
|
.otherItemTitle {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #fff;
|
||||||
|
line-height: 18px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.otherItemValue {
|
||||||
|
font-family: DINAlternate, DINAlternate;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 32px;
|
||||||
|
color: #fff;
|
||||||
|
line-height: 38px;
|
||||||
|
text-align: left;
|
||||||
|
margin-top: 17px;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.addLabel {
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.otherItemAddBox {
|
||||||
|
|
||||||
|
.addValue {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #fff;
|
||||||
|
line-height: 16px;
|
||||||
|
text-align: center;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.SupplierOrderStatisticsBottom {
|
||||||
|
width: 100%;
|
||||||
|
margin-top: 16px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
background: #FFFFFF;
|
||||||
|
box-shadow: 0px 0px 6px 0px rgba(31, 48, 95, 0.2);
|
||||||
|
border-radius: 4px;
|
||||||
|
padding: 16px;
|
||||||
|
|
||||||
|
.SupplierOrderStatisticsTitleBox {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.SupplierOrderStatisticsTitle {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 18px;
|
||||||
|
color: #333333;
|
||||||
|
line-height: 18px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
margin-left: 12px;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.SupplierOrderStatisticsTitle::after {
|
||||||
|
content: "";
|
||||||
|
width: 4px;
|
||||||
|
height: 18px;
|
||||||
|
background: #1492FF;
|
||||||
|
border-radius: 2px;
|
||||||
|
position: absolute;
|
||||||
|
left: -12px;
|
||||||
|
top: 50%;
|
||||||
|
transform: translateY(-50%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,242 @@
|
|||||||
|
import { connect } from "umi";
|
||||||
|
import type { ConnectState } from "@/models/connect";
|
||||||
|
import ProCard from "@ant-design/pro-card";
|
||||||
|
import searchIcon from '@/assets/ai/searchIcon.png'
|
||||||
|
import { useRef, useState } from "react";
|
||||||
|
import { MenuFoldOutlined } from "@ant-design/icons";
|
||||||
|
import ProForm, { ProFormText } from "@ant-design/pro-form";
|
||||||
|
import { Button, Col, FormInstance, Row, Tree } from "antd";
|
||||||
|
import close from '@/assets/ai/close.png'
|
||||||
|
import { getServerpartTree } from "@/services/options";
|
||||||
|
import useRequest from "@ahooksjs/use-request";
|
||||||
|
import './style.less'
|
||||||
|
import { getMerchantShopTree } from "@/pages/Setting/Users/service";
|
||||||
|
import session from "@/utils/session";
|
||||||
|
import { handeGetMERCHANTSList } from "../../service";
|
||||||
|
|
||||||
|
|
||||||
|
type DetailProps = {
|
||||||
|
setSelectedId: any; // 把选择的服务区 可以带给外层
|
||||||
|
reload?: boolean; // 选择服务区 是否可以刷新组件之外的内容
|
||||||
|
actionRef?: any; // 和reload配合使用 确认要刷新的内容
|
||||||
|
currentUser: any; // 当前用户的信息
|
||||||
|
width?: number; // 组件的宽度
|
||||||
|
otherFun?: any; // 点击之后要进行的其他操作 多个操作可以写在一个方法里面传进来
|
||||||
|
setCollapsible: any; // 是否收缩组件
|
||||||
|
collapsible: boolean; // 收缩组件的判断依据
|
||||||
|
haveTest?: boolean;// 是否有测试服务区
|
||||||
|
handleGetLeftTreeData?: any // 拿到树数据的方法 必须要有输出值的
|
||||||
|
noWj?: any // 把万佳商贸隐藏
|
||||||
|
selectOnly?: boolean// 传入的时候 仅支持单选
|
||||||
|
}
|
||||||
|
const SupplierLeftSelectTree = ({ setSelectedId, reload, actionRef, currentUser, width, otherFun, setCollapsible, collapsible, haveTest, handleGetLeftTreeData, noWj, selectOnly }: DetailProps) => {
|
||||||
|
const searchTreeRef = useRef<FormInstance>();
|
||||||
|
// 默认的服务区树
|
||||||
|
const [allTreeViews, setAllTreeViews] = useState<any>()
|
||||||
|
// 是否要显示全部
|
||||||
|
const [isShowAllInTree, setIsShowAllInTree] = useState<boolean>(false)
|
||||||
|
// 加载服务区树
|
||||||
|
const { loading: treeLoading, data: treeViews } = useRequest(async () => {
|
||||||
|
const req = {
|
||||||
|
searchParameter: {
|
||||||
|
OWNERUNIT_ID: currentUser?.OwnerUnitId,
|
||||||
|
PROVINCE_CODE: currentUser?.ProvinceCode,
|
||||||
|
MERCHANTS_TYPE: '',
|
||||||
|
MERCHANTS_AUTOTYPE: '',
|
||||||
|
MERCHANTS_STATE: 1
|
||||||
|
},
|
||||||
|
PageIndex: 1,
|
||||||
|
PageSize: 999999,
|
||||||
|
}
|
||||||
|
const data = await handeGetMERCHANTSList(req);
|
||||||
|
console.log('data', data);
|
||||||
|
|
||||||
|
let list: any = data.List
|
||||||
|
setTreeView(list)
|
||||||
|
return list
|
||||||
|
})
|
||||||
|
// 显示服务区树搜索框
|
||||||
|
const [showServiceSearchBox, setShowServiceSearchBox] = useState<boolean>(false)
|
||||||
|
// 实际显示在左侧的服务区树
|
||||||
|
const [treeView, setTreeView] = useState<any>()
|
||||||
|
// 树要展开的行
|
||||||
|
const [treeShowRow, setTreeShowRow] = useState<any>()
|
||||||
|
// 筛选左侧的服务区树
|
||||||
|
const handleFilterServiceTree = async (value?: string) => {
|
||||||
|
const resList: any = JSON.parse(JSON.stringify(allTreeViews))
|
||||||
|
setSelectedId('')
|
||||||
|
if (resList && resList.length > 0 && value) {
|
||||||
|
setTreeView([])
|
||||||
|
const list: any = []
|
||||||
|
resList.forEach((item: any) => {
|
||||||
|
if (item.label.indexOf(value) !== -1) {
|
||||||
|
list.push(item)
|
||||||
|
} else {
|
||||||
|
if (item.children && item.children.length > 0) {
|
||||||
|
const childrenList: any = []
|
||||||
|
item.children.forEach((subItem: any) => {
|
||||||
|
if (subItem.label.indexOf(value) !== -1) {
|
||||||
|
childrenList.push(subItem)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
item.children = childrenList
|
||||||
|
if (childrenList && childrenList.length > 0) {
|
||||||
|
list.push(item)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
if (list && list.length > 0) {
|
||||||
|
const keyList: any = ['0-0']
|
||||||
|
list.forEach((item: any) => {
|
||||||
|
keyList.push(item.key)
|
||||||
|
})
|
||||||
|
setTreeShowRow(keyList)
|
||||||
|
}
|
||||||
|
setTimeout(() => {
|
||||||
|
setTreeView(list)
|
||||||
|
}, 100)
|
||||||
|
} else {
|
||||||
|
setTreeView([])
|
||||||
|
setTreeShowRow([])
|
||||||
|
setTreeView(allTreeViews)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 根据传入的服务区id筛选剔除掉这个服务区
|
||||||
|
const handleFilterList = (list: any, id: any) => {
|
||||||
|
let res: any = []
|
||||||
|
list.forEach((item: any) => {
|
||||||
|
if (item.value === id) {
|
||||||
|
|
||||||
|
} else {
|
||||||
|
res.push(item)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
console.log('res', res);
|
||||||
|
return res
|
||||||
|
}
|
||||||
|
|
||||||
|
// 仅支持单选一个服务区的时候 调用的方法
|
||||||
|
const convertTreeForSelectOnly = (treeData: any[]): any[] => {
|
||||||
|
return treeData.map(item => {
|
||||||
|
const newItem = {
|
||||||
|
...item,
|
||||||
|
disabled: item.type !== 1,
|
||||||
|
};
|
||||||
|
if (item.children) {
|
||||||
|
newItem.children = convertTreeForSelectOnly(item.children);
|
||||||
|
}
|
||||||
|
return newItem;
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div>
|
||||||
|
<ProCard
|
||||||
|
style={{ width: !collapsible ? width ? `${width}px` : "300px" : "60px" }}
|
||||||
|
className="pageTable-leftnav"
|
||||||
|
bodyStyle={{ padding: 0, paddingTop: 20, paddingLeft: 20, width: !collapsible ? width ? `${width}px` : "300px" : "60px" }}
|
||||||
|
extra={<div className="leftSelectBox">
|
||||||
|
<img className="searchIcon" src={searchIcon} onClick={() => {
|
||||||
|
setShowServiceSearchBox(true)
|
||||||
|
}} />
|
||||||
|
<MenuFoldOutlined onClick={() => {
|
||||||
|
setCollapsible(!collapsible);
|
||||||
|
}} />
|
||||||
|
<div className="fixedBox" style={{ display: showServiceSearchBox ? 'flex' : 'none', width: width ? `${width}px` : '275px' }}>
|
||||||
|
<ProForm
|
||||||
|
formRef={searchTreeRef}
|
||||||
|
layout={'horizontal'}
|
||||||
|
submitter={{
|
||||||
|
render: () => {
|
||||||
|
return []
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
isKeyPressSubmit
|
||||||
|
onFinish={(values: any) => {
|
||||||
|
return handleFilterServiceTree(values?.searchValue || '')
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<Row>
|
||||||
|
<Col span={15} className={'noBottom'}>
|
||||||
|
<ProFormText
|
||||||
|
name={'searchValue'}
|
||||||
|
fieldProps={{
|
||||||
|
placeholder: '请输入服务区名称'
|
||||||
|
}}
|
||||||
|
allowClear
|
||||||
|
/>
|
||||||
|
</Col>
|
||||||
|
<Col span={2}></Col>
|
||||||
|
<Col span={5}>
|
||||||
|
<Button type={'primary'} onClick={() => {
|
||||||
|
searchTreeRef.current?.submit()
|
||||||
|
}}>查询</Button>
|
||||||
|
</Col>
|
||||||
|
</Row>
|
||||||
|
|
||||||
|
</ProForm>
|
||||||
|
<img style={{ width: '20px', height: '20px', cursor: 'pointer', marginLeft: '5px' }} src={close} onClick={() => {
|
||||||
|
setShowServiceSearchBox(false)
|
||||||
|
}} />
|
||||||
|
</div>
|
||||||
|
</div>}
|
||||||
|
colSpan={!collapsible ? "300px" : "60px"}
|
||||||
|
title={!collapsible ? "请选择服务区" : ""}
|
||||||
|
headerBordered
|
||||||
|
collapsed={collapsible}
|
||||||
|
>
|
||||||
|
{treeView && treeView.length > 0 ? <Tree
|
||||||
|
checkable
|
||||||
|
treeData={[{
|
||||||
|
MERCHANTS_NAME: '全部',
|
||||||
|
value: 0,
|
||||||
|
MERCHANTS_ID: '0-0',
|
||||||
|
children: treeView
|
||||||
|
}]}
|
||||||
|
blockNodes
|
||||||
|
defaultExpandAll={true}
|
||||||
|
defaultExpandedKeys={['0-0']}
|
||||||
|
onCheck={(checkedKeys: React.Key[] | any, info) => {
|
||||||
|
if (selectOnly) {
|
||||||
|
// 只允许单选且只允许type为1
|
||||||
|
const checked = Array.isArray(checkedKeys.checked) ? checkedKeys.checked : checkedKeys;
|
||||||
|
const node = info.node;
|
||||||
|
if (node.type === 1) {
|
||||||
|
setSelectedId(node.value);
|
||||||
|
if (reload) {
|
||||||
|
actionRef?.current?.reload();
|
||||||
|
}
|
||||||
|
if (otherFun) {
|
||||||
|
otherFun(info);
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
// 取消非type=1的勾选
|
||||||
|
setSelectedId('');
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
// 多选逻辑
|
||||||
|
const selectedIds = info.checkedNodes.filter((n: any) => n?.MERCHANTS_ID)
|
||||||
|
// const selectedIds = info.checkedNodes
|
||||||
|
setSelectedId(selectedIds.map((n: any) => n?.MERCHANTS_ID)?.toString() || '')
|
||||||
|
if (reload) {
|
||||||
|
actionRef?.current?.reload()
|
||||||
|
}
|
||||||
|
if (otherFun) {
|
||||||
|
otherFun(info)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
fieldNames={{
|
||||||
|
title: "MERCHANTS_NAME",
|
||||||
|
key: "MERCHANTS_ID"
|
||||||
|
}}
|
||||||
|
/> : ''}
|
||||||
|
</ProCard>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default connect(({ user }: ConnectState) => ({
|
||||||
|
currentUser: user.currentUser,
|
||||||
|
}))(SupplierLeftSelectTree);
|
||||||
@ -0,0 +1,29 @@
|
|||||||
|
.pageTable-leftnav{
|
||||||
|
.leftSelectBox{
|
||||||
|
position: relative;
|
||||||
|
.searchIcon{
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
cursor: pointer;
|
||||||
|
margin-right: 15px;
|
||||||
|
}
|
||||||
|
.fixedBox{
|
||||||
|
position: absolute;
|
||||||
|
width: 275px;
|
||||||
|
background: #fff;
|
||||||
|
right: -10px;
|
||||||
|
box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 9px 28px 8px rgba(0, 0, 0, 0.05);
|
||||||
|
border-radius: 8px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 12px;
|
||||||
|
z-index: 2;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
.noBottom{
|
||||||
|
.ant-form-item{
|
||||||
|
margin-bottom: 0!important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
785
src/pages/travelMember/SupplierOrderStatistics/index.tsx
Normal file
785
src/pages/travelMember/SupplierOrderStatistics/index.tsx
Normal file
@ -0,0 +1,785 @@
|
|||||||
|
import { connect } from "umi";
|
||||||
|
import type { CurrentUser } from "umi";
|
||||||
|
import type { ConnectState } from "@/models/connect";
|
||||||
|
import React, { useRef, useState } from "react";
|
||||||
|
import ProCard from "@ant-design/pro-card";
|
||||||
|
import { MenuFoldOutlined } from "@ant-design/icons";
|
||||||
|
import type { FormInstance } from "antd";
|
||||||
|
import { Button, message, Space, Spin, Tree } from "antd";
|
||||||
|
import useRequest from "@ahooksjs/use-request";
|
||||||
|
import { getServerpartTree } from "@/services/options";
|
||||||
|
import type { ActionType } from "@ant-design/pro-table";
|
||||||
|
import ProTable from "@ant-design/pro-table";
|
||||||
|
import ReactHTMLTableToExcel from "react-html-table-to-excel";
|
||||||
|
import LeftSelectTree from "@/pages/reports/settlementAccount/component/leftSelectTree";
|
||||||
|
import PageTitleBox from "@/components/PageTitleBox";
|
||||||
|
import SupplierLeftSelectTree from "./components/SupplierLeftSelectTree";
|
||||||
|
import { handeGetGetOnlineOrderSummary } from "../service";
|
||||||
|
import moment from 'moment'
|
||||||
|
|
||||||
|
|
||||||
|
const SupplierOrderStatistics: React.FC<{ currentUser: CurrentUser }> = (props) => {
|
||||||
|
const { currentUser } = props
|
||||||
|
const downloadBtnRef = useRef<any>()
|
||||||
|
const actionRef = useRef<ActionType>();
|
||||||
|
const formRef = useRef<FormInstance>();
|
||||||
|
const [reqDetailList, setReqDetailList] = useState<any>(); // 合计项数据源
|
||||||
|
const [printOut, setPrintOut] = useState<any>(); // 打印数据的内容
|
||||||
|
const [collapsible, setCollapsible] = useState<boolean>(false)
|
||||||
|
const [treeView, setTreeView] = useState<any>()
|
||||||
|
const [printIndex, setPrintIndex] = useState<number>(new Date().getTime())
|
||||||
|
|
||||||
|
|
||||||
|
// 树相关的属性和方法
|
||||||
|
const [selectedId, setSelectedId] = useState<string>()
|
||||||
|
// 导出的加载效果
|
||||||
|
const [showLoading, setShowLoading] = useState<boolean>(false)
|
||||||
|
// 是否显示打印的表格
|
||||||
|
const [showExportTable, setShowExportTable] = useState<boolean>(false)
|
||||||
|
// 查询的条件
|
||||||
|
const [searchParams, setSearchParams] = useState<any>()
|
||||||
|
|
||||||
|
const [columnsStateMap, setColumnsStateMap] = useState<any>({
|
||||||
|
'TotalActualAmount.maxData': { show: false },
|
||||||
|
'TotalActualAmount.minData': { show: false },
|
||||||
|
'TotalActualAmount.avgData': { show: false },
|
||||||
|
'TotalActualAmount.YOYData': { show: false },
|
||||||
|
'TotalActualAmount.QOQData': { show: false },
|
||||||
|
|
||||||
|
'TotalSuccAmount.maxData': { show: false },
|
||||||
|
'TotalSuccAmount.minData': { show: false },
|
||||||
|
'TotalSuccAmount.avgData': { show: false },
|
||||||
|
'TotalSuccAmount.YOYData': { show: false },
|
||||||
|
'TotalSuccAmount.QOQData': { show: false },
|
||||||
|
|
||||||
|
'TotalSuccTicket.maxData': { show: false },
|
||||||
|
'TotalSuccTicket.minData': { show: false },
|
||||||
|
'TotalSuccTicket.avgData': { show: false },
|
||||||
|
'TotalSuccTicket.YOYData': { show: false },
|
||||||
|
'TotalSuccTicket.QOQData': { show: false },
|
||||||
|
|
||||||
|
'TotalCount.maxData': { show: false },
|
||||||
|
'TotalCount.minData': { show: false },
|
||||||
|
'TotalCount.avgData': { show: false },
|
||||||
|
'TotalCount.YOYData': { show: false },
|
||||||
|
'TotalCount.QOQData': { show: false },
|
||||||
|
|
||||||
|
'TotalFailureTicket.maxData': { show: false },
|
||||||
|
'TotalFailureTicket.minData': { show: false },
|
||||||
|
'TotalFailureTicket.avgData': { show: false },
|
||||||
|
'TotalFailureTicket.YOYData': { show: false },
|
||||||
|
'TotalFailureTicket.QOQData': { show: false },
|
||||||
|
|
||||||
|
'TotalRefundTicket.maxData': { show: false },
|
||||||
|
'TotalRefundTicket.minData': { show: false },
|
||||||
|
'TotalRefundTicket.avgData': { show: false },
|
||||||
|
'TotalRefundTicket.YOYData': { show: false },
|
||||||
|
'TotalRefundTicket.QOQData': { show: false },
|
||||||
|
|
||||||
|
'TotalRefundAmount.maxData': { show: false },
|
||||||
|
'TotalRefundAmount.minData': { show: false },
|
||||||
|
'TotalRefundAmount.avgData': { show: false },
|
||||||
|
'TotalRefundAmount.YOYData': { show: false },
|
||||||
|
'TotalRefundAmount.QOQData': { show: false },
|
||||||
|
});
|
||||||
|
|
||||||
|
const columns: any = [
|
||||||
|
{
|
||||||
|
title: '统计时间',
|
||||||
|
dataIndex: 'search_date',
|
||||||
|
valueType: 'dateRange',
|
||||||
|
hideInTable: true,
|
||||||
|
hideInDescriptions: true,
|
||||||
|
initialValue: [moment().subtract(1, 'month'), moment()],
|
||||||
|
search: {
|
||||||
|
transform: (value: any) => {
|
||||||
|
return {
|
||||||
|
StartDate: value[0],
|
||||||
|
EndDate: value[1],
|
||||||
|
};
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: 'StatisticalName',
|
||||||
|
title: '供应商名称',
|
||||||
|
width: 250,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
fixed: 'left'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: 'TotalActualAmount',
|
||||||
|
title: '实际销售金额（扣除退款）',
|
||||||
|
hideInSearch: true,
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalActualAmount', 'summaryData'],
|
||||||
|
key: "TotalActualAmount.summaryData",
|
||||||
|
title: '合计值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalActualAmount', 'maxData'],
|
||||||
|
key: "TotalActualAmount.maxData",
|
||||||
|
title: '最大值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalActualAmount', 'minData'],
|
||||||
|
key: "TotalActualAmount.minData",
|
||||||
|
title: '最小值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalActualAmount', 'avgData'],
|
||||||
|
key: "TotalActualAmount.avgData",
|
||||||
|
title: '平均值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalActualAmount', 'YOYData'],
|
||||||
|
key: "TotalActualAmount.YOYData",
|
||||||
|
title: '同比数值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalActualAmount', 'YOYDataAdd'],
|
||||||
|
key: "TotalActualAmount.YOYDataAdd",
|
||||||
|
title: '同比增长',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.TotalActualAmount?.YOYData && record?.TotalActualAmount?.summaryData ? (((record?.TotalActualAmount?.summaryData - record?.TotalActualAmount?.YOYData) / record?.TotalActualAmount?.YOYData) * 100).toFixed(2) + '%' : "-"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalActualAmount', 'QOQData'],
|
||||||
|
key: "TotalActualAmount.QOQData",
|
||||||
|
title: '环比数值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: 'TotalSuccAmount',
|
||||||
|
title: '成交销售金额',
|
||||||
|
hideInSearch: true,
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalSuccAmount', 'summaryData'],
|
||||||
|
key: "TotalSuccAmount.summaryData",
|
||||||
|
title: '合计值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalSuccAmount', 'maxData'],
|
||||||
|
key: "TotalSuccAmount.maxData",
|
||||||
|
title: '最大值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalSuccAmount', 'minData'],
|
||||||
|
key: "TotalSuccAmount.minData",
|
||||||
|
title: '最小值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalSuccAmount', 'avgData'],
|
||||||
|
key: "TotalSuccAmount.avgData",
|
||||||
|
title: '平均值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalSuccAmount', 'YOYData'],
|
||||||
|
key: "TotalSuccAmount.YOYData",
|
||||||
|
title: '同比数值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalSuccAmount', 'YOYDataAdd'],
|
||||||
|
key: "TotalSuccAmount.YOYDataAdd",
|
||||||
|
title: '同比增长',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.TotalSuccAmount?.YOYData && record?.TotalSuccAmount?.summaryData ? (((record?.TotalSuccAmount?.summaryData - record?.TotalSuccAmount?.YOYData) / record?.TotalSuccAmount?.YOYData) * 100).toFixed(2) + '%' : "-"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalSuccAmount', 'QOQData'],
|
||||||
|
key: "TotalSuccAmount.QOQData",
|
||||||
|
title: '环比数值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: 'TotalSuccTicket',
|
||||||
|
title: '成交订单笔数',
|
||||||
|
hideInSearch: true,
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalSuccTicket', 'summaryData'],
|
||||||
|
key: "TotalSuccTicket.summaryData",
|
||||||
|
title: '合计值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalSuccTicket', 'maxData'],
|
||||||
|
key: "TotalSuccTicket.maxData",
|
||||||
|
title: '最大值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalSuccTicket', 'minData'],
|
||||||
|
key: "TotalSuccTicket.minData",
|
||||||
|
title: '最小值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalSuccTicket', 'avgData'],
|
||||||
|
key: "TotalSuccTicket.avgData",
|
||||||
|
title: '平均值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalSuccTicket', 'YOYData'],
|
||||||
|
key: "TotalSuccTicket.YOYData",
|
||||||
|
title: '同比数值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalSuccTicket', 'YOYDataAdd'],
|
||||||
|
key: "TotalSuccTicket.YOYDataAdd",
|
||||||
|
title: '同比增长',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.TotalSuccTicket?.YOYData && record?.TotalSuccTicket?.summaryData ? (((record?.TotalSuccTicket?.summaryData - record?.TotalSuccTicket?.YOYData) / record?.TotalSuccTicket?.YOYData) * 100).toFixed(2) + '%' : "-"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalSuccTicket', 'QOQData'],
|
||||||
|
key: "TotalSuccTicket.QOQData",
|
||||||
|
title: '环比数值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: 'TotalCount',
|
||||||
|
title: '成交销售数量',
|
||||||
|
hideInSearch: true,
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalCount', 'summaryData'],
|
||||||
|
key: "TotalCount.summaryData",
|
||||||
|
title: '合计值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalCount', 'maxData'],
|
||||||
|
key: "TotalCount.maxData",
|
||||||
|
title: '最大值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalCount', 'minData'],
|
||||||
|
key: "TotalCount.minData",
|
||||||
|
title: '最小值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalCount', 'avgData'],
|
||||||
|
key: "TotalCount.avgData",
|
||||||
|
title: '平均值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalCount', 'YOYData'],
|
||||||
|
key: "TotalCount.YOYData",
|
||||||
|
title: '同比数值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalCount', 'YOYDataAdd'],
|
||||||
|
key: "TotalCount.YOYDataAdd",
|
||||||
|
title: '同比增长',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.TotalCount?.YOYData && record?.TotalCount?.summaryData ? (((record?.TotalCount?.summaryData - record?.TotalCount?.YOYData) / record?.TotalCount?.YOYData) * 100).toFixed(2) + '%' : "-"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalCount', 'QOQData'],
|
||||||
|
key: "TotalCount.QOQData",
|
||||||
|
title: '环比数值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: 'TotalFailureTicket',
|
||||||
|
title: '交易失败笔数',
|
||||||
|
hideInSearch: true,
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalFailureTicket', 'summaryData'],
|
||||||
|
key: "TotalFailureTicket.summaryData",
|
||||||
|
title: '合计值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalFailureTicket', 'maxData'],
|
||||||
|
key: "TotalFailureTicket.maxData",
|
||||||
|
title: '最大值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalFailureTicket', 'minData'],
|
||||||
|
key: "TotalFailureTicket.minData",
|
||||||
|
title: '最小值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalFailureTicket', 'avgData'],
|
||||||
|
key: "TotalFailureTicket.avgData",
|
||||||
|
title: '平均值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalFailureTicket', 'YOYData'],
|
||||||
|
key: "TotalFailureTicket.YOYData",
|
||||||
|
title: '同比数值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalFailureTicket', 'YOYDataAdd'],
|
||||||
|
key: "TotalFailureTicket.YOYDataAdd",
|
||||||
|
title: '同比增长',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.TotalFailureTicket?.YOYData && record?.TotalFailureTicket?.summaryData ? (((record?.TotalFailureTicket?.summaryData - record?.TotalFailureTicket?.YOYData) / record?.TotalFailureTicket?.YOYData) * 100).toFixed(2) + '%' : "-"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalFailureTicket', 'QOQData'],
|
||||||
|
key: "TotalFailureTicket.QOQData",
|
||||||
|
title: '环比数值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: 'TotalRefundTicket',
|
||||||
|
title: '退款订单笔数',
|
||||||
|
hideInSearch: true,
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalRefundTicket', 'summaryData'],
|
||||||
|
key: "TotalRefundTicket.summaryData",
|
||||||
|
title: '合计值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalRefundTicket', 'maxData'],
|
||||||
|
key: "TotalRefundTicket.maxData",
|
||||||
|
title: '最大值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalRefundTicket', 'minData'],
|
||||||
|
key: "TotalRefundTicket.minData",
|
||||||
|
title: '最小值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalRefundTicket', 'avgData'],
|
||||||
|
key: "TotalRefundTicket.avgData",
|
||||||
|
title: '平均值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalRefundTicket', 'YOYData'],
|
||||||
|
key: "TotalRefundTicket.YOYData",
|
||||||
|
title: '同比数值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalRefundTicket', 'YOYDataAdd'],
|
||||||
|
key: "TotalRefundTicket.YOYDataAdd",
|
||||||
|
title: '同比增长',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.TotalRefundTicket?.YOYData && record?.TotalRefundTicket?.summaryData ? (((record?.TotalRefundTicket?.summaryData - record?.TotalRefundTicket?.YOYData) / record?.TotalRefundTicket?.YOYData) * 100).toFixed(2) + '%' : "-"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalRefundTicket', 'QOQData'],
|
||||||
|
key: "TotalRefundTicket.QOQData",
|
||||||
|
title: '环比数值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: 'TotalRefundAmount',
|
||||||
|
title: '退款订单金额',
|
||||||
|
hideInSearch: true,
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalRefundAmount', 'summaryData'],
|
||||||
|
key: "TotalRefundAmount.summaryData",
|
||||||
|
title: '合计值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalRefundAmount', 'maxData'],
|
||||||
|
key: "TotalRefundAmount.maxData",
|
||||||
|
title: '最大值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalRefundAmount', 'minData'],
|
||||||
|
key: "TotalRefundAmount.minData",
|
||||||
|
title: '最小值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalRefundAmount', 'avgData'],
|
||||||
|
key: "TotalRefundAmount.avgData",
|
||||||
|
title: '平均值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalRefundAmount', 'YOYData'],
|
||||||
|
key: "TotalRefundAmount.YOYData",
|
||||||
|
title: '同比数值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalRefundAmount', 'YOYDataAdd'],
|
||||||
|
key: "TotalRefundAmount.YOYDataAdd",
|
||||||
|
title: '同比增长',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
render: (_, record) => {
|
||||||
|
return record?.TotalRefundAmount?.YOYData && record?.TotalRefundAmount?.summaryData ? (((record?.TotalRefundAmount?.summaryData - record?.TotalRefundAmount?.YOYData) / record?.TotalRefundAmount?.YOYData) * 100).toFixed(2) + '%' : "-"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
dataIndex: ['TotalRefundAmount', 'QOQData'],
|
||||||
|
key: "TotalRefundAmount.QOQData",
|
||||||
|
title: '环比数值',
|
||||||
|
width: 120,
|
||||||
|
align: 'center',
|
||||||
|
hideInSearch: true,
|
||||||
|
ellipsis: true,
|
||||||
|
},
|
||||||
|
]
|
||||||
|
},
|
||||||
|
]
|
||||||
|
|
||||||
|
const exportTable = (e) => {
|
||||||
|
e.stopPropagation(); // 防止Collapse组件收起
|
||||||
|
const main = document.getElementsByClassName(`saleReportHideBox${printIndex}`)[0]
|
||||||
|
const thead = main.querySelector('thead').cloneNode(true); // 深克隆DOM节点
|
||||||
|
const tbody = main.querySelector('tbody').cloneNode(true); // 深克隆DOM节点
|
||||||
|
const container = document.querySelector('#hiddenBox');
|
||||||
|
|
||||||
|
const tempTable = document.createElement('table');
|
||||||
|
tempTable.appendChild(thead);
|
||||||
|
tempTable.appendChild(tbody);
|
||||||
|
|
||||||
|
tempTable.setAttribute('id', 'table-to-xls-SupplierOrderStatistics'); // 给table添加id，值与按钮上的table字段对应
|
||||||
|
|
||||||
|
container.appendChild(tempTable); // 把创建的节点添加到页面容器中
|
||||||
|
|
||||||
|
setShowLoading(false)
|
||||||
|
|
||||||
|
downloadBtnRef.current.handleDownload();
|
||||||
|
setShowExportTable(false)
|
||||||
|
tempTable.remove() // 防止重复打印一个内容
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div ref={(el) => {
|
||||||
|
// 打印报表
|
||||||
|
if (!reqDetailList || reqDetailList.length === 0) return;
|
||||||
|
setPrintOut(el);
|
||||||
|
}} >
|
||||||
|
|
||||||
|
{
|
||||||
|
showLoading ?
|
||||||
|
<div
|
||||||
|
style={{
|
||||||
|
width: '100%',
|
||||||
|
height: '100%',
|
||||||
|
background: 'rgba(0,0,0,0.1)',
|
||||||
|
position: 'fixed',
|
||||||
|
zIndex: 5,
|
||||||
|
display: 'flex',
|
||||||
|
alignItems: 'center',
|
||||||
|
justifyContent: 'center'
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<div style={{
|
||||||
|
display: 'flex',
|
||||||
|
alignItems: 'center',
|
||||||
|
justifyContent: 'center',
|
||||||
|
padding: '15px 20px 10px',
|
||||||
|
background: '#fff',
|
||||||
|
borderRadius: '8px',
|
||||||
|
width: '200px'
|
||||||
|
}}>
|
||||||
|
<Spin />
|
||||||
|
<span style={{ marginLeft: '5px' }}>数据导出中...</span>
|
||||||
|
</div>
|
||||||
|
</div> : ''
|
||||||
|
}
|
||||||
|
|
||||||
|
<div className={`saleReportHideBox${printIndex}`} style={{ position: 'fixed', zIndex: -1, top: 0, left: 0 }}>
|
||||||
|
{
|
||||||
|
showExportTable && reqDetailList && reqDetailList.length > 0 ?
|
||||||
|
<ProTable
|
||||||
|
columns={columns}
|
||||||
|
dataSource={reqDetailList}
|
||||||
|
pagination={false}
|
||||||
|
expandable={{
|
||||||
|
defaultExpandAllRows: true
|
||||||
|
}}
|
||||||
|
/> : ''
|
||||||
|
}
|
||||||
|
</div>
|
||||||
|
<div id='hiddenBox' style={{ position: 'fixed', zIndex: -1, top: 0, left: 0 }} />
|
||||||
|
|
||||||
|
<div style={{ backgroundColor: '#fff', display: 'flex' }}>
|
||||||
|
<SupplierLeftSelectTree setSelectedId={setSelectedId} setCollapsible={setCollapsible} collapsible={collapsible} />
|
||||||
|
<div style={{
|
||||||
|
width: !collapsible ? 'calc(100% - 300px)' : 'calc(100% - 60px)',
|
||||||
|
paddingTop: 0,
|
||||||
|
paddingBottom: 0,
|
||||||
|
paddingRight: 0
|
||||||
|
}}>
|
||||||
|
<ProTable
|
||||||
|
actionRef={actionRef}
|
||||||
|
formRef={formRef}
|
||||||
|
columns={columns}
|
||||||
|
bordered
|
||||||
|
expandable={{
|
||||||
|
expandRowByClick: true
|
||||||
|
}}
|
||||||
|
scroll={{ x: "100%", y: "calc(100vh - 410px)" }}
|
||||||
|
headerTitle={<PageTitleBox props={props} />} // 列表表头
|
||||||
|
search={{ span: 6 }}
|
||||||
|
request={async (params) => {
|
||||||
|
if (!selectedId) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
const req: any = {
|
||||||
|
CalcType: 2,
|
||||||
|
OwnerUnitId: currentUser?.OwnerUnitId,
|
||||||
|
StartDate: params?.StartDate || "",
|
||||||
|
EndDate: params?.EndDate || "",
|
||||||
|
SalebillType: "",
|
||||||
|
MerchantId: selectedId,
|
||||||
|
}
|
||||||
|
setSearchParams(req)
|
||||||
|
const data = await handeGetGetOnlineOrderSummary(req)
|
||||||
|
console.log('datadatadatadata', data);
|
||||||
|
if (data && data.length > 0) {
|
||||||
|
setReqDetailList(data)
|
||||||
|
return { data: data, success: true, total: data.length }
|
||||||
|
}
|
||||||
|
return { data: [], success: true }
|
||||||
|
}}
|
||||||
|
columnsState={{
|
||||||
|
value: columnsStateMap,
|
||||||
|
onChange: setColumnsStateMap,
|
||||||
|
}}
|
||||||
|
toolbar={{
|
||||||
|
actions: [
|
||||||
|
<span style={{ visibility: 'hidden' }}>
|
||||||
|
<ReactHTMLTableToExcel
|
||||||
|
buttonText={'导出excel'}
|
||||||
|
ref={downloadBtnRef}
|
||||||
|
table="table-to-xls-SupplierOrderStatistics"
|
||||||
|
filename={`供应商订单汇总${searchParams?.StartDate}-${searchParams?.EndDate}`}
|
||||||
|
sheet="sheet1"
|
||||||
|
/>
|
||||||
|
</span>,
|
||||||
|
<Button
|
||||||
|
key="new"
|
||||||
|
type="primary"
|
||||||
|
onClick={(e) => {
|
||||||
|
if (reqDetailList && reqDetailList.length > 0) {
|
||||||
|
setShowLoading(true)
|
||||||
|
setTimeout(() => {
|
||||||
|
setShowExportTable(true)
|
||||||
|
setTimeout(() => {
|
||||||
|
exportTable(e)
|
||||||
|
}, 100)
|
||||||
|
}, 100)
|
||||||
|
} else {
|
||||||
|
message.error('暂无数据可导出！')
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
导出excel
|
||||||
|
</Button>
|
||||||
|
]
|
||||||
|
}}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default connect(({ user }: ConnectState) => ({
|
||||||
|
currentUser: user.currentUser
|
||||||
|
}))(SupplierOrderStatistics);
|
||||||
@ -42,6 +42,7 @@ const MemberDetail = ({ showDetailDrawer, currentRow, handleCloseModal, currentU
|
|||||||
const [disabled, setDraggleDisabled] = useState<boolean>() // 是否拖动
|
const [disabled, setDraggleDisabled] = useState<boolean>() // 是否拖动
|
||||||
|
|
||||||
let MEMBERSHIPTYPEYNObj = session.get('MEMBERSHIPTYPEYNObj');
|
let MEMBERSHIPTYPEYNObj = session.get('MEMBERSHIPTYPEYNObj');
|
||||||
|
let MEMBERSHIPLEVELYNObj = session.get('MEMBERSHIPLEVELYNObj');
|
||||||
let MEMBERSHIPLEVELYNList = session.get('MEMBERSHIPLEVELYNList');
|
let MEMBERSHIPLEVELYNList = session.get('MEMBERSHIPLEVELYNList');
|
||||||
let COMPANY_STATEList = session.get('COMPANY_STATEList');
|
let COMPANY_STATEList = session.get('COMPANY_STATEList');
|
||||||
let SCORETYPETree = session.get('SCORETYPETree')
|
let SCORETYPETree = session.get('SCORETYPETree')
|
||||||
@ -366,6 +367,12 @@ const MemberDetail = ({ showDetailDrawer, currentRow, handleCloseModal, currentU
|
|||||||
<span className="memberType">{MEMBERSHIPTYPEYNObj[currentRow?.MEMBERSHIP_TYPE]}</span> : ""
|
<span className="memberType">{MEMBERSHIPTYPEYNObj[currentRow?.MEMBERSHIP_TYPE]}</span> : ""
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
{
|
||||||
|
currentRow?.MEMBERSHIP_LEVEL && MEMBERSHIPLEVELYNObj && MEMBERSHIPLEVELYNObj[currentRow?.MEMBERSHIP_LEVEL] ?
|
||||||
|
<span className="memberType" style={{ marginLeft: '8px' }}>{MEMBERSHIPLEVELYNObj[currentRow?.MEMBERSHIP_LEVEL]}</span> : ""
|
||||||
|
}
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="topDetailItem">
|
<div className="topDetailItem">
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user