gitea/amati
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: pie chart

Browse Source
This commit is contained in:
Sukma Gladys 2024-12-11 14:52:47 +07:00
parent dbd29e56de
commit d0f69da82b
1 changed files with 4 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
apps/frontend/src/routes/_dashboardLayout/assessmentResult/index.lazy.tsx
View File

@ -225,7 +225,7 @@ export default function AssessmentResultPage() {
// Pie Chart Component // Pie Chart Component
function PieChartComponent({ chartData, totalScore, chartConfig }: { chartData: { aspectName: string, score: number, fill: string }[], totalScore: number, chartConfig: ChartConfig }) { function PieChartComponent({ chartData, totalScore, chartConfig }: { chartData: { aspectName: string, score: number, fill: string }[], totalScore: number, chartConfig: ChartConfig }) {
return ( return (
<div className="flex lg:flex-col w-full border-none"> <div className="flex flex-col w-full border-none">
<div className="flex-1 pb-0 w-72"> <div className="flex-1 pb-0 w-72">
<ChartContainer <ChartContainer
config={chartConfig} config={chartConfig}
@ -291,24 +291,13 @@ export default function AssessmentResultPage() {
{/* Legend */} {/* Legend */}
<div className="flex flex-col lg:grid lg:grid-cols-2 gap-x-4 text-xs justify-center gap-2 lg:gap-0"> <div className="flex flex-col lg:grid lg:grid-cols-2 gap-x-4 text-xs justify-center gap-2 lg:gap-0">
<div className="flex flex-col gap-2"> <div className="flex flex-col gap-2">
{chartData.slice(0, 3).map((entry, index) => ( {chartData.map((entry, index) => (
<div key={index} className="flex items-center gap-2"> <div key={index} className="flex items-center gap-2">
<span <span
className="w-4 h-4" className="pl-4 w-4 h-4"
style={{ backgroundColor: entry.fill }} style={{ backgroundColor: entry.fill }}
/> />
<span className="font-medium">{entry.aspectName}</span> <span className="font-medium whitespace-nowrap">{entry.aspectName}</span>
</div>
))}
</div>
<div className="flex flex-col gap-2">
{chartData.slice(3).map((entry, index) => (
<div key={index} className="flex items-center gap-2">
<span
className="w-4 h-4"
style={{ backgroundColor: entry.fill }}
/>
<span className="font-medium">{entry.aspectName}</span>
</div> </div>
))} ))}
</div> </div>