This commit is contained in:
ylj20011123 2025-07-22 18:56:59 +08:00
parent 4e6fe8ef95
commit 42ecaa9eb3
26 changed files with 3308 additions and 110 deletions

View File

@ -121,6 +121,17 @@ export default [
name: 'reports.settlementSummaryTable',
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',
name: 'reports.ConfirmationDifference',
@ -1034,6 +1045,12 @@ export default [
name: 'MallSummaryStatistics',
component: './travelMember/MallSummaryStatistics/index'
},
// 供应商订单统计
{
path: 'SupplierOrderStatistics',
name: 'SupplierOrderStatistics',
component: './travelMember/SupplierOrderStatistics/index'
},
]

View File

@ -90,13 +90,6 @@ const CardInformationManager: React.FC<{ currentUser: CurrentUser }> = (props) =
valueType: 'index',
align: 'center',
},
{
title: "优惠券类型",
dataIndex: "COUPON_TYPES",
valueType: 'select',
valueEnum: COUPONTYPEObj,
hideInTable: true,
},
{
title: "卡券名称",
dataIndex: "COUPON_NAME",
@ -115,6 +108,23 @@ const CardInformationManager: React.FC<{ currentUser: CurrentUser }> = (props) =
}}>{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: "运营单位",
dataIndex: "OPERATINGUNIT_NAME",
@ -330,7 +340,7 @@ const CardInformationManager: React.FC<{ currentUser: CurrentUser }> = (props) =
setFileList([])
}}
confirmLoading={modalLoading}
width={900}
width={1400}
bodyStyle={{
height: '700px', // 你可以根据需要调整高度
overflowY: 'auto',

View File

@ -133,7 +133,7 @@ const MerchantInformation: React.FC<{ currentUser: CurrentUser | undefined }> =
dataIndex: 'searchText',
title: '查询内容',
hideInTable: true,
fieldProp: {
fieldProps: {
placeholder: "请输入商户名称"
}
},
@ -169,6 +169,7 @@ const MerchantInformation: React.FC<{ currentUser: CurrentUser | undefined }> =
fieldProps: {
treeData: formatTreeData(BUSINESSTRADEYNTree), // 设置树形数据源
showSearch: true, // 启用搜索
allowClear: true,
treeNodeFilterProp: 'label', // 按 label 过滤
treeDefaultExpandAll: true,
filterTreeNode: (input: any, treeNode: any) => {
@ -926,7 +927,7 @@ const MerchantInformation: React.FC<{ currentUser: CurrentUser | undefined }> =
const req = {
searchParameter: {
SERVERPART_IDS: selectedId,
SHOPTRADES: params?.SHOPTRADES,
SHOPTRADES: params?.SHOPTRADE || "",
ISVALID: 1,
ISSHOW: params?.ISSHOW === "-1" ? "" : params?.ISSHOW
},

View File

@ -163,6 +163,11 @@ const SpringFestival: React.FC<{ currentUser?: CurrentUser }> = (props) => {
BayonetINClYear: item.BayonetINC.lYearData,
BayonetINCcrease: item.BayonetINC.increaseData,
BayonetINCRate: item.BayonetINC.increaseRate,
SectionFlowINCINCCcur: item.SectionFlowINC.curYearData,
SectionFlowINClYear: item.SectionFlowINC.lYearData,
SectionFlowINCcrease: item.SectionFlowINC.increaseData,
SectionFlowINCRate: item.SectionFlowINC.increaseRate,
})
// list.push({
// SPRegionTypeId:item.SPRegionTypeId,
@ -245,6 +250,8 @@ const SpringFestival: React.FC<{ currentUser?: CurrentUser }> = (props) => {
dataIndex: 'ServerpartName',
aiDataIndex: "ServerpartName",
hideInSearch: true,
width: 120,
ellipsis: true,
align: 'center',
render: (_, record) => {
return <a style={{ cursor: 'pointer' }} onClick={() => {
@ -421,6 +428,7 @@ const SpringFestival: React.FC<{ currentUser?: CurrentUser }> = (props) => {
title: `${showCurrentFestivalObj?.curYear}`,
dataIndex: 'RevenueINCcur',
aiDataIndex: "RevenueINCcur",
width: 120,
align: 'right',
valueType: 'digit',
sorter: (a, b) => a.RevenueINCcur - b.RevenueINCcur,
@ -430,6 +438,7 @@ const SpringFestival: React.FC<{ currentUser?: CurrentUser }> = (props) => {
title: `${showCurrentFestivalObj?.compareYear}`,
dataIndex: 'RevenueINClYear',
aiDataIndex: "RevenueINClYear",
width: 120,
align: 'right',
valueType: 'digit',
sorter: (a, b) => a.RevenueINClYear - b.RevenueINClYear,
@ -439,6 +448,7 @@ const SpringFestival: React.FC<{ currentUser?: CurrentUser }> = (props) => {
title: '增长',
dataIndex: 'RevenueINCcrease',
aiDataIndex: "RevenueINCcrease",
width: 120,
align: 'right',
valueType: 'digit',
hideInSearch: true,
@ -449,6 +459,7 @@ const SpringFestival: React.FC<{ currentUser?: CurrentUser }> = (props) => {
title: '增幅',
dataIndex: 'RevenueINCRate',
aiDataIndex: "RevenueINCRate",
width: 120,
align: 'center',
hideInSearch: true,
sorter: (a, b) => a.RevenueINCRate - b.RevenueINCRate,
@ -471,6 +482,7 @@ const SpringFestival: React.FC<{ currentUser?: CurrentUser }> = (props) => {
title: `${showCurrentFestivalObj?.curYear}`,
dataIndex: 'AccountINCCcur',
aiDataIndex: "AccountINCCcur",
width: 120,
align: 'right',
valueType: 'digit',
sorter: (a, b) => a.AccountINCCcur - b.AccountINCCcur,
@ -480,6 +492,7 @@ const SpringFestival: React.FC<{ currentUser?: CurrentUser }> = (props) => {
title: `${showCurrentFestivalObj?.compareYear}`,
dataIndex: 'AccountINClYear',
aiDataIndex: "AccountINClYear",
width: 120,
align: 'right',
valueType: 'digit',
sorter: (a, b) => a.AccountINClYear - b.AccountINClYear,
@ -489,6 +502,7 @@ const SpringFestival: React.FC<{ currentUser?: CurrentUser }> = (props) => {
title: '增长',
dataIndex: 'AccountINCcrease',
aiDataIndex: "AccountINCcrease",
width: 120,
align: 'right',
valueType: 'digit',
hideInSearch: true,
@ -498,6 +512,7 @@ const SpringFestival: React.FC<{ currentUser?: CurrentUser }> = (props) => {
title: '增幅',
dataIndex: 'AccountINCRate',
aiDataIndex: "AccountINCRate",
width: 120,
align: 'center',
hideInSearch: true,
sorter: (a, b) => a.AccountINCRate - b.AccountINCRate,
@ -520,6 +535,7 @@ const SpringFestival: React.FC<{ currentUser?: CurrentUser }> = (props) => {
title: `${showCurrentFestivalObj?.curYear}`,
dataIndex: 'BayonetINCINCCcur',
aiDataIndex: "BayonetINCINCCcur",
width: 120,
align: 'right',
valueType: 'digit',
sorter: (a, b) => a.BayonetINCINCCcur - b.BayonetINCINCCcur,
@ -529,6 +545,7 @@ const SpringFestival: React.FC<{ currentUser?: CurrentUser }> = (props) => {
title: `${showCurrentFestivalObj?.compareYear}`,
dataIndex: 'BayonetINClYear',
aiDataIndex: "BayonetINClYear",
width: 120,
align: 'right',
valueType: 'digit',
sorter: (a, b) => a.BayonetINClYear - b.BayonetINClYear,
@ -538,6 +555,7 @@ const SpringFestival: React.FC<{ currentUser?: CurrentUser }> = (props) => {
title: '增长',
dataIndex: 'BayonetINCcrease',
aiDataIndex: "BayonetINCcrease",
width: 120,
align: 'right',
valueType: 'digit',
hideInSearch: true,
@ -547,6 +565,7 @@ const SpringFestival: React.FC<{ currentUser?: CurrentUser }> = (props) => {
title: '增幅',
dataIndex: 'BayonetINCRate',
aiDataIndex: "BayonetINCRate",
width: 120,
align: 'center',
hideInSearch: true,
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 = [
@ -904,7 +976,7 @@ const SpringFestival: React.FC<{ currentUser?: CurrentUser }> = (props) => {
id={'table-to-xls'}
columns={columns}
bordered={true}
scroll={{ y: 'calc(100vh - 450px)' }}
scroll={{ x: "100%", y: 'calc(100vh - 450px)' }}
pagination={false}
dataSource={tableData}
request={async (params) => {

View 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"'
}
}
}
}
}
}
}
}
}
}
}
}
}

View 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);

View File

@ -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);

View File

@ -21,6 +21,7 @@ import { ExclamationCircleOutlined, MinusCircleOutlined, PlusOutlined } from "@a
import { deletePicture, uploadPicture } from "@/services/picture";
import PrintContent from "./printContent";
import { handleHighPrecision } from "@/utils/utils";
import HistoricalProjects from "./HistoricalProjects";
const { confirm } = Modal;
type DetailProps = {
@ -631,7 +632,6 @@ const YearExamineDetailTable = ({ parentRow, currentApprovalstate, onRef, setIsS
: ''
}
},
]
// 导出excel的columns
const exportColumns: any = [
@ -2766,6 +2766,15 @@ const YearExamineDetailTable = ({ parentRow, currentApprovalstate, onRef, setIsS
</ProTable>
{/* 判断当期项目 是不是最后一期 是最后一期的话 就显示 历史期的数据 */}
<HistoricalProjects parentRow={parentRow} />
{/* {
parentRow?.PROJECT_ENDDATE === parentRow?.ENDDATE ?
<HistoricalProjects /> : ""
} */}
{/* 导出结算表 */}
<PrintContent pageName={'YearExamineTable'} exportColumns={exportColumns} exportData={exportData} exportSumRow={exportSumRow} type={'year'} />

View File

@ -874,7 +874,7 @@ const YearExamineProcess = ({ currentUser, onShow, setOnShow, parentRow, setPare
setCurrentNowState(data.BUSINESSAPPROVAL_STATE)
// 拿到下一环节
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,
IsValid: 1
}
@ -901,12 +901,12 @@ const YearExamineProcess = ({ currentUser, onShow, setOnShow, parentRow, setPare
// 剔除 结算时间在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);
}
// 剔除 结算时间在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);
}

View 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);

View 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
}

View File

@ -16,8 +16,9 @@ type DetailProps = {
modalVisible: boolean //显示属性
handleCloseModal: any // 关闭调用的方法
currentRow: any
detailType?: any // 判断是不是点餐的订单详情 可以显示不同内容
}
const OrderDetailModal = ({ modalVisible, handleCloseModal, currentRow }: DetailProps) => {
const OrderDetailModal = ({ modalVisible, handleCloseModal, currentRow, detailType }: DetailProps) => {
const formRef = useRef<FormInstance>();
const draggleRef = React.createRef<any>()
const modalRef = useRef<FormInstance>();
@ -172,6 +173,28 @@ const OrderDetailModal = ({ modalVisible, handleCloseModal, currentRow }: Detail
style={{ marginBottom: '16px' }}
/>
</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">
<ProFormSelect
name={"CHANNEL_TYPE"}

View File

@ -101,6 +101,14 @@ const BookingMealOrder: React.FC<{ currentUser: CurrentUser | undefined }> = (pr
}}>{record?.SALEBILL_CODE}</a> : "-"
}
},
{
dataIndex: 'SERVERPART_NAME',
title: '服务区',
align: 'center',
hideInSearch: true,
width: 150,
ellipsis: true,
},
{
dataIndex: 'SHOPNAME',
title: '门店名称',
@ -325,7 +333,7 @@ const BookingMealOrder: React.FC<{ currentUser: CurrentUser | undefined }> = (pr
/>
</div>
<OrderDetailModal modalVisible={modalVisible} handleCloseModal={handleCloseModal} currentRow={currentRow} />
<OrderDetailModal modalVisible={modalVisible} handleCloseModal={handleCloseModal} currentRow={currentRow} detailType={'food'} />
{/* <Modal
className="BookingMealOrderDetailModal"

View File

@ -54,6 +54,10 @@ const GrowthValueRuleConfig: React.FC<{ currentUser: CurrentUser | undefined }>
const [bounds, setBounds] = useState<{ left: number, right: number, top: number, bottom: number }>() // 移动的位置
const [disabled, setDraggleDisabled] = useState<boolean>() // 是否拖动
const draggleRef = React.createRef<any>()
// 初始会员等级列表
const [defaultMemberLevel, setDefaultMemberLevel] = useState<any>(MEMBERSHIPLEVELYNList)
// 晋升后会员等级列表
const [promotionMemberLevel, setPromotionMemberLevel] = useState<any>(MEMBERSHIPLEVELYNList)
const onDraggaleStart = (event, uiData) => {
const { clientWidth, clientHeight } = window.document.documentElement;
@ -69,7 +73,6 @@ const GrowthValueRuleConfig: React.FC<{ currentUser: CurrentUser | undefined }>
});
};
// 拖动结束
// 定义列表字段内容
const columns: any = [
{
@ -105,7 +108,7 @@ const GrowthValueRuleConfig: React.FC<{ currentUser: CurrentUser | undefined }>
title: '会员类型',
align: 'center',
width: 120,
hideInSearch: true,
// hideInSearch: true,
valueType: 'select',
valueEnum: MEMBERSHIP_TYPEObj
},
@ -133,16 +136,16 @@ const GrowthValueRuleConfig: React.FC<{ currentUser: CurrentUser | undefined }>
align: 'center',
hideInSearch: true,
},
{
dataIndex: 'GROWTHDAILY_CAP',
title: '每日上限',
width: 120,
align: 'center',
hideInSearch: true,
},
// {
// dataIndex: 'GROWTHDAILY_CAP',
// title: '每日上限',
// width: 120,
// align: 'center',
// hideInSearch: true,
// },
{
dataIndex: 'GROWTHTOTAL_CAP',
title: '总上限值',
title: '晋升后成长值',
width: 120,
align: 'center',
hideInSearch: true,
@ -222,7 +225,6 @@ const GrowthValueRuleConfig: React.FC<{ currentUser: CurrentUser | undefined }>
// },
];
const handelDelete = async (id: number) => {
const result = await handleDeleteGROWTHSETTING({
GROWTHSETTINGId: id
@ -293,7 +295,8 @@ const GrowthValueRuleConfig: React.FC<{ currentUser: CurrentUser | undefined }>
searchParameter: {
PROVINCE_CODE: currentUser?.ProvinceCode || "",
OWNERUNIT_ID: 911,
GROWTHSETTING_STATE: params?.GROWTHSETTING_STATE
GROWTHSETTING_STATE: params?.GROWTHSETTING_STATE,
MEMBERSHIP_TYPES: params?.MEMBERSHIP_TYPE
},
SortStr: "PROMOTION_LEVEL desc",
PageIndex: 1,
@ -439,7 +442,7 @@ const GrowthValueRuleConfig: React.FC<{ currentUser: CurrentUser | undefined }>
autoFocusFirstInput
submitter={false}
preserve={false}
labelCol={{ style: { width: 80 } }}
labelCol={{ style: { width: 100 } }}
initialValues={{
...currentRow,
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}
/>
</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}>
<ProFormSelect
name="GROWTHSETTING_STATE"
@ -539,6 +510,60 @@ const GrowthValueRuleConfig: React.FC<{ currentUser: CurrentUser | undefined }>
initialValue={1}
/>
</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}>
<ProFormTextArea

View File

@ -366,7 +366,7 @@ const HomepageAds: React.FC<{ currentUser: CurrentUser | undefined }> = (props)
onFocus={() => { }}
onBlur={() => { }}
>
{currentRow ? '更新会员收货地址' : '新建会员收货地址'}
{currentRow ? selectTab === "1" ? '更新首页海报' : '更新首页轮播' : selectTab === "1" ? '新增首页海报' : '新增首页轮播'}
</div>
}
destroyOnClose={true}

View File

@ -52,8 +52,8 @@ const MallOrderManage: React.FC<{ currentUser: CurrentUser }> = (props) => {
dataIndex: 'searchText',
title: '查询内容',
hideInTable: true,
fieldProp: {
placeholder: "请输入供货商/购买的商品/收货人"
fieldProps: {
placeholder: "请输入供货商/购买的商品/订单编号"
}
},
{
@ -373,6 +373,8 @@ const MallOrderManage: React.FC<{ currentUser: CurrentUser }> = (props) => {
headerTitle={<PageTitleBox props={props} />} // 列表表头
search={{ span: 6 }}
request={async (params) => {
console.log('paramsparamsparams', params);
const req = {
SearchParameter: {
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,
ORDER_DATE_Start: params?.ORDER_DATE_Start || "",
ORDER_DATE_End: params?.ORDER_DATE_End || "",
SALEBILL_STATES: params?.SALEBILL_STATE === "0" ? "1010,2010,3000" : params?.SALEBILL_STATE,
CHANNEL_TYPE: params?.PAY_METHOD === "0" ? "" : params?.PAY_METHOD
SALEBILL_STATES: params?.orderStatus === "0" ? "1010,2010,3000" : params?.orderStatus,
CHANNEL_TYPE: params?.PAY_METHOD === "0" ? "" : params?.PAY_METHOD,
SearchKeyValue: params?.searchText || ""
},
PageIndex: 1,
PageSize: 999999,
SortStr: "ORDER_DATE desc",
keyWord: {
Key: "MERCHANTS_NAME,ORDER_PERSON,ORDER_PERSONTEL,SALEBILL_CODE,COMMODITY_NAME",
Value: params?.searchText || ""
},
// keyWord: {
// Key: "MERCHANTS_NAME,ORDER_PERSON,ORDER_PERSONTEL,SALEBILL_CODE,COMMODITY_NAME",
// Value: params?.searchText || ""
// },
}
console.log('reqreqreqreqreq', req);

View File

@ -210,7 +210,7 @@ const MallSummaryStatistics: React.FC<{ currentUser: CurrentUser | undefined }>
}
useEffect(() => {
handleGetTopData()
handleGetTopData()
}, [])
return (
<div className="MallSummaryStatisticsMain">

View File

@ -51,8 +51,8 @@ const OrderAfterSalesManage: React.FC<{ currentUser: CurrentUser }> = (props) =>
dataIndex: 'searchText',
title: '查询内容',
hideInTable: true,
fieldProp: {
placeholder: "请输入购买的商品/订单编号/联系电话/会员名称"
fieldProps: {
placeholder: "请输入购买的商品/订单编号"
}
},
{
@ -78,7 +78,7 @@ const OrderAfterSalesManage: React.FC<{ currentUser: CurrentUser }> = (props) =>
valueEnum: {
"0": "全部",
"8000": "退款申请中",
"8020": "退款申请中",
"8020": "退款审核中",
"8900": "订单已退款",
"9000": "订单已关闭",
},
@ -170,7 +170,7 @@ const OrderAfterSalesManage: React.FC<{ currentUser: CurrentUser }> = (props) =>
valueType: "select",
valueEnum: {
"8000": "退款申请中",
"8020": "退款申请中",
"8020": "退款审核中",
"8900": "订单已退款",
"9000": "订单已关闭",
},
@ -276,16 +276,17 @@ const OrderAfterSalesManage: React.FC<{ currentUser: CurrentUser }> = (props) =>
ORDER_DATE_Start: params?.ORDER_DATE_Start || "",
ORDER_DATE_End: params?.ORDER_DATE_End || "",
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
},
PageIndex: 1,
PageSize: 999999,
SortStr: "ORDER_DATE desc",
keyWord: {
Key: "ORDER_PERSON,ORDER_PERSONTEL,SALEBILL_CODE,COMMODITY_NAME",
Value: params?.searchText || ""
},
// keyWord: {
// Key: "ORDER_PERSON,ORDER_PERSONTEL,SALEBILL_CODE,COMMODITY_NAME",
// Value: params?.searchText || ""
// },
}
console.log('reqreqreqreqreq', req);

View File

@ -44,6 +44,7 @@ const LeftSelectMallType = ({ setSelectedId, reload, actionRef, currentUser, wid
if (USERDEFINEDTYPEList && USERDEFINEDTYPEList.length > 0) {
setTreeView(USERDEFINEDTYPEList)
setData(USERDEFINEDTYPEList)
setAllTreeViews(USERDEFINEDTYPEList)
return USERDEFINEDTYPEList
} else {
const req = {
@ -57,7 +58,7 @@ const LeftSelectMallType = ({ setSelectedId, reload, actionRef, currentUser, wid
setData(data)
session.set("USERDEFINEDTYPEList", data)
setAllTreeViews(data)
return data
}
@ -71,18 +72,20 @@ const LeftSelectMallType = ({ setSelectedId, reload, actionRef, currentUser, wid
// 筛选左侧的服务区树
const handleFilterServiceTree = async (value?: string) => {
const resList: any = JSON.parse(JSON.stringify(allTreeViews))
console.log('resListresListresListresList', resList);
setSelectedId('')
if (resList && resList.length > 0 && value) {
setTreeView([])
const list: any = []
resList.forEach((item: any) => {
if (item.label.indexOf(value) !== -1) {
if (item.USERDEFINEDTYPE_NAME.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) {
if (subItem.USERDEFINEDTYPE_NAME.indexOf(value) !== -1) {
childrenList.push(subItem)
}
})
@ -144,9 +147,9 @@ const LeftSelectMallType = ({ setSelectedId, reload, actionRef, currentUser, wid
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={() => {
<img className="searchIcon" src={searchIcon} onClick={() => {
setShowServiceSearchBox(true)
}} /> */}
}} />
<MenuFoldOutlined onClick={() => {
setCollapsible(!collapsible);
}} />
@ -195,32 +198,21 @@ const LeftSelectMallType = ({ setSelectedId, reload, actionRef, currentUser, wid
>
{treeView && treeView.length > 0 ? <Tree
checkable
treeData={selectOnly
? (isShowAllInTree
? [{
label: '全部',
value: 0,
key: '0-0',
children: convertTreeForSelectOnly(treeView)
}]
: convertTreeForSelectOnly(treeView))
: (isShowAllInTree
? [{
USERDEFINEDTYPE_NAME: '全部',
value: 0,
USERDEFINEDTYPE_ID: '0-0',
children: treeView
}]
: treeView)}
treeData={[{
USERDEFINEDTYPE_NAME: '全部',
value: 0,
USERDEFINEDTYPE_ID: '0-0',
children: treeView
}]}
blockNode
// defaultExpandAll={isShowAllInTree ? false : true}
defaultExpandedKeys={isShowAllInTree ? treeShowRow && treeShowRow.length > 0 ? treeShowRow : ['0-0'] : []}
defaultExpandedKeys={['0-0']}
onCheck={(checkedKeys: React.Key[] | any, info) => {
console.log('checkedKeyscheckedKeyscheckedKeys', checkedKeys);
console.log('infoinfoinfoinfoinfoinfo', info);
// 多选逻辑
// 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);
setSelectedId(selectedIds.map((n: any) => n?.USERDEFINEDTYPE_ID)?.toString() || '')
if (reload) {

View File

@ -960,7 +960,7 @@ const COMMODITYTable: React.FC<{ currentUser: CurrentUser | undefined }> = (prop
// },
showSearch: true,
filterOption: (input, node) =>
(node.BRAND_NAME || '').toLowerCase().includes(input.toLowerCase())
(node.label || '').toLowerCase().includes(input.toLowerCase())
}}
rules={[
{

View File

@ -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()
console.log('resresres', res);
let params: any = {
@ -272,8 +272,8 @@ const RegistrationRetentionAnalysis: React.FC<{ currentUser: CurrentUser, isComp
USER_MOBILEPHONE: parentDetail?.MEMBERSHIP_MOBILEPHONE
},
SortStr: 'BEHAVIORRECORD_TIME desc',
PageIndex: 1,
PageSize: 999999
PageIndex: paramsObj.current || 1,
PageSize: paramsObj?.pageSize || 999999
} : {
SearchParameter: {
BEHAVIORRECORD_TIME_Start: moment(params?.BEHAVIORRECORD_TIME).format('YYYY-MM-DD'),
@ -403,7 +403,7 @@ const RegistrationRetentionAnalysis: React.FC<{ currentUser: CurrentUser, isComp
setting: true
}}
request={async (params) => {
handleGetTableData()
handleGetTableData(params)
// if (!isFirst) {
// handleGetTableData()
// }

View File

@ -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%);
}
}
}
}

View File

@ -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);

View File

@ -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;
}
}
}
}
}

View 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);

View File

@ -42,6 +42,7 @@ const MemberDetail = ({ showDetailDrawer, currentRow, handleCloseModal, currentU
const [disabled, setDraggleDisabled] = useState<boolean>() // 是否拖动
let MEMBERSHIPTYPEYNObj = session.get('MEMBERSHIPTYPEYNObj');
let MEMBERSHIPLEVELYNObj = session.get('MEMBERSHIPLEVELYNObj');
let MEMBERSHIPLEVELYNList = session.get('MEMBERSHIPLEVELYNList');
let COMPANY_STATEList = session.get('COMPANY_STATEList');
let SCORETYPETree = session.get('SCORETYPETree')
@ -366,6 +367,12 @@ const MemberDetail = ({ showDetailDrawer, currentRow, handleCloseModal, currentU
<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 className="topDetailItem">