#2371 move search function to store and fix errors

Author: athu-tran

src/components/cveRecordLookupModule.vue

@@ -104,22 +104,7 @@ export default {
         }
       }
 
-      this.search();
-    },
-    search() {
-      // * Check if keyword is CVE ID
-      if (useCveListSearchStore().isCveIdPattern()) {
-        useCveListSearchStore().totalExecutingRequests = 2;
-        
-        // 1st, lookup ID to get Record data, and continue to get CVE Records that mention that ID
-        useCveListSearchStore().cveId = useCveListSearchStore().query.toUpperCase();
-        useCveListSearchStore().getRecordData();
-      } else {
-        useCveListSearchStore().totalExecutingRequests = 1;
-      }
-
-      // * 2nd, query search service
-      useCveListSearchStore().getSearchResults();
+      useCveListSearchStore().search();
     },
     removeHelpText() {
       if (this.query.length === 0) {

src/stores/cveListSearch.js

@@ -31,7 +31,22 @@ export const useCveListSearchStore = defineStore('cveListSearch ', {
       this[field] -= 1;
     },
     isCveIdPattern() {
-      return new RegExp(/^CVE-\d{4}-\d{4,7}$/, 'i').test(useCveListSearchStore().query);
+      return new RegExp(/^CVE-\d{4}-\d{4,7}$/, 'i').test(this.query);
+    },
+    search() {
+      // * Check if keyword is CVE ID
+      if (this.isCveIdPattern()) {
+        this.totalExecutingRequests = 2;
+        
+        // 1st, lookup ID to get Record data, and continue to get CVE Records that mention that ID
+        this.cveId = this.query.toUpperCase();
+        this.getRecordData();
+      } else {
+        this.totalExecutingRequests = 1;
+      }
+
+      // * 2nd, query search service
+      this.getSearchResults();
     },
     async getRecordData() {
       this.cveRecordIsLoading = true;
@@ -41,7 +56,7 @@ export const useCveListSearchStore = defineStore('cveListSearch ', {
       try {
         axios.defaults.baseURL = `https://${import.meta.env.VITE_CVE_SERVICES_BASE_URL}`;
         const response = await axios.get(getRecordUrl);
-        const cveRecordData = response?.data || {};
+        const cveRecordData = response?.data || {};  
         console.log('cveRecordData', response?.data || {})
         console.log('Got record data');
         console.log(response)

src/views/CVERecord/SearchResults.vue

@@ -50,7 +50,7 @@
                       <p>
                         <span>Showing </span>
                         <span class="has-text-weight-bold">
-                          {{ (pagination.currentPage * numberPerPage) + 1 }} - {{ (pagination.currentPage * numberPerPage) + numberPerPage }}
+                          {{ ((pagination.currentPage * numberPerPage) - numberPerPage) + 1 }} - {{ ((pagination.currentPage * numberPerPage) - numberPerPage) + numberPerPage }}
                         </span>
                         <span> of </span>
                         <span class="has-text-weight-bold">
@@ -127,8 +127,8 @@
                         </thead>
                         <tbody>
                           <tr class="cve-search-result" v-if="Object.keys(useCveListSearchStore.recordData).length > 0">
-                            <td data-label="CVE ID" class="is-hidden-touch">{{ useCveListSearchStore.recordData.cveId }}</td>
-                            <td data-label="CNA" class="is-hidden-touch">{{ useCveListSearchStore.recordData.cna }}</td>
+                            <td data-label="CVE ID" style="width: 20%">{{ useCveListSearchStore.recordData.cveId }}</td>
+                            <td data-label="CNA" style="width: 20%">{{ useCveListSearchStore.recordData.cna }}</td>
                             <td data-label="Description">
                               <p v-for="description in useCveListSearchStore.recordData.descriptions" :key="description.key">{{ description }}</p>
                             </td>
@@ -163,7 +163,6 @@
     name: 'SearchResults',
     data() {
       return {
-        isMessageExpanded: false,
         useCveListSearchStore: useCveListSearchStore(),
         numberPerPage: 25,
         sortBy: {
@@ -182,7 +181,6 @@
     },
     beforeMount(){
       this.setupPagination();
-      console.log(this.pagination.totalPages)
     },
     watch: {
       numberPerPage() {
@@ -203,6 +201,8 @@
         if (this.pagination?.startWindow && this.pagination?.endWindow) {
           this.pagination.currentPageWindow = this.calcRange(this.pagination.startWindow, this.pagination.endWindow, 1);
         }
+
+        console.log('pagination ', this.pagination)
       },
       setupResultsPage() {
         // search service count starts at 0
@@ -225,6 +225,7 @@
           this.pagination.currentPageWindow = this.calcRange(this.pagination.startWindow, this.pagination.endWindow, 1);
         }
         console.log(this.pagination.currentPage, this.pagination.startWindow, this.pagination.endWindow, )
+        console.log('pagination ', this.pagination)
         this.paginate();
       },
       getPreviousPage() {
@@ -241,6 +242,7 @@
 
           this.pagination.currentPageWindow = this.calcRange(this.pagination.startWindow, this.pagination.endWindow, 1);
         }
+        console.log('pagination ', this.pagination)
         this.paginate();
       },
       paginate() {