dodano pole do ukrywania szlaków

This commit is contained in:
2024-01-03 17:09:09 +01:00
parent 39d6213e4f
commit 97bc6db1c4
8 changed files with 214 additions and 129 deletions
+28 -46
View File
@@ -14,45 +14,34 @@
<li class="route" v-for="(route, i) in currentRoutes" :key="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" />
&nbsp;
<span> Szlak: <input type="text" v-model="route.routeName" /> </span>
<label :for="`${route.routeName}-internal`" style="display: inline-block">
<input
type="checkbox"
:name="`${route.routeName}-internal`"
:id="`${route.routeName}-internal`"
v-model="route.isInternal"
/>
WEWNĘTRZNY
</label>
</span>
<button class="btn--icon">
<img @click="removeRoute(i)" class="route-delete" src="/icon-trash.svg" alt="icon trash" />
</button>
</div>
<img @click="removeRoute(i)" class="route-delete" src="/icon-trash.svg" alt="icon trash" />
<div>
<label :for="`${route.routeName}-internal`" style="display: inline-block">
<input type="checkbox" :name="`${route.routeName}-internal`" :id="`${route.routeName}-internal`" v-model="route.isInternal" />
WEWNĘTRZNY
</label>
&nbsp;
<label :for="`${route.routeName}-hidden`" style="display: inline-block">
<input type="checkbox" :name="`${route.routeName}-hidden`" :id="`${route.routeName}-hidden`" v-model="route.hidden" />
UKRYTY
</label>
</div>
<div>
<b>Liczba torów:</b>
<label class="radio-choice">
<input
type="radio"
:name="`${route.routeName}-tracks`"
:value="1"
:checked="route.routeTracks == 1"
v-model="route.routeTracks"
/>
<input type="radio" :name="`${route.routeName}-tracks`" :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`"
:value="2"
:checked="route.routeTracks == 2"
v-model="route.routeTracks"
/>
<input type="radio" :name="`${route.routeName}-tracks`" :value="2" :checked="route.routeTracks == 2" v-model="route.routeTracks" />
<span>2</span>
</label>
</div>
@@ -60,24 +49,12 @@
<b>Elektryfikacja:</b>
<label class="radio-choice">
<input
type="radio"
:name="`${route.routeName}-electr`"
:value="true"
:checked="route.isElectric"
v-model="route.isElectric"
/>
<input type="radio" :name="`${route.routeName}-electr`" :value="true" :checked="route.isElectric" v-model="route.isElectric" />
<span>Tak</span>
</label>
<label class="radio-choice">
<input
type="radio"
:name="`${route.routeName}-electr`"
:value="false"
:checked="!route.isElectric"
v-model="route.isElectric"
/>
<input type="radio" :name="`${route.routeName}-electr`" :value="false" :checked="!route.isElectric" v-model="route.isElectric" />
<span>Nie</span>
</label>
</div>
@@ -183,9 +160,9 @@ export default defineComponent({
const routeString = this.store.currentStation?.routesInfo
.map(
(route) =>
`${route.isInternal ? '!' : ''}${route.routeName.trim()}_${route.routeTracks}${
route.isElectric ? 'E' : 'N'
}${route.isRouteSBL ? 'S' : 'P'}:${route.routeSpeed || 0}:${route.routeLength || 0}`
`${route.isInternal ? '!' : ''}${route.routeName.trim()}_${route.routeTracks}${route.isElectric ? 'E' : 'N'}${
route.isRouteSBL ? 'S' : 'P'
}:${route.routeSpeed || 0}:${route.routeLength || 0}`
)
.join(';');
@@ -334,6 +311,12 @@ ul li {
background-color: #222;
}
li > form {
display: flex;
flex-direction: column;
gap: 0.25em;
}
.route-delete {
margin: 0.5em;
width: 1.15em;
@@ -346,7 +329,6 @@ ul li {
justify-content: center;
flex-wrap: wrap;
gap: 0.5em;
background-color: #333;
width: 100%;
padding: 0.5em 0;