s1

2024-07-26 20:41:32 +05:30
parent 990ec3b04e
commit 69ad64df28
24 changed files with 2355 additions and 549 deletions
--- a/app/components/QuizzesScore.tsx
+++ b/app/components/QuizzesScore.tsx
@@ -0,0 +1,152 @@
+import React from 'react';
+import { Flex, Progress } from 'antd';
+
+let quizData = [
+    {
+      quizId: 1,
+      quizType: "AI Quiz",
+      quizName: "Assessment on Special Education - 1",
+      percentage: "60"
+    },
+    {
+      quizId: 2,
+      quizType: "AI Quiz",
+      quizName: "Assessment on Special Education - 2",
+      percentage: "75"
+    },
+    {
+      quizId: 3,
+      quizType: "AI Quiz",
+      quizName: "Assessment on Special Education - 3",
+      percentage: "80"
+    },
+    {
+      quizId: 4,
+      quizType: "AI Quiz",
+      quizName: "Assessment on Special Education - 4",
+      percentage: "65"
+    },
+    {
+      quizId: 5,
+      quizType: "AI Quiz",
+      quizName: "Assessment on Special Education - 5",
+      percentage: "70"
+    },
+    {
+      quizId: 6,
+      quizType: "AI Quiz",
+      quizName: "Assessment on Special Education - 6",
+      percentage: "85"
+    },
+    {
+      quizId: 7,
+      quizType: "AI Quiz",
+      quizName: "Assessment on Special Education - 7",
+      percentage: "90"
+    },
+    {
+      quizId: 8,
+      quizType: "AI Quiz",
+      quizName: "Assessment on Special Education - 8",
+      percentage: "95"
+    },
+    {
+      quizId: 9,
+      quizType: "AI Quiz",
+      quizName: "Assessment on Special Education - 9",
+      percentage: "88"
+    },
+    {
+      quizId: 10,
+      quizType: "AI Quiz",
+      quizName: "Assessment on Special Education - 10",
+      percentage: "92"
+    },
+    {
+      quizId: 11,
+      quizType: "AI Quiz",
+      quizName: "Assessment on Special Education - 11",
+      percentage: "77"
+    },
+    {
+      quizId: 12,
+      quizType: "AI Quiz",
+      quizName: "Assessment on Special Education - 12",
+      percentage: "82"
+    },
+    {
+      quizId: 13,
+      quizType: "AI Quiz",
+      quizName: "Assessment on Special Education - 13",
+      percentage: "68"
+    },
+    {
+      quizId: 14,
+      quizType: "AI Quiz",
+      quizName: "Assessment on Special Education - 14",
+      percentage: "73"
+    },
+    {
+      quizId: 15,
+      quizType: "AI Quiz",
+      quizName: "Assessment on Special Education - 15",
+      percentage: "79"
+    },
+    {
+      quizId: 16,
+      quizType: "AI Quiz",
+      quizName: "Assessment on Special Education - 16",
+      percentage: "87"
+    },
+    {
+      quizId: 17,
+      quizType: "AI Quiz",
+      quizName: "Assessment on Special Education - 17",
+      percentage: "93"
+    },
+    {
+      quizId: 18,
+      quizType: "AI Quiz",
+      quizName: "Assessment on Special Education - 18",
+      percentage: "67"
+    },
+    {
+      quizId: 19,
+      quizType: "AI Quiz",
+      quizName: "Assessment on Special Education - 19",
+      percentage: "89"
+    },
+    {
+      quizId: 20,
+      quizType: "AI Quiz",
+      quizName: "Assessment on Special Education - 20",
+      percentage: "91"
+    }
+  ]
+
+export default function Index(){
+    return(
+        <section>
+            <div className="border-[1px] border-[#CFCFCF] rounded-t-[10px]" style={{background: 'linear-gradient(138.22deg, #4377C6 0%, #092E76 180.99%)'}}>
+                <h2 className="text-[20px] font-[700] text-[#FFF] p-4">Quizzes score</h2>
+                <div className="flex flex-col">
+                    {quizData.slice(15).map((data => (
+                        <a href='#' className='flex flex-row justify-between place-items-center bg-[#FCFCFC] border-b-[1px] border-b-[#CFCFCF] p-4'>
+                            <div className='flex flex-col'>
+                                <p className='text-[14px] font-[600] text-[#EF7A0C]'>{data.quizType}</p>
+                                <p className='text-[16px] font-[700]'>{data.quizName}</p>
+                            </div>
+                            <div className='flex flex-row'>
+                                <Progress type="dashboard" percent={Number(data.percentage)} gapDegree={0} width={40} strokeColor="#EF7A0C" format={(percent) => (<span style={{ fontWeight: 700 }}>{percent}%</span>)}/>
+                                <img src="../../assets/right-arrow.svg" alt="" />
+                            </div>
+                        </a>
+                    )))}
+                </div>
+            </div>
+        </section>
+    )
+}
+
+
+{/* <Progress type="dashboard" percent={75} gapDegree={30} /> */}