Proyectos de Subversion LeadersLinked - SPA

Rev

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

Rev 3432 Rev 3585
Línea 1... Línea 1...
1 
import React from "react";
 1 
import React from 'react';
2 
import { axios } from "../../utils";
 2 
import { axios } from '../../utils';
3 
import { useDispatch } from "react-redux";
 3 
import { useDispatch } from 'react-redux';
4 
import { addNotification } from "../../redux/notification/notification.actions";
 4 
import { addNotification } from '../../redux/notification/notification.actions';
5 
import styled from "styled-components";
 5 
import styled from 'styled-components';
Línea 6... Línea 6...
6 
 
 6 
 
Línea 7... Línea 7...
7 
import { useFetch } from "@hooks";
 7 
import { useFetch } from '@hooks';
8 
 
 8 
 
Línea 9... Línea 9...
9 
import WidgetLayout from "../widgets/WidgetLayout";
 9 
import WidgetLayout from '../widgets/WidgetLayout';
10 
import EmptySection from "../UI/EmptySection";
 10 
import EmptySection from '../UI/EmptySection';
11 
 
 11 
 
12 
const StyledContainer = styled(WidgetLayout)`
 12 
const StyledContainer = styled(WidgetLayout)`
Línea 23... Línea 23...
23 
  display: flex;
 23 
  display: flex;
24 
  flex-direction: column;
 24 
  flex-direction: column;
25 
  cursor: pointer;
 25 
  cursor: pointer;
26 
  padding: 0.5rem;
 26 
  padding: 0.5rem;
27 
  border-radius: ${(props) => props.theme.border.radius};
 27 
  border-radius: ${(props) => props.theme.border.radius};
28 
  background-color: ${(props) => props.background || "transparent"};
 28 
  background-color: ${(props) => props.background || 'transparent'};
29 
  h4 {
 29 
  h4 {
30 
    color: ${(props) => props.theme.font.color.title};
 30 
    color: ${(props) => props.theme.font.color.title};
31 
  }
 31 
  }
32 
  b {
 32 
  b {
33 
    color: ${(props) => props.theme.font.color.title};
 33 
    color: ${(props) => props.theme.font.color.title};
Línea 38... Línea 38...
38 
    font-weight: 400;
 38 
    font-weight: 400;
39 
  }
 39 
  }
40 
`;
 40 
`;
Línea 41... Línea 41...
41 
 
 41 
 
42 
const EventsList = () => {
 42 
const EventsList = () => {
43 
  const { data: eventsAndTasks } = useFetch("/helpers/next-events", []);
 43 
  const { data: eventsAndTasks } = useFetch('/helpers/next-events', []);
Línea 44... Línea 44...
44 
  const dispatch = useDispatch();
 44 
  const dispatch = useDispatch();
45 
 
 45 
 
46 
  const getAdminAuth = (url) => {
 46 
  const getAdminAuth = (url) => {
47 
    axios
 47 
    axios
48 
      .get(url)
 48 
      .get(url)
Línea 49... Línea 49...
49 
      .then((response) => {
 49 
      .then((response) => {
50 
        const { data, success } = response.data;
 50 
        const { data, success } = response.data;
51 
 
 51 
 
Línea 52... Línea 52...
52 
        if (!success) {
 52 
        if (!success) {
53 
          throw new Error("Error interno. Por favor, intente más tarde.");
 53 
          throw new Error('Error interno. Por favor, intente más tarde.');
54 
        }
 54 
        }
55 
 
 55 
 
56 
        window.open(data, "_blank");
 56 
        window.open(data, '_blank');
57 
      })
 57 
      })
Línea 58... Línea 58...
58 
      .catch((err) => {
 58 
      .catch((err) => {
59 
        dispatch(addNotification({ style: "danger", msg: err.message }));
 59 
        dispatch(addNotification({ style: 'danger', msg: err.message }));
Línea 60... Línea 60...
60 
      });
 60 
      });
61 
  };
 61 
  };
62 
 
 62 
 
Línea 63... Línea 63...
63 
  const formatDate = (date, allDay) => {
 63 
  const formatDate = (date, allDay) => {
64 
    const dateObj = new Date(date);
 64 
    const dateObj = new Date(date);
65 
 
 65 
 
66 
    if (isNaN(dateObj)) {
 66 
    if (isNaN(dateObj)) {
67 
      return date;
 67 
      return date;
68 
    }
 68 
    }
69 
 
 69 
 
Línea 70... Línea 70...
70 
    return new Intl.DateTimeFormat("es", {
 70 
    return new Intl.DateTimeFormat('es', {
71 
      dateStyle: "medium",
 71 
      dateStyle: 'medium',
72 
      timeStyle: allDay ? undefined : "short",
 72 
      timeStyle: allDay ? undefined : 'short',
Línea 73... Línea 73...
73 
      timeZone: "UTC",
 73 
      timeZone: 'UTC',
74 
      hour12: allDay ? undefined : true,
 74 
      hour12: allDay ? undefined : true
75 
    }).format(dateObj);
 75 
    }).format(dateObj);
76 
  };
 - 
 
77 
 
 - 
 
78 
  return (
 - 
 
79 
    <StyledContainer>
 - 
 
80 
      <h2>Eventos y Tareas</h2>
 - 
 
81 
 
 76 
  };
82 
      <ul>
 - 
 
83 
        {eventsAndTasks.length ? (
 - 
 
84 
          eventsAndTasks.map(
 - 
 
85 
            ({
 - 
 
86 
              id,
 - 
 
87 
              allDay,
 77 
 
88 
              url,
 78 
  return (
89 
              title,
 79 
    <StyledContainer>
90 
              backgroundColor,
 80 
      <h2>Eventos y Tareas</h2>
91 
              start,
 81 
 
92 
              end,
 82 
      <ul>
93 
              textColor,
 - 
 
94 
              source,
 83 
        {eventsAndTasks.length ? (
95 
            }) => {
 - 
 
96 
              return (
 84 
          eventsAndTasks.map(
97 
                <li key={id}>
 85 
            ({ id, allDay, url, title, backgroundColor, start, end, textColor, source }) => {
98 
                  <StyledEventContainer
 86 
              return (
99 
                    color={textColor}
 87 
                <li key={id}>
100 
                    background={backgroundColor}
 88 
                  <StyledEventContainer
Línea 122... Línea 110...
122 
                </li>
 110 
                </li>
123 
              );
 111 
              );
124 
            }
 112 
            }
125 
          )
 113 
          )
126 
        ) : (
 114 
        ) : (
127 
          <EmptySection message="No hay eventos disponibles" />
 115 
          <EmptySection message='No hay eventos disponibles' />
128 
        )}
 116 
        )}
129 
      </ul>
 117 
      </ul>
130 
    </StyledContainer>
 118 
    </StyledContainer>
131 
  );
 119 
  );
132 
};
 120 
};