filters added

package-lock.json

@@ -11,6 +11,7 @@
                 "@primevue/themes": "^4.0.0",
                 "axios": "^1.7.2",
                 "chart.js": "3.3.2",
+                "moment": "^2.30.1",
                 "primeicons": "^6.0.1",
                 "primevue": "^4.0.0",
                 "vue": "^3.4.34",
@@ -2519,6 +2520,15 @@
                 "ufo": "^1.5.3"
             }
         },
+        "node_modules/moment": {
+            "version": "2.30.1",
+            "resolved": "https://registry.npmjs.org/moment/-/moment-2.30.1.tgz",
+            "integrity": "sha512-uEmtNhbDOrWPFS+hdjFCBfy9f2YoyzRpwcl+DqpC6taX21FzsTLQVbMV/W7PzNSX6x/bhC1zA3c2UQ5NzH6how==",
+            "license": "MIT",
+            "engines": {
+                "node": "*"
+            }
+        },
         "node_modules/ms": {
             "version": "2.1.2",
             "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",

package.json

@@ -11,6 +11,7 @@
         "@primevue/themes": "^4.0.0",
         "axios": "^1.7.2",
         "chart.js": "3.3.2",
+        "moment": "^2.30.1",
         "primeicons": "^6.0.1",
         "primevue": "^4.0.0",
         "vue": "^3.4.34",

src/views/pages/KsDocuments.vue

@@ -3,7 +3,7 @@
         <DataTable v-model:filters="filters" :value="ksdocuments" paginator showGridlines :rows="10" dataKey="id"
                 filterDisplay="menu" :loading="loading" :globalFilterFields="['name', 'fileName', 'ingestionStatus', 'ingestionDateFormat']">
             <template #header>
-                <div class="flex items-center justify-between gap-4 p-4 bg-gray-100 border-b border-gray-200">
+                <div class="flex items-center justify-between gap-4 p-4 ">
                     <span class="text-xl font-bold">KS Documents</span>
                     <div class="flex items-center gap-2 flex-grow">
                     <IconField class="flex-grow">
@@ -13,12 +13,15 @@
                         <InputText v-model="filters['global'].value" placeholder="Keyword Search" />
                     </IconField>
                     </div>
-                    <Button icon="pi pi-plus" rounded raised @click="newKsDocument()" />
+                    <Button icon="pi pi-plus" rounded raised @click="newKsDocument()" v-tooltip="'Create New Document'" class="mr-2"  />
+                    <Button icon="pi pi-check-circle" rounded raised @click="startlngestion()" v-tooltip="'Start All documents Ingestion'" class="mr-8" :disabled="allDocumentsIngested"  :class="{ 'p-button-danger': allDocumentsIngested }"/>
                 </div>
             </template>
             <template #empty>No Records found</template>
             <template #loading>Loading Data. Please wait....</template>
-            <Column field="name" header="Name" style="min-width: 12rem">
+            <Column field="id" header="ksdocuments id" sortable style="min-width: 12rem"/>
+            <Column field="ingestionInfo.id" header="ksingestioninfo id"  sortable style="min-width: 12rem"/>
+            <Column field="name" header="Name" sortable style="min-width: 12rem">
                 <template #body="{ data }">
                     {{ data.name }}
                 </template>
@@ -26,7 +29,7 @@
                     <InputText v-model="filterModel.value" type="text" @input="filterCallback()" placeholder="Search by File" />
                 </template>
             </Column>
-            <Column field="fileName" header="File Name">
+            <Column field="fileName" header="File Name" sortable >
                 <template #body="{ data }">
                     {{ data.fileName }}
                 </template>
@@ -34,7 +37,7 @@
                     <InputText v-model="filterModel.value" type="text" @input="filterCallback()" placeholder="Search by File Name" />
                 </template>
             </Column>
-            <Column field="ingestionStatus" header="Status">
+            <Column field="ingestionStatus" header="Status" sortable >
                 <template #body="slotProps">
                     <Tag :value="slotProps.data.ingestionStatus" :severity="getStatus(slotProps.data)" />
                 </template>
@@ -48,7 +51,7 @@
             </Column>
             <Column header="Ingestion Date" filterField="ingestionDateFormat" dataType="date" style="min-width: 10rem">
                 <template #body="{ data }">
-                    {{ data.ingestionDate }}
+                    {{ formatDate(data.ingestionDate) }}
                 </template>
                 <template #filter="{ filterModel }">
                     <DatePicker v-model="filterModel.value" dateFormat="mm/dd/yy" placeholder="mm/dd/yyyy"  @change="updateFilterModel"/>
@@ -56,11 +59,21 @@
             </Column>
             <Column headerStyle="width: 5rem; text-align: center" bodyStyle="text-align: center; overflow: visible">
                 <template #body="slotProps">
-                    <Button type="button" icon="pi pi-pencil" rounded @click="editKsDocument(slotProps.data)" />
+                <div class="flex justify-center items-center">
-                    <Tag :value="slotProps.data.id" />
+                    <Button type="button" icon="pi pi-pencil" rounded @click="editKsDocument(slotProps.data)" v-tooltip="'Edit the information of document'" class="mr-4" />
-                    <Tag :value="slotProps.data.ingestionInfo.id" />
+                    <!--Tag :value="slotProps.data.id" /-->
-                    <Button type="button" v-if="slotProps.data.ingestionStatus === 'NEW'" icon="pi pi-play" rounded
+                    <!--Tag :value="slotProps.data.ingestionInfo.id" /-->
-                        @click="startIngestion(slotProps.data.id)" />
+                    <!--Button type="button" v-if="slotProps.data.ingestionStatus === 'NEW'" icon="pi pi-play" rounded
+                        @click="startIndividualngestion(slotProps.data.id)" v-tooltip="'Start Ingestion of document'" class="mr-4" /-->
+                    <Button type="button" 
+                            icon="pi pi-play" 
+                            rounded 
+                            @click="startIndividualngestion(slotProps.data.id)" 
+                            v-tooltip="'Start Ingestion of document'" 
+                            :disabled="slotProps.data.ingestionStatus === 'INGESTED'" 
+                            :class="{ 'p-button-danger': slotProps.data.ingestionStatus === 'INGESTED' }" 
+                            class="mr-7" />
+                    </div>
                 </template>
             </Column>
         </DataTable>
@@ -76,6 +89,7 @@ import { FilterMatchMode, FilterOperator } from '@primevue/core/api';
 import axios from 'axios';
 import { computed, onMounted, ref } from 'vue';
 import { useRouter } from 'vue-router';
+import moment from 'moment';
 
 import Button from 'primevue/button';
 import Column from 'primevue/column';
@@ -85,6 +99,7 @@ import Dialog from 'primevue/dialog';
 import InputText from 'primevue/inputtext';
 import Select from 'primevue/select';
 import Tag from 'primevue/tag';
+import Tooltip from 'primevue/tooltip';
 
 
 const router = useRouter()
@@ -119,6 +134,12 @@ onMounted(() => {
         });
 });
 
