Merge pull request #9 from Spythere/development

v2.5.3

.github/workflows/firebase-hosting-merge.yml

@@ -11,7 +11,7 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v2
-      - run: npm ci && npm run build
+      - run: yarn && yarn build
       - uses: FirebaseExtended/action-hosting-deploy@v0
         with:
           repoToken: '${{ secrets.GITHUB_TOKEN }}'

.github/workflows/firebase-hosting-pull-request.yml

@@ -9,7 +9,7 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v2
-      - run: npm ci && npm run build
+      - run: yarn && yarn build
       - uses: FirebaseExtended/action-hosting-deploy@v0
         with:
           repoToken: '${{ secrets.GITHUB_TOKEN }}'

package.json

@@ -1,7 +1,7 @@
 {
   "name": "station-manager-2.0",
   "private": true,
-  "version": "2.5.2",
+  "version": "2.5.3",
   "type": "module",
   "scripts": {
     "dev": "vite",
@@ -9,16 +9,16 @@
     "preview": "vite preview"
   },
   "dependencies": {
-    "axios": "^1.1.3",
+    "axios": "^1.10.0",
-    "pinia": "^2.0.18",
+    "pinia": "^3.0.3",
-    "sass": "^1.55.0",
+    "sass": "^1.89.2",
-    "vue": "^3.2.37",
+    "vue": "^3.5.17",
-    "vue-router": "^4.1.3"
+    "vue-router": "^4.5.1"
   },
   "devDependencies": {
-    "@vitejs/plugin-vue": "^3.2.0",
+    "@vitejs/plugin-vue": "^6.0.0",
-    "typescript": "^4.8.4",
+    "typescript": "^5.8.3",
-    "vite": "^3.2.1",
+    "vite": "^7.0.0",
-    "vue-tsc": "^1.0.9"
+    "vue-tsc": "^2.2.10"
   }
 }

src/App.vue

