|
@@ -13,9 +13,9 @@ const Detail:React.FC<DetailProps> = (props) => {
|
|
|
const { contract, type } = props
|
|
|
const type_name = type === ContractType.INCOME ? '回款' : '支付'
|
|
|
const progress = useMemo(() => {
|
|
|
- const i = parseFloat((parseFloat(contract.returned) / parseFloat(contract.price)).toFixed(2))
|
|
|
+ const i = parseFloat((parseFloat(type === ContractType.INCOME ? contract.returned : contract.paid) / parseFloat(contract.price)).toFixed(2))
|
|
|
const j: number = 1 - i
|
|
|
- const k: number = parseFloat(contract.price) - parseFloat(contract.returned)
|
|
|
+ const k: number = parseFloat(contract.price) - parseFloat(type === ContractType.INCOME ? contract.returned : contract.paid)
|
|
|
return { returned: isNaN(i) ? '0%' : i * 100 + '%', unReturned: isNaN(j) ? '100%' : j * 100 + '%', unReturnedMoney: k }
|
|
|
}, [ contract ])
|
|
|
return contract.id ? (
|
|
@@ -25,10 +25,10 @@ const Detail:React.FC<DetailProps> = (props) => {
|
|
|
<tr><th style={{ width: '10%' }}>项目内容</th><td style={{ width: '40%' }}>{contract.content}</td><th style={{ width: '10%' }}>合同名称</th><td style={{ width: '40%' }}>{contract.name}</td></tr>
|
|
|
<tr><th>合同编号</th><td>{contract.code}</td><th>状态</th><td><span className={contractConsts[contract.status].className}>{contractConsts[contract.status].text}</span></td></tr>
|
|
|
<tr><th>合同金额</th><td>{formatMoney(contract.price)}</td><th>创建时间</th><td>{contract.createTime}</td></tr>
|
|
|
- <tr><th>{type_name}金额</th><td>{formatMoney(contract.returned)}</td><th>未{type_name}金额</th><td>{formatMoney(progress.unReturnedMoney)}</td></tr>
|
|
|
+ <tr><th>{type_name}金额</th><td>{formatMoney(type === ContractType.INCOME ? contract.returned : contract.paid)}</td><th>未{type_name}金额</th><td>{formatMoney(progress.unReturnedMoney)}</td></tr>
|
|
|
<tr><th>{type_name}进度</th><td className={styles.progressContainer} colSpan={3}><div className={styles.progressContent}>
|
|
|
- <Tooltip title={`已支付:¥ ${formatMoney(contract.returned)}`}>
|
|
|
- <div className={[ styles.progressBar, 'pi-bg-success' ].join(' ')} style={{ width: progress.returned }}>{formatMoney(contract.returned)}</div>
|
|
|
+ <Tooltip title={`已支付:¥ ${formatMoney(type === ContractType.INCOME ? contract.returned : contract.paid)}`}>
|
|
|
+ <div className={[ styles.progressBar, 'pi-bg-success' ].join(' ')} style={{ width: progress.returned }}>{formatMoney(type === ContractType.INCOME ? contract.returned : contract.paid)}</div>
|
|
|
</Tooltip>
|
|
|
<Tooltip title={`未支付:¥ ${formatMoney(progress.unReturnedMoney)}`}>
|
|
|
<div className={[ styles.progressBar, 'pi-bg-gray' ].join(' ')} style={{ width: progress.unReturned }}>{formatMoney(progress.unReturned)}</div>
|