Kandilli sonuçları için filtre hatasını düzeltir

Author: assoft

app.vue

@@ -34,7 +34,7 @@
 
             <div class="inline-flex items-center gap-2">
               <div class="text-xs">Şiddet</div>
-              <select class="bg-dark appearance-none text-white border-none p-2 text-sm" @change="setFilterMagnitude" value="0"
+              <select ref="selectMagnitudeRef" class="bg-dark appearance-none text-white border-none p-2 text-sm" @change="setFilterMagnitude" value="0"
                       title="Şiddetine Göre">
                 <option v-for="size in [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]" :value="size" :key="`size_${size}`"> {{ size >= 1 ? ">= " + size : "Tümü" }}</option>
               </select>
@@ -74,6 +74,8 @@ const setRefreshFrequency = (event: Event & { target: HTMLInputElement }) => ref
 const setNotifyQuakeSize = (event: Event & { target: HTMLInputElement }) => notifyQuakeSize.value = Number(event.target.value)
 const setFilterMagnitude = (event: Event & { target: HTMLInputElement }) => filterMagnitude.value = event.target.value
 
+const route = useRoute()
+const selectMagnitudeRef = ref<HTMLSelectElement | null>(null)
 onNuxtReady(() => {
   if (window.location.protocol !== 'tauri:') {
     return
@@ -83,6 +85,14 @@ onNuxtReady(() => {
     return false;
   }, { capture: true })
 })
+watch(route, (val) => {
+  if (filterMagnitude.value !== "0") {
+    filterMagnitude.value = "0"
+    if (selectMagnitudeRef.value) {
+      selectMagnitudeRef.value.value = "0"
+    }
+  }
+})
 </script>
 
 <style>

pages/kandilli.vue

@@ -26,12 +26,18 @@ const loading = ref<boolean>(false);
 const refreshFrequency = useState<number>('refreshFrequency')
 const notifyQuakeSize = useState<number>('notifyQuakeSize')
 const filterLocation = useState<string>('filterLocation')
+const filterMagnitude = useState<string>('filterMagnitude', () => "0")
 
 const router = useRouter();
 
 const filtered = computed<PIQuake[]>(() => {
     return quakes.value
         .filter((quake: PIQuake) => quake.location.includes(filterLocation.value))
+        .filter((quake: PIQuake) => {
+            if (filterMagnitude.value.length > 0) {
+                return quake.magnitude >= Number(filterMagnitude.value)
+            }
+        })
         .sort((a: PIQuake, b: PIQuake) => b.eventDate.toLocaleString().localeCompare(a.eventDate.toLocaleString()))
 })