Move Parking to AirportTab and make Airport always visible

This commit is contained in:
portree_kid 2020-06-19 21:04:44 +02:00
parent e122bbbb08
commit 4923b467f4
5 changed files with 92 additions and 53 deletions

View File

@ -1,70 +1,87 @@
<template>
<div>
<div width="100%" v-if="airport">
<el-row>
<el-col :span="7">ICAO :</el-col>
<el-col :span="17">{{ icao }}</el-col>
</el-row>
<el-row>
<el-col :span="7">Name :</el-col>
<el-col :span="17">{{ name }}</el-col>
</el-row>
<div v-if="airport">
<h1 class="leaflet-sidebar-header">{{ icao }} {{ name }}</h1>
<div width="100%" >
<el-row>
<el-col :span="7">Airlines :</el-col>
<el-col :span="15">
<el-tag v-for="item in airlines" :key="item.value">{{item.value}}</el-tag>
</el-col>
</el-row>
<el-row>
<el-col :span="5">Flights :</el-col>
<el-col :span="7">{{ flights }}</el-col>
<el-col :span="5">Parking :</el-col>
<el-col :span="7">{{ parking }}</el-col>
</el-row>
<el-row>
<el-col :span="7">Groundnet :</el-col>
<el-col :span="15">{{groundnet}}</el-col>
</el-row>
</div>
<el-divider v-if="airport"></el-divider>
<h3 v-if="airport">Frequencies</h3>
<div v-if="airport">
<el-row v-for="f in Frequencies" :key="f.index">
<el-tabs v-model="activeTab" >
<el-tab-pane label="Frequencies" name="first">
<div>
<el-row v-for="f in frequencyList" :key="f.index">
<Frequency :frequency="f"></Frequency>
</el-row>
<el-button @click="addFrequency" v-if="editing" >Add</el-button>
</div>
</div>
</el-tab-pane>
<el-tab-pane label="Parkings" name="second">
<ParkingList></ParkingList>
</el-tab-pane>
<el-tab-pane label="Statistics" name="third">
<el-row>
<el-col :span="8">Flights :</el-col>
<el-col :span="4">{{ flights }}</el-col>
<el-col :span="8">Parking Positions :</el-col>
<el-col :span="4">{{ parking }}</el-col>
</el-row>
<el-row>
<el-col :span="8">Groundnet Nodes :</el-col>
<el-col :span="4">{{groundnet}}</el-col>
<el-col :span="8"></el-col>
<el-col :span="4"></el-col>
</el-row>
</el-tab-pane>
</el-tabs>
</div>
</template>
<script lang="js">
import Frequency from './Frequency'
export default {
import ParkingList from './ParkingList'
export default {
data () {
return { }
return {activeTab: 'first', editLayer: null}
},
components: {
Frequency
Frequency, ParkingList
},
methods: {
addFrequency () {
this.$store.dispatch('addFrequency', {type: 'AWOS', value: 0})
},
initLayer () {
var parent = this.$parent
while (parent !== undefined && parent.$refs.editLayer === undefined) {
parent = parent.$parent
}
if (parent === undefined) {
return
}
this.editLayer = parent.$refs.editLayer
}
},
computed: {
editing: {
get: function () {
return this.$parent.$parent.$parent.$refs.editLayer.editing
if (this.editLayer === null) {
this.initLayer()
}
return this.editLayer.editing
}
},
icao: function () {
return this.$store.state.Editable.data.airport.icao
return this.$store.state.Airports.currentAirport.icao
},
name: function () {
return this.$store.state.Editable.data.airport.name
return this.$store.state.Airports.currentAirport.name
},
flights: function () {
return this.$store.state.Editable.data.airport.flights
return this.$store.state.Airports.currentAirport.flights
},
airlines: function () {
var airlineCodes = []
@ -77,15 +94,17 @@
return airlineCodes
},
groundnet: function () {
return this.$store.state.Editable.data.airport.groundnet
return this.$store.state.Airports.currentAirport.groundnet
},
parking: function () {
return this.$store.state.Editable.data.airport.parking
return this.$store.state.Airports.currentAirport.parking
},
airport: function () {
return this.$store.state.Editable.type === 'airport'
airport: {
get: function () {
return this.$store.state.Airports.currentAirport !== undefined
}
},
Frequencies: {
frequencyList: {
// getter
get: function () {
return this.$store.state.Frequencies.items

View File

@ -3,7 +3,7 @@
<span>
<el-row>
<el-col :span="7">
<el-select v-model="type" placeholder="Select">
<el-select v-model="type" placeholder="Select" :disabled="!editing">
<el-option
v-for="type in options"
:key="type.value"
@ -38,7 +38,7 @@
},
data () {
return {
ok: true
ok: true, editLayer: null
}
},
methods: {
@ -67,11 +67,20 @@
return false
}
return true
},
initLayer() {
var parent = this.$parent
while (parent.$refs.editLayer===undefined) {
parent = parent.$parent
}
this.editLayer = parent.$refs.editLayer
}
},
computed: {
editing: function () {
return this.$parent.$parent.$parent.$parent.$parent.$refs.editLayer.editing
if(this.editLayer=== null)
this.initLayer()
return this.editLayer.editing
},
options: function () {
return [

View File

@ -5,7 +5,7 @@
<ul role="tablist"> <!-- top aligned tabs -->
<li><a href="#home" role="tab"><i class="fa fa-bars"></i></a></li>
<li><a href="#edit" role="tab"><i class="fas fa-edit"></i></a></li>
<li><a href="#parking" role="tab"><i class="fas fa-parking"></i></a></li>
<!--<li><a href="#parking" role="tab"><i class="fas fa-parking"></i></a></li>-->
<li><a href="#check" role="tab"><i class="far fa-check-square"></i></a></li>
<li><a href="#search" role="tab"><i class="fa fa-search"></i></a></li>
<li><a href="#wip" role="tab"><i class="fas fa-wrench"></i></a></li>
@ -25,14 +25,16 @@
Properties
<div class="leaflet-sidebar-close"><i class="fa fa-caret-left"></i></div>
</h1>
<AirportEdit></AirportEdit>
<ParkingEdit></ParkingEdit>
<ArcEdit></ArcEdit>
<NodeEdit></NodeEdit>
<AirportEdit></AirportEdit>
</div>
<!--
<div class="leaflet-sidebar-pane" id="parking">
<ParkingList></ParkingList>
</div>
-->
<div class="leaflet-sidebar-pane" id="search">
<Search></Search>
</div>
@ -64,7 +66,7 @@
import Help from './Help'
import NodeEdit from './NodeEdit'
import ParkingEdit from './ParkingEdit'
import ParkingList from './ParkingList'
// import ParkingList from './ParkingList'
import RunScan from './RunScan'
import SettingsPanel from './SettingsPanel'
import Search from './Search'
@ -72,7 +74,7 @@
export default {
name: 'leaflet-sidebar',
components: { Help, AirportEdit, ArcEdit, CheckPanel, NodeEdit, ParkingEdit, ParkingList, RunScan, FileSelect, SettingsPanel, Search, WorkInProgress },
components: { Help, AirportEdit, ArcEdit, CheckPanel, NodeEdit, ParkingEdit, RunScan, FileSelect, SettingsPanel, Search, WorkInProgress },
props: [],
mounted () {
this.add()

View File

@ -22,12 +22,22 @@
mounted () {
},
data () {
return {
return { editLayer: null
}
},
methods: {
show (idx) {
this.$parent.$parent.$parent.$parent.$parent.$refs.editLayer.show(idx)
if (this.editLayer === null) {
this.initLayer()
}
return this.editLayer.show(idx)
},
initLayer () {
var parent = this.$parent
while (parent.$refs.editLayer === undefined) {
parent = parent.$parent
}
this.editLayer = parent.$refs.editLayer
}
},
computed: {
@ -40,14 +50,11 @@
{value: 'mil-cargo', label: 'military cargo'}
]
},
editing: {
// getter
get: function () {
return this.$parent.$parent.$parent.$parent.$parent.$refs.editLayer.getEditing()
},
// setter
set: function (newValue) {
editing: function () {
if (this.editLayer === null) {
this.initLayer()
}
return this.editLayer.editing
},
name: {
// getter

View File

@ -1,11 +1,13 @@
<template>
<div>
<!--
<h1 class="leaflet-sidebar-header">
Parking List
<div class="leaflet-sidebar-close">
<i class="fa fa-caret-left"></i>
</div>
</h1>
-->
<el-container direction="vertical">
<div v-for="p in parkings" v-bind:key="p.index" class="row">
<ParkingItem :parking="p"></ParkingItem>