From cd5a93fb8f477338d7a5b25eaa2a12335d62c142 Mon Sep 17 00:00:00 2001
From: charlene tau express <charlene.tan@tauexpress.com>
Date: Thu, 6 Mar 2025 15:02:14 +0800
Subject: [PATCH] add localstorage to search type

---
 docker/nginx.conf                 | 13 +++++++++++++
 src/components/InputFieldCard.vue | 17 ++++++++++++-----
 src/components/TableComp.vue      | 16 ++++++++++------
 src/utils/api.ts                  |  7 ++++++-
 src/views/HomeView.vue            |  2 +-
 vite.config.ts                    |  7 +++++++
 6 files changed, 49 insertions(+), 13 deletions(-)

diff --git a/docker/nginx.conf b/docker/nginx.conf
index 985f2e0..9adf34b 100644
--- a/docker/nginx.conf
+++ b/docker/nginx.conf
@@ -27,4 +27,17 @@ server {
             return 204;
         }
     }
+
+    location /recommend {
+        proxy_pass https://192.168.99.121;  # Forward request to backend
+        proxy_set_header Host $host;
+        proxy_set_header X-Real-IP $remote_addr;
+        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+        proxy_set_header X-Forwarded-Proto $scheme;
+
+        # Ensure query parameters are preserved
+        proxy_pass_request_body on;
+        proxy_pass_request_headers on;
+        proxy_set_header Connection "";
+    }
 }
diff --git a/src/components/InputFieldCard.vue b/src/components/InputFieldCard.vue
index 6aa1f86..b27ef84 100644
--- a/src/components/InputFieldCard.vue
+++ b/src/components/InputFieldCard.vue
@@ -14,7 +14,7 @@
 
     <div class="mt-[20px]">
       <label for="searchType" class="block text-sm !font-bold">Search Type</label>
-      <select v-model="selectedSearchType" id="searchType" class="mt-4 p-[10px] block w-full bg-[#1a1a1a] rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring focus:ring-blue-200">
+      <select v-model="selectedSearchType"  @change="saveSearchType" id="searchType" class="mt-4 p-[10px] block w-full bg-[#1a1a1a] rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring focus:ring-blue-200">
         <option v-for="option in searchTypes" :key="option" :value="option">
           {{ option }}
         </option>
@@ -49,7 +49,7 @@
 </div>
 </template>
 <script setup lang="ts">
-import {ref} from "vue";
+import {ref, onMounted} from "vue";
 import { useSearchStore } from "@/stores/searchStore";
 import { useRouter } from "vue-router";
 
@@ -61,10 +61,17 @@ const searchTypes = ref(["precise","associative","proximity","semantic"])
 const searchQuery = ref("")
 const pageNumber = ref()
 const pageSize = ref()
-
+onMounted(() => {
+  const savedType  = localStorage.getItem("searchType");
+  if (savedType) {
+    selectedSearchType.value = savedType;
+  }
+});
 
 const searchStore = useSearchStore();
-
+const saveSearchType = () => {
+  localStorage.setItem("searchType", selectedSearchType.value);
+};
 const sendRequest = async()=>{
   searchStore.searchParams = {
     query: searchQuery.value,
@@ -72,7 +79,7 @@ const sendRequest = async()=>{
     // page_num: pageNumber.value,
     // page_size: pageSize.value
   };
-  //console.log("searchStore: ", searchStore.searchParams)
+  
   router.push("/table");
 }
 </script>
\ No newline at end of file
diff --git a/src/components/TableComp.vue b/src/components/TableComp.vue
index 6aedc45..ca52308 100644
--- a/src/components/TableComp.vue
+++ b/src/components/TableComp.vue
@@ -10,7 +10,7 @@
             <button @click="goToSearchPage" class="btn rounded-[10px] bg-[#0000FF] text-[white]">Back To Search Page</button>
         </div>
         </div>
-        <div v-if="responseData" class="pt-[0px] h-[90%] w-[100%] border border-[blue] overflow-scroll">
+        <div v-if="!noData" class="pt-[0px] h-[90%] w-[100%] border border-[blue] overflow-scroll">
             <table class="table table-pin-rows border w-full">
                 <thead class="">
                     <!-- <tr  class=""> -->
@@ -40,11 +40,14 @@ import { useSearchStore } from "@/stores/searchStore";
 import {fetchData} from "@/utils/api.ts"
 import { useRouter } from "vue-router";
 const searchStore = useSearchStore();
-
-const responseData = ref("")
+// interface ApiResponse {
+//   data: any[];  // Adjust this type according to your API response
+// }
+const responseData = ref<any>({ data: [] })
 const searchWhat = ref(searchStore.searchParams.query)
 
 const query={...searchStore.searchParams}
+const noData=ref(false)
 
 const keys_of_a_data=ref<any[]>()
 
@@ -64,14 +67,15 @@ onMounted(()=>{
     }
     fetchData("/search",requestType,query).then(response =>{
         
-        
         if (response.data.length===0){
+            noData.value=true
             
-            
-            responseData.value=""
+            // responseData.value={}
+            console.log("temporary")
             
         }
         else {
+            noData.value=false
             responseData.value = response
 
             if(requestType==="POST"){
diff --git a/src/utils/api.ts b/src/utils/api.ts
index 03abb95..4e0a167 100644
--- a/src/utils/api.ts
+++ b/src/utils/api.ts
@@ -18,7 +18,12 @@ export const fetchData = async(endpoints="", requestType="GET", requestBody:Reco
 
         let response;
         if (requestBody?.search_type==="semantic"){
-            response = await fetch("/recommend", options)
+            const params = new URLSearchParams({
+                clause: requestBody?.query
+            }).toString();
+
+            
+            response = await fetch(`/recommend?${params}`, options)
         }
         else {
         
diff --git a/src/views/HomeView.vue b/src/views/HomeView.vue
index 2f6ad47..8d2a727 100644
--- a/src/views/HomeView.vue
+++ b/src/views/HomeView.vue
@@ -3,7 +3,7 @@ import InputFieldCard from '@/components/InputFieldCard.vue'
 </script>
 
 <template>
-  <main class="flex place-content-center p-4  h-[100%]">
+  <main class="flex place-content-center p-4  ">
     <InputFieldCard/>
   </main>
 </template>
diff --git a/vite.config.ts b/vite.config.ts
index 3e8e41b..494c3ee 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -17,6 +17,13 @@ export default defineConfig({
         target: "https://192.168.99.121",
         changeOrigin: true,
         secure: false,  // Ignores SSL certificate issues
+        // configure: (proxy) => {
+        //   proxy.on('proxyReq', (proxyReq, req) => {
+        //     console.log('Incoming request URL:', req.url); // Logs request URL
+        //     console.log('Final URL sent to backend:', proxyReq.path); // Logs what Vite sends
+        //     console.log('Final URL sent to backend:', proxyReq)
+        //   });
+        // }
       },
     },
   },