Spythere/genera-tor
1
0
Fork 0
mirror of https://github.com/Spythere/genera-tor.git synced 2026-05-03 13:38:12 +00:00
Code Issues Packages Projects Releases Wiki Activity

Dodano bloczki rozkazów S i N

Browse Source
This commit is contained in:
Spythere
2022-06-09 00:19:53 +02:00
parent 35af97d354
commit 67cfb93cb0
12 changed files with 27840 additions and 7627 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/App.vue
+15 -18
View File
@@ -1,30 +1,27 @@
<template>
<div id="nav">
<router-link to="/">Home</router-link> |
<router-link to="/about">About</router-link>
<div id="app_wrapper">
<router-view />
</div>
<router-view/>
</template>
<style lang="scss">
@import './styles/global.scss';
#app {
font-family: Avenir, Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-align: center;
color: #2c3e50;
background-color: $bgCol;
color: white;
min-height: 100vh;
}
#nav {
padding: 30px;
#app_wrapper {
padding: 0.5em;
}
a {
font-weight: bold;
color: #2c3e50;
&.router-link-exact-active {
color: #42b983;
}
@media screen and (max-width: 500px) {
#app {
font-size: calc(1vw + 0.5rem);
}
}
</style>
src/components/HelloWorld.vue
-65
View File
@@ -1,65 +0,0 @@
<template>
<div class="hello">
<h1>{{ msg }}</h1>
<p>
For a guide and recipes on how to configure / customize this project,<br>
check out the
<a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>.
</p>
<h3>Installed CLI Plugins</h3>
<ul>
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel" target="_blank" rel="noopener">babel</a></li>
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-router" target="_blank" rel="noopener">router</a></li>
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-vuex" target="_blank" rel="noopener">vuex</a></li>
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint" target="_blank" rel="noopener">eslint</a></li>
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-typescript" target="_blank" rel="noopener">typescript</a></li>
</ul>
<h3>Essential Links</h3>
<ul>
<li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li>
<li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li>
<li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li>
<li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li>
<li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li>
</ul>
<h3>Ecosystem</h3>
<ul>
<li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li>
<li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li>
<li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li>
<li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li>
<li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li>
</ul>
</div>
</template>
<script lang="ts">
import { Options, Vue } from 'vue-class-component';
@Options({
props: {
msg: String
}
})
export default class HelloWorld extends Vue {
msg!: string
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="scss">
h3 {
margin: 40px 0 0;
}
ul {
list-style-type: none;
padding: 0;
}
li {
display: inline-block;
margin: 0 10px;
}
a {
color: #42b983;
}
</style>
src/components/OrderN.vue
+207
View File
@@ -0,0 +1,207 @@
<template>
<div class="rozkaz rozkaz-n">
<section class="header">
<h2 class="flex-center">
Rozkaz pisemny "N" nr
<input type="text" v-model="orderNo" />
</h2>
<div class="flex-row">
dla pociągu nr <input type="text" v-model="trainNo" /> dnia <input type="text" v-model="date" />
{{ new Date().getUTCFullYear() }}r.
</div>
</section>
<section class="table-section">
<table class="options-table">
<tbody>
<tr>
<td>1</td>
<td>
Od <input type="text" v-model="row1.from" /> do <input type="text" v-model="row1.to" /> tor nr
<input type="text" v-model="row1.trackNo" /> jest zamknięty, ruch jednotorowy dwukierunkowy wprowadzono po
torze nr <input type="text" v-model="row1.trackNo2" />
</td>
</tr>
<tr>
<td>2</td>
<td>
<strong>ZEZWALAM</strong> po otrzymaniu
<select id="select-2a" v-model="row2.choice1">
<option value="option-2a-1" :checked="row2.choice1 == 'option-2a-1'">sygnału "Nakaz Jazdy"</option>
<option value="option-2a-2" :checked="row2.choice1 == 'option-2a-2'">tylko tego rozkazu pisemnego</option>
</select>
{{ row2.choice1 }}
<div style="margin-top: 0.5rem">
<input type="radio" name="section-2" id="checkbox-2a" />
<label for="checkbox-2a">
przejechać obok wskazującego sygnał "Stój" semafora wyjazdowego <input type="text" /> i wyjechać w
kierunku <input type="text" /> na tor szlakowy
<select>
<option value="lewy">lewy</option>
<option value="prawy">prawy</option>
</select>
nr <input type="text" />
</label>
</div>
<div style="margin-top: 0.5rem">
<input type="radio" name="section-2" id="checkbox-2b" />
<label for="checkbox-2b">
z toru nr <input type="text" /> nie posiadającego semafora wyjazdowego wyjechać w kierunku
<input type="text" /> na tor szlakowy
<select>
<option value="lewy">lewy</option>
<option value="prawy">prawy</option>
</select>
nr <input type="text" />
</label>
</div>
</td>
</tr>
<tr>
<td>3</td>
<td>
<select>
<option value="jazda">Jazda</option>
<option value="popychanie">Popychanie</option>
</select>
pociągu odbędzie się w kierunku: <input type="text" /> do km <input type="text" /> skąd
<select>
<option value="pociąg">pociąg</option>
<option value="popychacz">popychacz</option>
</select>
ma wrócić po torze lewym nr <input type="text" /> najpóźniej o godz. <input type="text" /> min.
<input type="text" />
</td>
</tr>
<tr>
<td>4</td>
<td>
<strong>WJAZD</strong> z toru szlakowego nr <input type="text" /> na
<select>
<option value="stację">stację</option>
<option value="posterunek odgałęźny">posterunek odgałęźny</option>
</select>
<input type="text" /> odbędzie się po otrzymaniu:
<div style="margin-top: 0.5rem">
<input type="radio" name="section-4" id="checkbox-4a" />
<label for="checkbox-4a">
sygnału zastępczego "Sz" na osobnym urządzeniu ustawionym z
<select>
<option value="lewej">lewej</option>
<option value="prawej">prawej</option>
</select>
strony toru
</label>
</div>
<div style="margin-top: 0.5rem">
<input type="radio" name="section-4" id="checkbox-4b" />
<label for="checkbox-4b">
rozkazu pisemnego "N" (doręczonego lub przekazanego przez urządzenia łączności)
</label>
</div>
</td>
</tr>
<tr>
<td>5</td>
<td>
<strong>ZEZWALAM</strong> wjechać z toru szlakowego nr <input type="text" /> z kierunku
<input type="text" /> na
<select>
<option value="stację">stację</option>
<option value="posterunek odgałęźny">posterunek odgałęźny</option>
</select>
i przejechać obok sygnału "Stój" na <input type="text" />
</td>
</tr>
</tbody>
</table>
</section>
<section class="info">
<table class="info-table">
<tbody>
<tr>
<td colspan="4">
<input type="text" />
<br />
stacja
</td>
<td colspan="3">
<input type="text" />
<br />
posterunek
</td>
<td colspan="2">
<input type="text" />
<br />
godz.
</td>
<td colspan="1">
<input type="text" />
<br />
min.
</td>
</tr>
<tr>
<td colspan="5">
<input type="text" />
<br />
dyżurny ruchu
</td>
<td colspan="5">
<input type="text" />
<br />
z polecenia dyżurnego ruchu
</td>
</tr>
</tbody>
</table>
</section>
</div>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
export default defineComponent({
data() {
return {
orderNo: '',
trainNo: '',
date: '',
row1: {
from: '',
to: '',
trackNo: '',
trackNo2: '',
},
row2: {
choice1: 'option-2a-1',
choice2: '',
}
};
},
});
</script>
<style lang="scss" scoped>
@import '../styles/rozkaz.scss';
</style>
src/components/OrderS.vue
+139
View File
@@ -0,0 +1,139 @@
<template>
<div class="rozkaz rozkaz-n">
<section class="header">
<h2 class="flex-center">
Rozkaz pisemny "S" nr
<input type="text" />
</h2>
<div class="flex-row">
dla
<select id="select-header">
<option value="pociągu">pociągu</option>
<option value="manewru">manewru</option>
</select>
nr <input type="text" /> dnia <input type="text" /> {{ new Date().getUTCFullYear() }}r.
</div>
</section>
<section class="table-section">
<table class="options-table">
<tbody>
<tr>
<td>1</td>
<td>
zezwalam po otrzymaniu
<select id="select-1a">
<option value="sygnału">sygnału "nakaz jazdy"</option>
<option value="rozkazu">tylko tego rozkazu pisemnego</option>
</select>
<div style="margin-top: 0.5rem">
<input type="checkbox" name="section-1a" id="checkbox-1a" />
<label for="checkbox-1a">
przejechać obok wskazującego sygnał "Stój" semafora wyjazdowego <input type="text" />
<br />
drogowskazowego <input type="text" />
<br />
(odnoszącego się do wyjazdu pociągu)
</label>
</div>
<hr />
<div style="margin-top: 0.5rem">
<input type="checkbox" name="section-1b" id="checkbox-1b" />
<label for="checkbox-1b">
wyjechać z toru nr <input type="text" /> nie posiadającego semafora wyjazdowego
</label>
</div>
</td>
</tr>
<tr>
<td>2</td>
<td>
zezwalam przejechać obok wskazującego sygnał "Stój" semafora:
<div>- wjazdowego <input type="text" /></div>
<div>
- drogowskazowego <input type="text" />
<div>&nbsp;&nbsp;(odnoszącego się do wjazdu pociągu)</div>
</div>
<div>- odstępowego <input type="text" /></div>
<div>- wjechać z zamkniętego toru nr <input type="text" /> nie posiadającego semafora wjazdowego</div>
</td>
</tr>
<tr>
<td>3</td>
<td>
Od <input type="text" /> do <input type="text" /> po torze nr <input type="text" /> ruch pociągów
prowadzony jest w odstępie posterunków następczych. Wskazania semaforów sbl są nieważne. Zachować
ostrożność od ostatniego semafora ze wskaźnikiem "W18". Szlak wolny, ostatni pociąg nr
<input type="text" /> przybył do <input type="text" /> o godzinie <input type="text" />
</td>
</tr>
</tbody>
</table>
</section>
<section class="info">
<table class="info-table">
<tbody>
<tr>
<td colspan="4">
<input type="text" />
<br />
stacja
</td>
<td colspan="3">
<input type="text" />
<br />
posterunek
</td>
<td colspan="2">
<input type="text" />
<br />
godz.
</td>
<td colspan="1">
<input type="text" />
<br />
min.
</td>
</tr>
<tr>
<td colspan="5">
<input type="text" />
<br />
dyżurny ruchu
</td>
<td colspan="5">
<input type="text" />
<br />
z polecenia dyżurnego ruchu
</td>
</tr>
</tbody>
</table>
</section>
</div>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
export default defineComponent({
setup() {
return {};
},
});
</script>
<style lang="scss" scoped>
@import '../styles/rozkaz.scss';
</style>
src/router/index.ts
+2 -10
View File
@@ -1,4 +1,4 @@
import { createRouter, createWebHashHistory, RouteRecordRaw } from 'vue-router'
import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router'
import Home from '../views/Home.vue'
const routes: Array<RouteRecordRaw> = [
@@ -7,18 +7,10 @@ const routes: Array<RouteRecordRaw> = [
name: 'Home',
component: Home
},
{
path: '/about',
name: 'About',
// route level code-splitting
// this generates a separate chunk (about.[hash].js) for this route
// which is lazy-loaded when the route is visited.
component: () => import(/* webpackChunkName: "about" */ '../views/About.vue')
}
]
const router = createRouter({
history: createWebHashHistory(),
history: createWebHistory(),
routes
})
src/styles/global.scss
+9
View File
@@ -0,0 +1,9 @@
$bgCol: #012E40;
$accentCol: #F28705;
body, html {
padding: 0;
margin: 0;
min-height: 100vh;
}
src/styles/rozkaz.scss
+97
View File
@@ -0,0 +1,97 @@
.rozkaz {
width: 500px;
background-color: white;
color: black;
padding: 0.5em;
box-shadow: 0 0 15px 2px white;
h2 {
margin: 0;
padding: 0;
}
.header {
padding: 0.5em;
border: 2px solid black;
border-bottom: none;
}
}
.flex-row {
display: flex;
justify-content: space-between;
align-items: flex-end;
}
.flex-center {
display: flex;
justify-content: center;
align-items: center;
}
input {
max-width: 100px;
background-color: transparent;
outline: none;
border: none;
border-bottom: 2px dotted black;
font-size: 0.9em;
text-align: center;
color: black;
}
select {
margin-top: 0.5rem;
margin-right: 0.5rem;
font-size: 0.8rem;
}
.table-section {
table {
width: 100%;
td:first-child {
width: 10%;
text-align: center;
vertical-align: top;
font-weight: bold;
}
td {
padding: 0.35em;
text-align: justify;
line-height: 1.4em;
}
}
table,
td {
border: 2px solid black;
border-collapse: collapse;
}
}
table.info-table {
border-collapse: collapse;
width: 100%;
table-layout: fixed;
td {
border: 2px solid black;
border-collapse: collapse;
padding: 0.35em;
}
input {
max-width: 95%;
}
text-align: center;
}
src/views/About.vue
-5
View File
@@ -1,5 +0,0 @@
<template>
<div class="about">
<h1>This is an about page</h1>
</div>
</template>
src/views/Home.vue
+21 -10
View File
@@ -1,18 +1,29 @@
<template>
<div class="home">
<img alt="Vue logo" src="../assets/logo.png">
<HelloWorld msg="Welcome to Your Vue.js + TypeScript App"/>
<OrderN />
<OrderS v-if="false" />
</div>
</template>
<script lang="ts">
import { Options, Vue } from 'vue-class-component';
import HelloWorld from '@/components/HelloWorld.vue'; // @ is an alias to /src
import OrderN from '@/components/OrderN.vue';
import OrderS from '@/components/OrderS.vue';
import { defineComponent } from 'vue';
@Options({
components: {
HelloWorld,
},
})
export default class Home extends Vue {}
export default defineComponent({
components: { OrderN, OrderS },
});
</script>
<style lang="scss" scoped>
.home {
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
overflow-x: auto;
}
</style>