Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

Rev 4981 Rev 4982
Línea 2... Línea 2...
2 
import axios from '../../utils/axios'
 2 
import axios from '../../utils/axios'
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'
Línea 5... Línea 5...
5 
 
 5 
 
6 
const EventsList = () => {
 6 
const EventsList = () => {
7 
    const [events, setEvents] = useState([])
 - 
 
8 
    const [tasks, setTasks] = useState([])
 7 
    const [eventsAndTasks, setEventsAndTasks] = useState([])
Línea 9... Línea 8...
9 
    const dispatch = useDispatch()
 8 
    const dispatch = useDispatch()
10 
 
 9 
 
11 
    const getEvents = async () => {
 10 
    const getEvents = async () => {
Línea 15... Línea 14...
15 
            if (!response.success) {
 14 
            if (!response.success) {
16 
                dispatch(addNotification({ style: 'danger', message: response.data }))
 15 
                dispatch(addNotification({ style: 'danger', message: response.data }))
17 
                return
 16 
                return
18 
            }
 17 
            }
Línea 19... Línea -...
19 
 
 - 
 
20 
            const nextTasks = response.data.filter(event => event.type === 'task')
 - 
 
21 
            const nextEvents = response.data.filter(event => event.type === 'event')
 - 
 
22 
 
 - 
 
23 
            setTasks(nextTasks)
 18 
 
24 
            setEvents(nextEvents)
 - 
 
25 
 
 19 
            setEventsAndTasks(response.data)
26 
        } catch (error) {
 20 
        } catch (error) {
27 
            dispatch(addNotification({ style: 'danger', message: 'Ha ocurrido un error' }))
 21 
            dispatch(addNotification({ style: 'danger', message: 'Ha ocurrido un error' }))
28 
            console.log(`Error: ${error.message}`)
 22 
            console.log(`Error: ${error.message}`)
29 
        }
 23 
        }
Línea 32... Línea 26...
32 
    useEffect(() => {
 26 
    useEffect(() => {
33 
        getEvents()
 27 
        getEvents()
34 
    }, [])
 28 
    }, [])
Línea 35... Línea 29...
35 
 
 29 
 
36 
    return (
 - 
 
37 
        <>
 30 
    return (
38 
            <div className='task-widget'>
 31 
        <div className='task-widget'>
39 
                <div className="sd-title d-flex align-items-center justify-content-between">
 32 
            <div className="sd-title d-flex align-items-center justify-content-between">
40 
                    <h3>Eventos</h3>
 - 
 
41 
                </div>
 - 
 
42 
                <div className="d-flex flex-column" style={{ gap: '.5rem', maxHeight: 300, overflow: 'hidden scroll' }}>
 - 
 
43 
                    {events.length
 - 
 
44 
                        ? events.map((event) => {
 - 
 
45 
                            const eventStart = new Date(event.start).toLocaleString()
 - 
 
46 
                            const eventEnd = new Date(event.end).toLocaleString()
 - 
 
47 
 
 - 
 
48 
                            return (
 - 
 
49 
                                <a
 - 
 
50 
                                    key={event.id}
 - 
 
51 
                                    href={event.url}
 - 
 
52 
                                    target='_blank'
 - 
 
53 
                                    rel="noreferrer"
 - 
 
54 
                                >
 - 
 
55 
                                    <div className='calendar-event' style={{ color: event.textColor, background: event.backgroundColor }}>
 - 
 
56 
                                        <h4>
 - 
 
57 
                                            <b>Evento: </b> {event.title}
 - 
 
58 
                                        </h4>
 - 
 
59 
                                        <span>
 - 
 
60 
                                            <b>Inicio: </b>{eventStart}
 - 
 
61 
                                        </span>
 - 
 
62 
                                        <span>
 - 
 
63 
                                            <b>Fin: </b>{eventEnd}
 - 
 
64 
                                        </span>
 - 
 
65 
                                    </div>
 - 
 
66 
                                </a>
 - 
 
67 
                            )
 - 
 
68 
                        })
 - 
 
69 
                        : <div className="view-more">No hay eventos</div>
 - 
 
70 
                    }
 - 
 
71 
                </div>
 33 
                <h3>Eventos</h3>
72 
            </div>
 - 
 
73 
            <div className='task-widget mt-2'>
 - 
 
74 
                <div className="sd-title d-flex align-items-center justify-content-between">
 - 
 
75 
                    <h3>Tareas</h3>
 - 
 
76 
                </div>
 34 
            </div>
77 
                <div className="d-flex flex-column" style={{ gap: '.5rem', maxHeight: 300, overflow: 'hidden scroll' }}>
 35 
            <div className="d-flex flex-column" style={{ gap: '.5rem', maxHeight: 300, overflow: 'hidden scroll' }}>
78 
                    {tasks.length
 36 
                {eventsAndTasks.length
79 
                        ? tasks.map((task) => {
 37 
                    ? eventsAndTasks.map((event) => {
80 
                            const taskStart = new Date(task.start).toLocaleString()
 38 
                        const eventStart = new Date(event.start).toLocaleString()
81 
                            const taskEnd = new Date(task.end).toLocaleString()
 39 
                        const eventEnd = new Date(event.end).toLocaleString()
82 
 
 40 
 
83 
                            return (
 41 
                        return (
84 
                                <a
 42 
                            <a
85 
                                    key={task.id}
 43 
                                key={event.id}
86 
                                    href={task.url}
 44 
                                href={event.url}
87 
                                    target='_blank'
 45 
                                target='_blank'
88 
                                    rel="noreferrer"
 46 
                                rel="noreferrer"
89 
                                >
 47 
                            >
90 
                                    <div className='calendar-event' style={{ color: task.textColor, background: task.backgroundColor }}>
 48 
                                <div className='calendar-event' style={{ color: event.textColor, background: event.backgroundColor }}>
91 
                                        <h4>
 49 
                                    <h4>
92 
                                            <b>Tarea: </b> {task.title}
 50 
                                        <b>Evento: </b> {event.title}
- 
 
 51 
                                    </h4>
- 
 
 52 
                                    <span>
- 
 
 53 
                                        <b>Inicio: </b>{eventStart}
- 
 
 54 
                                    </span>
93 
                                        </h4>
 55 
                                    {event.end &&
94 
                                        <span>
 - 
 
95 
                                            <b>Inicio: </b>{taskStart}
 - 
 
96 
                                        </span>
 - 
 
97 
                                        <span>
 56 
                                        <span>
98 
                                            <b>Fin: </b>{taskEnd}
 57 
                                            <b>Fin: </b>{eventEnd}
99 
                                        </span>
 58 
                                        </span>
100 
                                    </div>
 59 
                                    }
101 
                                </a>
 60 
                                </div>
102 
                            )
 61 
                            </a>
103 
                        })
 - 
 
104 
                        : <div className="view-more">No hay tareas</div>
 62 
                        )
- 
 
 63 
                    })
105 
                    }
 64 
                    : <div className="view-more">No hay eventos</div>
106 
                </div>
 65 
                }
107 
            </div>
 66 
            </div>
108 
        </>
 67 
        </div>
109 
    )
 68 
    )
Línea 110... Línea 69...
110 
}
 69 
}
111 
 
 70