diff options
Diffstat (limited to 'front/odiparpack/app/containers')
4 files changed, 132 insertions, 1 deletions
diff --git a/front/odiparpack/app/containers/App/Application.js b/front/odiparpack/app/containers/App/Application.js index 6ab9d34..685228d 100644 --- a/front/odiparpack/app/containers/App/Application.js +++ b/front/odiparpack/app/containers/App/Application.js @@ -29,7 +29,8 @@ import { Pedidos, Almacenes, Camiones, - Tramos + Tramos, + Simulacion7Dias } from '../pageListAsync'; function Application(props) { @@ -41,6 +42,7 @@ function Application(props) { <Route exact path="/app" component={DashboardV1} /> <Route exact path="/app/dashboard-v2" component={DashboardV2} /> {/* OdiparPack */} + <Route exact path="/app/simulacion" component={Simulacion7Dias}/> <Route exact path="/app/pedidos" component={Pedidos}/> <Route exact path="/app/almacenes" component={Almacenes}/> <Route exact path="/app/camiones" component={Camiones}/> diff --git a/front/odiparpack/app/containers/Odipar/Simulacion/Simulacion7Dias.js b/front/odiparpack/app/containers/Odipar/Simulacion/Simulacion7Dias.js new file mode 100644 index 0000000..eff6d5d --- /dev/null +++ b/front/odiparpack/app/containers/Odipar/Simulacion/Simulacion7Dias.js @@ -0,0 +1,81 @@ +import React, { Component } from "react"; +import { withStyles } from '@material-ui/core/styles'; +import {getX, getY} from './utilCoords' +import { Icon } from "@material-ui/core"; +import { TransformWrapper, TransformComponent } from "react-zoom-pan-pinch"; +import { mapaH, mapaW } from "odi-utils/constants" + +const styles = ({ + root: { + flexGrow: 1, + marginTop: 30, + } + }); + + +class Simulacion7Dias extends Component { + almacenes = [ + { + ubigeo: '150101', + provincia: 'LIMA', + latitud:-12.04591952, + longitud: -77.03049615, + region: 'Costa', + esPrincipal: 1 + },{ + ubigeo: '130101', + provincia: 'TRUJILLO', + latitud: -8.11176389, + longitud: -79.02868652, + region: 'Costa', + esPrincipal: 1 + },{ + ubigeo: '040101', + provincia: 'AREQUIPA', + latitud:-16.39881421, + longitud: -71.537019649, + region: 'Costa', + esPrincipal: 1 + },{ + ubigeo: '050301', + provincia: 'HUANCA SANCOS', + latitud:-13.91988366, + longitud: -74.33388289, + region: 'Costa', + esPrincipal: 0 + } + ] + render() { + return ( + <TransformWrapper + defaultScale={1} + maxScale={1.8} + defaultPositionX={200} + defaultPositionY={100} + > + <TransformComponent> + <div> + <img src={require("../../../../public/images/mapaM.png")}/> + {this.almacenes.map((item,index) => { + console.log(index) + return <div style={{ position: 'absolute', left:`${getX(item.longitud)}px`, top: `${getY(item.latitud)}px`, color:"black"}}> + <Icon style={item.esPrincipal==1? {color:'blue', fontSize:18}:{color:'black', fontSize:15}}>house</Icon> + </div> + })} + </div> + <svg width={mapaW} height={mapaH} style={{position: 'absolute', left: '14px' , top: '34px'}}> + <path fill="none" stroke="red" + d="M 160 437, L 82 283, L 376 600" /> + <circle r="5" fill="red"> + <animateMotion dur="10s" repeatCount={1} + path="M 163 437, L 85 283, L 378 600"/> + </circle> + </svg> + </TransformComponent> + </TransformWrapper> + + ); + } +} + +export default withStyles(styles)(Simulacion7Dias);
\ No newline at end of file diff --git a/front/odiparpack/app/containers/Odipar/Simulacion/utilCoords.js b/front/odiparpack/app/containers/Odipar/Simulacion/utilCoords.js new file mode 100644 index 0000000..bac5f9b --- /dev/null +++ b/front/odiparpack/app/containers/Odipar/Simulacion/utilCoords.js @@ -0,0 +1,42 @@ +import { mapaH, mapaW } from "odi-utils/constants" +export function transform(lonlat){ + const earth_radius_km = 6378.1370 + return earth_radius_km*(lonlat)*Math.PI/180 +} + + +export function limits(type){ + const inferior={lon:-81.324216, lat: -18.345605} + const superior={lon:-68.654087, lat:-0.043656} + + if (type == 'x'){ + return [transform(inferior.lon), transform(superior.lon)] + } + return [transform(inferior.lat),transform(superior.lat)] + +} + +//inicio de mapa en x = 13 y = 33 +export function getX (lon){ + const [infx, supx] = limits('x'); + const imgW = mapaW + const inicioX= -3 + const Fx = Math.abs(infx) - Math.abs(supx) + const xPrev = transform(lon) + const newX = Math.abs(infx) - Math.abs(xPrev) + const x = Math.trunc((Math.abs(newX)*(imgW))/(Fx)) + console.log("x: ", x + 0) + return x + inicioX; +} + +export function getY (lat){ + const [ infy, supy] = limits('y'); + const imgH = mapaH + const inicioY = -8 + const Fy = Math.abs(infy) - Math.abs(supy) + const yPrev = transform(lat) + const newY = Math.abs(yPrev) - Math.abs(supy) + const y = Math.trunc((Math.abs(newY)*(imgH))/(Fy)) + console.log("y: ", y +0) + return y + inicioY + }
\ No newline at end of file diff --git a/front/odiparpack/app/containers/pageListAsync.js b/front/odiparpack/app/containers/pageListAsync.js index b64c622..324b633 100644 --- a/front/odiparpack/app/containers/pageListAsync.js +++ b/front/odiparpack/app/containers/pageListAsync.js @@ -2,6 +2,12 @@ import Loadable from 'react-loadable'; import Loading from 'ba-components/Loading'; // 2.Pedidos +export const Simulacion7Dias = Loadable({ + loader: () => import('./Odipar/Simulacion/Simulacion7Dias'), + loading: Loading, +}); + +// 2.Pedidos export const Pedidos = Loadable({ loader: () => import('./Odipar/Pedidos/Pedidos'), loading: Loading, |