diff --git a/.gitignore b/.gitignore index 5b22b60ca37013558d0d61488d70acfd8f08658a..7782e247adf6d07488035cd2c6d34d7cb396da0a 100644 --- a/.gitignore +++ b/.gitignore @@ -7,3 +7,4 @@ /mobile/src/common/constants/api.ts /mobile/%ProgramData%/Microsoft/Windows/UUS/State/_active.uusver /mobile/assets/audio_prueba.mp3 +.vscode/settings.json diff --git a/web/src/components/admin_panel_navbar/admin_navbar.tsx b/web/src/components/admin_panel_navbar/admin_navbar.tsx index 19af893ca40a6f04e77d4b45729e68fe8c47f8b4..0dad5f8dbd657ebcaec7c86f7a9424a6e604ed4f 100644 --- a/web/src/components/admin_panel_navbar/admin_navbar.tsx +++ b/web/src/components/admin_panel_navbar/admin_navbar.tsx @@ -3,14 +3,14 @@ import { faSignOut, faUser } from "@fortawesome/free-solid-svg-icons"; import { Link } from "react-router-dom"; import './assets/styles/style.css'; import { UserRole } from "../../constants/roles"; -import { useAdminNavbar } from "../../hooks/useAdminNavbar"; +import { useUserData } from "../../hooks/useUserData"; interface props{ windowActive: boolean; } export const AdminPanelNavBar = ({windowActive}:props) => { - const {user, handleLogout, setToggle, toggle, userData} = useAdminNavbar(); + const {user, handleLogout, setToggle, toggle, userData} = useUserData(); if(!user ){ return null; diff --git a/web/src/components/admin_panel_places/admin_panel_place_list/admin_panel_place_list.tsx b/web/src/components/admin_panel_places/admin_panel_place_list/admin_panel_place_list.tsx new file mode 100644 index 0000000000000000000000000000000000000000..d56168fc45c7b6d87ec2ad98389b3a79103f040c --- /dev/null +++ b/web/src/components/admin_panel_places/admin_panel_place_list/admin_panel_place_list.tsx @@ -0,0 +1,42 @@ +import DataTable, { TableColumn } from 'react-data-table-component'; +import { usePlace } from '../../../hooks/usePlace'; +import './assets/css/styles.css'; +import { Place } from '../../../infraestructure/entities/place'; +import { LoadingSpinner } from '../../loading_spinner/loading_spinner'; + +interface props{ + idTown: number; +} + +export const AdminPanelPlaceList = ({idTown}: props) => { + const { + placeList, + pending + } = usePlace(idTown); + + const columns : TableColumn[] = [ + { + name: "Identificador", + selector: row => row.idPlace || 0 + }, + { + name: "Nombre", + selector: row => row.name, + sortable: true + }, + { + name: "Estado", + selector: row => row.available + } + ]; + + return ( +
+ + } + columns={columns} data={placeList} selectableRows className="data_table"/> +
+ ); +} \ No newline at end of file diff --git a/web/src/components/sa_panel_town/sa_panel_town_list/sa_panel_town_list_element/assets/css/styles.css b/web/src/components/admin_panel_places/admin_panel_place_list/assets/css/styles.css similarity index 62% rename from web/src/components/sa_panel_town/sa_panel_town_list/sa_panel_town_list_element/assets/css/styles.css rename to web/src/components/admin_panel_places/admin_panel_place_list/assets/css/styles.css index 7e61c5a7d08f09bd611de1ee4530948d2056ab20..8533e5ab582e3154f84aa3919f6bcc79e70774c7 100644 --- a/web/src/components/sa_panel_town/sa_panel_town_list/sa_panel_town_list_element/assets/css/styles.css +++ b/web/src/components/admin_panel_places/admin_panel_place_list/assets/css/styles.css @@ -1,4 +1,10 @@ -.town_list_table { +.place_list_cnt{ + display: flex; + height: 100%; + width: 100%; +} + +.data_table{ height: 100%; } diff --git a/web/src/components/admin_panel_places/admin_panel_place_register/admin_panel_place_register.tsx b/web/src/components/admin_panel_places/admin_panel_place_register/admin_panel_place_register.tsx index cbfda67fb9a980554781a3e396ee0c57504845b6..dc04cd17f0009a36c2031c5096ccc554d5ecc188 100644 --- a/web/src/components/admin_panel_places/admin_panel_place_register/admin_panel_place_register.tsx +++ b/web/src/components/admin_panel_places/admin_panel_place_register/admin_panel_place_register.tsx @@ -3,18 +3,19 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { Dispatch, SetStateAction} from "react"; import "./assets/css/styles.css"; import { MapComponent } from "../../map/map"; -import { usePlaceRegister } from "../../../hooks/usePlaceRegister"; +import { usePlace } from "../../../hooks/usePlace"; import { languaguesList } from "../../../constants/languages"; -import { ToastContainer, toast } from "react-toastify"; import { LoadingScreen } from "../../loading_screen/loading_screen"; import { MultipleImagesDropzone } from "../../multiple_images_dropzone/multiple_images_dropzone"; import { AvailableDays, availableDaysList } from "../../../infraestructure/entities/place"; interface props { setIsWindowActive: Dispatch>; + idTown: number; + forceRenderList: () => void; } -export const AdminPanelPlaceRegister = ({setIsWindowActive}: props) => { +export const AdminPanelPlaceRegister = ({setIsWindowActive, idTown, forceRenderList}: props) => { const { register, handleSubmit, @@ -26,14 +27,11 @@ export const AdminPanelPlaceRegister = ({setIsWindowActive}: props) => { setDescriptions, setLanguageDescriptionIndexSelected, isLoading, - statesList, - updateTownsList, - townsList, updateTimeForm, availableDays, setAvailableDays, resetField, - } = usePlaceRegister(); + } = usePlace(idTown, forceRenderList, setIsWindowActive); return (
@@ -165,54 +163,7 @@ export const AdminPanelPlaceRegister = ({setIsWindowActive}: props) => {

{errors.available?.message || errors.startDate?.message || errors.endDate?.message}

- -
-
- Pueblo mágico al que pertenece el lugar -
-
-
- Estado - -
-
- Pueblo mágico - -
-
-

{errors.idTown?.message}

-
- +

{errors.imagesList?.message}

@@ -227,14 +178,6 @@ export const AdminPanelPlaceRegister = ({setIsWindowActive}: props) => {

{errors.latitude?.message}

- diff --git a/web/src/components/admin_panel_places/admin_panel_place_register/assets/css/styles.css b/web/src/components/admin_panel_places/admin_panel_place_register/assets/css/styles.css index c0057a5ea8746ac93e8fe6e1b7249de51335f91c..4f0b19f39d268b1e3b12ac86c432bca9e36d7ea6 100644 --- a/web/src/components/admin_panel_places/admin_panel_place_register/assets/css/styles.css +++ b/web/src/components/admin_panel_places/admin_panel_place_register/assets/css/styles.css @@ -4,6 +4,7 @@ .place_register_wrap{ position: absolute; + z-index: 99; left: 0; right: 0; top: 0; diff --git a/web/src/components/admin_panel_places/admin_panel_place_screen/admin_panel_place_screen.tsx b/web/src/components/admin_panel_places/admin_panel_place_screen/admin_panel_place_screen.tsx index f082ae26f6d77d9ce32b86b94299f8cdc0c11c9f..621f47a33e6e74eb6735c81e5b1a47dab51d7289 100644 --- a/web/src/components/admin_panel_places/admin_panel_place_screen/admin_panel_place_screen.tsx +++ b/web/src/components/admin_panel_places/admin_panel_place_screen/admin_panel_place_screen.tsx @@ -1,21 +1,28 @@ -import { Dispatch, SetStateAction } from "react"; +import { Dispatch, SetStateAction, useState } from "react"; import { AdminPanelPlaceRegister } from "../admin_panel_place_register/admin_panel_place_register"; import "./assets/css/styles.css"; +import { AdminPanelPlaceList } from "../admin_panel_place_list/admin_panel_place_list"; +import { Town } from "../../../infraestructure/entities/town"; interface props { isWindowActive: boolean; setIsWindowActive: Dispatch>; + town: Town | undefined; } -export const AdminPanelPlaceScreen = ({isWindowActive,setIsWindowActive}: props) => { - +export const AdminPanelPlaceScreen = ({isWindowActive,setIsWindowActive, town}: props) => { + const [renderCount, setRenderCount] = useState(0); + + const forceRenderList = () =>{ + setRenderCount(prevCount => prevCount + 1); + } return (
Administrar lugares dentro de Pueblo Mágico
{ - isWindowActive && + isWindowActive && } +
); diff --git a/web/src/components/admin_town_info/admin_town_info.tsx b/web/src/components/admin_town_info/admin_town_info.tsx new file mode 100644 index 0000000000000000000000000000000000000000..ed28ca8884e20e0929d6ccf20845222a064d3840 --- /dev/null +++ b/web/src/components/admin_town_info/admin_town_info.tsx @@ -0,0 +1,113 @@ +import { Dispatch, SetStateAction} from "react"; +import { Town } from "../../infraestructure/entities/town"; +import "./assets/css/styles.css"; +import { faEdit, faLanguage } from "@fortawesome/free-solid-svg-icons"; +import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; +import { LoadingScreen } from "../loading_screen/loading_screen"; +import { useAdminTownInfo } from "../../hooks/useAdminTownInfo"; +import { SuperadminPanelTownRegister } from "../sa_panel_town/sa_panel_town_register/sa_panel_town_register"; + +interface props { + isWindowActive: boolean; + setIsWindowActive: Dispatch>; + town: Town | undefined; + updateTown: () => Promise; +} + +export const AdminTownInfo = ({updateTown, isWindowActive, setIsWindowActive, town}: props) => { + const { + isEnglish, + isLoading, + setIsEnglish, + setIsLoading, + renderCount, + forceRenderList, + statesList + } = useAdminTownInfo(updateTown); + + if(!town){ + return ( +
+ No tienes un pueblo asignado +
+ ); + } + + return ( +
+ {isWindowActive && + + } +
+ {isLoading && +
+ +
+ } + +
+

{town?.name}

+
+
+
+ setIsLoading(false)}/> +
+
+
+
+ + + { + if(!isWindowActive){ + setIsEnglish(!isEnglish); + } + } + } + /> +
+ { + if(!isWindowActive){ + setIsWindowActive(true); + } + } + } + /> +
+ { + isEnglish ? +