Enhance branch selection with weather information and localization updates

- Updated FalukantService to include weather data in branch retrieval, enhancing user context.
- Modified BranchSelection component to display current weather for selected branches, improving user experience.
- Added weather translations in both English and German localization files for better accessibility.
- Improved styling for weather information display in the frontend.
This commit is contained in:
Torsten Schulz (local)
2025-12-02 12:53:02 +01:00
parent ba1a12402d
commit 08e2c87de8
5 changed files with 96 additions and 12 deletions

View File

@@ -1,15 +1,21 @@
<template>
<div class="branch-selection">
<h3>{{ $t('falukant.branch.selection.title') }}</h3>
<div>
<FormattedDropdown
:key="branchesKey"
:options="branches"
:columns="branchColumns"
v-model="localSelectedBranch"
:placeholder="$t('falukant.branch.selection.placeholder')"
@update:modelValue="updateSelectedBranch"
/>
<div class="selection-row">
<div class="dropdown-wrapper">
<FormattedDropdown
:key="branchesKey"
:options="branches"
:columns="branchColumns"
v-model="localSelectedBranch"
:placeholder="$t('falukant.branch.selection.placeholder')"
@update:modelValue="updateSelectedBranch"
/>
</div>
<div v-if="selectedBranchWeather" class="weather-info">
<span class="weather-label">{{ $t('falukant.branch.selection.weather') }}:</span>
<span class="weather-value">{{ $t(`falukant.weather.${selectedBranchWeather}`) }}</span>
</div>
</div>
<div>
<button @click="openCreateBranchDialog">
@@ -60,6 +66,9 @@ export default {
branchesKey() {
return this.branches.map(b => b.id).join('-');
},
selectedBranchWeather() {
return this.localSelectedBranch?.weather || null;
},
},
watch: {
selectedBranch(newVal) {
@@ -91,7 +100,35 @@ export default {
padding: 10px;
}
.selection-row {
display: flex;
align-items: center;
gap: 8px;
flex-wrap: wrap;
}
.dropdown-wrapper {
min-width: 200px;
}
button {
margin: 5px;
}
.weather-info {
padding: 8px 12px;
background-color: #f0f0f0;
border-radius: 4px;
font-size: 0.9em;
white-space: nowrap;
}
.weather-label {
font-weight: bold;
margin-right: 5px;
}
.weather-value {
text-transform: capitalize;
}
</style>

View File

@@ -1,5 +1,15 @@
{
"falukant": {
"weather": {
"sunny": "Sonnig",
"cloudy": "Bewölkt",
"rainy": "Regnerisch",
"stormy": "Stürmisch",
"snowy": "Schnee",
"foggy": "Neblig",
"windy": "Windig",
"clear": "Klar"
},
"statusbar": {
"age": "Alter",
"wealth": "Vermögen",
@@ -119,7 +129,8 @@
"title": "Niederlassungsauswahl",
"selected": "Ausgewählte Niederlassung",
"placeholder": "Noch keine Niederlassung ausgewählt",
"selectedcity": "Ausgewählte Stadt"
"selectedcity": "Ausgewählte Stadt",
"weather": "Aktuelles Wetter"
},
"actions": {
"create": "Neue Niederlassung erstellen",

View File

@@ -1,5 +1,15 @@
{
"falukant": {
"weather": {
"sunny": "Sunny",
"cloudy": "Cloudy",
"rainy": "Rainy",
"stormy": "Stormy",
"snowy": "Snowy",
"foggy": "Foggy",
"windy": "Windy",
"clear": "Clear"
},
"messages": {
"title": "Messages",
"tooltip": "Messages",
@@ -79,6 +89,13 @@
"noProposals": "No director candidates available."
},
"branch": {
"selection": {
"title": "Branch Selection",
"selected": "Selected Branch",
"placeholder": "No branch selected yet",
"selectedcity": "Selected City",
"weather": "Current Weather"
},
"vehicles": {
"cargo_cart": "Cargo cart",
"ox_cart": "Ox cart",

View File

@@ -228,6 +228,7 @@ export default {
type: this.$t(`falukant.branch.types.${branch.branchType.labelTr}`),
branchTypeLabelTr: branch.branchType.labelTr,
isMainBranch: branch.isMainBranch,
weather: branch.weather,
}));
if (!this.selectedBranch) {
this.selectMainBranch();