Revert "Create NDVI comparison graphs"

This reverts commit b320b69.

Author: digi-jules

frontend/src/App.vue

@@ -1,18 +1,19 @@
 <template>
   <h1 id="app">
-    <NdviGraph />
+    <TestComponent />
+    <MedianTempGraph />
   </h1>
 </template>
 
 <script>
-  import NdviGraph from "./components/NdviGraph.vue"
-  import MedianTempGraph from "./components/TestGraphOne.vue"
+  import TestComponent from "./components/TestComponent.vue"
+  // import MedianTempGraph from "./components/TestGraphOne.vue"
 
   export default {
     name: 'App',
     components: {
-      NdviGraph,
-      MedianTempGraph
+      TestComponent,
+      // MedianTempGraph
     }
   };
 </script>

frontend/src/components/NdviGraph.vue

@@ -0,0 +1,52 @@
+<template>
+  <div>
+    <h3>Temperature Data:</h3>
+    <ul v-if="temperatureData">
+      <li v-for="(data, index) in temperatureData.data" :key="index">
+        Timestamp: {{ data.timestamp }} - Value: {{ data.value }} °C
+      </li>
+    </ul>
+  </div>
+</template>
+
+<script>
+import { ref, onMounted } from 'vue'
+import axios from 'axios'
+
+export default {
+  name: 'FetchTemperatureData',
+  setup() {
+    const temperatureData = ref(null)
+
+    const fetchTemperatureData = async () => {
+      const apiUrl = 'http://localhost:8000/weather/index'
+      
+      const params = {
+        weatherVariable: "temperature_2m",
+        startDate: 1672527600,
+        endDate: 1675119600,
+        location: "TEMPELHOFER_FELD",
+        temporalResolution: "DAILY",
+        aggregation: "MEAN",
+      }
+
+      try {
+        const response = await axios.get(apiUrl, { params })
+        temperatureData.value = response.data
+      } catch (error) {
+        console.error("Error fetching temperature data:", error)
+      }
+    }
+
+    onMounted(() => {
+      fetchTemperatureData()
+    })
+
+    return {
+      temperatureData
+    }
+  }
+}
+</script>
+
+<style scoped></style>