V. 0.7.0 - Integração do mapa com a procura rápida. Não está localizando com a seleção ainda.

José Maria Villac Pinheiro
1 parent 594fec5f
Showing 9 changed files with 36 additions and 42 deletions Show diff stats
client/package-lock.json
client/package.json
client/public/index.html
client/src/App.js
client/src/components/map.js
package.json
public/stylesheets/style.css
views/index.jade
views/map.jade
 {
   "name": "client",
-  "version": "0.1.0",
+  "version": "0.6.2",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
@@ -8889,6 +8889,11 @@
       "resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-4.0.0.tgz",
       "integrity": "sha512-FlsPxavEyMuR6TjVbSSywovXSEyOg6ZDj5+Z8nbsRl9EkOzAhEIcS+GLoQDC5fz/t9suhUXWmUrOBrgeUvrMxw=="
     },
+    "react-iframe": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/react-iframe/-/react-iframe-1.2.0.tgz",
+      "integrity": "sha512-xd7zHdVu6Pe3ijQNkT8PvLfGRQEY/CuKvjMhVC+OLSoXL1mkBA300hen5vm56yNdaUt3AspVclXda1IO7ooMhg=="
+    },
     "react-input-autosize": {
       "version": "2.2.1",
       "resolved": "https://registry.npmjs.org/react-input-autosize/-/react-input-autosize-2.2.1.tgz",
 {
   "name": "client",
-  "version": "0.6.2",
+  "version": "0.7.0",
   "private": true,
   "proxy": {
     "/map": {
@@ -30,12 +30,13 @@
   },
   "dependencies": {
     "ajv": "^6.5.0",
+    "axios": "0.17.1",
     "faker": "^4.1.0",
     "react": "^16.4.0",
     "react-dom": "^16.4.0",
+    "react-iframe": "^1.2.0",
     "react-scripts": "1.1.4",
     "react-select": "1.1.0",
-    "axios": "0.17.1",
     "util": "^0.10.3"
   },
   "scripts": {
@@ -19,7 +19,7 @@
       work correctly both with client-side routing and a non-root public URL.
       Learn how to configure a non-root public URL by running `npm run build`.
     -->
-    <title>NEXUS Título</title>
+    <title>NEXUS</title>
   </head>
   <body>
     <noscript>
 import React, { Component } from "react";
-import logo from "./logo.svg";
 import "./App.css";
 import FindConsumer from "./components/findConsumer";
+import Map from "./components/map";
 class App extends Component {
   render() {
     return (
       <div className="App">
-        <header className="App-header">
-          <img src={logo} className="App-logo" alt="logo" />
-          <h1 className="App-title">NEXUS Início da aplicação</h1>
-        </header>
-        <p className="App-intro">
-          Digite o nome ou número de ligação de água abaixo
-        </p>
-        <p />
-
         <div>
           <FindConsumer />
         </div>
-        <p />
-        <p> Selecione aqui o link desejado 2: </p>
-        <a href="/auth/google">Selecione aqui para logar</a>
-        <p />
-        <a href="/map/paulo">Selecione aqui para acessar o mapa</a>
-        <p />
-        <a href="/api/current_user">
-          Selecione aqui para saber o usuário logado
-        </a>
-        <p />
-        <a href="/api/logout">Selecione aqui para fazer logout</a>
-        <p />
-        <a href="/consumidores">Mostra todos consumidores de água</a>
+        <div>
+          <Map />
+        </div>
       </div>
     );
   }
@@ -0,0 +1,20 @@
+import React, { Component } from 'react';
+import Iframe from 'react-iframe';
+import 'react-select/dist/react-select.css';
+
+export default class Map extends Component<*, State> {
+	constructor(props) {
+		super(props);
+		this.state = {
+		};
+
+	}
+
+	render() {
+		return (
+			<div>
+				<Iframe url="/map/pedro" position="absolute" width="100%" height="95%" id="mapId" allowFullScreen />
+			</div>
+		);
+	}
+}
 {
   "name": "GeoSanWeb",
-  "version": "0.6.2",
+  "version": "0.7.0",
   "description": "Map application for water companies",
   "repository": "git@bitbucket.org:nexusbr/geosanweb.git",
   "private": true,
@@ -19,7 +19,7 @@ html, body {
   height: auto;
 }
 #map {
-  height: 85%;
+  height: 100%;
 }
 body {
   margin:0;
 extends layout
-
 block content
   h1= title
   p Selecione aqui o link desejado 5000:
 extends layout
 block content
-    br
-    .container
-        .row
-            .col.col-lg-3
-                | #{consumidor}
-            .col.col-lg-2
-                input.form-control(type='text', id="nome", placeholder='Digite o nome')
-            .col.col-lg-1
-                input.btn.btn-primary(type='button', value='Procura', onclick=' relocate_home()')
-    
     script.
         function relocate_home()
         {
         location.href = "/map/" + nome.value;
         }
-    br
     #map
-
     script(type='text/javascript').
         var osmUrl = 'http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
             southWest = L.latLng(#{bndSW}),
	@@ -19,7 +19,7 @@		@@ -19,7 +19,7 @@
19	work correctly both with client-side routing and a non-root public URL.	19	work correctly both with client-side routing and a non-root public URL.
20	Learn how to configure a non-root public URL by running `npm run build`.	20	Learn how to configure a non-root public URL by running `npm run build`.
21	-->	21	-->
22	- <title>NEXUS Título</title>	22	+ <title>NEXUS</title>
23	</head>	23	</head>
24	<body>	24	<body>
25	<noscript>	25	<noscript>
1	import React, { Component } from "react";	1	import React, { Component } from "react";
2	-import logo from "./logo.svg";
3	import "./App.css";	2	import "./App.css";
4	import FindConsumer from "./components/findConsumer";	3	import FindConsumer from "./components/findConsumer";
		4	+import Map from "./components/map";
5		5
6	class App extends Component {	6	class App extends Component {
7	render() {	7	render() {
8	return (	8	return (
9	<div className="App">	9	<div className="App">
10	- <header className="App-header">
11	- <img src={logo} className="App-logo" alt="logo" />
12	- <h1 className="App-title">NEXUS Início da aplicação</h1>
13	- </header>
14	- <p className="App-intro">
15	- Digite o nome ou número de ligação de água abaixo
16	- </p>
17	- <p />
18	-
19	<div>	10	<div>
20	<FindConsumer />	11	<FindConsumer />
21	</div>	12	</div>
22	- <p />
23	- <p> Selecione aqui o link desejado 2: </p>
24	- <a href="/auth/google">Selecione aqui para logar</a>
25	- <p />
26	- <a href="/map/paulo">Selecione aqui para acessar o mapa</a>
27	- <p />
28	- <a href="/api/current_user">
29	- Selecione aqui para saber o usuário logado
30	- </a>
31	- <p />
32	- <a href="/api/logout">Selecione aqui para fazer logout</a>
33	- <p />
34	- <a href="/consumidores">Mostra todos consumidores de água</a>	13	+ <div>
		14	+ <Map />
		15	+ </div>
35	</div>	16	</div>
36	);	17	);
37	}	18	}
@@ -0,0 +1,20 @@		@@ -0,0 +1,20 @@
	1	+import React, { Component } from 'react';
	2	+import Iframe from 'react-iframe';
	3	+import 'react-select/dist/react-select.css';
	4	+
	5	+export default class Map extends Component<*, State> {
	6	+ constructor(props) {
	7	+ super(props);
	8	+ this.state = {
	9	+ };
	10	+
	11	+ }
	12	+
	13	+ render() {
	14	+ return (
	15	+ <div>
	16	+ <Iframe url="/map/pedro" position="absolute" width="100%" height="95%" id="mapId" allowFullScreen />
	17	+ </div>
	18	+ );
	19	+ }
	20	+}
1	{	1	{
2	"name": "GeoSanWeb",	2	"name": "GeoSanWeb",
3	- "version": "0.6.2",	3	+ "version": "0.7.0",
4	"description": "Map application for water companies",	4	"description": "Map application for water companies",
5	"repository": "git@bitbucket.org:nexusbr/geosanweb.git",	5	"repository": "git@bitbucket.org:nexusbr/geosanweb.git",
6	"private": true,	6	"private": true,
	@@ -19,7 +19,7 @@ html, body {		@@ -19,7 +19,7 @@ html, body {
19	height: auto;	19	height: auto;
20	}	20	}
21	#map {	21	#map {
22	- height: 85%;	22	+ height: 100%;
23	}	23	}
24	body {	24	body {
25	margin:0;	25	margin:0;
1	extends layout	1	extends layout
2	-
3	block content	2	block content
4	h1= title	3	h1= title
5	p Selecione aqui o link desejado 5000:	4	p Selecione aqui o link desejado 5000: