icleafreportui 0.2.7 → 0.2.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Reports/ImportContent/CourseReportContent.js +1 -1
- package/dist/Reports/ImportContent/ExamPackReportContent.js +1 -1
- package/dist/Reports/ImportContent/ExamReportContent.js +1 -1
- package/dist/Reports/ImportContent/ReportViewer.js +52 -32
- package/package.json +1 -1
- package/dist/Reports/ReportContent.js +0 -275
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React, { useState, useEffect } from 'react';
|
|
2
2
|
import { Autocomplete, FormControl, Button, Grid, Box, Typography, Paper, Snackbar, Alert, CircularProgress, TextField } from '@mui/material';
|
|
3
|
-
import { useTenant } from '
|
|
3
|
+
import { useTenant } from '../../context/TenantProvider';
|
|
4
4
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
5
5
|
function CourseReportContent() {
|
|
6
6
|
const {
|
|
@@ -4,7 +4,7 @@ import { DataGrid } from '@mui/x-data-grid';
|
|
|
4
4
|
import FileDownloadOutlinedIcon from '@mui/icons-material/FileDownloadOutlined';
|
|
5
5
|
import SearchOutlinedIcon from '@mui/icons-material/SearchOutlined';
|
|
6
6
|
import Backdrop from '@mui/material/Backdrop';
|
|
7
|
-
import { useTenant } from '
|
|
7
|
+
import { useTenant } from '../../context/TenantProvider';
|
|
8
8
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
9
9
|
function ExamPackReportContent() {
|
|
10
10
|
const {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React, { useState, useEffect } from 'react';
|
|
2
2
|
import { Autocomplete, FormControl, Button, Grid, Box, Typography, Paper, Snackbar, Alert, CircularProgress, TextField } from '@mui/material';
|
|
3
|
-
import { useTenant } from '
|
|
3
|
+
import { useTenant } from '../../context/TenantProvider';
|
|
4
4
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
5
5
|
function ExamReportContent() {
|
|
6
6
|
const {
|
|
@@ -1,42 +1,62 @@
|
|
|
1
|
+
// import React from 'react';
|
|
2
|
+
// import Header from '../../components/Header';
|
|
3
|
+
// import Sidebar from '../../components/sidebar';
|
|
4
|
+
// import ExamReportContent from './ExamReportContent';
|
|
5
|
+
// import CourseReportContent from './CourseReportContent';
|
|
6
|
+
// import ExamPackReportContent from './ExamPackReportContent';
|
|
7
|
+
|
|
8
|
+
// function ReportViewer({ type = 'exam', embedded = false }) {
|
|
9
|
+
// const renderContent = () => {
|
|
10
|
+
// switch (type) {
|
|
11
|
+
// case 'exam':
|
|
12
|
+
// return <ExamReportContent />;
|
|
13
|
+
// case 'course':
|
|
14
|
+
// return <CourseReportContent />;
|
|
15
|
+
// case 'exampack':
|
|
16
|
+
// return <ExamPackReportContent />;
|
|
17
|
+
// default:
|
|
18
|
+
// return <ExamReportContent />;
|
|
19
|
+
// }
|
|
20
|
+
// };
|
|
21
|
+
|
|
22
|
+
// // If embedded mode, just return the content (no Header/Sidebar)
|
|
23
|
+
// if (embedded) {
|
|
24
|
+
// return renderContent();
|
|
25
|
+
// }
|
|
26
|
+
|
|
27
|
+
// // Full layout with Header and Sidebar
|
|
28
|
+
// return (
|
|
29
|
+
// <div>
|
|
30
|
+
// <Header />
|
|
31
|
+
// <Sidebar />
|
|
32
|
+
// <div style={{ padding: "100px 0px 0px 100px", marginLeft: "140px" }}>
|
|
33
|
+
// {renderContent()}
|
|
34
|
+
// </div>
|
|
35
|
+
// </div>
|
|
36
|
+
// );
|
|
37
|
+
// }
|
|
38
|
+
|
|
39
|
+
// export default ReportViewer;
|
|
40
|
+
|
|
41
|
+
// ReportViewer.js - Simplified
|
|
1
42
|
import React from 'react';
|
|
2
|
-
import Header from '../components/Header';
|
|
3
|
-
import Sidebar from '../components/sidebar';
|
|
4
43
|
import ExamReportContent from './ExamReportContent';
|
|
5
44
|
import CourseReportContent from './CourseReportContent';
|
|
6
45
|
import ExamPackReportContent from './ExamPackReportContent';
|
|
7
|
-
import { jsx as _jsx
|
|
46
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
8
47
|
function ReportViewer(_ref) {
|
|
9
48
|
let {
|
|
10
|
-
type = 'exam'
|
|
11
|
-
embedded = false
|
|
49
|
+
type = 'exam'
|
|
12
50
|
} = _ref;
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
return /*#__PURE__*/_jsx(ExamReportContent, {});
|
|
23
|
-
}
|
|
24
|
-
};
|
|
25
|
-
|
|
26
|
-
// If embedded mode, just return the content (no Header/Sidebar)
|
|
27
|
-
if (embedded) {
|
|
28
|
-
return renderContent();
|
|
51
|
+
switch (type) {
|
|
52
|
+
case 'exam':
|
|
53
|
+
return /*#__PURE__*/_jsx(ExamReportContent, {});
|
|
54
|
+
case 'course':
|
|
55
|
+
return /*#__PURE__*/_jsx(CourseReportContent, {});
|
|
56
|
+
case 'exampack':
|
|
57
|
+
return /*#__PURE__*/_jsx(ExamPackReportContent, {});
|
|
58
|
+
default:
|
|
59
|
+
return /*#__PURE__*/_jsx(ExamReportContent, {});
|
|
29
60
|
}
|
|
30
|
-
|
|
31
|
-
// Full layout with Header and Sidebar
|
|
32
|
-
return /*#__PURE__*/_jsxs("div", {
|
|
33
|
-
children: [/*#__PURE__*/_jsx(Header, {}), /*#__PURE__*/_jsx(Sidebar, {}), /*#__PURE__*/_jsx("div", {
|
|
34
|
-
style: {
|
|
35
|
-
padding: "100px 0px 0px 100px",
|
|
36
|
-
marginLeft: "140px"
|
|
37
|
-
},
|
|
38
|
-
children: renderContent()
|
|
39
|
-
})]
|
|
40
|
-
});
|
|
41
61
|
}
|
|
42
62
|
export default ReportViewer;
|
package/package.json
CHANGED
|
@@ -1,275 +0,0 @@
|
|
|
1
|
-
import React, { useState, useEffect } from 'react';
|
|
2
|
-
import { Autocomplete, FormControl, Button, Grid, Box, Typography, Paper, Snackbar, Alert, CircularProgress, TextField, Checkbox, FormControlLabel } from '@mui/material';
|
|
3
|
-
import { useTenant } from '../context/TenantProvider';
|
|
4
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
5
|
-
function ReportContent() {
|
|
6
|
-
const {
|
|
7
|
-
apiClient
|
|
8
|
-
} = useTenant();
|
|
9
|
-
const [subjects, setSubjects] = useState([]);
|
|
10
|
-
const [examPacks, setExamPacks] = useState([]);
|
|
11
|
-
const [exams, setExams] = useState([]);
|
|
12
|
-
const [users, setUsers] = useState([]);
|
|
13
|
-
const [selectedSubject, setSelectedSubject] = useState(null);
|
|
14
|
-
const [selectedExamPack, setSelectedExamPack] = useState(null);
|
|
15
|
-
const [selectedExam, setSelectedExam] = useState(null);
|
|
16
|
-
const [selectedUser, setSelectedUser] = useState(null);
|
|
17
|
-
const [alertMessage, setAlertMessage] = useState('');
|
|
18
|
-
const [openAlert, setOpenAlert] = useState(false);
|
|
19
|
-
const [loading, setLoading] = useState(false);
|
|
20
|
-
const [onlyWrongAnswers, setOnlyWrongAnswers] = useState(false);
|
|
21
|
-
const baseURL = process.env.REACT_APP_BASE_URL;
|
|
22
|
-
useEffect(() => {
|
|
23
|
-
fetchAllSubjects();
|
|
24
|
-
}, []);
|
|
25
|
-
const fetchAllSubjects = async () => {
|
|
26
|
-
try {
|
|
27
|
-
const data = await apiClient.get('/api/showAllSubjects');
|
|
28
|
-
setSubjects(data);
|
|
29
|
-
} catch (error) {
|
|
30
|
-
console.error('Error fetching subjects:', error);
|
|
31
|
-
}
|
|
32
|
-
};
|
|
33
|
-
const fetchExamPacks = async subjectId => {
|
|
34
|
-
try {
|
|
35
|
-
const data = await apiClient.get(`/api/getAllExamPacks?subjectId=${subjectId}`);
|
|
36
|
-
setExamPacks(data);
|
|
37
|
-
} catch (error) {
|
|
38
|
-
console.error('Error fetching exam packs:', error);
|
|
39
|
-
}
|
|
40
|
-
};
|
|
41
|
-
const fetchExams = async examPackId => {
|
|
42
|
-
try {
|
|
43
|
-
const data = await apiClient.get(`/api/getAllExams?examPackId=${examPackId}`);
|
|
44
|
-
setExams(data);
|
|
45
|
-
} catch (error) {
|
|
46
|
-
console.error('Error fetching exams:', error);
|
|
47
|
-
}
|
|
48
|
-
};
|
|
49
|
-
const fetchUsers = async examId => {
|
|
50
|
-
try {
|
|
51
|
-
const data = await apiClient.get(`/api/getAllUsers?examId=${examId}`);
|
|
52
|
-
setUsers(data);
|
|
53
|
-
} catch (error) {
|
|
54
|
-
console.error('Error fetching users:', error);
|
|
55
|
-
}
|
|
56
|
-
};
|
|
57
|
-
const handleSubjectChange = (event, newValue) => {
|
|
58
|
-
setSelectedSubject(newValue);
|
|
59
|
-
setSelectedExamPack(null);
|
|
60
|
-
setSelectedExam(null);
|
|
61
|
-
setSelectedUser(null);
|
|
62
|
-
setExamPacks([]);
|
|
63
|
-
setExams([]);
|
|
64
|
-
setUsers([]);
|
|
65
|
-
if (newValue) {
|
|
66
|
-
fetchExamPacks(newValue.subjectId);
|
|
67
|
-
}
|
|
68
|
-
};
|
|
69
|
-
const handleExamPackChange = (event, newValue) => {
|
|
70
|
-
setSelectedExamPack(newValue);
|
|
71
|
-
setSelectedExam(null);
|
|
72
|
-
setSelectedUser(null);
|
|
73
|
-
setExams([]);
|
|
74
|
-
setUsers([]);
|
|
75
|
-
if (newValue) {
|
|
76
|
-
fetchExams(newValue.id);
|
|
77
|
-
}
|
|
78
|
-
};
|
|
79
|
-
const handleExamChange = (event, newValue) => {
|
|
80
|
-
setSelectedExam(newValue);
|
|
81
|
-
setSelectedUser(null);
|
|
82
|
-
setUsers([]);
|
|
83
|
-
if (newValue) {
|
|
84
|
-
fetchUsers(newValue.id);
|
|
85
|
-
}
|
|
86
|
-
};
|
|
87
|
-
const handleUserChange = (event, newValue) => {
|
|
88
|
-
setSelectedUser(newValue);
|
|
89
|
-
};
|
|
90
|
-
const handleDownload = async () => {
|
|
91
|
-
setLoading(true);
|
|
92
|
-
try {
|
|
93
|
-
const response = await fetch(`${baseURL}api/generateReportForSingleUser?subjectId=${selectedSubject.subjectId}&examPackId=${selectedExamPack.id}&examId=${selectedExam.id}&userId=${selectedUser.id}&wrongAnswerFlag=${onlyWrongAnswers}`, {
|
|
94
|
-
headers: {
|
|
95
|
-
'X-Tenant-Token': apiClient.tenantToken
|
|
96
|
-
}
|
|
97
|
-
});
|
|
98
|
-
const blob = await response.blob();
|
|
99
|
-
const blobUrl = URL.createObjectURL(blob);
|
|
100
|
-
const link = document.createElement('a');
|
|
101
|
-
link.href = blobUrl;
|
|
102
|
-
link.setAttribute('download', 'Report.xlsx');
|
|
103
|
-
document.body.appendChild(link);
|
|
104
|
-
link.click();
|
|
105
|
-
link.parentNode.removeChild(link);
|
|
106
|
-
URL.revokeObjectURL(blobUrl);
|
|
107
|
-
} catch (error) {
|
|
108
|
-
console.error('Error downloading report:', error);
|
|
109
|
-
} finally {
|
|
110
|
-
setLoading(false);
|
|
111
|
-
}
|
|
112
|
-
};
|
|
113
|
-
return /*#__PURE__*/_jsxs(Box, {
|
|
114
|
-
sx: {
|
|
115
|
-
maxWidth: 800,
|
|
116
|
-
mx: 'auto',
|
|
117
|
-
my: 4,
|
|
118
|
-
p: 3,
|
|
119
|
-
backgroundColor: '#f5f5f5',
|
|
120
|
-
borderRadius: 2
|
|
121
|
-
},
|
|
122
|
-
children: [/*#__PURE__*/_jsxs(Paper, {
|
|
123
|
-
elevation: 6,
|
|
124
|
-
sx: {
|
|
125
|
-
p: 5,
|
|
126
|
-
textAlign: 'center',
|
|
127
|
-
backgroundColor: '#fff'
|
|
128
|
-
},
|
|
129
|
-
children: [/*#__PURE__*/_jsx(Typography, {
|
|
130
|
-
variant: "h4",
|
|
131
|
-
component: "h1",
|
|
132
|
-
gutterBottom: true,
|
|
133
|
-
sx: {
|
|
134
|
-
color: '#3f51b5',
|
|
135
|
-
marginBottom: "20px"
|
|
136
|
-
},
|
|
137
|
-
children: "Exam Report"
|
|
138
|
-
}), /*#__PURE__*/_jsxs(Grid, {
|
|
139
|
-
container: true,
|
|
140
|
-
spacing: 2,
|
|
141
|
-
justifyContent: "center",
|
|
142
|
-
children: [/*#__PURE__*/_jsx(Grid, {
|
|
143
|
-
item: true,
|
|
144
|
-
xs: 12,
|
|
145
|
-
sm: 6,
|
|
146
|
-
children: /*#__PURE__*/_jsx(FormControl, {
|
|
147
|
-
fullWidth: true,
|
|
148
|
-
children: /*#__PURE__*/_jsx(Autocomplete, {
|
|
149
|
-
id: "ddlSubject",
|
|
150
|
-
options: subjects,
|
|
151
|
-
getOptionLabel: option => option.subjectName,
|
|
152
|
-
value: selectedSubject,
|
|
153
|
-
onChange: handleSubjectChange,
|
|
154
|
-
renderInput: params => /*#__PURE__*/_jsx(TextField, {
|
|
155
|
-
...params,
|
|
156
|
-
label: "Subject"
|
|
157
|
-
})
|
|
158
|
-
})
|
|
159
|
-
})
|
|
160
|
-
}), /*#__PURE__*/_jsx(Grid, {
|
|
161
|
-
item: true,
|
|
162
|
-
xs: 12,
|
|
163
|
-
sm: 6,
|
|
164
|
-
children: /*#__PURE__*/_jsx(FormControl, {
|
|
165
|
-
fullWidth: true,
|
|
166
|
-
children: /*#__PURE__*/_jsx(Autocomplete, {
|
|
167
|
-
id: "ddlExamPack",
|
|
168
|
-
options: examPacks,
|
|
169
|
-
getOptionLabel: option => option.name,
|
|
170
|
-
value: selectedExamPack,
|
|
171
|
-
onChange: handleExamPackChange,
|
|
172
|
-
renderInput: params => /*#__PURE__*/_jsx(TextField, {
|
|
173
|
-
...params,
|
|
174
|
-
label: "Exam Pack"
|
|
175
|
-
})
|
|
176
|
-
})
|
|
177
|
-
})
|
|
178
|
-
}), /*#__PURE__*/_jsx(Grid, {
|
|
179
|
-
item: true,
|
|
180
|
-
xs: 12,
|
|
181
|
-
sm: 6,
|
|
182
|
-
children: /*#__PURE__*/_jsx(FormControl, {
|
|
183
|
-
fullWidth: true,
|
|
184
|
-
children: /*#__PURE__*/_jsx(Autocomplete, {
|
|
185
|
-
id: "ddlExam",
|
|
186
|
-
options: exams,
|
|
187
|
-
getOptionLabel: option => option.examName,
|
|
188
|
-
value: selectedExam,
|
|
189
|
-
onChange: handleExamChange,
|
|
190
|
-
renderInput: params => /*#__PURE__*/_jsx(TextField, {
|
|
191
|
-
...params,
|
|
192
|
-
label: "Exam"
|
|
193
|
-
})
|
|
194
|
-
})
|
|
195
|
-
})
|
|
196
|
-
}), /*#__PURE__*/_jsx(Grid, {
|
|
197
|
-
item: true,
|
|
198
|
-
xs: 12,
|
|
199
|
-
sm: 6,
|
|
200
|
-
children: /*#__PURE__*/_jsx(FormControl, {
|
|
201
|
-
fullWidth: true,
|
|
202
|
-
children: /*#__PURE__*/_jsx(Autocomplete, {
|
|
203
|
-
id: "ddlUser",
|
|
204
|
-
options: users,
|
|
205
|
-
getOptionLabel: option => option.userName,
|
|
206
|
-
value: selectedUser,
|
|
207
|
-
onChange: handleUserChange,
|
|
208
|
-
renderInput: params => /*#__PURE__*/_jsx(TextField, {
|
|
209
|
-
...params,
|
|
210
|
-
label: "User"
|
|
211
|
-
})
|
|
212
|
-
})
|
|
213
|
-
})
|
|
214
|
-
})]
|
|
215
|
-
}), /*#__PURE__*/_jsxs(Box, {
|
|
216
|
-
sx: {
|
|
217
|
-
mt: 3,
|
|
218
|
-
position: 'relative'
|
|
219
|
-
},
|
|
220
|
-
children: [/*#__PURE__*/_jsx(FormControlLabel, {
|
|
221
|
-
control: /*#__PURE__*/_jsx(Checkbox, {
|
|
222
|
-
checked: onlyWrongAnswers,
|
|
223
|
-
onChange: e => setOnlyWrongAnswers(e.target.checked)
|
|
224
|
-
}),
|
|
225
|
-
label: "Only Wrong Answers"
|
|
226
|
-
}), /*#__PURE__*/_jsxs(Box, {
|
|
227
|
-
sx: {
|
|
228
|
-
mt: 2,
|
|
229
|
-
position: 'relative'
|
|
230
|
-
},
|
|
231
|
-
children: [/*#__PURE__*/_jsx(Button, {
|
|
232
|
-
variant: "contained",
|
|
233
|
-
color: "primary",
|
|
234
|
-
onClick: handleDownload,
|
|
235
|
-
disabled: !selectedSubject || !selectedExamPack || !selectedExam || !selectedUser || loading,
|
|
236
|
-
sx: {
|
|
237
|
-
width: 'auto',
|
|
238
|
-
backgroundColor: '#3f51b5',
|
|
239
|
-
'&:hover': {
|
|
240
|
-
backgroundColor: '#303f9f'
|
|
241
|
-
}
|
|
242
|
-
},
|
|
243
|
-
children: loading ? 'Downloading...' : 'Download Report'
|
|
244
|
-
}), loading && /*#__PURE__*/_jsx(CircularProgress, {
|
|
245
|
-
size: 24,
|
|
246
|
-
sx: {
|
|
247
|
-
position: 'absolute',
|
|
248
|
-
top: '50%',
|
|
249
|
-
left: '50%',
|
|
250
|
-
marginTop: '-12px',
|
|
251
|
-
marginLeft: '-12px'
|
|
252
|
-
}
|
|
253
|
-
})]
|
|
254
|
-
})]
|
|
255
|
-
})]
|
|
256
|
-
}), /*#__PURE__*/_jsx(Snackbar, {
|
|
257
|
-
open: openAlert,
|
|
258
|
-
autoHideDuration: 6000,
|
|
259
|
-
onClose: () => setOpenAlert(false),
|
|
260
|
-
anchorOrigin: {
|
|
261
|
-
vertical: 'top',
|
|
262
|
-
horizontal: 'center'
|
|
263
|
-
},
|
|
264
|
-
children: /*#__PURE__*/_jsx(Alert, {
|
|
265
|
-
onClose: () => setOpenAlert(false),
|
|
266
|
-
severity: "info",
|
|
267
|
-
sx: {
|
|
268
|
-
width: '100%'
|
|
269
|
-
},
|
|
270
|
-
children: alertMessage
|
|
271
|
-
})
|
|
272
|
-
})]
|
|
273
|
-
});
|
|
274
|
-
}
|
|
275
|
-
export default ReportContent;
|