diff --git a/src/components/Transfer.tsx b/src/components/Transfer.tsx index 546b39c..36332bb 100644 --- a/src/components/Transfer.tsx +++ b/src/components/Transfer.tsx @@ -84,7 +84,7 @@ const TransferInputStyled = styled.div` `; const SaveWrapper = styled.div` - margin-top:40px; + margin-top: 40px; `; const SaveButton = styled.div` @@ -97,7 +97,7 @@ const SaveButton = styled.div` cursor: pointer; height: 40px; width: 150px; - font-size:12px; + font-size: 12px; letter-spacing: 0.1ch; line-height: normal; &:hover { @@ -114,9 +114,9 @@ const SaveButton = styled.div` `; const ExchangesWrapper = styled.div` - flex:5; + flex: 4; overflow-y: scroll; - width:100%; + width: 100%; ::-webkit-scrollbar-track { border-radius: 10px; } @@ -128,11 +128,12 @@ const ExchangesWrapper = styled.div` border-radius: 10px; background-color: #4b4b4b; } + border-top: 1px solid; `; const ExchangesRow = styled.div` - display:flex; - flex-direction:row; + display: flex; + flex-direction: row; align-items: center; justify-content: center; `; @@ -145,14 +146,12 @@ const Icon = styled.img` const Exchange = styled.div` background-color: #b5d2e0; border-radius: 10px; - width:200px; - margin:10px; - height:50px; - display:flex; - + width: 300px; + margin: 10px; + display: flex; align-items: center; justify-content: center; -` +`; const deleteExchange = async (id: number) => { try { @@ -234,7 +233,7 @@ export const Transfer = ({ handleClose, isTransferOpen }: TransferProps) => { console.log('open changed'); getExchanges(); getAssignmentsGroups(); - }, [isTransferOpen,save]); + }, [isTransferOpen, save]); const createExchange = async (groupsIds: Array) => { console.log('groups ids are: ', groupsIds); @@ -276,9 +275,19 @@ export const Transfer = ({ handleClose, isTransferOpen }: TransferProps) => { > {assignmentsClasses.map((el) => { return ( - + {`${el.name} `} -

{`(${dayMapping[el.day]} ${el.time} ${el.endTime})`} +

+ {`(${dayMapping[el.day]} ${el.time} - ${el.endTime})`}
); })} @@ -287,50 +296,68 @@ export const Transfer = ({ handleClose, isTransferOpen }: TransferProps) => { - {' '} - { - createExchange([selectedAssignmentsClasses.id, selectedGroup.id]); - }} - > - Zaproponuj wymianę - - + {' '} + { + createExchange([selectedAssignmentsClasses.id, selectedGroup.id]); + }} + > + Zaproponuj wymianę + + Przyjmę - + + + - + - {exchanges ? ( - exchanges.map((name: any) => ( - - - {name.desiredGroup.id} {name.ownedAssignment.id} - - - )) - ) : ( -
- )} + {exchanges ? ( + exchanges.map((name: any) => ( + + + {name.desiredGroup.lecturer}

{dayMapping[name.desiredGroup.day]}

{' '} + {name.desiredGroup.time} - {name.desiredGroup.endTime} +
{' '} + + + {name.ownedAssignment.lecturer}

{dayMapping[name.ownedAssignment.day]}

{' '} + {name.ownedAssignment.time} - {name.ownedAssignment.endTime}
+
+ )) + ) : ( +
+ )}