WuYanBo
/
CodeReview
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: update SVG circle radius and improve code readability in ReportExportDialog
Build and Push CodeReview / build (push) Waiting to run Details

This commit is contained in:
vinland100 2026-01-12 15:08:33 +08:00
parent 7f951d5451
commit 7c0d95385f
2 changed files with 537 additions and 333 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

770
docs/audit_report_智能漏洞挖掘审计 - 完整示例_2025-12-15.html
View File

File diff suppressed because it is too large Load Diff

14
frontend/src/pages/AgentAudit/components/ReportExportDialog.tsx
View File

@ -866,8 +866,8 @@ export const ReportExportDialog = memo(function ReportExportDialog({
}; };
const scoreInfo = getScoreGrade(score); const scoreInfo = getScoreGrade(score);
// SVG 圆环进度条 // SVG 圆环进度条 (逆时针方向)
const circumference = 2 * Math.PI * 40; // r=40 (smaller) const circumference = 2 * Math.PI * 23; // r=23 matches SVG circle radius
const strokeDashoffset = circumference - (score / 100) * circumference; const strokeDashoffset = circumference - (score / 100) * circumference;
return `<!DOCTYPE html> return `<!DOCTYPE html>
@ -1012,8 +1012,8 @@ export const ReportExportDialog = memo(function ReportExportDialog({
transform: rotate(-90deg); transform: rotate(-90deg);
width: 56px; width: 56px;
height: 56px; height: 56px;
display: block;
} }
.score-ring-bg { fill: none; stroke: var(--border); stroke-width: 5; } .score-ring-bg { fill: none; stroke: var(--border); stroke-width: 5; }
.score-ring-progress { .score-ring-progress {
fill: none; fill: none;
@ -1457,10 +1457,10 @@ export const ReportExportDialog = memo(function ReportExportDialog({
<span class="severity-bar-title">分布</span> <span class="severity-bar-title">分布</span>
<div class="severity-bar"> <div class="severity-bar">
${totalFindings > 0 ? ` ${totalFindings > 0 ? `
<div class="severity-segment critical" style="width:${(criticalCount/totalFindings)*100}%"></div> <div class="severity-segment critical" style="width:${(criticalCount / totalFindings) * 100}%"></div>
<div class="severity-segment high" style="width:${(highCount/totalFindings)*100}%"></div> <div class="severity-segment high" style="width:${(highCount / totalFindings) * 100}%"></div>
<div class="severity-segment medium" style="width:${(mediumCount/totalFindings)*100}%"></div> <div class="severity-segment medium" style="width:${(mediumCount / totalFindings) * 100}%"></div>
<div class="severity-segment low" style="width:${(lowCount/totalFindings)*100}%"></div> <div class="severity-segment low" style="width:${(lowCount / totalFindings) * 100}%"></div>
` : ''} ` : ''}
</div> </div>
<div class="severity-legend"> <div class="severity-legend">