y0rune
/
frontend
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

lots of changes

This commit is contained in:
wrzesinski-hubert 2020-12-10 21:26:09 +01:00
parent a3438586bd
commit b6121a5eee
9 changed files with 38 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
public/index.html
View File

@ -1,13 +1,12 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="pl">
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" /> <link rel="icon" href="https://plannaplan.pl/img/logo.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" /> <meta name="theme-color" content="#000000" />
<meta <meta
name="description" name="description"
content="Web site created using create-react-app" content="Aplikacja do zapisów na zajęcia"
/> />
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" /> <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
<!-- <!--
@ -23,7 +22,7 @@
work correctly both with client-side routing and a non-root public URL. work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`. Learn how to configure a non-root public URL by running `npm run build`.
--> -->
<title>React App</title> <title>PlanNaPlan</title>
</head> </head>
<body> <body>
<noscript>You need to enable JavaScript to run this app.</noscript> <noscript>You need to enable JavaScript to run this app.</noscript>

1
src/components/Admin.tsx
View File

@ -12,6 +12,7 @@ const LeftSide = styled.div`
flex: 1; flex: 1;
flex-direction: column; flex-direction: column;
background-color: white; background-color: white;
text-align:center;
`; `;
const Wrap = styled.div` const Wrap = styled.div`

6
src/components/App.tsx
View File

@ -27,9 +27,9 @@ export const App = () => {
<Topbar handleTransfer={handleTransfer} /> <Topbar handleTransfer={handleTransfer} />
<Transfer isOpen={isOpenTransfer} handleClose={handleTransfer} /> <Transfer isOpen={isOpenTransfer} handleClose={handleTransfer} />
<Wrapper> <Wrapper>
{/* <Admin/> */}
<Scheduler /> {sessionStorage.getItem('userPrivilage')=== "STUDENT" ? <><Scheduler />
<Rightbar /> <Rightbar /></>: <Admin/>}
</Wrapper> </Wrapper>
</> </>
); );

11
src/components/CourseCard.tsx
View File