@@ -57,6 +57,5 @@ export default defineComponent({
 </script>
 
 <style lang="scss">
-@import './styles/global.scss';
+@use './styles/global';
-@import url('https://fonts.googleapis.com/css2?family=Inter:wght@500;600&display=swap');
 </style>

src/components/RoutesModal.vue

@@ -84,7 +84,11 @@
                 </label>
               </div>
 
-              <div>Prędkość: <input type="number" v-model="route.routeSpeed" /> km/h</div>
+              <div v-if="route.routeTracks == 1">Prędkość: <input type="number" v-model="route.routeSpeed" /> km/h</div>
+
+              <div v-if="route.routeTracks == 2">Prędkość (wjazd na sc.): <input type="number" v-model="route.routeSpeed" /> km/h</div>
+              <div v-if="route.routeTracks == 2">Prędkość (wyjazd ze sc.): <input type="number" v-model="route.routeSpeedExit" /> km/h</div>
+              
               <div>Długość: <input type="number" v-model="route.routeLength" /> m</div>
               <div>Linia kolejowa: <input type="number" v-model="route.realLineNo" /></div>
             </form>
@@ -145,6 +149,7 @@ export default defineComponent({
         isRouteSBL: false,
         routeLength: 0,
         routeSpeed: 0,
+        routeSpeedExit: 0,
         routeTracks: 1,
       });
       this.saveRoutes();

src/components/TableActions.vue

@@ -138,7 +138,7 @@ export default defineComponent({
         this.sceneriesStore.changesResponse = updateResData;
         this.sceneriesStore.fetchSceneriesData();
       } catch (error) {
-        this.globalStore.alertMessage = 'Ups! Wystąpił błąd podczas zapisywania danych!';
+        this.globalStore.alertMessage = 'Ups! Wystąpił błąd podczas zapisywania danych! ' + error;
         console.error(error);
       }
     },

src/styles/_fonts.scss

@@ -0,0 +1,23 @@
+@font-face {
+  font-display: swap;
+  font-family: 'Inter';
+  font-style: normal;
+  font-weight: 400;
+  src: url('/fonts/inter-v19-latin_latin-ext-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+}
+
+@font-face {
+  font-display: swap;
+  font-family: 'Inter';
+  font-style: normal;
+  font-weight: 500;
+  src: url('/fonts/inter-v19-latin_latin-ext-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+}
+
+@font-face {
+  font-display: swap;
+  font-family: 'Inter';
+  font-style: normal;
+  font-weight: 600;
+  src: url('/fonts/inter-v19-latin_latin-ext-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
+}

src/styles/_global.scss

@@ -1,15 +1,17 @@
+@use "sass:color";
+@use 'fonts';
+
 body,
 html {
   margin: 0;
   background-color: #1e2341;
   color: white;
   box-sizing: border-box;
+  font-size: 16px;
 
   @media screen and (max-width: 700px) {
     font-size: calc(0.7vw + 0.7rem);
   }
-
-  font-size: 16px;
 }
 
 #app {
@@ -27,6 +29,7 @@ a:visited {
 
 * {
   font-family: 'Inter', sans-serif;
+  font-weight: 500;
   box-sizing: inherit;
 }
 
@@ -37,11 +40,13 @@ input {
 }
 
 button {
+  $color: #3c5a89;
+
   appearance: none;
   outline: none;
   border: none;
 
-  background-color: #3c5a89;
+  background-color: $color;
   color: white;
 
   padding: 0.5em 0.5em;
@@ -54,7 +59,7 @@ button {
 
   &:hover:not([data-disabled='true']),
   &:focus-visible {
-    background-color: lighten($color: #3c5a89, $amount: 10%);
+    background-color: color.adjust($color, $lightness: 10%);
   }
 
   &[data-disabled='true'] {

src/types/sceneries.types.ts

@@ -78,6 +78,7 @@ export interface SceneryRoutesInfo {
   isRouteSBL: boolean;
   isInternal: boolean;
   routeSpeed: number;
+  routeSpeedExit?: number;
   routeLength: number;
   routeTracks: number;
   hidden?: boolean;

src/views/ManagerView.vue

@@ -10,9 +10,11 @@
     <div class="table_container">
       <table>
         <thead>
-          <th v-for="header in headers" :width="header.width">{{ header.value }}</th>
+          <tr>
-          <th width="250">Dostępność</th>
+            <td v-for="header in headers" :width="header.width">{{ header.value }}</td>
-          <th width="80">Usuń</th>
+            <td width="250">Dostępność</td>
+            <td width="80">Usuń</td>
+          </tr>
         </thead>
 
         <tbody>
@@ -23,7 +25,7 @@
 
               <span v-else-if="propName === 'checkpoints'">{{ station[propName] ? 'POKAŻ' : 'DODAJ' }}</span>
 
-              <span v-else-if="propName === 'routes'" style="font-size: 1.1em;" :routes="station.routesInfo">
+              <span v-else-if="propName === 'routes'" style="font-size: 1.1em" :routes="station.routesInfo">
                 <b>{{ station.routesInfo.length }}</b>
               </span>
 
@@ -41,7 +43,7 @@
                 name="availability"
                 :id="`select-${row}`"
                 v-model="sceneriesStore.sortedStationList[row]['availability']"
-                @input="(e) => changeAvailability(station, sceneriesStore.sortedStationList[row]['availability'], e)"
+                @input="changeAvailability(station, sceneriesStore.sortedStationList[row]['availability'], $event)"
               >
                 <option value="default">dostępna (w paczce)</option>
                 <option value="nonDefault">dostępna (poza paczką)</option>
@@ -150,7 +152,7 @@ export default defineComponent({
         return;
       }
 
-      let newValue = prompt(`Zmień wartość dla rubryki ${this.headers.find(h => h.id === propertyName)?.value ?? ''}`, oldValue || '');
+      let newValue = prompt(`Zmień wartość dla rubryki ${this.headers.find((h) => h.id === propertyName)?.value ?? ''}`, oldValue || '');
       if (newValue == null) return;
       (this.sceneriesStore.stationList[stationListRow] as any)[propertyName] = typeof oldValue === 'number' ? parseInt(newValue) : newValue;
       // this.$set(this.stationList[stationListRow], propertyName, parseInt(newValue));
@@ -212,14 +214,14 @@ table thead {
   top: 0;
 }
 
-table th {
+table thead td {
   padding: 0.4rem 0.45rem;
   background-color: #151b24;
   color: white;
   top: 0;
 }
 
-table tr {
+table tbody tr {
   background-color: #2c394b;
   transition: background-color 100ms;
   text-overflow: ellipsis;
@@ -243,7 +245,7 @@ table tr:hover {
   cursor: pointer;
 }
 
-table tr td {
+table tbody tr td {
   padding: 0.3rem 0.5rem;
   border: 1px solid #2c2c2c;
   overflow: hidden;