diff --git a/src/App.vue b/src/App.vue
index 8bfc186..7122bce 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -41,7 +41,9 @@
-
{{ currentRegion.value }}
+
+ {{ currentRegion.value }}
+
{{ data.activeStationCount }}
@@ -87,7 +89,14 @@
import Clock from "@/components/App/Clock.vue";
import StorageManager from "@/scripts/managers/storageManager";
-import { computed, ComputedRef, defineComponent } from "vue";
+import {
+ computed,
+ ComputedRef,
+ defineComponent,
+ inject,
+ provide,
+ ref,
+} from "vue";
import { GETTERS } from "./constants/storeConstants";
import { StoreData } from "./scripts/interfaces/StoreData";
import { useStore } from "./store";
@@ -111,9 +120,18 @@ export default defineComponent({
() => store.getters[GETTERS.currentRegion]
);
+ const isFilterCardVisible = ref(false);
+
+ provide("isFilterCardVisible", isFilterCardVisible);
+
return {
data,
currentRegion,
+ isFilterCardVisible,
+
+ openFilterCard() {
+ isFilterCardVisible.value = true;
+ },
};
},
diff --git a/src/components/StationsView/StationFilterCard.vue b/src/components/StationsView/StationFilterCard.vue
index 510065f..82ac7ba 100644
--- a/src/components/StationsView/StationFilterCard.vue
+++ b/src/components/StationsView/StationFilterCard.vue
@@ -97,8 +97,7 @@ import { ACTIONS, GETTERS, MUTATIONS } from "@/constants/storeConstants";
import inputData from "@/data/options.json";
import StorageManager from "@/scripts/managers/storageManager";
-import { useStore } from "@/store";
-import { computed, ComputedRef, defineComponent } from "@vue/runtime-core";
+import { defineComponent, inject, provide, ref } from "@vue/runtime-core";
import ActionButton from "../Global/ActionButton.vue";
import FilterOption from "./FilterOption.vue";
@@ -112,11 +111,18 @@ export default defineComponent({
inputs: { ...inputData },
saveOptions: false,
STORAGE_KEY: "options_saved",
- isVisible: false,
currentRegion: { id: "", value: "" },
}),
+ setup() {
+ const isVisible = inject("isFilterCardVisible");
+
+ return {
+ isVisible,
+ };
+ },
+
mounted() {
this.saveOptions = StorageManager.isRegistered(this.STORAGE_KEY);
diff --git a/src/data/options.json b/src/data/options.json
index fd35506..5a22961 100644
--- a/src/data/options.json
+++ b/src/data/options.json
@@ -201,15 +201,15 @@
"value": "PL1"
},
{
- "id": "eu2",
+ "id": "cae",
"value": "PL2"
},
{
- "id": "de",
+ "id": "usw",
"value": "DE"
},
{
- "id": "cze",
+ "id": "us",
"value": "CZE"
},
{
diff --git a/src/main.ts b/src/main.ts
index 5ae440b..db98ae9 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,4 +1,4 @@
-import { createApp, Directive } from 'vue'
+import { createApp, Directive, ref } from 'vue'
import App from './App.vue'
import router from './router'
import { store, key } from './store'
@@ -35,5 +35,6 @@ createApp(App)
.use(store, key)
.use(router)
.use(i18n)
+ .provide('isFilterCardVisible', ref(false))
.directive('click-outside', clickOutsideDirective)
.mount('#app')
diff --git a/src/views/StationsView.vue b/src/views/StationsView.vue
index 9716b66..b5a6b69 100644
--- a/src/views/StationsView.vue
+++ b/src/views/StationsView.vue
@@ -9,6 +9,7 @@
@changeFilterValue="changeFilterValue"
@invertFilters="invertFilters"
@resetFilters="resetFilters"
+ ref="filterCardRef"
/>