add login to index page

frontend/src/pages/IndexPage.vue

@@ -1,13 +1,71 @@
 <template>
-  <q-page class="flex flex-center">
+  
-    <img
+<q-page padding class="flex flex-center">
-      alt="Quasar logo"
+    <q-card style="width: 350px">
-      src="~assets/quasar-logo-vertical.svg"
+      <q-card-section>
-      style="width: 200px; height: 200px"
+        <div class="text-h6">Login</div>
-    >
+      </q-card-section>
+      
+      <q-card-section>
+        <q-form @submit.prevent="onSubmit" class="q-gutter-md">
+          <q-input
+            v-model="email"
+            type="email"
+            label="Email"
+            filled
+            :rules="[val => !!val || 'Email is required']"
+          />
+          
+          <q-input
+            v-model="password"
+            type="password"
+            label="Password"
+            filled
+            :rules="[val => !!val || 'Password is required']"
+          />
+          
+          <div class="q-mt-md">
+            <q-btn label="Login" type="submit" color="primary" class="full-width"/>
+          </div>
+          
+          <div class="text-center q-mt-sm">
+            <router-link to="/password-reset" class="text-primary">Forgot your password?</router-link>
+          </div>
+        </q-form>
+      </q-card-section>
+    </q-card>
   </q-page>
+
+
 </template>
 
-<script setup>
+<script>
-//
+import { ref } from 'vue'
+
+export default {
+  name: 'LoginPage',
+  setup() {
+    const email = ref('')
+    const password = ref('')
+    
+    const onSubmit = () => {
+      console.log('Login attempt with:', email.value, password.value)
+      
+      // Save login status
+      localStorage.setItem('isLoggedIn', 'true')
+      window.dispatchEvent(new Event('storage'))
+      
+      console.log('Redirecting to wave page...')
+      
+      // Direct navigation
+      window.location.href = '/#/wave'
+    }
+    
+    return {
+      email,
+      password,
+      onSubmit
+    }
+  }
+}
 </script>