Commit 5d1be0ac authored by Diego Correa's avatar Diego Correa
Browse files

Merge branch pueblosmagicosconia:main into main

parents fa4b18cb 58e31751
Loading
Loading
Loading
Loading
+53 −2
Original line number Diff line number Diff line
import { faWindowClose } from "@fortawesome/free-solid-svg-icons";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { Dispatch, SetStateAction} from "react";
import { Dispatch, SetStateAction, useState} from "react";
import "./assets/css/styles.css";
import { MapComponent } from "../../map/map";
import { usePlace } from "../../../hooks/usePlace";
@@ -8,14 +8,16 @@ import { languaguesList } from "../../../constants/languages";
import { LoadingScreen } from "../../loading_screen/loading_screen";
import { MultipleImagesDropzone } from "../../multiple_images_dropzone/multiple_images_dropzone";
import { AvailableDays, availableDaysList } from "../../../infraestructure/entities/place";
import { Category } from "../../../infraestructure/entities/category";

interface props {
  setIsWindowActive: Dispatch<SetStateAction<boolean>>;
  categoriesList: Category[];
  idTown: number;
  forceRenderList: () => void;
}

export const AdminPanelPlaceRegister = ({setIsWindowActive, idTown, forceRenderList}: props) => {
export const AdminPanelPlaceRegister = ({setIsWindowActive, idTown, categoriesList, forceRenderList}: props) => {
  const {
    register,
    handleSubmit,
@@ -31,7 +33,33 @@ export const AdminPanelPlaceRegister = ({setIsWindowActive, idTown, forceRenderL
    availableDays,
    setAvailableDays,
    resetField,
    categoriesId,
    setCategoriesId,
  } = usePlace(idTown, forceRenderList, setIsWindowActive);
  const [clickedCategories, setClickedCategories] = useState<boolean[]>(new Array(categoriesList.length).fill(false));

  const onClickCategory = (idCategory: number, indexList: number) => {
    const index = categoriesId.indexOf(idCategory);
    const clickedCategoriesBackup = clickedCategories.map((clickedCategory, index)=> {
      if(index === indexList){
        return !clickedCategory;
      }else{ 
        return clickedCategory;
      }
    })
    if(index > -1){
      setCategoriesId(
        categoriesId.filter(cat => cat !== idCategory)
      );
    }else{
      setCategoriesId(
        [...categoriesId,
          idCategory
        ]
      )
    }
    setClickedCategories(clickedCategoriesBackup);
  }

  return (
    <div className="place_register_wrap">
@@ -164,6 +192,29 @@ export const AdminPanelPlaceRegister = ({setIsWindowActive, idTown, forceRenderL
                <p className="error">{errors.available?.message || errors.startDate?.message || errors.endDate?.message}</p>
              </div>
              
              <div className="input">
                <div className="input_header">
                  Categorías
                </div>
                <div className="categories_cnt">
                  <div className="categories_grid">
                    {
                      categoriesList.map((category, index) => {
                        return (
                          <div className="category_item" 
                            onClick={() => onClickCategory(category.idCategory, index)} 
                            style={clickedCategories[index] ? {border: '2px solid blue'} : {border: '1px solid black'}}
                            >
                              {category.nameES}
                          </div>
                        );
                      })
                    }
                  </div>
                </div>
                <p className="error">{errors.categoriesId?.message}</p>
              </div>

              <MultipleImagesDropzone setValue={setValue}/>
              <p className="error">{errors.imagesList?.message}</p>
              <input type="submit"/>
+24 −0
Original line number Diff line number Diff line
@@ -133,3 +133,27 @@
  justify-content: center;
  align-items: center;
}

.categories_cnt {
  display: flex;
  border: solid 1px black;
  height: 80px;
}

.categories_grid {
  height: 100%;
  overflow-x: auto;
  display: grid;
  grid-auto-flow: column;
  grid-template-rows: auto auto;
}

.category_item{
  display: flex;
  justify-content: center;
  align-items: center;
  width: auto;
  padding: 0 10px 0 10px;
  margin: 4px;
  cursor: pointer;
}
 No newline at end of file
+15 −1
Original line number Diff line number Diff line
import { Dispatch, SetStateAction, useState } from "react";
import { Dispatch, SetStateAction, useEffect, 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";
import { useCategory } from "../../../hooks/useCategory";
import { LoadingScreen } from "../../loading_screen/loading_screen";

interface props {
  isWindowActive: boolean;
@@ -12,11 +14,22 @@ interface props {

export const AdminPanelPlaceScreen = ({isWindowActive,setIsWindowActive, town}: props) => {
  const [renderCount, setRenderCount] = useState(0);
  const {
    categoriesList,
    updateCategoriesList,
    pending
  } = useCategory();

  const forceRenderList = () =>{
    setRenderCount(prevCount => prevCount + 1);
  }

  useEffect(()=>{
    updateCategoriesList();
  },[]);

  if(pending) return <LoadingScreen/>

  return (
    <div className="admin_panel_place_content">
      <div className="panel_place_header">
@@ -33,6 +46,7 @@ export const AdminPanelPlaceScreen = ({isWindowActive,setIsWindowActive, town}:
          isWindowActive && <AdminPanelPlaceRegister 
            setIsWindowActive={setIsWindowActive} 
            idTown={town?.idTown || -1}
            categoriesList={categoriesList}
            forceRenderList={forceRenderList}
            />
        }
+5 −0
Original line number Diff line number Diff line
@@ -31,6 +31,11 @@
  width: 50%;
}

.town_image_cnt img{
  max-height: 100%;
  max-width: 100%;
}

.info_fields_cnt{
  width: 50%;
  height: 100%;
+35 −0
Original line number Diff line number Diff line
.confirmation_dialog_wrap{
  position: absolute;
  z-index: 99;
  left: 0;
  right: 0;
  margin: auto;
  width: 25vw;
  display: flex;
  flex-direction: column;
  background: white;
  border: solid 2px black;
}

.confirmation_dialog_wrap .header{
  background: #ccc;
}

.confirmation_dialog_wrap .body{
  display: flex;
  flex-direction: column;
  width: 100%;
  align-items: center;
  justify-content: center;
}

.confirmation_dialog_wrap .buttons{
  display: flex;
  justify-content: center;
  align-items: center;
}

.confirmation_dialog_wrap .buttons button{
  margin: 5px;
  width: 60px;
}
Loading