Fixed forecasting days

This commit is contained in:
2026-06-24 12:12:50 -04:00
parent 9ac343d9aa
commit 9e8f1a7c12
3 changed files with 16 additions and 31 deletions

View File

@@ -1,18 +1,11 @@
<script setup lang="ts">
import { computed } from 'vue'
import {formatDate} from '@ztimson/utils';
import {watch} from 'vue';
import {BASE, type DataRow} from '../services/api';
const props = defineProps<{ days: DataRow[] }>()
const props = withDefaults(defineProps<{ days: DataRow[] }>(), {days: <any>[]});
const items = computed(() => props.days.slice(0, 7).map(d => ({
date: new Date(d.time as string).toLocaleDateString('en', { weekday: 'short', month: 'short', day: 'numeric' }),
icon: d.forecast_weather_icon as string | null,
label: d.forecast_weather_label as string,
high: d.env_temp_max_c != null ? `${(d.env_temp_max_c as number).toFixed(1)}°` : '—',
low: d.env_temp_min_c != null ? `${(d.env_temp_min_c as number).toFixed(1)}°` : '—',
rain: d.forecast_precipitation_probability != null ? `${d.forecast_precipitation_probability}%` : null,
precip: d.forecast_precipitation_mm != null ? `${(d.forecast_precipitation_mm as number).toFixed(1)}mm` : null,
})))
watch(() => props.days, console.log, {immediate: true});
</script>
<style scoped lang="scss">
@@ -55,16 +48,16 @@ const items = computed(() => props.days.slice(0, 7).map(d => ({
<template>
<div class="forecast-wrap">
<div class="strip">
<div v-for="item in items" :key="item.date" class="day">
<div class="day-name">{{ item.date }}</div>
<img v-if="item.icon" :src="BASE + item.icon" class="day-icon" :alt="item.label" />
<div class="day-label">{{ item.label }}</div>
<div v-for="d in days" class="day">
<div class="day-name">{{ formatDate('ddd, MMM d', new Date(d.time + 'T00:00:00')) }}</div>
<img :src="BASE + d.icon" class="day-icon" :alt="(d.label?.toString() || '')" />
<div class="day-label">{{ d.label }}</div>
<div class="day-temps">
<span>{{ item.high }}</span>
<span class="day-low">{{ item.low }}</span>
<span>{{ d.temp_max }}</span>
<span class="day-low">{{ d.temp_min }}</span>
</div>
<div v-if="item.rain" class="day-rain">🌧 {{ item.rain }}</div>
<div v-if="item.precip" class="day-precip">{{ item.precip }}</div>
<div v-if="d.precipitation_chance" class="day-rain">🌧 {{ d.precipitation_chance }}</div>
<div v-if="d.precipitation" class="day-precip">{{ d.precipitation }}</div>
</div>
</div>
</div>

View File

@@ -98,12 +98,12 @@ export async function getOpenMeteo(lat, lon, start, end) {
time,
label: WMO[code] || 'Unknown',
icon,
forecast_weathercode: code,
code,
temperature: data.daily.temperature_2m_max[i],
env_temp_max_c: data.daily.temperature_2m_max[i],
env_temp_min_c: data.daily.temperature_2m_min[i],
temperature_max: data.daily.temperature_2m_max[i],
temperature_min: data.daily.temperature_2m_min[i],
precipitation: data.daily.precipitation_sum[i],
forecast_precipitation_probability: data.daily.precipitation_probability_max[i],
precipitation_chance: data.daily.precipitation_probability_max[i],
wind_speed: data.daily.windspeed_10m_max[i],
wind_gusts: data.daily.windgusts_10m_max[i],
wind_direction: data.daily.winddirection_10m_dominant[i],

View File

@@ -93,14 +93,6 @@ app.get('/api/daily', async (req, res) => {
const meteoStart = start >= next ? start : next
const coords = await getCoords()
console.log('[daily] query.start :', req.query.start)
console.log('[daily] query.end :', req.query.end)
console.log('[daily] now :', now.toISOString())
console.log('[daily] next :', next.toISOString())
console.log('[daily] start :', start.toISOString())
console.log('[daily] end :', end.toISOString())
console.log('[daily] meteoStart :', meteoStart.toISOString())
const [sensor, meteo] = await Promise.allSettled([
start < now ? queryDaily(start.toISOString(), now.toISOString()) : Promise.resolve([]),
end > now ? getOpenMeteo(coords.latitude, coords.longitude, meteoStart, end) : Promise.resolve([]),