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

plan history is working correctly (i think)

Browse Source
This commit is contained in:
wrzesinski-hubert
2021-01-07 19:57:06 +01:00
parent 0b10ed05d6
commit d4f7ad341a
6 changed files with 160 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

65
src/components/SchedulerHistoryNavigation.tsx
View File

@ -1,6 +1,8 @@
import React, { useContext } from 'react';
import styled from 'styled-components';
import { coursesContext } from '../contexts/CoursesProvider';
import RightArrow from '../assets/right-arrow.svg';
import LeftArrow from '../assets/left-arrow.svg';
type ButtonProps = {
direction: 'left' | 'right';
@ -8,44 +10,83 @@ type ButtonProps = {
const Wrapper = styled.div`
display: flex;
justify-content: space-around;
justify-content: center;
align-items: center;
margin-top:-15px;
`;
const StyledButton = styled.button<ButtonProps>`
width: 100px;
height: 100px;
background-color: ${({ direction }) => (direction === 'left' ? 'red' : 'blue')};
const StyledButton = styled.div<ButtonProps>`
cursor:pointer;
user-select: none;
margin:10px;
border-radius:5px;
border-radius: 15px;
background-color: #9ed3ff;
border: 2px solid white;
min-width: 45px;
color: black;
display:flex;
align-items:center;
justify-content:center;
padding: 12px;
:hover{
background-color:#85c8ff;
}
transition: color 0.3s, background-color 0.3s;
`;
const StyledArrow = styled.img`
width:20px;
`;
const StyledDate = styled.div`
user-select: none;
margin:10px;
border-radius:5px;
border-radius: 15px;
background-color: #FFDC61;
border: 2px solid white;
min-width: 45px;
text-align:center;
color: black;
padding: 10px;
`;
type SchedulerHistoryNavigationProps = {
commisionDate?: Date;
changeCurrentTimetable: (value: number) => void;
SubstractCurrentTimetable: (value: number) => void;
AddCurrentTimetable: (value: number) => void;
};
export const SchedulerHistoryNavigation = ({
commisionDate,
changeCurrentTimetable,
SubstractCurrentTimetable,
AddCurrentTimetable,
}: SchedulerHistoryNavigationProps) => {
console.log("231213231231",commisionDate)
return (
<Wrapper>
<StyledButton
direction="left"
onClick={() => {
console.log('left clicked');
changeCurrentTimetable(-1);
SubstractCurrentTimetable(-1);
}}
>
LEFT
<StyledArrow src={LeftArrow}></StyledArrow>
</StyledButton>
{commisionDate}
<StyledDate>{commisionDate}</StyledDate>
<StyledButton
direction="right"
onClick={() => {
console.log('right clicked');
changeCurrentTimetable(1);
AddCurrentTimetable(1);
}}
>
RIGHT
<StyledArrow src={RightArrow}></StyledArrow>
</StyledButton>
</Wrapper>
);