Skip to content

Commit 13a1d6a

Browse files
committed
home page ui update
1 parent b2c98c9 commit 13a1d6a

File tree

143 files changed

+12264
-14
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

143 files changed

+12264
-14
lines changed

Diff for: .history/src/Router_20230405142959.jsx

+50
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
import {Routes, Route} from 'react-router-dom';
2+
import AdminDashboardPage from './pages/AdminDashboardPage';
3+
import StudentDashboardPage from './pages/StudentDashboardPage';
4+
import Welcome from './Welcome'
5+
import Home from './pages/Home';
6+
import AdminLoginPage from './pages/AdminLoginPage'
7+
import QuizPage from './pages/QuizFormPage';
8+
import TestView from './pages/TestView';
9+
import TestViewStudent from './pages/TestViewStudent';
10+
import PreviewQuiz from "./components/QuizPreview"
11+
import EditQuiz from "./components/EditQuiz"
12+
import NotFound from './pages/NotFound';
13+
import Results from './pages/Results';
14+
import ResultsStudent from './pages/ResultsStudent';
15+
import Profile from './pages/Profile';
16+
import ProtectedRouter from './components/ProtectedRouter';
17+
import ProtectedRouterStudent from './components/ProtectedRouterStudent';
18+
function Router() {
19+
const name = localStorage.getItem('name')
20+
21+
return (
22+
<Routes>
23+
<Route path='*' element={<NotFound />}/>
24+
<Route path="/" element={<Home/>} />
25+
<Route path="/Login" element={<AdminLoginPage/>} />
26+
27+
<Route path={`/${name}/profile`} element={<Profile />} />
28+
29+
<Route element={<ProtectedRouter/>}>
30+
<Route path="/admin-dashboard" element={<AdminDashboardPage/>} />
31+
<Route path="/edit-quiz" element={<EditQuiz/>} />
32+
<Route path="/prev-quiz" element={<PreviewQuiz/>} />
33+
<Route path="/create-quiz" element={<QuizPage/>} />
34+
<Route path={`/test-view`} element={<TestView />} />
35+
<Route path="/results" element={<Results />} />
36+
</Route>
37+
38+
<Route element={<ProtectedRouterStudent/>}>
39+
<Route path="/user-dashboard" element={<StudentDashboardPage/>} />
40+
<Route path={`/${name}/test-view`} element={<TestViewStudent />} />
41+
<Route path={`/${name}/result`} element={<ResultsStudent />} />
42+
43+
</Route>
44+
45+
46+
</Routes>
47+
)
48+
}
49+
50+
export default Router;
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
import React from 'react'
2+
import { Outlet, Navigate } from 'react-router-dom'
3+
4+
export default function ProtectedRouter({children}) {
5+
6+
const role = localStorage.getItem("role")
7+
8+
return(
9+
role==="Teacher" ? <Outlet /> : <Navigate to="/login" />
10+
)
11+
12+
}
+188
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,188 @@
1+
import React from 'react'
2+
import NavBar from '../components/NavBar'
3+
import { db } from "../firebase/firebaseConfig"
4+
import { getDoc, doc } from "firebase/firestore";
5+
import $ from 'jquery'
6+
import Swal from 'sweetalert2';
7+
8+
var question_add = false
9+
10+
11+
12+
export default class PreviewQuiz extends React.Component {
13+
constructor(props) {
14+
super(props)
15+
16+
this.state = {
17+
data: {},
18+
path1: "",
19+
path2: ""
20+
}
21+
}
22+
23+
componentDidMount() {
24+
let searchParams = new URLSearchParams(window.location.search)
25+
26+
var path1 = searchParams.get("path1")
27+
var path2 = searchParams.get("path2")
28+
29+
this.setState({ path1: path1, path2: path2 })
30+
31+
this.getData(path1, path2)
32+
// this.addQuestion(this.state.data)
33+
}
34+
35+
async getData(path1, path2) {
36+
const docRef = doc(db, path1, path2)
37+
const docSnap = await getDoc(docRef);
38+
var data = docSnap.data()
39+
40+
this.setState({ data: data })
41+
// console.log(data)
42+
this.addQuestion(data)
43+
}
44+
45+
addOption = (qNo, options, data, ans, ques) => {
46+
var options_len = (data["questions"][ques]["options"].length)
47+
// console.log(ans)
48+
49+
for (var i = 0; i < options_len; i++) {
50+
if (i === ans - 1) {
51+
// console.log(`: ${i}`)
52+
$(`#q-${qNo}-ans`).append(`
53+
<div>
54+
<input id="ans-c-q-${qNo}-${i}" type="checkbox" checked disabled/>
55+
<input id='ans-op-q-${qNo}-${i}' type="text" value="${options[i]}" disabled></input>
56+
</div>
57+
`)
58+
$(`#ans-op-q-${qNo}-${i}`).attr("class", "bg-gray-50 m-1 ml-4 p-2 rounded-md outline-0 focus:bg-gray-100")
59+
$(`#ans-op-q-${qNo}-${i}`).attr("style", "min-width:90%")
60+
}
61+
else {
62+
$(`#q-${qNo}-ans`).append(`
63+
<div>
64+
<input id="ans-c-q-${qNo}-${i}" type="checkbox" disabled />
65+
<input id='ans-op-q-${qNo}-${i}' type="text" value="${options[i]}" disabled></input>
66+
</div>
67+
`)
68+
$(`#ans-op-q-${qNo}-${i}`).attr("class", "bg-gray-50 m-1 ml-4 p-2 rounded-md outline-0 focus:bg-gray-100")
69+
$(`#ans-op-q-${qNo}-${i}`).attr("style", "min-width:90%")
70+
}
71+
}
72+
}
73+
74+
addQuestion(data) {
75+
if (question_add == false) {
76+
// console.log(data["questions"])
77+
78+
for (let i = 0; i < parseInt(data["no_of_question"]); i++) {
79+
var questions = Object.keys(data["questions"])[i]
80+
81+
let result = questions.includes("https://firebasestorage.googleapis.com/v0/b/quize-a1c9e.appspot.com/o/");
82+
// console.log(result)
83+
84+
if (result === true) {
85+
$("#question-container").append(`
86+
<form id=""form-q-${i} class="bg-white p-5 md:p-8 max-w-[500px] space-y-8 shadow rounded-lg w-11/12 mb-4">
87+
88+
<div class="flex flex-col space-y-2">
89+
<img
90+
id="q-${i}"
91+
class="bg-gray-200 p-2 rounded-md outline-0 focus:bg-gray-300"
92+
placeholder='Question:' src="${questions}"></img>
93+
<div id="q-${i}-ans">
94+
95+
</div>
96+
</div>
97+
</form>
98+
`)
99+
} else {
100+
$("#question-container").append(`
101+
<form id=""form-q-${i} class="bg-white p-5 md:p-8 max-w-[500px] space-y-8 shadow rounded-lg w-11/12 mb-4">
102+
103+
<div class="flex flex-col space-y-2">
104+
<textarea
105+
type="text"
106+
aria-multiline="true"
107+
id="q-${i}"
108+
class="bg-gray-200 p-2 rounded-md outline-0 focus:bg-gray-300"
109+
placeholder='Question:'
110+
wrap='hard'
111+
disabled
112+
>${questions}</textarea>
113+
<div id="q-${i}-ans">
114+
115+
</div>
116+
</div>
117+
</form>
118+
`)
119+
}
120+
121+
}
122+
123+
for (let i = 0; i < parseInt(data["no_of_question"]); i++) {
124+
var questions = Object.keys(data["questions"])[i]
125+
var options = data["questions"][questions]["options"]
126+
var ans = data["questions"][questions]["ans"]
127+
128+
this.addOption(i, options, data, ans, questions)
129+
}
130+
131+
question_add = true
132+
}
133+
}
134+
135+
changeQuiz() {
136+
window.location.replace(`/edit-quiz?path1=${this.state.path1}&path2=${this.state.path2}`)
137+
}
138+
139+
submit() {
140+
Swal.fire(
141+
"Quiz Ready",
142+
"Quiz will start according to the given time",
143+
"success"
144+
)
145+
146+
setTimeout(() => { window.location.replace("/admin-dashboard") }, 2000)
147+
}
148+
149+
150+
render() {
151+
return (
152+
<div className="bg-gradient-to-r from-primary to-accent ">
153+
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Poppins&display=swap" />
154+
155+
<NavBar link={this.state.link} />
156+
157+
<div className="flex justify-center items-center min-h-screen flex-col mt-10" id="questions" >
158+
<form className="bg-white p-5 md:p-8 max-w-[500px] space-y-2 shadow rounded-lg w-11/12 mb-4">
159+
<h2 className="text-3xl font-medium pb-4">Details:</h2>
160+
<h4 className="text-2xl font-medium">Subject: {`${this.state.data["subject"]}`}</h4>
161+
<h4 className="text-2xl font-medium">Class & Section: {`${this.state.data["class"]}/${this.state.data["section"]}`}</h4>
162+
<h4 className="text-2xl font-medium">Date: {`${this.state.data["quiz_date"]}`}</h4>
163+
<h4 className="text-2xl font-medium">Duration {`${this.state.data["start_time"]} - ${this.state.data["end_time"]}`}</h4>
164+
</form>
165+
166+
<div id='question-container' className="w-full flex justify-center items-center min-h-screen flex-col">
167+
168+
</div>
169+
170+
<form className="md:p-8 max-w-[500px] flex rounded-lg w-11/12 mb-4">
171+
<a style={{ borderRadius: "10px", textAlign: "center" }} id="prev-quiz" type="submit"
172+
className="bg-yellow-600 rounde-md w-full p-2 text-white hover:bg-yellow-500"
173+
onClick={() => { this.changeQuiz() }}>
174+
Edit
175+
</a>
176+
177+
<a style={{ borderRadius: "10px", textAlign: "center" }} id="prev-quiz" type="submit"
178+
className="bg-yellow-600 rounde-md w-full p-2 ml-5 text-white hover:bg-yellow-500"
179+
onClick={() => { this.submit() }}>
180+
Submit
181+
</a>
182+
</form>
183+
</div>
184+
185+
</div>
186+
)
187+
}
188+
}

0 commit comments

Comments
 (0)