Selection Editable Objects
This commit is contained in:
parent
0a0e2574e5
commit
cd501175f5
@ -11,19 +11,19 @@
|
||||
<div>
|
||||
<el-row>
|
||||
<el-col :span="7">ICAO :</el-col>
|
||||
<el-col :span="15">{{ this.$store.state.Editable.data.properties.icao }}</el-col>
|
||||
<el-col :span="15">{{ this.$store.state.Editable.data.airports[this.$store.state.Editable.index].icao }}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="7">Name :</el-col>
|
||||
<el-col :span="15">{{ this.$store.state.Editable.data.properties.name }}</el-col>
|
||||
<el-col :span="15">{{ this.$store.state.Editable.data.airports[this.$store.state.Editable.index].name }}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="7">Flights :</el-col>
|
||||
<el-col :span="15">{{ this.$store.state.Editable.data.properties.flights }}</el-col>
|
||||
<el-col :span="15">{{ this.$store.state.Editable.data.airports[this.$store.state.Editable.index].flights }}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="7">Airlines :</el-col>
|
||||
<el-col :span="15">{{ this.$store.state.Editable.data.properties.airlines }}</el-col>
|
||||
<el-col :span="15">{{ this.$store.state.Editable.data.airports[this.$store.state.Editable.index].airlines }}</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="7">Groundnet :</el-col>
|
||||
@ -41,10 +41,7 @@
|
||||
return this.$store.state.Editable.type === 'airport'
|
||||
},
|
||||
groundnet: function () {
|
||||
return this.$store.state.Editable.data.properties.groundnet
|
||||
},
|
||||
airports_directory: function () {
|
||||
return this.$store.state.Settings.settings.airportsDirectory
|
||||
return this.$store.state.Editable.data.airports[this.$store.state.Editable.index].groundnet
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -30,6 +30,9 @@
|
||||
},
|
||||
methods: {
|
||||
load (icao) {
|
||||
if (this.groundnet !== undefined) {
|
||||
this.groundnet.removeFrom(this.$parent.mapObject)
|
||||
}
|
||||
this.groundnet = readGroundnetXML(this.$store.state.Settings.settings.airportsDirectory, icao)
|
||||
this.groundnet.addTo(this.$parent.mapObject)
|
||||
this.groundnet.eachLayer(l => {
|
||||
|
@ -84,7 +84,7 @@
|
||||
return ret && ret2
|
||||
},
|
||||
addEvent (event, item) {
|
||||
console.log(event, item)
|
||||
// console.log(event, item)
|
||||
if (item.properties.groundnet === 0) {
|
||||
event.target.setStyle({color: 'red', fillcolor: 'red'})
|
||||
} else if ((item.properties.flights / item.properties.parking) > 10) {
|
||||
@ -93,7 +93,7 @@
|
||||
},
|
||||
onClick (item) {
|
||||
console.log(item)
|
||||
this.$store.commit('SET_EDIT_AIRPORT', item)
|
||||
this.$store.commit('SET_EDIT_AIRPORT', item.properties)
|
||||
},
|
||||
zoomUpdated (zoom) {
|
||||
this.$store.dispatch('setZoom', zoom)
|
||||
|
@ -18,6 +18,7 @@
|
||||
radius: 18
|
||||
type: "gate"
|
||||
-->
|
||||
{{this.$store.state.Editable.index}}
|
||||
<el-row>
|
||||
<el-col :span="7"><span class="demo-input-label">Name :</span></el-col>
|
||||
<el-col :span="15"><el-input placeholder="Please input" v-model="name"></el-input></el-col>
|
||||
@ -35,7 +36,7 @@
|
||||
name: {
|
||||
// getter
|
||||
get: function () {
|
||||
return this.$store.state.Editable.data.name
|
||||
return this.$store.state.Editable.data.parking[this.$store.state.Editable.index].name
|
||||
},
|
||||
// setter
|
||||
set: function (newValue) {
|
||||
|
@ -6,24 +6,21 @@ const util = require('util');
|
||||
|
||||
var $ = require('jquery');
|
||||
L.ParkingSpot = L.Circle.extend({
|
||||
options: {
|
||||
id: 'Custom data!',
|
||||
attributes: {}
|
||||
},
|
||||
|
||||
createDirection: function () {
|
||||
if (this.direction === undefined ) {
|
||||
var start = this._latlng;
|
||||
var options = { units: 'kilometers' };
|
||||
var end = turf.destination([start.lat, start.lng], this.options.attributes.radius / 1000, this.options.attributes.heading - 180, options);
|
||||
|
||||
var end = turf.destination([start.lng, start.lat], this.options.attributes.radius / 1000, this.options.attributes.heading - 180, options);
|
||||
// Resize, since leaflet is wrong
|
||||
var rad2 = start.distanceTo(end.geometry.coordinates);
|
||||
var rad2 = start.distanceTo(this.turfToLatLng(end), options);
|
||||
console.debug('Dist ', start, [start.lng, start.lat], end.geometry.coordinates, this.options.attributes.radius, rad2);
|
||||
this.setRadius(rad2);
|
||||
// console.log(util.inspect(this.editor));
|
||||
if(this.editor._resizeLatLng.__vertex !== undefined){
|
||||
this.editor._resizeLatLng.__vertex.setLatLng(end.geometry.coordinates);
|
||||
this.editor._resizeLatLng.__vertex.setLatLng(this.turfToLatLng(end));
|
||||
}
|
||||
this.direction = L.polyline([start, end.geometry.coordinates]);
|
||||
this.direction = L.polyline([start, this.turfToLatLng(end)]);
|
||||
this.direction.addTo(this.editor.editLayer);
|
||||
|
||||
|
||||
@ -37,26 +34,28 @@ L.ParkingSpot = L.Circle.extend({
|
||||
if (this.editEnabled()) {
|
||||
var start = this._latlng;
|
||||
var options = { units: 'kilometers' };
|
||||
var end = turf.destination([start.lat, start.lng], this.options.attributes.radius / 1000, this.options.attributes.heading - 180, options);
|
||||
var end = turf.destination([start.lng, start.lat], this.options.attributes.radius / 1000, this.options.attributes.heading - 180, options);
|
||||
// Resize, since leaflet is wrong
|
||||
var rad2 = start.distanceTo(end.geometry.coordinates);
|
||||
var rad2 = start.distanceTo(this.turfToLatLng(end), options);
|
||||
this.setRadius(rad2);
|
||||
if(this.editor._resizeLatLng.__vertex!== undefined){
|
||||
this.editor._resizeLatLng.__vertex.setLatLng(end.geometry.coordinates);
|
||||
this.editor._resizeLatLng.__vertex.setLatLng(this.turfToLatLng(end));
|
||||
}
|
||||
this.direction.setLatLngs([start, end.geometry.coordinates]);
|
||||
this.direction.setLatLngs([start, this.turfToLatLng(end)]);
|
||||
}
|
||||
},
|
||||
updateDirectionFromVertex: function () {
|
||||
if (this.editEnabled()) {
|
||||
var start = this._latlng;
|
||||
var end = this.editor._resizeLatLng.__vertex.getLatLng();
|
||||
var heading = turf.bearing([start.lat, start.lng], [end.lat, end.lng]);
|
||||
var heading = turf.bearing([start.lng, start.lat], [end.lng, end.lat]);
|
||||
this.options.attributes.heading = heading + 180;
|
||||
this.direction.setLatLngs([start, end]);
|
||||
}
|
||||
},
|
||||
|
||||
turfToLatLng: function (turfPoint) {
|
||||
return {lat: turfPoint.geometry.coordinates[1], lng: turfPoint.geometry.coordinates[0]};
|
||||
},
|
||||
extensions: function () {
|
||||
this.createDirection();
|
||||
},
|
||||
@ -77,10 +76,7 @@ var parkingSpot = function (n, layerGroup) {
|
||||
var latlon = convert(n.attr('lat') + " " + n.attr('lon'));
|
||||
//console.log(latlon.decimalLatitude);
|
||||
//console.log(convert(n.attr('lat') + " " + n.attr('lon')).decimalLongitude);
|
||||
const circle = new L.ParkingSpot([latlon.decimalLatitude, latlon.decimalLongitude], { radius: n.attr('radius') });
|
||||
circle.on('add', function (event) {
|
||||
console.log(event);
|
||||
});
|
||||
const circle = new L.ParkingSpot([latlon.decimalLatitude, latlon.decimalLongitude], { radius_m: n.attr('radius'), attributes: {} });
|
||||
circle.on('editable:enable', function (event) {
|
||||
// event.target.createDirection();
|
||||
});
|
||||
@ -100,7 +96,7 @@ airlineCodes="VIR,KAL,DAL,KLM" />
|
||||
//circle.attributes = { type: n.attr('type'), name: n.attr('name'), radius: Number(n.attr('radius')), airlineCodes: n.attr('airlineCodes'), heading: Number(n.attr('heading')) };
|
||||
|
||||
$.each( n.attrs, function( key, value ) {
|
||||
console.log( key + "\t" + value);
|
||||
console.log( '$', circle.id, key , value);
|
||||
|
||||
if(isNaN(value))
|
||||
circle.options.attributes[ key ] = value;
|
||||
|
@ -1,6 +1,7 @@
|
||||
const state = {
|
||||
type: 'none',
|
||||
data: Object
|
||||
index: 'none',
|
||||
data: {airports: {}, parking: {}, arc: {}}
|
||||
}
|
||||
|
||||
const SET_EDIT_AIRPORT = 'SET_EDIT_AIRPORT'
|
||||
@ -9,15 +10,17 @@ const SET_EDIT_ARC = 'SET_EDIT_ARC'
|
||||
|
||||
const mutations = {
|
||||
SET_EDIT_AIRPORT (state, airport) {
|
||||
state.data = airport
|
||||
state.data.airports[airport.icao] = airport
|
||||
state.index = airport.icao
|
||||
state.type = 'airport'
|
||||
},
|
||||
SET_EDIT_PARKING (state, parking) {
|
||||
state.data = parking
|
||||
state.data.parking[parking.index] = parking
|
||||
state.index = parking.index
|
||||
state.type = 'parking'
|
||||
},
|
||||
SET_EDIT_ARC (state, arc) {
|
||||
state.data = arc
|
||||
state.data.arc = arc
|
||||
state.type = 'arc'
|
||||
},
|
||||
'SET_EDIT_PARKING_NAME' (state, parkingName) {
|
||||
|
Loading…
Reference in New Issue
Block a user