mirror of
https://github.com/Spythere/stacjownik.git
synced 2026-05-03 05:18:11 +00:00
Migracja na Vite
This commit is contained in:
@@ -1,5 +0,0 @@
|
|||||||
module.exports = {
|
|
||||||
presets: [
|
|
||||||
'@vue/cli-plugin-babel/preset'
|
|
||||||
]
|
|
||||||
}
|
|
||||||
@@ -0,0 +1 @@
|
|||||||
|
if('serviceWorker' in navigator) navigator.serviceWorker.register('/dev-sw.js?dev-sw', { scope: '/' })
|
||||||
@@ -0,0 +1 @@
|
|||||||
|
if(!self.define){let e,n={};const t=(t,s)=>(t=new URL(t+".js",s).href,n[t]||new Promise((n=>{if("document"in self){const e=document.createElement("script");e.src=t,e.onload=n,document.head.appendChild(e)}else e=t,importScripts(t),n()})).then((()=>{let e=n[t];if(!e)throw new Error(`Module ${t} didn’t register its module`);return e})));self.define=(s,i)=>{const r=e||("document"in self?document.currentScript.src:"")||location.href;if(n[r])return;let o={};const c=e=>t(e,r),d={module:{uri:r},exports:o,require:c};n[r]=Promise.all(s.map((e=>d[e]||c(e)))).then((e=>(i(...e),o)))}}define(["./workbox-dc995b65"],(function(e){"use strict";self.skipWaiting(),e.clientsClaim(),e.precacheAndRoute([{url:"registerSW.js",revision:"45c386425cfd92fb1bfeb9cd473a7d0d"},{revision:null,url:"index.html"}],{}),e.cleanupOutdatedCaches(),e.registerRoute(new e.NavigationRoute(e.createHandlerBoundToURL("index.html"),{denylist:[/^\/manifest.webmanifest$/]})),e.registerRoute(/^https:\/\/stacjownik.eu-4.evennode.com\/api\/getSceneries/,new e.NetworkFirst({cacheName:"sceneries-cache",plugins:[new e.ExpirationPlugin({maxEntries:200,maxAgeSeconds:5184e3}),new e.CacheableResponsePlugin({statuses:[0,200]})]}),"GET")}));
|
||||||
File diff suppressed because one or more lines are too long
@@ -1,54 +1,48 @@
|
|||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="pl">
|
<html lang="pl">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="utf-8" />
|
<meta charset="utf-8" />
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
||||||
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
|
||||||
|
|
||||||
<meta name="keywords" content="Stacjownik, TD2, Train Driver 2, stacjownik-td2" />
|
<meta name="keywords" content="Stacjownik, TD2, Train Driver 2, stacjownik-td2" />
|
||||||
<meta name="description" content="Automatycznie odświeżana strona wyświetlająca stacje w Train Driver 2!" />
|
<meta name="description" content="Automatycznie odświeżana strona wyświetlająca stacje w Train Driver 2!" />
|
||||||
|
|
||||||
<title>Stacjownik</title>
|
<title>Stacjownik</title>
|
||||||
|
|
||||||
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
|
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
|
||||||
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
|
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
|
||||||
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
|
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
|
||||||
<link rel="manifest" href="/site.webmanifest" />
|
<link rel="manifest" href="/site.webmanifest" />
|
||||||
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5" />
|
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5" />
|
||||||
<meta name="msapplication-TileColor" content="#da532c" />
|
<meta name="msapplication-TileColor" content="#da532c" />
|
||||||
<meta name="theme-color" content="#ffffff" />
|
<meta name="theme-color" content="#ffffff" />
|
||||||
|
|
||||||
<link rel="icon" href="favicon-64.png" sizes="64x64" type="image/png" />
|
<link rel="icon" href="favicon-64.png" sizes="64x64" type="image/png" />
|
||||||
<link rel="icon" href="favicon-32.png" sizes="32x32" type="image/png" />
|
<link rel="icon" href="favicon-32.png" sizes="32x32" type="image/png" />
|
||||||
<link rel="icon" href="favicon-62.png" sizes="62x62" type="image/png" />
|
<link rel="icon" href="favicon-62.png" sizes="62x62" type="image/png" />
|
||||||
<link rel="icon" href="favicon-16.png" sizes="16x16" type="image/png" />
|
<link rel="icon" href="favicon-16.png" sizes="16x16" type="image/png" />
|
||||||
<link rel="icon" href="favicon.ico" />
|
<link rel="icon" href="favicon.ico" />
|
||||||
|
|
||||||
<link href="https://fonts.googleapis.com/css2?family=Quicksand:wght@400;500;700&display=swap" rel="stylesheet" />
|
<link href="https://fonts.googleapis.com/css2?family=Quicksand:wght@400;500;700&display=swap" rel="stylesheet" />
|
||||||
|
|
||||||
<script src="https://www.gstatic.com/firebasejs/8.1.1/firebase-app.js"></script>
|
<script src="https://www.gstatic.com/firebasejs/8.1.1/firebase-app.js"></script>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
const firebaseConfig = {
|
const firebaseConfig = {
|
||||||
apiKey: 'AIzaSyBI36X2-p7vU1flxoJdCEc0noByyTe1mpw',
|
apiKey: 'AIzaSyBI36X2-p7vU1flxoJdCEc0noByyTe1mpw',
|
||||||
authDomain: 'stacjownik-td2.firebaseapp.com',
|
authDomain: 'stacjownik-td2.firebaseapp.com',
|
||||||
databaseURL: 'https://stacjownik-td2.firebaseio.com',
|
databaseURL: 'https://stacjownik-td2.firebaseio.com',
|
||||||
projectId: 'stacjownik-td2',
|
projectId: 'stacjownik-td2',
|
||||||
storageBucket: 'stacjownik-td2.appspot.com',
|
storageBucket: 'stacjownik-td2.appspot.com',
|
||||||
};
|
};
|
||||||
|
|
||||||
firebase.initializeApp(firebaseConfig);
|
firebase.initializeApp(firebaseConfig);
|
||||||
</script>
|
</script>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<noscript>
|
<div id="app"></div>
|
||||||
<strong
|
<script type="module" src="/src/main.ts"></script>
|
||||||
>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please
|
</body>
|
||||||
enable it to continue.</strong
|
</html>
|
||||||
>
|
|
||||||
</noscript>
|
|
||||||
<div id="app"></div>
|
|
||||||
<!-- built files will be auto injected -->
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
Generated
-22580
File diff suppressed because it is too large
Load Diff
+11
-17
@@ -3,10 +3,9 @@
|
|||||||
"version": "1.10.1-alpha",
|
"version": "1.10.1-alpha",
|
||||||
"private": true,
|
"private": true,
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"serve": "vue-cli-service serve",
|
"dev": "vite",
|
||||||
"build": "vue-cli-service build",
|
"build": "vue-tsc --noEmit && vite build",
|
||||||
"deploy-dev": "npm run build && firebase deploy --only hosting:dev",
|
"preview": "vite preview"
|
||||||
"deploy-prod": "npm run build && firebase deploy --only hosting:prod"
|
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"core-js": "^3.12.1",
|
"core-js": "^3.12.1",
|
||||||
@@ -15,25 +14,20 @@
|
|||||||
"howler": "^2.2.1",
|
"howler": "^2.2.1",
|
||||||
"pinia": "^2.0.14",
|
"pinia": "^2.0.14",
|
||||||
"register-service-worker": "^1.7.1",
|
"register-service-worker": "^1.7.1",
|
||||||
|
"sass": "^1.53.0",
|
||||||
"socket.io-client": "^4.4.1",
|
"socket.io-client": "^4.4.1",
|
||||||
"vue": "^3.2.34",
|
"vue": "^3.2.37",
|
||||||
"vue-i18n": "^9.1.6",
|
"vue-i18n": "^9.1.6",
|
||||||
"vue-router": "^4.0.0-0",
|
"vue-router": "^4.0.0-0"
|
||||||
"vuex": "^4.0.2"
|
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@types/node": "^17.0.35",
|
"@types/node": "^17.0.35",
|
||||||
"@vue/cli-plugin-babel": "^5.0.4",
|
"@vitejs/plugin-vue": "^3.0.0",
|
||||||
"@vue/cli-plugin-pwa": "^5.0.4",
|
|
||||||
"@vue/cli-plugin-router": "^5.0.4",
|
|
||||||
"@vue/cli-plugin-typescript": "^5.0.4",
|
|
||||||
"@vue/cli-plugin-vuex": "^5.0.4",
|
|
||||||
"@vue/cli-service": "^5.0.4",
|
|
||||||
"@vue/compiler-sfc": "^3.1.0",
|
|
||||||
"axios": "^0.21.1",
|
"axios": "^0.21.1",
|
||||||
"sass": "^1.32.13",
|
"typescript": "^4.6.4",
|
||||||
"sass-loader": "^8.0.2",
|
"vite": "^3.0.0",
|
||||||
"typescript": "^4.7.3"
|
"vite-plugin-pwa": "^0.12.3",
|
||||||
|
"vue-tsc": "^0.38.4"
|
||||||
},
|
},
|
||||||
"browserslist": [
|
"browserslist": [
|
||||||
"> 1%",
|
"> 1%",
|
||||||
|
|||||||
+16
-25
@@ -12,16 +12,16 @@
|
|||||||
<div class="header_container">
|
<div class="header_container">
|
||||||
<div class="header_icons">
|
<div class="header_icons">
|
||||||
<span class="icons-top">
|
<span class="icons-top">
|
||||||
<img :src="icons.pl" alt="icon-pl" @click="changeLang('en')" v-if="currentLang == 'pl'" />
|
<img :src="getIcon('pl')" alt="icon-pl" @click="changeLang('en')" v-if="currentLang == 'pl'" />
|
||||||
<img :src="icons.en" alt="icon-en" @click="changeLang('pl')" v-else />
|
<img :src="getIcon('en', 'jpg')" alt="icon-en" @click="changeLang('pl')" v-else />
|
||||||
</span>
|
</span>
|
||||||
<span class="icons-bottom">
|
<span class="icons-bottom">
|
||||||
<a href="https://www.paypal.com/paypalme/spythere" target="_blank">
|
<a href="https://www.paypal.com/paypalme/spythere" target="_blank">
|
||||||
<img :src="icons.dollar" alt="icon paypal" />
|
<img :src="getIcon('dollar')" alt="icon paypal" />
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
<a href="https://discord.gg/x2mpNN3svk" target="_blank">
|
<a href="https://discord.gg/x2mpNN3svk" target="_blank">
|
||||||
<img :src="icons.discord" alt="icon discord" />
|
<img :src="getIcon('discord', 'png')" alt="icon discord" />
|
||||||
</a>
|
</a>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
@@ -29,18 +29,18 @@
|
|||||||
<div class="header_body">
|
<div class="header_body">
|
||||||
<status-indicator />
|
<status-indicator />
|
||||||
<span class="header_brand">
|
<span class="header_brand">
|
||||||
<img :src="brand_logo" alt="Stacjownik" />
|
<img :src="getImage('stacjownik-header-logo.svg')" alt="Stacjownik" />
|
||||||
</span>
|
</span>
|
||||||
|
|
||||||
<span class="header_info">
|
<span class="header_info">
|
||||||
<Clock />
|
<Clock />
|
||||||
|
|
||||||
<div class="info_counter">
|
<div class="info_counter">
|
||||||
<img src="@/assets/icon-dispatcher.svg" alt="icon dispatcher" />
|
<img :src="getIcon('dispatcher')" alt="icon dispatcher" />
|
||||||
<span class="text--primary">{{ onlineDispatchers.length }}</span>
|
<span class="text--primary">{{ onlineDispatchers.length }}</span>
|
||||||
<span class="text--grayed"> / </span>
|
<span class="text--grayed"> / </span>
|
||||||
<span class="text--primary">{{ trainList.length }}</span>
|
<span class="text--primary">{{ trainList.length }}</span>
|
||||||
<img src="@/assets/icon-train.svg" alt="icon train" />
|
<img :src="getIcon('train')" alt="icon train" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<span class="info_region">
|
<span class="info_region">
|
||||||
@@ -55,7 +55,7 @@
|
|||||||
/
|
/
|
||||||
<router-link class="route" active-class="route-active" to="/trains">{{ $t('app.trains') }}</router-link>
|
<router-link class="route" active-class="route-active" to="/trains">{{ $t('app.trains') }}</router-link>
|
||||||
/
|
/
|
||||||
<router-link class="route" active-class="route-active" to="/journal">
|
<router-link class="route" active-class="route-active" to="/journal/timetables">
|
||||||
{{ $t('app.journal') }}
|
{{ $t('app.journal') }}
|
||||||
</router-link>
|
</router-link>
|
||||||
</span>
|
</span>
|
||||||
@@ -84,17 +84,18 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { computed, defineComponent, provide, ref } from 'vue';
|
import { computed, defineComponent, provide, ref } from 'vue';
|
||||||
|
|
||||||
import Clock from '@/components/App/Clock.vue';
|
import Clock from './components/App/Clock.vue';
|
||||||
import StorageManager from '@/scripts/managers/storageManager';
|
|
||||||
|
|
||||||
import packageInfo from '.././package.json';
|
import packageInfo from '.././package.json';
|
||||||
import options from '@/data/options.json';
|
import options from './data/options.json';
|
||||||
|
|
||||||
import StatusIndicator from '@/components/App/StatusIndicator.vue';
|
import StatusIndicator from './components/App/StatusIndicator.vue';
|
||||||
import SelectBox from '@/components/Global/SelectBox.vue';
|
import SelectBox from './components/Global/SelectBox.vue';
|
||||||
import { useStore } from './store/store';
|
import { useStore } from './store/store';
|
||||||
import UpdateModal from './components/App/UpdateModal.vue';
|
import UpdateModal from './components/App/UpdateModal.vue';
|
||||||
import TrainModal from './components/Global/TrainModal.vue';
|
import TrainModal from './components/Global/TrainModal.vue';
|
||||||
|
import StorageManager from './scripts/managers/storageManager';
|
||||||
|
import imageMixin from './mixins/imageMixin';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
components: {
|
components: {
|
||||||
@@ -105,6 +106,8 @@ export default defineComponent({
|
|||||||
TrainModal,
|
TrainModal,
|
||||||
},
|
},
|
||||||
|
|
||||||
|
mixins: [imageMixin],
|
||||||
|
|
||||||
setup() {
|
setup() {
|
||||||
const store = useStore();
|
const store = useStore();
|
||||||
store.connectToAPI();
|
store.connectToAPI();
|
||||||
@@ -151,18 +154,6 @@ export default defineComponent({
|
|||||||
|
|
||||||
currentLang: 'pl',
|
currentLang: 'pl',
|
||||||
releaseURL: '',
|
releaseURL: '',
|
||||||
|
|
||||||
brand_logo: require('@/assets/stacjownik-header-logo.svg'),
|
|
||||||
|
|
||||||
icons: {
|
|
||||||
en: require('@/assets/icon-en.jpg'),
|
|
||||||
pl: require('@/assets/icon-pl.svg'),
|
|
||||||
error: require('@/assets/icon-error.svg'),
|
|
||||||
dollar: require('@/assets/icon-dollar.svg'),
|
|
||||||
dispatcher: require('@/assets/icon-dispatcher.svg'),
|
|
||||||
train: require('@/assets/icon-train.svg'),
|
|
||||||
discord: require('@/assets/icon-discord.png'),
|
|
||||||
},
|
|
||||||
}),
|
}),
|
||||||
|
|
||||||
created() {
|
created() {
|
||||||
|
|||||||
@@ -3,7 +3,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { defineComponent } from "@vue/runtime-core";
|
import { defineComponent } from "vue";
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
props: ["message"],
|
props: ["message"],
|
||||||
|
|||||||
@@ -161,18 +161,15 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { DataStatus } from '@/scripts/enums/DataStatus';
|
|
||||||
import { StoreData } from '@/scripts/interfaces/StoreData';
|
import { defineComponent } from 'vue';
|
||||||
import { useStore } from '@/store/store';
|
import { DataStatus } from '../../scripts/enums/DataStatus';
|
||||||
import { StoreState } from '@/store/storeTypes';
|
import { useStore } from '../../store/store';
|
||||||
import { computed, defineComponent, watch } from 'vue';
|
import { StoreState } from '../../store/storeTypes';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
icons: {
|
|
||||||
statusIndicator: require('@/assets/signal-status-indicator.svg'),
|
|
||||||
},
|
|
||||||
tooltipActive: false,
|
tooltipActive: false,
|
||||||
indicator: {
|
indicator: {
|
||||||
status: DataStatus.Loading,
|
status: DataStatus.Loading,
|
||||||
|
|||||||
@@ -2,7 +2,7 @@
|
|||||||
<transition name="modal-anim">
|
<transition name="modal-anim">
|
||||||
<section class="update-modal card" v-if="releaseData && modalOpen">
|
<section class="update-modal card" v-if="releaseData && modalOpen">
|
||||||
<h2 class="modal_header text--primary">
|
<h2 class="modal_header text--primary">
|
||||||
<img :src="icons.logo" alt="stacjownik logo" />
|
<img :src="getImage('stacjownik-header-logo.svg')" alt="stacjownik logo" />
|
||||||
|
|
||||||
{{ releaseData.tag_name }}
|
{{ releaseData.tag_name }}
|
||||||
</h2>
|
</h2>
|
||||||
@@ -30,17 +30,19 @@
|
|||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import axios from 'axios';
|
import axios from 'axios';
|
||||||
|
import { defineComponent } from 'vue';
|
||||||
import packageInfo from '../../../package.json';
|
import packageInfo from '../../../package.json';
|
||||||
|
import imageMixin from '../../mixins/imageMixin';
|
||||||
|
import { ReleaseAPIData } from '../../scripts/interfaces/github_api/ReleaseAPIData';
|
||||||
|
import StorageManager from '../../scripts/managers/storageManager';
|
||||||
|
import { useStore } from '../../store/store';
|
||||||
|
|
||||||
import { ReleaseAPIData } from '@/scripts/interfaces/github_api/ReleaseAPIData';
|
|
||||||
import { defineComponent } from '@vue/runtime-core';
|
|
||||||
|
|
||||||
import StorageManager from '@/scripts/managers/storageManager';
|
|
||||||
import { useStore } from '@/store/store';
|
|
||||||
|
|
||||||
const GH_LASTEST_RELEASE_URL = 'https://api.github.com/repos/Spythere/stacjownik/releases/latest';
|
const GH_LASTEST_RELEASE_URL = 'https://api.github.com/repos/Spythere/stacjownik/releases/latest';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
|
mixins: [imageMixin],
|
||||||
|
|
||||||
mounted() {
|
mounted() {
|
||||||
this.fetchReleases();
|
this.fetchReleases();
|
||||||
},
|
},
|
||||||
@@ -50,10 +52,6 @@ export default defineComponent({
|
|||||||
modalOpen: false,
|
modalOpen: false,
|
||||||
|
|
||||||
releaseData: null as ReleaseAPIData | null,
|
releaseData: null as ReleaseAPIData | null,
|
||||||
|
|
||||||
icons: {
|
|
||||||
logo: require('@/assets/stacjownik-header-logo.svg'),
|
|
||||||
},
|
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|||||||
@@ -9,7 +9,7 @@
|
|||||||
|
|
||||||
<img
|
<img
|
||||||
class="search-exit"
|
class="search-exit"
|
||||||
:src="exitIcon"
|
:src="getIcon('exit')"
|
||||||
alt="exit-icon"
|
alt="exit-icon"
|
||||||
@click="clearValue"
|
@click="clearValue"
|
||||||
/>
|
/>
|
||||||
@@ -18,11 +18,11 @@
|
|||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { defineComponent, ref, watch } from "vue";
|
import { defineComponent, ref, watch } from "vue";
|
||||||
|
import imageMixin from "../../mixins/imageMixin";
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
data: () => ({
|
mixins: [imageMixin],
|
||||||
exitIcon: require("@/assets/icon-exit.svg"),
|
|
||||||
}),
|
|
||||||
emits: ["update:searchedValue", "clearValue"],
|
emits: ["update:searchedValue", "clearValue"],
|
||||||
props: {
|
props: {
|
||||||
searchedValue: {
|
searchedValue: {
|
||||||
@@ -59,7 +59,7 @@ export default defineComponent({
|
|||||||
emit("clearValue");
|
emit("clearValue");
|
||||||
};
|
};
|
||||||
|
|
||||||
const updateValue = (e) => {
|
const updateValue = (e: any) => {
|
||||||
if (!props.updateOnInput && e.keyCode == 13)
|
if (!props.updateOnInput && e.keyCode == 13)
|
||||||
emit("update:searchedValue", compSearchedValue.value);
|
emit("update:searchedValue", compSearchedValue.value);
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="select-box" >
|
<div class="select-box">
|
||||||
<div class="select-box_content">
|
<div class="select-box_content">
|
||||||
<button class="selected" @click="toggleBox">
|
<button class="selected" @click="toggleBox">
|
||||||
<span class="text--primary">{{ prefix }}</span>
|
<span class="text--primary">{{ prefix }}</span>
|
||||||
@@ -24,13 +24,14 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="arrow">
|
<div class="arrow">
|
||||||
<img :src="listOpen ? ascIcon : descIcon" alt="arrow-icon" />
|
<img :src="listOpen ? getIcon('arrow-asc') : getIcon('arrow-desc')" alt="arrow-icon" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { computed, defineComponent, Ref, ref } from '@vue/runtime-core';
|
import { defineComponent, Ref, ref, computed } from 'vue';
|
||||||
|
import imageMixin from '../../mixins/imageMixin';
|
||||||
|
|
||||||
interface Item {
|
interface Item {
|
||||||
id: string;
|
id: string;
|
||||||
@@ -40,6 +41,7 @@ interface Item {
|
|||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
emits: ['selected'],
|
emits: ['selected'],
|
||||||
|
mixins: [imageMixin],
|
||||||
|
|
||||||
props: {
|
props: {
|
||||||
itemList: {
|
itemList: {
|
||||||
@@ -58,11 +60,6 @@ export default defineComponent({
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
data: () => ({
|
|
||||||
ascIcon: require('@/assets/icon-arrow-asc.svg'),
|
|
||||||
descIcon: require('@/assets/icon-arrow-desc.svg'),
|
|
||||||
}),
|
|
||||||
|
|
||||||
setup(props) {
|
setup(props) {
|
||||||
let listRef: Ref<Element | null> = ref(null);
|
let listRef: Ref<Element | null> = ref(null);
|
||||||
let buttonRef: Ref<HTMLButtonElement | null> = ref(null);
|
let buttonRef: Ref<HTMLButtonElement | null> = ref(null);
|
||||||
|
|||||||
@@ -47,9 +47,9 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import dateMixin from '@/mixins/dateMixin';
|
|
||||||
import TrainStop from '@/scripts/interfaces/TrainStop';
|
|
||||||
import { defineComponent } from 'vue';
|
import { defineComponent } from 'vue';
|
||||||
|
import dateMixin from '../../mixins/dateMixin';
|
||||||
|
import TrainStop from '../../scripts/interfaces/TrainStop';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
mixins: [dateMixin],
|
mixins: [dateMixin],
|
||||||
|
|||||||
@@ -3,7 +3,7 @@
|
|||||||
<div class="modal_background" @click="closeModal"></div>
|
<div class="modal_background" @click="closeModal"></div>
|
||||||
<div class="modal_content" ref="content" tabindex="0">
|
<div class="modal_content" ref="content" tabindex="0">
|
||||||
<button class="btn exit" @click="closeModal">
|
<button class="btn exit" @click="closeModal">
|
||||||
<img :src="icons.exit" alt="close card" />
|
<img :src="getIcon('exit')" alt="close card" />
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
<TrainInfo :train="store.chosenModalTrain" :extended="false" ref="trainInfo" />
|
<TrainInfo :train="store.chosenModalTrain" :extended="false" ref="trainInfo" />
|
||||||
@@ -13,23 +13,20 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import trainInfoMixin from '@/mixins/trainInfoMixin';
|
|
||||||
import { useStore } from '@/store/store';
|
|
||||||
import { defineComponent } from 'vue';
|
import { defineComponent } from 'vue';
|
||||||
|
import imageMixin from '../../mixins/imageMixin';
|
||||||
|
import trainInfoMixin from '../../mixins/trainInfoMixin';
|
||||||
|
import { useStore } from '../../store/store';
|
||||||
import TrainInfo from '../TrainsView/TrainInfo.vue';
|
import TrainInfo from '../TrainsView/TrainInfo.vue';
|
||||||
import TrainSchedule from '../TrainsView/TrainSchedule.vue';
|
import TrainSchedule from '../TrainsView/TrainSchedule.vue';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
components: { TrainInfo, TrainSchedule },
|
components: { TrainInfo, TrainSchedule },
|
||||||
mixins: [trainInfoMixin],
|
mixins: [trainInfoMixin, imageMixin],
|
||||||
|
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
isTopBarVisible: false,
|
isTopBarVisible: false,
|
||||||
|
|
||||||
icons: {
|
|
||||||
exit: require('@/assets/icon-exit.svg'),
|
|
||||||
},
|
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|||||||
@@ -48,12 +48,13 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { DispatcherStatsAPIData } from '@/scripts/interfaces/api/DispatcherStatsAPIData';
|
|
||||||
import { TimetableHistory } from '@/scripts/interfaces/api/TimetablesAPIData';
|
|
||||||
import { URLs } from '@/scripts/utils/apiURLs';
|
|
||||||
import { useStore } from '@/store/store';
|
|
||||||
import axios from 'axios';
|
import axios from 'axios';
|
||||||
import { computed, defineComponent } from 'vue';
|
import { computed, defineComponent } from 'vue';
|
||||||
|
import { DispatcherStatsAPIData } from '../../scripts/interfaces/api/DispatcherStatsAPIData';
|
||||||
|
import { TimetableHistory } from '../../scripts/interfaces/api/TimetablesAPIData';
|
||||||
|
import { URLs } from '../../scripts/utils/apiURLs';
|
||||||
|
import { useStore } from '../../store/store';
|
||||||
import Loading from '../Global/Loading.vue';
|
import Loading from '../Global/Loading.vue';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
|
|||||||
@@ -51,12 +51,13 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { DriverStatsAPIData } from '@/scripts/interfaces/api/DriverStatsAPIData';
|
|
||||||
import { TimetableHistory } from '@/scripts/interfaces/api/TimetablesAPIData';
|
|
||||||
import { URLs } from '@/scripts/utils/apiURLs';
|
|
||||||
import { useStore } from '@/store/store';
|
|
||||||
import axios from 'axios';
|
import axios from 'axios';
|
||||||
import { defineComponent } from 'vue';
|
import { defineComponent } from 'vue';
|
||||||
|
import { DriverStatsAPIData } from '../../scripts/interfaces/api/DriverStatsAPIData';
|
||||||
|
import { TimetableHistory } from '../../scripts/interfaces/api/TimetablesAPIData';
|
||||||
|
import { URLs } from '../../scripts/utils/apiURLs';
|
||||||
|
import { useStore } from '../../store/store';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
emits: ['closeCard'],
|
emits: ['closeCard'],
|
||||||
|
|||||||
@@ -82,21 +82,18 @@
|
|||||||
import { computed, defineComponent, JournalFilter, provide, reactive, Ref, ref } from 'vue';
|
import { computed, defineComponent, JournalFilter, provide, reactive, Ref, ref } from 'vue';
|
||||||
import axios from 'axios';
|
import axios from 'axios';
|
||||||
|
|
||||||
import SearchBox from '@/components/Global/SearchBox.vue';
|
import ActionButton from '../../components/Global/ActionButton.vue';
|
||||||
import dateMixin from '@/mixins/dateMixin';
|
import JournalOptions from '../../components/JournalView/JournalOptions.vue';
|
||||||
import { DataStatus } from '@/scripts/enums/DataStatus';
|
import DispatcherStats from '../../components/JournalView/DispatcherStats.vue';
|
||||||
|
import SearchBox from '../Global/SearchBox.vue';
|
||||||
|
|
||||||
import ActionButton from '@/components/Global/ActionButton.vue';
|
|
||||||
import JournalOptions from '@/components/JournalView/JournalOptions.vue';
|
|
||||||
import DispatcherStats from '@/components/JournalView/DispatcherStats.vue';
|
|
||||||
|
|
||||||
import { URLs } from '@/scripts/utils/apiURLs';
|
|
||||||
import { useStore } from '@/store/store';
|
|
||||||
import Loading from '../Global/Loading.vue';
|
import Loading from '../Global/Loading.vue';
|
||||||
|
import { URLs } from '../../scripts/utils/apiURLs';
|
||||||
|
import dateMixin from '../../mixins/dateMixin';
|
||||||
|
import { DataStatus } from '../../scripts/enums/DataStatus';
|
||||||
|
import { useStore } from '../../store/store';
|
||||||
|
|
||||||
const PROD_MODE = process.env.VUE_APP_JORUNAL_DISPATCHERS_DEV != '1' || process.env.NODE_ENV === 'production';
|
const DISPATCHERS_API_URL = `${URLs.stacjownikAPI}/api/getDispatchers`;
|
||||||
|
|
||||||
const DISPATCHERS_API_URL = (PROD_MODE ? `${URLs.stacjownikAPI}/api` : 'http://localhost:3001/api') + '/getDispatchers';
|
|
||||||
|
|
||||||
interface DispatcherHistoryItem {
|
interface DispatcherHistoryItem {
|
||||||
id: string;
|
id: string;
|
||||||
@@ -139,10 +136,6 @@ export default defineComponent({
|
|||||||
},
|
},
|
||||||
|
|
||||||
data: () => ({
|
data: () => ({
|
||||||
icons: {
|
|
||||||
arrow: require('@/assets/icon-arrow-asc.svg'),
|
|
||||||
},
|
|
||||||
|
|
||||||
currentQuery: '',
|
currentQuery: '',
|
||||||
scrollDataLoaded: true,
|
scrollDataLoaded: true,
|
||||||
scrollNoMoreData: false,
|
scrollNoMoreData: false,
|
||||||
|
|||||||
@@ -20,7 +20,7 @@
|
|||||||
@keydown.enter="onInputSearch"
|
@keydown.enter="onInputSearch"
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<img class="search-exit" :src="exitIcon" alt="exit-icon" @click="onInputClear(propName)" />
|
<img class="search-exit" :src="getIcon('exit')" alt="exit-icon" @click="onInputClear(propName)" />
|
||||||
</div>
|
</div>
|
||||||
<!-- <div class="search-box">
|
<!-- <div class="search-box">
|
||||||
<input
|
<input
|
||||||
@@ -67,12 +67,15 @@
|
|||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { defineComponent, inject, JournalFilter, PropType } from 'vue';
|
import { defineComponent, inject, JournalFilter, PropType } from 'vue';
|
||||||
|
import imageMixin from '../../mixins/imageMixin';
|
||||||
import ActionButton from '../Global/ActionButton.vue';
|
import ActionButton from '../Global/ActionButton.vue';
|
||||||
import SelectBox from '../Global/SelectBox.vue';
|
import SelectBox from '../Global/SelectBox.vue';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
components: { SelectBox, ActionButton },
|
components: { SelectBox, ActionButton },
|
||||||
emits: ['onSorterChange', 'onInputChange', 'onFilterChange'],
|
emits: ['onSorterChange', 'onInputChange', 'onFilterChange'],
|
||||||
|
mixins: [imageMixin],
|
||||||
|
|
||||||
props: {
|
props: {
|
||||||
sorterOptionIds: {
|
sorterOptionIds: {
|
||||||
type: Array as PropType<Array<string>>,
|
type: Array as PropType<Array<string>>,
|
||||||
@@ -85,9 +88,6 @@ export default defineComponent({
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
data: () => ({
|
|
||||||
exitIcon: require('@/assets/icon-exit.svg'),
|
|
||||||
}),
|
|
||||||
|
|
||||||
setup() {
|
setup() {
|
||||||
return {
|
return {
|
||||||
|
|||||||
@@ -150,34 +150,26 @@
|
|||||||
import { computed, defineComponent, JournalFilter, provide, reactive, Ref, ref } from 'vue';
|
import { computed, defineComponent, JournalFilter, provide, reactive, Ref, ref } from 'vue';
|
||||||
import axios from 'axios';
|
import axios from 'axios';
|
||||||
|
|
||||||
import SearchBox from '@/components/Global/SearchBox.vue';
|
|
||||||
import dateMixin from '@/mixins/dateMixin';
|
|
||||||
import { DataStatus } from '@/scripts/enums/DataStatus';
|
|
||||||
|
|
||||||
import ActionButton from '@/components/Global/ActionButton.vue';
|
|
||||||
import JournalOptions from '@/components/JournalView/JournalOptions.vue';
|
|
||||||
|
|
||||||
import { URLs } from '@/scripts/utils/apiURLs';
|
|
||||||
import { journalTimetableFilters } from '@/data/journalFilters';
|
|
||||||
import { JournalFilterType } from '@/scripts/enums/JournalFilterType';
|
|
||||||
import routerMixin from '@/mixins/routerMixin';
|
|
||||||
import { useStore } from '@/store/store';
|
|
||||||
import DriverStats from './DriverStats.vue';
|
import DriverStats from './DriverStats.vue';
|
||||||
import { TimetableHistory } from '@/scripts/interfaces/api/TimetablesAPIData';
|
|
||||||
import Loading from '../Global/Loading.vue';
|
import Loading from '../Global/Loading.vue';
|
||||||
|
import { journalTimetableFilters } from '../../data/journalFilters';
|
||||||
|
import dateMixin from '../../mixins/dateMixin';
|
||||||
|
import routerMixin from '../../mixins/routerMixin';
|
||||||
|
import { DataStatus } from '../../scripts/enums/DataStatus';
|
||||||
|
import { JournalFilterType } from '../../scripts/enums/JournalFilterType';
|
||||||
|
import { TimetableHistory } from '../../scripts/interfaces/api/TimetablesAPIData';
|
||||||
|
import { URLs } from '../../scripts/utils/apiURLs';
|
||||||
|
import { useStore } from '../../store/store';
|
||||||
|
import JournalOptions from './JournalOptions.vue';
|
||||||
|
|
||||||
const PROD_MODE = process.env.VUE_APP_JOURNAL_TIMETABLES_DEV != '1' || process.env.NODE_ENV === 'production';
|
const TIMETABLES_API_URL = `${URLs.stacjownikAPI}/api/getTimetables`;
|
||||||
|
|
||||||
const TIMETABLES_API_URL = PROD_MODE
|
|
||||||
? `${URLs.stacjownikAPI}/api/getTimetables`
|
|
||||||
: 'http://localhost:3001/api/getTimetables';
|
|
||||||
|
|
||||||
type JournalTimetableSearcher = {
|
type JournalTimetableSearcher = {
|
||||||
[key in 'search-driver' | 'search-train']: string;
|
[key in 'search-driver' | 'search-train']: string;
|
||||||
};
|
};
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
components: { SearchBox, ActionButton, JournalOptions, DriverStats, Loading },
|
components: { DriverStats, Loading, JournalOptions },
|
||||||
mixins: [dateMixin, routerMixin],
|
mixins: [dateMixin, routerMixin],
|
||||||
|
|
||||||
name: 'JournalTimetables',
|
name: 'JournalTimetables',
|
||||||
@@ -189,10 +181,6 @@ export default defineComponent({
|
|||||||
},
|
},
|
||||||
|
|
||||||
data: () => ({
|
data: () => ({
|
||||||
icons: {
|
|
||||||
arrow: require('@/assets/icon-arrow-asc.svg'),
|
|
||||||
},
|
|
||||||
|
|
||||||
currentQuery: '',
|
currentQuery: '',
|
||||||
scrollDataLoaded: true,
|
scrollDataLoaded: true,
|
||||||
scrollNoMoreData: false,
|
scrollNoMoreData: false,
|
||||||
|
|||||||
@@ -31,13 +31,14 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import dateMixin from '@/mixins/dateMixin';
|
|
||||||
import { DataStatus } from '@/scripts/enums/DataStatus';
|
|
||||||
import { DispatcherHistory } from '@/scripts/interfaces/api/DispatchersAPIData';
|
|
||||||
import Station from '@/scripts/interfaces/Station';
|
|
||||||
import { URLs } from '@/scripts/utils/apiURLs';
|
|
||||||
import axios from 'axios';
|
import axios from 'axios';
|
||||||
import { defineComponent, PropType } from 'vue';
|
import { defineComponent, PropType } from 'vue';
|
||||||
|
import dateMixin from '../../mixins/dateMixin';
|
||||||
|
import { DataStatus } from '../../scripts/enums/DataStatus';
|
||||||
|
import { DispatcherHistory } from '../../scripts/interfaces/api/DispatchersAPIData';
|
||||||
|
import Station from '../../scripts/interfaces/Station';
|
||||||
|
import { URLs } from '../../scripts/utils/apiURLs';
|
||||||
import Loading from '../Global/Loading.vue';
|
import Loading from '../Global/Loading.vue';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
|
|||||||
@@ -10,8 +10,8 @@
|
|||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { defineComponent } from 'vue';
|
import { defineComponent } from 'vue';
|
||||||
|
import Station from '../../scripts/interfaces/Station';
|
||||||
|
|
||||||
import Station from '@/scripts/interfaces/Station';
|
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
props: {
|
props: {
|
||||||
|
|||||||
@@ -70,8 +70,8 @@ import SceneryInfoStats from './SceneryInfo/SceneryInfoStats.vue';
|
|||||||
import SceneryInfoUserList from './SceneryInfo/SceneryInfoUserList.vue';
|
import SceneryInfoUserList from './SceneryInfo/SceneryInfoUserList.vue';
|
||||||
import SceneryInfoSpawnList from './SceneryInfo/SceneryInfoSpawnList.vue';
|
import SceneryInfoSpawnList from './SceneryInfo/SceneryInfoSpawnList.vue';
|
||||||
import SceneryInfoRoutes from './SceneryInfo/SceneryInfoRoutes.vue';
|
import SceneryInfoRoutes from './SceneryInfo/SceneryInfoRoutes.vue';
|
||||||
|
import Station from '../../scripts/interfaces/Station';
|
||||||
|
|
||||||
import Station from '@/scripts/interfaces/Station';
|
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
components: {
|
components: {
|
||||||
|
|||||||
@@ -13,7 +13,7 @@
|
|||||||
</router-link>
|
</router-link>
|
||||||
|
|
||||||
<span class="dispatcher_likes text--primary">
|
<span class="dispatcher_likes text--primary">
|
||||||
<img :src="icons.like" alt="icon-like" />
|
<img :src="getIcon('like')" alt="icon-like" />
|
||||||
<span>{{ station.onlineInfo?.dispatcherRate || '0' }}</span>
|
<span>{{ station.onlineInfo?.dispatcherRate || '0' }}</span>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
@@ -35,14 +35,14 @@
|
|||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { defineComponent } from 'vue';
|
import { defineComponent } from 'vue';
|
||||||
|
import dateMixin from '../../../mixins/dateMixin';
|
||||||
import styleMixin from '@/mixins/styleMixin';
|
import imageMixin from '../../../mixins/imageMixin';
|
||||||
import Station from '@/scripts/interfaces/Station';
|
import routerMixin from '../../../mixins/routerMixin';
|
||||||
import dateMixin from '@/mixins/dateMixin';
|
import styleMixin from '../../../mixins/styleMixin';
|
||||||
import routerMixin from '@/mixins/routerMixin';
|
import Station from '../../../scripts/interfaces/Station';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
mixins: [styleMixin, dateMixin, routerMixin],
|
mixins: [styleMixin, dateMixin, routerMixin, imageMixin],
|
||||||
props: {
|
props: {
|
||||||
station: {
|
station: {
|
||||||
type: Object as () => Station,
|
type: Object as () => Station,
|
||||||
@@ -54,13 +54,6 @@ export default defineComponent({
|
|||||||
default: -1,
|
default: -1,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
data: () => ({
|
|
||||||
icons: {
|
|
||||||
spawn: require('@/assets/icon-spawn.svg'),
|
|
||||||
like: require('@/assets/icon-like.svg'),
|
|
||||||
},
|
|
||||||
}),
|
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|||||||
@@ -20,7 +20,7 @@
|
|||||||
<img
|
<img
|
||||||
v-if="station.generalInfo?.SUP"
|
v-if="station.generalInfo?.SUP"
|
||||||
class="icon-info"
|
class="icon-info"
|
||||||
:src="require(`@/assets/icon-SUP.svg`)"
|
:src="getIcon('SUP')"
|
||||||
alt="SUP (RASP-UZK)"
|
alt="SUP (RASP-UZK)"
|
||||||
:title="$t('desc.SUP')"
|
:title="$t('desc.SUP')"
|
||||||
/>
|
/>
|
||||||
@@ -28,7 +28,7 @@
|
|||||||
<img
|
<img
|
||||||
v-if="station.generalInfo?.signalType"
|
v-if="station.generalInfo?.signalType"
|
||||||
class="icon-info"
|
class="icon-info"
|
||||||
:src="require(`@/assets/icon-${station.generalInfo.signalType}.svg`)"
|
:src="getIcon(station.generalInfo.signalType)"
|
||||||
:alt="station.generalInfo.signalType"
|
:alt="station.generalInfo.signalType"
|
||||||
:title="$t('desc.signals-type') + $t(`signals.${station.generalInfo.signalType}`)"
|
:title="$t('desc.signals-type') + $t(`signals.${station.generalInfo.signalType}`)"
|
||||||
/>
|
/>
|
||||||
@@ -36,7 +36,7 @@
|
|||||||
<img
|
<img
|
||||||
v-if="station.generalInfo?.availability == 'nonPublic'"
|
v-if="station.generalInfo?.availability == 'nonPublic'"
|
||||||
class="icon-info"
|
class="icon-info"
|
||||||
:src="icons.lock"
|
:src="getIcon('lock')"
|
||||||
alt="Non-public scenery"
|
alt="Non-public scenery"
|
||||||
:title="$t('desc.non-public')"
|
:title="$t('desc.non-public')"
|
||||||
/>
|
/>
|
||||||
@@ -44,7 +44,7 @@
|
|||||||
<img
|
<img
|
||||||
v-if="station.generalInfo?.availability == 'unavailable'"
|
v-if="station.generalInfo?.availability == 'unavailable'"
|
||||||
class="icon-info"
|
class="icon-info"
|
||||||
:src="icons.unavailable"
|
:src="getIcon('unavailable')"
|
||||||
alt="Unavailable scenery"
|
alt="Unavailable scenery"
|
||||||
:title="$t('desc.unavailable')"
|
:title="$t('desc.unavailable')"
|
||||||
/>
|
/>
|
||||||
@@ -52,7 +52,7 @@
|
|||||||
<img
|
<img
|
||||||
v-if="station.generalInfo?.availability == 'abandoned'"
|
v-if="station.generalInfo?.availability == 'abandoned'"
|
||||||
class="icon-info"
|
class="icon-info"
|
||||||
:src="icons.abandoned"
|
:src="getIcon('abandoned')"
|
||||||
alt="Abandoned scenery"
|
alt="Abandoned scenery"
|
||||||
:title="$t('desc.abandoned')"
|
:title="$t('desc.abandoned')"
|
||||||
/>
|
/>
|
||||||
@@ -60,7 +60,7 @@
|
|||||||
<img
|
<img
|
||||||
v-if="station.generalInfo?.lines"
|
v-if="station.generalInfo?.lines"
|
||||||
class="icon-info"
|
class="icon-info"
|
||||||
:src="icons.real"
|
:src="getIcon('real')"
|
||||||
alt="real scenery"
|
alt="real scenery"
|
||||||
:title="`${$t('desc.real')} ${station.generalInfo.lines}`"
|
:title="`${$t('desc.real')} ${station.generalInfo.lines}`"
|
||||||
/>
|
/>
|
||||||
@@ -68,7 +68,7 @@
|
|||||||
<img
|
<img
|
||||||
v-if="!station.generalInfo"
|
v-if="!station.generalInfo"
|
||||||
class="icon-info"
|
class="icon-info"
|
||||||
:src="icons.unknown"
|
:src="getImage('unknown.png')"
|
||||||
alt="icon-unknown"
|
alt="icon-unknown"
|
||||||
:title="$t('desc.unknown')"
|
:title="$t('desc.unknown')"
|
||||||
/>
|
/>
|
||||||
@@ -77,31 +77,19 @@
|
|||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { defineComponent } from 'vue';
|
import { defineComponent } from 'vue';
|
||||||
import stationInfoMixin from '@/mixins/stationInfoMixin';
|
import imageMixin from '../../../mixins/imageMixin';
|
||||||
|
import stationInfoMixin from '../../../mixins/stationInfoMixin';
|
||||||
import Station from '@/scripts/interfaces/Station';
|
import styleMixin from '../../../mixins/styleMixin';
|
||||||
import styleMixin from '@/mixins/styleMixin';
|
import Station from '../../../scripts/interfaces/Station';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
mixins: [stationInfoMixin, styleMixin],
|
mixins: [stationInfoMixin, styleMixin, imageMixin],
|
||||||
props: {
|
props: {
|
||||||
station: {
|
station: {
|
||||||
type: Object as () => Station,
|
type: Object as () => Station,
|
||||||
default: {},
|
default: {},
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
data: () => ({
|
|
||||||
icons: {
|
|
||||||
td2: require('@/assets/icon-td2.svg'),
|
|
||||||
lock: require('@/assets/icon-lock.svg'),
|
|
||||||
unavailable: require('@/assets/icon-unavailable.svg'),
|
|
||||||
unknown: require('@/assets/icon-unknown.svg'),
|
|
||||||
abandoned: require('@/assets/icon-abandoned.svg'),
|
|
||||||
|
|
||||||
real: require('@/assets/icon-real.svg'),
|
|
||||||
},
|
|
||||||
}),
|
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@@ -130,3 +118,4 @@ export default defineComponent({
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
||||||
|
|||||||
@@ -57,8 +57,8 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import Station from '@/scripts/interfaces/Station';
|
|
||||||
import { defineComponent } from 'vue';
|
import { defineComponent } from 'vue';
|
||||||
|
import Station from '../../../scripts/interfaces/Station';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
props: {
|
props: {
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
<template>
|
<template>
|
||||||
<section class="info-spawn-list">
|
<section class="info-spawn-list">
|
||||||
<h3 class="spawn-header section-header">
|
<h3 class="spawn-header section-header">
|
||||||
<img :src="icons.spawn" alt="icon-spawn" />
|
<img :src="getIcon('spawn')" alt="icon-spawn" />
|
||||||
{{ $t('scenery.spawns') }}
|
{{ $t('scenery.spawns') }}
|
||||||
<span class="text--primary">{{ station.onlineInfo?.spawns.length || '0' }}</span>
|
<span class="text--primary">{{ station.onlineInfo?.spawns.length || '0' }}</span>
|
||||||
</h3>
|
</h3>
|
||||||
@@ -24,22 +24,19 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import Station from '@/scripts/interfaces/Station';
|
|
||||||
import { defineComponent } from 'vue';
|
import { defineComponent } from 'vue';
|
||||||
|
import imageMixin from '../../../mixins/imageMixin';
|
||||||
|
import Station from '../../../scripts/interfaces/Station';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
|
mixins: [imageMixin],
|
||||||
|
|
||||||
props: {
|
props: {
|
||||||
station: {
|
station: {
|
||||||
type: Object as () => Station,
|
type: Object as () => Station,
|
||||||
default: {},
|
default: {},
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
data: () => ({
|
|
||||||
icons: {
|
|
||||||
spawn: require('@/assets/icon-spawn.svg'),
|
|
||||||
},
|
|
||||||
}),
|
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|||||||
@@ -1,24 +1,24 @@
|
|||||||
<template>
|
<template>
|
||||||
<section class="info-stats" :class="!station.onlineInfo ? 'no-stats' : ''">
|
<section class="info-stats" :class="!station.onlineInfo ? 'no-stats' : ''">
|
||||||
<span class="likes">
|
<span class="likes">
|
||||||
<img :src="icons.like" alt="icon-like" />
|
<img :src="getIcon('like')" alt="icon-like" />
|
||||||
<span>{{ station.onlineInfo?.dispatcherRate || '0' }}</span>
|
<span>{{ station.onlineInfo?.dispatcherRate || '0' }}</span>
|
||||||
</span>
|
</span>
|
||||||
|
|
||||||
<span class="users">
|
<span class="users">
|
||||||
<img :src="icons.user" alt="icon-user" />
|
<img :src="getIcon('user')" alt="icon-user" />
|
||||||
<span>{{ station.onlineInfo?.currentUsers || '0' }}</span>
|
<span>{{ station.onlineInfo?.currentUsers || '0' }}</span>
|
||||||
/
|
/
|
||||||
<span>{{ station.onlineInfo?.maxUsers || '0' }}</span>
|
<span>{{ station.onlineInfo?.maxUsers || '0' }}</span>
|
||||||
</span>
|
</span>
|
||||||
|
|
||||||
<span class="spawns">
|
<span class="spawns">
|
||||||
<img :src="icons.spawn" alt="icon-spawn" />
|
<img :src="getIcon('spawn')" alt="icon-spawn" />
|
||||||
<span>{{ station.onlineInfo?.spawns.length || '0' }}</span>
|
<span>{{ station.onlineInfo?.spawns.length || '0' }}</span>
|
||||||
</span>
|
</span>
|
||||||
|
|
||||||
<span class="schedules">
|
<span class="schedules">
|
||||||
<img :src="icons.timetable" alt="icon-timetable" />
|
<img :src="getIcon('timetable')" alt="icon-timetable" />
|
||||||
<span>
|
<span>
|
||||||
<span style="color: #eee">{{ station.onlineInfo?.scheduledTrains?.length || '0' }}</span>
|
<span style="color: #eee">{{ station.onlineInfo?.scheduledTrains?.length || '0' }}</span>
|
||||||
/
|
/
|
||||||
@@ -32,25 +32,17 @@
|
|||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { defineComponent } from 'vue';
|
import { defineComponent } from 'vue';
|
||||||
|
import imageMixin from '../../../mixins/imageMixin';
|
||||||
import Station from '@/scripts/interfaces/Station';
|
import Station from '../../../scripts/interfaces/Station';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
|
mixins: [imageMixin],
|
||||||
props: {
|
props: {
|
||||||
station: {
|
station: {
|
||||||
type: Object as () => Station,
|
type: Object as () => Station,
|
||||||
default: {},
|
default: {},
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
data: () => ({
|
|
||||||
icons: {
|
|
||||||
like: require('@/assets/icon-like.svg'),
|
|
||||||
timetable: require('@/assets/icon-timetable.svg'),
|
|
||||||
user: require('@/assets/icon-user.svg'),
|
|
||||||
spawn: require('@/assets/icon-spawn.svg'),
|
|
||||||
},
|
|
||||||
}),
|
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@@ -83,7 +75,7 @@ export default defineComponent({
|
|||||||
}
|
}
|
||||||
|
|
||||||
span > img {
|
span > img {
|
||||||
width: 1.2em;
|
width: 1.2em;
|
||||||
margin-right: 0.5em;
|
margin-right: 0.5em;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
<template>
|
<template>
|
||||||
<section class="info-user-list">
|
<section class="info-user-list">
|
||||||
<h3 class="user-header section-header">
|
<h3 class="user-header section-header">
|
||||||
<img :src="icons.user" alt="icon-user" />
|
<img :src="getIcon('user')" alt="icon-user" />
|
||||||
{{ $t('scenery.users') }}
|
{{ $t('scenery.users') }}
|
||||||
<span class="text--primary">{{ station.onlineInfo?.currentUsers || '0' }}</span
|
<span class="text--primary">{{ station.onlineInfo?.currentUsers || '0' }}</span
|
||||||
> / <span class="text--primary">{{ station.onlineInfo?.maxUsers || '0' }}</span>
|
> / <span class="text--primary">{{ station.onlineInfo?.maxUsers || '0' }}</span>
|
||||||
@@ -27,13 +27,15 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import routerMixin from '@/mixins/routerMixin';
|
|
||||||
import Station from '@/scripts/interfaces/Station';
|
|
||||||
import { useStore } from '@/store/store';
|
|
||||||
import { computed, defineComponent } from 'vue';
|
import { computed, defineComponent } from 'vue';
|
||||||
|
import imageMixin from '../../../mixins/imageMixin';
|
||||||
|
import routerMixin from '../../../mixins/routerMixin';
|
||||||
|
import Station from '../../../scripts/interfaces/Station';
|
||||||
|
import { useStore } from '../../../store/store';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
mixins: [routerMixin],
|
mixins: [routerMixin, imageMixin],
|
||||||
|
|
||||||
props: {
|
props: {
|
||||||
station: {
|
station: {
|
||||||
@@ -65,12 +67,6 @@ export default defineComponent({
|
|||||||
return { computedStationTrains, store };
|
return { computedStationTrains, store };
|
||||||
},
|
},
|
||||||
|
|
||||||
data: () => ({
|
|
||||||
icons: {
|
|
||||||
user: require('@/assets/icon-user.svg'),
|
|
||||||
},
|
|
||||||
}),
|
|
||||||
|
|
||||||
methods: {
|
methods: {
|
||||||
selectTrain(trainId: string) {
|
selectTrain(trainId: string) {
|
||||||
this.store.chosenModalTrain = this.store.trainList.find((train) => train.trainId == trainId);
|
this.store.chosenModalTrain = this.store.trainList.find((train) => train.trainId == trainId);
|
||||||
|
|||||||
@@ -2,7 +2,7 @@
|
|||||||
<section class="scenery-timetable">
|
<section class="scenery-timetable">
|
||||||
<div class="timetable-header">
|
<div class="timetable-header">
|
||||||
<h3>
|
<h3>
|
||||||
<img :src="icons.timetable" alt="icon-timetable" />
|
<img :src="getIcon('timetable')" alt="icon-timetable" />
|
||||||
<span>{{ $t('scenery.timetables') }}</span>
|
<span>{{ $t('scenery.timetables') }}</span>
|
||||||
|
|
||||||
<span class="text--primary">{{ station.onlineInfo?.scheduledTrains?.length || '0' }}</span>
|
<span class="text--primary">{{ station.onlineInfo?.scheduledTrains?.length || '0' }}</span>
|
||||||
@@ -51,7 +51,7 @@
|
|||||||
{{ scheduledTrain.trainNo }}
|
{{ scheduledTrain.trainNo }}
|
||||||
|
|
||||||
<span class="g-tooltip" v-if="scheduledTrain.stopInfo.comments">
|
<span class="g-tooltip" v-if="scheduledTrain.stopInfo.comments">
|
||||||
<img :src="icons.warning" />
|
<img :src="getIcon('warning')" />
|
||||||
<span class="content" v-html="scheduledTrain.stopInfo.comments"> </span>
|
<span class="content" v-html="scheduledTrain.stopInfo.comments"> </span>
|
||||||
</span>
|
</span>
|
||||||
</span>
|
</span>
|
||||||
@@ -153,22 +153,24 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import Station from '@/scripts/interfaces/Station';
|
|
||||||
import SelectBox from '../Global/SelectBox.vue';
|
import SelectBox from '../Global/SelectBox.vue';
|
||||||
import { computed, defineComponent, PropType, ref } from '@vue/runtime-core';
|
import { computed, defineComponent, PropType, ref } from '@vue/runtime-core';
|
||||||
import { useRoute } from 'vue-router';
|
import { useRoute } from 'vue-router';
|
||||||
import dateMixin from '@/mixins/dateMixin';
|
|
||||||
import routerMixin from '@/mixins/routerMixin';
|
|
||||||
import { useStore } from '@/store/store';
|
|
||||||
import Loading from '../Global/Loading.vue';
|
import Loading from '../Global/Loading.vue';
|
||||||
import TrainModal from '../Global/TrainModal.vue';
|
import TrainModal from '../Global/TrainModal.vue';
|
||||||
|
import dateMixin from '../../mixins/dateMixin';
|
||||||
|
import routerMixin from '../../mixins/routerMixin';
|
||||||
|
import Station from '../../scripts/interfaces/Station';
|
||||||
|
import { useStore } from '../../store/store';
|
||||||
|
import imageMixin from '../../mixins/imageMixin';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
name: 'SceneryTimetable',
|
name: 'SceneryTimetable',
|
||||||
|
|
||||||
components: { SelectBox, Loading, TrainModal },
|
components: { SelectBox, Loading, TrainModal },
|
||||||
|
|
||||||
mixins: [dateMixin, routerMixin],
|
mixins: [dateMixin, routerMixin, imageMixin],
|
||||||
|
|
||||||
props: {
|
props: {
|
||||||
station: {
|
station: {
|
||||||
@@ -178,12 +180,8 @@ export default defineComponent({
|
|||||||
},
|
},
|
||||||
|
|
||||||
data: () => ({
|
data: () => ({
|
||||||
viewIcon: require('@/assets/icon-view.svg'),
|
|
||||||
listOpen: false,
|
listOpen: false,
|
||||||
icons: {
|
|
||||||
warning: require('@/assets/icon-warning.svg'),
|
|
||||||
timetable: require('@/assets/icon-timetable.svg'),
|
|
||||||
},
|
|
||||||
}),
|
}),
|
||||||
|
|
||||||
setup(props) {
|
setup(props) {
|
||||||
|
|||||||
@@ -33,13 +33,14 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import dateMixin from '@/mixins/dateMixin';
|
|
||||||
import { DataStatus } from '@/scripts/enums/DataStatus';
|
|
||||||
import { SceneryTimetableHistory, TimetableHistory } from '@/scripts/interfaces/api/TimetablesAPIData';
|
|
||||||
import Station from '@/scripts/interfaces/Station';
|
|
||||||
import { URLs } from '@/scripts/utils/apiURLs';
|
|
||||||
import axios from 'axios';
|
import axios from 'axios';
|
||||||
import { defineComponent, PropType } from 'vue';
|
import { defineComponent, PropType } from 'vue';
|
||||||
|
import dateMixin from '../../mixins/dateMixin';
|
||||||
|
import { DataStatus } from '../../scripts/enums/DataStatus';
|
||||||
|
import { TimetableHistory, SceneryTimetableHistory } from '../../scripts/interfaces/api/TimetablesAPIData';
|
||||||
|
import Station from '../../scripts/interfaces/Station';
|
||||||
|
import { URLs } from '../../scripts/utils/apiURLs';
|
||||||
import Loading from '../Global/Loading.vue';
|
import Loading from '../Global/Loading.vue';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
|
|||||||
@@ -2,7 +2,7 @@
|
|||||||
<section class="filter-card" v-click-outside="closeCard">
|
<section class="filter-card" v-click-outside="closeCard">
|
||||||
<div class="card_btn">
|
<div class="card_btn">
|
||||||
<button class="btn btn--option" @click="toggleCard">
|
<button class="btn btn--option" @click="toggleCard">
|
||||||
<img class="button_icon" :src="filterIcon" alt="icon-filter" />
|
<img class="button_icon" :src="getIcon('filter2')" alt="icon-filter" />
|
||||||
{{ $t('options.filters') }}
|
{{ $t('options.filters') }}
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
@@ -91,21 +91,22 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { defineComponent, inject } from '@vue/runtime-core';
|
|
||||||
|
|
||||||
import inputData from '@/data/options.json';
|
import { defineComponent, inject } from 'vue';
|
||||||
|
import inputData from '../../data/options.json';
|
||||||
|
import imageMixin from '../../mixins/imageMixin';
|
||||||
|
import StorageManager from '../../scripts/managers/storageManager';
|
||||||
|
import { useStore } from '../../store/store';
|
||||||
|
|
||||||
import StorageManager from '@/scripts/managers/storageManager';
|
|
||||||
import ActionButton from '../Global/ActionButton.vue';
|
import ActionButton from '../Global/ActionButton.vue';
|
||||||
import FilterOption from './FilterOption.vue';
|
import FilterOption from './FilterOption.vue';
|
||||||
import { useStore } from '@/store/store';
|
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
components: { ActionButton, FilterOption },
|
components: { ActionButton, FilterOption },
|
||||||
emits: ['changeFilterValue', 'invertFilters', 'resetFilters'],
|
emits: ['changeFilterValue', 'invertFilters', 'resetFilters'],
|
||||||
|
mixins: [imageMixin],
|
||||||
|
|
||||||
data: () => ({
|
data: () => ({
|
||||||
filterIcon: require('@/assets/icon-filter2.svg'),
|
|
||||||
|
|
||||||
inputs: { ...inputData },
|
inputs: { ...inputData },
|
||||||
saveOptions: false,
|
saveOptions: false,
|
||||||
@@ -165,7 +166,7 @@ export default defineComponent({
|
|||||||
handleAuthorsInput(e: Event) {
|
handleAuthorsInput(e: Event) {
|
||||||
clearTimeout(this.delayInputTimer);
|
clearTimeout(this.delayInputTimer);
|
||||||
|
|
||||||
this.delayInputTimer = setTimeout(() => {
|
this.delayInputTimer = window.setTimeout(() => {
|
||||||
this.handleInput(e);
|
this.handleInput(e);
|
||||||
}, 400);
|
}, 400);
|
||||||
},
|
},
|
||||||
@@ -200,7 +201,7 @@ export default defineComponent({
|
|||||||
this.$emit('invertFilters');
|
this.$emit('invertFilters');
|
||||||
},
|
},
|
||||||
|
|
||||||
saveFilters(change: { value }) {
|
saveFilters(change: { value: any }) {
|
||||||
this.saveOptions = change.value;
|
this.saveOptions = change.value;
|
||||||
|
|
||||||
if (!this.saveOptions) {
|
if (!this.saveOptions) {
|
||||||
|
|||||||
@@ -15,7 +15,7 @@
|
|||||||
<img
|
<img
|
||||||
class="sort-icon"
|
class="sort-icon"
|
||||||
v-if="sorterActive.index == i"
|
v-if="sorterActive.index == i"
|
||||||
:src="sorterActive.dir == 1 ? ascIcon : descIcon"
|
:src="sorterActive.dir == 1 ? getIcon('arrow-asc') : getIcon('arrow-desc')"
|
||||||
alt="sort icon"
|
alt="sort icon"
|
||||||
/>
|
/>
|
||||||
</span>
|
</span>
|
||||||
@@ -23,12 +23,12 @@
|
|||||||
|
|
||||||
<th v-for="(id, i) in headIconsIds" :key="id" @click="() => changeSorter(i + 7)">
|
<th v-for="(id, i) in headIconsIds" :key="id" @click="() => changeSorter(i + 7)">
|
||||||
<span class="header_wrapper">
|
<span class="header_wrapper">
|
||||||
<img :src="require(`@/assets/icon-${id}.svg`)" :alt="id" :title="$t(`sceneries.${id}s`)" />
|
<img :src="getIcon(id)" :alt="id" :title="$t(`sceneries.${id}s`)" />
|
||||||
|
|
||||||
<img
|
<img
|
||||||
class="sort-icon"
|
class="sort-icon"
|
||||||
v-if="sorterActive.index == i + 7"
|
v-if="sorterActive.index == i + 7"
|
||||||
:src="sorterActive.dir == 1 ? ascIcon : descIcon"
|
:src="sorterActive.dir == 1 ? getIcon('arrow-asc') : getIcon('arrow-desc')"
|
||||||
alt="sort icon"
|
alt="sort icon"
|
||||||
/>
|
/>
|
||||||
</span>
|
</span>
|
||||||
@@ -67,15 +67,15 @@
|
|||||||
</span>
|
</span>
|
||||||
|
|
||||||
<span v-else-if="station.generalInfo.availability == 'abandoned'">
|
<span v-else-if="station.generalInfo.availability == 'abandoned'">
|
||||||
<img :src="abandonedIcon" alt="non-public" :title="$t('desc.abandoned')" />
|
<img :src="getIcon('abandoned')" alt="non-public" :title="$t('desc.abandoned')" />
|
||||||
</span>
|
</span>
|
||||||
|
|
||||||
<span v-else-if="station.generalInfo.availability == 'nonPublic'">
|
<span v-else-if="station.generalInfo.availability == 'nonPublic'">
|
||||||
<img :src="lockIcon" alt="non-public" :title="$t('desc.non-public')" />
|
<img :src="getIcon('lock')" alt="non-public" :title="$t('desc.non-public')" />
|
||||||
</span>
|
</span>
|
||||||
|
|
||||||
<span v-else>
|
<span v-else>
|
||||||
<img :src="unavailableIcon" alt="unavailable" :title="$t('desc.unavailable')" />
|
<img :src="getIcon('unavailable')" alt="unavailable" :title="$t('desc.unavailable')" />
|
||||||
</span>
|
</span>
|
||||||
</span>
|
</span>
|
||||||
|
|
||||||
@@ -154,7 +154,7 @@
|
|||||||
<img
|
<img
|
||||||
class="icon-info"
|
class="icon-info"
|
||||||
v-if="station.generalInfo.SUP"
|
v-if="station.generalInfo.SUP"
|
||||||
:src="require(`@/assets/icon-SUP.svg`)"
|
:src="getIcon('SUP')"
|
||||||
alt="SUP (RASP-UZK)"
|
alt="SUP (RASP-UZK)"
|
||||||
:title="$t('desc.SUP')"
|
:title="$t('desc.SUP')"
|
||||||
/>
|
/>
|
||||||
@@ -164,7 +164,7 @@
|
|||||||
<img
|
<img
|
||||||
class="icon-info"
|
class="icon-info"
|
||||||
v-if="station.generalInfo.signalType"
|
v-if="station.generalInfo.signalType"
|
||||||
:src="require(`@/assets/icon-${station.generalInfo.signalType}.svg`)"
|
:src="getIcon(station.generalInfo.signalType)"
|
||||||
:alt="station.generalInfo.signalType"
|
:alt="station.generalInfo.signalType"
|
||||||
:title="$t('desc.signals-type') + $t(`signals.${station.generalInfo.signalType}`)"
|
:title="$t('desc.signals-type') + $t(`signals.${station.generalInfo.signalType}`)"
|
||||||
/>
|
/>
|
||||||
@@ -174,7 +174,7 @@
|
|||||||
<img
|
<img
|
||||||
class="icon-info"
|
class="icon-info"
|
||||||
v-if="station.generalInfo && station.generalInfo.routes.sblRouteNames.length > 0"
|
v-if="station.generalInfo && station.generalInfo.routes.sblRouteNames.length > 0"
|
||||||
:src="SBLIcon"
|
:src="getIcon('SBL')"
|
||||||
alt="SBL"
|
alt="SBL"
|
||||||
:title="$t('desc.SBL') + `${station.generalInfo.routes.sblRouteNames.join(',')}`"
|
:title="$t('desc.SBL') + `${station.generalInfo.routes.sblRouteNames.join(',')}`"
|
||||||
/>
|
/>
|
||||||
@@ -182,7 +182,7 @@
|
|||||||
</td>
|
</td>
|
||||||
|
|
||||||
<td class="station_info" v-else>
|
<td class="station_info" v-else>
|
||||||
<img class="icon-info" :src="unknownIcon" alt="icon-unknown" :title="$t('desc.unknown')" />
|
<img class="icon-info" :src="getImage('unknown.png')" alt="icon-unknown" :title="$t('desc.unknown')" />
|
||||||
</td>
|
</td>
|
||||||
|
|
||||||
<td class="station_users" :class="{ inactive: !station.onlineInfo }">
|
<td class="station_users" :class="{ inactive: !station.onlineInfo }">
|
||||||
@@ -222,16 +222,15 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import styleMixin from '@/mixins/styleMixin';
|
import { defineComponent, computed } from 'vue';
|
||||||
import dateMixin from '@/mixins/dateMixin';
|
import dateMixin from '../../mixins/dateMixin';
|
||||||
import stationInfoMixin from '@/mixins/stationInfoMixin';
|
import imageMixin from '../../mixins/imageMixin';
|
||||||
import returnBtnMixin from '@/mixins/returnBtnMixin';
|
import returnBtnMixin from '../../mixins/returnBtnMixin';
|
||||||
|
import stationInfoMixin from '../../mixins/stationInfoMixin';
|
||||||
import { DataStatus } from '@/scripts/enums/DataStatus';
|
import styleMixin from '../../mixins/styleMixin';
|
||||||
import { computed, ComputedRef, defineComponent } from '@vue/runtime-core';
|
import { DataStatus } from '../../scripts/enums/DataStatus';
|
||||||
import Station from '@/scripts/interfaces/Station';
|
import Station from '../../scripts/interfaces/Station';
|
||||||
import { StoreData } from '@/scripts/interfaces/StoreData';
|
import { useStore } from '../../store/store';
|
||||||
import { useStore } from '@/store/store';
|
|
||||||
import Loading from '../Global/Loading.vue';
|
import Loading from '../Global/Loading.vue';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
@@ -250,21 +249,8 @@ export default defineComponent({
|
|||||||
setFocusedStation: { type: Function, required: true },
|
setFocusedStation: { type: Function, required: true },
|
||||||
changeSorter: { type: Function, required: true },
|
changeSorter: { type: Function, required: true },
|
||||||
},
|
},
|
||||||
mixins: [styleMixin, dateMixin, stationInfoMixin, returnBtnMixin],
|
mixins: [styleMixin, dateMixin, stationInfoMixin, returnBtnMixin, imageMixin],
|
||||||
data: () => ({
|
data: () => ({
|
||||||
likeIcon: require('@/assets/icon-like.svg'),
|
|
||||||
spawnIcon: require('@/assets/icon-spawn.svg'),
|
|
||||||
timetableIcon: require('@/assets/icon-timetable.svg'),
|
|
||||||
userIcon: require('@/assets/icon-user.svg'),
|
|
||||||
trainIcon: require('@/assets/icon-train.svg'),
|
|
||||||
SBLIcon: require('@/assets/icon-SBL.svg'),
|
|
||||||
SUPIcon: require('@/assets/icon-SUP.svg'),
|
|
||||||
lockIcon: require('@/assets/icon-lock.svg'),
|
|
||||||
unavailableIcon: require('@/assets/icon-unavailable.svg'),
|
|
||||||
unknownIcon: require('@/assets/icon-unknown.svg'),
|
|
||||||
abandonedIcon: require('@/assets/icon-abandoned.svg'),
|
|
||||||
ascIcon: require('@/assets/icon-arrow-asc.svg'),
|
|
||||||
descIcon: require('@/assets/icon-arrow-desc.svg'),
|
|
||||||
headIds: ['station', 'min-lvl', 'status', 'dispatcher', 'dispatcher-lvl', 'routes', 'general'],
|
headIds: ['station', 'min-lvl', 'status', 'dispatcher', 'dispatcher-lvl', 'routes', 'general'],
|
||||||
headIconsIds: ['user', 'spawn', 'timetable'],
|
headIconsIds: ['user', 'spawn', 'timetable'],
|
||||||
lastSelectedStationName: '',
|
lastSelectedStationName: '',
|
||||||
|
|||||||
@@ -20,7 +20,7 @@
|
|||||||
<img
|
<img
|
||||||
v-if="getSceneriesWithComments(train.timetableData).length > 0"
|
v-if="getSceneriesWithComments(train.timetableData).length > 0"
|
||||||
class="image-warning"
|
class="image-warning"
|
||||||
:src="icons.warning"
|
:src="getIcon('warning')"
|
||||||
:title="`${$t('trains.timetable-comments')} (${getSceneriesWithComments(train.timetableData)})`"
|
:title="`${$t('trains.timetable-comments')} (${getSceneriesWithComments(train.timetableData)})`"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
@@ -59,7 +59,7 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="driver_position text--grayed" style="margin-top: 0.25em">
|
<div class="driver_position text--grayed" style="margin-top: 0.25em">
|
||||||
{{ displayTrainPosition(train) }}
|
{{ displayTrainPosition(train) }}
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
@@ -79,7 +79,7 @@
|
|||||||
<div>
|
<div>
|
||||||
<span v-for="(stat, i) in STATS.main" :key="stat.name">
|
<span v-for="(stat, i) in STATS.main" :key="stat.name">
|
||||||
<span v-if="i > 0"> • </span>
|
<span v-if="i > 0"> • </span>
|
||||||
<span>{{ `${~~(train[stat.name] * (stat.multiplier || 1))}${stat.unit}` }} </span>
|
<span>{{ `${~~((train as any)[stat.name] * (stat.multiplier || 1))}${stat.unit}` }} </span>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
@@ -87,9 +87,10 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import trainInfoMixin from '@/mixins/trainInfoMixin';
|
|
||||||
import Train from '@/scripts/interfaces/Train';
|
|
||||||
import { defineComponent } from 'vue';
|
import { defineComponent } from 'vue';
|
||||||
|
import imageMixin from '../../mixins/imageMixin';
|
||||||
|
import trainInfoMixin from '../../mixins/trainInfoMixin';
|
||||||
|
import Train from '../../scripts/interfaces/Train';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
props: {
|
props: {
|
||||||
@@ -104,13 +105,7 @@ export default defineComponent({
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
mixins: [trainInfoMixin],
|
mixins: [trainInfoMixin, imageMixin],
|
||||||
|
|
||||||
data: () => ({
|
|
||||||
icons: {
|
|
||||||
warning: require('@/assets/icon-warning.svg'),
|
|
||||||
},
|
|
||||||
}),
|
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
@@ -165,7 +160,6 @@ export default defineComponent({
|
|||||||
.train-status-badges {
|
.train-status-badges {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.train-badge {
|
.train-badge {
|
||||||
@@ -204,7 +198,6 @@ export default defineComponent({
|
|||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.timetable_progress-bar {
|
.timetable_progress-bar {
|
||||||
|
|||||||
@@ -15,13 +15,13 @@
|
|||||||
<div class="search-box">
|
<div class="search-box">
|
||||||
<input class="search-input" v-model="searchedTrain" :placeholder="$t('trains.search-train')" />
|
<input class="search-input" v-model="searchedTrain" :placeholder="$t('trains.search-train')" />
|
||||||
|
|
||||||
<img class="search-exit" :src="exitIcon" alt="exit-icon" @click="() => (searchedTrain = '')" />
|
<img class="search-exit" :src="getIcon('exit')" alt="exit-icon" @click="() => (searchedTrain = '')" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="search-box">
|
<div class="search-box">
|
||||||
<input class="search-input" v-model="searchedDriver" :placeholder="$t('trains.search-driver')" />
|
<input class="search-input" v-model="searchedDriver" :placeholder="$t('trains.search-driver')" />
|
||||||
|
|
||||||
<img class="search-exit" :src="exitIcon" alt="exit-icon" @click="() => (searchedDriver = '')" />
|
<img class="search-exit" :src="getIcon('exit')" alt="exit-icon" @click="() => (searchedDriver = '')" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -58,15 +58,13 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { computed, defineComponent, inject, TrainFilter } from 'vue';
|
import { computed, defineComponent, inject, TrainFilter } from 'vue';
|
||||||
import { useI18n } from 'vue-i18n';
|
import { useI18n } from 'vue-i18n';
|
||||||
|
import imageMixin from '../../mixins/imageMixin';
|
||||||
import SelectBox from '../Global/SelectBox.vue';
|
import SelectBox from '../Global/SelectBox.vue';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
components: { SelectBox },
|
components: { SelectBox },
|
||||||
emits: ['changeSearchedTrain', 'changeSearchedDriver', 'changeSorter'],
|
emits: ['changeSearchedTrain', 'changeSearchedDriver', 'changeSorter'],
|
||||||
|
mixins: [imageMixin],
|
||||||
data: () => ({
|
|
||||||
exitIcon: require('@/assets/icon-exit.svg'),
|
|
||||||
}),
|
|
||||||
|
|
||||||
setup() {
|
setup() {
|
||||||
const { t } = useI18n();
|
const { t } = useI18n();
|
||||||
|
|||||||
@@ -2,7 +2,7 @@
|
|||||||
<section class="filter-card" v-click-outside="closeCard">
|
<section class="filter-card" v-click-outside="closeCard">
|
||||||
<div class="card_btn">
|
<div class="card_btn">
|
||||||
<action-button @click="toggleCard">
|
<action-button @click="toggleCard">
|
||||||
<img class="button_icon" :src="filterIcon" alt="icon-filter" />
|
<img class="button_icon" :src="getIcon('filter2')" alt="icon-filter" />
|
||||||
<p>{{ $t('options.filters') }}</p>
|
<p>{{ $t('options.filters') }}</p>
|
||||||
</action-button>
|
</action-button>
|
||||||
</div>
|
</div>
|
||||||
@@ -26,13 +26,13 @@
|
|||||||
<div class="search-box">
|
<div class="search-box">
|
||||||
<input class="search-input" v-model="searchedTrain" :placeholder="$t('trains.search-train')" />
|
<input class="search-input" v-model="searchedTrain" :placeholder="$t('trains.search-train')" />
|
||||||
|
|
||||||
<img class="search-exit" :src="exitIcon" alt="exit-icon" @click="() => (searchedTrain = '')" />
|
<img class="search-exit" :src="getIcon('exit')" alt="exit-icon" @click="() => (searchedTrain = '')" />
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="search-box">
|
<div class="search-box">
|
||||||
<input class="search-input" v-model="searchedDriver" :placeholder="$t('trains.search-driver')" />
|
<input class="search-input" v-model="searchedDriver" :placeholder="$t('trains.search-driver')" />
|
||||||
|
|
||||||
<img class="search-exit" :src="exitIcon" alt="exit-icon" @click="() => (searchedDriver = '')" />
|
<img class="search-exit" :src="getIcon('exit')" alt="exit-icon" @click="() => (searchedDriver = '')" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -50,24 +50,21 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { defineComponent, inject } from '@vue/runtime-core';
|
import inputData from "../../data/options.json";
|
||||||
|
|
||||||
import inputData from '@/data/options.json';
|
import { TrainFilter, computed, defineComponent, inject } from 'vue';
|
||||||
|
|
||||||
import ActionButton from '@/components/Global/ActionButton.vue';
|
|
||||||
import { sorterOptions } from '@/data/trainOptions';
|
|
||||||
import { TrainFilter, computed } from 'vue';
|
|
||||||
import { useI18n } from 'vue-i18n';
|
import { useI18n } from 'vue-i18n';
|
||||||
import SelectBox from '../Global/SelectBox.vue';
|
import SelectBox from '../Global/SelectBox.vue';
|
||||||
|
import ActionButton from '../Global/ActionButton.vue';
|
||||||
|
import { sorterOptions } from '../../data/trainOptions';
|
||||||
|
import imageMixin from "../../mixins/imageMixin";
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
components: { ActionButton, SelectBox },
|
components: { ActionButton, SelectBox },
|
||||||
emits: ['changeFilterValue', 'invertFilters', 'resetFilters'],
|
emits: ['changeFilterValue', 'invertFilters', 'resetFilters'],
|
||||||
|
mixins: [imageMixin],
|
||||||
|
|
||||||
data: () => ({
|
data: () => ({
|
||||||
filterIcon: require('@/assets/icon-filter2.svg'),
|
|
||||||
exitIcon: require('@/assets/icon-exit.svg'),
|
|
||||||
|
|
||||||
inputs: { ...inputData },
|
inputs: { ...inputData },
|
||||||
}),
|
}),
|
||||||
|
|
||||||
|
|||||||
@@ -83,10 +83,11 @@
|
|||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { computed, defineComponent, PropType } from '@vue/runtime-core';
|
import { computed, defineComponent, PropType } from '@vue/runtime-core';
|
||||||
import dateMixin from '@/mixins/dateMixin';
|
import dateMixin from '../../mixins/dateMixin';
|
||||||
import TrainStop from '@/scripts/interfaces/TrainStop';
|
import imageMixin from '../../mixins/imageMixin';
|
||||||
|
import Train from '../../scripts/interfaces/Train';
|
||||||
|
import TrainStop from '../../scripts/interfaces/TrainStop';
|
||||||
import StopDate from '../Global/StopDate.vue';
|
import StopDate from '../Global/StopDate.vue';
|
||||||
import Train from '@/scripts/interfaces/Train';
|
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
components: { StopDate },
|
components: { StopDate },
|
||||||
@@ -97,16 +98,10 @@ export default defineComponent({
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
mixins: [dateMixin],
|
mixins: [dateMixin, imageMixin],
|
||||||
|
|
||||||
emits: ['click'],
|
emits: ['click'],
|
||||||
|
|
||||||
data: () => ({
|
|
||||||
icons: {
|
|
||||||
warning: require('@/assets/icon-warning.svg'),
|
|
||||||
},
|
|
||||||
}),
|
|
||||||
|
|
||||||
setup(props) {
|
setup(props) {
|
||||||
return {
|
return {
|
||||||
lastConfirmed: computed(() => {
|
lastConfirmed: computed(() => {
|
||||||
@@ -154,7 +149,7 @@ export default defineComponent({
|
|||||||
|
|
||||||
onImageError(e: Event) {
|
onImageError(e: Event) {
|
||||||
const imageEl = e.target as HTMLImageElement;
|
const imageEl = e.target as HTMLImageElement;
|
||||||
imageEl.src = require('@/assets/unknown.png');
|
imageEl.src = this.getImage('unknown.png');
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -1,29 +1,27 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="train-stats" v-click-outside="closeStats">
|
<div class="train-stats" v-click-outside="closeStats">
|
||||||
<action-button class="stats_button" @click="toggleStatsOpen">
|
<action-button class="stats_button" @click="toggleStatsOpen">
|
||||||
<img :src="statsIcon" :alt="$t('trains.stats')" />
|
<img :src="getIcon('stats')" :alt="$t('trains.stats')" />
|
||||||
<p>{{ $t("trains.stats") }}</p>
|
<p>{{ $t('trains.stats') }}</p>
|
||||||
</action-button>
|
</action-button>
|
||||||
|
|
||||||
<transition name="stats-anim" class="stats_wrapper" tag="div">
|
<transition name="stats-anim" class="stats_wrapper" tag="div">
|
||||||
<div class="stats-body" v-if="trainStatsOpen">
|
<div class="stats-body" v-if="trainStatsOpen">
|
||||||
<h2 class="stats-header">
|
<h2 class="stats-header">
|
||||||
<img :src="statsIcon" :alt="$t('trains.stats')" />
|
<img :src="getIcon('stats')" :alt="$t('trains.stats')" />
|
||||||
{{ $t("trains.stats") }}
|
{{ $t('trains.stats') }}
|
||||||
</h2>
|
</h2>
|
||||||
|
|
||||||
<div class="stats-speed">
|
<div class="stats-speed">
|
||||||
<div class="title stats-title">
|
<div class="title stats-title">
|
||||||
{{ $t("trains.stats-speed") }}
|
{{ $t('trains.stats-speed') }}
|
||||||
</div>
|
|
||||||
<div class="stats-content">
|
|
||||||
{{ speedStats.min }} | {{ speedStats.avg }} | {{ speedStats.max }}
|
|
||||||
</div>
|
</div>
|
||||||
|
<div class="stats-content">{{ speedStats.min }} | {{ speedStats.avg }} | {{ speedStats.max }}</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="stats-length">
|
<div class="stats-length">
|
||||||
<div class="title stats-title">
|
<div class="title stats-title">
|
||||||
{{ $t("trains.stats-length") }}
|
{{ $t('trains.stats-length') }}
|
||||||
</div>
|
</div>
|
||||||
<div class="stats-content">
|
<div class="stats-content">
|
||||||
{{ timetableStats.min }} | {{ timetableStats.avg }} |
|
{{ timetableStats.min }} | {{ timetableStats.avg }} |
|
||||||
@@ -33,15 +31,11 @@
|
|||||||
|
|
||||||
<div class="stats-categories">
|
<div class="stats-categories">
|
||||||
<div class="title stats-title">
|
<div class="title stats-title">
|
||||||
{{ $t("trains.stats-categories") }}
|
{{ $t('trains.stats-categories') }}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="category-list">
|
<div class="category-list">
|
||||||
<span
|
<span class="category" v-for="[key, value] of categoryList" :key="key">
|
||||||
class="category"
|
|
||||||
v-for="[key, value] of categoryList"
|
|
||||||
:key="key"
|
|
||||||
>
|
|
||||||
<span class="category-type">{{ key }}</span>
|
<span class="category-type">{{ key }}</span>
|
||||||
<span class="category-count">{{ value }}</span>
|
<span class="category-count">{{ value }}</span>
|
||||||
</span>
|
</span>
|
||||||
@@ -49,28 +43,22 @@
|
|||||||
|
|
||||||
<div class="special-list">
|
<div class="special-list">
|
||||||
<span class="special twr">
|
<span class="special twr">
|
||||||
<span class="special-type">{{
|
<span class="special-type">{{ $t('trains.stats-special-twr') }}</span>
|
||||||
$t("trains.stats-special-twr")
|
|
||||||
}}</span>
|
|
||||||
<span class="special-count">{{ specialTrainCount[0] }}</span>
|
<span class="special-count">{{ specialTrainCount[0] }}</span>
|
||||||
</span>
|
</span>
|
||||||
|
|
||||||
<span class="special skr">
|
<span class="special skr">
|
||||||
<span class="special-type">{{
|
<span class="special-type">{{ $t('trains.stats-special-skr') }}</span>
|
||||||
$t("trains.stats-special-skr")
|
|
||||||
}}</span>
|
|
||||||
<span class="special-count">{{ specialTrainCount[1] }}</span>
|
<span class="special-count">{{ specialTrainCount[1] }}</span>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="stats-locos">
|
<div class="stats-locos">
|
||||||
<div class="title stats-title">{{ $t("trains.stats-locos") }}</div>
|
<div class="title stats-title">{{ $t('trains.stats-locos') }}</div>
|
||||||
|
|
||||||
<div class="loco-list stats-content">
|
<div class="loco-list stats-content">
|
||||||
<div class="loco-item" v-for="(loco, i) in locoList" :key="i">
|
<div class="loco-item" v-for="(loco, i) in locoList" :key="i">{{ loco[0] }} | {{ loco[1] }}</div>
|
||||||
{{ loco[0] }} | {{ loco[1] }}
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -79,13 +67,15 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import ActionButton from "@/components/Global/ActionButton.vue";
|
import { defineComponent, computed, inject } from 'vue';
|
||||||
|
import imageMixin from '../../mixins/imageMixin';
|
||||||
import Train from "@/scripts/interfaces/Train";
|
import Train from '../../scripts/interfaces/Train';
|
||||||
import { computed, defineComponent, inject } from "@vue/runtime-core";
|
import ActionButton from '../Global/ActionButton.vue';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
components: { ActionButton },
|
components: { ActionButton },
|
||||||
|
mixins: [imageMixin],
|
||||||
|
|
||||||
props: {
|
props: {
|
||||||
trains: {
|
trains: {
|
||||||
type: Array as () => Train[],
|
type: Array as () => Train[],
|
||||||
@@ -95,7 +85,6 @@ export default defineComponent({
|
|||||||
|
|
||||||
data: () => ({
|
data: () => ({
|
||||||
trainStatsOpen: false,
|
trainStatsOpen: false,
|
||||||
statsIcon: require("@/assets/icon-stats.svg"),
|
|
||||||
}),
|
}),
|
||||||
|
|
||||||
methods: {
|
methods: {
|
||||||
@@ -110,14 +99,11 @@ export default defineComponent({
|
|||||||
|
|
||||||
setup(props) {
|
setup(props) {
|
||||||
const speedStats = computed(() => {
|
const speedStats = computed(() => {
|
||||||
if (props.trains.length == 0) return { avg: "0", min: "0", max: "0" };
|
if (props.trains.length == 0) return { avg: '0', min: '0', max: '0' };
|
||||||
|
|
||||||
const trainList = props.trains.filter((train) => train.timetableData);
|
const trainList = props.trains.filter((train) => train.timetableData);
|
||||||
|
|
||||||
const avg = (
|
const avg = (trainList.reduce((acc, train) => acc + train.speed, 0) / trainList.length).toFixed(2);
|
||||||
trainList.reduce((acc, train) => acc + train.speed, 0) /
|
|
||||||
trainList.length
|
|
||||||
).toFixed(2);
|
|
||||||
|
|
||||||
const minMaxSpeed = trainList.reduce((acc, train) => {
|
const minMaxSpeed = trainList.reduce((acc, train) => {
|
||||||
if (!train.timetableData) return acc;
|
if (!train.timetableData) return acc;
|
||||||
@@ -136,32 +122,21 @@ export default defineComponent({
|
|||||||
});
|
});
|
||||||
|
|
||||||
const timetableStats = computed(() => {
|
const timetableStats = computed(() => {
|
||||||
if (props.trains.length == 0) return { avg: "0", min: "0", max: "0" };
|
if (props.trains.length == 0) return { avg: '0', min: '0', max: '0' };
|
||||||
|
|
||||||
const activeTrainsLength = props.trains.filter(
|
const activeTrainsLength = props.trains.filter((train) => train.timetableData).length;
|
||||||
(train) => train.timetableData
|
|
||||||
).length;
|
|
||||||
|
|
||||||
const avg = (
|
const avg = (
|
||||||
props.trains.reduce(
|
props.trains.reduce((acc, train) => (train.timetableData ? acc + train.timetableData.routeDistance : acc), 0) /
|
||||||
(acc, train) =>
|
activeTrainsLength
|
||||||
train.timetableData ? acc + train.timetableData.routeDistance : acc,
|
|
||||||
0
|
|
||||||
) / activeTrainsLength
|
|
||||||
).toFixed(2);
|
).toFixed(2);
|
||||||
|
|
||||||
const minMaxDistance = props.trains.reduce((acc, train) => {
|
const minMaxDistance = props.trains.reduce((acc, train) => {
|
||||||
if (!train.timetableData) return acc;
|
if (!train.timetableData) return acc;
|
||||||
|
|
||||||
acc[0] =
|
acc[0] = !acc[0] || train.timetableData.routeDistance < acc[0] ? train.timetableData.routeDistance : acc[0];
|
||||||
!acc[0] || train.timetableData.routeDistance < acc[0]
|
|
||||||
? train.timetableData.routeDistance
|
|
||||||
: acc[0];
|
|
||||||
|
|
||||||
acc[1] =
|
acc[1] = !acc[1] || train.timetableData.routeDistance > acc[1] ? train.timetableData.routeDistance : acc[1];
|
||||||
!acc[1] || train.timetableData.routeDistance > acc[1]
|
|
||||||
? train.timetableData.routeDistance
|
|
||||||
: acc[1];
|
|
||||||
return acc;
|
return acc;
|
||||||
}, [] as any);
|
}, [] as any);
|
||||||
|
|
||||||
@@ -178,9 +153,7 @@ export default defineComponent({
|
|||||||
|
|
||||||
acc.set(
|
acc.set(
|
||||||
train.timetableData.category,
|
train.timetableData.category,
|
||||||
acc.get(train.timetableData.category)
|
acc.get(train.timetableData.category) ? acc.get(train.timetableData.category) + 1 : 1
|
||||||
? acc.get(train.timetableData.category) + 1
|
|
||||||
: 1
|
|
||||||
);
|
);
|
||||||
|
|
||||||
return acc;
|
return acc;
|
||||||
@@ -193,35 +166,26 @@ export default defineComponent({
|
|||||||
const map: Map<string, number> = props.trains.reduce((acc, train) => {
|
const map: Map<string, number> = props.trains.reduce((acc, train) => {
|
||||||
if (!train.timetableData || !train.locoType) return acc;
|
if (!train.timetableData || !train.locoType) return acc;
|
||||||
|
|
||||||
acc.set(
|
acc.set(train.locoType, acc.get(train.locoType) ? acc.get(train.locoType) + 1 : 1);
|
||||||
train.locoType,
|
|
||||||
acc.get(train.locoType) ? acc.get(train.locoType) + 1 : 1
|
|
||||||
);
|
|
||||||
|
|
||||||
return acc;
|
return acc;
|
||||||
}, new Map());
|
}, new Map());
|
||||||
|
|
||||||
const sorted = [...map.entries()]
|
const sorted = [...map.entries()].sort((a, b) => b[1] - a[1]).filter((v, i) => i < 3);
|
||||||
.sort((a, b) => b[1] - a[1])
|
|
||||||
.filter((v, i) => i < 3);
|
|
||||||
|
|
||||||
return sorted;
|
return sorted;
|
||||||
});
|
});
|
||||||
|
|
||||||
const specialTrainCount = computed(() => {
|
const specialTrainCount = computed(() => {
|
||||||
const twrList = props.trains.filter(
|
const twrList = props.trains.filter((train) => train.timetableData && train.timetableData.TWR);
|
||||||
(train) => train.timetableData && train.timetableData.TWR
|
|
||||||
);
|
|
||||||
|
|
||||||
const skrList = props.trains.filter(
|
const skrList = props.trains.filter((train) => train.timetableData && train.timetableData.SKR);
|
||||||
(train) => train.timetableData && train.timetableData.SKR
|
|
||||||
);
|
|
||||||
|
|
||||||
return [twrList.length, skrList.length];
|
return [twrList.length, skrList.length];
|
||||||
});
|
});
|
||||||
|
|
||||||
/* Inject list from TrainsView for category filter */
|
/* Inject list from TrainsView for category filter */
|
||||||
const chosenTrainCategories = inject("chosenTrainCategories") as string[];
|
const chosenTrainCategories = inject('chosenTrainCategories') as string[];
|
||||||
|
|
||||||
return {
|
return {
|
||||||
speedStats,
|
speedStats,
|
||||||
@@ -229,14 +193,14 @@ export default defineComponent({
|
|||||||
categoryList,
|
categoryList,
|
||||||
locoList,
|
locoList,
|
||||||
specialTrainCount,
|
specialTrainCount,
|
||||||
chosenTrainCategories
|
chosenTrainCategories,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "../../styles/responsive";
|
@import '../../styles/responsive';
|
||||||
|
|
||||||
.stats-anim {
|
.stats-anim {
|
||||||
&-enter-active,
|
&-enter-active,
|
||||||
@@ -370,4 +334,4 @@ export default defineComponent({
|
|||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -1,9 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="train-table">
|
<div class="train-table">
|
||||||
<button class="return-btn" @click="scrollToTop" v-if="showReturnButton">
|
|
||||||
<img :src="icons.arrowAsc" alt="return arrow" />
|
|
||||||
</button>
|
|
||||||
|
|
||||||
<transition name="anim" mode="out-in">
|
<transition name="anim" mode="out-in">
|
||||||
<div :key="store.dataStatuses.trains">
|
<div :key="store.dataStatuses.trains">
|
||||||
<Loading v-if="trains.length == 0 && store.dataStatuses.trains == 0" />
|
<Loading v-if="trains.length == 0 && store.dataStatuses.trains == 0" />
|
||||||
@@ -29,19 +25,14 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { computed, defineComponent, inject, Ref } from '@vue/runtime-core';
|
import { defineComponent, inject, Ref, computed } from 'vue';
|
||||||
|
import returnBtnMixin from '../../mixins/returnBtnMixin';
|
||||||
import defaultVehicleIconsJSON from '@/data/defaultVehicleIcons.json';
|
import Train from '../../scripts/interfaces/Train';
|
||||||
|
import { useStore } from '../../store/store';
|
||||||
import Train from '@/scripts/interfaces/Train';
|
|
||||||
|
|
||||||
import TrainSchedule from '@/components/TrainsView/TrainSchedule.vue';
|
|
||||||
import TrainInfo from '@/components/TrainsView/TrainInfo.vue';
|
|
||||||
|
|
||||||
import returnBtnMixin from '@/mixins/returnBtnMixin';
|
|
||||||
import { useStore } from '@/store/store';
|
|
||||||
import Loading from '../Global/Loading.vue';
|
import Loading from '../Global/Loading.vue';
|
||||||
import TrainModal from '../Global/TrainModal.vue';
|
import TrainModal from '../Global/TrainModal.vue';
|
||||||
|
import TrainInfo from './TrainInfo.vue';
|
||||||
|
import TrainSchedule from './TrainSchedule.vue';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
components: {
|
components: {
|
||||||
@@ -60,17 +51,6 @@ export default defineComponent({
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
data: () => ({
|
|
||||||
defaultLocoImage: require('@/assets/unknown.png'),
|
|
||||||
|
|
||||||
icons: {
|
|
||||||
arrowAsc: require('@/assets/icon-arrow-asc.svg'),
|
|
||||||
arrowDesc: require('@/assets/icon-arrow-desc.svg'),
|
|
||||||
},
|
|
||||||
|
|
||||||
defaultVehicleIcons: defaultVehicleIconsJSON,
|
|
||||||
}),
|
|
||||||
|
|
||||||
setup(props) {
|
setup(props) {
|
||||||
const store = useStore();
|
const store = useStore();
|
||||||
|
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
import { JournalFilterType } from "@/scripts/enums/JournalFilterType";
|
|
||||||
import { JournalFilter } from "vue";
|
import { JournalFilter } from "vue";
|
||||||
|
import { JournalFilterType } from "../scripts/enums/JournalFilterType";
|
||||||
|
|
||||||
export const journalTimetableFilters: JournalFilter[] = [
|
export const journalTimetableFilters: JournalFilter[] = [
|
||||||
{
|
{
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
import { TrainFilterType } from "@/scripts/enums/TrainFilterType";
|
|
||||||
import { TrainFilter } from "vue";
|
import { TrainFilter } from "vue";
|
||||||
|
import { TrainFilterType } from "../scripts/enums/TrainFilterType";
|
||||||
|
|
||||||
export const trainFilters: TrainFilter[] = [
|
export const trainFilters: TrainFilter[] = [
|
||||||
{
|
{
|
||||||
|
|||||||
+2
-3
@@ -2,12 +2,11 @@ import { createApp, Directive, ref } from 'vue';
|
|||||||
import App from './App.vue';
|
import App from './App.vue';
|
||||||
import router from './router';
|
import router from './router';
|
||||||
|
|
||||||
import enLang from '@/locales/en.json';
|
import enLang from './locales/en.json';
|
||||||
import plLang from '@/locales/pl.json';
|
import plLang from './locales/pl.json';
|
||||||
|
|
||||||
import { createI18n } from 'vue-i18n';
|
import { createI18n } from 'vue-i18n';
|
||||||
import { createPinia } from 'pinia';
|
import { createPinia } from 'pinia';
|
||||||
import './registerServiceWorker'
|
|
||||||
|
|
||||||
const i18n = createI18n({
|
const i18n = createI18n({
|
||||||
locale: 'pl',
|
locale: 'pl',
|
||||||
|
|||||||
@@ -0,0 +1,13 @@
|
|||||||
|
import { defineComponent } from 'vue';
|
||||||
|
|
||||||
|
export default defineComponent({
|
||||||
|
methods: {
|
||||||
|
getIcon(name: string, ext = 'svg') {
|
||||||
|
return new URL(`../assets/icon-${name}.${ext}`, import.meta.url).href;
|
||||||
|
},
|
||||||
|
|
||||||
|
getImage(name: string) {
|
||||||
|
return new URL(`../assets/${name}`, import.meta.url).href;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
});
|
||||||
@@ -1,31 +1,34 @@
|
|||||||
import { defineComponent, h } from "vue";
|
import { defineComponent, h } from 'vue';
|
||||||
|
import imageMixin from './imageMixin';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
data() {
|
mixins: [imageMixin],
|
||||||
return {
|
|
||||||
icons: {
|
|
||||||
arrow: require('@/assets/icon-arrow-asc.svg'),
|
|
||||||
},
|
|
||||||
|
|
||||||
showReturnButton: false
|
data() {
|
||||||
}
|
return {
|
||||||
|
icons: {
|
||||||
|
arrow: this.getIcon('arrow-asc'),
|
||||||
|
},
|
||||||
|
|
||||||
|
showReturnButton: false,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
|
||||||
|
methods: {
|
||||||
|
scrollToTop() {
|
||||||
|
window.scrollTo({ top: 0 });
|
||||||
},
|
},
|
||||||
|
|
||||||
methods: {
|
handleScroll() {
|
||||||
scrollToTop() {
|
this.showReturnButton = window.scrollY > window.innerHeight * 0.35;
|
||||||
window.scrollTo({ top: 0 });
|
|
||||||
},
|
|
||||||
|
|
||||||
handleScroll() {
|
|
||||||
this.showReturnButton = window.scrollY > window.innerHeight * 0.35;
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
|
},
|
||||||
|
|
||||||
activated() {
|
activated() {
|
||||||
window.addEventListener('scroll', this.handleScroll);
|
window.addEventListener('scroll', this.handleScroll);
|
||||||
},
|
},
|
||||||
|
|
||||||
deactivated() {
|
deactivated() {
|
||||||
window.removeEventListener('scroll', this.handleScroll);
|
window.removeEventListener('scroll', this.handleScroll);
|
||||||
},
|
},
|
||||||
})
|
});
|
||||||
|
|||||||
@@ -1,8 +1,11 @@
|
|||||||
import Train from '@/scripts/interfaces/Train';
|
|
||||||
import TrainStop from '@/scripts/interfaces/TrainStop';
|
|
||||||
import { defineComponent } from 'vue';
|
import { defineComponent } from 'vue';
|
||||||
|
import Train from '../scripts/interfaces/Train';
|
||||||
|
import TrainStop from '../scripts/interfaces/TrainStop';
|
||||||
|
import imageMixin from './imageMixin';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
|
mixins: [imageMixin],
|
||||||
|
|
||||||
data: () => ({
|
data: () => ({
|
||||||
STATS: {
|
STATS: {
|
||||||
main: [
|
main: [
|
||||||
@@ -134,7 +137,7 @@ export default defineComponent({
|
|||||||
|
|
||||||
onImageError(e: Event) {
|
onImageError(e: Event) {
|
||||||
const imageEl = e.target as HTMLImageElement;
|
const imageEl = e.target as HTMLImageElement;
|
||||||
imageEl.src = require('@/assets/unknown.png');
|
imageEl.src = this.getImage('unknown.png');
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|||||||
@@ -1,31 +0,0 @@
|
|||||||
/* eslint-disable no-console */
|
|
||||||
|
|
||||||
import { register } from 'register-service-worker'
|
|
||||||
|
|
||||||
// if (process.env.NODE_ENV === 'production') {
|
|
||||||
register(`${process.env.BASE_URL}service-worker.js`, {
|
|
||||||
ready () {
|
|
||||||
console.log('SW gotowy')
|
|
||||||
},
|
|
||||||
registered () {
|
|
||||||
console.log('SW: zarejestrowano')
|
|
||||||
},
|
|
||||||
cached () {
|
|
||||||
console.log('SW: cached')
|
|
||||||
},
|
|
||||||
updatefound () {
|
|
||||||
console.log('SW: nowa aktualizacja wykryta')
|
|
||||||
},
|
|
||||||
updated () {
|
|
||||||
console.log('SW: nowe dane, potrzebne odświeżenie strony!');
|
|
||||||
|
|
||||||
window.location.reload();
|
|
||||||
},
|
|
||||||
offline () {
|
|
||||||
console.log('SW: tryb offline')
|
|
||||||
},
|
|
||||||
error (error) {
|
|
||||||
console.error('SW: wystąpił błąd - ', error)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
// }
|
|
||||||
+10
-7
@@ -1,42 +1,45 @@
|
|||||||
import JournalDispatchersVue from '@/components/JournalView/JournalDispatchers.vue';
|
|
||||||
import JournalTimetablesVue from '@/components/JournalView/JournalTimetables.vue';
|
|
||||||
import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router';
|
import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router';
|
||||||
|
import JournalDispatchersVue from '../components/JournalView/JournalDispatchers.vue';
|
||||||
|
import JournalTimetablesVue from '../components/JournalView/JournalTimetables.vue';
|
||||||
|
|
||||||
const routes: Array<RouteRecordRaw> = [
|
const routes: Array<RouteRecordRaw> = [
|
||||||
{
|
{
|
||||||
path: '/',
|
path: '/',
|
||||||
name: 'StationsView',
|
name: 'StationsView',
|
||||||
component: () => import('@/views/StationsView.vue'),
|
component: () => import('../views/StationsView.vue'),
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: '/trains',
|
path: '/trains',
|
||||||
name: 'TrainsView',
|
name: 'TrainsView',
|
||||||
component: () => import('@/views/TrainsView.vue'),
|
component: () => import('../views/TrainsView.vue'),
|
||||||
props: (route) => ({ train: route.query.train, driver: route.query.driver }),
|
props: (route) => ({ train: route.query.train, driver: route.query.driver }),
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: '/scenery',
|
path: '/scenery',
|
||||||
name: 'SceneryView',
|
name: 'SceneryView',
|
||||||
component: () => import('@/views/SceneryView.vue'),
|
component: () => import('../views/SceneryView.vue'),
|
||||||
props: true,
|
props: true,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: '/journal',
|
path: '/journal',
|
||||||
name: 'JournalView',
|
name: 'JournalView',
|
||||||
component: () => import('@/views/JournalView.vue'),
|
component: () => import('../views/JournalView.vue'),
|
||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
path: '',
|
path: '',
|
||||||
redirect: '/journal/timetables',
|
name: 'JournalTimetables',
|
||||||
component: JournalTimetablesVue,
|
component: JournalTimetablesVue,
|
||||||
|
alias: '/timetables',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: 'dispatchers',
|
path: 'dispatchers',
|
||||||
|
name: 'JournalDispatchers',
|
||||||
component: JournalDispatchersVue,
|
component: JournalDispatchersVue,
|
||||||
props: (route) => ({ sceneryName: route.query.sceneryName, dispatcherName: route.query.dispatcherName }),
|
props: (route) => ({ sceneryName: route.query.sceneryName, dispatcherName: route.query.dispatcherName }),
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
path: 'timetables',
|
path: 'timetables',
|
||||||
|
name: 'JournalTimetables',
|
||||||
component: JournalTimetablesVue,
|
component: JournalTimetablesVue,
|
||||||
props: (route) => ({
|
props: (route) => ({
|
||||||
trainNo: route.query.trainNo,
|
trainNo: route.query.trainNo,
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
import Station from '@/scripts/interfaces/Station';
|
import Filter from '../interfaces/Filter';
|
||||||
import Filter from '@/scripts/interfaces/Filter';
|
import Station from '../interfaces/Station';
|
||||||
import StorageManager from './storageManager';
|
import StorageManager from './storageManager';
|
||||||
|
|
||||||
const sortStations = (a: Station, b: Station, sorter: { index: number; dir: number }) => {
|
const sortStations = (a: Station, b: Station, sorter: { index: number; dir: number }) => {
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
export const URLs = {
|
export const URLs = {
|
||||||
stacjownikAPI: process.env.VUE_APP_API_DEV != 1 ? 'https://stacjownik.eu-4.evennode.com' : 'http://localhost:3000',
|
stacjownikAPI: import.meta.env.VITE_APP_API_DEV ? 'https://stacjownik.eu-4.evennode.com' : 'http://localhost:3000',
|
||||||
stacjownikAPIDev: 'localhost:3000',
|
stacjownikAPIDev: 'localhost:3000',
|
||||||
// trains: "https://api.td2.info.pl:9640/?method=getTrainsOnline",
|
// trains: "https://api.td2.info.pl:9640/?method=getTrainsOnline",
|
||||||
// getTimetableURL: (trainNo: string | number, region = "eu") => `https://api.td2.info.pl:9640/?method=readFromSWDR&value=getTimetable%3B${trainNo}%3B${region}`
|
// getTimetableURL: (trainNo: string | number, region = "eu") => `https://api.td2.info.pl:9640/?method=readFromSWDR&value=getTimetable%3B${trainNo}%3B${region}`
|
||||||
|
|||||||
Vendored
-6
@@ -1,6 +0,0 @@
|
|||||||
/* eslint-disable */
|
|
||||||
declare module '*.vue' {
|
|
||||||
import type { DefineComponent } from 'vue'
|
|
||||||
const component: DefineComponent<{}, {}, any>
|
|
||||||
export default component
|
|
||||||
}
|
|
||||||
+25
-20
@@ -1,20 +1,20 @@
|
|||||||
import { DataStatus } from '@/scripts/enums/DataStatus';
|
|
||||||
import StationAPIData from '@/scripts/interfaces/api/StationAPIData';
|
|
||||||
import ScheduledTrain from '@/scripts/interfaces/ScheduledTrain';
|
|
||||||
import Station from '@/scripts/interfaces/Station';
|
|
||||||
import StationRoutes from '@/scripts/interfaces/StationRoutes';
|
|
||||||
import Train from '@/scripts/interfaces/Train';
|
|
||||||
import { URLs } from '@/scripts/utils/apiURLs';
|
|
||||||
import {
|
|
||||||
getLocoURL,
|
|
||||||
getScheduledTrain,
|
|
||||||
getStatusID,
|
|
||||||
getStatusTimestamp,
|
|
||||||
parseSpawns,
|
|
||||||
} from '@/scripts/utils/storeUtils';
|
|
||||||
import axios from 'axios';
|
import axios from 'axios';
|
||||||
import { defineStore } from 'pinia';
|
import { defineStore } from 'pinia';
|
||||||
import { io } from 'socket.io-client';
|
import { io } from 'socket.io-client';
|
||||||
|
import { DataStatus } from '../scripts/enums/DataStatus';
|
||||||
|
import StationAPIData from '../scripts/interfaces/api/StationAPIData';
|
||||||
|
import ScheduledTrain from '../scripts/interfaces/ScheduledTrain';
|
||||||
|
import Station from '../scripts/interfaces/Station';
|
||||||
|
import StationRoutes from '../scripts/interfaces/StationRoutes';
|
||||||
|
import Train from '../scripts/interfaces/Train';
|
||||||
|
import { URLs } from '../scripts/utils/apiURLs';
|
||||||
|
import {
|
||||||
|
getLocoURL,
|
||||||
|
getStatusTimestamp,
|
||||||
|
getStatusID,
|
||||||
|
getScheduledTrain,
|
||||||
|
parseSpawns,
|
||||||
|
} from '../scripts/utils/storeUtils';
|
||||||
import { APIData, StationJSONData, StoreState } from './storeTypes';
|
import { APIData, StationJSONData, StoreState } from './storeTypes';
|
||||||
|
|
||||||
export const useStore = defineStore('store', {
|
export const useStore = defineStore('store', {
|
||||||
@@ -58,7 +58,7 @@ export const useStore = defineStore('store', {
|
|||||||
setTrainsOnlineData() {
|
setTrainsOnlineData() {
|
||||||
const { trains } = this.apiData;
|
const { trains } = this.apiData;
|
||||||
|
|
||||||
if (!trains) return [];
|
if (!trains) return [];
|
||||||
|
|
||||||
this.trainList = trains
|
this.trainList = trains
|
||||||
.filter(
|
.filter(
|
||||||
@@ -73,7 +73,7 @@ export const useStore = defineStore('store', {
|
|||||||
|
|
||||||
return {
|
return {
|
||||||
trainId: train.driverName + train.trainNo.toString(),
|
trainId: train.driverName + train.trainNo.toString(),
|
||||||
|
|
||||||
trainNo: train.trainNo,
|
trainNo: train.trainNo,
|
||||||
mass: train.mass,
|
mass: train.mass,
|
||||||
length: train.length,
|
length: train.length,
|
||||||
@@ -204,7 +204,12 @@ export const useStore = defineStore('store', {
|
|||||||
(train) =>
|
(train) =>
|
||||||
train?.region === this.region.id && train.online && train.currentStationName === stationAPIData.stationName
|
train?.region === this.region.id && train.online && train.currentStationName === stationAPIData.stationName
|
||||||
)
|
)
|
||||||
.map((train) => ({ driverName: train.driverName, driverId: train.driverId, trainNo: train.trainNo, trainId: train.trainId }));
|
.map((train) => ({
|
||||||
|
driverName: train.driverName,
|
||||||
|
driverId: train.driverId,
|
||||||
|
trainNo: train.trainNo,
|
||||||
|
trainId: train.trainId,
|
||||||
|
}));
|
||||||
},
|
},
|
||||||
|
|
||||||
setStationsOnlineInfo() {
|
setStationsOnlineInfo() {
|
||||||
@@ -338,7 +343,7 @@ export const useStore = defineStore('store', {
|
|||||||
transports: ['websocket', 'polling'],
|
transports: ['websocket', 'polling'],
|
||||||
rememberUpgrade: true,
|
rememberUpgrade: true,
|
||||||
reconnection: true,
|
reconnection: true,
|
||||||
timeout: 10000
|
timeout: 10000,
|
||||||
});
|
});
|
||||||
|
|
||||||
socket.on('connect_error', (err) => {
|
socket.on('connect_error', (err) => {
|
||||||
@@ -381,13 +386,13 @@ export const useStore = defineStore('store', {
|
|||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
this.dataStatuses.sceneries = DataStatus.Loaded;
|
this.dataStatuses.sceneries = DataStatus.Loaded;
|
||||||
this.dataStatuses.trains = !this.apiData.trains ? DataStatus.Warning : DataStatus.Loaded;
|
this.dataStatuses.trains = !this.apiData.trains ? DataStatus.Warning : DataStatus.Loaded;
|
||||||
this.dataStatuses.dispatchers = !this.apiData.dispatchers ? DataStatus.Warning : DataStatus.Loaded;
|
this.dataStatuses.dispatchers = !this.apiData.dispatchers ? DataStatus.Warning : DataStatus.Loaded;
|
||||||
|
|
||||||
this.setTrainsOnlineData();
|
this.setTrainsOnlineData();
|
||||||
this.setStationsOnlineInfo();
|
this.setStationsOnlineInfo();
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
@@ -1,11 +1,12 @@
|
|||||||
import { DataStatus } from '@/scripts/enums/DataStatus';
|
|
||||||
import { DispatcherStatsAPIData } from '@/scripts/interfaces/api/DispatcherStatsAPIData';
|
|
||||||
import { DriverStatsAPIData } from '@/scripts/interfaces/api/DriverStatsAPIData';
|
|
||||||
import StationAPIData from '@/scripts/interfaces/api/StationAPIData';
|
|
||||||
import TrainAPIData from '@/scripts/interfaces/api/TrainAPIData';
|
|
||||||
import Station from '@/scripts/interfaces/Station';
|
|
||||||
import Train from '@/scripts/interfaces/Train';
|
|
||||||
import { Socket } from 'socket.io-client';
|
import { Socket } from 'socket.io-client';
|
||||||
|
import { DataStatus } from '../scripts/enums/DataStatus';
|
||||||
|
import { DispatcherStatsAPIData } from '../scripts/interfaces/api/DispatcherStatsAPIData';
|
||||||
|
import { DriverStatsAPIData } from '../scripts/interfaces/api/DriverStatsAPIData';
|
||||||
|
import StationAPIData from '../scripts/interfaces/api/StationAPIData';
|
||||||
|
import TrainAPIData from '../scripts/interfaces/api/TrainAPIData';
|
||||||
|
import Station from '../scripts/interfaces/Station';
|
||||||
|
import Train from '../scripts/interfaces/Train';
|
||||||
|
|
||||||
export type Availability = 'default' | 'unavailable' | 'nonPublic' | 'abandoned' | 'nonDefault';
|
export type Availability = 'default' | 'unavailable' | 'nonPublic' | 'abandoned' | 'nonDefault';
|
||||||
|
|
||||||
|
|||||||
@@ -1,21 +1,19 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="error-view">
|
<div class="error-view">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<img :src="icons.error" alt="error" />
|
<img :src="getIcon('error')" alt="error" />
|
||||||
<div class="desc">Z powodu błędu w zapisywaniu rozkładów jazdy w tej zakładce można do odwołania nacieszyć się animacją sygnału S1a. Jak naprawię to będzie :)</div>
|
<div class="desc">Z powodu błędu w zapisywaniu rozkładów jazdy w tej zakładce można do odwołania nacieszyć się animacją sygnału S1a. Jak naprawię to będzie :)</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { defineComponent } from '@vue/runtime-core';
|
import { defineComponent } from "vue";
|
||||||
|
import imageMixin from "../mixins/imageMixin";
|
||||||
|
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
data: () => ({
|
mixins: [imageMixin]
|
||||||
icons: {
|
|
||||||
error: require('@/assets/icon-error.svg'),
|
|
||||||
},
|
|
||||||
}),
|
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|||||||
@@ -21,13 +21,12 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import JournalTimetables from '@/components/JournalView/JournalTimetables.vue';
|
|
||||||
import { defineComponent, ref } from 'vue';
|
import { defineComponent, ref } from 'vue';
|
||||||
import JournalDispatchers from '@/components/JournalView/JournalDispatchers.vue';
|
import JournalDispatchers from '../components/JournalView/JournalDispatchers.vue';
|
||||||
|
import JournalTimetables from '../components/JournalView/JournalTimetables.vue';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
components: { JournalTimetables, JournalDispatchers },
|
components: { JournalDispatchers, JournalTimetables },
|
||||||
|
|
||||||
setup() {
|
setup() {
|
||||||
const journalTypeChosen = ref('journalTimetables');
|
const journalTypeChosen = ref('journalTimetables');
|
||||||
|
|
||||||
|
|||||||
+14
-36
@@ -12,7 +12,7 @@
|
|||||||
<div class="scenery-left">
|
<div class="scenery-left">
|
||||||
<div class="scenery-actions">
|
<div class="scenery-actions">
|
||||||
<button v-if="!timetableOnly" class="back-btn btn" :title="$t('scenery.return-btn')" @click="navigateTo('/')">
|
<button v-if="!timetableOnly" class="back-btn btn" :title="$t('scenery.return-btn')" @click="navigateTo('/')">
|
||||||
<img :src="icons.back" alt="Back to scenery" />
|
<img :src="getImage('back')" alt="Back to scenery" />
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -41,19 +41,17 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import SceneryInfo from '@/components/SceneryView/SceneryInfo.vue';
|
import { computed, defineComponent } from 'vue';
|
||||||
import SceneryTimetable from '@/components/SceneryView/SceneryTimetable.vue';
|
|
||||||
import SceneryTimetablesHistory from '../components/SceneryView/SceneryTimetablesHistory.vue';
|
|
||||||
import SceneryDispatchersHistory from '@/components/SceneryView/SceneryDispatchersHistory.vue';
|
|
||||||
import SceneryHeader from '@/components/SceneryView/SceneryHeader.vue';
|
|
||||||
|
|
||||||
import ActionButton from '@/components/Global/ActionButton.vue';
|
|
||||||
|
|
||||||
import { computed, defineComponent, ref } from '@vue/runtime-core';
|
|
||||||
import { useRoute } from 'vue-router';
|
import { useRoute } from 'vue-router';
|
||||||
|
import routerMixin from '../mixins/routerMixin';
|
||||||
import { useStore } from '@/store/store';
|
import { useStore } from '../store/store';
|
||||||
import routerMixin from '@/mixins/routerMixin';
|
import SceneryInfo from '../components/SceneryView/SceneryInfo.vue';
|
||||||
|
import SceneryHeader from '../components/SceneryView/SceneryHeader.vue';
|
||||||
|
import SceneryTimetable from '../components/SceneryView/SceneryTimetable.vue';
|
||||||
|
import SceneryTimetablesHistory from '../components/SceneryView/SceneryTimetablesHistory.vue';
|
||||||
|
import SceneryDispatchersHistory from '../components/SceneryView/SceneryDispatchersHistory.vue';
|
||||||
|
import ActionButton from '../components/Global/ActionButton.vue';
|
||||||
|
import imageMixin from '../mixins/imageMixin';
|
||||||
|
|
||||||
enum SceneryViewMode {
|
enum SceneryViewMode {
|
||||||
'TIMETABLES_ACTIVE',
|
'TIMETABLES_ACTIVE',
|
||||||
@@ -70,15 +68,8 @@ export default defineComponent({
|
|||||||
SceneryTimetablesHistory,
|
SceneryTimetablesHistory,
|
||||||
SceneryDispatchersHistory,
|
SceneryDispatchersHistory,
|
||||||
},
|
},
|
||||||
|
mixins: [routerMixin, imageMixin],
|
||||||
mixins: [routerMixin],
|
|
||||||
|
|
||||||
data: () => ({
|
data: () => ({
|
||||||
icons: {
|
|
||||||
user: require('@/assets/icon-user.svg'),
|
|
||||||
back: require('@/assets/icon-back.svg'),
|
|
||||||
},
|
|
||||||
|
|
||||||
viewModes: [
|
viewModes: [
|
||||||
{
|
{
|
||||||
id: 'scenery.option-active-timetables',
|
id: 'scenery.option-active-timetables',
|
||||||
@@ -93,32 +84,22 @@ export default defineComponent({
|
|||||||
component: 'SceneryDispatchersHistory',
|
component: 'SceneryDispatchersHistory',
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
|
|
||||||
sceneryViewMode: SceneryViewMode,
|
sceneryViewMode: SceneryViewMode,
|
||||||
|
|
||||||
selectedCheckpoint: '',
|
selectedCheckpoint: '',
|
||||||
|
|
||||||
currentViewCompontent: 'SceneryTimetable',
|
currentViewCompontent: 'SceneryTimetable',
|
||||||
|
|
||||||
onlineFrom: -1,
|
onlineFrom: -1,
|
||||||
}),
|
}),
|
||||||
|
|
||||||
activated() {
|
activated() {
|
||||||
this.loadSelectedCheckpoint();
|
this.loadSelectedCheckpoint();
|
||||||
},
|
},
|
||||||
|
|
||||||
setup() {
|
setup() {
|
||||||
const route = useRoute();
|
const route = useRoute();
|
||||||
const store = useStore();
|
const store = useStore();
|
||||||
|
|
||||||
const timetableOnly = computed(() => (route.query['timetable_only'] == '1' ? true : false));
|
const timetableOnly = computed(() => (route.query['timetable_only'] == '1' ? true : false));
|
||||||
|
|
||||||
const isComponentVisible = computed(() => route.path === '/scenery');
|
const isComponentVisible = computed(() => route.path === '/scenery');
|
||||||
|
|
||||||
const stationInfo = computed(() => {
|
const stationInfo = computed(() => {
|
||||||
return store.stationList.find((station) => station.name === route.query.station?.toString().replace(/_/g, ' '));
|
return store.stationList.find((station) => station.name === route.query.station?.toString().replace(/_/g, ' '));
|
||||||
});
|
});
|
||||||
|
|
||||||
return {
|
return {
|
||||||
timetableOnly,
|
timetableOnly,
|
||||||
isComponentVisible,
|
isComponentVisible,
|
||||||
@@ -126,19 +107,15 @@ export default defineComponent({
|
|||||||
store,
|
store,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
|
||||||
methods: {
|
methods: {
|
||||||
setViewMode(componentName: string) {
|
setViewMode(componentName: string) {
|
||||||
this.currentViewCompontent = componentName;
|
this.currentViewCompontent = componentName;
|
||||||
},
|
},
|
||||||
|
|
||||||
loadSelectedCheckpoint() {
|
loadSelectedCheckpoint() {
|
||||||
if (!this.stationInfo?.generalInfo?.checkpoints) return;
|
if (!this.stationInfo?.generalInfo?.checkpoints) return;
|
||||||
if (this.stationInfo.generalInfo.checkpoints.length == 0) return;
|
if (this.stationInfo.generalInfo.checkpoints.length == 0) return;
|
||||||
|
|
||||||
this.selectedCheckpoint = this.stationInfo.generalInfo.checkpoints[0].checkpointName;
|
this.selectedCheckpoint = this.stationInfo.generalInfo.checkpoints[0].checkpointName;
|
||||||
},
|
},
|
||||||
|
|
||||||
selectCheckpoint(cp: { checkpointName: string }) {
|
selectCheckpoint(cp: { checkpointName: string }) {
|
||||||
this.selectedCheckpoint = cp.checkpointName;
|
this.selectedCheckpoint = cp.checkpointName;
|
||||||
},
|
},
|
||||||
@@ -290,7 +267,8 @@ button.back-btn {
|
|||||||
}
|
}
|
||||||
|
|
||||||
@include smallScreen {
|
@include smallScreen {
|
||||||
.scenery-left, .scenery-right {
|
.scenery-left,
|
||||||
|
.scenery-right {
|
||||||
max-height: 100vh;
|
max-height: 100vh;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
+10
-15
@@ -3,7 +3,7 @@
|
|||||||
<div class="wrapper">
|
<div class="wrapper">
|
||||||
<div class="body">
|
<div class="body">
|
||||||
<div class="options-bar">
|
<div class="options-bar">
|
||||||
<FilterCard
|
<StationFilterCard
|
||||||
:showCard="filterCardOpen"
|
:showCard="filterCardOpen"
|
||||||
:exit="closeCard"
|
:exit="closeCard"
|
||||||
@changeFilterValue="changeFilterValue"
|
@changeFilterValue="changeFilterValue"
|
||||||
@@ -25,30 +25,25 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import Station from '@/scripts/interfaces/Station';
|
|
||||||
|
|
||||||
import StorageManager from '@/scripts/managers/storageManager';
|
import inputData from '../data/options.json';
|
||||||
import StationFilterManager from '@/scripts/managers/stationFilterManager';
|
|
||||||
|
|
||||||
import inputData from '@/data/options.json';
|
|
||||||
|
|
||||||
import StationTable from '@/components/StationsView/StationTable.vue';
|
|
||||||
import FilterCard from '@/components/StationsView/StationFilterCard.vue';
|
|
||||||
import SelectBox from '@/components/Global/SelectBox.vue';
|
|
||||||
|
|
||||||
import { computed, ComputedRef, defineComponent, reactive } from 'vue';
|
import { computed, ComputedRef, defineComponent, reactive } from 'vue';
|
||||||
import { useStore } from '@/store/store';
|
import { useStore } from '../store/store';
|
||||||
|
import StationFilterManager from '../scripts/managers/stationFilterManager';
|
||||||
|
import Station from '../scripts/interfaces/Station';
|
||||||
|
import StorageManager from '../scripts/managers/storageManager';
|
||||||
|
import StationTable from '../components/StationsView/StationTable.vue';
|
||||||
|
import StationFilterCard from '../components/StationsView/StationFilterCard.vue';
|
||||||
|
import SelectBox from '../components/Global/SelectBox.vue';
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
components: {
|
components: {
|
||||||
StationTable,
|
StationTable,
|
||||||
FilterCard,
|
StationFilterCard,
|
||||||
SelectBox,
|
SelectBox,
|
||||||
},
|
},
|
||||||
data: () => ({
|
data: () => ({
|
||||||
trainIcon: require('@/assets/icon-train.svg'),
|
|
||||||
timetableIcon: require('@/assets/icon-timetable.svg'),
|
|
||||||
dolarIcon: require('@/assets/icon-dolar.svg'),
|
|
||||||
filterCardOpen: false,
|
filterCardOpen: false,
|
||||||
modalHidden: true,
|
modalHidden: true,
|
||||||
STORAGE_KEY: 'options_saved',
|
STORAGE_KEY: 'options_saved',
|
||||||
|
|||||||
@@ -11,16 +11,14 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { computed, ComputedRef, defineComponent, PropType, provide, reactive, ref, TrainFilter } from 'vue';
|
import { computed, ComputedRef, defineComponent, provide, reactive, ref, TrainFilter } from 'vue';
|
||||||
import { filteredTrainList } from '@/scripts/managers/trainFilterManager';
|
import TrainOptions from '../components/TrainsView/TrainOptions.vue';
|
||||||
import { trainFilters } from '@/data/trainOptions';
|
import TrainStats from '../components/TrainsView/TrainStats.vue';
|
||||||
|
import TrainTable from '../components/TrainsView/TrainTable.vue';
|
||||||
import Train from '@/scripts/interfaces/Train';
|
import { trainFilters } from '../data/trainOptions';
|
||||||
import TrainTable from '@/components/TrainsView/TrainTable.vue';
|
import Train from '../scripts/interfaces/Train';
|
||||||
import TrainStats from '@/components/TrainsView/TrainStats.vue';
|
import { filteredTrainList } from '../scripts/managers/trainFilterManager';
|
||||||
import TrainOptions from '@/components/TrainsView/TrainOptions.vue';
|
import { useStore } from '../store/store';
|
||||||
|
|
||||||
import { useStore } from '@/store/store';
|
|
||||||
|
|
||||||
export default defineComponent({
|
export default defineComponent({
|
||||||
components: {
|
components: {
|
||||||
@@ -42,7 +40,6 @@ export default defineComponent({
|
|||||||
},
|
},
|
||||||
|
|
||||||
data: () => ({
|
data: () => ({
|
||||||
statsIcon: require('@/assets/icon-stats.svg'),
|
|
||||||
trainStatsOpen: false,
|
trainStatsOpen: false,
|
||||||
}),
|
}),
|
||||||
|
|
||||||
|
|||||||
Vendored
+19
@@ -0,0 +1,19 @@
|
|||||||
|
/// <reference types="vite/client" />
|
||||||
|
|
||||||
|
declare module '*.vue' {
|
||||||
|
import type { DefineComponent } from 'vue'
|
||||||
|
const component: DefineComponent<{}, {}, any>
|
||||||
|
export default component
|
||||||
|
|
||||||
|
}
|
||||||
|
interface ImportMetaEnv {
|
||||||
|
readonly VITE_APP_API_DEV: number;
|
||||||
|
readonly VITE_APP_WS_DEV: number;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface ImportMeta {
|
||||||
|
readonly env: ImportMetaEnv;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
+16
-29
@@ -1,43 +1,30 @@
|
|||||||
{
|
{
|
||||||
"compilerOptions": {
|
"compilerOptions": {
|
||||||
"target": "esnext",
|
"target": "ESNext",
|
||||||
"module": "esnext",
|
"useDefineForClassFields": true,
|
||||||
|
"module": "ESNext",
|
||||||
|
"moduleResolution": "Node",
|
||||||
"strict": true,
|
"strict": true,
|
||||||
"jsx": "preserve",
|
"jsx": "preserve",
|
||||||
"importHelpers": true,
|
|
||||||
"suppressImplicitAnyIndexErrors": true,
|
|
||||||
"noImplicitAny": false,
|
|
||||||
"moduleResolution": "node",
|
|
||||||
"experimentalDecorators": true,
|
|
||||||
"esModuleInterop": true,
|
|
||||||
"allowSyntheticDefaultImports": true,
|
|
||||||
"sourceMap": true,
|
"sourceMap": true,
|
||||||
"resolveJsonModule": true,
|
"resolveJsonModule": true,
|
||||||
"baseUrl": ".",
|
"isolatedModules": true,
|
||||||
"types": [
|
"esModuleInterop": true,
|
||||||
"webpack-env"
|
|
||||||
],
|
|
||||||
"paths": {
|
|
||||||
"@/*": [
|
|
||||||
"src/*"
|
|
||||||
]
|
|
||||||
},
|
|
||||||
"lib": [
|
"lib": [
|
||||||
"esnext",
|
"ESNext",
|
||||||
"dom",
|
"DOM"
|
||||||
"dom.iterable",
|
],
|
||||||
"scripthost"
|
"skipLibCheck": true
|
||||||
]
|
|
||||||
},
|
},
|
||||||
"include": [
|
"include": [
|
||||||
"src/**/*.ts",
|
"src/**/*.ts",
|
||||||
|
"src/**/*.d.ts",
|
||||||
"src/**/*.tsx",
|
"src/**/*.tsx",
|
||||||
"src/**/*.vue",
|
"src/**/*.vue"
|
||||||
"src/**/**/*.vue",
|
|
||||||
"tests/**/*.ts",
|
|
||||||
"tests/**/*.tsx"
|
|
||||||
],
|
],
|
||||||
"exclude": [
|
"references": [
|
||||||
"node_modules"
|
{
|
||||||
|
"path": "./tsconfig.node.json"
|
||||||
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
@@ -0,0 +1,9 @@
|
|||||||
|
{
|
||||||
|
"compilerOptions": {
|
||||||
|
"composite": true,
|
||||||
|
"module": "ESNext",
|
||||||
|
"moduleResolution": "Node",
|
||||||
|
"allowSyntheticDefaultImports": true
|
||||||
|
},
|
||||||
|
"include": ["vite.config.ts"]
|
||||||
|
}
|
||||||
@@ -0,0 +1,35 @@
|
|||||||
|
import { defineConfig } from 'vite';
|
||||||
|
import vue from '@vitejs/plugin-vue';
|
||||||
|
import { VitePWA } from 'vite-plugin-pwa';
|
||||||
|
|
||||||
|
export default defineConfig({
|
||||||
|
plugins: [
|
||||||
|
vue(),
|
||||||
|
VitePWA({
|
||||||
|
registerType: 'autoUpdate',
|
||||||
|
workbox: {
|
||||||
|
globPatterns: ['**/*.{js,css,html,png,svg,img}'],
|
||||||
|
runtimeCaching: [
|
||||||
|
{
|
||||||
|
urlPattern: new RegExp('^https://stacjownik.eu-4.evennode.com/api/getSceneries'),
|
||||||
|
handler: 'NetworkFirst',
|
||||||
|
options: {
|
||||||
|
cacheName: 'sceneries-cache',
|
||||||
|
expiration: {
|
||||||
|
maxEntries: 200,
|
||||||
|
maxAgeSeconds: 60 * 60 * 24 * 60, // <== 60 days
|
||||||
|
},
|
||||||
|
cacheableResponse: {
|
||||||
|
statuses: [0, 200],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
devOptions: {
|
||||||
|
enabled: true,
|
||||||
|
},
|
||||||
|
}),
|
||||||
|
],
|
||||||
|
});
|
||||||
|
|
||||||
@@ -1,20 +0,0 @@
|
|||||||
module.exports = {
|
|
||||||
pwa: {
|
|
||||||
workboxPluginModule: 'GenerateSW',
|
|
||||||
workboxOptions: {
|
|
||||||
skipWaiting: true,
|
|
||||||
clientsClaim: true,
|
|
||||||
|
|
||||||
navigateFallback: '/index.html',
|
|
||||||
runtimeCaching: [
|
|
||||||
{
|
|
||||||
urlPattern: new RegExp('^https://stacjownik.eu-4.evennode.com/api/getSceneries'),
|
|
||||||
handler: 'NetworkFirst',
|
|
||||||
options: {
|
|
||||||
cacheName: 'sceneries-cache'
|
|
||||||
},
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
Reference in New Issue
Block a user