Add timestamp param to bust cache when refreshing radar images

src/stores/weather.js

@@ -131,7 +131,7 @@ export const useWeatherStore = defineStore('weather', {
 
             if (!this.forecast) {
 
-                const weather = await this.getWeather(this.coordinates)
+                const weather = await this.getWeather()
 
                 const url = weather.properties.forecast
                 const response = await fetch(url)

src/views/WeatherView.vue

@@ -11,6 +11,7 @@ const weatherStore = useWeatherStore()
 
 const coordinates = ref(null)
 const refreshing = ref(false)
+const timestamp = ref(new Date().getTime())
 
 
 const panelHeadingTitle = computed(() => {
@@ -24,6 +25,16 @@ const panelHeadingTitle = computed(() => {
 })
 
 
+const radarLatestURL = computed(() => {
+    return `${weatherStore.radarLatestURL}?t=${timestamp.value}`
+})
+
+
+const radarLoopURL = computed(() => {
+    return `${weatherStore.radarLoopURL}?t=${timestamp.value}`
+})
+
+
 onActivated(() => {
 
     if (!weatherStore.coordinates) {
@@ -56,6 +67,7 @@ async function fetchWeather() {
 async function refreshWeather() {
     refreshing.value = true
     weatherStore.clearWeather(true)
+    timestamp.value = new Date().getTime()
     await fetchWeather()
     refreshing.value = false
 }
@@ -163,10 +175,10 @@ function showHourly(period) {
         <div class="panel-block">
           <div class="columns">
             <div class="column">
-              <img :src="weatherStore.radarLatestURL" />
+              <img :src="radarLatestURL" />
             </div>
             <div class="column">
-              <img :src="weatherStore.radarLoopURL" />
+              <img :src="radarLoopURL" />
             </div>
           </div>
         </div>