From e3735c171f8efbcfb709e6cbc60991c49f0a8872 Mon Sep 17 00:00:00 2001 From: Spythere Date: Wed, 13 Apr 2022 00:52:15 +0200 Subject: [PATCH] Przystosowanie pod WS --- src/App.vue | 4 +- src/components/SceneryView/SceneryHistory.vue | 5 +- src/constants/storeConstants.ts | 2 +- src/scripts/managers/trainFilterManager.ts | 1 - src/store/index.ts | 71 ++++++++++--------- 5 files changed, 42 insertions(+), 41 deletions(-) diff --git a/src/App.vue b/src/App.vue index 770ba87..1328e8d 100644 --- a/src/App.vue +++ b/src/App.vue @@ -93,7 +93,7 @@ import Clock from '@/components/App/Clock.vue'; import StorageManager from '@/scripts/managers/storageManager'; import { computed, ComputedRef, defineComponent, provide, ref } from 'vue'; -import { GETTERS } from './constants/storeConstants'; +import { ACTIONS, GETTERS } from './constants/storeConstants'; import { StoreData } from './scripts/interfaces/StoreData'; import { useStore } from './store'; @@ -108,7 +108,7 @@ export default defineComponent({ setup() { const store = useStore(); - store.dispatch('synchronizeData'); + store.dispatch(ACTIONS.connectToAPI); const data: ComputedRef = computed(() => store.getters[GETTERS.allData]); diff --git a/src/components/SceneryView/SceneryHistory.vue b/src/components/SceneryView/SceneryHistory.vue index fc126f6..aad4f58 100644 --- a/src/components/SceneryView/SceneryHistory.vue +++ b/src/components/SceneryView/SceneryHistory.vue @@ -100,10 +100,7 @@ export default defineComponent({ async mounted() { try { - const apiResult: HistoryResultAPI = (await axios.get(`${API_URL}?name=${this.name}&historyCount=100`)).data; - - console.log(apiResult); - + const apiResult: HistoryResultAPI = (await axios.get(`${API_URL}?name=${this.name}&historyCount=100`)).data; if (!apiResult || !apiResult.response) return; this.isLoaded = true; diff --git a/src/constants/storeConstants.ts b/src/constants/storeConstants.ts index afad32d..64a93b4 100644 --- a/src/constants/storeConstants.ts +++ b/src/constants/storeConstants.ts @@ -1,5 +1,5 @@ export const ACTIONS = { - synchronizeData: "synchronizeData", + connectToAPI: "connectToAPI", fetchOnlineData: "fetchOnlineData", loadStaticStationData: "loadStaticStationData" } diff --git a/src/scripts/managers/trainFilterManager.ts b/src/scripts/managers/trainFilterManager.ts index d6669a6..b9afeba 100644 --- a/src/scripts/managers/trainFilterManager.ts +++ b/src/scripts/managers/trainFilterManager.ts @@ -19,7 +19,6 @@ function currentDelay(stops: TrainStop[] | undefined) { }; function filterTrainList(trainList: Train[], searchedTrain: string, searchedDriver: string, filters: TrainFilter[]) { - console.log(filters); return trainList.filter( (train) => diff --git a/src/store/index.ts b/src/store/index.ts index 8385465..73e6b08 100644 --- a/src/store/index.ts +++ b/src/store/index.ts @@ -20,19 +20,11 @@ import { getLocoURL, getScheduledTrain, getStatusID, getStatusTimestamp, parseSp import { URLs } from '@/scripts/utils/apiURLs'; import ScheduledTrain from '@/scripts/interfaces/ScheduledTrain'; import StationRoutes from '@/scripts/interfaces/StationRoutes'; -import { connect, io } from 'socket.io-client'; +import { connect, io, Socket } from 'socket.io-client'; const connectToDevAPI = true; -// Websocket config -const socket = io(process.env.NODE_ENV === 'production' || connectToDevAPI ? URLs.stacjownikAPI : URLs.stacjownikAPIDev, - { - transports: ["websocket", "polling"], - rememberUpgrade: true, - reconnection: true - }) -socket.emit('connection'); export interface State { stationList: Station[], @@ -47,6 +39,7 @@ export interface State { stationCount: number; dataConnectionStatus: DataStatus; + webSocket?: Socket; sceneryDataStatus: DataStatus; timetableDataStatus: DataStatus; @@ -56,6 +49,16 @@ export interface State { listenerLaunched: boolean; } +interface APIData { + stations?: StationAPIData[], + dispatchers?: string[][], + trains?: TrainAPIData[], + + stationsSWDRStatus: string; + trainsSWDRStatus: string; + dispatchersSWDRStatus: string; +} + interface StationJSONData { name: string; url: string; @@ -96,6 +99,8 @@ export const store = createStore({ trainCount: 0, stationCount: 0, + webSocket: undefined, + dataConnectionStatus: DataStatus.Loading, sceneryDataStatus: DataStatus.Loading, @@ -126,16 +131,23 @@ export const store = createStore({ }, actions: { - async synchronizeData({ commit, dispatch, state }) { - if (state.listenerLaunched) return; - + async connectToAPI({ state, dispatch }) { await dispatch(ACTIONS.loadStaticStationData); - socket.on('DATA_UPDATE', () => { - dispatch(ACTIONS.fetchOnlineData); + // Websocket config + const socket = io(process.env.NODE_ENV !== 'production' && connectToDevAPI ? URLs.stacjownikAPIDev : URLs.stacjownikAPI, + { + transports: ["websocket", "polling"], + rememberUpgrade: true, + reconnection: true + }) + + socket.on('UPDATE', (data: APIData) => { + this.dispatch(ACTIONS.fetchOnlineData, data); }); - // setInterval(() => dispatch(ACTIONS.fetchOnlineData), Math.floor(Math.random() * 5000) + 25000); + socket.emit('connection'); + state.webSocket = socket; }, async loadStaticStationData({ commit }) { @@ -147,28 +159,21 @@ export const store = createStore({ commit(MUTATIONS.SET_SCENERY_DATA, sceneryData); }, - async fetchOnlineData({ commit }) { - // Pobierz dane o pociągach i rozkładach jazdy z API Stacjownika - const trainsAPIData: { response: TrainAPIData[], errorMessage?: string } = (await axios.get(`${URLs.stacjownikAPI}/api/getActiveTrainList`)).data; - - // Pobierz dane o sceneriach online i o dyżurnych - const dispatchersAPIData: { success: boolean, message: string[][] } = await (await axios.get(URLs.dispatchers)).data; - const stationsAPIData: { success: boolean, message: StationAPIData[] } = await (await axios.get(URLs.stations)).data; - - if (!stationsAPIData || !stationsAPIData.success) { + async fetchOnlineData({ commit }, data: APIData) { + if (!data.stations) { commit(MUTATIONS.SET_SCENERY_DATA_STATUS, DataStatus.Error); return; } commit(MUTATIONS.SET_SCENERY_DATA_STATUS, DataStatus.Loaded); - commit(MUTATIONS.SET_DISPATCHER_DATA_STATUS, !dispatchersAPIData || !dispatchersAPIData.success ? DataStatus.Warning : DataStatus.Loaded) - commit(MUTATIONS.SET_TRAINS_DATA_STATUS, !trainsAPIData || !trainsAPIData.response ? DataStatus.Warning : DataStatus.Loaded); + commit(MUTATIONS.SET_DISPATCHER_DATA_STATUS, !data.dispatchers ? DataStatus.Warning : DataStatus.Loaded) + commit(MUTATIONS.SET_TRAINS_DATA_STATUS, !data.trains ? DataStatus.Warning : DataStatus.Loaded); // Zaktualizuj listę pociągów const updatedTrainList: Train[] = - trainsAPIData?.response - .filter(train => train.region === this.state.region.id && train.online) + data.trains + ?.filter(train => train.region === this.state.region.id && train.online) .map(train => { const stock = train.stockString.split(";"); const locoType = stock ? stock[0] : train.stockString; @@ -210,7 +215,7 @@ export const store = createStore({ const onlineStationNames: string[] = []; const prevDispatcherStatuses: State['lastDispatcherStatuses'] = []; - stationsAPIData.message.forEach((stationAPI) => { + data.stations?.forEach((stationAPI) => { if (stationAPI.region !== this.state.region.id || !stationAPI.isOnline) return; onlineStationNames.push(stationAPI.stationName); @@ -219,7 +224,7 @@ export const store = createStore({ const station = this.state.stationList.find(s => s.name == stationAPI.stationName); const prevDispatcherStatus = this.state.lastDispatcherStatuses.find(dispatcher => dispatcher.hash === stationAPI.stationHash); - const stationStatus = dispatchersAPIData.success ? dispatchersAPIData.message.find((status: string[]) => status[0] == stationAPI.stationHash && status[1] == this.state.region.id) : -1; + const stationStatus = data.dispatchers?.find((status: string[]) => status[0] == stationAPI.stationHash && status[1] == this.state.region.id) || -1; const statusTimestamp = getStatusTimestamp(stationStatus == -1 && prevDispatcherStatus ? prevDispatcherStatus.statusTimestamp : stationStatus); const statusID = getStatusID(stationStatus == -1 && prevDispatcherStatus ? prevDispatcherStatus.statusID : stationStatus); @@ -230,8 +235,8 @@ export const store = createStore({ statusTimestamp }); - const stationTrains = trainsAPIData.response - .filter(train => train.region === this.state.region.id && train.online && train.currentStationName === stationAPI.stationName) + const stationTrains = data.trains + ?.filter(train => train?.region === this.state.region.id && train.online && train.currentStationName === stationAPI.stationName) .map(train => ({ driverName: train.driverName, trainNo: train.trainNo })); station?.generalInfo?.checkpoints.forEach(cp => cp.scheduledTrains.length = 0); @@ -323,7 +328,7 @@ export const store = createStore({ this.state.trainList = updatedTrainList; this.state.trainsDataStatus = DataStatus.Loaded; - if (dispatchersAPIData.success) + if (data.dispatchers != null) this.state.lastDispatcherStatuses = prevDispatcherStatuses; }, },