Proyectos de Subversion LeadersLinked - SPA

Rev

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

Rev 5 Rev 145
Línea 1... Línea 1...
1 
import React, { useState, useEffect } from 'react'
 1 
import React, { useState, useEffect } from "react";
2 
import { axios } from '../../utils'
 2 
import { axios } from "../../utils";
3 
import { Modal } from 'react-bootstrap'
 3 
import { Modal } from "react-bootstrap";
4 
import { addNotification } from '../../redux/notification/notification.actions'
 4 
import { addNotification } from "../../redux/notification/notification.actions";
Línea 5... Línea 5...
5 
 
 5 
 
6 
const AddMemberModal = ({
 6 
const AddMemberModal = ({
7 
  isShow = false,
 7 
  isShow = false,
8 
  linkInvite = '',
 8 
  linkInvite = "",
9 
  handleClose = function () {},
 9 
  handleClose = function () {},
10 
}) => {
 10 
}) => {
11 
  const [users, setUsers] = useState([])
 11 
  const [users, setUsers] = useState([]);
Línea 12... Línea 12...
12 
  const [search, setSearch] = useState('')
 12 
  const [search, setSearch] = useState("");
- 
 
 13 
 
- 
 
 14 
  const handleChange = ({ target }) => setSearch(target.value);
- 
 
 15 
 
Línea 13... Línea -...
13 
 
 - 
 
14 
  const handleChange = ({ target }) => setSearch(target.value)
 16 
  const searchMember = async (url, search) => {
15 
 
 17 
    if (!url) return;
16 
  const searchMember = async (value) => {
 18 
 
17 
    try {
 19 
    try {
18 
      const { data } = await axios.get(linkInvite + '?search=' + value)
 20 
      const { data } = await axios.get(url + "?search=" + search);
19 
      setUsers(data.data)
 21 
      setUsers(data.data);
20 
    } catch (error) {
 22 
    } catch (error) {
Línea 21... Línea 23...
21 
      console.log('>>: error > ', error)
 23 
      console.log(">>: error > ", error);
22 
    }
 24 
    }
23 
  }
 25 
  };
24 
 
 26 
 
25 
  const invite = (uuid) => {
 27 
  const invite = (uuid) => {
26 
    const formData = new FormData()
 28 
    const formData = new FormData();
27 
    formData.append('id', uuid)
 29 
    formData.append("id", uuid);
28 
    axios
 30 
    axios
29 
      .post(linkInvite, formData)
 31 
      .post(linkInvite, formData)
30 
      .then(({ data }) => {
 32 
      .then(({ data }) => {
31 
        if (!data.success) {
 33 
        if (!data.success) {
32 
          return addNotification({ msg: data.data, style: 'danger' })
 34 
          return addNotification({ msg: data.data, style: "danger" });
33 
        }
 35 
        }
34 
        addNotification({ msg: data.data, style: 'success' })
 36 
        addNotification({ msg: data.data, style: "success" });
35 
        handleClose()
 37 
        handleClose();
36 
      })
 38 
      })
37 
      .catch(() =>
 39 
      .catch(() =>
38 
        addNotification({
 40 
        addNotification({
39 
          msg: 'Disculpe, ha ocurrido un error',
 41 
          msg: "Disculpe, ha ocurrido un error",
Línea 40... Línea 42...
40 
          style: 'danger',
 42 
          style: "danger",
41 
        })
 43 
        })
42 
      )
 44 
      );
Línea 43... Línea 45...
43 
  }
 45 
  };
44 
 
 46 
 
45 
  useEffect(() => {
 47 
  useEffect(() => {
46 
    searchMember(search)
 48 
    searchMember(linkInvite, search);
Línea 58... Línea 60...
58 
              onChange={handleChange}
 60 
              onChange={handleChange}
59 
              name="search"
 61 
              name="search"
60 
              placeholder="Escribe el nombre del usuario"
 62 
              placeholder="Escribe el nombre del usuario"
61 
            />
 63 
            />
62 
          </div>
 64 
          </div>
63 
          <ul className="d-flex flex-column w-100" style={{ gap: '1rem' }}>
 65 
          <ul className="d-flex flex-column w-100" style={{ gap: "1rem" }}>
64 
            {!!users.length &&
 - 
 
65 
              users.map((element, index) => (
 66 
            {users.map((element, index) => (
66 
                <li key={index}>
 67 
              <li key={index}>
67 
                  <div
 68 
                <div
68 
                    className="d-flex align-items-center justify-content-between flex-column flex-md-row"
 69 
                  className="d-flex align-items-center justify-content-between flex-column flex-md-row"
69 
                    style={{ gap: '.5rem' }}
 70 
                  style={{ gap: ".5rem" }}
- 
 
 71 
                >
- 
 
 72 
                  <span>{element.text}</span>
- 
 
 73 
                  <button
- 
 
 74 
                    className="btn btn-primary"
- 
 
 75 
                    onClick={() => invite(element.value)}
70 
                  >
 76 
                  >
71 
                    <span>{element.text}</span>
 - 
 
72 
                    <button
 - 
 
73 
                      className="btn btn-primary"
 - 
 
74 
                      onClick={() => invite(element.value)}
 - 
 
75 
                    >
 - 
 
76 
                      Invitar
 77 
                    Invitar
77 
                    </button>
 78 
                  </button>
78 
                  </div>
 79 
                </div>
79 
                </li>
 80 
              </li>
80 
              ))}
 81 
            ))}
81 
          </ul>
 82 
          </ul>
82 
        </div>
 83 
        </div>
83 
      </Modal.Body>
 84 
      </Modal.Body>
84 
    </Modal>
 85 
    </Modal>
85 
  )
 86 
  );
86 
}
 87 
};
Línea 87... Línea 88...
87 
 
 88