{"version":3,"sources":["webpack:///./src/views/admin/map/Map.vue","webpack:///./src/views/admin/map/Map.vue?bca0","webpack:///./src/components/map.vue","webpack:///./src/components/map.vue?babd"],"names":["style","class","show","ref","height","width","components","TrackerMap","name","token","methods","__exports__","render","id","props","Number","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","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"],"mappings":"gJACOA,MAAA,4CAAkDC,MAAM,O,6GAA7D,gCAEM,MAFN,EAEM,CADgC,EAAAC,M,yBAApC,yBAAiF,G,MAApEC,IAAI,aAAyBC,OAAO,MAAMC,MAAM,O,oEAKlD,GACbC,WAAY,CAAEC,WAAA,QACdC,KAAM,MACN,OACI,MAAO,CACLC,MAAO,KACPP,MAAM,IAGZ,YAKAQ,QAAS,I,qBChBX,MAAMC,EAA2B,IAAgB,EAAQ,CAAC,CAAC,SAASC,KAErD,gB,0GCNb,gCAAwE,OAAnEC,GAAG,MAAOb,MAAK,mCAAU,EAAAK,MAAQ,IAAH,OAAgB,EAAAD,OAAS,O,2OAwB/C,GACbI,KAAM,MACNM,MAAO,CACLT,MAAOU,OACPX,OAAQW,OACRN,MAAOO,QAET,OACE,MAAO,CACLC,EAAG,OACHC,EAAG,QACDC,IAAK,KACLC,UAAW,GACXC,MAAO,KACTC,OAAQ,KACRC,aAAc,KACdC,aAAc,OAGlB,UAEE,IAAIC,EAAc,IAAIC,EAAA,KAClB,eAAY,EAAE,mBAAmB,qBAEnCC,KAAKR,IAAM,IAAIS,EAAA,KAAI,CACfC,OAAQ,MACRC,SAAU,iBAAkBC,OAAO,CAAC,IAAIC,EAAA,OACxCC,OAAQ,CACJ,IAAIC,EAAA,KAAU,CACVC,OAAQ,IAAIC,EAAA,KAAI,CACZC,IAAK,qEAIjBC,KAAM,IAAIC,EAAA,KAAK,CACXC,OAAQf,EAAYgB,iBACpBC,KAAM,MAIhBf,KAAKJ,aAAe,IAAIoB,EAAA,KAAa,IAErChB,KAAKH,aAAe,IAAI,OAAY,CAClCW,OAAQR,KAAKJ,eAGfI,KAAKR,IAAIyB,SAASjB,KAAKH,cAEvBG,KAAKR,IAAI0B,GAAG,QAAUC,IACpB,IAAIC,EAAUpB,KAAKR,IAAI6B,sBAAsBF,EAAIG,OAAO,SAASF,GAC/D,OAAOA,KAET,GAAIA,EAAS,CACX,IAAIvC,EAAOuC,EAAQG,IAAI,QACvB,GAAG1C,GAAQA,EAAK2C,SAAS,eAAe,CACtC,IAAIC,EAAQ5C,EAAK6C,QAAQ,cAAe,IAExCC,OAAOC,KAAM,WAAUH,EAAS,cAMtCzB,KAAK6B,iBACL7B,KAAK8B,sBAGP/C,QAAS,CACP,iBACE,EAAAgD,EAAMR,IAAK,6CACVS,KAAKC,IAEJA,EAASC,KAAKC,QAAQC,QAASC,IAC7BrC,KAAKsC,UAAUD,EAAEE,SAAUF,EAAEG,UAAW,cAAgBH,EAAEnD,GAAK,OAAMmD,EAAEnD,OAAOmD,EAAExD,OAAO,EAAG,MAAOwD,EAAEI,mBAItGC,MAAMC,IACL3C,KAAK4C,OAAO,6BAA8BD,MAG9C,qBACE,EAAAZ,EAAMR,IAAK,iDACVS,KAAKC,IAEJA,EAASC,KAAKW,SAAST,QAASU,IACE,MAA7BA,EAAEC,eAAeC,SAClBC,QAAQC,IAAI,kBAAmBJ,EAAEK,cAEjCnD,KAAKsC,UAAUQ,EAAEC,eAAeC,SAAST,SAAUO,EAAEC,eAAeC,SAASR,UAAWM,EAAE5D,GAAI4D,EAAEK,aAAc,EAAG,iBAOzH,UAAUC,EAAKC,EAAMC,EAAMC,EAAQ,GAAIC,EAAUC,EAAMC,EAAW,GAChE,IAAIC,EAAS,IAAI5D,EAAA,KACb,eAAW,CAACsD,EAAMD,KAEtBO,EAAOC,OAAQJ,EAAWK,KAAKC,GAAK,IAAM,eAAW,CAACT,EAAMD,KAC5D,IAAIW,EAAY,IAAIC,EAAA,KAAQ,CAC1BC,SAAUN,EACV9E,KAAMyE,IAGJY,EAAQ,QACZ,OAAOT,GACL,IAAK,WACHS,EAAQ,QACR,MACF,IAAK,SACHA,EAAQ,SACR,MACF,IAAK,WACHA,EAAQ,MACR,MACF,IAAK,MACHA,EAAQ,QACR,MAGO,OAART,GAAiBC,EAAW,IAC7BQ,EAAQ,UAGV,IAAI7F,EAAQ,IAAI8F,EAAA,KAAM,CACpBC,MAAO,IAAIC,EAAA,KAAY,CACrBC,OAAQ,GACRC,KAAM,IAAIC,EAAA,KAAK,CAACN,MAAOA,IACvBO,OAAQ,IAAIC,EAAA,KAAO,CACjBR,MAAO,QAASxF,MAAO,MAG3BiG,KAAM,IAAIC,EAAA,KAAK,CACbD,KAAMpB,EACNsB,MAAO,IACPN,KAAM,IAAIC,EAAA,KAAK,CACbN,MAAO,SAETO,OAAQ,IAAIC,EAAA,KAAO,CACjBR,MAAO,IACPxF,MAAO,IAEToG,QAAS,OAKbf,EAAUgB,SAAS1G,GAGnB2B,KAAKJ,aAAaoF,WAAWjB,GAE7B/D,KAAKP,UAAUwF,KAAK,CAClB3B,KAAMA,EACNd,UAAWa,EACXd,SAAUa,EACV8B,OAAQnB,EACRN,KAAMA,EACN0B,UAAW9G,KAGf,WAAW+G,GACT,IAAIC,EAAMrF,KAAKP,UAAU6F,OAAQC,GACxBA,EAAEjC,MAAQ8B,EAAQI,cACxB,GACHH,EAAIN,SAAS,MACbM,EAAII,QAAS,GAEf,WAAWL,GACT,IAAIC,EAAMrF,KAAKP,UAAU6F,OAAQC,GACxBA,EAAEjC,MAAQ8B,EAAQI,cACxB,GACHH,EAAIN,SAASM,EAAIF,WACjBE,EAAII,QAAS,GAEf,cAAcC,EAAQ7G,GACpBoE,QAAQC,IAAI,WAAYrE,GACxB,IAAIsD,EAAUnC,KAAKP,UAAU6F,OAAQC,GAC5BA,EAAE9B,OAAS5E,IAEN,IAAX6G,EACDvD,EAAQC,QAASC,IACfA,EAAE6C,OAAOH,SAAS1C,EAAE8C,WACpB9C,EAAE6C,OAAOO,QAAS,IAGpBtD,EAAQC,QAASC,IACfA,EAAE6C,OAAOH,SAAS,MAClB1C,EAAE6C,OAAOO,QAAS,KAIxB,eAAeL,GACb,IAAIO,EAAW3F,KAAKP,UAAU6F,OAAQC,GAC7BA,EAAEjC,OAAS8B,EAAQI,cACzB,GACAG,IACD1C,QAAQC,IAAIyC,GACZ1C,QAAQC,IAAIyC,EAAST,OAAOU,cAAcC,iBAC1C7F,KAAKR,IAAIsG,UAAUC,UAAUJ,EAAST,OAAOU,cAAcC,iBAC3D7F,KAAKR,IAAIsG,UAAUE,QAAQ,OAIjCC,MAAO,CACLC,QAAS,CACP,UACElG,KAAKmG,cAAcnG,KAAKkG,QAAQE,OAAQ,UACxCpG,KAAKmG,cAAcnG,KAAKkG,QAAQG,SAAU,YAC1CrG,KAAKmG,cAAcnG,KAAKkG,QAAQI,SAAU,YAC1CtG,KAAKmG,cAAcnG,KAAKkG,QAAQK,KAAM,QAExCC,MAAM,K,qBC1OZ,MAAMxH,EAA2B,IAAgB,EAAQ,CAAC,CAAC,SAASC,KAErD","file":"js/chunk-7b841c88.cf10281c.js","sourcesContent":["<template>\r\n  <div style=\"width: 100%; height: calc(100vh - 170px);\" class=\"row\">\r\n    <tracker-map ref=\"trackerMap\" v-if=\"show\" height=\"100\" width=\"100\"></tracker-map>\r\n  </div>\r\n</template>\r\n<script>\r\nimport TrackerMap from '../../../components/map.vue'\r\nexport default {\r\n  components: { TrackerMap },\r\n  name: 'Map',\r\n  data(){\r\n      return {\r\n        token: null,\r\n        show: true\r\n      }\r\n  },\r\n  mounted(){\r\n\r\n    \r\n\r\n  },\r\n  methods: {\r\n    \r\n  }\r\n}\r\n</script>","import { render } from \"./Map.vue?vue&type=template&id=b2ad4e90\"\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 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__"],"sourceRoot":""}