You can add lecture to your basket now
This commit is contained in:
parent
c80d1b624d
commit
b45457b614
24
src/businesslogic/LecturesProvider.tsx
Normal file
24
src/businesslogic/LecturesProvider.tsx
Normal file
@ -0,0 +1,24 @@
|
|||||||
|
import React, { useState } from "react";
|
||||||
|
import { Lecture } from "../lectures";
|
||||||
|
|
||||||
|
interface ILectureContext {
|
||||||
|
lectures: Array<Lecture>
|
||||||
|
updateLectures: (lectures: Lecture) => void
|
||||||
|
}
|
||||||
|
export const LecturesContext = React.createContext({lectures: Array<Lecture>(), updateLectures: (lectures: Lecture) => {}});
|
||||||
|
|
||||||
|
export const LecturesProvider : React.FC = (props) => {
|
||||||
|
|
||||||
|
const [lectures, setLectures] = useState<Array<Lecture>>([]);
|
||||||
|
|
||||||
|
const updateLectures = (lecture : Lecture) => {setLectures([...lectures, lecture]); console.log(`Lectures xd are: ${JSON.stringify(lectures)}\n`)}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<LecturesContext.Provider value={{lectures: lectures, updateLectures : updateLectures}}>
|
||||||
|
{props.children}
|
||||||
|
</LecturesContext.Provider>
|
||||||
|
);
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
@ -1,9 +1,10 @@
|
|||||||
import React, { useState } from "react";
|
import React, { useState, useContext } from "react";
|
||||||
import "./index.scss";
|
import "./index.scss";
|
||||||
import { Lecture } from "../../lectures";
|
import { Lecture } from "../../lectures";
|
||||||
import LectureCard from "./LectureCard";
|
import LectureCard from "./LectureCard";
|
||||||
import BusinessLogicContext from "../../businesslogic/BusinessLogicContext";
|
import BusinessLogicContext from "../../businesslogic/BusinessLogicContext";
|
||||||
import { BuisnessProvided } from "../../businesslogic/BusinessLogicProvider";
|
import { BuisnessProvided } from "../../businesslogic/BusinessLogicProvider";
|
||||||
|
import { LecturesContext } from "../../businesslogic/LecturesProvider";
|
||||||
|
|
||||||
interface RightBarProps {
|
interface RightBarProps {
|
||||||
onGroupMouseOver: (id: string, name: string) => void;
|
onGroupMouseOver: (id: string, name: string) => void;
|
||||||
@ -14,6 +15,9 @@ interface RightBarProps {
|
|||||||
export default function RightBar({ lectures, onGroupMouseOver, onGroupClick }: RightBarProps) {
|
export default function RightBar({ lectures, onGroupMouseOver, onGroupClick }: RightBarProps) {
|
||||||
const [selectedCardId, setSelectedCardId] = useState<string | null>(null);
|
const [selectedCardId, setSelectedCardId] = useState<string | null>(null);
|
||||||
|
|
||||||
|
const lecturesContext = useContext(LecturesContext);
|
||||||
|
|
||||||
|
|
||||||
const onCardClick = (e: React.MouseEvent) => {
|
const onCardClick = (e: React.MouseEvent) => {
|
||||||
const target = e.currentTarget as HTMLElement;
|
const target = e.currentTarget as HTMLElement;
|
||||||
selectedCardId === target.id ? setSelectedCardId(null) : setSelectedCardId(target.id);
|
selectedCardId === target.id ? setSelectedCardId(null) : setSelectedCardId(target.id);
|
||||||
@ -28,7 +32,7 @@ export default function RightBar({ lectures, onGroupMouseOver, onGroupClick }: R
|
|||||||
Hubert Wrzesiński<br></br>
|
Hubert Wrzesiński<br></br>
|
||||||
Semestr zimowy 2020/2021
|
Semestr zimowy 2020/2021
|
||||||
</div>
|
</div>
|
||||||
{lectures.map((lecture, index) => (
|
{lecturesContext.lectures.map((lecture, index) => (
|
||||||
<LectureCard
|
<LectureCard
|
||||||
lecture={lecture}
|
lecture={lecture}
|
||||||
key={index}
|
key={index}
|
||||||
|
@ -1,8 +1,12 @@
|
|||||||
import React, { useState } from "react";
|
import React, { useState, useContext } from "react";
|
||||||
import axios from "axios";
|
import axios from "axios";
|
||||||
import { Input } from "@material-ui/core";
|
import { Input } from "@material-ui/core";
|
||||||
import "./index.scss";
|
import "./index.scss";
|
||||||
import ClickAwayListener from "@material-ui/core/ClickAwayListener";
|
import ClickAwayListener from "@material-ui/core/ClickAwayListener";
|
||||||
|
import { LecturesContext } from "../../../businesslogic/LecturesProvider";
|
||||||
|
import { Lecture, Group } from "../../../lectures";
|
||||||
|
import { GroupingPanel } from "@devexpress/dx-react-scheduler";
|
||||||
|
import { group } from "console";
|
||||||
|
|
||||||
interface data {
|
interface data {
|
||||||
id: number;
|
id: number;
|
||||||
@ -10,11 +14,18 @@ interface data {
|
|||||||
sym: string;
|
sym: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
export const Results: React.FC = () => {
|
export const Results: React.FC = () => {
|
||||||
const [input, setInput] = useState<string>("");
|
const [input, setInput] = useState<string>("");
|
||||||
const [data, setData] = useState<Array<data>>([]);
|
const [data, setData] = useState<Array<data>>([]);
|
||||||
const [open, setOpen] = React.useState(false);
|
const [open, setOpen] = React.useState(false);
|
||||||
|
|
||||||
|
const lecturesContext = useContext(LecturesContext);
|
||||||
|
|
||||||
|
|
||||||
const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {
|
const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {
|
||||||
setInput(event.target.value);
|
setInput(event.target.value);
|
||||||
//query should be updated on backend to not accept empty string
|
//query should be updated on backend to not accept empty string
|
||||||
@ -39,6 +50,36 @@ export const Results: React.FC = () => {
|
|||||||
setOpen(false);
|
setOpen(false);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const onLectureClick = (e: React.MouseEvent) => {
|
||||||
|
const target = e.currentTarget as HTMLElement;
|
||||||
|
const id = target.id;
|
||||||
|
|
||||||
|
const lecture = {name: "", groups: []} as Lecture;
|
||||||
|
|
||||||
|
console.log(id);
|
||||||
|
axios
|
||||||
|
.get(`http://localhost:1287/getClassesByCourseId?id=${id}`)
|
||||||
|
.then((response) => {
|
||||||
|
for(let data of response.data){
|
||||||
|
console.log("XDD");
|
||||||
|
console.log(data);
|
||||||
|
let group = {} as Group;
|
||||||
|
lecture.name = data.course.name;
|
||||||
|
group.id = data.id;
|
||||||
|
group.day = data.day;
|
||||||
|
group.time = data.time;
|
||||||
|
group.lecturer = `${data.lecturer.title} ${data.lecturer.name} ${data.lecturer.surname}`;
|
||||||
|
group.room = data.room.trim();
|
||||||
|
lecture.groups.push(group);
|
||||||
|
console.log("XDDD");
|
||||||
|
console.log(lecture.groups);
|
||||||
|
lecturesContext.updateLectures(lecture);
|
||||||
|
}
|
||||||
|
|
||||||
|
setOpen(false);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<ClickAwayListener onClickAway={handleClickAway}>
|
<ClickAwayListener onClickAway={handleClickAway}>
|
||||||
<div>
|
<div>
|
||||||
@ -52,8 +93,8 @@ export const Results: React.FC = () => {
|
|||||||
{open ? (
|
{open ? (
|
||||||
<div className="dropdown">
|
<div className="dropdown">
|
||||||
{data.map((lecture, index) => (
|
{data.map((lecture, index) => (
|
||||||
<div className="lecture" key={index}>
|
<div className="lecture" key={index} id={String(lecture.id)} onClick={onLectureClick}>
|
||||||
<p>{lecture.name}</p>
|
<p>{lecture.name} </p>
|
||||||
</div>
|
</div>
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
@ -62,3 +103,4 @@ export const Results: React.FC = () => {
|
|||||||
</ClickAwayListener>
|
</ClickAwayListener>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -2,12 +2,15 @@ import React from "react";
|
|||||||
import ReactDOM from "react-dom";
|
import ReactDOM from "react-dom";
|
||||||
import App from "./App";
|
import App from "./App";
|
||||||
import BuisnessLogicProvider from "./businesslogic/BusinessLogicProvider";
|
import BuisnessLogicProvider from "./businesslogic/BusinessLogicProvider";
|
||||||
|
import { LecturesProvider } from "./businesslogic/LecturesProvider";
|
||||||
|
|
||||||
ReactDOM.render(
|
ReactDOM.render(
|
||||||
<>
|
<>
|
||||||
|
<LecturesProvider>
|
||||||
<BuisnessLogicProvider>
|
<BuisnessLogicProvider>
|
||||||
<App />
|
<App />
|
||||||
</BuisnessLogicProvider>
|
</BuisnessLogicProvider>
|
||||||
|
</LecturesProvider>
|
||||||
</>,
|
</>,
|
||||||
document.getElementById("root")
|
document.getElementById("root")
|
||||||
);
|
);
|
||||||
|
@ -3,7 +3,7 @@ export interface Lecture {
|
|||||||
groups: Array<Group>;
|
groups: Array<Group>;
|
||||||
}
|
}
|
||||||
|
|
||||||
interface Group {
|
export interface Group {
|
||||||
id: string;
|
id: string;
|
||||||
day: string;
|
day: string;
|
||||||
time: string;
|
time: string;
|
||||||
|
Loading…
x
Reference in New Issue
Block a user