vf/vf_react
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update pay ui

Browse Source
This commit is contained in:
zzlgreat
2025-12-10 14:12:11 +08:00
parent 3cb9b4237b
commit 4fd1a24db4
1 changed files with 16 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
src/components/StockChart/TimelineChartModal.tsx
View File

@@ -217,27 +217,34 @@ const TimelineChartModal: React.FC<TimelineChartModalProps> = ({
if (dataIndex === undefined) return ''; if (dataIndex === undefined) return '';
const item = data[dataIndex]; const item = data[dataIndex];
const changeColor = item.change_percent >= 0 ? '#ef5350' : '#26a69a'; if (!item) return '';
const changeSign = item.change_percent >= 0 ? '+' : '';
// 安全格式化数字
const safeFixed = (val: any, digits = 2) =>
val != null && !isNaN(val) ? Number(val).toFixed(digits) : '-';
const changePercent = item.change_percent ?? 0;
const changeColor = changePercent >= 0 ? '#ef5350' : '#26a69a';
const changeSign = changePercent >= 0 ? '+' : '';
return ` return `
<div style="padding: 8px;"> <div style="padding: 8px;">
<div style="font-weight: bold; margin-bottom: 8px;">${item.time}</div> <div style="font-weight: bold; margin-bottom: 8px;">${item.time || '-'}</div>
<div style="display: flex; justify-content: space-between; margin-bottom: 4px;"> <div style="display: flex; justify-content: space-between; margin-bottom: 4px;">
<span>价格:</span> <span>价格:</span>
<span style="color: ${changeColor}; font-weight: bold; margin-left: 20px;">${item.price.toFixed(2)}</span> <span style="color: ${changeColor}; font-weight: bold; margin-left: 20px;">${safeFixed(item.price)}</span>
</div> </div>
<div style="display: flex; justify-content: space-between; margin-bottom: 4px;"> <div style="display: flex; justify-content: space-between; margin-bottom: 4px;">
<span>均价:</span> <span>均价:</span>
<span style="color: #ffa726; margin-left: 20px;">${item.avg_price.toFixed(2)}</span> <span style="color: #ffa726; margin-left: 20px;">${safeFixed(item.avg_price)}</span>
</div> </div>
<div style="display: flex; justify-content: space-between; margin-bottom: 4px;"> <div style="display: flex; justify-content: space-between; margin-bottom: 4px;">
<span>涨跌幅:</span> <span>涨跌幅:</span>
<span style="color: ${changeColor}; margin-left: 20px;">${changeSign}${item.change_percent.toFixed(2)}%</span> <span style="color: ${changeColor}; margin-left: 20px;">${changeSign}${safeFixed(changePercent)}%</span>
</div> </div>
<div style="display: flex; justify-content: space-between;"> <div style="display: flex; justify-content: space-between;">
<span>成交量:</span> <span>成交量:</span>
<span style="margin-left: 20px;">${(item.volume / 100).toFixed(0)}手</span> <span style="margin-left: 20px;">${item.volume != null ? (item.volume / 100).toFixed(0) : '-'}手</span>
</div> </div>
</div> </div>
`; `;
@@ -314,7 +321,7 @@ const TimelineChartModal: React.FC<TimelineChartModalProps> = ({
axisLabel: { axisLabel: {
color: '#999', color: '#999',
fontSize: isMobile ? 10 : 12, fontSize: isMobile ? 10 : 12,
formatter: (value: number) => value.toFixed(2), formatter: (value: number) => (value != null && !isNaN(value)) ? value.toFixed(2) : '-',
}, },
}, },
{ {
@@ -333,6 +340,7 @@ const TimelineChartModal: React.FC<TimelineChartModalProps> = ({
color: '#999', color: '#999',
fontSize: isMobile ? 10 : 12, fontSize: isMobile ? 10 : 12,
formatter: (value: number) => { formatter: (value: number) => {
if (value == null || isNaN(value)) return '-';
if (value >= 10000) { if (value >= 10000) {
return (value / 10000).toFixed(1) + '万'; return (value / 10000).toFixed(1) + '万';
} }