Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 1384 | Rev 3694 | Ir a la última revisión | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 1384 Rev 3668
Línea 1... Línea 1...
1 
import React from 'react'
 1 
import React from 'react';
2 
import { Link } from 'react-router-dom'
 2 
import { Link } from 'react-router-dom';
3 
import { Avatar, IconButton } from '@mui/material'
 3 
import { Avatar, IconButton, styled } from '@mui/material';
4 
import { Clear, Delete, Done } from '@mui/icons-material'
 4 
import { Clear, Delete, Done } from '@mui/icons-material';
5 
import styled from 'styled-components'
 - 
 
6 
 
 5 
 
7 
import Modal from 'components/UI/modal/Modal'
 6 
import Modal from 'components/UI/modal/Modal';
- 
 
 7 
import colors from '@styles/config/colors';
8 
 
 8 
 
9 
const StyledMemberContainer = styled.div`
 9 
const StyledMemberContainer = styled('div')(() => ({
10 
  display: flex;
 10 
  display: 'flex',
11 
  align-items: center;
 11 
  alignItems: 'center',
12 
  justify-content: space-between;
 12 
  justifyContent: 'space-between',
13 
  gap: 0.5rem;
 13 
  gap: '0.5rem',
14 
  padding: 10px 0;
 14 
  padding: '10px 0',
15 
  border-top: 1px solid ${(props) => props.theme.border.color.primary};
 15 
  borderTop: `1px solid ${colors.border.primary}`,
- 
 
 16 
  borderBottom: `1px solid ${colors.border.primary}`
16 
`
 17 
}));
17 
 
 18 
 
18 
const StyledMemberInfo = styled.div`
 19 
const StyledMemberInfo = styled('div')(() => ({
19 
  display: flex;
 20 
  display: 'flex',
20 
  align-items: center;
 21 
  alignItems: 'center',
21 
  gap: 0.5rem;
 22 
  gap: '0.5rem'
22 
`
 23 
}));
23 
 
 24 
 
24 
const StyledMemberImage = styled(Avatar)`
 25 
const StyledMemberImage = styled(Avatar)(() => ({
25 
  width: 40px !important;
 26 
  width: 40,
26 
  height: 40px !important;
 27 
  height: 40
27 
`
 28 
}));
Línea 28... Línea 29...
28 
 
 29 
 
29 
const MembersModal = ({
 30 
const MembersModal = ({
30 
  isShow = false,
 31 
  isShow = false,
31 
  members = [],
 32 
  members = [],
Línea 42... Línea 43...
42 
    >
 43 
    >
43 
      {members.map((member) => (
 44 
      {members.map((member) => (
44 
        <Member key={member.id} member={member} handleAction={handleAction} />
 45 
        <Member key={member.id} member={member} handleAction={handleAction} />
45 
      ))}
 46 
      ))}
46 
    </Modal>
 47 
    </Modal>
47 
  )
 48 
  );
48 
}
 49 
};
Línea 49... Línea 50...
49 
 
 50 
 
50 
const Member = ({ member = {}, handleAction = function () {} }) => {
 51 
const Member = ({ member = {}, handleAction = function () {} }) => {
Línea 51... Línea 52...
51 
  const { name = '', image = '', profile = '', actions = {} } = member
 52 
  const { name = '', image = '', profile = '', actions = {} } = member;
52 
 
 53 
 
53 
  return (
 54 
  return (
54 
    <StyledMemberContainer>
 55 
    <StyledMemberContainer>
Línea 59... Línea 60...
59 
 
 60 
 
60 
        <h4>{name}</h4>
 61 
        <h4>{name}</h4>
Línea 61... Línea 62...
61 
      </StyledMemberInfo>
 62 
      </StyledMemberInfo>
62 
 
 - 
 
63 
      {actions?.link_approve && (
 63 
 
64 
        <IconButton
 - 
 
65 
          onClick={() => handleAction(actions.link_approve)}
 - 
 
66 
          title='Aprobar'
 64 
      {actions?.link_approve && (
67 
        >
 65 
        <IconButton onClick={() => handleAction(actions.link_approve)} title='Aprobar'>
68 
          <Done />
 66 
          <Done />
69 
        </IconButton>
 67 
        </IconButton>
70 
      )}
 - 
 
71 
      {actions?.link_reject && (
 68 
      )}
72 
        <IconButton
 - 
 
73 
          onClick={() => handleAction(actions.link_reject)}
 - 
 
74 
          title='Rechazar'
 69 
      {actions?.link_reject && (
75 
        >
 70 
        <IconButton onClick={() => handleAction(actions.link_reject)} title='Rechazar'>
76 
          <Clear />
 71 
          <Clear />
77 
        </IconButton>
 72 
        </IconButton>
78 
      )}
 - 
 
79 
      {actions?.link_cancel && (
 73 
      )}
80 
        <IconButton
 - 
 
81 
          onClick={() => handleAction(actions.link_cancel)}
 - 
 
82 
          title='Cancelar'
 74 
      {actions?.link_cancel && (
83 
        >
 75 
        <IconButton onClick={() => handleAction(actions.link_cancel)} title='Cancelar'>
84 
          <Delete />
 76 
          <Delete />
85 
        </IconButton>
 77 
        </IconButton>
86 
      )}
 78 
      )}
87 
    </StyledMemberContainer>
 79 
    </StyledMemberContainer>
Línea 88... Línea 80...
88 
  )
 80 
  );