code alignment

This commit is contained in:
sumedh
2024-09-13 15:08:57 +05:30
parent 93dfb81ef6
commit 9c047d6e2e
16 changed files with 447 additions and 439 deletions

View File

@@ -1,13 +1,13 @@
<template>
<div class="card">
<Toast/>
<ConfirmPopup></ConfirmPopup>
<Toast />
<ConfirmPopup></ConfirmPopup>
<div v-if="loading" class="loading-container">
<div class="spinner-container">
<ProgressSpinner class="spinner" />
<p class="loading-text">Loading data...</p>
</div>
</div>
<div class="spinner-container">
<ProgressSpinner class="spinner" />
<p class="loading-text">Loading data...</p>
</div>
</div>
<DataTable v-model:filters="filters" :value="ksdocuments" paginator showGridlines :rows="10" dataKey="id"
filterDisplay="menu" :loading="loading"
@@ -31,14 +31,15 @@
</div>
</template>
<template #empty>No Records found</template>
<Column field="ingestionInfo.metadata.KsApplicationName" header="ApplicationName" sortable
style="min-width: 12rem">
<template #body="{ data }">
{{ data.ingestionInfo.metadata.KsApplicationName }}
</template>
<template #filter="{ filterModel, filterCallback }">
<InputText v-model="filterModel.value" type="text" @input="filterCallback()" placeholder="Search by File" />
<InputText v-model="filterModel.value" type="text" @input="filterCallback()"
placeholder="Search by File" />
</template>
</Column>
<Column field="ingestionInfo.metadata.KsFileSource" header="FileSource" sortable>
@@ -55,7 +56,8 @@
{{ data.ingestionInfo.metadata.KsDocSource }}
</template>
<template #filter="{ filterModel, filterCallback }">
<InputText v-model="filterModel.value" type="text" @input="filterCallback()" placeholder="Search by File" />
<InputText v-model="filterModel.value" type="text" @input="filterCallback()"
placeholder="Search by File" />
</template>
</Column>
<Column field="ingestionStatus" header="Status" sortable>
@@ -63,8 +65,8 @@
<Tag :value="slotProps.data.ingestionStatus" :severity="getStatus(slotProps.data)" />
</template>
<template #filter="{ filterModel, filterCallback }">
<Select v-model="filterModel.value" @change="filterCallback()" :options="statuses" placeholder="Select One"
style="min-width: 12rem" :showClear="true">
<Select v-model="filterModel.value" @change="filterCallback()" :options="statuses"
placeholder="Select One" style="min-width: 12rem" :showClear="true">
<template #option="{ option }">
<Tag :value="option" :severity="getStatus({ ingestionStatus: option })" />
</template>
@@ -82,14 +84,17 @@
</Column>
<Column headerStyle="width: 5rem; text-align: center" bodyStyle="text-align: center; overflow: visible">
<template #body="slotProps">
<div class="flex justify-center items-center space-x-3" >
<div class="flex justify-center items-center space-x-3">
<!--Button type="button" icon="pi pi-pencil" rounded @click="editKsDocument(slotProps.data)"
v-tooltip="'Edit the information of document'" /-->
<Button type="button" icon="pi pi-play" rounded @click="startIndividualngestion(slotProps.data.id)"
v-tooltip="'Start Ingestion of document'" :disabled="slotProps.data.ingestionStatus === 'INGESTED'"
<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' }" />
<Button type="button" icon="pi pi-trash" rounded @click="confirmDelete(slotProps.data.id)"
v-tooltip="'Delete the ingested Record'" :disabled="slotProps.data.ingestionStatus === 'NEW'"
v-tooltip="'Delete the ingested Record'"
:disabled="slotProps.data.ingestionStatus === 'NEW'"
:class="{ 'p-button-danger': slotProps.data.ingestionStatus === 'NEW' }" />
</div>
</template>
@@ -105,22 +110,21 @@
<script setup>
import { FilterMatchMode, FilterOperator } from '@primevue/core/api';
import axios from 'axios';
import moment from 'moment';
import { useConfirm } from "primevue/useconfirm";
import { useToast } from 'primevue/usetoast';
import { computed, onMounted, ref } from 'vue';
import { useRouter } from 'vue-router';
import { useToast } from 'primevue/usetoast';
import { useConfirm } from "primevue/useconfirm";
import moment from 'moment';
import Button from 'primevue/button';
import Column from 'primevue/column';
import DataTable from 'primevue/datatable';
import DatePicker from 'primevue/datepicker'
import DatePicker from 'primevue/datepicker';
import Dialog from 'primevue/dialog';
import InputText from 'primevue/inputtext';
import ProgressSpinner from 'primevue/progressspinner';
import Select from 'primevue/select';
import Tag from 'primevue/tag';
import Tooltip from 'primevue/tooltip';
import ProgressSpinner from 'primevue/progressspinner';
const router = useRouter()
@@ -190,25 +194,25 @@ const editKsDocument = (data) => {
router.push({ name: 'ks-document-edit', params: { id: data.id } });
}
const confirmDelete = (id) =>{
console.log("id",id);
const confirmDelete = (id) => {
console.log("id", id);
confirm.require({
target: event.currentTarget,
message: 'Are you sure you want to proceed?',
icon: 'pi pi-exclamation-triangle',
rejectProps: {
label: 'Cancel',
severity: 'secondary',
outlined: true
},
acceptProps: {
label: 'Delete',
severity: 'danger',
},
accept: () => {
confirm.require({
target: event.currentTarget,
message: 'Are you sure you want to proceed?',
icon: 'pi pi-exclamation-triangle',
rejectProps: {
label: 'Cancel',
severity: 'secondary',
outlined: true
},
acceptProps: {
label: 'Delete',
severity: 'danger',
},
accept: () => {
const documentToDelete = ksdocuments.value.find(doc => doc.id === id);
console.log("documentToDelete",documentToDelete)
console.log("documentToDelete", documentToDelete)
if (!documentToDelete) {
console.error('Document not found');
return;
@@ -222,24 +226,24 @@ const confirmDelete = (id) =>{
ksFileSource: documentToDelete.ingestionInfo.metadata.KsFileSource,
ksApplicationName: documentToDelete.ingestionInfo.metadata.KsApplicationName,
};
console.log("requestPayload",requestPayload)
console.log("requestPayload", requestPayload)
axios.post('/fe-api/vector-store/deleteRecords', requestPayload)
.then(response => {
console.log('Delete resource:', response.data)
ksdocuments.value = ksdocuments.value.filter(doc => doc.id !== id);
console.log('ksdocuments.value',ksdocuments.value)
toast.add({ severity: 'info', summary: 'Confirmed', detail: 'deletion is in PROGRESS', life: 3000 });
})
.catch(error => {
console.error('Error deleting records: ', error)
toast.add({ severity: 'error', summary: 'Error', detail: 'Error in Deletion', life: 3000 });
});
},
reject: () => {
toast.add({severity: 'error', summary: 'Rejected', detail: 'You have rejected', life: 3000})
}
})
.then(response => {
console.log('Delete resource:', response.data)
ksdocuments.value = ksdocuments.value.filter(doc => doc.id !== id);
console.log('ksdocuments.value', ksdocuments.value)
toast.add({ severity: 'info', summary: 'Confirmed', detail: 'deletion is in PROGRESS', life: 3000 });
})
.catch(error => {
console.error('Error deleting records: ', error)
toast.add({ severity: 'error', summary: 'Error', detail: 'Error in Deletion', life: 3000 });
});
},
reject: () => {
toast.add({ severity: 'error', summary: 'Rejected', detail: 'You have rejected', life: 3000 })
}
})
};
//ingestion
@@ -301,7 +305,6 @@ function formatDate(dateString) {
</script>
<style scoped>
/* Custom styling for disabled red button */
.p-button-danger {
background-color: white;
@@ -316,75 +319,84 @@ function formatDate(dateString) {
cursor: not-allowed;
}
.space-x-3 > * + * {
margin-left: 1rem; /* Adjust as needed for desired spacing */
.space-x-3>*+* {
margin-left: 1rem;
/* Adjust as needed for desired spacing */
}
.loading-container {
display: flex;
align-items: center;
justify-content: center;
position: fixed; /* Change to fixed */
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 9999; /* Ensure its on top of everything */
background-color: rgba(255, 255, 255, 0.8); /* Optional: Add a background to obscure content */
display: flex;
align-items: center;
justify-content: center;
position: fixed;
/* Change to fixed */
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 9999;
/* Ensure its on top of everything */
background-color: rgba(255, 255, 255, 0.8);
/* Optional: Add a background to obscure content */
}
.spinner-container {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
animation: fade-in 1s ease-in-out;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
animation: fade-in 1s ease-in-out;
}
.spinner {
animation: spin 1s linear infinite;
width: 50px;
height: 50px;
color: var(--primary-color, #007bff);
animation: spin 1s linear infinite;
width: 50px;
height: 50px;
color: var(--primary-color, #007bff);
}
.loading-text {
font-size: 1.2rem;
animation: pulse 1.5s infinite;
margin-top: 10px;
color: var(--primary-color, #007bff);
font-size: 1.2rem;
animation: pulse 1.5s infinite;
margin-top: 10px;
color: var(--primary-color, #007bff);
}
@keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
@keyframes pulse {
0%,
100% {
opacity: 1;
color: var(--primary-color, #007bff);
}
50% {
opacity: 0.11;
color: var(--primary-color, #007bff);
}
0%,
100% {
opacity: 1;
color: var(--primary-color, #007bff);
}
50% {
opacity: 0.11;
color: var(--primary-color, #007bff);
}
}
@keyframes fade-in {
from {
opacity: 0;
}
to {
opacity: 1;
}
from {
opacity: 0;
}
to {
opacity: 1;
}
}
.card {
margin: 2rem;
margin: 2rem;
}
</style>

View File

@@ -9,19 +9,23 @@
<div class="flex flex-col gap-4">
<div class="flex flex-col gap-2">
<label for="repoName">Repo Name</label>
<InputText id="repoName" v-model="formData.repoName" placeholder="Enter Repo Name" required class="w-full" />
<InputText id="repoName" v-model="formData.repoName" placeholder="Enter Repo Name" required
class="w-full" />
</div>
<div class="flex flex-col gap-2">
<label for="group">Group Name</label>
<InputText id="group" v-model="formData.group" placeholder="Enter Group Name" required class="w-full" />
<InputText id="group" v-model="formData.group" placeholder="Enter Group Name" required
class="w-full" />
</div>
<div class="flex flex-col gap-2">
<label for="source">Source Name</label>
<InputText id="source" v-model="formData.source" placeholder="Enter Source base URL" required class="w-full" />
<InputText id="source" v-model="formData.source" placeholder="Enter Source base URL"
required class="w-full" />
</div>
<div class="flex flex-col gap-2">
<label for="branch">Branch</label>
<InputText id="branch" v-model="formData.branch" placeholder="Enter Branch" required class="w-full" />
<InputText id="branch" v-model="formData.branch" placeholder="Enter Branch" required
class="w-full" />
</div>
<div class="flex flex-col gap-2">
<label for="commitId">CommitID</label>
@@ -29,7 +33,8 @@
</div>
<div class="flex flex-col gap-2">
<label for="tokenType">Git Token Type</label>
<InputText id="tokenType" type="text" v-model="formData.tokenType" required class="w-full" />
<InputText id="tokenType" type="text" v-model="formData.tokenType" required
class="w-full" />
</div>
<!--div class="col-12 mb-4">
<span class="p-float-label">
@@ -39,7 +44,8 @@
</div-->
<div class="flex flex-col gap-2">
<label for="defaultChunkSize">Default Chunk Size</label>
<InputNumber id="defaultChunkSize" v-model="formData.defaultChunkSize" required class="w-full" />
<InputNumber id="defaultChunkSize" v-model="formData.defaultChunkSize" required
class="w-full" />
</div>
<div class="flex flex-col gap-2">
<label for="minChunkSize">Min Chunk Size</label>
@@ -47,14 +53,17 @@
</div>
<div class="flex flex-col gap-2">
<label for="maxNumberOfChunks">Max Number of Chunks</label>
<InputNumber id="maxNumberOfChunks" v-model="formData.maxNumberOfChunks" required class="w-full" />
<InputNumber id="maxNumberOfChunks" v-model="formData.maxNumberOfChunks" required
class="w-full" />
</div>
<div class="flex flex-col gap-2">
<label for="minChunkSizeToEmbed">Min Chunk Size to Embed</label>
<InputNumber id="minChunkSizeToEmbed" v-model="formData.minChunkSizeToEmbed" required class="w-full" />
<InputNumber id="minChunkSizeToEmbed" v-model="formData.minChunkSizeToEmbed" required
class="w-full" />
</div>
</div>
<Button type="submit" label="Submit" :disabled="isSubmitting" :fluid="false" class="p-button-rounded p-button-lg mt-4" />
<Button type="submit" label="Submit" :disabled="isSubmitting" :fluid="false"
class="p-button-rounded p-button-lg mt-4" />
</form>
</div>
</div>
@@ -63,12 +72,12 @@
<script setup>
import axios from 'axios';
import Button from 'primevue/button';
import InputNumber from 'primevue/inputnumber';
import InputText from 'primevue/inputtext';
import { useToast } from 'primevue/usetoast';
import { ref } from 'vue';
import { useRouter } from 'vue-router';
import { useToast } from 'primevue/usetoast';
import InputText from 'primevue/inputtext';
import InputNumber from 'primevue/inputnumber';
import Button from 'primevue/button';
const toast = useToast();
const router = useRouter();
@@ -77,10 +86,10 @@ const isSubmitting = ref(false);
const formData = ref({
repoName: 'shellExecutionThroughAPI',
group: 'automationtester23',
source:'https://github.com',
source: 'https://github.com',
branch: 'master',
commitId: 'latest',
tokenType:'github',
tokenType: 'github',
repoPath: 'C:\\repos\\olympus_ai\\gitClone',
defaultChunkSize: 1988,
minChunkSize: 200,
@@ -114,10 +123,10 @@ const submitForm = async () => {
try {
const response = await axios.post('/fe-api/ks_git_repos/clone', json, {
headers: {
'Content-Type': 'application/json'
}
});
headers: {
'Content-Type': 'application/json'
}
});
console.log('Submit successful:', response.data);
toast.add({ severity: 'success', summary: 'Success', detail: 'Repository submitted successfully', life: 3000 });
@@ -129,9 +138,9 @@ const submitForm = async () => {
}
};
function formDatatoJson(formData){
const jsonObject ={};
formData.forEach((value,key) => {
function formDatatoJson(formData) {
const jsonObject = {};
formData.forEach((value, key) => {
jsonObject[key] = value;
})
return jsonObject;

View File

@@ -1,66 +1,69 @@
<template>
<form @submit.prevent="submitForm" class="p-fluid">
<div class="flex flex-col gap-4">
<div class="flex flex-col gap-2">
<label for="repoName">Repo Name</label>
<InputText id="repoName" v-model="formData.repoName" placeholder="Enter Repo Name" required class="w-full" />
</div>
<div class="flex flex-col gap-2">
<label for="group">Group Name</label>
<InputText id="group" v-model="formData.group" placeholder="Enter Group Name" required class="w-full" />
</div>
<div class="flex flex-col gap-2">
<label for="source">Source Name</label>
<InputText id="source" v-model="formData.source" placeholder="Enter Source base URL" required class="w-full" />
</div>
<div class="flex flex-col gap-2">
<label for="branch">Branch</label>
<InputText id="branch" v-model="formData.branch" placeholder="Enter Branch" required class="w-full" />
</div>
<div class="flex flex-col gap-2">
<label for="commitId">CommitID</label>
<InputText id="commitId" type="text" v-model="formData.commitId" required class="w-full" />
</div>
<div class="flex flex-col gap-2">
<label for="tokenType">Git Token Type</label>
<InputText id="tokenType" type="text" v-model="formData.tokenType" required class="w-full" />
</div>
<!--div class="col-12 mb-4">
<div class="flex flex-col gap-4">
<div class="flex flex-col gap-2">
<label for="repoName">Repo Name</label>
<InputText id="repoName" v-model="formData.repoName" placeholder="Enter Repo Name" required
class="w-full" />
</div>
<div class="flex flex-col gap-2">
<label for="group">Group Name</label>
<InputText id="group" v-model="formData.group" placeholder="Enter Group Name" required class="w-full" />
</div>
<div class="flex flex-col gap-2">
<label for="source">Source Name</label>
<InputText id="source" v-model="formData.source" placeholder="Enter Source base URL" required
class="w-full" />
</div>
<div class="flex flex-col gap-2">
<label for="branch">Branch</label>
<InputText id="branch" v-model="formData.branch" placeholder="Enter Branch" required class="w-full" />
</div>
<div class="flex flex-col gap-2">
<label for="commitId">CommitID</label>
<InputText id="commitId" type="text" v-model="formData.commitId" required class="w-full" />
</div>
<div class="flex flex-col gap-2">
<label for="tokenType">Git Token Type</label>
<InputText id="tokenType" type="text" v-model="formData.tokenType" required class="w-full" />
</div>
<!--div class="col-12 mb-4">
<span class="p-float-label">
<label for="repoPath">Repo Path</label>
<InputText id="repoPath" v-model="formData.repoPath" required class="w-full" />
</span>
</div-->
<div class="flex flex-col gap-2">
<label for="defaultChunkSize">Default Chunk Size</label>
<InputNumber id="defaultChunkSize" v-model="formData.defaultChunkSize" required class="w-full" />
</div>
<div class="flex flex-col gap-2">
<label for="minChunkSize">Min Chunk Size</label>
<InputNumber id="minChunkSize" v-model="formData.minChunkSize" required class="w-full" />
</div>
<div class="flex flex-col gap-2">
<label for="maxNumberOfChunks">Max Number of Chunks</label>
<InputNumber id="maxNumberOfChunks" v-model="formData.maxNumberOfChunks" required class="w-full" />
</div>
<div class="flex flex-col gap-2">
<label for="minChunkSizeToEmbed">Min Chunk Size to Embed</label>
<InputNumber id="minChunkSizeToEmbed" v-model="formData.minChunkSizeToEmbed" required class="w-full" />
</div>
</div>
<Button type="submit" label="Submit" text rounded raised :disabled="isSubmitting" :fluid="false" class="p-button-rounded p-button-lg mt-4" />
</form>
<div class="flex flex-col gap-2">
<label for="defaultChunkSize">Default Chunk Size</label>
<InputNumber id="defaultChunkSize" v-model="formData.defaultChunkSize" required class="w-full" />
</div>
<div class="flex flex-col gap-2">
<label for="minChunkSize">Min Chunk Size</label>
<InputNumber id="minChunkSize" v-model="formData.minChunkSize" required class="w-full" />
</div>
<div class="flex flex-col gap-2">
<label for="maxNumberOfChunks">Max Number of Chunks</label>
<InputNumber id="maxNumberOfChunks" v-model="formData.maxNumberOfChunks" required class="w-full" />
</div>
<div class="flex flex-col gap-2">
<label for="minChunkSizeToEmbed">Min Chunk Size to Embed</label>
<InputNumber id="minChunkSizeToEmbed" v-model="formData.minChunkSizeToEmbed" required class="w-full" />
</div>
</div>
<Button type="submit" label="Submit" text rounded raised :disabled="isSubmitting" :fluid="false"
class="p-button-rounded p-button-lg mt-4" />
</form>
</template>
<script setup>
import { ref, defineProps, defineEmits } from 'vue';
import { defineEmits, ref } from 'vue';
const formData = ref({
repoName: 'shellExecutionThroughAPI',
group: 'automationtester23',
source:'https://github.com',
source: 'https://github.com',
branch: 'master',
commitId: 'latest',
tokenType:'github',
tokenType: 'github',
repoPath: 'C:\\repos\\olympus_ai\\gitClone',
defaultChunkSize: 1988,
minChunkSize: 200,
@@ -93,12 +96,12 @@ const submitForm = () => {
const json = formDatatoJson(formDataToSend);
console.log(json)
emit('submitForm',json)
emit('submitForm', json)
};
function formDatatoJson(formData){
const jsonObject ={};
formData.forEach((value,key) => {
function formDatatoJson(formData) {
const jsonObject = {};
formData.forEach((value, key) => {
jsonObject[key] = value;
})
return jsonObject;

View File

@@ -1,6 +1,6 @@
<template>
<div class="card">
<Toast/>
<Toast />
<ConfirmPopup></ConfirmPopup>
<div v-if="loading" class="loading-container">
<div class="spinner-container">
@@ -9,48 +9,39 @@
</div>
</div>
<Toolbar class="mb-6">
<template #start>
<Button label="Refresh" icon="pi pi-refresh" severity="secondary" class="mr-2" rounded @click="fetchCodeRepoInfo" />
</template>
<template #start>
<Button label="Refresh" icon="pi pi-refresh" severity="secondary" class="mr-2" rounded
@click="fetchCodeRepoInfo" />
</template>
<template #end>
<Button label="Expand All" icon="pi pi-plus" severity="secondary" class="mr-3" rounded @click="expandAll" />
<Button label="Collapse All" icon="pi pi-minus" severity="secondary" class="mr-3" rounded @click="collapseAll"/>
<!--Button label="Add New Git Repo" icon="pi pi-plus" severity="secondary" rounded class="mr-3" @click="newCodeRepoForm()" v-tooltip="'Add New Git Repo'" class="mr-2" /-->
<!--Button label="Add Git Repo" icon="pi pi-bolt" severity="secondary" rounded @click="cloneRepoForm()" v-tooltip="'Add New Git Repo'" /-->
<Button label="Add Git Repo" icon="pi pi-bolt" severity="secondary" rounded @click="showDialog = true" v-tooltip="'Add New Git Repo using Dialog'"/>
<template #end>
<Button label="Expand All" icon="pi pi-plus" severity="secondary" class="mr-3" rounded
@click="expandAll" />
<Button label="Collapse All" icon="pi pi-minus" severity="secondary" class="mr-3" rounded
@click="collapseAll" />
<!--Button label="Add New Git Repo" icon="pi pi-plus" severity="secondary" rounded class="mr-3" @click="newCodeRepoForm()" v-tooltip="'Add New Git Repo'" class="mr-2" /-->
<!--Button label="Add Git Repo" icon="pi pi-bolt" severity="secondary" rounded @click="cloneRepoForm()" v-tooltip="'Add New Git Repo'" /-->
<Button label="Add Git Repo" icon="pi pi-bolt" severity="secondary" rounded @click="showDialog = true"
v-tooltip="'Add New Git Repo using Dialog'" />
<Dialog v-model:visible="showDialog" :style="{ width: '600px' }" header="Repository Details" :modal="true">
<div>
<cloneForm @submitForm="cloneRepo"/>
</div>
</Dialog>
</template>
<Dialog v-model:visible="showDialog" :style="{ width: '600px' }" header="Repository Details"
:modal="true">
<div>
<cloneForm @submitForm="cloneRepo" />
</div>
</Dialog>
</template>
</Toolbar>
<DataTable
v-model:filters="filters"
v-model:expandedRows="expandedRows"
@rowExpand="onRowExpand"
@rowCollapse="onRowCollapse"
:value="codeRepoInfo"
:paginator="true"
:rows="10"
<DataTable v-model:filters="filters" v-model:expandedRows="expandedRows" @rowExpand="onRowExpand"
@rowCollapse="onRowCollapse" :value="codeRepoInfo" :paginator="true" :rows="10"
paginatorTemplate="FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink CurrentPageReport RowsPerPageDropdown"
currentPageReportTemplate="Showing {first} to {last} of {totalRecords} records"
:rowsPerPageOptions="[ 10,15, 20, 50, 100]"
dataKey="id"
:rowHover="true"
rowGroupMode="subheader"
groupRowsBy="repoName"
filterDisplay="menu"
:loading="loading"
:rowsPerPageOptions="[10, 15, 20, 50, 100]" dataKey="id" :rowHover="true" rowGroupMode="subheader"
groupRowsBy="repoName" filterDisplay="menu" :loading="loading"
:globalFilterFields="['repoName', 'branch', 'ingestionStatus', 'ingestionDateFormat']"
tableStyle="min-width: 70rem"
removableSort
>
<template #header>
tableStyle="min-width: 70rem" removableSort>
<template #header>
<div class="flex flex-wrap gap-2 items-center justify-between">
<h4 class="m-0">Manage Repositories</h4>
<IconField>
@@ -60,7 +51,7 @@
<InputText v-model="filters['global'].value" placeholder="Search..." />
</IconField>
</div>
</template>
</template>
<template #groupheader="slotProps">
<div class="flex items-center gap-2">
<img :alt="slotProps.data.repoName" :src="logoSrc" width="32" style="vertical-align: middle" />
@@ -72,12 +63,14 @@
<template #empty>No Records found</template>
<template #loading>Loading Data... </template>
<socketManager @update="handleCloneRepoWebSocketMessage" topic="topic" subtopic="clone-status"></socketManager>
<socketManager @update="handleCloneRepoWebSocketMessage" topic="topic" subtopic="deletion-status"></socketManager>
<socketManager @update="handleCloneRepoWebSocketMessage" topic="topic" subtopic="clone-status">
</socketManager>
<socketManager @update="handleCloneRepoWebSocketMessage" topic="topic" subtopic="deletion-status">
</socketManager>
<!--Column field="id" header="KSGitInfoID" sortable /-->
<Column/>
<Column/>
<Column />
<Column />
<!--Column field="ksGitIngestionInfo.id" header="ksGitIngestionInfo" sortable> </Column-->
@@ -86,7 +79,8 @@
{{ data.repoName }}
</template>
<template #filter="{ filterModel, filterCallback }">
<InputText v-model="filterModel.value" type="text" @input="filterCallback()" placeholder="Search by Git Repo Name" />
<InputText v-model="filterModel.value" type="text" @input="filterCallback()"
placeholder="Search by Git Repo Name" />
</template>
</Column>
@@ -95,7 +89,8 @@
{{ data.branch }}
</template>
<template #filter="{ filterModel, filterCallback }">
<InputText v-model="filterModel.value" type="text" @input="filterCallback()" placeholder="Search by Git Repo Branch" />
<InputText v-model="filterModel.value" type="text" @input="filterCallback()"
placeholder="Search by Git Repo Branch" />
</template>
</Column>
@@ -104,7 +99,8 @@
<Tag :value="slotProps.data.ingestionStatus" :severity="getStatus(slotProps.data)" />
</template>
<template #filter="{ filterModel, filterCallback }">
<Select v-model="filterModel.value" @change="filterCallback()" :options="statuses" placeholder="Select One" style="min-width: 12rem" :showClear="true">
<Select v-model="filterModel.value" @change="filterCallback()" :options="statuses"
placeholder="Select One" style="min-width: 12rem" :showClear="true">
<template #option="{ option }">
<Tag :value="option" :severity="getStatus({ ingestionStatus: option })" />
</template>
@@ -112,81 +108,61 @@
</template>
</Column>
<Column field="ingestionDate" header="Ingestion Date" sortable filterField="ingestionDateFormat" dataType="date" style="min-width: 10rem">
<Column field="ingestionDate" header="Ingestion Date" sortable filterField="ingestionDateFormat"
dataType="date" style="min-width: 10rem">
<template #body="{ data }">
{{ formatDate(data.ingestionDate) }}
</template>
<template #filter="{ filterModel }">
<DatePicker v-model="filterModel.value" dateFormat="mm/dd/yy" placeholder="mm/dd/yyyy" @change="updateFilterModel" />
<DatePicker v-model="filterModel.value" dateFormat="mm/dd/yy" placeholder="mm/dd/yyyy"
@change="updateFilterModel" />
</template>
</Column>
<!--Column header="Actions" headerStyle="width: 5rem; text-align: center" bodyStyle="text-align: center; overflow: visible"-->
<Column :exportable="false" style="min-width: 12rem">
<template #body="slotProps">
<Button
text raised rounded
severity="info"
type="button"
class="mr-2"
icon="pi pi-play"
@click="ingestGitRepo(slotProps.data)"
v-tooltip="'Start Ingestion of Repo'"
:disabled="isButtonDisabled(slotProps.data)"
/>
<Button
text raised rounded
severity="warn"
type="button"
class="mr-2"
icon="pi pi-forward"
@click="reIngestWithPullChanges(slotProps.data)"
v-tooltip="'Ingest Repo with latest changes from master branch'"
/>
<Button text raised rounded severity="info" type="button" class="mr-2" icon="pi pi-play"
@click="ingestGitRepo(slotProps.data)" v-tooltip="'Start Ingestion of Repo'"
:disabled="isButtonDisabled(slotProps.data)" />
<Button text raised rounded severity="warn" type="button" class="mr-2" icon="pi pi-forward"
@click="reIngestWithPullChanges(slotProps.data)"
v-tooltip="'Ingest Repo with latest changes from master branch'" />
<Button text raised rounded severity="danger" type="button" icon="pi pi-trash"
@click="deleteRecordsFromVectorStore(slotProps.data)" v-tooltip="'Delete the Records'" />
<Button
text raised rounded
severity="danger"
type="button"
icon="pi pi-trash"
@click="deleteRecordsFromVectorStore(slotProps.data)"
v-tooltip="'Delete the Records'"
/>
</template>
</Column>
<template #expansion="slotProps">
<div class="p-4">
<VueJsonView :src="slotProps.data"
:collapsed="collapsed"
:theme="theme"
:sort-keys="sortKeys"
:enable-clipboard="enableClipboard"
class="vue-json-view"
/>
<VueJsonView :src="slotProps.data" :collapsed="collapsed" :theme="theme" :sort-keys="sortKeys"
:enable-clipboard="enableClipboard" class="vue-json-view" />
</div>
</template>
<template #groupfooter="slotProps">
<div class="flex justify-end font-bold w-full">Total Count: {{ calculateCustomerTotal(slotProps.data.repoName) }}</div>
<div class="flex justify-end font-bold w-full">
Total Count: {{ calculateCustomerTotal(slotProps.data.repoName) }}
</div>
</template>
</DataTable>
</div>
</template>
<script setup>
import logo from '@/assets/gitlab-logo.svg';
import VueJsonView from '@matpool/vue-json-view';
import { FilterMatchMode, FilterOperator } from '@primevue/core/api';
import { computed, onMounted, onUnmounted, ref } from 'vue';
import { useRouter } from 'vue-router';
import { useToast } from 'primevue/usetoast';
import axios from 'axios';
import moment from 'moment';
import VueJsonView from '@matpool/vue-json-view'
import logo from '@/assets/gitlab-logo.svg';
import { useToast } from 'primevue/usetoast';
import { computed, onMounted, ref } from 'vue';
import { useRouter } from 'vue-router';
import Button from 'primevue/button';
import Column from 'primevue/column';
@@ -194,16 +170,15 @@ import DataTable from 'primevue/datatable';
import DatePicker from 'primevue/datepicker';
import Dialog from 'primevue/dialog';
import InputText from 'primevue/inputtext';
import ProgressSpinner from 'primevue/progressspinner';
import Select from 'primevue/select';
import Tag from 'primevue/tag';
import Tooltip from 'primevue/tooltip';
import ProgressSpinner from 'primevue/progressspinner';
import { useConfirm } from "primevue/useconfirm";
import socketManager from '/src/components/SocketManager.vue'
import socketManager from '/src/components/SocketManager.vue';
//dialog
import cloneForm from './KsGitCloneRepoFormDialog.vue'
import cloneForm from './KsGitCloneRepoFormDialog.vue';
const showDialog = ref(false);
const cloneRepo = (formData) => {
try {
@@ -212,7 +187,7 @@ const cloneRepo = (formData) => {
'Content-Type': 'application/json'
}
});
console.log('Submit successful:', response.data);
toast.add({ severity: 'success', summary: 'Success', detail: 'Repository Download is IN-PROGRESS', life: 3000 });
} catch (error) {
@@ -233,7 +208,7 @@ const ingestionResult = ref('');
const popupTitle = ref('');
const popupMessage = ref('');
const filters = ref();
const statuses = ref(['INGESTION-ERROR','INGESTION-IN-PROGRESS', 'INGESTED', 'REPO-NEW', 'REPO-CLONE-IN-PROGRESS','REPO-CLONE-COMPLETED','REPO-CLONE-FAILED']);
const statuses = ref(['INGESTION-ERROR', 'INGESTION-IN-PROGRESS', 'INGESTED', 'REPO-NEW', 'REPO-CLONE-IN-PROGRESS', 'REPO-CLONE-COMPLETED', 'REPO-CLONE-FAILED']);
const collapsed = ref(1)
const theme = ref('bright:inverted')
@@ -250,14 +225,14 @@ onMounted(() => {
//websocket
const handleCloneRepoWebSocketMessage = (data) => {
console.log('Update received in parent component:', data);
const { success, message } = data;
if (success) {
toast.add({ severity: 'success', summary: 'Success', detail: message , life: 10000 });
fetchCodeRepoInfo();
} else {
toast.add({ severity: 'error', summary: 'Error', detail: message, life: 10000 });
fetchCodeRepoInfo();
}
const { success, message } = data;
if (success) {
toast.add({ severity: 'success', summary: 'Success', detail: message, life: 10000 });
fetchCodeRepoInfo();
} else {
toast.add({ severity: 'error', summary: 'Error', detail: message, life: 10000 });
fetchCodeRepoInfo();
}
};
//websocket end
@@ -276,8 +251,8 @@ const initFilters = () => {
function calculateCustomerTotal(name) {
let total = 0;
if(codeRepoInfo.value){
for(let RepoInfo of codeRepoInfo.value){
if (codeRepoInfo.value) {
for (let RepoInfo of codeRepoInfo.value) {
if (RepoInfo.repoName === name) {
total++;
}
@@ -309,7 +284,7 @@ const getCustomDatewithAllResponse = (data) => {
//ingest git repo functions
const ingestGitRepo = (repo) => {
const ingestGitRepo = (repo) => {
confirm.require({
target: event.currentTarget,
message: 'Are you sure you want to proceed?',
@@ -325,17 +300,17 @@ const ingestGitRepo = (repo) => {
},
accept: () => {
axios.get(`/test/ingest_repo?repoName=${repo.repoName}&branchName=${repo.branch}`)
.then((response) => {
toast.add({ severity: 'success', summary: 'Ingestion Summary', detail: 'Repository Ingestion Started', life: 6000 });
console.log('Delete resource:', response.data)
})
.catch((error) => {
console.error('Error deleting records: ', error)
toast.add({ severity: 'error', summary: 'Error', detail: 'Error Ingesting records:', life: 6000 });
});
.then((response) => {
toast.add({ severity: 'success', summary: 'Ingestion Summary', detail: 'Repository Ingestion Started', life: 6000 });
console.log('Delete resource:', response.data)
})
.catch((error) => {
console.error('Error deleting records: ', error)
toast.add({ severity: 'error', summary: 'Error', detail: 'Error Ingesting records:', life: 6000 });
});
},
reject: () => {
toast.add({severity: 'error', summary: 'Rejected', detail: 'You have rejected', life: 3000})
toast.add({ severity: 'error', summary: 'Rejected', detail: 'You have rejected', life: 3000 })
}
})
};
@@ -355,7 +330,7 @@ const newCodeRepoForm = () => {
router.push({ name: 'ks-git-repo-new' });
};
const cloneRepoForm = () =>{
const cloneRepoForm = () => {
console.log("clone repo form");
router.push({ name: 'ks-git-clone-repo' });
}
@@ -376,20 +351,20 @@ const getStatus = (data) => {
};
//delete functionality
const deleteRecordsFromVectorStore = (data) =>{
console.log("data",data);
console.log("reponame",data.repoName);
const deleteRecordsFromVectorStore = (data) => {
console.log("data", data);
console.log("reponame", data.repoName);
const requestPayload = {
ksGitInfoId: data.id,
ksGitIngestionInfoId: data.ksGitIngestionInfo.id,
ksDoctype: data.ksGitIngestionInfo.metadata.KsDoctype,
ksDocSource: data.ksGitIngestionInfo.metadata.KsDocSource,
ksFileSource: data.ksGitIngestionInfo.metadata.KsFileSource,
ksApplicationName: data.ksGitIngestionInfo.metadata.KsApplicationName,
ksGitInfoId: data.id,
ksGitIngestionInfoId: data.ksGitIngestionInfo.id,
ksDoctype: data.ksGitIngestionInfo.metadata.KsDoctype,
ksDocSource: data.ksGitIngestionInfo.metadata.KsDocSource,
ksFileSource: data.ksGitIngestionInfo.metadata.KsFileSource,
ksApplicationName: data.ksGitIngestionInfo.metadata.KsApplicationName,
ksBranch: data.ksGitIngestionInfo.metadata.KsBranch
};
console.log("requestPayload",requestPayload)
};
console.log("requestPayload", requestPayload)
confirm.require({
target: event.currentTarget,
@@ -406,25 +381,25 @@ const deleteRecordsFromVectorStore = (data) =>{
},
accept: () => {
axios.post('/fe-api/vector-store/deleteGitRecords', requestPayload)
.then(response => {
toast.add({ severity: 'info', summary: 'Deletion', detail: 'Records Deletion INPROGRESS', life: 6000 });
console.log('Delete resource:', response.data)
})
.catch(error => {
console.error('Error deleting records: ', error)
toast.add({ severity: 'error', summary: 'Error', detail: 'Error deleting records:', life: 6000 });
});
.then(response => {
toast.add({ severity: 'info', summary: 'Deletion', detail: 'Records Deletion INPROGRESS', life: 6000 });
console.log('Delete resource:', response.data)
})
.catch(error => {
console.error('Error deleting records: ', error)
toast.add({ severity: 'error', summary: 'Error', detail: 'Error deleting records:', life: 6000 });
});
},
reject: () => {
toast.add({severity: 'error', summary: 'Rejected', detail: 'You have rejected', life: 3000})
toast.add({ severity: 'error', summary: 'Rejected', detail: 'You have rejected', life: 3000 })
}
})
};
//reingest latest changes
const reIngestWithPullChanges = (data) =>{
console.log("data",data);
console.log("reponame",data.repoName);
const reIngestWithPullChanges = (data) => {
console.log("data", data);
console.log("reponame", data.repoName);
confirm.require({
target: event.currentTarget,
@@ -440,17 +415,17 @@ const reIngestWithPullChanges = (data) =>{
severity: 'danger',
},
accept: () => {
axios.get(`/test/reingest_repo?repoName=${data.repoName}&branchName=${data.branch}`)
.then(response => {
console.log(response.data);
toast.add({ severity: 'info', summary: 'Confirmed', detail: 'ReIngestion with latest pull from master started', life: 3000 });
}).catch(error => {
console.log(error);
toast.add({ severity: 'error', summary: 'Error', detail: 'Error in Reingestion', life: 3000 });
})
axios.get(`/test/reingest_repo?repoName=${data.repoName}&branchName=${data.branch}`)
.then(response => {
console.log(response.data);
toast.add({ severity: 'info', summary: 'Confirmed', detail: 'ReIngestion with latest pull from master started', life: 3000 });
}).catch(error => {
console.log(error);
toast.add({ severity: 'error', summary: 'Error', detail: 'Error in Reingestion', life: 3000 });
})
},
reject: () => {
toast.add({severity: 'error', summary: 'Rejected', detail: 'You have rejected', life: 3000})
toast.add({ severity: 'error', summary: 'Rejected', detail: 'You have rejected', life: 3000 })
}
})
};
@@ -458,11 +433,11 @@ const reIngestWithPullChanges = (data) =>{
//expand
const onRowExpand = (event) => {
console.log('Row Expanded:', event.data);
toast.add({ severity: 'info', summary: event.data.repoName +' Expanded', life: 3000 });
toast.add({ severity: 'info', summary: event.data.repoName + ' Expanded', life: 3000 });
};
const onRowCollapse = (event) => {
console.log('Row Expanded:', event.data);
toast.add({ severity: 'success', summary: event.data.repoName +' Collapsed', life: 3000 });
toast.add({ severity: 'success', summary: event.data.repoName + ' Collapsed', life: 3000 });
};
const expandAll = () => {
@@ -483,31 +458,33 @@ function isButtonDisabled(data) {
</script>
<style scoped>
/* Custom styling for disabled red button */
.p-button-danger {
background-color: white;
border-color: blue;
color: black;
background-color: white;
border-color: blue;
color: black;
}
.p-button-danger:disabled {
/*background-color: red;*/
border-color: red;
color: red;
cursor: not-allowed;
/*background-color: red;*/
border-color: red;
color: red;
cursor: not-allowed;
}
.space-x-3 > * + * {
margin-left: 1rem; /* Adjust as needed for desired spacing */
.space-x-3>*+* {
margin-left: 1rem;
/* Adjust as needed for desired spacing */
}
.loading-container {
display: flex;
align-items: center;
justify-content: center;
height: 100%; /* Ensure the container takes full height of the parent */
min-height: 400px; /* Adjust this height to your DataTable height */
height: 100%;
/* Ensure the container takes full height of the parent */
min-height: 400px;
/* Adjust this height to your DataTable height */
}
.spinner-container {
@@ -536,17 +513,20 @@ function isButtonDisabled(data) {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
@keyframes pulse {
0%,
100% {
opacity: 1;
color: var(--primary-color, #007bff);
}
50% {
opacity: 0.11;
color: var(--primary-color, #007bff);
@@ -557,15 +537,18 @@ function isButtonDisabled(data) {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
.card {
margin: 2rem;
}
.vue-json-view {
font-size: 15px; /* Change this value to your desired font size */
}
.vue-json-view {
font-size: 15px;
/* Change this value to your desired font size */
}
</style>

View File

@@ -33,7 +33,8 @@
<div class="col-12 md:col-6 mb-4">
<span class="p-float-label">
<label for="ksDocType" v-tooltip="'Specify the type of document e.g, md, pdf,'">KS Document Type</label>
<Select id="ksDocType" v-model="formData.ksDocType" :options="dropdownItems" required optionLabel="name" optionValue="value" placeholder="Select One" class="w-full"></Select>
<Select id="ksDocType" v-model="formData.ksDocType" :options="dropdownItems" required optionLabel="name"
optionValue="value" placeholder="Select One" class="w-full"></Select>
<!--InputText id="ksDocType" v-model="formData.ksDocType" required class="w-full" /-->
</span>
</div>
@@ -99,16 +100,15 @@ import axios from 'axios';
import { useToast } from 'primevue/usetoast';
import { ref } from 'vue';
import { useRouter } from 'vue-router';
import Tooltip from 'primevue/tooltip';
const toast = useToast();
const router = useRouter();
const dropdownItems = ref([
{ name: 'PDF', value: 'pdf' },
{ name: 'MD', value: 'md' },
{ name: 'DOCX', value: 'docx' },
{ name: 'EXCEL', value: 'excel' }
{ name: 'PDF', value: 'pdf' },
{ name: 'MD', value: 'md' },
{ name: 'DOCX', value: 'docx' },
{ name: 'EXCEL', value: 'excel' }
]);
const formData = ref({

View File

@@ -9,11 +9,13 @@
<div class="flex flex-col gap-4">
<div class="flex flex-col gap-2">
<label for="repoName">Repo Name</label>
<InputText id="repoName" v-model="formData.repoName" placeholder="Enter Repo Name" required class="w-full" />
<InputText id="repoName" v-model="formData.repoName" placeholder="Enter Repo Name" required
class="w-full" />
</div>
<div class="flex flex-col gap-2">
<label for="branch">Branch</label>
<InputText id="branch" v-model="formData.branch" placeholder="Enter Branch" required class="w-full" />
<InputText id="branch" v-model="formData.branch" placeholder="Enter Branch" required
class="w-full" />
</div>
<div class="flex flex-col gap-2">
<label for="commitId">CommitID</label>
@@ -27,7 +29,8 @@
</div>
<div class="flex flex-col gap-2">
<label for="defaultChunkSize">Default Chunk Size</label>
<InputNumber id="defaultChunkSize" v-model="formData.defaultChunkSize" required class="w-full" />
<InputNumber id="defaultChunkSize" v-model="formData.defaultChunkSize" required
class="w-full" />
</div>
<div class="flex flex-col gap-2">
<label for="minChunkSize">Min Chunk Size</label>
@@ -35,14 +38,17 @@
</div>
<div class="flex flex-col gap-2">
<label for="maxNumberOfChunks">Max Number of Chunks</label>
<InputNumber id="maxNumberOfChunks" v-model="formData.maxNumberOfChunks" required class="w-full" />
<InputNumber id="maxNumberOfChunks" v-model="formData.maxNumberOfChunks" required
class="w-full" />
</div>
<div class="flex flex-col gap-2">
<label for="minChunkSizeToEmbed">Min Chunk Size to Embed</label>
<InputNumber id="minChunkSizeToEmbed" v-model="formData.minChunkSizeToEmbed" required class="w-full" />
<InputNumber id="minChunkSizeToEmbed" v-model="formData.minChunkSizeToEmbed" required
class="w-full" />
</div>
</div>
<Button type="submit" label="Submit" :disabled="isSubmitting" :fluid="false" class="p-button-rounded p-button-lg mt-4" />
<Button type="submit" label="Submit" :disabled="isSubmitting" :fluid="false"
class="p-button-rounded p-button-lg mt-4" />
</form>
</div>
</div>
@@ -51,12 +57,12 @@
<script setup>
import axios from 'axios';
import Button from 'primevue/button';
import InputNumber from 'primevue/inputnumber';
import InputText from 'primevue/inputtext';
import { useToast } from 'primevue/usetoast';
import { ref } from 'vue';
import { useRouter } from 'vue-router';
import { useToast } from 'primevue/usetoast';
import InputText from 'primevue/inputtext';
import InputNumber from 'primevue/inputnumber';
import Button from 'primevue/button';
const toast = useToast();
const router = useRouter();

View File

@@ -28,14 +28,13 @@
</template>
<script setup>
import CodeSnippet from '@/components/CodeSnippet.vue';
import axios from 'axios';
import Button from 'primevue/button';
import Card from 'primevue/card';
import ScrollPanel from 'primevue/scrollpanel';
import SelectButton from 'primevue/selectbutton'; // Import SelectButton
import { useToast } from 'primevue/usetoast';
import { watch, ref } from 'vue';
import CodeSnippet from '@/components/CodeSnippet.vue';
import axios from 'axios';
import { ref, watch } from 'vue';
const query = ref('');
const dropdownItem = ref(null);
@@ -58,21 +57,21 @@ const sendQuery = () => {
filterQuery: filterQuery.value,
}
})
.then(response => {
const data = response.data;
console.log('API response:', data);
.then(response => {
const data = response.data;
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 });
});
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 });
});
} else {
toast.add({ severity: 'warn', summary: 'Warning', detail: 'Please enter a query and select a type', life: 3000 });
}

View File

@@ -1,7 +1,7 @@
<template>
<div className="card">
<DataTable v-model:filters="filters" :value="vectorDetails" dataKey="id" :loading="loading" paginator showGridlines
:rows="10" filterDisplay="menu"
<DataTable v-model:filters="filters" :value="vectorDetails" dataKey="id" :loading="loading" paginator
showGridlines :rows="10" filterDisplay="menu"
:globalFilterFields="['id', 'metadata.ksApplicationName', 'metadata.ksDocSource', 'metadata.ksDoctype', 'metadata.ksFileSource']">
<template #header>
<div class="flex items-center justify-between gap-4 p-4 ">
@@ -23,7 +23,8 @@
{{ data.id }}
</template>
<template #filter="{ filterModel, filterCallback }">
<InputText v-model="filterModel.value" type="text" @input="filterCallback()" placeholder="Search By id" />
<InputText v-model="filterModel.value" type="text" @input="filterCallback()"
placeholder="Search By id" />
</template>
</Column>
<Column field="metadata.ksApplicationName" header="KsApplicationName" sortable>
@@ -66,9 +67,9 @@
</div>
</template>
<script setup>
import { onMounted, ref } from 'vue';
import { FilterMatchMode, FilterOperator } from '@primevue/core/api'
import { FilterMatchMode, FilterOperator } from '@primevue/core/api';
import axios from 'axios';
import { onMounted, ref } from 'vue';
const vectorDetails = ref(null);
const loading = ref(true);

View File

@@ -1,13 +1,13 @@
<script setup>
import { useLayout } from '@/layout/composables/layout';
import { useAuth } from '@websanova/vue-auth/src/v3.js';
import { computed, ref } from 'vue';
import {useAuth } from '@websanova/vue-auth/src/v3.js';
//import logo from '@/assets/Logo_Apollo_Transparent.png';
import logo from '@/assets/apollo.jpg';
const auth = useAuth();
const auth = useAuth();
const { isDarkTheme } = useLayout();
const username = ref('');
const username = ref('');
const password = ref('');
const logoSrc = ref(logo);
@@ -40,13 +40,13 @@ const login = () => {
style="border-radius: 56px; padding: 0.3rem; background: linear-gradient(180deg, var(--primary-color) 10%, rgba(33, 150, 243, 0) 30%)">
<div class="w-full bg-surface-0 dark:bg-surface-900 py-20 px-8 sm:px-20" style="border-radius: 53px">
<div class="text-center mb-8">
<img :src="logoSrc" alt="Logo" class="logo-image mx-auto" />
<!--span style="font-size: 24px;" class="text-surface-600 dark:text-surface-200 font-medium">Welcome to Apollo- The Knowledge Source</span-->
<div style="text-align: center; padding: 20px;">
<span style="font-size: 36px; font-weight: bold; color: #3b7a57;">Welcome to Apollo</span><br>
<span style="font-size: 24px; color: #555;">The Knowledge Source</span>
<span style="font-size: 36px; font-weight: bold; color: #3b7a57;">Welcome to Apollo</span><br>
<span style="font-size: 24px; color: #555;">The Knowledge Source</span>
</div>
</div>
@@ -90,9 +90,12 @@ const login = () => {
.logo-image {
border-radius: 50%;
width: 220px; /* Adjust the size as needed */
height: 220px; /* Adjust the size as needed */
object-fit: cover; /* Ensures the logo scales nicely within the circle */
width: 220px;
/* Adjust the size as needed */
height: 220px;
/* Adjust the size as needed */
object-fit: cover;
/* Ensures the logo scales nicely within the circle */
display: block;
}
</style>