mirror of
https://github.com/Spythere/station-manager-2.0.git
synced 2026-05-03 05:28:13 +00:00
feature: vmax i dł. szlaków
This commit is contained in:
+424
-339
@@ -1,339 +1,424 @@
|
||||
<template>
|
||||
<div class="routes-modal" v-if="store.currentStation">
|
||||
<div class="exit" @click="closeRoutesModal">
|
||||
<img src="/icon-exit.svg" alt="exit icon" />
|
||||
</div>
|
||||
|
||||
<div class="modal-wrapper">
|
||||
<h1>Szlaki na scenerii {{ store.currentStation.name }}</h1>
|
||||
|
||||
<ul class="route-list">
|
||||
<li class="route" v-for="(route, i) in computedRouteList" :key="route.routeName + i">
|
||||
<img @click="removeRoute(i)" class="route-delete" src="/icon-trash.svg" alt="icon trash" />
|
||||
|
||||
<form action="javascript:void(0);">
|
||||
<div>Szlak: <input type="text" v-model="route.routeName" /></div>
|
||||
<div>
|
||||
<input
|
||||
type="checkbox"
|
||||
:name="`${route.routeName}-internal`"
|
||||
:id="`${route.routeName}-internal`"
|
||||
v-model="route.routeIsInternal"
|
||||
/>
|
||||
<label :for="`${route.routeName}-internal`">Szlak wewnętrzny</label>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<span>Liczba torów: </span>
|
||||
<input
|
||||
type="radio"
|
||||
:name="`${route.routeName}-tracks`"
|
||||
:id="`${route.routeName}-track1`"
|
||||
:value="Number(1)"
|
||||
:checked="route.routeTracks == 1"
|
||||
v-model="route.routeTracks"
|
||||
/>
|
||||
<label :for="`${route.routeName}-track1`">1</label>
|
||||
|
||||
<input
|
||||
type="radio"
|
||||
:name="`${route.routeName}-tracks`"
|
||||
:id="`${route.routeName}-track2`"
|
||||
:value="Number(2)"
|
||||
:checked="route.routeTracks == 2"
|
||||
v-model="route.routeTracks"
|
||||
/>
|
||||
<label :for="`${route.routeName}-track2`">2</label>
|
||||
</div>
|
||||
<div>
|
||||
<span>Elektryfikacja: </span>
|
||||
|
||||
<input
|
||||
type="radio"
|
||||
:name="`${route.routeName}-electr`"
|
||||
:id="`${route.routeName}-E`"
|
||||
:checked="route.routeElectrification == 'E'"
|
||||
value="E"
|
||||
v-model="route.routeElectrification"
|
||||
/>
|
||||
<label :for="`${route.routeName}-E`">Tak</label>
|
||||
|
||||
<input
|
||||
type="radio"
|
||||
:name="`${route.routeName}-electr`"
|
||||
:id="`${route.routeName}-N`"
|
||||
:checked="route.routeElectrification == 'N'"
|
||||
value="N"
|
||||
v-model="route.routeElectrification"
|
||||
/>
|
||||
<label :for="`${route.routeName}-N`">Nie</label>
|
||||
</div>
|
||||
<div>
|
||||
<span>Typ blokady: </span>
|
||||
|
||||
<input
|
||||
type="radio"
|
||||
:name="`${route.routeName}-block`"
|
||||
:id="`${route.routeName}-PBL`"
|
||||
:checked="route.routeBlockType == 'P'"
|
||||
value="P"
|
||||
v-model="route.routeBlockType"
|
||||
/>
|
||||
<label :for="`${route.routeName}-PBL`">PBL</label>
|
||||
|
||||
<input
|
||||
type="radio"
|
||||
:name="`${route.routeName}-block`"
|
||||
:id="`${route.routeName}-SBL`"
|
||||
:checked="route.routeBlockType == 'S'"
|
||||
value="S"
|
||||
v-model="route.routeBlockType"
|
||||
/>
|
||||
<label :for="`${route.routeName}-SBL`">SBL</label>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<span>Blokada dwukierunkowa: </span>
|
||||
|
||||
<input
|
||||
type="radio"
|
||||
:name="`${route.routeName}-2twb`"
|
||||
:id="`${route.routeName}-twb`"
|
||||
:checked="route.routeHasTwoWayBlock"
|
||||
:value="true"
|
||||
v-model="route.routeHasTwoWayBlock"
|
||||
/>
|
||||
<label :for="`${route.routeName}-twb`">Tak</label>
|
||||
|
||||
<input
|
||||
type="radio"
|
||||
:name="`${route.routeName}-2twb`"
|
||||
:id="`${route.routeName}-notwb`"
|
||||
:checked="!route.routeHasTwoWayBlock"
|
||||
:value="false"
|
||||
v-model="route.routeHasTwoWayBlock"
|
||||
/>
|
||||
<label :for="`${route.routeName}-notwb`">Nie</label>
|
||||
</div>
|
||||
</form>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="routes-actions">
|
||||
<button @click="saveRoutes">Zapisz</button>
|
||||
<button @click="addNewRoute">Dodaj szlak</button>
|
||||
<button @click="closeRoutesModal">Zamknij</button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import changeMixin from '../mixins/changeMixin';
|
||||
import { useStore } from '../store';
|
||||
|
||||
export default defineComponent({
|
||||
setup() {
|
||||
return {
|
||||
store: useStore(),
|
||||
};
|
||||
},
|
||||
|
||||
mixins: [changeMixin],
|
||||
|
||||
data: () => ({
|
||||
currentRoutes: '',
|
||||
routeBackup: '',
|
||||
}),
|
||||
|
||||
computed: {
|
||||
computedRouteList() {
|
||||
if (!this.store.currentStation) return [];
|
||||
|
||||
if (this.currentRoutes.length == 0) return [];
|
||||
|
||||
return this.currentRoutes.split(';').map((route) => {
|
||||
/*
|
||||
Route: !Oc_2EPB
|
||||
! - szlak wewnętrzny (! - tak, brak wykrzyknika - nie)
|
||||
Oc - nazwa scenerii
|
||||
2 - liczba torów (1 lub 2)
|
||||
E - elektryfikacja (E - tak, N - nie)
|
||||
P - rodzaj blokady (P - PBL, S - SBL)
|
||||
B - blokada dwukierunkowa (B - tak, brak litery - nie)
|
||||
*/
|
||||
const routeProps = route.split('_');
|
||||
const routeIsInternal = routeProps[0].startsWith('!');
|
||||
const routeName = routeIsInternal ? routeProps[0].replace('!', '') : routeProps[0];
|
||||
|
||||
const routeSpecs = routeProps[1];
|
||||
return {
|
||||
routeName,
|
||||
routeTracks: Number(routeSpecs[0]),
|
||||
routeElectrification: routeSpecs[1],
|
||||
routeBlockType: routeSpecs[2],
|
||||
routeHasTwoWayBlock: routeSpecs[3] ? true : false,
|
||||
routeIsInternal,
|
||||
};
|
||||
});
|
||||
},
|
||||
},
|
||||
|
||||
mounted() {
|
||||
if (this.store.currentStation) {
|
||||
this.currentRoutes = this.store.currentStation.routes;
|
||||
this.routeBackup = this.currentRoutes;
|
||||
}
|
||||
// console.log(this.currentRoutes + " git");
|
||||
},
|
||||
|
||||
methods: {
|
||||
closeRoutesModal() {
|
||||
this.store.currentStation = null;
|
||||
this.currentRoutes = '';
|
||||
},
|
||||
|
||||
addNewRoute() {
|
||||
this.currentRoutes += (this.currentRoutes.length != 0 ? ';' : '') + `-_1EP`;
|
||||
this.saveRoutes();
|
||||
},
|
||||
|
||||
removeRoute(index: number) {
|
||||
this.currentRoutes = this.currentRoutes
|
||||
.split(';')
|
||||
.filter((_, i) => i != index)
|
||||
.join(';');
|
||||
|
||||
this.saveRoutes();
|
||||
},
|
||||
|
||||
saveRoutes() {
|
||||
const index = this.store.stationList.findIndex((station) => station.name === this.store.currentStation?.name);
|
||||
|
||||
if (index == -1) return;
|
||||
|
||||
const routeString = this.computedRouteList
|
||||
.map(
|
||||
(route) =>
|
||||
`${route.routeIsInternal ? '!' : ''}${route.routeName.trim()}_${route.routeTracks}${
|
||||
route.routeElectrification
|
||||
}${route.routeBlockType}${route.routeHasTwoWayBlock ? 'B' : ''}`
|
||||
)
|
||||
.join(';');
|
||||
|
||||
this.store.stationList[index]['routes'] = routeString;
|
||||
this.currentRoutes = routeString;
|
||||
|
||||
this.addChange(this.store.currentStation!, 'routes', this.routeBackup, routeString);
|
||||
},
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.routes-modal {
|
||||
position: fixed;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
|
||||
width: 90%;
|
||||
max-width: 800px;
|
||||
|
||||
height: 95%;
|
||||
overflow: hidden;
|
||||
padding: 0.5em 0;
|
||||
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
transform: translate(-50%, -50%);
|
||||
z-index: 100;
|
||||
|
||||
background-color: #333;
|
||||
}
|
||||
|
||||
.modal-wrapper {
|
||||
overflow: auto;
|
||||
flex-grow: 2;
|
||||
}
|
||||
|
||||
.routes-modal h1 {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
|
||||
z-index: 100;
|
||||
|
||||
background-color: #333;
|
||||
padding: 0.5em 2em;
|
||||
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.routes-modal label {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.routes-modal .exit {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
z-index: 101;
|
||||
|
||||
cursor: pointer;
|
||||
margin: 0.5em 1.5em;
|
||||
}
|
||||
|
||||
.exit img {
|
||||
width: 2.5em;
|
||||
}
|
||||
|
||||
.routes-modal input {
|
||||
display: inline;
|
||||
padding: 0;
|
||||
margin: 0.5em 0;
|
||||
|
||||
color: black;
|
||||
font-size: 1em;
|
||||
|
||||
max-width: 120px;
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style: none;
|
||||
padding: 0 1em;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
ul li {
|
||||
padding: 0.65em;
|
||||
margin: 0.5em 0;
|
||||
|
||||
position: relative;
|
||||
|
||||
background-color: #222;
|
||||
}
|
||||
|
||||
.route-delete {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
margin: 0.5em;
|
||||
width: 1.15em;
|
||||
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.routes-actions {
|
||||
background-color: #333;
|
||||
width: 100%;
|
||||
|
||||
margin-top: 0.5em;
|
||||
padding: 0.5em 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.routes-actions button {
|
||||
font-size: 1.2em;
|
||||
}
|
||||
</style>
|
||||
<template>
|
||||
<div class="bg" @click="closeRoutesModal"></div>
|
||||
<div class="routes-modal" v-if="store.currentStation">
|
||||
<div class="modal-content">
|
||||
<div class="modal-wrapper">
|
||||
<h1>
|
||||
Szlaki na scenerii {{ store.currentStation.name }}
|
||||
<div class="exit" @click="closeRoutesModal">
|
||||
<img src="/icon-exit.svg" alt="exit icon" />
|
||||
</div>
|
||||
</h1>
|
||||
|
||||
<ul class="route-list">
|
||||
<li class="route" v-for="(route, i) in computedRouteList" :key="route.routeName + i">
|
||||
<form action="javascript:void(0);">
|
||||
<div style="display: flex; justify-content: space-between; align-items: center; gap: 1em">
|
||||
<span>
|
||||
Szlak: <input type="text" v-model="route.routeName" />
|
||||
|
||||
|
||||
<label :for="`${route.routeName}-internal`" style="display: inline-block">
|
||||
<input
|
||||
type="checkbox"
|
||||
:name="`${route.routeName}-internal`"
|
||||
:id="`${route.routeName}-internal`"
|
||||
v-model="route.routeIsInternal"
|
||||
/>
|
||||
WEWNĘTRZNY
|
||||
</label>
|
||||
</span>
|
||||
|
||||
<img @click="removeRoute(i)" class="route-delete" src="/icon-trash.svg" alt="icon trash" />
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<b>Liczba torów:</b>
|
||||
<label class="radio-choice">
|
||||
<input
|
||||
type="radio"
|
||||
:name="`${route.routeName}-tracks`"
|
||||
:id="`${route.routeName}-track1`"
|
||||
:value="1"
|
||||
:checked="route.routeTracks == 1"
|
||||
v-model="route.routeTracks"
|
||||
/>
|
||||
<span>1</span>
|
||||
</label>
|
||||
|
||||
<label class="radio-choice">
|
||||
<input
|
||||
type="radio"
|
||||
:name="`${route.routeName}-tracks`"
|
||||
:id="`${route.routeName}-track2`"
|
||||
:value="Number(2)"
|
||||
:checked="route.routeTracks == 2"
|
||||
v-model="route.routeTracks"
|
||||
/>
|
||||
<span>2</span>
|
||||
</label>
|
||||
</div>
|
||||
<div>
|
||||
<b>Elektryfikacja:</b>
|
||||
|
||||
<label class="radio-choice">
|
||||
<input
|
||||
type="radio"
|
||||
:name="`${route.routeName}-electr`"
|
||||
:id="`${route.routeName}-E`"
|
||||
:checked="route.routeElectrification == 'E'"
|
||||
value="E"
|
||||
v-model="route.routeElectrification"
|
||||
/>
|
||||
<span>Tak</span>
|
||||
</label>
|
||||
|
||||
<label class="radio-choice" :for="`${route.routeName}-N`">
|
||||
<input
|
||||
type="radio"
|
||||
:name="`${route.routeName}-electr`"
|
||||
:id="`${route.routeName}-N`"
|
||||
:checked="route.routeElectrification == 'N'"
|
||||
value="N"
|
||||
v-model="route.routeElectrification"
|
||||
/>
|
||||
<span>Nie</span>
|
||||
</label>
|
||||
</div>
|
||||
<div>
|
||||
<b>Typ blokady:</b>
|
||||
|
||||
<label class="radio-choice">
|
||||
<input
|
||||
type="radio"
|
||||
:name="`${route.routeName}-block`"
|
||||
:id="`${route.routeName}-PBL`"
|
||||
:checked="route.routeBlockType == 'P'"
|
||||
value="P"
|
||||
v-model="route.routeBlockType"
|
||||
/><span>PBL</span>
|
||||
</label>
|
||||
|
||||
<label class="radio-choice">
|
||||
<input
|
||||
type="radio"
|
||||
:name="`${route.routeName}-block`"
|
||||
:id="`${route.routeName}-SBL`"
|
||||
:checked="route.routeBlockType == 'S'"
|
||||
value="S"
|
||||
v-model="route.routeBlockType"
|
||||
/><span>SBL</span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<b>Blokada dwukierunkowa:</b>
|
||||
|
||||
<label class="radio-choice">
|
||||
<input
|
||||
type="radio"
|
||||
:name="`${route.routeName}-2twb`"
|
||||
:id="`${route.routeName}-twb`"
|
||||
:checked="route.routeHasTwoWayBlock"
|
||||
:value="true"
|
||||
v-model="route.routeHasTwoWayBlock"
|
||||
/><span>Tak</span>
|
||||
</label>
|
||||
|
||||
<label class="radio-choice">
|
||||
<input
|
||||
type="radio"
|
||||
:name="`${route.routeName}-2twb`"
|
||||
:id="`${route.routeName}-notwb`"
|
||||
:checked="!route.routeHasTwoWayBlock"
|
||||
:value="false"
|
||||
v-model="route.routeHasTwoWayBlock"
|
||||
/><span>Nie</span>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
<div>Prędkość: <input type="number" v-model="route.routeSpeed" /> km/h</div>
|
||||
<div>Długość: <input type="number" v-model="route.routeLength" /> m</div>
|
||||
</form>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="routes-actions">
|
||||
<button @click="saveRoutes">Zapisz</button>
|
||||
<button @click="addNewRoute">Dodaj szlak</button>
|
||||
<button @click="closeRoutesModal">Zamknij</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { computed, defineComponent, ref } from 'vue';
|
||||
import changeMixin from '../mixins/changeMixin';
|
||||
import { useStore } from '../store';
|
||||
|
||||
export default defineComponent({
|
||||
setup() {
|
||||
const store = useStore();
|
||||
const currentRoutes = ref('');
|
||||
const routeBackup = ref('');
|
||||
|
||||
const computedRouteList = computed(() => {
|
||||
if (!store.currentStation) return [];
|
||||
|
||||
if (currentRoutes.value.length == 0) return [];
|
||||
|
||||
return currentRoutes.value.split(';').map((route) => {
|
||||
/*
|
||||
Route: !Oc_2EPB:100:3000
|
||||
! - szlak wewnętrzny (! - tak, brak wykrzyknika - nie)
|
||||
Oc - nazwa scenerii
|
||||
2 - liczba torów (1 lub 2)
|
||||
E - elektryfikacja (E - tak, N - nie)
|
||||
P - rodzaj blokady (P - PBL, S - SBL)
|
||||
B - blokada dwukierunkowa (B - tak, brak litery - nie)
|
||||
100 - vmax szlaku
|
||||
3000 - dł. szlaku
|
||||
*/
|
||||
const routeProps = route.split('_');
|
||||
const routeIsInternal = routeProps[0].startsWith('!');
|
||||
const routeName = routeIsInternal ? routeProps[0].replace('!', '') : routeProps[0];
|
||||
const routeSpeed = Number(route.split(':')[1]) || 0;
|
||||
const routeLength = Number(route.split(':')[2]) || 0;
|
||||
|
||||
const routeSpecs = routeProps[1];
|
||||
|
||||
return {
|
||||
routeName,
|
||||
routeTracks: Number(routeSpecs[0]),
|
||||
routeElectrification: routeSpecs[1],
|
||||
routeBlockType: routeSpecs[2],
|
||||
routeHasTwoWayBlock: routeSpecs[3] == 'B' ? true : false,
|
||||
routeIsInternal,
|
||||
routeSpeed,
|
||||
routeLength,
|
||||
};
|
||||
});
|
||||
});
|
||||
|
||||
return {
|
||||
store,
|
||||
computedRouteList,
|
||||
currentRoutes,
|
||||
routeBackup,
|
||||
};
|
||||
},
|
||||
|
||||
mixins: [changeMixin],
|
||||
|
||||
data: () => ({}),
|
||||
|
||||
mounted() {
|
||||
if (this.store.currentStation) {
|
||||
this.currentRoutes = this.store.currentStation.routes;
|
||||
this.routeBackup = this.currentRoutes;
|
||||
}
|
||||
},
|
||||
|
||||
methods: {
|
||||
closeRoutesModal() {
|
||||
this.store.currentStation = null;
|
||||
this.currentRoutes = '';
|
||||
},
|
||||
|
||||
addNewRoute() {
|
||||
this.currentRoutes += (this.currentRoutes.length != 0 ? ';' : '') + `-_1EP:0:0`;
|
||||
// this.saveRoutes();
|
||||
},
|
||||
|
||||
removeRoute(index: number) {
|
||||
this.currentRoutes = this.currentRoutes
|
||||
.split(';')
|
||||
.filter((_, i) => i != index)
|
||||
.join(';');
|
||||
|
||||
// this.saveRoutes();
|
||||
},
|
||||
|
||||
parseRoutes() {
|
||||
const routeString = this.computedRouteList
|
||||
.map(
|
||||
(route) =>
|
||||
`${route.routeIsInternal ? '!' : ''}${route.routeName.trim()}_${route.routeTracks}${
|
||||
route.routeElectrification
|
||||
}${route.routeBlockType}${route.routeHasTwoWayBlock ? 'B' : ''}:${route.routeSpeed || 0}:${
|
||||
route.routeLength || 0
|
||||
}`
|
||||
)
|
||||
.join(';');
|
||||
|
||||
return routeString;
|
||||
},
|
||||
|
||||
saveRoutes() {
|
||||
const index = this.store.stationList.findIndex((station) => station.name === this.store.currentStation?.name);
|
||||
|
||||
if (index == -1) return;
|
||||
|
||||
const routeString = this.parseRoutes();
|
||||
|
||||
this.addChange(this.store.currentStation!, 'routes', this.routeBackup, routeString);
|
||||
this.store.stationList[index]['routes'] = routeString;
|
||||
this.currentRoutes = routeString;
|
||||
},
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.bg {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
|
||||
z-index: 100;
|
||||
|
||||
background-color: #00000081;
|
||||
}
|
||||
|
||||
.routes-modal {
|
||||
position: fixed;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
|
||||
width: 95%;
|
||||
max-width: 800px;
|
||||
|
||||
height: 95vh;
|
||||
max-height: 1000px;
|
||||
|
||||
transform: translate(-50%, -50%);
|
||||
z-index: 101;
|
||||
padding: 0.5em 0;
|
||||
|
||||
background-color: #333;
|
||||
border-radius: 1rem;
|
||||
|
||||
input {
|
||||
display: inline;
|
||||
margin: 0.25em 0;
|
||||
|
||||
color: black;
|
||||
font-size: 1em;
|
||||
|
||||
max-width: 120px;
|
||||
}
|
||||
}
|
||||
|
||||
label.radio-choice {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
|
||||
background-color: #333;
|
||||
margin: 0.25em;
|
||||
cursor: pointer;
|
||||
|
||||
input {
|
||||
position: absolute;
|
||||
opacity: 0;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
span {
|
||||
display: flex;
|
||||
padding: 0.25em 0.75em;
|
||||
}
|
||||
|
||||
input:checked + span {
|
||||
color: gold;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
input:focus-visible + span {
|
||||
outline: 1px solid white;
|
||||
}
|
||||
}
|
||||
|
||||
.exit {
|
||||
img {
|
||||
vertical-align: text-bottom;
|
||||
width: 1.4em;
|
||||
}
|
||||
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
h1 {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
gap: 0.5em;
|
||||
|
||||
position: sticky;
|
||||
top: -1px;
|
||||
|
||||
z-index: 100;
|
||||
|
||||
background-color: #333;
|
||||
border-radius: 1rem 1rem 0 0;
|
||||
padding: 0.25em 0.5em;
|
||||
margin: 0;
|
||||
|
||||
font-size: 2em;
|
||||
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.modal-content {
|
||||
display: grid;
|
||||
grid-template-rows: 1fr auto;
|
||||
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.modal-wrapper {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.routes-modal ul {
|
||||
list-style: none;
|
||||
padding: 0 1em;
|
||||
margin: 0;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
ul li {
|
||||
padding: 0.65em;
|
||||
margin: 0.5em 0;
|
||||
|
||||
position: relative;
|
||||
|
||||
background-color: #222;
|
||||
}
|
||||
|
||||
.route-delete {
|
||||
margin: 0.5em;
|
||||
width: 1.15em;
|
||||
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.routes-actions {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
gap: 0.5em;
|
||||
background-color: #333;
|
||||
width: 100%;
|
||||
|
||||
padding: 0.5em 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.routes-actions button {
|
||||
font-size: 1.2em;
|
||||
margin: 0;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -117,7 +117,7 @@ export default defineComponent({
|
||||
: changeItem[propChange];
|
||||
|
||||
if (propChange == 'availability') value = getAvailabilityValue(changeItem[propChange] as Availability);
|
||||
if (propChange == 'routes') value = this.getRouteNames(changeItem[propChange] as string);
|
||||
if (propChange == 'routes') value = this.getRouteNames(changeItem[propChange] as string, true);
|
||||
|
||||
itemChanges.push(`<i>${(HeaderTypes as any)[propChange]}:</i> ${value || '-'}`);
|
||||
}
|
||||
@@ -173,7 +173,7 @@ export default defineComponent({
|
||||
return { ...v };
|
||||
});
|
||||
|
||||
const updateResData = (await this.store.updateSceneriesData(mappedChangeList)).data
|
||||
const updateResData = (await this.store.updateSceneriesData(mappedChangeList)).data;
|
||||
this.store.changesResponse = updateResData;
|
||||
|
||||
this.store.fetchSceneriesData();
|
||||
@@ -207,7 +207,7 @@ export default defineComponent({
|
||||
signalType: 'współczesna',
|
||||
controlType: 'SCS',
|
||||
SUP: false,
|
||||
routes: 'Test_1EPB"',
|
||||
routes: 'Test_1EPB:0:0',
|
||||
checkpoints: '',
|
||||
authors: '',
|
||||
availability: 'default',
|
||||
|
||||
Reference in New Issue
Block a user