diff --git a/web-ui/web-react/package-lock.json b/web-ui/web-react/package-lock.json index e9ff9cd3..6699ac1c 100644 --- a/web-ui/web-react/package-lock.json +++ b/web-ui/web-react/package-lock.json @@ -17,7 +17,8 @@ "@fullcalendar/interaction": "^5.7.2", "@fullcalendar/react": "^5.7.0", "@fullcalendar/timegrid": "^5.7.2", - "axios": "^0.19.0", + "axios": "^0.19.2", + "bootstrap": "^5.2.0", "chart.js": "3.3.2", "classnames": "^2.2.6", "cors": "^2.8.5", @@ -2288,6 +2289,16 @@ "node": ">= 6" } }, + "node_modules/@popperjs/core": { + "version": "2.11.6", + "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.6.tgz", + "integrity": "sha512-50/17A98tWUfQ176raKiOGXuYpLyyVMkxxG6oylzL3BPOlA6ADGdK7EYunSa4I064xerltq9TGXs8HmOk5E+vw==", + "peer": true, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/popperjs" + } + }, "node_modules/@svgr/babel-plugin-add-jsx-attribute": { "version": "4.2.0", "resolved": "https://registry.npmjs.org/@svgr/babel-plugin-add-jsx-attribute/-/babel-plugin-add-jsx-attribute-4.2.0.tgz", @@ -4210,6 +4221,24 @@ "resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz", "integrity": "sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==" }, + "node_modules/bootstrap": { + "version": "5.2.0", + "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.2.0.tgz", + "integrity": "sha512-qlnS9GL6YZE6Wnef46GxGv1UpGGzAwO0aPL1yOjzDIJpeApeMvqV24iL+pjr2kU4dduoBA9fINKWKgMToobx9A==", + "funding": [ + { + "type": "github", + "url": "https://github.com/sponsors/twbs" + }, + { + "type": "opencollective", + "url": "https://opencollective.com/bootstrap" + } + ], + "peerDependencies": { + "@popperjs/core": "^2.11.5" + } + }, "node_modules/brace-expansion": { "version": "1.1.11", "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", @@ -19688,6 +19717,12 @@ "resolved": "https://registry.npmjs.org/@nodelib/fs.stat/-/fs.stat-1.1.3.tgz", "integrity": "sha512-shAmDyaQC4H92APFoIaVDHCx5bStIocgvbwQyxPRrbUY20V1EYTbSDchWbuwlMG3V17cprZhA6+78JfB+3DTPw==" }, + "@popperjs/core": { + "version": "2.11.6", + "resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.11.6.tgz", + "integrity": "sha512-50/17A98tWUfQ176raKiOGXuYpLyyVMkxxG6oylzL3BPOlA6ADGdK7EYunSa4I064xerltq9TGXs8HmOk5E+vw==", + "peer": true + }, "@svgr/babel-plugin-add-jsx-attribute": { "version": "4.2.0", "resolved": "https://registry.npmjs.org/@svgr/babel-plugin-add-jsx-attribute/-/babel-plugin-add-jsx-attribute-4.2.0.tgz", @@ -21217,6 +21252,12 @@ "resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz", "integrity": "sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==" }, + "bootstrap": { + "version": "5.2.0", + "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.2.0.tgz", + "integrity": "sha512-qlnS9GL6YZE6Wnef46GxGv1UpGGzAwO0aPL1yOjzDIJpeApeMvqV24iL+pjr2kU4dduoBA9fINKWKgMToobx9A==", + "requires": {} + }, "brace-expansion": { "version": "1.1.11", "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", diff --git a/web-ui/web-react/package.json b/web-ui/web-react/package.json index 12dd1f1d..4cb7843c 100644 --- a/web-ui/web-react/package.json +++ b/web-ui/web-react/package.json @@ -17,7 +17,8 @@ "@fullcalendar/interaction": "^5.7.2", "@fullcalendar/react": "^5.7.0", "@fullcalendar/timegrid": "^5.7.2", - "axios": "^0.19.0", + "axios": "^0.19.2", + "bootstrap": "^5.2.0", "chart.js": "3.3.2", "classnames": "^2.2.6", "cors": "^2.8.5", diff --git a/web-ui/web-react/src/App.js b/web-ui/web-react/src/App.js index ef05324a..17674ed3 100644 --- a/web-ui/web-react/src/App.js +++ b/web-ui/web-react/src/App.js @@ -34,6 +34,8 @@ import GuardasSeguridad from './components/GuardasSeguridad'; import Communities from './components/ComunidadViviendas'; import Inquilinos from './components/Inquilinos'; import InquilinosCompletar from "./components/InquilinosCompletar.js"; +import RegistroComunicado from './components/RegistroComunicado'; +import "../node_modules/bootstrap/dist/css/bootstrap.min.css"; import Crud from './pages/Crud'; import EmptyPage from './pages/EmptyPage'; @@ -200,6 +202,9 @@ const App = () => { icon: PrimeIcons.BUILDING, to: '/areasComunes', }, + + { label: 'Comunicados', icon: PrimeIcons.COMMENTS, to: '/registroComunicado'}, + ] }, ] @@ -440,7 +445,6 @@ const App = () => { <> - ) @@ -465,6 +469,7 @@ const App = () => { + diff --git a/web-ui/web-react/src/components/RegistroComunicado.js b/web-ui/web-react/src/components/RegistroComunicado.js new file mode 100644 index 00000000..e2d756a9 --- /dev/null +++ b/web-ui/web-react/src/components/RegistroComunicado.js @@ -0,0 +1,165 @@ +import React, { useEffect, useState, useRef } from 'react'; +import { InputText } from 'primereact/inputtext'; +import { Button } from 'primereact/button'; +import { InputTextarea } from 'primereact/inputtextarea'; +import { useCookies } from "react-cookie"; +import { DataTable } from 'primereact/datatable'; +import { Column } from 'primereact/column'; +import { Toast } from 'primereact/toast'; +import { Dialog } from 'primereact/dialog'; +import { Toolbar } from 'primereact/toolbar'; +import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'; +import { faHome, faUserAlt } from '@fortawesome/free-solid-svg-icons'; +import { faCommentAlt } from '@fortawesome/free-solid-svg-icons'; +import { faPhoneAlt } from '@fortawesome/free-solid-svg-icons'; +import { faAt } from '@fortawesome/free-solid-svg-icons'; +import { faIdCardAlt } from '@fortawesome/free-solid-svg-icons'; +import { faEllipsis } from '@fortawesome/free-solid-svg-icons'; +import { faHomeAlt } from '@fortawesome/free-solid-svg-icons'; +import { Dropdown } from 'primereact/dropdown'; +import classNames from 'classnames'; +const RegistroComunicado = () => { + + let emptyComunicado = { + _id: null, + post: '', + user_id: '', + community_id: '' + }; + + useEffect(()=>{ + listaComunis(); + },[]) + + + const [comunicado, setComunicado] = useState(emptyComunicado); + const [comunicados,setComuicados]=useState([]); + const [comunicadoId, setComunicadoId] = useState(null); + const [submitted, setSubmitted] = useState(false); + const toast = useRef(null); + const dt = useRef(null); + const [cookies, setCookie] = useCookies(); + const [globalFilter, setGlobalFilter] = useState(null); + + async function listaComunis() { + let comunicadosA=await fetch('http://localhost:4000/post/allPosts', {method:'GET'}); + let comunicadosRes= await comunicadosA.json(); + setComuicados(comunicadosRes.message); + console.log(comunicadosRes.message); + } + + + const saveComunicado = () => { + var data = { + post: document.getElementById('txt_comunicado').value, + user_id: cookies.id, + community_id: cookies.community_id + }; + + fetch('http://localhost:4000/post/createPost', { + cache: 'no-cache', + method: 'POST', + body: JSON.stringify(data), + headers: { + 'Content-Type': 'application/json' + } + }) + .then( + function (response) { + if (response.status != 201) + console.log('Ocurrió un error con el servicio: ' + response.status); + else + return response.json(); + } + ) + .then( + function (response) { + + } + ) + .catch( + err => console.log('Ocurrió un error con el fetch', err) + ); + } + + const header = ( + + +
+
Comunicados de la comunidad
+ + + setGlobalFilter(e.target.value)} placeholder="Buscar..." /> + +
+ + ); + const headerPost = ( + <> +

+ {' '} + {' '} + Descripción comunicado

+ + ) + + const leftToolbarTemplate = () => { + return ( + +
+
+ + ) +} + +const rightToolbarTemplate = () => { + return ( + +