From 9065ae75f9e82ea8e3227da908e167edc1fadca4 Mon Sep 17 00:00:00 2001 From: portree_kid Date: Fri, 24 Apr 2020 21:19:05 +0200 Subject: [PATCH] Parking List --- package.json | 2 +- src/renderer/components/EditLayer.vue | 51 +++++++++++++++- src/renderer/components/ParkingEdit.vue | 6 +- src/renderer/components/ParkingItem.vue | 77 ++++++++++++++++++++++++- src/renderer/components/ParkingList.vue | 14 ++++- src/renderer/loaders/ParkingSpot.js | 12 +++- src/renderer/loaders/RunwayNode.js | 2 +- src/renderer/loaders/Threshold.js | 4 +- src/renderer/store/modules/Parkings.js | 12 ++++ 9 files changed, 165 insertions(+), 15 deletions(-) diff --git a/package.json b/package.json index 5d802a8..80d41c2 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "flightgear-airports", - "version": "0.0.6", + "version": "0.0.7", "author": "portree_kid ", "description": "An software to design Flightgear groundnets", "license": "GPL v3", diff --git a/src/renderer/components/EditLayer.vue b/src/renderer/components/EditLayer.vue index d4016d6..99758d3 100644 --- a/src/renderer/components/EditLayer.vue +++ b/src/renderer/components/EditLayer.vue @@ -15,6 +15,8 @@ const path = require('path') const fs = require('fs') + var selectedItem + // import {LSymbol} from 'leaflet-polylinedecorator' export default { @@ -64,6 +66,16 @@ deep: true //add this if u need to watch object properties change etc. } ); + this.$store.watch( + function (state) { + return state.Parkings.items; + }, + () => { this.editedParkings() } + , + { + deep: true //add this if u need to watch object properties change etc. + } + ); }, beforeDestroy () { this.remove() @@ -135,6 +147,9 @@ showCheck() { Vue.set(this, 'checking', true) }, + getEditing () { + return this.editing; + }, enableEdit () { this.editable = true this.editing = true @@ -245,14 +260,22 @@ var latlng = {}; latlng.lat = element._latlng.lat; latlng.lng = element._latlng.lng; - element.highlight(); + if (this.selectedItem != null) { + this.selectedItem.deselect(); + } + this.selectedItem = element; + element.select(); this.$store.dispatch('setCenter', latlng); } else if (element instanceof L.ParkingSpot) { console.log(element); var latlng = {}; latlng.lat = element._latlng.lat; latlng.lng = element._latlng.lng; - element.highlight(); + if (this.selectedItem != null) { + this.selectedItem.deselect(); + } + this.selectedItem = element; + element.select(); this.$store.dispatch('setCenter', latlng); } }); @@ -439,6 +462,30 @@ } }) }, + editedParkings() { + console.log('Edited Parkings : ' + this.$store.state.Parkings.items) + this.$store.state.Parkings.items.forEach( newElement => { + console.log(newElement); + this.featureLookup[newElement.index].forEach((element,index) => { + if (element instanceof L.ParkingSpot) { + element.options.attributes.name = newElement.name + element.options.attributes.number = newElement.number + element.options.attributes.type = newElement.type + //element.updateVertexFromDirection(); + } + }) + }) + +/* + this.$store.dispatch('updatedParking', this.$store.state.Editable.data.parking); + this.featureLookup[this.$store.state.Editable.index].forEach((element,index) => { + if (element instanceof L.ParkingSpot) { + element.options.attributes = Object.assign({}, this.$store.state.Editable.data.parking) + element.updateVertexFromDirection(); + } + }) +*/ + }, editedArc() { console.log('Edited Arc : ' + this.$store.state.Editable.index); if (!this.groundnetLayerGroup) diff --git a/src/renderer/components/ParkingEdit.vue b/src/renderer/components/ParkingEdit.vue index 6a82067..66d035c 100644 --- a/src/renderer/components/ParkingEdit.vue +++ b/src/renderer/components/ParkingEdit.vue @@ -16,13 +16,13 @@ Name : - + Number : - + @@ -232,7 +232,7 @@ {value: 'cargo', label: 'cargo'}, {value: 'gate', label: 'commercial passenger traffic'}, {value: 'mil-fighter', label: 'military fighter'}, - {value: 'mil-cargo', label: 'commercial passenger traffic'} + {value: 'mil-cargo', label: 'military cargo'} ] }, parking_type: { diff --git a/src/renderer/components/ParkingItem.vue b/src/renderer/components/ParkingItem.vue index f7e8250..4904e34 100644 --- a/src/renderer/components/ParkingItem.vue +++ b/src/renderer/components/ParkingItem.vue @@ -1,5 +1,17 @@ diff --git a/src/renderer/components/ParkingList.vue b/src/renderer/components/ParkingList.vue index 0350b36..b0f91c3 100644 --- a/src/renderer/components/ParkingList.vue +++ b/src/renderer/components/ParkingList.vue @@ -7,9 +7,9 @@ -
  • +
    -
    • +     @@ -34,8 +34,18 @@ }, // setter set: function (newValue) { + console.log(newValue) } } } } + + + + diff --git a/src/renderer/loaders/ParkingSpot.js b/src/renderer/loaders/ParkingSpot.js index f59196d..ac3dc32 100644 --- a/src/renderer/loaders/ParkingSpot.js +++ b/src/renderer/loaders/ParkingSpot.js @@ -89,11 +89,16 @@ L.ParkingSpot = L.Circle.extend({ this.direction.setLatLngs([start, end]); } }, - highlight() { + select() { var style = {}; style['color'] = 'red'; - this.setStyle(style); + this.setStyle(style); }, + deselect() { + var style = {}; + style['color'] = '#3388ff'; + this.setStyle(style); + }, addListeners: function () { this.on('editable:drawing:move', function (event) { console.log("Move : ", event); @@ -117,7 +122,7 @@ L.ParkingSpot = L.Circle.extend({ this.on('click', function (event) { console.log("Click : " + event.target); store.default.dispatch('setParking', event.target.options.attributes); - this.highlight(); + this.select(); this.unwatch = store.default.watch( function (state) { return state.Editable.data.parking; @@ -139,6 +144,7 @@ L.ParkingSpot = L.Circle.extend({ if(event.target.editor._resizeLatLng.__vertex._icon !== event.sourceTarget._element){ event.vertex._icon.style['background-color'] = 'red'; store.default.dispatch('setParking', event.target.options.attributes); + this.select(); this.unwatch = store.default.watch( function (state) { return state.Editable.data.parking; diff --git a/src/renderer/loaders/RunwayNode.js b/src/renderer/loaders/RunwayNode.js index 2e77857..a481644 100644 --- a/src/renderer/loaders/RunwayNode.js +++ b/src/renderer/loaders/RunwayNode.js @@ -42,7 +42,7 @@ L.RunwayNode = L.Marker.extend({ }); }, - highlight() { + select() { try { this._icon.style['color'] = 'red'; } catch (error) { diff --git a/src/renderer/loaders/Threshold.js b/src/renderer/loaders/Threshold.js index 0b9fec3..9038342 100644 --- a/src/renderer/loaders/Threshold.js +++ b/src/renderer/loaders/Threshold.js @@ -7,7 +7,7 @@ const store = require('../store'); var $ = require('jquery'); L.Threshold = L.Circle.extend({ - highlight() { + select() { var style = {}; style['color'] = 'red'; this.setStyle(style); @@ -35,7 +35,7 @@ L.Threshold = L.Circle.extend({ this.on('click', function (event) { console.log("Click : " + event.target); store.default.dispatch('setParking', event.target.options.attributes); - this.highlight(); + this.select(); this.unwatch = store.default.watch( function (state) { return state.Editable.data.parking; diff --git a/src/renderer/store/modules/Parkings.js b/src/renderer/store/modules/Parkings.js index 1bbe3ef..299dce9 100644 --- a/src/renderer/store/modules/Parkings.js +++ b/src/renderer/store/modules/Parkings.js @@ -14,6 +14,18 @@ const mutations = { }, SET_PARKINGS (state, parkings) { Vue.set(state, 'items', parkings) + }, + 'SET_EDIT_PARKING_ITEM_NAME' (state, value) { + const existingItem = state.items.find((i) => i.index === value[0]) + Vue.set(existingItem, 'name', value[1]) + }, + 'SET_EDIT_PARKING_ITEM_NUMBER' (state, value) { + const existingItem = state.items.find((i) => i.index === value[0]) + Vue.set(existingItem, 'number', value[1]) + }, + 'SET_EDIT_PARKING_ITEM_TYPE' (state, value) { + const existingItem = state.items.find((i) => i.index === value[0]) + Vue.set(existingItem, 'type', value[1]) } }