diff --git a/src/components/SchedulerRow.tsx b/src/components/SchedulerRow.tsx index 946b5d0..d0ef2a6 100644 --- a/src/components/SchedulerRow.tsx +++ b/src/components/SchedulerRow.tsx @@ -1,4 +1,4 @@ -import React, { Fragment, MouseEvent, useState } from 'react'; +import React, { Fragment, MouseEvent, useState, useEffect, useRef } from 'react'; import { GroupType, SchedulerEvent } from '../types'; import styled from 'styled-components/macro'; import Popover from '@material-ui/core/Popover'; @@ -66,13 +66,24 @@ const StyledTypography = styled(Typography)` `; const BoldParagraph = styled.p` + flex: 3; +`; + +const ClassWrap = styled.div` font-weight: 700; + height: 100%; + width: 100%; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + line-height: normal; `; const TextWrapper = styled.div` + flex: 1; width: inherit; - margin-top: 30px; - padding: 0 10px 0 10px; + padding: 0 5px 0 5px; display: flex; justify-content: space-between; `; @@ -85,11 +96,28 @@ interface SchedulerRowProps { cellHeight: number; } +const getGroupsPerDay = (groups: Array) => { + + const xd = groups.reduce((sum:any,group:SchedulerEvent)=>{ + if (sum.hasOwnProperty(group.day)) + { + return sum[group.day]+=1 + } + else{ + return sum[group.day]=0} + },[]) + + console.log("123123123",xd); + return xd; +} + export const SchedulerRow = ({ groups, indexRow, rowTop, cellWidth, cellHeight }: SchedulerRowProps) => { const classes = useStyles(); const [anchorEl, setAnchorEl] = React.useState(null); const [popoverId, setPopoverId] = useState(null); + const groupsPerDay = getGroupsPerDay(groups); + //looks weird const handlePopoverOpen = (event: MouseEvent) => { setAnchorEl(event.currentTarget); @@ -101,6 +129,7 @@ export const SchedulerRow = ({ groups, indexRow, rowTop, cellWidth, cellHeight } setPopoverId(null); }; + const open = Boolean(anchorEl); return ( @@ -129,13 +158,15 @@ export const SchedulerRow = ({ groups, indexRow, rowTop, cellWidth, cellHeight } onMouseEnter={(e) => handlePopoverOpen(e)} onMouseLeave={handlePopoverClose} > - {groups[index].name} - -
- {groups[index].time[0]} - {groups[index].time[1]} -
-
3/30
-
+ + {groups[index].name} + +
+ {cellWidth > 200 ? `${groups[index].time[0]} - ${groups[index].time[1]}` : ''} +
+
3/30
+
+
+ + Student + Przedmiot +