+// Computed property to check if all documents are ingested
+const allDocumentsIngested = computed(() => {
+    return ksdocuments.value && ksdocuments.value.every(doc => doc.ingestionStatus === 'INGESTED');
+});
+
+
 const getStatus = (data) => {
     if (data.ingestionStatus === 'INGESTED') {
         return 'success';
@@ -145,7 +166,7 @@ const editKsDocument = (data) => {
     router.push({ name: 'ks-document-edit', params: { id: data.id } });
 }
 
-const startIngestion = (id) => {
+const startIndividualngestion = (id) => {
     axios.get(`http://localhost:8082/test/ingest_document/${id}`)
         //axios.get('http://localhost:8082/test/ingestion_loop')
         .then(response => {
@@ -167,9 +188,53 @@ const startIngestion = (id) => {
         });
 };
 
+const startlngestion = () => {
+    axios.get('http://localhost:8082/test/ingestion_loop')
+        .then(response => {
+            ingestionResult.value = response.data;
+            if (response.data.status == "OK") {
+                ksdocuments.value.forEach(element => {
+                    if (response.data.ingestedDocumentId.includes(element.id)) {
+                        element.status = "INGESTED"
+                    }
+                });
+            } else {
+                ingestionResult.value = `Error: ${response.data.message}`;
+            }
+
+            ingestionDialogVisible.value = true;
+        })
+        .catch(error => {
+            ingestionDialogVisible.value = true;
+        });
+};
+
 const newKsDocument = () => {
     console.log('new');
     router.push({ name: 'ks-document-new' });
 
 }
+
+// Function to format date string
+function formatDate(dateString) {
+    // Parse the date string using moment
+    return moment(dateString).format('MM/DD/YYYY');
+}
+
 </script>
+
+<style scoped>
+/* Custom styling for disabled red button */
+.p-button-danger {
+    background-color: red;
+    border-color: red;
+    color: white;
+}
+.p-button-danger:disabled {
+    background-color: red;
+    border-color: red;
+    color: white;
+    cursor: not-allowed;
+}
+</style>
+