EN · DE · RU · FR · ES
← Índice · ← Índice de archivos · ← Anterior · Siguiente → · 📄 fuente

#2696: CalendarPage.jsx

projectforge-webapp/src/containers/page/calendar/CalendarPage.jsx Componente React, projectforge-webapp/src/containers/page/calendar/CalendarPage.jsx 353 líneas · 314 código · 14 comentarios · 25 en blanco
Propósito: Aplicación web React: CalendarPage.jsx. CalendarPage.jsx es parte de la aplicación de gestión de proyectos de código abierto ProjectForge.

Fuente (primeras 100 líneas)

import React, { useEffect, useState } from 'react';
import Select from 'react-select';
import { Col, Container, Row } from '../../../components/design';
import EditableMultiValueLabel from '../../../components/design/EditableMultiValueLabel';
import LoadingContainer from '../../../components/design/loading-container';
import { getTranslation } from '../../../utilities/layout';
import { fetchJsonGet } from '../../../utilities/rest';
import CalendarFilterSettings from '../../panel/calendar/CalendarFilterSettings';
import FullCalendarPanel from '../../panel/calendar/FullCalendarPanel';
import FavoritesPanel from '../../panel/favorite/FavoritesPanel';
import customStyles from './Calendar.module';
import { CalendarContext, defaultValues as calendarContextDefaultValues } from './CalendarContext';

