同步更新
This commit is contained in:
parent
61b79fb0a1
commit
728eeec2cb
@ -51,14 +51,17 @@ export const UserReport: FC = () => {
|
||||
const [downloadLoading, setDownloadLoading] = useState(false);
|
||||
|
||||
const printRef = useRef()
|
||||
|
||||
const handlePrint = async () => {
|
||||
const opt = {
|
||||
margin: 0,
|
||||
filename: `${data?.comprehensive?.startDate ? dayjs(data?.comprehensive?.startDate).format("YYYY年MM月") : null}${data?.tenement?.fullName || '报表'}.pdf`,
|
||||
image: { type: "jpeg", quality: 0.98, },
|
||||
filename: `${data?.tenement?.fullName + '-' + dayjs(data?.comprehensive?.startDate).format("YYYY年MM月") || '报表-' + dayjs(data?.comprehensive?.startDate).format("YYYY年MM月")}.pdf`,
|
||||
image: {type: "jpeg", quality: 0.98,},
|
||||
enableLinks: true,
|
||||
html2canvas: { scale: 3, useCORS: true, allowTaint: false, },
|
||||
html2canvas: {scale: 3, useCORS: true, allowTaint: false,},
|
||||
pagebreak: {
|
||||
// mode: ['avoid-all', 'css'], // 优先使用CSS分页规则
|
||||
before: '.page-break' // 在指定元素前分页(可添加class到需要分页的位置)
|
||||
},
|
||||
jsPDF: {
|
||||
unit: 'pt', // pt、mm、cm、in
|
||||
format: 'a4',
|
||||
@ -146,16 +149,16 @@ export const UserReport: FC = () => {
|
||||
|
||||
)
|
||||
}
|
||||
{
|
||||
data?.park?.meter04kvType === Meter04KvType.DisableValley ?
|
||||
<td>{outputWithPrecision(item?.publicAmount, 2, '-')}</td> :
|
||||
<td>
|
||||
<div> 尖:{item?.poolSharp || 0} </div>
|
||||
<div> 峰:{item?.poolPeak || 0} </div>
|
||||
<div> 平:{item?.poolFlat || 0} </div>
|
||||
<div> 谷:{item?.poolValley || 0} </div>
|
||||
</td>
|
||||
}
|
||||
{/*{*/}
|
||||
{/* data?.park?.meter04kvType === Meter04KvType.DisableValley ?*/}
|
||||
{/* <td>{outputWithPrecision(item?.publicAmount, 2, '-')}</td> :*/}
|
||||
{/* <td>*/}
|
||||
{/* <div> 尖:{item?.poolSharp || 0} </div>*/}
|
||||
{/* <div> 峰:{item?.poolPeak || 0} </div>*/}
|
||||
{/* <div> 平:{item?.poolFlat || 0} </div>*/}
|
||||
{/* <div> 谷:{item?.poolValley || 0} </div>*/}
|
||||
{/* </td>*/}
|
||||
{/*}*/}
|
||||
|
||||
|
||||
<td>{outputWithPrecision(item?.finalAmount, 2, '-')}</td>
|
||||
@ -164,15 +167,212 @@ export const UserReport: FC = () => {
|
||||
})
|
||||
}, [data?.meters, data?.park?.meter04kvType])
|
||||
|
||||
|
||||
const renderFee = useCallback(() => {
|
||||
return <table border={1} width={"100%"} cellSpacing="0">
|
||||
<thead>
|
||||
<tr>
|
||||
<td></td>
|
||||
<td>电度电量</td>
|
||||
{
|
||||
data?.tenement?.feeType === 3 ? null : <>
|
||||
<td>线损电量</td>
|
||||
<td>合计电量</td>
|
||||
</>
|
||||
}
|
||||
|
||||
{/*<td>退补电量</td>*/}
|
||||
|
||||
<td>单价</td>
|
||||
<td>电度电费</td>
|
||||
{
|
||||
data?.tenement?.feeType === 3 ? null : <>
|
||||
<td>线损电费</td>
|
||||
<td>合计电费</td>
|
||||
</>
|
||||
}
|
||||
|
||||
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td> 尖</td>
|
||||
<td> {data?.comprehensive?.sharpAmount} </td>
|
||||
{
|
||||
data?.tenement?.feeType === 3 ? null : <>
|
||||
<td> {data?.comprehensive?.lossSharp} </td>
|
||||
<td> {getRoundNumber(
|
||||
Number(data?.comprehensive?.finalSharpAmount || 0)
|
||||
)} </td>
|
||||
</>
|
||||
}
|
||||
|
||||
{/*<td> {data?.comprehensive?.refundSharp} </td>*/}
|
||||
|
||||
<td> {data?.comprehensive?.priceSharp} </td>
|
||||
<td> {getRoundNumber(
|
||||
Number(data?.comprehensive?.sharpFee || 0)
|
||||
)} </td>
|
||||
{
|
||||
data?.tenement?.feeType === 3 ? null : <>
|
||||
<td> {getRoundNumber(
|
||||
Number(data?.comprehensive?.lossSharpFee || 0)
|
||||
)} </td>
|
||||
<td> {getRoundNumber(
|
||||
Number(
|
||||
data?.comprehensive?.finalSharpFee || 0
|
||||
)
|
||||
)} </td>
|
||||
</>
|
||||
}
|
||||
|
||||
|
||||
</tr>
|
||||
<tr>
|
||||
<td> 峰</td>
|
||||
<td> {data?.comprehensive?.peakAmount} </td>
|
||||
{
|
||||
data?.tenement?.feeType === 3 ? null : <>
|
||||
<td> {data?.comprehensive?.lossPeak} </td>
|
||||
<td> {getRoundNumber(
|
||||
Number(data?.comprehensive?.finalPeakAmount || 0)
|
||||
)} </td>
|
||||
</>
|
||||
}
|
||||
|
||||
{/*<td> {data?.comprehensive?.refundPeak} </td>*/}
|
||||
|
||||
<td> {data?.comprehensive?.pricePeak} </td>
|
||||
<td> {getRoundNumber(
|
||||
Number(data?.comprehensive?.peakFee || 0)
|
||||
)} </td>
|
||||
{
|
||||
data?.tenement?.feeType === 3 ? null : <>
|
||||
<td> {getRoundNumber(
|
||||
Number(data?.comprehensive?.lossPeakFee || 0)
|
||||
)} </td>
|
||||
<td> {getRoundNumber(
|
||||
Number(
|
||||
data?.comprehensive?.finalPeakFee || 0
|
||||
)
|
||||
)} </td>
|
||||
</>
|
||||
}
|
||||
|
||||
|
||||
</tr>
|
||||
<tr>
|
||||
<td> 平</td>
|
||||
<td> {data?.comprehensive?.flatAmount} </td>
|
||||
{
|
||||
data?.tenement?.feeType === 3 ? null : <>
|
||||
<td> {data?.comprehensive?.lossFlat} </td>
|
||||
<td> {getRoundNumber(
|
||||
Number(data?.comprehensive?.finalFlatAmount || 0)
|
||||
)} </td>
|
||||
</>
|
||||
}
|
||||
{/*<td> {data?.comprehensive?.refundFlat} </td>*/}
|
||||
|
||||
<td> {data?.comprehensive?.priceFlat} </td>
|
||||
<td> {getRoundNumber(
|
||||
Number(data?.comprehensive?.flatFee || 0)
|
||||
)} </td>
|
||||
{
|
||||
data?.tenement?.feeType === 3 ? null : <>
|
||||
<td> {getRoundNumber(
|
||||
Number(data?.comprehensive?.lossFlatFee || 0)
|
||||
)} </td>
|
||||
<td> {getRoundNumber(
|
||||
Number(
|
||||
data?.comprehensive?.finalFlatFee || 0
|
||||
)
|
||||
)} </td>
|
||||
</>
|
||||
}
|
||||
|
||||
|
||||
</tr>
|
||||
<tr>
|
||||
<td> 谷</td>
|
||||
<td> {data?.comprehensive?.valleyAmount} </td>
|
||||
{
|
||||
data?.tenement?.feeType === 3 ? null : <>
|
||||
<td> {data?.comprehensive?.lossValley} </td>
|
||||
<td> {getRoundNumber(
|
||||
Number(data?.comprehensive?.finalValleyAmount || 0)
|
||||
)} </td>
|
||||
</>
|
||||
}
|
||||
|
||||
{/*<td> {data?.comprehensive?.refundValley} </td>*/}
|
||||
|
||||
<td> {data?.comprehensive?.priceValley} </td>
|
||||
<td> {getRoundNumber(
|
||||
Number(data?.comprehensive?.valleyFee || 0)
|
||||
)} </td>
|
||||
{
|
||||
data?.tenement?.feeType === 3 ? null : <>
|
||||
<td> {getRoundNumber(
|
||||
Number(data?.comprehensive?.lossValleyFee || 0)
|
||||
)} </td>
|
||||
<td> {getRoundNumber(
|
||||
Number(
|
||||
data?.comprehensive?.finalValleyFee || 0
|
||||
)
|
||||
)} </td>
|
||||
</>
|
||||
}
|
||||
|
||||
|
||||
</tr>
|
||||
<tr>
|
||||
<td> 总</td>
|
||||
<td> {data?.comprehensive?.consumption} </td>
|
||||
|
||||
{
|
||||
data?.tenement?.feeType === 3 ? null : <>
|
||||
<td> {data?.comprehensive?.loss?.amount} </td>
|
||||
<td> {getRoundNumber(
|
||||
Number(data?.comprehensive?.finalAmount || 0)
|
||||
)} </td>
|
||||
</>
|
||||
}
|
||||
{/*<td> {data?.comprehensive?.refundOverall} </td>*/}
|
||||
|
||||
<td> - </td>
|
||||
<td> {getRoundNumber(
|
||||
Number(data?.comprehensive?.fee || 0)
|
||||
)} </td>
|
||||
{
|
||||
data?.tenement?.feeType === 3 ? null : <>
|
||||
<td> {getRoundNumber(
|
||||
Number(data?.comprehensive?.finalLossFee || 0)
|
||||
)} </td>
|
||||
<td> {getRoundNumber(
|
||||
Number(
|
||||
data?.comprehensive?.total || 0
|
||||
)
|
||||
)} </td>
|
||||
</>
|
||||
}
|
||||
|
||||
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
}, [data])
|
||||
|
||||
const renderTableSum = useCallback(() => {
|
||||
if (data?.meters?.length < 2) {
|
||||
return null;
|
||||
}
|
||||
return <tr key={data?.meters?.length + 1}>
|
||||
<td> 总计 </td>
|
||||
<td> - </td>
|
||||
<td> - </td>
|
||||
<td> - </td>
|
||||
<td> 总计</td>
|
||||
<td> -</td>
|
||||
<td> -</td>
|
||||
<td> -</td>
|
||||
{
|
||||
data?.park?.meter04kvType === Meter04KvType.DisableValley ?
|
||||
<td>{data?.comprehensive?.refundOverall}</td> :
|
||||
@ -218,29 +418,29 @@ export const UserReport: FC = () => {
|
||||
|
||||
)
|
||||
}
|
||||
{
|
||||
data?.park?.meter04kvType === Meter04KvType.DisableValley ?
|
||||
<td>{outputWithPrecision(data?.comprehensive?.publicAmount, 2, '-')}</td> :
|
||||
<td>
|
||||
<div> 尖:{data?.comprehensive?.poolSharp || 0} </div>
|
||||
<div> 峰:{data?.comprehensive?.poolPeak || 0} </div>
|
||||
<div> 平:{data?.comprehensive?.poolFlat || 0} </div>
|
||||
<div> 谷:{data?.comprehensive?.poolValley || 0} </div>
|
||||
</td>
|
||||
}
|
||||
{/*{*/}
|
||||
{/* data?.park?.meter04kvType === Meter04KvType.DisableValley ?*/}
|
||||
{/* <td>{outputWithPrecision(data?.comprehensive?.publicAmount, 2, '-')}</td> :*/}
|
||||
{/* <td>*/}
|
||||
{/* <div> 尖:{data?.comprehensive?.poolSharp || 0} </div>*/}
|
||||
{/* <div> 峰:{data?.comprehensive?.poolPeak || 0} </div>*/}
|
||||
{/* <div> 平:{data?.comprehensive?.poolFlat || 0} </div>*/}
|
||||
{/* <div> 谷:{data?.comprehensive?.poolValley || 0} </div>*/}
|
||||
{/* </td>*/}
|
||||
{/*}*/}
|
||||
|
||||
|
||||
<td>{outputWithPrecision(
|
||||
`${(data?.park?.meter04kvType === 0 ? amount?.current : data?.comprehensive?.finalAmount) || 0}`, 2, '-')}</td>
|
||||
</tr>
|
||||
}, [data?.meters, data?.park?.meter04kvType, data?.comprehensive])
|
||||
|
||||
const totalFee = data?.tenement?.feeType === 3 ? data?.comprehensive?.fee : data?.comprehensive?.total
|
||||
return (
|
||||
<>
|
||||
<style>
|
||||
{
|
||||
`
|
||||
td {
|
||||
td {
|
||||
padding: 0.2cm
|
||||
}
|
||||
${
|
||||
@ -262,6 +462,17 @@ export const UserReport: FC = () => {
|
||||
#content, .ant-col {
|
||||
font-size: 0.34cm;
|
||||
}
|
||||
|
||||
@media print {
|
||||
.page-break {
|
||||
page-break-before: always; /* 在此元素前分页 */
|
||||
/* 或 page-break-after: always; 在此元素后分页 */
|
||||
}
|
||||
}
|
||||
|
||||
#content {
|
||||
padding: 20px
|
||||
}
|
||||
`
|
||||
}
|
||||
</style>
|
||||
@ -358,283 +569,299 @@ export const UserReport: FC = () => {
|
||||
</Card>
|
||||
<Card style={{marginLeft: 20}}>
|
||||
<h4 tw='mt-1 mb-1'> 合计电费: </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.total, 2, '-')} 元 </div>
|
||||
<div> {outputWithPrecision(totalFee, 2, '-')} 元 </div>
|
||||
</Card>
|
||||
|
||||
</div>
|
||||
<div tw='mt-3'>
|
||||
电费构成
|
||||
{
|
||||
data?.tenement?.feeType === 3 ? <span style={{marginLeft: 20}}>
|
||||
(
|
||||
电费=电度电量*单价
|
||||
)
|
||||
</span> : <span style={{marginLeft: 20}}>
|
||||
(
|
||||
电费=(电度电量+线损电量)*单价
|
||||
)
|
||||
</span>
|
||||
}
|
||||
|
||||
<Divider tw='mt-2 mb-4 flex flex-col w-full'/>
|
||||
</div>
|
||||
{
|
||||
data?.park?.meter04kvType === 0 ? (
|
||||
<div tw='flex flex-row items-center' style={{
|
||||
height: 'fit-content',
|
||||
alignItems: "stretch",
|
||||
flexGrow: "stratch"
|
||||
}}>
|
||||
<div tw='flex flex-row items-center flex-wrap'>
|
||||
<Unit> ( </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 电度电量: </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.consumption, 2, '-')} 千瓦时</div>
|
||||
</Card>
|
||||
{
|
||||
data?.tenement?.feeType === 3 ? null : (
|
||||
<>
|
||||
<Unit> + </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 线损电量: </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.lossAmount, 2, '-')} 千瓦时</div>
|
||||
</Card>
|
||||
</>
|
||||
)
|
||||
}
|
||||
<div tw='flex flex-row items-center' style={{
|
||||
height: 'fit-content',
|
||||
alignItems: "stretch",
|
||||
flexGrow: "stratch"
|
||||
}}>
|
||||
<div tw='flex flex-row items-center flex-wrap'>
|
||||
<Unit> ( </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 电度电量: </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.consumption, 2, '-')} 千瓦时</div>
|
||||
</Card>
|
||||
{
|
||||
data?.tenement?.feeType === 3 ? null : (
|
||||
<>
|
||||
<Unit> + </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 线损电量: </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.lossAmount, 2, '-')} 千瓦时</div>
|
||||
</Card>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
<Unit> + </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 公摊电量: </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.publicAmount, 2, '-')} 千瓦时</div>
|
||||
</Card>
|
||||
{/*<Unit> - </Unit>*/}
|
||||
{/*<Card>*/}
|
||||
{/* <h4 tw='mt-1 mb-1'> 退补电量: </h4>*/}
|
||||
{/* <div> {outputWithPrecision(data?.comprehensive?.publicAmount, 2, '-')} 千瓦时</div>*/}
|
||||
{/*</Card>*/}
|
||||
<Unit> ) </Unit><Unit> * </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 电度单价: </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.price, 6, '-')} 千瓦时/元</div>
|
||||
</Card>
|
||||
<Unit> + </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 基本电费: </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.basicPooled, 2, '-')} 元</div>
|
||||
</Card>
|
||||
{/*<Unit> + </Unit>*/}
|
||||
{/*<Card>*/}
|
||||
{/* <h4 tw='mt-1 mb-1'> 调整电费: </h4>*/}
|
||||
{/* <div> {outputWithPrecision(data?.comprehensive?.adjustPooled, 2, '-')} 元</div>*/}
|
||||
{/*</Card>*/}
|
||||
<Unit> + </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 公摊电量: </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.publicAmount, 2, '-')} 千瓦时</div>
|
||||
</Card>
|
||||
{/*<Unit> - </Unit>*/}
|
||||
{/*<Card>*/}
|
||||
{/* <h4 tw='mt-1 mb-1'> 退补电量: </h4>*/}
|
||||
{/* <div> {outputWithPrecision(data?.comprehensive?.publicAmount, 2, '-')} 千瓦时</div>*/}
|
||||
{/*</Card>*/}
|
||||
<Unit> ) </Unit><Unit> * </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 电度单价: </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.price, 6, '-')} 千瓦时/元</div>
|
||||
</Card>
|
||||
<Unit> + </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 基本电费: </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.basicPooled, 2, '-')} 元</div>
|
||||
</Card>
|
||||
{/*<Unit> + </Unit>*/}
|
||||
{/*<Card>*/}
|
||||
{/* <h4 tw='mt-1 mb-1'> 调整电费: </h4>*/}
|
||||
{/* <div> {outputWithPrecision(data?.comprehensive?.adjustPooled, 2, '-')} 元</div>*/}
|
||||
{/*</Card>*/}
|
||||
</div>
|
||||
<div tw='flex flex-row items-center' style={{height: '100%', flex: 1}}>
|
||||
<Unit> = </Unit>
|
||||
<Card style={{height: 200}}>
|
||||
<h4 tw='mt-1 mb-1'> 本期总电费: </h4>
|
||||
<div> {outputWithPrecision(totalFee, 2, '-')} 元</div>
|
||||
</Card>
|
||||
</div>
|
||||
</div>
|
||||
<div tw='flex flex-row items-center' style={{height: '100%', flex: 1}}>
|
||||
<Unit> = </Unit>
|
||||
<Card style={{height: 200}}>
|
||||
<h4 tw='mt-1 mb-1'> 本期总电费: </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.total, 2, '-')} 元</div>
|
||||
</Card>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<div tw='' style={{
|
||||
height: 'fit-content',
|
||||
alignItems: "stretch",
|
||||
flexGrow: "stratch"
|
||||
}}>
|
||||
<div tw='flex flex-row items-center flex-wrap'>
|
||||
<Unit> ( </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 电度电量(尖): </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.sharpAmount, 2, '-')} 千瓦时</div>
|
||||
</Card>
|
||||
{
|
||||
data?.tenement?.feeType === 3 ? null : (
|
||||
<>
|
||||
<Unit> + </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 线损电量(尖): </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.lossSharp, 2, '-')} 千瓦时</div>
|
||||
</Card>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
<Unit> + </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 公摊电量(尖): </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.poolSharp || '0', 2, '-')} 千瓦时</div>
|
||||
</Card>
|
||||
{/*<Unit> - </Unit>*/}
|
||||
{/*<Card>*/}
|
||||
{/* <h4 tw='mt-1 mb-1'> 退补电量(尖): </h4>*/}
|
||||
{/* <div> {outputWithPrecision(data?.comprehensive?.refundSharp, 2, '-')} 千瓦时</div>*/}
|
||||
{/*</Card>*/}
|
||||
<Unit> ) </Unit><Unit> * </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 电度单价(尖): </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.priceSharp, 6, '-')} 千瓦时/元</div>
|
||||
</Card>
|
||||
<Unit> = </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 电费(尖): </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.finalSharpFee, 2, '-')} 元 </div>
|
||||
</Card>
|
||||
</div>
|
||||
<div tw='flex flex-row items-center flex-wrap'>
|
||||
<Unit> ( </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 电度电量(峰): </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.peakAmount, 2, '-')} 千瓦时</div>
|
||||
</Card>
|
||||
{
|
||||
data?.tenement?.feeType === 3 ? null : (
|
||||
<>
|
||||
<Unit> + </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 线损电量(峰): </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.lossPeak, 2, '-')} 千瓦时</div>
|
||||
</Card>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
<Unit> + </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 公摊电量(峰): </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.poolPeak, 2, '-')} 千瓦时</div>
|
||||
</Card>
|
||||
{/*<Unit> - </Unit>*/}
|
||||
{/*<Card>*/}
|
||||
{/* <h4 tw='mt-1 mb-1'> 退补电量(峰): </h4>*/}
|
||||
{/* <div> {outputWithPrecision(data?.comprehensive?.refundPeak, 2, '-')} 千瓦时</div>*/}
|
||||
{/*</Card>*/}
|
||||
<Unit> ) </Unit><Unit> * </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 用电单价(峰): </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.pricePeak, 6, '-')} 千瓦时/元</div>
|
||||
</Card>
|
||||
<Unit> = </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 电费(峰): </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.finalPeakFee, 2, '-')} 元 </div>
|
||||
</Card>
|
||||
</div>
|
||||
<div tw='flex flex-row items-center flex-wrap'>
|
||||
<Unit> ( </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 电度电量(平): </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.flatAmount, 2, '-')} 千瓦时</div>
|
||||
</Card>
|
||||
{
|
||||
data?.tenement?.feeType === 3 ? null : (
|
||||
<>
|
||||
<Unit> + </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 线损电量(平): </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.lossFlat, 2, '-')} 千瓦时</div>
|
||||
</Card>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
<Unit> + </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 公摊电量(平): </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.poolFlat, 2, '-')} 千瓦时</div>
|
||||
</Card>
|
||||
{/*<Unit> - </Unit>*/}
|
||||
{/*<Card>*/}
|
||||
{/* <h4 tw='mt-1 mb-1'> 退补电量(平): </h4>*/}
|
||||
{/* <div> {outputWithPrecision(data?.comprehensive?.refundFlat, 2, '-')} 千瓦时</div>*/}
|
||||
{/*</Card>*/}
|
||||
<Unit> ) </Unit><Unit> * </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 用电单价(平): </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.priceFlat, 6, '-')} 千瓦时/元</div>
|
||||
</Card>
|
||||
<Unit> = </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 电费(平): </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.finalFlatFee, 2, '-')} 元 </div>
|
||||
</Card>
|
||||
</div>
|
||||
<div tw='flex flex-row items-center flex-wrap'>
|
||||
<Unit> ( </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 电度电量(谷): </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.valleyAmount, 2, '-')} 千瓦时</div>
|
||||
</Card>
|
||||
{
|
||||
data?.tenement?.feeType === 3 ? null : (
|
||||
<>
|
||||
<Unit> + </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 线损电量(谷): </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.lossValley, 2, '-')} 千瓦时</div>
|
||||
</Card>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
<Unit> + </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 公摊电量(谷): </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.poolValley, 2, '-')} 千瓦时</div>
|
||||
</Card>
|
||||
{/*<Unit> - </Unit>*/}
|
||||
{/*<Card>*/}
|
||||
{/* <h4 tw='mt-1 mb-1'> 退补电量(谷): </h4>*/}
|
||||
{/* <div> {outputWithPrecision(data?.comprehensive?.refundValley, 2, '-')} 千瓦时</div>*/}
|
||||
{/*</Card>*/}
|
||||
<Unit> ) </Unit><Unit> * </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 用电单价(谷): </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.priceValley, 6, '-')} 千瓦时/元</div>
|
||||
</Card>
|
||||
<Unit> = </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 电费(谷): </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.finalValleyFee, 2, '-')} 元 </div>
|
||||
</Card>
|
||||
</div>
|
||||
<div tw='flex flex-row items-center flex-wrap'>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 电费(尖): </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.finalSharpFee, 2, '-')} 元
|
||||
</div>
|
||||
</Card>
|
||||
<Unit> + </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 电费(峰): </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.finalPeakFee, 2, '-')} 元
|
||||
</div>
|
||||
</Card>
|
||||
<Unit> + </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 电费(平): </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.finalFlatFee, 2, '-')} 元
|
||||
</div>
|
||||
</Card>
|
||||
<Unit> + </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 电费(谷): </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.finalValleyFee, 2, '-')} 元
|
||||
</div>
|
||||
</Card>
|
||||
<Unit> = </Unit>
|
||||
<Card>
|
||||
<h4 tw='mt-1 mb-1'> 本期总电费: </h4>
|
||||
<div> {outputWithPrecision(data?.comprehensive?.total, 2, '-')} 元 </div>
|
||||
</Card>
|
||||
</div>
|
||||
{/*<div tw='flex flex-row items-center' style={{height: '100%', flex: 1}}>*/}
|
||||
{/* <Unit> = </Unit>*/}
|
||||
{/* <Card style={{height: 200}}>*/}
|
||||
{/* <h4 tw='mt-1 mb-1'> 本期总电费(元): </h4>*/}
|
||||
{/* <div> {outputWithPrecision(data?.comprehensive?.total, 2, '-')} </div>*/}
|
||||
{/* </Card>*/}
|
||||
{/*</div>*/}
|
||||
</div>
|
||||
)
|
||||
) :
|
||||
renderFee()
|
||||
// (
|
||||
// <div tw='' style={{
|
||||
// height: 'fit-content',
|
||||
// alignItems: "stretch",
|
||||
// flexGrow: "stratch"
|
||||
// }}>
|
||||
// <div tw='flex flex-row items-center flex-wrap'>
|
||||
// <Unit> ( </Unit>
|
||||
// <Card>
|
||||
// <h4 tw='mt-1 mb-1'> 电度电量(尖): </h4>
|
||||
// <div> {outputWithPrecision(data?.comprehensive?.sharpAmount, 2, '-')} 千瓦时</div>
|
||||
// </Card>
|
||||
// {
|
||||
// data?.tenement?.feeType === 3 ? null : (
|
||||
// <>
|
||||
// <Unit> + </Unit>
|
||||
// <Card>
|
||||
// <h4 tw='mt-1 mb-1'> 线损电量(尖): </h4>
|
||||
// <div> {outputWithPrecision(data?.comprehensive?.lossSharp, 2, '-')} 千瓦时</div>
|
||||
// </Card>
|
||||
// </>
|
||||
// )
|
||||
// }
|
||||
//
|
||||
// <Unit> + </Unit>
|
||||
// <Card>
|
||||
// <h4 tw='mt-1 mb-1'> 公摊电量(尖): </h4>
|
||||
// <div> {outputWithPrecision(data?.comprehensive?.poolSharp || '0', 2, '-')} 千瓦时</div>
|
||||
// </Card>
|
||||
// {/*<Unit> - </Unit>*/}
|
||||
// {/*<Card>*/}
|
||||
// {/* <h4 tw='mt-1 mb-1'> 退补电量(尖): </h4>*/}
|
||||
// {/* <div> {outputWithPrecision(data?.comprehensive?.refundSharp, 2, '-')} 千瓦时</div>*/}
|
||||
// {/*</Card>*/}
|
||||
// <Unit> ) </Unit><Unit> * </Unit>
|
||||
// <Card>
|
||||
// <h4 tw='mt-1 mb-1'> 电度单价(尖): </h4>
|
||||
// <div> {outputWithPrecision(data?.comprehensive?.priceSharp, 6, '-')} 千瓦时/元</div>
|
||||
// </Card>
|
||||
// <Unit> = </Unit>
|
||||
// <Card>
|
||||
// <h4 tw='mt-1 mb-1'> 电费(尖): </h4>
|
||||
// <div> {outputWithPrecision(data?.comprehensive?.finalSharpFee, 2, '-')} 元 </div>
|
||||
// </Card>
|
||||
// </div>
|
||||
// <div tw='flex flex-row items-center flex-wrap'>
|
||||
// <Unit> ( </Unit>
|
||||
// <Card>
|
||||
// <h4 tw='mt-1 mb-1'> 电度电量(峰): </h4>
|
||||
// <div> {outputWithPrecision(data?.comprehensive?.peakAmount, 2, '-')} 千瓦时</div>
|
||||
// </Card>
|
||||
// {
|
||||
// data?.tenement?.feeType === 3 ? null : (
|
||||
// <>
|
||||
// <Unit> + </Unit>
|
||||
// <Card>
|
||||
// <h4 tw='mt-1 mb-1'> 线损电量(峰): </h4>
|
||||
// <div> {outputWithPrecision(data?.comprehensive?.lossPeak, 2, '-')} 千瓦时</div>
|
||||
// </Card>
|
||||
// </>
|
||||
// )
|
||||
// }
|
||||
//
|
||||
// <Unit> + </Unit>
|
||||
// <Card>
|
||||
// <h4 tw='mt-1 mb-1'> 公摊电量(峰): </h4>
|
||||
// <div> {outputWithPrecision(data?.comprehensive?.poolPeak, 2, '-')} 千瓦时</div>
|
||||
// </Card>
|
||||
// {/*<Unit> - </Unit>*/}
|
||||
// {/*<Card>*/}
|
||||
// {/* <h4 tw='mt-1 mb-1'> 退补电量(峰): </h4>*/}
|
||||
// {/* <div> {outputWithPrecision(data?.comprehensive?.refundPeak, 2, '-')} 千瓦时</div>*/}
|
||||
// {/*</Card>*/}
|
||||
// <Unit> ) </Unit><Unit> * </Unit>
|
||||
// <Card>
|
||||
// <h4 tw='mt-1 mb-1'> 用电单价(峰): </h4>
|
||||
// <div> {outputWithPrecision(data?.comprehensive?.pricePeak, 6, '-')} 千瓦时/元</div>
|
||||
// </Card>
|
||||
// <Unit> = </Unit>
|
||||
// <Card>
|
||||
// <h4 tw='mt-1 mb-1'> 电费(峰): </h4>
|
||||
// <div> {outputWithPrecision(data?.comprehensive?.finalPeakFee, 2, '-')} 元 </div>
|
||||
// </Card>
|
||||
// </div>
|
||||
// <div tw='flex flex-row items-center flex-wrap'>
|
||||
// <Unit> ( </Unit>
|
||||
// <Card>
|
||||
// <h4 tw='mt-1 mb-1'> 电度电量(平): </h4>
|
||||
// <div> {outputWithPrecision(data?.comprehensive?.flatAmount, 2, '-')} 千瓦时</div>
|
||||
// </Card>
|
||||
// {
|
||||
// data?.tenement?.feeType === 3 ? null : (
|
||||
// <>
|
||||
// <Unit> + </Unit>
|
||||
// <Card>
|
||||
// <h4 tw='mt-1 mb-1'> 线损电量(平): </h4>
|
||||
// <div> {outputWithPrecision(data?.comprehensive?.lossFlat, 2, '-')} 千瓦时</div>
|
||||
// </Card>
|
||||
// </>
|
||||
// )
|
||||
// }
|
||||
//
|
||||
// <Unit> + </Unit>
|
||||
// <Card>
|
||||
// <h4 tw='mt-1 mb-1'> 公摊电量(平): </h4>
|
||||
// <div> {outputWithPrecision(data?.comprehensive?.poolFlat, 2, '-')} 千瓦时</div>
|
||||
// </Card>
|
||||
// {/*<Unit> - </Unit>*/}
|
||||
// {/*<Card>*/}
|
||||
// {/* <h4 tw='mt-1 mb-1'> 退补电量(平): </h4>*/}
|
||||
// {/* <div> {outputWithPrecision(data?.comprehensive?.refundFlat, 2, '-')} 千瓦时</div>*/}
|
||||
// {/*</Card>*/}
|
||||
// <Unit> ) </Unit><Unit> * </Unit>
|
||||
// <Card>
|
||||
// <h4 tw='mt-1 mb-1'> 用电单价(平): </h4>
|
||||
// <div> {outputWithPrecision(data?.comprehensive?.priceFlat, 6, '-')} 千瓦时/元</div>
|
||||
// </Card>
|
||||
// <Unit> = </Unit>
|
||||
// <Card>
|
||||
// <h4 tw='mt-1 mb-1'> 电费(平): </h4>
|
||||
// <div> {outputWithPrecision(data?.comprehensive?.finalFlatFee, 2, '-')} 元 </div>
|
||||
// </Card>
|
||||
// </div>
|
||||
// <div tw='flex flex-row items-center flex-wrap'>
|
||||
// <Unit> ( </Unit>
|
||||
// <Card>
|
||||
// <h4 tw='mt-1 mb-1'> 电度电量(谷): </h4>
|
||||
// <div> {outputWithPrecision(data?.comprehensive?.valleyAmount, 2, '-')} 千瓦时</div>
|
||||
// </Card>
|
||||
// {
|
||||
// data?.tenement?.feeType === 3 ? null : (
|
||||
// <>
|
||||
// <Unit> + </Unit>
|
||||
// <Card>
|
||||
// <h4 tw='mt-1 mb-1'> 线损电量(谷): </h4>
|
||||
// <div> {outputWithPrecision(data?.comprehensive?.lossValley, 2, '-')} 千瓦时</div>
|
||||
// </Card>
|
||||
// </>
|
||||
// )
|
||||
// }
|
||||
//
|
||||
// <Unit> + </Unit>
|
||||
// <Card>
|
||||
// <h4 tw='mt-1 mb-1'> 公摊电量(谷): </h4>
|
||||
// <div> {outputWithPrecision(data?.comprehensive?.poolValley, 2, '-')} 千瓦时</div>
|
||||
// </Card>
|
||||
// {/*<Unit> - </Unit>*/}
|
||||
// {/*<Card>*/}
|
||||
// {/* <h4 tw='mt-1 mb-1'> 退补电量(谷): </h4>*/}
|
||||
// {/* <div> {outputWithPrecision(data?.comprehensive?.refundValley, 2, '-')} 千瓦时</div>*/}
|
||||
// {/*</Card>*/}
|
||||
// <Unit> ) </Unit><Unit> * </Unit>
|
||||
// <Card>
|
||||
// <h4 tw='mt-1 mb-1'> 用电单价(谷): </h4>
|
||||
// <div> {outputWithPrecision(data?.comprehensive?.priceValley, 6, '-')} 千瓦时/元</div>
|
||||
// </Card>
|
||||
// <Unit> = </Unit>
|
||||
// <Card>
|
||||
// <h4 tw='mt-1 mb-1'> 电费(谷): </h4>
|
||||
// <div> {outputWithPrecision(data?.comprehensive?.finalValleyFee, 2, '-')} 元 </div>
|
||||
// </Card>
|
||||
// </div>
|
||||
// <div tw='flex flex-row items-center flex-wrap'>
|
||||
// <Card>
|
||||
// <h4 tw='mt-1 mb-1'> 电费(尖): </h4>
|
||||
// <div> {outputWithPrecision(data?.comprehensive?.finalSharpFee, 2, '-')} 元
|
||||
// </div>
|
||||
// </Card>
|
||||
// <Unit> + </Unit>
|
||||
// <Card>
|
||||
// <h4 tw='mt-1 mb-1'> 电费(峰): </h4>
|
||||
// <div> {outputWithPrecision(data?.comprehensive?.finalPeakFee, 2, '-')} 元
|
||||
// </div>
|
||||
// </Card>
|
||||
// <Unit> + </Unit>
|
||||
// <Card>
|
||||
// <h4 tw='mt-1 mb-1'> 电费(平): </h4>
|
||||
// <div> {outputWithPrecision(data?.comprehensive?.finalFlatFee, 2, '-')} 元
|
||||
// </div>
|
||||
// </Card>
|
||||
// <Unit> + </Unit>
|
||||
// <Card>
|
||||
// <h4 tw='mt-1 mb-1'> 电费(谷): </h4>
|
||||
// <div> {outputWithPrecision(data?.comprehensive?.finalValleyFee, 2, '-')} 元
|
||||
// </div>
|
||||
// </Card>
|
||||
// <Unit> = </Unit>
|
||||
// <Card>
|
||||
// <h4 tw='mt-1 mb-1'> 本期总电费: </h4>
|
||||
// <div> {outputWithPrecision(data?.comprehensive?.total, 2, '-')} 元 </div>
|
||||
// </Card>
|
||||
// </div>
|
||||
// {/*<div tw='flex flex-row items-center' style={{height: '100%', flex: 1}}>*/}
|
||||
// {/* <Unit> = </Unit>*/}
|
||||
// {/* <Card style={{height: 200}}>*/}
|
||||
// {/* <h4 tw='mt-1 mb-1'> 本期总电费(元): </h4>*/}
|
||||
// {/* <div> {outputWithPrecision(data?.comprehensive?.total, 2, '-')} </div>*/}
|
||||
// {/* </Card>*/}
|
||||
// {/*</div>*/}
|
||||
// </div>
|
||||
// )
|
||||
}
|
||||
</div>
|
||||
<div>
|
||||
<div tw='mt-4'>
|
||||
<div className={"page-break"} style={{paddingTop: 30}}>
|
||||
<div>
|
||||
用电明细
|
||||
<span style={{marginLeft: 20}}>
|
||||
(
|
||||
电度电量=(止码-起码)*倍率-退补电量-从表电量,
|
||||
合计电量=电度电量+线损电量+公摊电量
|
||||
)
|
||||
合计电量=电度电量+线损电量
|
||||
{/*+公摊电量*/}
|
||||
)
|
||||
</span>
|
||||
<Divider tw='mt-2 mb-4 flex flex-col w-full'/>
|
||||
</div>
|
||||
@ -655,7 +882,7 @@ export const UserReport: FC = () => {
|
||||
<td>线损电量</td>
|
||||
)
|
||||
}
|
||||
<td>公摊电量</td>
|
||||
{/*<td>公摊电量</td>*/}
|
||||
<td>合计电量</td>
|
||||
</tr>
|
||||
</thead>
|
||||
|
@ -499,6 +499,10 @@ export type TenementComprehensiveDetail = PooledSumDetail & {
|
||||
*/
|
||||
finalAmount: string;
|
||||
finalLossFee: string;
|
||||
finalSharpAmount: string,
|
||||
finalPeakAmount: string,
|
||||
finalFlatAmount: string,
|
||||
finalValleyAmount: string,
|
||||
};
|
||||
|
||||
/**
|
||||
|
Loading…
x
Reference in New Issue
Block a user