devops/encoach_frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Initial draft of level test report

Browse Source
This commit is contained in:
Joao Ramos
2024-08-20 23:40:54 +01:00
parent 3367384791
commit 65f8368708
4 changed files with 693 additions and 393 deletions
Download Patch File Download Diff File Expand all files Collapse all files

184
src/exams/pdf/level.test.report.tsx Normal file
View File

@@ -0,0 +1,184 @@
/* eslint-disable jsx-a11y/alt-text */
import React from "react";
import { Document, Page, View, Text, Image } from "@react-pdf/renderer";
import { ModuleScore } from "@/interfaces/module.scores";
import { styles } from "./styles";
import { StyleSheet } from "@react-pdf/renderer";
const customStyles = StyleSheet.create({
testDetails: {
display: "flex",
gap: 4,
},
testDetailsContainer: {
display: "flex",
gap: 16,
},
table: {
width: "100%",
margin: "10px",
},
tableRow: {
flexDirection: "row",
},
tableCol50: {
width: "50%", // First column width (50%)
borderStyle: "solid",
borderWidth: 1,
borderColor: "#000",
padding: 5,
},
tableCol25: {
width: "16.67%", // Remaining four columns each get 1/6 of the total width (50% / 3 = 16.67%)
borderStyle: "solid",
borderWidth: 1,
borderColor: "#000",
padding: 5,
},
tableCol20: {
width: "20%", // Width for each of the 5 sub-columns (50% / 5 = 20%)
borderStyle: "solid",
borderWidth: 1,
borderColor: "#000",
padding: 5,
},
tableCellHeader: {
backgroundColor: "#d3d3d3",
fontWeight: "bold",
textAlign: "center",
},
tableCell: {
fontSize: 10,
textAlign: "center",
},
});
interface Props {
date: string;
name: string;
email: string;
id: string;
gender?: string;
passportId: string;
corporateName: string;
downloadDate: string;
userId: string;
uniqueExercises: { name: string; result: string }[];
timeSpent: string;
score: string;
}
const LevelTestReport = ({
date,
name,
email,
id,
gender,
passportId,
corporateName,
downloadDate,
userId,
uniqueExercises,
timeSpent,
score,
}: Props) => {
const defaultTextStyle = [styles.textFont, { fontSize: 8 }];
return (
<Document>
<Page style={styles.body}>
<Text style={[styles.textFont, styles.textBold, { fontSize: 11 }]}>
Corporate Name: {corporateName}
</Text>
<View style={styles.textMargin}>
<Text style={defaultTextStyle}>
Report Download date: {downloadDate}
</Text>
</View>
<Text style={[styles.textFont, styles.textBold, { fontSize: 11 }]}>
Test Information: {id}
</Text>
<View style={styles.textMargin}>
<Text style={defaultTextStyle}>Date of Test: {date}</Text>
<Text style={defaultTextStyle}>Candidates name: {name}</Text>
<Text style={defaultTextStyle}>Email: {email}</Text>
<Text style={defaultTextStyle}>National ID: {passportId}</Text>
<Text style={defaultTextStyle}>Gender: {gender}</Text>
<Text style={defaultTextStyle}>Candidate ID: {userId}</Text>
</View>
<View style={customStyles.table}>
{/* Header Row */}
<View style={customStyles.tableRow}>
<View style={customStyles.tableCol50}>
<Text style={customStyles.tableCellHeader}>Test sections</Text>
</View>
<View style={customStyles.tableCol25}>
<Text style={customStyles.tableCellHeader}>Time spent</Text>
</View>
<View style={customStyles.tableCol25}>
<Text style={customStyles.tableCellHeader}>Score</Text>
</View>
</View>
<View style={customStyles.tableRow}>
<View style={customStyles.tableCol50}>
<View style={customStyles.tableRow}>
{uniqueExercises.map((exercise, index) => (
<View style={customStyles.tableCol20} key={index}>
<Text style={customStyles.tableCell}>Part {index + 1}</Text>
</View>
))}
</View>
</View>
<View style={customStyles.tableCol25}>
<Text style={customStyles.tableCell}></Text>
</View>
<View style={customStyles.tableCol25}>
<Text style={customStyles.tableCell}></Text>
</View>
</View>
<View style={customStyles.tableRow}>
<View style={customStyles.tableCol50}>
<View style={customStyles.tableRow}>
{uniqueExercises.map((exercise, index) => (
<View style={customStyles.tableCol20} key={index}>
<Text style={customStyles.tableCell}>{exercise.name}</Text>
</View>
))}
</View>
</View>
<View style={customStyles.tableCol25}>
<Text style={customStyles.tableCell}></Text>
</View>
<View style={customStyles.tableCol25}>
<Text style={customStyles.tableCell}></Text>
</View>
</View>
<View style={customStyles.tableRow}>
<View style={customStyles.tableCol50}>
<View style={customStyles.tableRow}>
{uniqueExercises.map((exercise, index) => (
<View style={customStyles.tableCol20} key={index}>
<Text style={customStyles.tableCell}>
{exercise.result}
</Text>
</View>
))}
</View>
</View>
<View style={customStyles.tableCol25}>
<Text style={customStyles.tableCell}>{timeSpent}</Text>
</View>
<View style={customStyles.tableCol25}>
<Text style={customStyles.tableCell}>{score}</Text>
</View>
</View>
</View>
</Page>
</Document>
);
};
export default LevelTestReport;