function CalendarPage() {
    const [loading, setLoading] = useState(true);
    const [translations, setTranslations] = useState(undefined);
    const queryParams = new URLSearchParams(window.location.search);
    const dateParam = queryParams.get('date');
    const [state, setState] = useState({
        colors: {},
        date: dateParam,
        view: undefined,
        alternateHoursBackground: undefined,
        teamCalendars: undefined,
        activeCalendars: [],
        filter: {
            defaultCalendarId: undefined,
            gridSize: 30,
            firstHour: 8,
            showBreaks: undefined,
        },
        listOfDefaultCalendars: [],
        timesheetUser: undefined,
        filterFavorites: undefined,
        isFilterModified: false,
        vacationGroups: [],
        vacationUsers: [],
    });

    React.useEffect(() => {
        if (translations) {
            document.title = `ProjectForge - ${getTranslation('calendar.title', translations)}`;
        }
    }, [translations]);

    const handleMultiValueChange = (id, newValue) => {
        setState((prevState) => ({
            ...prevState,
            [id]: newValue,
        }));
    };

    const onTimesheetUserChange = (newTimesheetUser) => {
        setState((prevState) => ({
            ...prevState,
            timesheetUser: newTimesheetUser,
        }));
    };

    const onShowBreaksChange = (showBreaks) => {
        setState((prevState) => ({
            ...prevState,
            filter: {
                ...prevState.filter,
                showBreaks,
            },
        }));
    };

    const onVacationGroupsChange = (newVacationGroups) => {
        setState((prevState) => ({
            ...prevState,
            vacationGroups: newVacationGroups,
        }));
    };

    const onVacationUsersChange = (newVacationUsers) => {
        setState((prevState) => ({
            ...prevState,
            vacationUsers: newVacationUsers,
        }));
    };

    const onDefaultCalendarChange = (defaultCalendarId) => {
        setState((prevState) => ({
            ...prevState,
            filter: {
                ...prevState.filter,
                defaultCalendarId,
            },
        }));
    };

    const onGridSizeChange = (gridSize) => {
        setState((prevState) => ({
            ...prevState,
            filter: {
                ...prevState.filter,
                gridSize,
            },

Historial de Git

adc8434eb Corregir diseño de página de calendario: aumentar el ancho de la columna de iconos para evitar que el icono de estrella se oculte
958c2f0ff jsx: corregidas advertencias de eslint.
3490f27f1 corregir página de calendario y hoja de tiempos
3685edd6c migrar a react 18 wip
dcfc7c1a9 Calendario antiguo movido a submenú, ScriptingTask*, JiraUtils

adc8434eb

Corregir diseño de página de calendario: aumentar el ancho de la columna de iconos para evitar que el icono de estrella se oculte 
adc8434eb9ac98a9caa8db1191036892d5ff116c
diff --git a/projectforge-webapp/src/containers/page/calendar/CalendarPage.jsx b/projectforge-webapp/src/containers/page/calendar/CalendarPage.jsx
index d8897f80b..0710ef8da 100644
--- a/projectforge-webapp/src/containers/page/calendar/CalendarPage.jsx
+++ b/projectforge-webapp/src/containers/page/calendar/CalendarPage.jsx
@@ -258,7 +258,7 @@ function CalendarPage() {
                     <div className="calendar-filter">
                         <form>
                             <Row>
-                                <Col sm="9" md="10" xl="11">
+                                <Col sm="9" md="10" xl="10">
                                     {options && (
                                         <Select
                                             closeMenuOnSelect={false}
@@ -279,7 +279,7 @@ function CalendarPage() {
                                         />
                                     )}
                                 </Col>
-                                <Col sm="3" md="2" xl="1" className="d-flex justify-content-end">
+                                <Col sm="3" md="2" xl="2" className="d-flex justify-content-end">
                                     <FavoritesPanel
                                         onFavoriteCreate={onFavoriteCreate}
                                         onFavoriteDelete={onFavoriteDelete}

958c2f0ff

jsx: corregidas advertencias de eslint. 
958c2f0ffdbafd65326fe7baa539a54fb8f2f4fb
diff --git a/projectforge-webapp/src/containers/page/calendar/CalendarPage.jsx b/projectforge-webapp/src/containers/page/calendar/CalendarPage.jsx
index ab17fe5fe..d8897f80b 100644
--- a/projectforge-webapp/src/containers/page/calendar/CalendarPage.jsx
+++ b/projectforge-webapp/src/containers/page/calendar/CalendarPage.jsx
@@ -1,4 +1,3 @@
-import PropTypes from 'prop-types';
 import React, { useEffect, useState } from 'react';
 import Select from 'react-select';
 import { Col, Container, Row } from '../../../components/design';
@@ -214,7 +213,7 @@ function CalendarPage() {
         fetchJsonGet(
             'calendar/refresh',
             undefined,
-            (json) => {
+            () => {
                 // const { reload } = json;
                 // if (reload) {
                 // Forzar recarga de página independientemente de la actualización de calendarios suscritos:

3490f27f1

corregir página de calendario y hoja de tiempos 
3490f27f105c220263fa22ff716d907beb75c5a5
diff --git a/projectforge-webapp/src/containers/page/calendar/CalendarPage.jsx b/projectforge-webapp/src/containers/page/calendar/CalendarPage.jsx
index 831683209..ab17fe5fe 100644
--- a/projectforge-webapp/src/containers/page/calendar/CalendarPage.jsx
+++ b/projectforge-webapp/src/containers/page/calendar/CalendarPage.jsx
@@ -12,7 +12,7 @@ import FavoritesPanel from '../../panel/favorite/FavoritesPanel';
 import customStyles from './Calendar.module';
 import { CalendarContext, defaultValues as calendarContextDefaultValues } from './CalendarContext';
 
-function CalendarPage({ match, location }) {
+function CalendarPage() {
     const [loading, setLoading] = useState(true);
     const [translations, setTranslations] = useState(undefined);
     const queryParams = new URLSearchParams(window.location.search);
@@ -338,8 +338,6 @@ function CalendarPage({ match, location }) {
                             showBreaks={state.filter.showBreaks}
                             topHeight="250px"
                             translations={translations}
-                            match={match}
-                            location={location}
                             vacationGroups={state.vacationGroups}
                             vacationUsers={state.vacationUsers}
                         />
@@ -351,8 +349,6 @@ function CalendarPage({ match, location }) {
 }
 
 CalendarPage.propTypes = {
-    match: PropTypes.shape({}).isRequired,
-    location: PropTypes.shape({}).isRequired,
 };
 
 export default CalendarPage;

3685edd6c

migrar a react 18 wip 
3685edd6c9f0dfd4582dbeb01c05491c254ccb84
diff --git a/projectforge-webapp/src/containers/page/calendar/CalendarPage.jsx b/projectforge-webapp/src/containers/page/calendar/CalendarPage.jsx
index 020ea786a..831683209 100644
--- a/projectforge-webapp/src/containers/page/calendar/CalendarPage.jsx
+++ b/projectforge-webapp/src/containers/page/calendar/CalendarPage.jsx
@@ -355,6 +355,4 @@ CalendarPage.propTypes = {
     location: PropTypes.shape({}).isRequired,
 };
 
-CalendarPage.defaultProps = {};
-
 export default CalendarPage;

dcfc7c1a9

Calendario antiguo movido a submenú, ScriptingTask*, JiraUtils 
dcfc7c1a9688ba47b2f53e91270dd97e00f6a030
diff --git a/projectforge-webapp/src/containers/page/calendar/CalendarPage.jsx b/projectforge-webapp/src/containers/page/calendar/CalendarPage.jsx
index 881010da5..020ea786a 100644
--- a/projectforge-webapp/src/containers/page/calendar/CalendarPage.jsx
+++ b/projectforge-webapp/src/containers/page/calendar/CalendarPage.jsx
@@ -217,7 +217,7 @@ function CalendarPage({ match, location }) {
             (json) => {
                 // const { reload } = json;
                 // if (reload) {
-                // Forzar recarga de página independientemente de la actualización de calendarios suscritos:
+                // Forzar recarga de página independientemente de la actualización de calendarios suscritos:
                 window.location.reload(false);
                 // }
                 setLoading(false);