Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 2113 | Rev 2115 | Ir a la última revisión | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
1587 steven 1 
import React, { useState } from "react";
2 
import { addNotification } from "../redux/notification/notification.actions";
3 
import ConfirmationBox from "../shared/confirmation-box/ConfirmationBox";
4 
import Spinner from "../shared/loading-spinner/Spinner";
5 
import { axios } from "../utils";
6 
import styled from 'styled-components'
7 
 
8 
const StyledSpinnerContainer = styled.div`
9 
  position: absolute;
10 
  left: 0;
11 
  top: 0;
12 
  width: 100%;
13 
  height: 100%;
14 
  background: rgba(255, 255, 255, 0.4);
15 
  display: flex;
16 
  justify-content: center;
17 
  align-items: center;
18 
  z-index: 300;
19 
`;
20 
const Profile = (props) => {
21 
  // props destructuring
22 
  const {
23 
    image,
24 
    name,
25 
    status,
26 
    link_view,
27 
    link_edit,
28 
    link_delete,
29 
    link_cancel,
30 
    link_block,
31 
    link_reject,
32 
    link_approve,
33 
    link_inmail,
34 
    link_request,
35 
    link_unblock,
1588 steven 36 
    link_unfollow,
1592 steven 37 
    link_leave,
1587 steven 38 
    link_admin,
2113 steven 39 
    fetchCallback,
40 
    isTopData = false
1587 steven 41 
  } = props;
42 
 
43 
  // states
44 
  const [showConfirmationBox, setShowConfirmationBox] = useState(false);
45 
  const [showCancelConfirmationBox, setShowCancelConfirmationBox] = useState(false);
46 
  const [showBlockConfirmationBox, setShowBlockConfirmationBox] = useState(false);
47 
  const [showRejectConfirmationBox, setShowRejectConfirmationBox] = useState(false);
48 
  const [showApproveConfirmationBox, setShowApproveConfirmationBox] = useState(false);
49 
  const [showRequestConfirmationBox, setShowRequestConfirmationBox] = useState(false);
50 
  const [showUnblockConfirmationBox, setShowUnblockConfirmationBox] = useState(false);
1592 steven 51 
  const [showLeaveConfirmationBox, setShowLeaveConfirmationBox] = useState(false);
1587 steven 52 
 
53 
  const [loading, setLoading] = useState(false)
54 
  const handleShowConfirmationBox = (show = !showConfirmationBox) => {
55 
    setShowConfirmationBox(show);
56 
  };
57 
  const handleCancelConfirmationBox = (show = !showConfirmationBox) => {
58 
    setShowCancelConfirmationBox(show);
59 
  };
60 
  const handleBlockConfirmationBox = (show = !showConfirmationBox) => {
61 
    setShowBlockConfirmationBox(show);
62 
  };
63 
  const handleRejectConfirmationBox = (show = !showConfirmationBox) => {
64 
    setShowRejectConfirmationBox(show);
65 
  };
66 
  const handleApproveConfirmationBox = (show = !showConfirmationBox) => {
67 
    setShowApproveConfirmationBox(show);
68 
  };
69 
  const handleRequestConfirmationBox = (show = !showConfirmationBox) => {
70 
    setShowRequestConfirmationBox(show);
71 
  };
72 
  const handleUnblockConfirmationBox = (show = !showConfirmationBox) => {
73 
    setShowUnblockConfirmationBox(show);
74 
  };
1592 steven 75 
  const handleLeaveConfirmationBox = (show = !showConfirmationBox) => {
76 
    setShowLeaveConfirmationBox(show);
77 
  };
1587 steven 78 
 
79 
  const handleCancelApply = (url = link_delete) => {
80 
    setLoading(true);
81 
    axios
82 
      .post(url)
83 
      .then((response) => {
84 
        const resData = response.data;
85 
         (resData);
86 
        if (resData.success) {
87 
          const msg = resData.data;
88 
          addNotification({
89 
            style: "success",
90 
            msg: msg,
91 
          });
92 
          if(fetchCallback)
93 
            fetchCallback();
94 
        } else {
95 
          const errorMsg =
96 
            typeof resData.data === "string"
97 
              ? resData.data
98 
              : "Ha ocurrido un error, Por favor intente más tarde";
99 
          addNotification({
100 
            style: "danger",
101 
            msg: errorMsg,
102 
          });
103 
          setLoading(false);
104 
        }
105 
      })
106 
      .catch((error) => {
107 
        console.log('>>: error > ', error)
108 
      })
109 
      .finally(() => {
110 
        setLoading(false);
111 
      });
112 
  };
113 
 
1588 steven 114 
  const handleUnfollow = async (link_unfollow) => {
115 
    setLoading(true);
116 
    await axios.post(link_unfollow).then((response) => {
117 
      const resData = response.data;
118 
      if (resData.success) {
119 
        fetchCallback()
120 
      } else {
121 
        if (resError.constructor.name !== "Object") {
122 
          addNotification({
123 
            style: "danger",
124 
            msg: resData.data,
125 
          });
126 
        }
127 
      }
128 
    });
129 
    setLoading(false);
130 
  };
131 
 
1587 steven 132 
  const getManageUrl = async () => {
133 
    try {
134 
      const res = await axios.get(link_admin)
135 
      if(res.data.success){
136 
        window.open(res.data.data, '_backend')
137 
      }
138 
    } catch (error) {
139 
      console.log('>>: error > ', error)
140 
    }
141 
  }
142 
 
143 
  return (
2112 steven 144 
    <div className="col-md-4 col-sm-6 col-12">
1587 steven 145 
      <div className="company_profile_info border-radius border-gray">
146 
        <div className="company-up-info border-radius">
147 
          <div className="ph-15">
148 
            <div
149 
              className="row border-bottom-gray mb-2"
150 
            >
151 
              {
152 
                !!image && (
153 
                  <div className="col-md-4 col-sm-12 p-0">
154 
                    <img src={image} className="object-fit-contain" style={{borderRadius: 0}} alt="" />
155 
                  </div>
156 
                )
157 
              }
158 
              <div className={image ? 'col-md-8 d-flex justify-content-center align-items-center' : 'col-md-12 '+ ' col-sm-12 col-12'}>
159 
                <h3 className={status ? '' : "col-sm-12 d-flex justify-content-center align-items-center"}>
160 
                  {name}
161 
                  {
162 
                    status && (
163 
                      <>
164 
                        <br />
165 
                        <h4 className="col-sm-12 d-flex justify-content-center align-items-center">{status}</h4>
166 
                      </>
167 
                    )
168 
                  }
2114 steven 169 
                </h3>
170 
                {
171 
                  isTopData && (
172 
                    <div className="row">
173 
                      <div className="col-6">
174 
                        {
175 
                          link_view && (
176 
                            <li>
177 
                              <a
178 
                                href={link_view}
179 
                                data-link={link_view}
180 
                                title=""
181 
                                className="btn btn-secondary"
182 
                              >
183 
                                Ver perfil
184 
                              </a>
185 
                            </li>
186 
                          )
187 
                        }
2113 steven 188 
                      </div>
2114 steven 189 
                      <div className="col-6">
190 
                        {
191 
                          link_inmail && (
192 
                            <li>
193 
                              <a
194 
                                href={link_inmail}
195 
                                data-link={link_inmail}
196 
                                title=""
197 
                                className="btn btn-primary"
198 
                              >
199 
                                Mensaje
200 
                              </a>
201 
                            </li>
202 
                          )
203 
                        }
204 
                      </div>
205 
                    </div>
206 
                  )
207 
                }
1587 steven 208 
              </div>
209 
            </div>
210 
          </div>
211 
 
212 
          <ul>
213 
            {
2113 steven 214 
              link_view && !isTopData && (
1587 steven 215 
                <li>
216 
                  <a
217 
                    href={link_view}
218 
                    data-link={link_view}
219 
                    title=""
220 
                    className="btn btn-primary"
221 
                  >
222 
                    Ver perfil
223 
                  </a>
224 
                </li>
225 
              )
226 
            }
227 
            {
228 
              link_edit && (
229 
                <li>
230 
                  <a
231 
                    href={link_edit}
232 
                    data-link={link_edit}
233 
                    title=""
234 
                    className="btn btn-secondary"
235 
                  >
236 
                    Editar perfil
237 
                  </a>
238 
                </li>
239 
              )
240 
            }
241 
            {
242 
              link_approve && (
243 
                <li>
244 
                  <a
245 
                    href="#"
246 
                    className="btn btn-tertiary"
247 
                    onClick={(e) => {
248 
                      e.preventDefault();
249 
                      handleApproveConfirmationBox();
250 
                    }}
251 
                  >
252 
                    Aprobar
253 
                  </a>
254 
                </li>
255 
              )
256 
            }
257 
            {
258 
              link_reject && (
259 
                <li>
260 
                  <a
261 
                    href="#"
262 
                    className="btn btn-tertiary"
263 
                    onClick={(e) => {
264 
                      e.preventDefault();
265 
                      handleRejectConfirmationBox();
266 
                    }}
267 
                  >
268 
                    Rechazar
269 
                  </a>
270 
                </li>
271 
              )
272 
            }
273 
            {
274 
              link_delete && (
275 
                <li>
276 
                  <a
277 
                    href="#"
278 
                    className="btn btn-tertiary"
279 
                    onClick={(e) => {
280 
                      e.preventDefault();
281 
                      handleShowConfirmationBox();
282 
                    }}
283 
                  >
284 
                    Borrar perfil
285 
                  </a>
286 
                </li>
287 
              )
288 
            }
289 
            {
2113 steven 290 
              link_inmail && !isTopData && (
1587 steven 291 
                <li>
292 
                  <a
293 
                    href={link_inmail}
294 
                    data-link={link_inmail}
295 
                    title=""
296 
                    className="btn btn-tertiary"
297 
                  >
298 
                    Mensaje
299 
                  </a>
300 
                </li>
301 
              )
302 
            }
303 
            {
304 
              link_admin && (
305 
                <li>
306 
                  <a
307 
                    onClick={() => getManageUrl()}
308 
                    data-link={link_admin}
309 
                    title="Administrar empresa"
310 
                    className="btn btn-tertiary"
311 
                  >
312 
                    Administrar
313 
                  </a>
314 
                </li>
315 
              )
316 
            }
1588 steven 317 
            {
318 
              link_unfollow && (
319 
                <li>
320 
                  <a
321 
                    onClick={() => handleUnfollow(link_unfollow)}
322 
                    data-link={link_unfollow}
323 
                    title="Administrar empresa"
324 
                    className="btn btn-tertiary"
325 
                  >
326 
                    Dejar de seguir
327 
                  </a>
328 
                </li>
329 
              )
330 
            }
1587 steven 331 
 
332 
            {
333 
              link_block && (
334 
                <li>
335 
                  <a
336 
                    href="#"
337 
                    className="btn btn-secondary"
338 
                    onClick={(e) => {
339 
                      e.preventDefault();
340 
                      handleBlockConfirmationBox();
341 
                    }}
342 
                  >
343 
                    Bloquear
344 
                  </a>
345 
                </li>
346 
              )
347 
            }
348 
            {
349 
              link_unblock && (
350 
                <li>
351 
                  <a
352 
                    href="#"
353 
                    className="btn btn-secondary"
354 
                    onClick={(e) => {
355 
                      e.preventDefault();
356 
                      handleUnblockConfirmationBox();
357 
                    }}
358 
                  >
359 
                    Desbloquear
360 
                  </a>
361 
                </li>
362 
              )
363 
            }
364 
            {
365 
              link_request && (
366 
                <li>
367 
                  <a
368 
                    href="#"
369 
                    className="btn btn-secondary"
370 
                    onClick={(e) => {
371 
                      e.preventDefault();
372 
                      handleRequestConfirmationBox();
373 
                    }}
374 
                  >
375 
                    Conectar
376 
                  </a>
377 
                </li>
378 
              )
379 
            }
380 
            {
381 
              link_cancel && (
382 
                <li>
383 
                  <a
384 
                    href="#"
385 
                    className="btn btn-primary"
386 
                    onClick={(e) => {
387 
                      e.preventDefault();
388 
                      handleCancelConfirmationBox();
389 
                    }}
390 
                  >
391 
                    Cancelar
392 
                  </a>
393 
                </li>
394 
              )
395 
            }
1592 steven 396 
            {
397 
              link_leave && (
398 
                <li>
399 
                  <a
400 
                    href="#"
401 
                    className="btn btn-primary"
402 
                    onClick={(e) => {
403 
                      e.preventDefault();
1594 steven 404 
                      handleLeaveConfirmationBox();
1592 steven 405 
                    }}
406 
                  >
407 
                    Abandonar
408 
                  </a>
409 
                </li>
410 
              )
411 
            }
1587 steven 412 
 
413 
          </ul>
414 
        </div>
415 
        {link_delete && (
416 
          <div style={{ position: "relative" }}>
417 
            <ConfirmationBox
418 
              show={showConfirmationBox}
419 
              onClose={() => handleShowConfirmationBox(false)}
420 
              onAccept={() => handleCancelApply(link_delete)}
421 
            />
422 
          </div>
423 
        )}
424 
        {link_cancel && (
425 
          <div style={{ position: "relative" }}>
426 
            <ConfirmationBox
427 
              show={showCancelConfirmationBox}
428 
              onClose={() => handleCancelConfirmationBox(false)}
429 
              onAccept={() => handleCancelApply(link_cancel)}
430 
            />
431 
          </div>
432 
        )}
433 
        {link_block && (
434 
          <div style={{ position: "relative" }}>
435 
            <ConfirmationBox
436 
              show={showBlockConfirmationBox}
437 
              onClose={() => handleBlockConfirmationBox(false)}
438 
              onAccept={() => handleCancelApply(link_block)}
439 
            />
440 
          </div>
441 
        )}
442 
        {link_approve && (
443 
          <div style={{ position: "relative" }}>
444 
            <ConfirmationBox
445 
              show={showApproveConfirmationBox}
446 
              onClose={() => handleApproveConfirmationBox(false)}
447 
              onAccept={() => handleCancelApply(link_approve)}
448 
            />
449 
          </div>
450 
        )}
451 
        {link_reject && (
452 
          <div style={{ position: "relative" }}>
453 
            <ConfirmationBox
454 
              show={showRejectConfirmationBox}
455 
              onClose={() => handleRejectConfirmationBox(false)}
456 
              onAccept={() => handleCancelApply(link_reject)}
457 
            />
458 
          </div>
459 
        )}
460 
        {link_request && (
461 
          <div style={{ position: "relative" }}>
462 
            <ConfirmationBox
463 
              show={showRequestConfirmationBox}
464 
              onClose={() => handleRequestConfirmationBox(false)}
465 
              onAccept={() => handleCancelApply(link_request)}
466 
            />
467 
          </div>
468 
        )}
469 
        {link_unblock && (
470 
          <div style={{ position: "relative" }}>
471 
            <ConfirmationBox
472 
              show={showUnblockConfirmationBox}
473 
              onClose={() => handleUnblockConfirmationBox(false)}
474 
              onAccept={() => handleCancelApply(link_unblock)}
475 
            />
476 
          </div>
477 
        )}
1592 steven 478 
        {link_leave && (
479 
          <div style={{ position: "relative" }}>
480 
            <ConfirmationBox
481 
              show={showLeaveConfirmationBox}
482 
              onClose={() => handleLeaveConfirmationBox(false)}
483 
              onAccept={() => handleCancelApply(link_leave)}
484 
            />
485 
          </div>
486 
        )}
1587 steven 487 
        {loading && (
488 
          <StyledSpinnerContainer>
489 
            <Spinner />
490 
          </StyledSpinnerContainer>
491 
        )}
492 
      </div>
493 
    </div>
494 
  );
495 
};
496 
 
497 
export default Profile;