Added the missing radial progress

This commit is contained in:
Joao Ramos
2024-01-15 19:32:11 +00:00
parent e47607597c
commit 46b9fe50ef
2 changed files with 20 additions and 3 deletions

View File

@@ -25,6 +25,8 @@ interface Props {
qrcode: string;
renderDetails: React.ReactNode;
title: string;
summaryPNG: string;
summaryScore: string;
}
const TestReport = ({
@@ -39,6 +41,8 @@ const TestReport = ({
logo,
qrcode,
renderDetails,
summaryPNG,
summaryScore,
}: Props) => {
const defaultTextStyle = [styles.textFont, { fontSize: 8 }];
const defaultSkillsTextStyle = [styles.textFont, { fontSize: 8 }];
@@ -104,8 +108,16 @@ const TestReport = ({
>
Performance Summary
</Text>
<View>
<Text style={[styles.textFont, { fontSize: 8 }]}>{summary}</Text>
<View style={{ display: "flex", flexDirection: "row", gap: 16 }}>
<View style={{ flex: 1 }}>
<Text style={[styles.textFont, { fontSize: 8 }]}>{summary}</Text>
</View>
<View style={[styles.textFont, styles.radialContainer]} debug>
<Image src={summaryPNG} style={styles.image64}></Image>
<View style={[styles.textColor, styles.radialResultContainer]} debug>
<Text style={styles.textBold}>{summaryScore}</Text>
</View>
</View>
</View>
</View>
<View style={[{ paddingTop: 30 }, styles.separator]}></View>

View File

@@ -263,12 +263,14 @@ async function post(req: NextApiRequest, res: NextApiResponse) {
);
const overallResult = overallScore / overallTotal;
const overallPNG = getRadialProgressPNG("laranja", overallScore, overallTotal);
// generate the overall detail report
const overallDetail = {
module: "Overall",
score: overallScore,
total: overallTotal,
png: getRadialProgressPNG("laranja", overallScore, overallTotal),
png: overallPNG,
} as ModuleScore;
const testDetails = [overallDetail, ...finalResults];
@@ -301,6 +303,7 @@ async function post(req: NextApiRequest, res: NextApiResponse) {
};
const { title, details } = getCustomData();
const pdfStream = await ReactPDF.renderToStream(
<TestReport
title={title}
@@ -314,6 +317,8 @@ async function post(req: NextApiRequest, res: NextApiResponse) {
renderDetails={details}
logo={"public/logo_title.png"}
qrcode={qrcode}
summaryPNG={overallPNG}
summaryScore={`${(overallResult * 100).toFixed(0)}%`}
/>
);