101 lines
4.7 KiB
JavaScript
101 lines
4.7 KiB
JavaScript
import React, { Suspense, useEffect, useState, useRef } from 'react';
|
|
import { Meteor } from 'meteor/meteor';
|
|
import { BrowserRouter, Routes, Route, Link } from 'react-router-dom';
|
|
import { Login } from './Login';
|
|
import { useUserId } from 'meteor/react-meteor-accounts';
|
|
import { PoblesCollection } from '/imports/api/pobles.js';
|
|
import { useSubscribe, useTracker, useFind } from 'meteor/react-meteor-data/suspense';
|
|
|
|
|
|
const Pobles = () => {
|
|
|
|
const [pobleSeleccionat, setPobleSeleccionat] = useState(null);
|
|
useSubscribe('pobles');
|
|
const pobles = useTracker("pobles", () => PoblesCollection.find().fetchAsync());
|
|
|
|
const QuadreInfo_Poble = () => {
|
|
|
|
return <>
|
|
<h1>{pobleSeleccionat._id}</h1>
|
|
<form action={d => {
|
|
try {
|
|
Meteor.callAsync('editaOAfigPoble',
|
|
{
|
|
createdAt: new Date(),
|
|
nomPoble: d.get('nomPoble'),
|
|
cp: d.get('cp') || "",
|
|
comarca: d.get('comarca') || "",
|
|
}, pobleSeleccionat
|
|
).catch(err => console.error(err));
|
|
} catch (err) {
|
|
alert(err);
|
|
console.error(err);
|
|
}
|
|
}}>
|
|
<label htmlFor="nomPoble">Població: </label><input name="nomPoble" type="text" defaultValue={pobleSeleccionat.nomPoble}/><br />
|
|
<label htmlFor="comarca">Comarca: </label><input name="comarca" type="text" /><br />
|
|
<label htmlFor="cp">Codi Postal: </label><input name="cp" type="text" /><br />
|
|
<input type='submit' value="Crear la Població" />
|
|
</form></>;
|
|
};
|
|
|
|
return <Suspense fallback={<>Carregant...</>} >
|
|
{pobleSeleccionat && <QuadreInfo_Poble />}
|
|
|
|
<ul>{
|
|
pobles
|
|
.sort((a,b) => a.nomPoble.toLowerCase() > b.nomPoble.toLowerCase())
|
|
.map(pob => <li key={`pob_${pob._id}`}>{pob.nomPoble}<button onClick={() => {setPobleSeleccionat(pob)}}>Edita</button><button>×</button></li>)
|
|
}</ul>
|
|
</Suspense>;
|
|
};
|
|
|
|
const Loguejat = () => {
|
|
|
|
const userId = useUserId();
|
|
|
|
return userId ? <div>
|
|
|
|
<Link to="/pobles" >Pobles</Link>
|
|
|
|
<button onClick={() => Meteor.logout()} >Logout</button>
|
|
|
|
<p>- poble (que cada poble només tinga accés a lo del seu poble, la resta de pobles no els han de poder tocar): Alaquàs / Albal / Aldaia / Alfafar / Algemesí / Alginet / Alcàsser / Benetússer / Beniparrell / Carlet / Catarroja / Dosaigües / Godelleta / Guadassuar / Iàtova / L'Alcúdia / Llocnou de la Corona / Massanassa / Paiporta / Parke Alkosa / Picanya / Sedaví / Setaigües / Utiel / València-Castellar Oliveral / València-Forn d'Alcedo / València-La Torre / Xest / Xiva / Llombai / Tremolar </p>
|
|
<p>- estat: impossible de trobar / disponible / pendent / enviada / ha arribat (que cada poble puga tocar aquestes opcions dels subministres per al seu poble)</p>
|
|
<p>- tipus de subministre: maquinària / menjar i beguda / productes infantils / higiene i neteja / sanitari / roba i calçat / ferramentes / necessitats especials / EPIs / electrònica / per a animals / roba de llit, mantes, cortines i mantells / vaixella i utensilis de cuina / papereria i material escolar / mobiliari i electrodomèstics /altres</p>
|
|
<p>- necessitat (que la plataforma et dóne un desplegable amb totes les necessitats que s'han demanat fins ara en eixa categoria i pugues buscar, però també afegir-ne coses noves) - que la plataforma demane en aquest punt que siguen tant específiques com puguen (que no em fiquen com a necessitat "mobles" sinó per exemple "rentadora")</p>
|
|
|
|
<p>- NOMÉS EN CAS DE MOBILIARI I ELECTRODOMÈSTICS:
|
|
---- adreça de la casa o lloc on s'ha de dur (tenda, casa, baix...)
|
|
---- que afegisquen dies i horaris en què estaran a eixa adreça
|
|
---- especificar que el contacte que afegisquen ha de ser necessàriament de la persona que ho va a rebre en la casa o espai
|
|
</p>
|
|
|
|
- que la plataforma recullga la data en la que es fa una petició de subministres
|
|
|
|
- que la plataforma recullga la data en la que el subministre es canvia a l'estat "ha arribat)
|
|
|
|
- Nom del contacte
|
|
|
|
- Telèfon de contacte
|
|
|
|
- Punt de descàrrega
|
|
|
|
I després amb opció de visualitzar totes les necessitats que s'han incorporat prèviament al teu poble i assenyalar "ha arribat" en les que ja no necessites
|
|
|
|
Nosaltres hauríem de tindre opció de filtrar les necessitats per pobles i condicions (per poder vore, per exemple, totes les necessitats pendents de tots els pobles, o només les necessitats pendents d'Alaquàs)
|
|
</div>
|
|
: <Link to="/login">Login</Link>
|
|
;
|
|
};
|
|
|
|
export const App = () => (
|
|
<BrowserRouter>
|
|
<Routes>
|
|
<Route path="/" element={ <Loguejat /> } />
|
|
<Route path="/pobles" element={ <Pobles /> } />
|
|
<Route path="/login" element={ <Login /> } />
|
|
</Routes>
|
|
</BrowserRouter>
|
|
);
|