{"version":3,"sources":["webpack:///./src/components/submission/maping.vue","webpack:///src/components/submission/maping.vue","webpack:///./src/components/submission/maping.vue?61ea","webpack:///./src/components/submission/maping.vue?700a"],"names":["_c","staticClass","attrs","_v","staticStyle","key","index","staticRenderFns","props","detail","type","default","data","sheet","form","options","fillColor","fillOpacity","strokeColor","strokeWeight","strokeOpacity","map","id","nama_badan_usaha","nib_no","nib_alamat","kbli","lokasi_usaha","luas","keterangan","lampiran","koordinat","extra","process","load","message","success","error","components","computed","watch","mounted","methods","initMap","self","center","lat","lng","zoom","noClear","mapTypeId","navigationControl","mapTypeControl","streetViewControl","tilt","drawingMode","drawingControl","drawingControlOptions","position","drawingModes","polygonOptions","draggable","editable","clickable","zIndex","drawingManager","console","polygon","featureAdded","addFeature","bounds","component"],"mappings":"mMAAuJ,aAAC,IAAGA,EAAG,KAAyBC,UAAY,GAAyC,OAAM,EAAG,MAAC,WAA4CA,YAAY,2BAA2B,MAAK,CAA0HA,MAAW,U,CAAqB,UAAe,EAAC,OAAM,YAAC,2CAACC,GAAK,GAAC,2C,YAAU,4B,CAAC,WAAa,+EAAM,wB,YAAS,OAAa,aAAIF,gBAAS,Q,MAAc,CAAe,KAAQ,GAAQ,oBAACE,MAAM,gBAAW,UAAG,YAAW,CAAED,MAAW,OAA+CD,OAAG,Q,MAAiB,CAAW,cAA+CC,QAAY,CAAO,YAAS,6CAAgEA,UAAW,CAAQ,MAAME,CAAoIC,Y,CAAoC,8BAAS,UAAmB,YAAC,QAACF,GAAK,GAAC,+D,YAAU,Q,CAAC,KAAO,4EAAC,4CAAW,aAAIF,gBAAgB,OAAEC,OAAW,qBAAkE,MAAOD,CAAYK,KAAIC,GAAML,oB,CAAqHC,SAAM,C,YAAS,Q,EAAQ,2CAAC,OAAM,SAAQ,CAACD,MAAmBC,YAAM,O,MAAC,EAAW,0E,MAAK,CAAI,iBAAcD,UAAW,CAAe,YAAS,OAAqKA,OAAmBC,KAAM,KAAC,GAAM,MAAc,UAAE,YAAW,eAACD,qCAAY,iHAAc,YAAS,OAAgK,MAAM,CACj6D,UACGM,S,yNC4FJ,G,oBAAA,CACAC,OACAC,QACAC,YACAC,aAGAC,OACA,OACAC,OACAC,SAEAC,SACAC,oBACAC,gBACAC,sBACAC,eACAC,iBAIAC,SAEAP,MACAQ,MACAC,oBACAC,UACAC,cACAC,QACAC,gBACAC,QACAC,cACAC,YACAC,aACAC,UAEAC,SACAC,QACApB,SAEAqB,SACAC,WACAC,YAIAC,cAGAC,YAGAC,SAGAC,UACA,gBAEAC,SACAC,UACA,WAEA,qCACAC,0DACAC,QACAC,wFACAC,0FAEAC,QACAC,WACAC,sBACAC,qBACAC,kBACAC,qBACAC,SAGAV,oDAEA,gDACAW,8FACAC,4BACAC,uBACAC,8CACAC,0BAEAC,gBACA5C,oBACAC,gBACAC,sBACAC,eACAC,gBACAyC,uBACAC,sBACAC,uBACAC,YAIAC,gBAEAA,oCACA,2BACAC,oDACAC,sBAEAvB,oCACAuB,kBAIA,6FAGAC,gBACA,0CACA,cACAC,kEACA,MAGAzB,iCAEAyB,gBACA,WAEA,UACA,cACA,+BACArD,oBACAC,gBACAC,sBACAC,eACAC,gBACAyC,uBACAC,sBACAC,uBACAC,WAGAG,aAEAA,yCACA,kBACAvB,oBAEA,2BACAA,uBACAE,qBACAC,yBAKAoB,4BACA,kBACAvB,oBACA,mCAEA,2BACA0B,qBAEA1B,uBACAE,qBACAC,yBAKAoB,oCACA,cAEA,6BACAA,eACAvB,sBAEAuB,+BACAvB,wCAIA,kBAEA,qCACA,iCACAA,uBACAE,wDACAC,0DAGA,uCACAH,2CAAAE,OAAA,wBAIAqB,gBACA,WClS+V,I,YCO3VI,EAAY,eACd,EACA,EACAhE,GACA,EACA,KACA,KACA,MAIa,aAAAgE,E","file":"js/chunk-2d230a66.f1448f32.js","sourcesContent":["var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',[_c('v-card',{staticClass:\"box-shadow border-radius\",attrs:{\"color\":\"white\"}},[_c('v-card-text',[_c('div',{staticClass:\"title font-weight-bold black--text mb-1\"},[_vm._v(\"\\n        Map Lokasi\\n      \")]),_c('div',{staticClass:\"d-flex align-center mb-4\"},[_c('div',[_vm._v(\"\\n          Berikut titik / data koordinat ajuan izin usaha.\\n        \")]),_c('v-spacer')],1),_c('v-card',{staticClass:\"mb-6\",staticStyle:{\"border-radius\":\"15px\"},attrs:{\"flat\":\"\",\"min-height\":\"70vh\",\"color\":\"transparent\"}},[_c('div',{staticStyle:{\"width\":\"100%\",\"height\":\"70vh\"},attrs:{\"id\":\"map\"}})]),_c('div',{staticClass:\"mb-1 font-weight-bold d-flex align-center\"},[_c('v-icon',{attrs:{\"size\":\"18\"}},[_vm._v(\"mdi-map-marker-path\")]),_c('span',{staticClass:\"ml-1\"},[_vm._v(\"\\n          Koordinat Lokasi Usaha\\n        \")])],1),_c('div',{staticClass:\"mb-4\"},[_vm._v(\"\\n        Berikut adalah koordinat lokasi usaha yang diajukan:\\n      \")]),(_vm.detail.ajuan_koordinat.length > 0)?_c('v-card',{staticStyle:{\"border-radius\":\"15px\",\"border\":\"3px solid #f0f0f0\"},attrs:{\"flat\":\"\",\"color\":\"#f0f0f033\"}},[_c('v-card-text',{staticClass:\"py-1\"},_vm._l((_vm.detail.ajuan_koordinat),function(item,index){return _c('v-row',{key:index,staticClass:\"mx-1\",style:(index < _vm.detail.ajuan_koordinat.length - 1 ? 'border-bottom: 2px dashed #f0f0f0;' : ''),attrs:{\"align\":\"center\"}},[_c('v-col',{staticClass:\"px-0\",attrs:{\"cols\":\"12\",\"md\":\"6\"}},[_c('div',{staticClass:\"body-2 mb-1\"},[_vm._v(\"\\n                Latitude \"),_c('strong',[_vm._v(_vm._s(index + 1))])]),_c('div',[_vm._v(\"\\n                \"+_vm._s(item.lat)+\"\\n              \")])]),_c('v-col',{staticClass:\"px-0\",attrs:{\"cols\":\"12\",\"md\":\"6\"}},[_c('div',{staticClass:\"body-2 mb-1\"},[_vm._v(\"\\n                Longitude \"),_c('strong',[_vm._v(_vm._s(index + 1))])]),_c('div',[_vm._v(\"\\n                \"+_vm._s(item.lng)+\"\\n              \")])])],1)}),1)],1):_vm._e()],1)],1)],1)\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <div>\n    <v-card \n      color=\"white\"\n      class=\"box-shadow border-radius\">\n      <v-card-text>\n        <div\n          class=\"title font-weight-bold black--text mb-1\">\n          Map Lokasi\n        </div>\n\n        <div\n          class=\"d-flex align-center mb-4\">\n          <div>\n            Berikut titik / data koordinat ajuan izin usaha.\n          </div>\n\n          <v-spacer />\n        </div>\n\n        <v-card\n          flat\n          min-height=\"70vh\"\n          color=\"transparent\"\n          class=\"mb-6\"\n          style=\"border-radius: 15px;\">\n          <div \n            id=\"map\" \n            style=\"width: 100%; height: 70vh;\">\n          </div>\n        </v-card>\n \n        <div\n          class=\"mb-1 font-weight-bold d-flex align-center\">\n          <v-icon size=\"18\">mdi-map-marker-path</v-icon>\n\n          <span\n            class=\"ml-1\">\n            Koordinat Lokasi Usaha\n          </span>\n        </div>\n\n        <div\n          class=\"mb-4\">\n          Berikut adalah koordinat lokasi usaha yang diajukan:\n        </div>\n\n        <v-card v-if=\"detail.ajuan_koordinat.length > 0\"\n          flat\n          color=\"#f0f0f033\"\n          style=\"border-radius: 15px; border: 3px solid #f0f0f0;\">\n          <v-card-text\n            class=\"py-1\">\n            <v-row\n              v-for=\"(item, index) in detail.ajuan_koordinat\"\n              :key=\"index\"\n              align=\"center\"\n              class=\"mx-1\"\n              :style=\"index < detail.ajuan_koordinat.length - 1 ? 'border-bottom: 2px dashed #f0f0f0;' : ''\">\n              <v-col\n                cols=\"12\"\n                md=\"6\"\n                class=\"px-0\">\n                <div class=\"body-2 mb-1\">\n                  Latitude <strong>{{ index + 1 }}</strong>\n                </div>\n\n                <div>\n                  {{ item.lat }}\n                </div>\n              </v-col>\n\n              <v-col\n                cols=\"12\"\n                md=\"6\"\n                class=\"px-0\">\n                <div class=\"body-2 mb-1\">\n                  Longitude <strong>{{ index + 1 }}</strong>\n                </div>\n\n                <div>\n                  {{ item.lng }}\n                </div>\n              </v-col>\n            </v-row>\n          </v-card-text>\n        </v-card>\n      </v-card-text>\n    </v-card>\n  </div>\n</template>\n\n<script>\n  import { get, post, put, destroy } from \"@/service/Axios\";\n  export default {\n    props: {\n      detail: {\n        type: Object,\n        default: {}\n      }\n    },\n    data () {\n      return {\n        sheet: {\n          form: false\n        },\n        options: {\n          fillColor: '#FF0000',\n          fillOpacity: 0.35,\n          strokeColor: '#FF0000',\n          strokeWeight: 2,\n          strokeOpacity: 1,\n        },\n        \n        // MAPING\n        map: null,\n\n        form: {\n          id: '',\n          nama_badan_usaha: '',\n          nib_no: '',\n          nib_alamat: '',\n          kbli: '',\n          lokasi_usaha: '',\n          luas: '',\n          keterangan: '',\n          lampiran: [],\n          koordinat: [],\n          extra: {}\n        },\n        process: {\n          load: false,\n          form: false\n        },\n        message: {\n          success: '',\n          error: ''\n        }\n      }\n    },\n    components: {\n      \n    },\n    computed: {\n      \n    },\n    watch: {\n      \n    },\n    mounted () {\n      this.initMap()\n    },\n    methods: {\n      initMap () {\n        let self = this\n\n        this.$gmapApiPromiseLazy().then(() => {\n          self.map = new google.maps.Map(document.getElementById('map'), {\n            center: { \n              lat: this.detail.ajuan_koordinat.length > 0 ? this.detail.ajuan_koordinat[0].lat : -7.71210962,\n              lng: this.detail.ajuan_koordinat.length > 0 ? this.detail.ajuan_koordinat[0].lng : 110.59174574\n            },\n            zoom: 18,\n            noClear: true,\n            mapTypeId: 'satellite',\n            navigationControl: true,\n            mapTypeControl: false,\n            streetViewControl: false,\n            tilt: 0\n          })\n\n          self.map.data.addListener('addfeature', self.featureAdded)\n\n          const drawingManager = new google.maps.drawing.DrawingManager({\n            drawingMode: this.detail.ajuan_koordinat.length < 1 ? google.maps.drawing.OverlayType.POLYGON : null,\n            drawingControl: self.sheet.form,\n            drawingControlOptions: {\n              position: google.maps.ControlPosition.TOP_LEFT,\n              drawingModes: ['polygon']\n            },\n            polygonOptions: {\n              fillColor: '#FF0000',\n              fillOpacity: 0.35,\n              strokeColor: '#FF0000',\n              strokeWeight: 2,\n              strokeOpacity: 1,\n              draggable: self.sheet.form,\n              editable: self.sheet.form,\n              clickable: self.sheet.form,\n              zIndex: 1\n            }\n          })\n\n          drawingManager.setMap(self.map)\n\n          drawingManager.addListener('polygoncomplete', (polygon) => {\n            if (polygon.getPath().getLength() < 3) {\n              console.log('Polygons must have 3 or more points.')\n              polygon.getPath().clear()\n            } else {\n              self.addFeature('Polygon', polygon.getPath())\n              polygon.setMap(null)\n            }\n          })\n\n          if (this.detail.ajuan_koordinat.length > 0) self.addFeature('Polygon', this.detail.ajuan_koordinat)\n        })\n      },\n      featureAdded (e) {\n        switch (e.feature.getGeometry().getType()) {\n          case 'Polygon':\n            addFeature('Polygon', e.feature.getGeometry().getAt(0).getArray())\n            break\n        }\n\n        self.map.data.remove(e.feature)\n      },\n      addFeature (type, path) {\n        let self = this\n\n        switch (type) {\n          case 'Polygon':\n            let polygon = new google.maps.Polygon({\n              fillColor: '#FF0000',\n              fillOpacity: 0.35,\n              strokeColor: '#FF0000',\n              strokeWeight: 2,\n              strokeOpacity: 1,\n              draggable: self.sheet.form,\n              editable: self.sheet.form,\n              clickable: self.sheet.form,\n              zIndex: 1\n            })\n\n            polygon.setPath(path)\n\n            polygon.getPath().addListener('set_at', (e, obj) => {\n              let polypath = polygon.getPath()\n              self.form.koordinat = []\n\n              for (var i = 0; i < polypath.length; i++) {\n                self.form.koordinat.push({\n                  lat: polypath.getAt(i).lat(),\n                  lng: polypath.getAt(i).lng()\n                })\n              }\n            })\n\n            polygon.addListener('dragend', (e) => {\n              let polypath = polygon.getPath()\n              self.form.koordinat = []\n              let bounds = new google.maps.LatLngBounds()\n\n              for (var i = 0; i < polypath.length; i++) {\n                bounds.extend(polypath.getAt(i))\n\n                self.form.koordinat.push({\n                  lat: polypath.getAt(i).lat(),\n                  lng: polypath.getAt(i).lng()\n                })\n              }\n            })\n\n            polygon.addListener('rightclick', (e) => {\n              if (e.vertex == undefined) return\n\n              if (polygon.getPath().getLength() === 3) {\n                polygon.setMap(null)\n                self.form.koordinat = []\n              } else {\n                polygon.getPath().removeAt(e.vertex)\n                self.form.koordinat.splice(e.vertex, 1)\n              }\n            })\n\n            let data_polygon = polygon.getPath()\n\n            if (self.detail.ajuan_koordinat.length < 1) {\n              for (let i = 0; i < data_polygon.getLength(); i++) {\n                self.form.koordinat.push({\n                  lat: parseFloat(data_polygon.getAt(i).toUrlValue(10).split(',')[0]),\n                  lng: parseFloat(data_polygon.getAt(i).toUrlValue(10).split(',')[1])\n                })\n\n                const lats = self.form.koordinat.map(o => o.lat)\n                self.form.koordinat = self.form.koordinat.filter(({lat}, index) => !lats.includes(lat, index + 1))\n              }\n            }\n\n            polygon.setMap(self.map)\n            break\n\n        }\n      }\n    }\n  }\n</script>","import mod from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./maping.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../node_modules/thread-loader/dist/cjs.js!../../../node_modules/babel-loader/lib/index.js!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./maping.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./maping.vue?vue&type=template&id=1a9533d1&\"\nimport script from \"./maping.vue?vue&type=script&lang=js&\"\nexport * from \"./maping.vue?vue&type=script&lang=js&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports"],"sourceRoot":""}