diff --git a/src/components/StationsView/StationCard.vue b/src/components/StationsView/StationCard.vue index ef2ee5e..c18b209 100644 --- a/src/components/StationsView/StationCard.vue +++ b/src/components/StationsView/StationCard.vue @@ -80,8 +80,8 @@
{{stationInfo.online ? computedExp : ""}}
+ :style="calculateExpStyle(stationInfo.dispatcherExp, stationInfo.dispatcherIsSupporter)" + >{{stationInfo.online ? computedDispatcherExp : ""}}
-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; + } } diff --git a/src/scripts/interfaces/Station.ts b/src/scripts/interfaces/Station.ts index 75585fb..ce7577c 100644 --- a/src/scripts/interfaces/Station.ts +++ b/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; diff --git a/src/store/store.ts b/src/store/store.ts index 309979c..fd6c9c7 100644 --- a/src/store/store.ts +++ b/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;