Index: frontend/src/App.tsx =================================================================== --- frontend/src/App.tsx (revision 9b0f66162d93107b4626777c841d96d52ae70e1c) +++ frontend/src/App.tsx (revision 163061383ecaae65cf5deaf1b58dc6277dcbbe25) @@ -5,4 +5,5 @@ import Navbar from "./components/Navbar"; import PrivateRoute from "./components/PrivateRoute"; +import ScrollToTop from "./components/ScrollToTop"; import CourseCatalog from "./components/SubjectCatalog/SubjectCatalog"; import { AuthProvider } from "./context/AuthProvider"; @@ -14,7 +15,7 @@ import Recommendations from "./pages/Recommendations"; import Register from "./pages/Register"; +import ReviewForm from "./pages/ReviewForm"; import SubjectPreferences from "./pages/SubjectPreferences"; import SubjectView from "./pages/SubjectView"; -import ScrollToTop from "./components/ScrollToTop"; const Layout = () => ( @@ -79,4 +80,13 @@ }, { + path: "review-form/:code", + element: ( + + + + ), + }, + + { path: "*", element: , Index: frontend/src/index.css =================================================================== --- frontend/src/index.css (revision 9b0f66162d93107b4626777c841d96d52ae70e1c) +++ frontend/src/index.css (revision 163061383ecaae65cf5deaf1b58dc6277dcbbe25) @@ -59,13 +59,9 @@ .hide-scrollbar::-webkit-scrollbar { - display: none; /* For Chrome, Safari, and Opera */ + display: none; /* For Chrome, Safari, and Opera */ } .hide-scrollbar { - -ms-overflow-style: none; /* For Internet Explorer and Edge */ - scrollbar-width: none; /* For Firefox */ + -ms-overflow-style: none; /* For Internet Explorer and Edge */ + scrollbar-width: none; /* For Firefox */ } - -:root { - background: rgb(37 99 235 / var(--tw-bg-opacity, 1)); -} Index: frontend/src/pages/ReviewForm.tsx =================================================================== --- frontend/src/pages/ReviewForm.tsx (revision 163061383ecaae65cf5deaf1b58dc6277dcbbe25) +++ frontend/src/pages/ReviewForm.tsx (revision 163061383ecaae65cf5deaf1b58dc6277dcbbe25) @@ -0,0 +1,498 @@ +import { AlertCircle, Plus, Trash2 } from "lucide-react"; +import { useState } from "react"; +import { useLocation, useNavigate } from "react-router-dom"; +import axiosInstance from "../api/axiosInstance"; +import { EvaluationComponent, EvaluationMethod } from "../components/types"; + +const COMPONENT_CATEGORIES = [ + { value: "project", label: "Проект" }, + { value: "theory", label: "Теорија" }, + { value: "practical", label: "Практично" }, + { value: "homework", label: "Домашни задачи" }, + { value: "labs", label: "Лабораториски" }, + { value: "presentation", label: "Презентација" }, + { value: "attendance", label: "Присуство" }, +]; + +const ReviewForm = () => { + const [reviewType, setReviewType] = useState<"evaluation" | "other" | "">(""); + const [error, setError] = useState(""); + const [methods, setMethods] = useState([ + { + note: "", + components: [{ category: "project", percentage: 100 }], + }, + ]); + const [signatureCondition, setSignatureCondition] = useState(""); + const [signatureType, setSignatureType] = useState< + "none" | "points" | "attendance" + >("none"); + const [signatureRequiredAmount, setSignatureRequiredAmount] = useState(""); + const [signatureMaxAmount, setSignatureMaxAmount] = useState(""); + const navigate = useNavigate(); + const location = useLocation(); + const subjectName: string = location?.state?.subject_name; + const subjectId: number = location?.state?.subject_id; + const eval_ = location?.state?.has_evaluation_review; + const hasEvaluation: boolean = !eval_ || eval_ === "true"; + // const { code } = useParams(); + + const addMethod = () => { + if (methods.length < 3) { + setMethods([ + ...methods, + { + note: "", + components: [{ category: "project", percentage: 100 }], + }, + ]); + } + }; + + const removeMethod = (methodIndex: number) => { + if (methods.length > 1) { + setMethods(methods.filter((_, index) => index !== methodIndex)); + } + }; + + const updateMethodNote = (methodIndex: number, note: string) => { + const updatedMethods = [...methods]; + updatedMethods[methodIndex].note = note; + setMethods(updatedMethods); + }; + + const addComponent = (methodIndex: number) => { + const updatedMethods = [...methods]; + updatedMethods[methodIndex].components.push({ + category: "project", + percentage: 0, + }); + setMethods(updatedMethods); + }; + + const removeComponent = (methodIndex: number, componentIndex: number) => { + const updatedMethods = [...methods]; + if (updatedMethods[methodIndex].components.length > 1) { + updatedMethods[methodIndex].components.splice(componentIndex, 1); + setMethods(updatedMethods); + } + }; + + const updateComponent = ( + methodIndex: number, + componentIndex: number, + field: keyof EvaluationComponent, + value: string | number + ) => { + const updatedMethods = [...methods]; + updatedMethods[methodIndex].components[componentIndex] = { + ...updatedMethods[methodIndex].components[componentIndex], + [field]: value, + }; + setMethods(updatedMethods); + }; + + const getMethodPercentageTotal = (method: EvaluationMethod): number => { + return method.components.reduce( + (sum, component) => sum + (component.percentage || 0), + 0 + ); + }; + + const isMethodValid = (method: EvaluationMethod): boolean => { + const categories = method.components.map((c) => c.category); + const uniqueCategories = new Set(categories); + return ( + getMethodPercentageTotal(method) === 100 && + uniqueCategories.size === categories.length + ); + }; + + const areAllMethodsValid = (): boolean => { + return methods.every(isMethodValid); + }; + + const handleSubmit = async (e: React.FormEvent) => { + e.preventDefault(); + setError(""); + + if (Number(signatureMaxAmount) < Number(signatureRequiredAmount)) { + alert(1); + setError("Провери услов за потпис"); + return; + } + + if (reviewType === "evaluation" && !areAllMethodsValid()) { + setError("Сумата на сите проценти за секој метод мора да биде 100%"); + return; + } + + if (reviewType === "evaluation" && signatureType !== "none") { + if (!signatureRequiredAmount || !signatureMaxAmount) { + setError( + "Ве молиме внесете ги сите потребни вредности за условот за потпис" + ); + return; + } + } + + if (reviewType !== "evaluation") { + alert("todo"); + return; + } + + // post specific for evaluation reviews + try { + await axiosInstance.post("/subjects/subject-review/", { + subject_id: subjectId, + type: "evaluation", + methods: methods, + signature_condition: signatureCondition, + }); + navigate(-1); + // TODO: maybe add message for succesfull post + } catch (err) { + console.error(err); + } + }; + + return ( +
+

Додај рецензија

+ + {subjectName && ( +
+

+ Додавате рецензија за предмет:{" "} + {subjectName} +

+
+ )} + +
+
+ +
+ {!hasEvaluation && ( + + )} + +
+
+ + {/* evaluation */} + {reviewType === "evaluation" && ( +
+
+ + + + {signatureType === "points" && ( +
+ { + setSignatureRequiredAmount(e.target.value); + if (e.target.value && signatureMaxAmount) { + setSignatureCondition( + `${e.target.value}/${signatureMaxAmount} поени на лабораториски` + ); + } + }} + placeholder="Потребни поени" + className="flex-1 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" + required + /> + / + { + setSignatureMaxAmount(e.target.value); + if (signatureRequiredAmount && e.target.value) { + setSignatureCondition( + `${signatureRequiredAmount}/${e.target.value} поени на лабораториски` + ); + } + }} + placeholder="Максимални поени" + className="flex-1 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" + required + /> + {/* поени */} +
+ )} + + {signatureType === "attendance" && ( +
+ { + setSignatureRequiredAmount(e.target.value); + if (e.target.value && signatureMaxAmount) { + setSignatureCondition( + `${e.target.value}/${signatureMaxAmount} присуство на лабораториски` + ); + } + }} + placeholder="Потребно присуство" + className="flex-1 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" + required + /> + / + { + setSignatureMaxAmount(e.target.value); + if (signatureRequiredAmount && e.target.value) { + setSignatureCondition( + `${signatureRequiredAmount}/${e.target.value} присуство на лабораториски` + ); + } + }} + placeholder="Вкупно лабораториски вежби" + className="flex-1 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" + required + /> +
+ )} +
+ +
+
+