@ -7,6 +7,7 @@ import styled, { css } from 'styled-components';
import { makeStyles } from '@material-ui/core/styles'; import { makeStyles } from '@material-ui/core/styles';
import DeleteIcon from '@material-ui/icons/Delete'; import DeleteIcon from '@material-ui/icons/Delete';
import { useMemo } from 'react'; import { useMemo } from 'react';
import { createClassTime } from '../utils';
const CourseCardWrapper = styled.div` const CourseCardWrapper = styled.div`
position: relative; position: relative;
@ -20,7 +21,7 @@ const CourseCardWrapper = styled.div`
border-radius: 10px; border-radius: 10px;
cursor: pointer; cursor: pointer;
align-items: stretch; align-items: stretch;
box-shadow: 9px 9px 8px -2px rgba(0, 0, 0, 0.59); box-shadow: 3px 3px 3px 0px rgba(0, 0, 0, 0.75);
`; `;
const TitleWrapper = styled.div` const TitleWrapper = styled.div`
@ -52,6 +53,7 @@ const ClassGroupStyled = styled.div`
position: relative; position: relative;
padding-top: 1px; padding-top: 1px;
padding-bottom: 5px; padding-bottom: 5px;
transition: background-color 0.4s ease;
:hover { :hover {
cursor: pointer; cursor: pointer;
background-color: #9ed3ff; background-color: #9ed3ff;
@ -102,7 +104,7 @@ type FlexItemProps = {
const FlexItem = styled.div<FlexItemProps>` const FlexItem = styled.div<FlexItemProps>`
display: flex; display: flex;
font-size: 14px; font-size: 14px;
font-weight: 600; font-weight: 500;
${({ justifyContent }) => ${({ justifyContent }) =>
justifyContent && justifyContent &&
css` css`
@ -141,7 +143,7 @@ export const CourseCard = ({ course }: CourseCardProps) => {
selectBasketCourseGroups, selectBasketCourseGroups,
changeHoveredGroup, changeHoveredGroup,
} = useContext(coursesContext)!; } = useContext(coursesContext)!;
const [isSelected, setSelected] = useState(false); const [isSelected, setSelected] = useState(true);
const groups = [...course.lectures!, ...course.classes!]; const groups = [...course.lectures!, ...course.classes!];
const basketCourseGroups = useMemo(() => selectBasketCourseGroups(course.id), []); const basketCourseGroups = useMemo(() => selectBasketCourseGroups(course.id), []);
const [previous, setPrevious] = useState(basketCourseGroups); const [previous, setPrevious] = useState(basketCourseGroups);
@ -203,8 +205,9 @@ export const CourseCard = ({ course }: CourseCardProps) => {
{group.lecturer.replace('UAM', '')} {group.lecturer.replace('UAM', '')}
</FlexItem> </FlexItem>
)} )}
{console.log("abisfdibuafsbuiafsbuifasbuibuiafsbuifasbuifsabuiasf",group)}
<FlexItem style={{ justifyContent: 'center', margin: '0 50px' }}> <FlexItem style={{ justifyContent: 'center', margin: '0 50px' }}>
<span>{/*group.time*/}</span> <span> Sala: {group.room}</span> <span> {createClassTime(group.time)[0] + " - " + createClassTime(group.time)[1]} {/* Sala: {group.room} */}</span>
</FlexItem> </FlexItem>
</FlexboxWrapper> </FlexboxWrapper>
</ClassGroupStyled> </ClassGroupStyled>

10
src/components/Dropdown.tsx
View File

@ -50,12 +50,13 @@ interface DropdownProps {
} }
export const Dropdown = ({ open, input, handleCloseDropdown, selectedOption }: DropdownProps) => { export const Dropdown = ({ open, input, handleCloseDropdown, selectedOption }: DropdownProps) => {
const { courses, selectBasketNames, addCourseToBasket,getUserTimetable } = useContext(coursesContext)!; const { courses, selectBasketNames, addCourseToBasket, getUserID } = useContext(coursesContext)!;
const { users } = useContext(usersContext)!; const { users } = useContext(usersContext)!;
const basketNames = useMemo(() => selectBasketNames(), [selectBasketNames]); const basketNames = useMemo(() => selectBasketNames(), [selectBasketNames]);
const [filteredCourses, setFilteredCourses] = useState<Array<Course>>([]); const [filteredCourses, setFilteredCourses] = useState<Array<Course>>([]);
const [filteredUsers, setFilteredUsers] = useState<Array<User>>([]); const [filteredUsers, setFilteredUsers] = useState<Array<User>>([]);
const onCourseClick = (event: MouseEvent) => { const onCourseClick = (event: MouseEvent) => {
const target = event.currentTarget; const target = event.currentTarget;
if (target.id && target.textContent) { if (target.id && target.textContent) {
@ -67,11 +68,8 @@ export const Dropdown = ({ open, input, handleCloseDropdown, selectedOption }: D
const onUserClick = (event: MouseEvent) => { const onUserClick = (event: MouseEvent) => {
const target = event.currentTarget; const target = event.currentTarget;
if (target.id && target.textContent) { getUserID(target.id);
console.log(target.id,target.textContent); handleCloseDropdown();
getUserTimetable(target.id);
handleCloseDropdown();
}
}; };
useEffect(() => { useEffect(() => {

6
src/components/Rightbar.tsx
View File

@ -44,14 +44,14 @@ const SaveButton = styled.div`
background-color: #54c457; background-color: #54c457;
} }
box-shadow: 0px 3px 3px 0px rgba(0, 0, 0, 0.24); box-shadow: 3px 3px 3px 0px rgba(0, 0, 0, 0.75);
`; `;
export const Rightbar = () => { export const Rightbar = () => {
const { selectBasketCourses, saveBasket } = useContext(coursesContext)!; const { selectBasketCourses, saveBasket, userekID } = useContext(coursesContext)!;
const basketCourses = selectBasketCourses(); const basketCourses = selectBasketCourses();
const handleSave = debounce(() => saveBasket(), 500); const handleSave = debounce(() => saveBasket(userekID), 500);
return ( return (
<RightbarWrapper> <RightbarWrapper>
<SaveButton onClick={handleSave}>ZAPISZ</SaveButton> <SaveButton onClick={handleSave}>ZAPISZ</SaveButton>

2
src/components/Topbar.tsx
View File

@ -162,7 +162,7 @@ export default function ({ handleTransfer }: TopbarProps) {
<FlexboxColumn> <FlexboxColumn>
<ClickAwayListener onClickAway={handleCloseDropdown}> <ClickAwayListener onClickAway={handleCloseDropdown}>
<Flexbox> <Flexbox>
{/* <SelectMenu changeSelectedOption={changeSelectedOption} selectedOption={selectedOption} changeDropdownOpen={setOpen}/> */} {sessionStorage.getItem('userPrivilage')=== "STUDENT" ? (<div></div>): <SelectMenu changeSelectedOption={changeSelectedOption} selectedOption={selectedOption} changeDropdownOpen={setOpen}/>}
<InputWrapper> <InputWrapper>
<Input <Input
placeholder={`Wyszukaj ${selectedOption === "studenci" ? "studentów..." : "przedmioty..."}`} placeholder={`Wyszukaj ${selectedOption === "studenci" ? "studentów..." : "przedmioty..."}`}

1
src/contexts/CASProvider.tsx
View File

@ -28,6 +28,7 @@ export const CASProvider = ({ children }: CASProviderProps) => {
if (!sessionStorage.getItem('userToken')) { if (!sessionStorage.getItem('userToken')) {
const { data: token } = await axiosInstance.get(`${process.env.REACT_APP_API_URL}/token?ticket=${ticket}`); const { data: token } = await axiosInstance.get(`${process.env.REACT_APP_API_URL}/token?ticket=${ticket}`);
sessionStorage.setItem('userToken', token.token); sessionStorage.setItem('userToken', token.token);
sessionStorage.setItem('userPrivilage', token.authorityRole)
} }
const tokenik:any = JSON.parse(sessionStorage.getItem('userToken')as string); const tokenik:any = JSON.parse(sessionStorage.getItem('userToken')as string);
const token: Token = { const token: Token = {

18
src/contexts/CoursesProvider.tsx
View File

@ -18,12 +18,14 @@ interface CourseContext {
courses: Array<Course>; courses: Array<Course>;
basket: Array<Basket>; basket: Array<Basket>;
hoveredGroup: Group | undefined | null; hoveredGroup: Group | undefined | null;
userekID:string;
addCourseToBasket: (courses: Course) => void; addCourseToBasket: (courses: Course) => void;
changeHoveredGroup: (group: Group | null) => void; changeHoveredGroup: (group: Group | null) => void;
changeGroupInBasket: (group: Group, courseId: number) => void; changeGroupInBasket: (group: Group, courseId: number) => void;
restoreGroupInBasket: (restoreGroup: Group, courseId: number) => void; restoreGroupInBasket: (restoreGroup: Group, courseId: number) => void;
deleteFromBasket: (id: number) => void; deleteFromBasket: (id: number) => void;
saveBasket: () => void; saveBasket: (userID: string) => Promise<void>
getUserID: (userID: string) => Promise<void>
selectSchedulerEvents: () => Array<SchedulerEvent>; selectSchedulerEvents: () => Array<SchedulerEvent>;
selectBasketNames: () => Array<string>; selectBasketNames: () => Array<string>;
selectBasketCourses: () => Array<Course>; selectBasketCourses: () => Array<Course>;
@ -43,6 +45,7 @@ export const CoursesProvider = ({ children }: CoursesProviderProps) => {
//fetch courses with groups //fetch courses with groups
const [courses, setCourses] = useState<Array<Course>>([]); const [courses, setCourses] = useState<Array<Course>>([]);
const [basket, setBasket] = useState<Array<Basket>>([]); const [basket, setBasket] = useState<Array<Basket>>([]);
const [userekID, setUserID] = useState("");
const [hoveredGroup, setHoveredGroup] = useState<Group | undefined | null>(null); const [hoveredGroup, setHoveredGroup] = useState<Group | undefined | null>(null);
const selectBasketIds = () => { const selectBasketIds = () => {
const classesIds = basket.map((course) => course?.classes?.id).filter((course) => course !== undefined); const classesIds = basket.map((course) => course?.classes?.id).filter((course) => course !== undefined);
@ -98,7 +101,12 @@ export const CoursesProvider = ({ children }: CoursesProviderProps) => {
const deleteFromBasket = (id: number) => setBasket(basket.filter((course) => course.id !== id)); const deleteFromBasket = (id: number) => setBasket(basket.filter((course) => course.id !== id));
const saveBasket = async () => { const getUserID = async (userID:string) => {
setUserID(userID);
console.log("bjhkfbkjakbhjlfasbjkhlfabjklasfbjkbjkasfbjkasfl",userekID)
}
const saveBasket = async (userID:string) => {
const basketIds = selectBasketIds(); const basketIds = selectBasketIds();
const action = (key: any) => ( const action = (key: any) => (
<> <>
@ -111,7 +119,7 @@ export const CoursesProvider = ({ children }: CoursesProviderProps) => {
); );
try { try {
await axiosInstance.post(`${process.env.REACT_APP_API_URL}/api/v1/commisions/user`, JSON.stringify(basketIds)); await axiosInstance.post(`${process.env.REACT_APP_API_URL}/api/v1/commisions/user/${userID}`, JSON.stringify(basketIds));
enqueueSnackbar('Plan został zapisany', { enqueueSnackbar('Plan został zapisany', {
variant: 'success', variant: 'success',
action, action,
@ -193,12 +201,13 @@ export const CoursesProvider = ({ children }: CoursesProviderProps) => {
setTimeout(() => { setTimeout(() => {
fetchCourses(); fetchCourses();
getNewestTimetable(); getNewestTimetable();
}, 200); }, 10);
}, []); }, []);
return ( return (
<coursesContext.Provider <coursesContext.Provider
value={{ value={{
userekID,
courses, courses,
basket, basket,
hoveredGroup, hoveredGroup,
@ -213,6 +222,7 @@ export const CoursesProvider = ({ children }: CoursesProviderProps) => {
selectBasketCourses, selectBasketCourses,
selectBasketCourseGroups, selectBasketCourseGroups,
getUserTimetable, getUserTimetable,
getUserID,
}} }}
> >
{children} {children}