new info added and individual ingestion enabled
This commit is contained in:
sumedh
@@ -1,87 +0,0 @@
|
||||
<template>
|
||||
<div className="card">
|
||||
<h5>Ks document</h5>
|
||||
<form @submit.prevent="submitForm">
|
||||
<div class="p-field">
|
||||
<label for="description">Description</label>
|
||||
<InputText id="description" v-model="ksdocument.description" />
|
||||
</div>
|
||||
<div class="p-field">
|
||||
<label for="fileName">File Name</label>
|
||||
<InputText id="fileName" v-model="ksdocument.fileName" />
|
||||
</div>
|
||||
<div class="p-field">
|
||||
<label for="filePath">File Path</label>
|
||||
<InputText id="filePath" v-model="ksdocument.filePath" />
|
||||
</div>
|
||||
<div class="p-field">
|
||||
<label for="ingestionDate">Ingestion Date</label>
|
||||
<InputText id="ingestionDate" v-model="ksdocument.ingestionDate" />
|
||||
</div>
|
||||
<div class="p-field">
|
||||
<label for="defaultChunkSize">Default Chunk Size</label>
|
||||
<InputNumber id="defaultChunkSize" v-model="ksdocument.ingestionInfo.defaultChunkSize" />
|
||||
</div>
|
||||
<div class="p-field">
|
||||
<label for="maxNumberOfChunks">Max Number of Chunks</label>
|
||||
<InputNumber id="maxNumberOfChunks" v-model="ksdocument.ingestionInfo.maxNumberOfChunks" />
|
||||
</div>
|
||||
<div class="p-field">
|
||||
<label for="minChunkSize">Min Chunk Size</label>
|
||||
<InputNumber id="minChunkSize" v-model="ksdocument.ingestionInfo.minChunkSize" />
|
||||
</div>
|
||||
<div class="p-field">
|
||||
<label for="minChunkSizeToEmbed">Min Chunk Size To Embed</label>
|
||||
<InputNumber id="minChunkSizeToEmbed" v-model="ksdocument.ingestionInfo.minChunkSizeToEmbed" />
|
||||
</div>
|
||||
<div class="p-field">
|
||||
<label for="type">Type</label>
|
||||
<InputText id="type" v-model="ksdocument.ingestionInfo.type" />
|
||||
</div>
|
||||
<div class="p-field">
|
||||
<label for="ingestionStatus">Ingestion Status</label>
|
||||
<InputText id="ingestionStatus" v-model="ksdocument.ingestionStatus" />
|
||||
</div>
|
||||
<div class="p-field">
|
||||
<label for="name">Name</label>
|
||||
<InputText id="name" v-model="ksdocument.name" />
|
||||
</div>
|
||||
<div class="p-field">
|
||||
<label for="metadata">Metadata</label>
|
||||
<InputTextarea id="metadata" v-model="ksdocument.ingestionInfo.metadata" />
|
||||
</div>
|
||||
<Button label="Submit" type="submit" />
|
||||
</form>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue';
|
||||
import { onMounted } from 'vue'
|
||||
import axios from 'axios';
|
||||
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
import { data } from 'autoprefixer';
|
||||
|
||||
const route = useRoute()
|
||||
|
||||
const ksdocument = ref({ingestionInfo:{}});
|
||||
|
||||
onMounted(() => {
|
||||
axios.get('http://localhost:8082/ksdocuments/'+route.params.id)
|
||||
.then(response => {
|
||||
console.log(response.data);
|
||||
ksdocument.value = response.data;
|
||||
});
|
||||
});
|
||||
|
||||
const getStatus = (data) => {
|
||||
if (data.ingestionStatus === 'INGESTED') {
|
||||
return 'success';
|
||||
} else if (data.ingestionStatus === 'NEW') {
|
||||
return 'danger';
|
||||
} else {
|
||||
return 'warning';
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -1,48 +1,50 @@
|
||||
<template>
|
||||
<div className="card">
|
||||
<div className="card">
|
||||
|
||||
<DataTable
|
||||
:value="ksdocuments"
|
||||
:paginator="true"
|
||||
:rows="10"
|
||||
dataKey="id"
|
||||
:rowHover="true"
|
||||
showGridlines
|
||||
>
|
||||
<template #header>
|
||||
<div class="flex flex-wrap items-center justify-between gap-2">
|
||||
<span class="text-xl font-bold">KS Documents</span>
|
||||
<Button icon="pi pi-plus" rounded raised @click="newKsDocument()" />
|
||||
</div>
|
||||
</template>
|
||||
<Column field="name" header="Name"></Column>
|
||||
<Column field="fileName" header="File Name"></Column>
|
||||
<Column field="ingestionStatus" header="Status">
|
||||
<template #body="slotProps">
|
||||
<Tag :value="slotProps.data.ingestionStatus" :severity="getStatus(slotProps.data)" />
|
||||
<DataTable :value="ksdocuments" :paginator="true" :rows="10" dataKey="id" :rowHover="true" showGridlines>
|
||||
<template #header>
|
||||
<div class="flex flex-wrap items-center justify-between gap-2">
|
||||
<span class="text-xl font-bold">KS Documents</span>
|
||||
<Button icon="pi pi-plus" rounded raised @click="newKsDocument()" />
|
||||
</div>
|
||||
</template>
|
||||
</Column>
|
||||
<Column field="ingestionDate" header="Ingestion Date"></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)"/>
|
||||
</template>
|
||||
</Column>
|
||||
<Column field="name" header="Name"></Column>
|
||||
<Column field="fileName" header="File Name"></Column>
|
||||
<Column field="ingestionStatus" header="Status">
|
||||
<template #body="slotProps">
|
||||
<Tag :value="slotProps.data.ingestionStatus" :severity="getStatus(slotProps.data)" />
|
||||
</template>
|
||||
</Column>
|
||||
<Column field="ingestionDate" header="Ingestion Date"></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)" />
|
||||
<Tag :value="slotProps.data.id" />
|
||||
<Tag :value="slotProps.data.ingestionInfo.id" />
|
||||
<Button type="button" v-if="slotProps.data.ingestionStatus === 'NEW'" icon="pi pi-play" rounded
|
||||
@click="startIngestion(slotProps.data.id)" />
|
||||
</template>
|
||||
</Column>
|
||||
</DataTable>
|
||||
|
||||
<Dialog header="Ingestion Result" v-model:visible="ingestionDialogVisible" :modal="true" :closable="false">
|
||||
<p>{{ ingestionResult }}</p>
|
||||
<Button label="OK" icon="pi pi-check" @click="ingestionDialogVisible = false" />
|
||||
</Dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref } from 'vue';
|
||||
import { onMounted } from 'vue'
|
||||
import axios from 'axios';
|
||||
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
import { data } from 'autoprefixer';
|
||||
import { onMounted, ref } from 'vue';
|
||||
import { useRouter } from 'vue-router';
|
||||
|
||||
const router = useRouter()
|
||||
const ksdocuments = ref(null);
|
||||
|
||||
const ingestionDialogVisible = ref(false);
|
||||
const ingestionResult = ref('');
|
||||
|
||||
onMounted(() => {
|
||||
axios.get('http://localhost:8082/fe-api/ksdocuments')
|
||||
.then(response => {
|
||||
@@ -57,7 +59,7 @@ const getStatus = (data) => {
|
||||
} else if (data.ingestionStatus === 'NEW') {
|
||||
return 'danger';
|
||||
} else {
|
||||
return 'warning';
|
||||
return 'warn';
|
||||
}
|
||||
}
|
||||
|
||||
@@ -66,9 +68,31 @@ const editKsDocument = (data) => {
|
||||
router.push({ name: 'ks-document-edit', params: { id: data.id } });
|
||||
}
|
||||
|
||||
const startIngestion = (id) => {
|
||||
axios.get(`http://localhost:8082/test/ingest_document/${id}`)
|
||||
//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'});
|
||||
router.push({ name: 'ks-document-new' });
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
263
src/views/pages/KsNewDocumentForm.vue
Normal file
263
src/views/pages/KsNewDocumentForm.vue
Normal file
@@ -0,0 +1,263 @@
|
||||
<template>
|
||||
<Fluid>
|
||||
<div class="flex mt-6">
|
||||
<div class="card flex flex-col gap-4 w-full">
|
||||
<div>
|
||||
<h2 class="text-3xl font-bold mb-4">Ks document</h2>
|
||||
</div>
|
||||
<form @submit.prevent="submitForm" class="p-fluid">
|
||||
<div class="lex flex-col md:flex-row gap-4">
|
||||
<div class="flex flex-wrap gap-2 w-full">
|
||||
<label for="description">Description</label>
|
||||
<InputText id="description" type="text" v-model="formData.description" required class="w-full" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-12 md:col-6 mb-4">
|
||||
<span class="p-float-label">
|
||||
<label for="type">Type</label>
|
||||
<InputText id="type" v-model="formData.type" required class="w-full" />
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="col-12 md:col-6 mb-4">
|
||||
<span class="p-float-label">
|
||||
<label for="ksApplicationName">KS Application Name</label>
|
||||
<InputText id="ksApplicationName" v-model="formData.ksApplicationName" required class="w-full" />
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="col-12 md:col-6 mb-4">
|
||||
<span class="p-float-label">
|
||||
<label for="ksDocType">KS Doc Type</label>
|
||||
<InputText id="ksDocType" v-model="formData.ksDocType" required class="w-full" />
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="col-12 md:col-6 mb-4">
|
||||
<span class="p-float-label">
|
||||
<label for="ksDocSource">KS Doc Source</label>
|
||||
<InputText id="ksDocSource" v-model="formData.ksDocSource" required class="w-full" />
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="col-12 md:col-6 mb-4">
|
||||
<span class="p-float-label">
|
||||
<label for="defaultChunkSize">Default Chunk Size</label>
|
||||
<InputNumber id="defaultChunkSize" v-model="formData.defaultChunkSize" required class="w-full" />
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="col-12 md:col-6 mb-4">
|
||||
<span class="p-float-label">
|
||||
<label for="minChunkSize">Min Chunk Size</label>
|
||||
<InputNumber id="minChunkSize" v-model="formData.minChunkSize" required class="w-full" />
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="col-12 md:col-6 mb-4">
|
||||
<span class="p-float-label">
|
||||
<label for="maxNumberOfChunks">Max Number of Chunks</label>
|
||||
<InputNumber id="maxNumberOfChunks" v-model="formData.maxNumberOfChunks" required class="w-full" />
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="col-12 md:col-6 mb-4">
|
||||
<span class="p-float-label">
|
||||
<label for="minChunkSizeToEmbed">Min Chunk Size to Embed</label>
|
||||
<InputNumber id="minChunkSizeToEmbed" v-model="formData.minChunkSizeToEmbed" required class="w-full" />
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="col-12 mb-4">
|
||||
<label for="file" class="block text-lg mb-2">File</label>
|
||||
<div class="flex align-items-center">
|
||||
<FileUpload ref="fileUpload" mode="basic" :maxFileSize="10000000" chooseLabel="Select File"
|
||||
class="p-button-rounded" @select="onFileSelect" />
|
||||
</div>
|
||||
</div>
|
||||
<Button type="submit" label="Submit" :fluid="false" class="p-button-rounded p-button-lg" />
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</Fluid>
|
||||
<!--div class="card-container">
|
||||
<form @submit.prevent="submitForm" class="p-fluid">
|
||||
<div class="grid">
|
||||
<div class="col-12 mb-4">
|
||||
<label for="file" class="block text-lg mb-2">File</label>
|
||||
<div class="flex align-items-center">
|
||||
<FileUpload
|
||||
ref="fileUpload"
|
||||
mode="basic"
|
||||
:maxFileSize="10000000"
|
||||
chooseLabel="Select File"
|
||||
class="p-button-rounded"
|
||||
@select="onFileSelect"
|
||||
/>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12 md:col-6 mb-4">
|
||||
<span class="p-float-label">
|
||||
<label for="description">Description</label>
|
||||
<InputText id="description" v-model="formData.description" required class="w-full" />
|
||||
</span>
|
||||
</div>
|
||||
<div class="col-12 md:col-6 mb-4">
|
||||
<span class="p-float-label">
|
||||
<label for="type">Type</label>
|
||||
<InputText id="type" v-model="formData.type" required class="w-full" />
|
||||
</span>
|
||||
</div>
|
||||
<div class="col-12 md:col-6 mb-4">
|
||||
<span class="p-float-label">
|
||||
<label for="ksApplicationName">KS Application Name</label>
|
||||
<InputText id="ksApplicationName" v-model="formData.ksApplicationName" required class="w-full" />
|
||||
</span>
|
||||
</div>
|
||||
<div class="col-12 md:col-6 mb-4">
|
||||
<span class="p-float-label">
|
||||
<label for="ksDocType">KS Doc Type</label>
|
||||
<InputText id="ksDocType" v-model="formData.ksDocType" required class="w-full" />
|
||||
</span>
|
||||
</div>
|
||||
<div class="col-12 md:col-6 mb-4">
|
||||
<span class="p-float-label">
|
||||
<label for="ksDocSource">KS Doc Source</label>
|
||||
<InputText id="ksDocSource" v-model="formData.ksDocSource" required class="w-full" />
|
||||
</span>
|
||||
</div>
|
||||
<div class="col-12 md:col-6 mb-4">
|
||||
<span class="p-float-label">
|
||||
<label for="defaultChunkSize">Default Chunk Size</label>
|
||||
<InputNumber id="defaultChunkSize" v-model="formData.defaultChunkSize" required class="w-full" />
|
||||
</span>
|
||||
</div>
|
||||
<div class="col-12 md:col-6 mb-4">
|
||||
<span class="p-float-label">
|
||||
<label for="minChunkSize">Min Chunk Size</label>
|
||||
<InputNumber id="minChunkSize" v-model="formData.minChunkSize" required class="w-full" />
|
||||
</span>
|
||||
</div>
|
||||
<div class="col-12 md:col-6 mb-4">
|
||||
<span class="p-float-label">
|
||||
<label for="maxNumberOfChunks">Max Number of Chunks</label>
|
||||
<InputNumber id="maxNumberOfChunks" v-model="formData.maxNumberOfChunks" required class="w-full" />
|
||||
</span>
|
||||
</div>
|
||||
<div class="col-12 md:col-6 mb-4">
|
||||
<span class="p-float-label">
|
||||
<label for="minChunkSizeToEmbed">Min Chunk Size to Embed</label>
|
||||
<InputNumber id="minChunkSizeToEmbed" v-model="formData.minChunkSizeToEmbed" required class="w-full" />
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<Button type="submit" label="Submit" class="p-button-rounded p-button-lg" />
|
||||
</form>
|
||||
</div-->
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import axios from 'axios';
|
||||
import { useToast } from 'primevue/usetoast';
|
||||
import { ref } from 'vue';
|
||||
import { useRouter } from 'vue-router';
|
||||
|
||||
const toast = useToast();
|
||||
const router = useRouter();
|
||||
|
||||
const formData = ref({
|
||||
description: 'Test-UI-DevopsJ2CSystem',
|
||||
ingestionStatus: 'NEW',
|
||||
type: 'MD_DOCUMENT',
|
||||
ksApplicationName: 'jenkins',
|
||||
ksDocType: 'setup-documentation',
|
||||
ksDocSource: 'guide-for-techincal-setup',
|
||||
defaultChunkSize: 1000,
|
||||
minChunkSize: 200,
|
||||
maxNumberOfChunks: 1000,
|
||||
minChunkSizeToEmbed: 20
|
||||
});
|
||||
|
||||
const fileUpload = ref(null);
|
||||
const selectedFile = ref(null);
|
||||
|
||||
const onFileSelect = (event) => {
|
||||
selectedFile.value = event.files[0];
|
||||
};
|
||||
|
||||
const submitForm = async () => {
|
||||
const formDataToSend = new FormData();
|
||||
|
||||
if (selectedFile.value) {
|
||||
formDataToSend.append('file', selectedFile.value);
|
||||
}
|
||||
|
||||
// Append each field separately to ensure they are correctly processed by the server
|
||||
formDataToSend.append('description', formData.value.description);
|
||||
formDataToSend.append('type', formData.value.type);
|
||||
formDataToSend.append('ksApplicationName', formData.value.ksApplicationName);
|
||||
formDataToSend.append('ksDocType', formData.value.ksDocType);
|
||||
formDataToSend.append('ksDocSource', formData.value.ksDocSource);
|
||||
formDataToSend.append('defaultChunkSize', formData.value.defaultChunkSize);
|
||||
formDataToSend.append('minChunkSize', formData.value.minChunkSize);
|
||||
formDataToSend.append('maxNumberOfChunks', formData.value.maxNumberOfChunks);
|
||||
formDataToSend.append('minChunkSizeToEmbed', formData.value.minChunkSizeToEmbed);
|
||||
|
||||
try {
|
||||
const response = await axios.post('http://localhost:8082/upload', formDataToSend, {
|
||||
headers: {
|
||||
'Content-Type': 'multipart/form-data'
|
||||
}
|
||||
});
|
||||
console.log('Upload successful:', response.data);
|
||||
toast.add({ severity: 'success', summary: 'Success', detail: 'File uploaded successfully', life: 3000 });
|
||||
|
||||
// Redirect to desktop.vue
|
||||
router.push({ name: 'ks-document' });
|
||||
} catch (error) {
|
||||
console.error('Upload failed:', error);
|
||||
toast.add({ severity: 'error', summary: 'Error', detail: 'File upload failed', life: 3000 });
|
||||
}
|
||||
};
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.card-container {
|
||||
max-width: 800px;
|
||||
margin: 2rem auto;
|
||||
padding: 0 1rem;
|
||||
}
|
||||
|
||||
:deep(.p-card) {
|
||||
background: linear-gradient(145deg, #f3f4f6, #ffffff);
|
||||
border-radius: 15px;
|
||||
box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
:deep(.p-button) {
|
||||
background: linear-gradient(45deg, #4CAF50, #45a049);
|
||||
border: none;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
:deep(.p-button:hover) {
|
||||
background: linear-gradient(45deg, #45a049, #4CAF50);
|
||||
transform: translateY(-2px);
|
||||
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
|
||||
:deep(.p-inputtext:focus) {
|
||||
box-shadow: 0 0 0 2px rgba(76, 175, 80, 0.2);
|
||||
}
|
||||
|
||||
:deep(.p-dropdown:focus) {
|
||||
box-shadow: 0 0 0 2px rgba(76, 175, 80, 0.2);
|
||||
}
|
||||
|
||||
:deep(.p-inputnumber-input:focus) {
|
||||
box-shadow: 0 0 0 2px rgba(76, 175, 80, 0.2);
|
||||
}
|
||||
</style>
|
||||
119
src/views/pages/KsSimilaritySearch.vue
Normal file
119
src/views/pages/KsSimilaritySearch.vue
Normal file
@@ -0,0 +1,119 @@
|
||||
<template>
|
||||
<Fluid>
|
||||
<div class="flex mt-6">
|
||||
<div class="card flex flex-col gap-4 w-full">
|
||||
<div>
|
||||
<h2 class="text-3xl font-bold mb-4">Similarity Search</h2>
|
||||
</div>
|
||||
<div class="flex flex-wrap">
|
||||
<!--label for="address">Address</label-->
|
||||
<Textarea id="query" v-model="query" rows="4" placeholder="Enter your query..." class="w-full" />
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col md:flex-row gap-4">
|
||||
<div class="flex flex-wrap gap-2 w-full">
|
||||
<Select id="type" v-model="dropdownItem" :options="dropdownItems" optionLabel="name"
|
||||
placeholder="Select type" class="w-full"></Select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="p-field p-col-12 p-md-2">
|
||||
<Button label="Send" icon="pi pi-send" :fluid="false" @click="sendQuery" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex mt-6">
|
||||
<div class="results-container p-mt-4">
|
||||
<Card v-for="(result, index) in messages" :key="index" class="p-mb-3">
|
||||
<template #content>
|
||||
<ScrollPanel style="width: 100%; max-height: 200px">
|
||||
<pre class="result-content">{{ result }}</pre>
|
||||
</ScrollPanel>
|
||||
</template>
|
||||
</Card>
|
||||
</div>
|
||||
</div>
|
||||
</Fluid>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import Button from 'primevue/button';
|
||||
import Card from 'primevue/card';
|
||||
import ScrollPanel from 'primevue/scrollpanel';
|
||||
import { useToast } from 'primevue/usetoast';
|
||||
import { ref } from 'vue';
|
||||
|
||||
const query = ref('');
|
||||
const dropdownItem = ref(null);
|
||||
const messages = ref([]);
|
||||
const toast = useToast();
|
||||
|
||||
const dropdownItems = [
|
||||
{ name: 'Documentation', code: 'setup-documentation' },
|
||||
{ name: 'Deploy Documentation', code: 'deploy-documentation' }
|
||||
];
|
||||
|
||||
|
||||
const sendQuery = async () => {
|
||||
if (query.value.trim() !== '' && dropdownItem.value) {
|
||||
try {
|
||||
const response = await fetch(`http://localhost:8082/test/query_vector?query="${query.value}"&type=${dropdownItem.value.code}`);
|
||||
const data = await response.json();
|
||||
console.log('API response:', data);
|
||||
|
||||
if (data && Array.isArray(data) && data.length > 0) {
|
||||
messages.value = data;
|
||||
toast.add({ severity: 'success', summary: 'Success', detail: 'Query sent successfully', life: 3000 });
|
||||
} else {
|
||||
toast.add({ severity: 'info', summary: 'Info', detail: 'No results found', life: 3000 });
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Error sending query:', error);
|
||||
toast.add({ severity: 'error', summary: 'Error', detail: 'Failed to send query', life: 3000 });
|
||||
}
|
||||
query.value = '';
|
||||
dropdownItem.value = null;
|
||||
} else {
|
||||
toast.add({ severity: 'warn', summary: 'Warning', detail: 'Please enter a query and select a type', life: 3000 });
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.similarity-search {
|
||||
max-width: 1200px;
|
||||
margin: 0 auto;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.results-container {
|
||||
max-height: 600px;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.result-content {
|
||||
white-space: pre-wrap;
|
||||
word-wrap: break-word;
|
||||
font-family: monospace;
|
||||
font-size: 0.9em;
|
||||
padding: 1rem;
|
||||
background-color: #f8f9fa;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.p-select {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.p-select .p-select-label {
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.p-inputtextarea {
|
||||
resize: vertical;
|
||||
min-height: 100px;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user