Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

Rev 7260 Rev 7263
Línea 1... Línea 1...
1 
import React, { useEffect, useState } from 'react'
 1 
import React, { useEffect, useState } from 'react'
2 
import { axios } from '../../utils'
 2 
import { axios } from '../../utils'
- 
 
 3 
import styled from 'styled-components'
- 
 
 4 
import Avatar from '@mui/material/Avatar'
3 
import IconButton from '@mui/material/IconButton'
 5 
import IconButton from '@mui/material/IconButton'
4 
import GroupRemoveIcon from '@mui/icons-material/GroupRemove'
 6 
import GroupRemoveIcon from '@mui/icons-material/GroupRemove'
- 
 
 7 
import ArrowBackIosIcon from '@mui/icons-material/ArrowBackIos'
Línea 5... Línea 8...
5 
 
 8 
 
6 
import Spinner from '../UI/Spinner'
 9 
import Spinner from '../UI/Spinner'
- 
 
 10 
import LoaderContainer from '../UI/LoaderContainer'
Línea -... Línea 11...
- 
 
 11 
import WidgetLayout from '../widgets/WidgetLayout'
- 
 
 12 
 
- 
 
 13 
const ContactContainer = styled(WidgetLayout)`
- 
 
 14 
  padding: 1rem;
- 
 
 15 
  position: relative;
- 
 
 16 
  flex-grow: 1;
- 
 
 17 
  ul {
- 
 
 18 
    display: flex;
- 
 
 19 
    flex-direction: column;
- 
 
 20 
    gap: 0.5rem;
- 
 
 21 
    max-height: 300px;
- 
 
 22 
    overflow: auto;
- 
 
 23 
  }
- 
 
 24 
`
- 
 
 25 
 
- 
 
 26 
const ContactTemplate = styled.div`
- 
 
 27 
  display: flex;
- 
 
 28 
  align-items: center;
- 
 
 29 
  gap: 0.5rem;
- 
 
 30 
  h3 {
- 
 
 31 
    font-size: 1rem;
- 
 
 32 
    color: var(--subtitle-color);
- 
 
 33 
  }
7 
import LoaderContainer from '../UI/LoaderContainer'
 34 
`
8 
 
 35 
 
9 
const GroupMembers = ({ group }) => {
 36 
const GroupMembers = ({ group, changeTab }) => {
10 
  const { url_get_contact_group_list } = group
 37 
  const { url_get_contact_group_list } = group
Línea 11... Línea 38...
11 
  const [members, setMembers] = useState([])
 38 
  const [members, setMembers] = useState([])
12 
  const [loading, setLoading] = useState(true)
 39 
  const [loading, setLoading] = useState(true)
13 
 
 40 
 
14 
  const getMembers = async () => {
 41 
  const getMembers = async () => {
15 
    setLoading(true)
 42 
    setLoading(true)
16 
    const response = await axios.get(url_get_contact_group_list)
 43 
    const response = await axios.get(url_get_contact_group_list)
17 
    const resData = response.data
 44 
    const { success, data } = response.data
18 
    if (!resData.success) {
 45 
    if (!success) {
19 
      return resData
 46 
      return
20 
    }
 47 
    }
Línea 21... Línea 48...
21 
    setMembers(resData.data)
 48 
    setMembers(data)
22 
    setLoading(false)
 49 
    setLoading(false)
23 
  }
 50 
  }
24 
 
 51 
 
25 
  const handleRemoveMember = async (remove_url) => {
 52 
  const handleRemoveMember = async (remove_url) => {
26 
    setLoading(true)
 53 
    setLoading(true)
27 
    const response = await axios.post(remove_url)
 54 
    const response = await axios.post(remove_url)
28 
    const resData = response.data
 55 
    const { success } = response.data
29 
    if (!resData.success) {
 56 
    if (!success) {
30 
      return resData
 57 
      return
Línea 31... Línea 58...
31 
    }
 58 
    }
32 
    await getMembers()
 59 
    await getMembers()
33 
    setLoading(false)
 60 
    setLoading(false)
Línea 34... Línea 61...
34 
  }
 61 
  }
35 
 
 62 
 
- 
 
 63 
  useEffect(() => {
- 
 
 64 
    getMembers()
- 
 
 65 
  }, [])
36 
  useEffect(() => {
 66 
 
37 
    getMembers()
 67 
  return (
38 
  }, [])
 68 
    <ContactContainer>
39 
 
 69 
      <IconButton onClick={() => changeTab('DEFAULT')}>
40 
  return (
 70 
        <ArrowBackIosIcon />
Línea 52... Línea 82...
52 
      {loading && (
 82 
      {loading && (
53 
        <LoaderContainer>
 83 
        <LoaderContainer>
54 
          <Spinner />
 84 
          <Spinner />
55 
        </LoaderContainer>
 85 
        </LoaderContainer>
56 
      )}
 86 
      )}
57 
    </div>
 87 
    </ContactContainer>
58 
  )
 88 
  )
59 
}
 89 
}
Línea 60... Línea 90...
60 
 
 90 
 
61 
const Item = ({ image, name, onClick }) => {
 91 
const Item = ({ image, name, onClick }) => {
62 
  return (
 92 
  return (
63 
    <div className="entity">
 93 
    <ContactTemplate>
64 
      <img src={image} alt="user_image" />
 94 
      <Avatar src={image} alt="user_image" />
65 
      <span>{name}</span>
 95 
      <span>{name}</span>
66 
      <IconButton onClick={onClick}>
 96 
      <IconButton onClick={onClick}>
67 
        <GroupRemoveIcon />
 97 
        <GroupRemoveIcon />
68 
      </IconButton>
 98 
      </IconButton>
69 
    </div>
 99 
    </ContactTemplate>
70 
  )
 100 
  )
Línea 71... Línea 101...
71 
}
 101 
}