+ Начини на оценување ({methods.length}/3) +

+ {methods.length < 3 && ( + + )} +
+ + {methods.map((method, methodIndex) => ( +
+
+

+ Метод {methodIndex + 1} +

+ {methods.length > 1 && ( + + )} +
+ +
+ + + updateMethodNote(methodIndex, e.target.value) + } + placeholder="Дополнителни информации за овој метод" + className="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" + /> +
+ +
+
+ + +
+ + {method.components.map((component, componentIndex) => ( +
+ + +
+ + updateComponent( + methodIndex, + componentIndex, + "percentage", + parseInt(e.target.value) || 0 + ) + } + className="w-20 px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" + /> + % +
+ + {method.components.length > 1 && ( + + )} +
+ ))} + +
+
+ + Вкупно: {getMethodPercentageTotal(method)}% + + {!isMethodValid(method) && ( +
+ + + Мора да биде 100% и сите компоненти да се + различни. + +
+ )} +
+
+
+
+ ))} +
+
+ )} + + {reviewType === "other" && ( +
+

TODO

+
+ )} + + {/* error */} + {error && ( +
+
+ +

{error}

+
+
+ )} + + {reviewType && ( +
+ +
+ )} +
+
+ ); +}; + +export default ReviewForm; Index: frontend/src/pages/SubjectView.tsx =================================================================== --- frontend/src/pages/SubjectView.tsx (revision 9b0f66162d93107b4626777c841d96d52ae70e1c) +++ frontend/src/pages/SubjectView.tsx (revision 163061383ecaae65cf5deaf1b58dc6277dcbbe25) @@ -294,5 +294,18 @@ )}
-