Dodano podświetlenie rangi supportera w karcie stacji

src/components/StationsView/StationCard.vue

@@ -80,8 +80,8 @@
       <div class="dispatcher">
         <div
           class="dispatcher-level flex"
-          :style="calculateExpStyle(stationInfo.dispatcherExp)"
-        >{{stationInfo.online ? computedExp : ""}}</div>
+          :style="calculateExpStyle(stationInfo.dispatcherExp, stationInfo.dispatcherIsSupporter)"
+        >{{stationInfo.online ? computedDispatcherExp : ""}}</div>
         <div class="dispatcher-info">
           <div class="dispatcher-name">
             <a
@@ -175,7 +175,7 @@ export default class StationCard extends styleMixin {
 
   cardMode: number = 0;
 
-  get computedExp(): string {
+  get computedDispatcherExp(): string {
     return this.stationInfo.dispatcherExp < 2
       ? "L"
       : `${this.stationInfo.dispatcherExp}`;

src/mixins/styleMixin.ts

@@ -1,52 +1,47 @@
-import Vue from 'vue'
-import Component from 'vue-class-component'
+import Vue from 'vue';
+import Component from 'vue-class-component';
 
 // You can declare mixins as the same style as components.
 @Component
 export default class styleMixin extends Vue {
-    calculateExpStyle(exp: string | number): string {
-        const bgColor =
-            exp > -1
-                ? exp < 2
-                    ? "#26B0D9"
-                    : `hsl(${-exp * 5 + 100},  65%, 50%)`
-                : "#888";
+  calculateExpStyle(exp: string | number, isSupporter: boolean = false): string {
+    const bgColor = exp > -1 ? (exp < 2 ? '#26B0D9' : `hsl(${-exp * 5 + 100},  65%, 50%)`) : '#888';
 
-        const fontColor = exp > 15 ? "white" : "black";
+    const fontColor = exp > 15 ? 'white' : 'black';
+    const boxShadow = isSupporter ? `box-shadow: 0 0 10px 2px ${bgColor}` : '';
 
-        return `backgroundColor: ${bgColor}; color: ${fontColor}`;
+    return `backgroundColor: ${bgColor}; color: ${fontColor}; ${boxShadow};`;
+  }
+
+  statusClasses(occupiedTo: string) {
+    let className = '';
+
+    switch (occupiedTo) {
+      case 'WOLNA':
+        className = 'free';
+        break;
+      case 'KOŃCZY':
+        className = 'ending';
+        break;
+      case 'NIEZALOGOWANY':
+        className = 'not-signed';
+        break;
+      case 'BEZ LIMITU':
+        className = 'no-limit';
+        break;
+      case 'NIEDOSTĘPNY':
+        className = 'unavailable';
+        break;
+      case 'Z/W':
+        className = 'brb';
+        break;
+      case 'BRAK MIEJSCA':
+        className = 'no-space';
+        break;
+      default:
+        break;
     }
 
-
-    statusClasses(occupiedTo: string) {
-        let className = "";
-
-        switch (occupiedTo) {
-            case "WOLNA":
-                className = "free";
-                break;
-            case "KOŃCZY":
-                className = "ending";
-                break;
-            case "NIEZALOGOWANY":
-                className = "not-signed";
-                break;
-            case "BEZ LIMITU":
-                className = "no-limit";
-                break;
-            case "NIEDOSTĘPNY":
-                className = "unavailable";
-                break;
-            case "Z/W":
-                className = "brb";
-                break;
-            case "BRAK MIEJSCA":
-                className = "no-space";
-                break;
-            default:
-                break;
-        }
-
-        return className;
-    }
+    return className;
+  }
 }

src/scripts/interfaces/Station.ts

@@ -10,6 +10,7 @@ export default interface Station {
   dispatcherName: string;
   dispatcherExp: number;
   dispatcherId: number;
+  dispatcherIsSupporter: boolean;
   stationLines: string;
   stationProject: string;
   reqLevel: string;

src/store/store.ts

@@ -223,6 +223,7 @@ export default class Store extends VuexModule {
             dispatcherRate: station.dispatcherRate,
             dispatcherId: station.dispatcherId,
             dispatcherExp: station.dispatcherExp,
+            dispatcherIsSupporter: station.dispatcherIsSupporter,
             occupiedTo: statusLabel,
             stationTrains,
             statusTimestamp,
@@ -282,6 +283,7 @@ export default class Store extends VuexModule {
       dispatcherRate: 0,
       dispatcherExp: -1,
       dispatcherId: 0,
+      dispatcherIsSupporter: false,
       online: false,
       occupiedTo: 'WOLNA',
       statusTimestamp: -3,
@@ -315,9 +317,12 @@ export default class Store extends VuexModule {
           dispatcherRate: 0,
           dispatcherExp: -1,
           dispatcherId: 0,
+          dispatcherIsSupporter: false,
+          online: false,
           occupiedTo: 'WOLNA',
           statusTimestamp: -3,
-          online: false,
+          stationTrains: [],
+          scheduledTrains: [],
         });
 
       return acc;