#42 finalize weather settings

pull/1/head
Thomas Ballmann 4 years ago
parent 06cff47545
commit f75329e9fc

@ -4,7 +4,7 @@
:disabled="!api" :disabled="!api"
:items="entries" :items="entries"
:loading="isLoading" :loading="isLoading"
:search-input.sync="search" :search-input.sync="searchInput"
no-filter no-filter
_hide-no-data _hide-no-data
item-text="name" item-text="name"
@ -12,6 +12,8 @@
label="Location" label="Location"
placeholder="Start typing to Search" placeholder="Start typing to Search"
prepend-icon="$place" prepend-icon="$place"
return-object
clearable
> >
<template #item="{ item }"> <template #item="{ item }">
<v-list-item-avatar <v-list-item-avatar
@ -21,28 +23,28 @@
> >
<img <img
width="64" width="64"
:src="getConditionIcon(item.weather[0].icon)" :src="getConditionIcon(item.weather.icon)"
> >
</v-list-item-avatar> </v-list-item-avatar>
<v-list-item-content> <v-list-item-content>
<v-list-item-title> <v-list-item-title>
{{ item.name }}, {{ item.sys.country }} {{ item.label }}
</v-list-item-title> </v-list-item-title>
<v-list-item-subtitle v-if="item.weather"> <v-list-item-subtitle v-if="item.weather">
<img <img
width="16" width="16"
:src="getCountryFlag(item.sys.country)" :src="getCountryFlag(item.country)"
> >
{{ item.weather[0].description }} {{ item.weather.description }}
</v-list-item-subtitle> </v-list-item-subtitle>
</v-list-item-content> </v-list-item-content>
<v-list-item-action v-if="item.main"> <v-list-item-action v-if="item.main">
{{ item.main.temp }}°С {{ item.temp }}°С
</v-list-item-action> </v-list-item-action>
</template> </template>
<template #selection="{ item }"> <template #selection="{ item }">
{{ item.name }}, {{ item.sys.country }} {{ item.label }}
</template> </template>
</v-autocomplete> </v-autocomplete>
</template> </template>
@ -60,6 +62,10 @@
type: String, type: String,
required: true, required: true,
}, },
search: {
type: String,
required: false,
},
lang: { lang: {
type: String, type: String,
required: true, required: true,
@ -74,13 +80,16 @@
entries: [], entries: [],
isLoading: false, isLoading: false,
model: null, model: null,
search: null, searchInput: null,
}), }),
watch: { watch: {
model (val) { model (item) {
this.$emit('update:location', val) if (item) {
this.$emit('update:location', item.id)
this.$emit('update:search', item.label)
}
}, },
search (val) { searchInput (val) {
if (!val || val.length < 3) { if (!val || val.length < 3) {
return return
} }
@ -103,19 +112,31 @@
axios.get(url) axios.get(url)
.then(res => { .then(res => {
this.entries = res.data.list const entries = []
res.data.list.forEach((item) => {
entries.push({
id: item.id,
label: item.name + ', ' + item.sys.country,
temp: item.main.temp,
country: item.sys.country,
weather: {
icon: item.weather[0].icon,
description: item.weather[0].description,
},
})
})
this.entries = entries
this.isLoading = false this.isLoading = false
}) })
}, },
}, },
created () { created () {
// TODO // create entry for the current item
this.entries = [{ this.entries = [{
name: 'Freilassing',
sys: {
country: 'DE',
},
id: this.location, id: this.location,
label: this.search,
}] }]
this.model = this.location this.model = this.location
}, },

