This commit is contained in:
Suvodip
2024-08-13 18:50:45 +05:30
parent 5ae9d77c5a
commit bcae7c673f
26 changed files with 359 additions and 56 deletions

View File

@@ -14,15 +14,38 @@ const App: React.FC = () => {
const [option4, setOption4 ] = useState('');
const [moduleId, setModuleId] = useState('');
const [correctAnswer, setCorrectAnswer] = useState('');
let moduleList = [
{
moduleId : "1",
moduleName : "Module Name - 1"
},
{
moduleId : "2",
moduleName : "Module Name - 2"
},
{
moduleId : "3",
moduleName : "Module Name - 3"
},
{
moduleId : "4",
moduleName : "Module Name - 4"
},
{
moduleId : "5",
moduleName : "Module Name - 5"
}
]
const [moduleList, setModuleList] = useState<QuizModule[]>([]);
// const [moduleList, setModuleList] = useState<QuizModule[]>([]);
const [loading, setLoading] = useState(true);
const [error, setError] = useState<Error | null>(null);
const [open, setOpen] = useState<boolean>(false);
const [submitLoading, setSubmitLoading] = useState<boolean>(false);
useEffect(() => {
fetch(`https://api.teachertrainingkolkata.in/api/quiz-module-list`)
fetch(`http://localhost:5174/api/quiz-module-list`)
.then((res) => {
if (!res.ok) {
throw new Error('Network response was not ok');
@@ -31,7 +54,7 @@ const App: React.FC = () => {
})
.then((data) => {
console.log(data);
setModuleList(data);
// setModuleList(data);
setLoading(false);
})
.catch((error) => {
@@ -46,7 +69,7 @@ const App: React.FC = () => {
const data = { question, option1, option2, option3, option4, correctAnswer, moduleId };
setSubmitLoading(true);
try {
const response = await fetch(`https://api.teachertrainingkolkata.in/api/create-question`, {
const response = await fetch(`http://localhost:5174/api/create-question`, {
method: 'POST',
headers: {
'Content-Type': 'application/json',

View File

@@ -14,7 +14,7 @@ export default function classMatesDirectory() {
useEffect(() => {
fetch('https://api.teachertrainingkolkata.in/api/class-mates')
fetch('http://localhost:5174/api/class-mates')
.then(res => {
if (!res.ok) {
throw new Error('Network response was not ok');

View File

@@ -0,0 +1,155 @@
import React from "react";
import { SettingOutlined, QuestionCircleOutlined, LogoutOutlined, RightOutlined } from '@ant-design/icons';
import { Layout, Menu, theme, Button, Modal, MenuProps } from 'antd';
import { Dropdown, Space } from 'antd';
import dayjs from 'dayjs';
import 'dayjs/locale/zh-cn';
import { Calendar, Col, Row, Typography } from 'antd';
import type { CalendarProps } from 'antd';
import type { Dayjs } from 'dayjs';
import dayLocaleData from 'dayjs/plugin/localeData';
import { Content } from "antd/es/layout/layout";
import '../../public/assets/left_side_nav.css';
dayjs.extend(dayLocaleData);
const schedule = [
{ time: '9 AM', title: 'Lorem Ipsum', details: '9 - 10 AM', borderColor: 'indigo-600', bgColor: 'bg-blue-200' },
{ time: '10 AM', title: 'Lorem Ipsum', details: '10 - 11 AM', borderColor: 'orange-600', bgColor: 'bg-blue-200' },
{ time: '11 AM', title: '', details: '', borderColor: '', bgColor: '' },
{ time: '12 PM', title: 'Lorem Ipsum dolor sit', details: '11:30 AM - 12:30 PM', borderColor: 'indigo-600', bgColor: '' },
{ time: '1 PM', title: 'Lorem Ipsum', details: '11:30 AM - 12:30 PM', borderColor: 'green-600', bgColor: '' },
{ time: '2 PM', title: 'Lorem Ipsum dolor sit', details: '11:30 AM - 12:30 PM', borderColor: 'red-700', bgColor: '' },
{ time: '3 PM', title: 'Lorem Ipsum dolor sit', details: '11 AM - 12:30 PM', borderColor: 'blue-700', bgColor: '' },
{ time: '4 PM', title: 'Lorem Ipsum', details: '11:30 AM - 12:30 PM', borderColor: 'sky-700', bgColor: 'bg-blue-200' },
{ time: '5 PM', title: '', details: '', borderColor: '', bgColor: '' }
];
const App: React.FC = () => {
const { token } = theme.useToken();
const onPanelChange = (value: Dayjs, mode: CalendarProps<Dayjs>['mode']) => {
console.log(value.format('YYYY-MM-DD'), mode);
};
const wrapperStyle: React.CSSProperties = {
width: 320,
border: `1px solid ${token.colorBorderSecondary}`,
borderRadius: token.borderRadiusLG,
padding: 16,
};
const headerStyle: React.CSSProperties = {
display: 'flex',
justifyContent: 'space-around',
alignItems: 'center',
// marginBottom: 16,
backgroundColor: '#0752bc',
height: 47,
borderTopLeftRadius: 10,
borderTopRightRadius: 10,
};
const titleStyle: React.CSSProperties = {
fontSize: 14,
fontWeight: 'bold',
color: '#fff',
};
const navButtonStyle: React.CSSProperties = {
cursor: 'pointer',
fontSize: 16,
};
return (
<>
<div className="container mx-auto">
<div className="grid gap-4 sm:grid-cols-1 md:grid-cols-[350px_1fr]">
<div className=" p-4">
<div className="grid grid-rows-2">
<div className="mb-4 bg-card bg-gray-200 rounded-lg shadow-md border border-zinc-300 dark:bg-card-foreground">
<Calendar
fullscreen={false}
headerRender={({ value, onChange }) => {
const monthFormat = 'MMMM';
const year = value.year();
const month = value.format(monthFormat);
const prevMonth = () => {
const newValue = value.clone().subtract(1, 'month');
onChange(newValue);
};
const nextMonth = () => {
const newValue = value.clone().add(1, 'month');
onChange(newValue);
};
return (
<div style={headerStyle}>
<div className="">
<div style={titleStyle}>{`${month} ${year}`}</div>
</div>
<div className="flex gap-8">
<div style={navButtonStyle} onClick={prevMonth}>{'<'}</div>
<div style={navButtonStyle} onClick={nextMonth}>{'>'}</div>
</div>
</div>
);
}}
onPanelChange={onPanelChange}
/>
</div>
<div className="">
<div className="bg-card h-80 bg-gray-200 rounded-lg shadow-md border border-zinc-300 dark:bg-card-foreground">
<div className="flex justify-around items-center h-12 border-b-2 border-zinc-300 bg-[#0752bc] rounded-t-lg">
{/* <h2 className="text-lg items-center font-semibold text-foreground dark:text-card-foreground">Upcoming Classes</h2> */}
<h2 style={titleStyle}>Upcoming Classes <span>&gt;</span></h2>
</div>
<div className=" ">
<div className="border-b-2 border-zinc-300 pb-12"></div>
<div className="border-b-2 border-zinc-300 pb-12"></div>
<div className="border-b-2 border-zinc-300 pb-12"></div>
<div className="border-b-2 border-zinc-300 pb-12"></div>
</div>
</div>
</div>
</div>
</div>
<div className="p-4 border-l-[1px] py-2 border-[#CFCFCF]">
<div className="xl:col-span-4">
<div className="p-4 bg-background">
<h2 className="text-lg font-semibold mb-4 border-b-[1px] py-2 border-[#CFCFCF]">Today's Schedule</h2>
<div className="space-y-2">
{schedule.map((item, index) => (
<div className="flex" key={index}>
<span className="w-16 text-zinc-700">{item.time}</span>
{item.title ? (
<div className={`flex-1 ${item.bgColor} p-2 border-l-4 border-${item.borderColor} rounded-r-lg`}>
<span>{item.title}</span><br />
<span className="text-sm text-zinc-500">{item.details}</span>
</div>
) : (
<div className="flex-1"></div>
)}
</div>
))}
</div>
</div>
</div>
</div>
</div>
</div>
</>
)
}
export default App;

View File

@@ -14,7 +14,7 @@ export default function ContinueLearning() {
useEffect(() => {
fetch('https://api.teachertrainingkolkata.in/api/continue-learning')
fetch('http://localhost:5174/api/continue-learning')
.then(res => {
if (!res.ok) {
throw new Error('Network response was not ok');

View File

@@ -6,31 +6,45 @@ import { InboxOutlined } from '@ant-design/icons';
import type { UploadProps } from 'antd';
import { message, Upload } from 'antd';
const { Dragger } = Upload;
const props: UploadProps = {
name: 'file',
multiple: true,
action: 'https://660d2bd96ddfa2943b33731c.mockapi.io/api/upload',
onChange(info) {
const { status } = info.file;
if (status !== 'uploading') {
console.log(info.file, info.fileList);
}
if (status === 'done') {
message.success(`${info.file.name} file uploaded successfully.`);
} else if (status === 'error') {
message.error(`${info.file.name} file upload failed.`);
}
},
onDrop(e) {
console.log('Dropped files', e.dataTransfer.files);
},
};
const App: React.FC = () => {
const [fileCount, setFileCount] = useState(0);
const [uploadingNumber, setUploadingNumber] = useState(0);
const props: UploadProps = {
name: 'file',
multiple: true,
action: 'https://660d2bd96ddfa2943b33731c.mockapi.io/api/upload',
onChange(info) {
const { status } = info.file;
setFileCount(info.fileList.length); // Update file count whenever files are added or removed
if (status !== 'uploading') {
// console.log(info.file, info.fileList);
}
if (status === 'done') {
message.success(`${info.file.name} file uploaded successfully.`);
} else if (status === 'error') {
message.error(`${info.file.name} file upload failed.`);
setUploadingNumber(currentFile => currentFile + 1);
}
},
onDrop(e) {
// console.log('Dropped files', e.dataTransfer.files);
setFileCount(e.dataTransfer.files.length); // Update file count on drop
// setUploadingNumber(currentFile => currentFile + 1);
},
};
const [isModalOpen, setIsModalOpen] = useState(false);
const showModal = () => {
setIsModalOpen(true);
};
@@ -70,13 +84,15 @@ const App: React.FC = () => {
</div>
</Dragger>
</div>
{/* <p>{uploadingNumber} / {fileCount}</p> */}
<div className='flex flex-col space-y-3'>
<label className='text-[16px ] font-[600]' htmlFor="title">Title *</label>
<input className='border-[1px] border-[#CFCFCF] rounded-[8px] p-2.5 focus:outline-none' placeholder='Enter Title here' type="text" name="title" id="title" />
</div>
<div className='flex flex-col space-y-3'>
<label className='text-[16px ] font-[600]' htmlFor="subject">Subject *</label>
<select className='border-[1px] border-[#CFCFCF] bg-[#fff] rounded-[8px] p-2.5 focus:outline-none' name="subject" id="subject">
<select className='border-[1px] border-[#CFCFCF] text-[#9D9D9D] bg-[#fff] rounded-[8px] p-2.5 focus:outline-none' name="subject" id="subject">
<option value="0">Select the Subject here</option>
<option value="Subject-1">Subject-1</option>
<option value="Subject-2">Subject-2</option>
<option value="Subject-3">Subject-3</option>
@@ -85,7 +101,8 @@ const App: React.FC = () => {
</div>
<div className='flex flex-col space-y-3'>
<label className='text-[16px ] font-[600]' htmlFor="practical-exercise">Practical Exercise *</label>
<select className='border-[1px] border-[#CFCFCF] bg-[#fff] rounded-[8px] p-2.5 focus:outline-none' name="practical-exercise" id="practical-exercise">
<select className='border-[1px] border-[#CFCFCF] text-[#9D9D9D] bg-[#fff] rounded-[8px] p-2.5 focus:outline-none' name="practical-exercise" id="practical-exercise">
<option value="0">Choose the practical exercise here</option>
<option value="Practical Exercise-1">Practical Exercise-1</option>
<option value="Practical Exercise-2">Practical Exercise-2</option>
<option value="Practical Exercise-3">Practical Exercise-3</option>

View File

@@ -14,7 +14,7 @@ export default function KnowledgeQuests() {
useEffect(() => {
fetch('https://api.teachertrainingkolkata.in/api/knowledge-quests')
fetch('http://localhost:5174/api/knowledge-quests')
.then(res => {
if (!res.ok) {
throw new Error('Network response was not ok');

View File

@@ -20,8 +20,8 @@ export default function Index() {
const fetchData = async () => {
try {
const [allResponse, completedResponse] = await Promise.all([
fetch('https://api.teachertrainingkolkata.in/api/all-assesment'),
fetch('https://api.teachertrainingkolkata.in/api/complete-assesment')
fetch('http://localhost:5174/api/all-assesment'),
fetch('http://localhost:5174/api/complete-assesment')
]);
if (!allResponse.ok || !completedResponse.ok) {

View File

@@ -20,11 +20,11 @@ const items2: MenuProps['items'] = [
children: [
{
key: 'administration1',
label: (<a href='#'>Class Schedules</a>),
label: (<a href='/class-shedules'>Class Schedules</a>),
},
{
key: 'administration2',
label: (<a href='#'>Classmate Directory</a>),
label: (<a href='/classmate-directory'>Classmate Directory</a>),
},
{
key: 'administration3',

View File

@@ -12,7 +12,7 @@ export default function AdminIndex() {
const [error, setError] = useState<Error | null>(null);
useEffect(() => {
fetch(`https://api.teachertrainingkolkata.in/api/quiz-module-list`)
fetch(`http://localhost:5174/api/quiz-module-list`)
.then(res => {
if (!res.ok) {
throw new Error('Network response was not ok');

View File

@@ -15,7 +15,7 @@ const App: React.FC = () => {
};
setLoading(true);
try {
const response = await fetch(`https://api.teachertrainingkolkata.in/api/create-module`, {
const response = await fetch(`http://localhost:5174/api/create-module`, {
method: 'POST',
headers: {
'Content-Type': 'application/json',

View File

@@ -19,7 +19,7 @@ const App: React.FC = () => {
const [submitLoading, setSubmitLoading] = useState<boolean>(false);
useEffect(() => {
fetch(`https://api.teachertrainingkolkata.in/api/quiz-module-list`)
fetch(`http://localhost:5174/api/quiz-module-list`)
.then((res) => {
if (!res.ok) {
throw new Error('Network response was not ok');
@@ -50,7 +50,7 @@ const App: React.FC = () => {
};
setSubmitLoading(true);
try {
const response = await fetch(`https://api.teachertrainingkolkata.in/api/create-quiz`, {
const response = await fetch(`http://localhost:5174/api/create-quiz`, {
method: 'POST',
headers: {
'Content-Type': 'application/json',

View File

@@ -33,7 +33,7 @@ export default function Index() {
const [error, setError] = useState<Error | null>(null);
useEffect(() => {
fetch('https://api.teachertrainingkolkata.in/api/quiz-module')
fetch('http://localhost:5174/api/quiz-module')
.then((res) => {
if (!res.ok) {
throw new Error('Network response was not ok');

View File

@@ -46,7 +46,7 @@ export default function Index() {
const [moduleList, setModuleList] = useState<ModuleList[]>([]);
useEffect(() => {
fetch(`https://api.teachertrainingkolkata.in/api/question-list`)
fetch(`http://localhost:5174/api/question-list`)
.then((res) => {
if (!res.ok) {
throw new Error('Network Response not ok');
@@ -68,7 +68,7 @@ useEffect(() => {
try {
const moduleData = await Promise.all(
questionList.map((question) =>
fetch(`https://api.teachertrainingkolkata.in/api/quiz-module-list`)
fetch(`http://localhost:5174/api/quiz-module-list`)
.then((res) => {
if (!res.ok) {
throw new Error('Network Response not ok');
@@ -94,7 +94,7 @@ useEffect(() => {
useEffect(() => {
fetch('https://api.teachertrainingkolkata.in/api/quiz-module')
fetch('http://localhost:5174/api/quiz-module')
.then((res) => {
if (!res.ok) {
throw new Error('Network response was not ok');

View File

@@ -17,7 +17,7 @@ export default function AdminIndex() {
const [error, setError] = useState<Error | null>(null);
useEffect(() => {
fetch(`https://api.teachertrainingkolkata.in/api/question-list`)
fetch(`http://localhost:5174/api/question-list`)
.then(res => {
if (!res.ok) {
throw new Error('Network response was not ok');

View File

@@ -15,7 +15,7 @@ export default function AdminIndex() {
const [error, setError] = useState<Error | null>(null);
useEffect(() => {
fetch(`https://api.teachertrainingkolkata.in/api/quiz-list`)
fetch(`http://localhost:5174/api/quiz-list`)
.then(res => {
if (!res.ok) {
throw new Error('Network response was not ok');

View File

@@ -14,7 +14,7 @@ export default function quizScoreData() {
useEffect(() => {
fetch('https://api.teachertrainingkolkata.in/api/quiz-score')
fetch('http://localhost:5174/api/quiz-score')
.then(res => {
if (!res.ok) {
throw new Error('Network response was not ok');

View File

@@ -17,7 +17,7 @@ export default function TopPerformers() {
const [error, setError] = useState<Error | null>(null);
useEffect(() => {
fetch('https://api.teachertrainingkolkata.in/api/top-performers')
fetch('http://localhost:5174/api/top-performers')
.then(res => {
if (!res.ok) {
throw new Error('Network response was not ok');