mirror of
https://github.com/ckaczor/HomeMonitor.git
synced 2026-01-14 01:25:38 -05:00
Separate historical from current
This commit is contained in:
@@ -71,8 +71,10 @@
|
||||
<td>{{ ConvertMillibarToInchesOfMercury(indoorStore.current.pressure).toFixed(2) }}"</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td className="header">Air Quality</td>
|
||||
<td :class="airQualityClass(indoorStore.current.airQualityIndex)" :title="indoorStore.current.airQualityIndex.toString()">
|
||||
<td className="header">Air quality</td>
|
||||
<td
|
||||
:class="airQualityClass(indoorStore.current.airQualityIndex)"
|
||||
:title="indoorStore.current.airQualityIndex.toString()">
|
||||
{{ airQualityDescription(indoorStore.current.airQualityIndex) }}
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
@@ -1,24 +1,35 @@
|
||||
<script lang="ts" setup>
|
||||
import { ref } from 'vue';
|
||||
import { ref, watch } from 'vue';
|
||||
import { useWeatherStore } from '@/stores/weatherStore';
|
||||
import { subHours } from 'date-fns';
|
||||
import WeatherAggregates from '@/models/weather/weather-aggregates';
|
||||
import { ConvertPascalToInchesOfMercury } from '@/pressureConverter';
|
||||
import { ShortenWindDirection } from '@/windFormatter';
|
||||
|
||||
const props = defineProps({
|
||||
start: { type: Date, required: true },
|
||||
end: { type: Date, required: true }
|
||||
});
|
||||
|
||||
const weatherAggregates = ref<WeatherAggregates | undefined>();
|
||||
|
||||
const weatherStore = useWeatherStore();
|
||||
|
||||
const end = new Date();
|
||||
const start = subHours(end, 24);
|
||||
|
||||
weatherStore.getReadingAggregate(start, end).then((newWeatherAggregates) => {
|
||||
weatherStore.getReadingAggregate(props.start, props.end).then((newWeatherAggregates) => {
|
||||
weatherAggregates.value = newWeatherAggregates;
|
||||
});
|
||||
|
||||
watch(
|
||||
() => [props.start, props.end],
|
||||
() => {
|
||||
weatherStore.getReadingAggregate(props.start, props.end).then((newWeatherAggregates) => {
|
||||
weatherAggregates.value = newWeatherAggregates;
|
||||
});
|
||||
}
|
||||
);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<DashboardItem title="Weather Summary">
|
||||
<DashboardItem title="Weather">
|
||||
<div className="weather-summary">
|
||||
<div v-if="!weatherAggregates">Loading...</div>
|
||||
<table v-else>
|
||||
@@ -81,7 +92,7 @@
|
||||
<td class="weather-summary-header">Wind direction</td>
|
||||
<td></td>
|
||||
<td>
|
||||
{{ weatherAggregates!.windDirectionAverage }}
|
||||
{{ ShortenWindDirection(weatherAggregates!.windDirectionAverage) }}
|
||||
</td>
|
||||
<td></td>
|
||||
</tr>
|
||||
|
||||
Reference in New Issue
Block a user