@ -1,75 +1,73 @@
<template> <template>
<div class="pa-5"> <v-card
<v-card flat
flat >
> <v-card-title class="display-2 mb-12 justify-center text-center">
<v-card-title class="display-2 mb-12 justify-center text-center"> Weather settings
Weather settings </v-card-title>
</v-card-title>
<v-card-text> <v-card-text>
<v-text-field <v-text-field
v-model="form.api" v-model="form.api"
label="OpenWeatherMap API key" label="OpenWeatherMap API key"
prepend-icon="$vpn_key" prepend-icon="$vpn_key"
> >
<template #append-outer> <template #append-outer>
<v-btn <v-btn
icon icon
href="https://openweathermap.org/" href="https://openweathermap.org/"
target="_blank" target="_blank"
> >
<v-icon>$launch</v-icon> <v-icon>$launch</v-icon>
</v-btn> </v-btn>
</template> </template>
</v-text-field> </v-text-field>
<weather-find-location <weather-find-location
:api="form.api" :api="form.api"
:location.sync="form.location" :location.sync="form.location"
:placeholder="form.name" :search.sync="form.name"
:lang="form.lang" :lang="form.lang"
:unit="form.unit" :unit="form.unit"
/> />
<v-select <v-select
v-model="form.unit" v-model="form.unit"
:disabled="!form.api" :disabled="!form.api"
:items="weatherUnit" :items="weatherUnit"
label="Units" label="Units"
prepend-icon=" " prepend-icon=" "
/> />
<v-select <v-select
v-model="form.lang" v-model="form.lang"
:disabled="!form.api" :disabled="!form.api"
:items="weatherLang" :items="weatherLang"
label="Language" label="Language"
prepend-icon="$translate" prepend-icon="$translate"
/> />
</v-card-text> </v-card-text>
<v-divider class="mt-12" /> <v-divider class="mt-12" />
<v-card-actions> <v-card-actions>
<v-btn <v-btn
text text
@click="resetChanges" @click="resetChanges"
> >
Restore Restore
</v-btn> </v-btn>
<v-spacer /> <v-spacer />
<v-btn <v-btn
:loading="isProcessing" :loading="isProcessing"
depressed depressed
@click="commitChanges" @click="commitChanges"
> >
<v-icon left> <v-icon left>
$done $done
</v-icon> </v-icon>
Save Save
</v-btn> </v-btn>
</v-card-actions> </v-card-actions>
</v-card> </v-card>
</div>
</template> </template>
<script> <script>
@ -116,12 +114,13 @@
commitChanges () { commitChanges () {
this.isProcessing = true this.isProcessing = true
// TODO
this.updateSettings({ this.updateSettings({
weather_: { weather: {
api: '', api: this.form.api,
locationId: 0, location: this.form.location,
lang: this.form.lang,
unit: this.form.unit,
name: this.form.name,
}, },
}) })
@ -132,7 +131,7 @@
resetChanges () { resetChanges () {
this.form.api = this.settings.weather.api this.form.api = this.settings.weather.api
this.form.location = this.settings.weather.location this.form.location = this.settings.weather.location
this.form.name = 'freilassing' // this.settings.weather.name this.form.name = this.settings.weather.name
this.form.lang = this.settings.weather.lang this.form.lang = this.settings.weather.lang
this.form.unit = this.settings.weather.unit this.form.unit = this.settings.weather.unit
}, },

@ -190,6 +190,7 @@ void setupApiSettings()
root["playlist"]["images"] = NVS.getString("playlist.images"); root["playlist"]["images"] = NVS.getString("playlist.images");
root["weather"]["api"] = NVS.getString("weather.api"); root["weather"]["api"] = NVS.getString("weather.api");
root["weather"]["name"] = NVS.getString("weather.name");
root["weather"]["location"] = NVS.getInt("weather.loc"); root["weather"]["location"] = NVS.getInt("weather.loc");
root["weather"]["lang"] = NVS.getString("weather.lang"); root["weather"]["lang"] = NVS.getString("weather.lang");
root["weather"]["unit"] = NVS.getString("weather.unit"); root["weather"]["unit"] = NVS.getString("weather.unit");
@ -241,6 +242,7 @@ void setupApiSettings()
if (!doc["weather"].isNull()) { if (!doc["weather"].isNull()) {
NVS.setString("weather.api", weather["api"]); NVS.setString("weather.api", weather["api"]);
NVS.setInt("weather.loc", weather["location"].as<unsigned int>()); NVS.setInt("weather.loc", weather["location"].as<unsigned int>());
NVS.setString("weather.name", weather["name"]);
NVS.setString("weather.lang", weather["lang"]); NVS.setString("weather.lang", weather["lang"]);
NVS.setString("weather.unit", weather["unit"]); NVS.setString("weather.unit", weather["unit"]);
} }

Loading…
Cancel
Save