{"version":3,"sources":["webpack:///./src/components/map.vue","webpack:///./src/components/map.vue?babd","webpack:///./src/views/admin/map/TabletMap.vue","webpack:///./src/views/admin/map/TabletMap.vue?48e7"],"names":["id","style","width","height","name","props","Number","token","String","x","y","map","positions","layer","socket","vectorSource","markersLayer","centerPoint","Point","this","Map","target","controls","extend","FullScreen","layers","Tile","source","XYZ","url","view","View","center","getCoordinates","zoom","Vector","addLayer","on","evt","feature","forEachFeatureAtPixel","pixel","get","includes","jobId","replace","window","open","loadJobMarkers","loadVehicleMarkers","methods","a","then","response","data","markers","forEach","m","addMarker","latitude","longitude","assignedUsers","catch","error","$error","vehicles","v","vehicle_status","location","console","log","registration","lat","long","imei","label","rotation","type","assigned","point1","rotate","Math","PI","newMarker","Feature","geometry","color","Style","image","Circle","radius","fill","Fill","stroke","Stroke","text","Text","scale","offsetY","setStyle","addFeature","push","marker","lastStyle","vehicle","pos","filter","p","tracker_imei","hidden","toggle","position","getGeometry","flatCoordinates","getView","setCenter","setZoom","watch","toggles","toggleMarkers","office","engineer","personal","jobs","deep","__exports__","render","show","ref","components","TrackerMap","parseInt","lastLocation","gps","speed"],"mappings":"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","file":"js/chunk-7b53f3be.053e331e.js","sourcesContent":["<template>\r\n  <div id=\"map\" :style=\"{width: width + '%', height: height + '%'}\"></div>\r\n</template>\r\n\r\n<script>\r\nimport 'ol/ol.css';\r\nimport Map from 'ol/Map';\r\nimport View from 'ol/View';\r\nimport TileLayer from 'ol/layer/Tile';\r\nimport XYZ from 'ol/source/XYZ';\r\nimport VectorSource from \"ol/source/Vector\";\r\nimport VectorLayer from \"ol/layer/Vector\";\r\nimport {Point} from \"ol/geom\";\r\nimport {Feature} from \"ol\";\r\nimport {fromLonLat} from \"ol/proj\";\r\nimport {Stroke, Style, Fill, Text} from \"ol/style\";\r\nimport CircleStyle from \"ol/style/Circle\";\r\nimport {FullScreen, defaults as defaultControls} from 'ol/control';\r\nimport axios from 'axios';\r\n// import Point from 'ol/geom/Point';\r\n// import Feature from 'ol/Feature';\r\n// import * as Proj from 'ol/proj';\r\n// import VectorLayer from 'ol/layer/Vector';\r\n// import VectorSource from 'ol/source/Vector';\r\n// import {Icon, Style} from 'ol/style';\r\nexport default {\r\n  name: 'Map',\r\n  props: {\r\n    width: Number,\r\n    height: Number,\r\n    token: String\r\n  },\r\n  data(){\r\n    return {\r\n      x: 383018,\r\n      y: 5967425,\r\n        map: null,\r\n        positions: [],\r\n        layer: null,\r\n      socket: null,\r\n      vectorSource: null,\r\n      markersLayer: null\r\n    };\r\n  },\r\n  mounted() {\r\n\r\n    let centerPoint = new Point(\r\n        fromLonLat( [-3.4874533187956307,54.05328679392503])\r\n    )\r\n      this.map = new Map({\r\n          target: 'map',\r\n          controls: defaultControls().extend([new FullScreen()]),\r\n          layers: [\r\n              new TileLayer({\r\n                  source: new XYZ({\r\n                      url: \"https://mt0.google.com/vt/lyrs=m&hl=en&x={x}&y={y}&z={z}&s=Ga\"\r\n                  })\r\n              })\r\n          ],\r\n          view: new View({\r\n              center: centerPoint.getCoordinates(),\r\n              zoom: 7\r\n          })\r\n      });\r\n\r\n    this.vectorSource = new VectorSource({});\r\n\r\n    this.markersLayer = new VectorLayer({\r\n      source: this.vectorSource,\r\n    });\r\n\r\n    this.map.addLayer(this.markersLayer);\r\n\r\n    this.map.on('click', (evt) => {\r\n      let feature = this.map.forEachFeatureAtPixel(evt.pixel, function(feature) {\r\n        return feature;\r\n      });\r\n      if (feature) {\r\n        let name = feature.get('name');\r\n        if(name && name.includes('JOB_MARKER_')){\r\n          let jobId = name.replace('JOB_MARKER_', '');\r\n          // Open in new tab\r\n          window.open(`/p/jobs/${jobId}`, '_blank');\r\n        }\r\n        // this.$emit('clickOnVehicle', feature.get('name'));\r\n      }\r\n    });\r\n\r\n    this.loadJobMarkers();\r\n    this.loadVehicleMarkers();\r\n\r\n  },\r\n  methods: {\r\n    loadJobMarkers(){\r\n      axios.get(`${process.env.VUE_APP_API_URL}/v1/map/jobs`)\r\n      .then(response => {\r\n        \r\n        response.data.markers.forEach((m) => {\r\n          this.addMarker(m.latitude, m.longitude, 'JOB_MARKER_' + m.id, `JR #${m.id}\\n${m.name}`,0, 'Job', m.assignedUsers)\r\n        })\r\n\r\n      })\r\n      .catch(error => {\r\n        this.$error(\"Failed to load job markers\", error);\r\n      })\r\n    },\r\n    loadVehicleMarkers(){\r\n      axios.get(`${process.env.VUE_APP_API_URL}/v1/map/vehicles`)\r\n      .then(response => {\r\n        \r\n        response.data.vehicles.forEach((v) => {\r\n          if(v.vehicle_status.location == null){\r\n            console.log('No location for', v.registration);\r\n          }else{\r\n            this.addMarker(v.vehicle_status.location.latitude, v.vehicle_status.location.longitude, v.id, v.registration, 0, 'Engineer');\r\n          }\r\n          // this.addMarker(m.latitude, m.longitude, m.tracker_imei, m.name, m.rotation, m.type)\r\n        })\r\n\r\n      })\r\n    },\r\n    addMarker(lat, long, imei, label = \"\", rotation, type, assigned = 0){\r\n      let point1 = new Point(\r\n          fromLonLat([long, lat])\r\n      );\r\n      point1.rotate((rotation * Math.PI / 180), fromLonLat([long, lat]))\r\n      let newMarker = new Feature({\r\n        geometry: point1,\r\n        name: imei\r\n      })\r\n\r\n      let color = 'black';\r\n      switch(type){\r\n        case 'Engineer':\r\n          color = 'green';\r\n          break;\r\n        case 'Office':\r\n          color = 'orange';\r\n          break;\r\n        case 'Personal':\r\n          color = 'red';\r\n          break;\r\n        case 'Job':\r\n          color = 'black';\r\n          break;\r\n      }\r\n\r\n      if(type == 'Job' && assigned > 0){\r\n        color = 'orange';\r\n      }\r\n\r\n      let style = new Style({\r\n        image: new CircleStyle({\r\n          radius: 15,\r\n          fill: new Fill({color: color}),\r\n          stroke: new Stroke({\r\n            color: 'white', width: 2\r\n          })\r\n        }),\r\n        text: new Text({\r\n          text: label,\r\n          scale: 1.3,\r\n          fill: new Fill({\r\n            color: '#fff'\r\n          }),\r\n          stroke: new Stroke({\r\n            color: '0',\r\n            width: 3\r\n          }),\r\n          offsetY: 20\r\n        })\r\n      });\r\n\r\n      \r\n      newMarker.setStyle(style);\r\n      \r\n\r\n      this.vectorSource.addFeature(newMarker);\r\n\r\n      this.positions.push({\r\n        imei: imei,\r\n        longitude: long,\r\n        latitude: lat,\r\n        marker: newMarker,\r\n        type: type,\r\n        lastStyle: style\r\n      })\r\n    },\r\n    hideMarker(vehicle){\r\n      let pos = this.positions.filter((p) => {\r\n        return p.imei == vehicle.tracker_imei;\r\n      })[0];\r\n      pos.setStyle(null);\r\n      pos.hidden = true;\r\n    },\r\n    showMarker(vehicle){\r\n      let pos = this.positions.filter((p) => {\r\n        return p.imei == vehicle.tracker_imei;\r\n      })[0];\r\n      pos.setStyle(pos.lastStyle);\r\n      pos.hidden = false;\r\n    },\r\n    toggleMarkers(toggle, name){\r\n      console.log(\"Toggling\", name);\r\n      let markers = this.positions.filter((p) => {\r\n        return p.type === name;\r\n      });\r\n      if(toggle === true){\r\n        markers.forEach((m) => {\r\n          m.marker.setStyle(m.lastStyle);\r\n          m.marker.hidden = false;\r\n        })\r\n      }else{\r\n        markers.forEach((m) => {\r\n          m.marker.setStyle(null);\r\n          m.marker.hidden = true;\r\n        })\r\n      }\r\n    },\r\n    clickOnVehicle(vehicle){\r\n      let position = this.positions.filter((p) => {\r\n        return p.imei === vehicle.tracker_imei;\r\n      })[0];\r\n      if(position){\r\n        console.log(position);\r\n        console.log(position.marker.getGeometry().flatCoordinates);\r\n        this.map.getView().setCenter(position.marker.getGeometry().flatCoordinates);\r\n        this.map.getView().setZoom(21);\r\n      }\r\n    }\r\n  },\r\n  watch: {\r\n    toggles: {\r\n      handler(){\r\n        this.toggleMarkers(this.toggles.office, 'Office');\r\n        this.toggleMarkers(this.toggles.engineer, 'Engineer');\r\n        this.toggleMarkers(this.toggles.personal, 'Personal');\r\n        this.toggleMarkers(this.toggles.jobs, 'Job');\r\n      },\r\n      deep: true\r\n    }\r\n  }\r\n}\r\n</script>","import { render } from \"./map.vue?vue&type=template&id=edf71352\"\nimport script from \"./map.vue?vue&type=script&lang=js\"\nexport * from \"./map.vue?vue&type=script&lang=js\"\n\nimport exportComponent from \"C:\\\\Users\\\\s.arshad\\\\Documents\\\\GitHub\\\\link-portal\\\\link\\\\node_modules\\\\@vue\\\\cli-service\\\\node_modules\\\\vue-loader-v16\\\\dist\\\\exportHelper.js\"\nconst __exports__ = /*#__PURE__*/exportComponent(script, [['render',render]])\n\nexport default __exports__","<template>\r\n  <div style=\"position: fixed; top: 0; bottom: 0; left: 0; right: 0; z-index: 10000; background-color: grey;\">\r\n    <tracker-map ref=\"trackerMap\" v-if=\"show\" style=\"width: 100%; height: 100%;\" :toggles=\"toggles\" :vehicles=\"vehicles\" :token=\"token\"></tracker-map>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport axios from \"axios\";\r\nimport TrackerMap from \"../../../components/map\";\r\n\r\nexport default {\r\n  name: \"admin.tabletmap\",\r\n  components: { TrackerMap },\r\n  data(){\r\n    return {\r\n      vehicles: [],\r\n      token: null,\r\n      show: false,\r\n      toggles: {\r\n        office: true,\r\n        engineer: true,\r\n        personal: true,\r\n        jobs: false\r\n      }\r\n    }\r\n  },\r\n  mounted(){\r\n\r\n    axios.get(`${process.env.VUE_APP_API_URL}/v1/map`)\r\n        .then(response => {\r\n          this.vehicles = response.data.vehicles;\r\n          this.token = response.data.token;\r\n          this.show = true;\r\n        })\r\n        .catch(error => {\r\n          this.$error(\"Failed to load vehicles\", error);\r\n        })\r\n\r\n  },\r\n  methods: {\r\n    updateSpeed(data){\r\n      let vehicle = this.vehicles.filter((v) => {\r\n        return parseInt(data.vehicle.id) === parseInt(v.id);\r\n      })[0];\r\n      if(vehicle){\r\n        vehicle.lastLocation.gps.speed = data.speed;\r\n      }\r\n    }\r\n  }\r\n}\r\n</script>\r\n\r\n<style scoped>\r\n\r\n</style>","import { render } from \"./TabletMap.vue?vue&type=template&id=508d99b0\"\nimport script from \"./TabletMap.vue?vue&type=script&lang=js\"\nexport * from \"./TabletMap.vue?vue&type=script&lang=js\"\n\nimport exportComponent from \"C:\\\\Users\\\\s.arshad\\\\Documents\\\\GitHub\\\\link-portal\\\\link\\\\node_modules\\\\@vue\\\\cli-service\\\\node_modules\\\\vue-loader-v16\\\\dist\\\\exportHelper.js\"\nconst __exports__ = /*#__PURE__*/exportComponent(script, [['render',render]])\n\nexport default __exports__"],"sourceRoot":""}