dialog modifications
This commit is contained in:
sumedh
@@ -1,6 +1,6 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="card">
|
<div class="card">
|
||||||
<Toast/>
|
<Toast/>
|
||||||
<ConfirmPopup></ConfirmPopup>
|
<ConfirmPopup></ConfirmPopup>
|
||||||
<div v-if="loading" class="loading-container">
|
<div v-if="loading" class="loading-container">
|
||||||
<div class="spinner-container">
|
<div class="spinner-container">
|
||||||
@@ -21,6 +21,7 @@
|
|||||||
filterDisplay="menu"
|
filterDisplay="menu"
|
||||||
:loading="loading"
|
:loading="loading"
|
||||||
:globalFilterFields="['repoName', 'branch', 'ingestionStatus', 'ingestionDateFormat']"
|
:globalFilterFields="['repoName', 'branch', 'ingestionStatus', 'ingestionDateFormat']"
|
||||||
|
tableStyle="min-width: 60rem"
|
||||||
>
|
>
|
||||||
<template #header>
|
<template #header>
|
||||||
<div class="flex items-center justify-between gap-4 p-4">
|
<div class="flex items-center justify-between gap-4 p-4">
|
||||||
@@ -33,7 +34,7 @@
|
|||||||
<InputText v-model="filters['global'].value" placeholder="Keyword Search" />
|
<InputText v-model="filters['global'].value" placeholder="Keyword Search" />
|
||||||
</IconField>
|
</IconField>
|
||||||
</div>
|
</div>
|
||||||
<Button icon="pi pi-plus" rounded raised @click="newCodeRepoForm()" v-tooltip="'Add New Git Repo'" class="mr-2" />
|
<!--Button icon="pi pi-plus" rounded raised @click="newCodeRepoForm()" v-tooltip="'Add New Git Repo'" class="mr-2" /-->
|
||||||
<Button icon="pi pi-bolt" rounded raised @click="cloneRepoForm()" v-tooltip="'Clone New Git Repo'" class="mr-2" />
|
<Button icon="pi pi-bolt" rounded raised @click="cloneRepoForm()" v-tooltip="'Clone New Git Repo'" class="mr-2" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@@ -87,40 +88,41 @@
|
|||||||
|
|
||||||
<Column header="Actions" headerStyle="width: 5rem; text-align: center" bodyStyle="text-align: center; overflow: visible">
|
<Column header="Actions" headerStyle="width: 5rem; text-align: center" bodyStyle="text-align: center; overflow: visible">
|
||||||
<template #body="slotProps">
|
<template #body="slotProps">
|
||||||
<div class="flex justify-center items-center space-x-3" >
|
<div class="flex justify-center items-center space-x-3" >
|
||||||
<Button
|
<Button
|
||||||
type="button"
|
type="button"
|
||||||
icon="pi pi-play"
|
icon="pi pi-play"
|
||||||
class="p-button-rounded p-button-success p-mr-2"
|
class="p-button-rounded p-button-success p-mr-2"
|
||||||
@click="ingestGitRepo(slotProps.data)"
|
@click="ingestGitRepo(slotProps.data)"
|
||||||
v-tooltip="'Start Ingestion of Repo'"
|
v-tooltip="'Start Ingestion of Repo'"
|
||||||
:disabled="slotProps.data.ingestionStatus === 'INGESTED'"
|
:disabled="slotProps.data.ingestionStatus === 'INGESTED'"
|
||||||
:class="{ 'p-button-danger': slotProps.data.ingestionStatus === 'INGESTED' }"
|
/>
|
||||||
/>
|
|
||||||
|
|
||||||
<Button type="button" icon="pi pi-forward" severity="danger" rounded @click="reIngestWithPullChanges(slotProps.data)" v-tooltip="'Ingest Repo with latest changes from master branch'"/>
|
|
||||||
|
|
||||||
<Button type="button" icon="pi pi-trash" rounded @click="showConfirmDialog(slotProps.data.id)"
|
|
||||||
v-tooltip="'Delete the Records'" />
|
|
||||||
|
|
||||||
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<Dialog header="Confirm Deletion" :visible="confirmDialogVisible" modal @hide="resetConfirmDialog"
|
<Button
|
||||||
:style="{ width: '300px' }">
|
type="button"
|
||||||
<p>Are you sure you want to delete this record?</p>
|
icon="pi pi-forward"
|
||||||
<template #footer>
|
class="p-button-rounded p-button-success p-mr-2"
|
||||||
<Button label="No" icon="pi pi-times" @click="confirmDialogVisible = false"/>
|
@click="reIngestWithPullChanges(slotProps.data)"
|
||||||
<Button label="Yes" icon="pi pi-check" @click="confirmDelete" class="p-button-danger" />
|
v-tooltip="'Ingest Repo with latest changes from master branch'"
|
||||||
</template>
|
/>
|
||||||
</Dialog>
|
|
||||||
|
<Button
|
||||||
|
type="button"
|
||||||
|
icon="pi pi-trash"
|
||||||
|
class="p-button-rounded p-button-success p-mr-2"
|
||||||
|
@click="deleteRecordsFromVectorStore(slotProps.data)"
|
||||||
|
v-tooltip="'Delete the Records'"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</Column>
|
</Column>
|
||||||
|
|
||||||
|
<template #expansion="slotProps">
|
||||||
|
<div class="p-4">
|
||||||
|
<h5>Records of {{ slotProps.data }}</h5>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
</DataTable>
|
</DataTable>
|
||||||
<Dialog v-model:visible="ingestionDialogVisible" :header="popupTitle">
|
|
||||||
<p>{{ popupMessage }}</p>
|
|
||||||
<Button label="OK" icon="pi pi-check" @click="ingestionDialogVisible = false" />
|
|
||||||
</Dialog>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -149,15 +151,11 @@ const codeRepoInfo = ref(null);
|
|||||||
const loading = ref(true);
|
const loading = ref(true);
|
||||||
const toast = useToast();
|
const toast = useToast();
|
||||||
const confirm = useConfirm();
|
const confirm = useConfirm();
|
||||||
|
const expandedRows = ref({});
|
||||||
|
|
||||||
const confirmDialogVisible = ref(false);
|
|
||||||
const recordToDelete = ref(null);
|
|
||||||
|
|
||||||
const ingestionDialogVisible = ref(false);
|
|
||||||
const ingestionResult = ref('');
|
const ingestionResult = ref('');
|
||||||
const popupTitle = ref('');
|
const popupTitle = ref('');
|
||||||
const popupMessage = ref('');
|
const popupMessage = ref('');
|
||||||
let checkStatusInterval = null;
|
|
||||||
const filters = ref();
|
const filters = ref();
|
||||||
const statuses = ref(['NEW', 'INGESTED', 'FAILED', 'INPROGRESS']);
|
const statuses = ref(['NEW', 'INGESTED', 'FAILED', 'INPROGRESS']);
|
||||||
|
|
||||||
@@ -197,68 +195,37 @@ const getCustomDatewithAllResponse = (data) => {
|
|||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
//-------------------------------------------------------------------------------------------------------
|
|
||||||
|
|
||||||
const ingestGitRepo = (repo) => {
|
//ingest git repo functions
|
||||||
axios
|
const ingestGitRepo = (repo) => {
|
||||||
.get(`/test/ingest_repo?repoName=${repo.repoName}&branchName=${repo.branch}`)
|
confirm.require({
|
||||||
.then((response) => {
|
target: event.currentTarget,
|
||||||
showPopup('Ingestion started', 'info');
|
message: 'Are you sure you want to proceed?',
|
||||||
toast.add({ severity: 'success', summary: 'Ingestion Summary', detail: 'Repository Ingestion Started', life: 3000 });
|
icon: 'pi pi-exclamation-circle',
|
||||||
startPollingStatus(repo);
|
rejectProps: {
|
||||||
})
|
label: 'Cancel',
|
||||||
.catch((error) => {
|
severity: 'secondary',
|
||||||
showPopup('Error starting ingestion', 'error');
|
outlined: true
|
||||||
});
|
},
|
||||||
};
|
acceptProps: {
|
||||||
|
label: 'Ingest Record',
|
||||||
const startPollingStatus = (repo) => {
|
severity: 'danger',
|
||||||
if (checkStatusInterval) {
|
},
|
||||||
// Prevent starting multiple intervals if there's already one running
|
accept: () => {
|
||||||
clearInterval(checkStatusInterval);
|
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 });
|
||||||
checkStatusInterval = setInterval(() => {
|
console.log('Delete resource:', response.data)
|
||||||
checkIngestionStatus(repo);
|
})
|
||||||
}, 100000); // Poll every 1 minute
|
.catch((error) => {
|
||||||
};
|
console.error('Error deleting records: ', error)
|
||||||
|
toast.add({ severity: 'error', summary: 'Error', detail: 'Error Ingesting records:', life: 6000 });
|
||||||
const checkIngestionStatus = (repo) => {
|
});
|
||||||
axios
|
},
|
||||||
.get(`/test/check_ingestion_status?repoName=${repo.repoName}&branchName=${repo.branch}`)
|
reject: () => {
|
||||||
.then((response) => {
|
toast.add({severity: 'error', summary: 'Rejected', detail: 'You have rejected', life: 3000})
|
||||||
const data = response.data;
|
|
||||||
if (data.status === 'INGESTED') {
|
|
||||||
clearInterval(checkStatusInterval);
|
|
||||||
checkStatusInterval = null; // Reset interval reference
|
|
||||||
showPopup('Ingestion completed successfully', 'success');
|
|
||||||
updateRepositoryStatus(data.ingestedDocumentId);
|
|
||||||
} else if (data.status === 'ERROR') {
|
|
||||||
clearInterval(checkStatusInterval);
|
|
||||||
checkStatusInterval = null; // Reset interval reference
|
|
||||||
showPopup(`Error: ${data.message}`, 'error');
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.catch((error) => {
|
|
||||||
clearInterval(checkStatusInterval);
|
|
||||||
checkStatusInterval = null; // Reset interval reference
|
|
||||||
showPopup('Error checking ingestion status', 'error');
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
const updateRepositoryStatus = (ingestedDocumentId) => {
|
|
||||||
// Update status of the repository in your local state or data
|
|
||||||
codeRepoInfo.value.forEach((element) => {
|
|
||||||
if (ingestedDocumentId.includes(element.id)) {
|
|
||||||
element.status = 'INGESTED';
|
|
||||||
}
|
}
|
||||||
});
|
})
|
||||||
};
|
|
||||||
|
|
||||||
const showPopup = (message, severity) => {
|
|
||||||
popupMessage.value = message;
|
|
||||||
popupTitle.value = severity === 'success' ? 'Success' : severity === 'error' ? 'Error' : severity === 'info' ? 'Ingestion Status' : 'Notification';
|
|
||||||
ingestionDialogVisible.value = true;
|
|
||||||
};
|
};
|
||||||
|
|
||||||
// ---------------------------------------------------------------------------------------------------------
|
// ---------------------------------------------------------------------------------------------------------
|
||||||
@@ -297,52 +264,52 @@ const getStatus = (data) => {
|
|||||||
};
|
};
|
||||||
|
|
||||||
//delete functionality
|
//delete functionality
|
||||||
function showConfirmDialog(id) {
|
const deleteRecordsFromVectorStore = (data) =>{
|
||||||
recordToDelete.value = id;
|
console.log("data",data);
|
||||||
confirmDialogVisible.value = true;
|
console.log("reponame",data.repoName);
|
||||||
}
|
|
||||||
|
|
||||||
function confirmDelete() {
|
const requestPayload = {
|
||||||
if (recordToDelete.value !== null) {
|
ksGitInfoId: data.id,
|
||||||
deleteRecordsFromVectorStore(recordToDelete.value);
|
ksGitIngestionInfoId: data.ksGitIngestionInfo.id,
|
||||||
recordToDelete.value = null;
|
ksDoctype: data.ksGitIngestionInfo.metadata.KsDoctype,
|
||||||
}
|
ksDocSource: data.ksGitIngestionInfo.metadata.KsDocSource,
|
||||||
confirmDialogVisible.value = false;
|
ksFileSource: data.ksGitIngestionInfo.metadata.KsFileSource,
|
||||||
}
|
ksApplicationName: data.ksGitIngestionInfo.metadata.KsApplicationName,
|
||||||
|
ksBranch: data.ksGitIngestionInfo.metadata.KsBranch
|
||||||
function resetConfirmDialog() {
|
|
||||||
recordToDelete.value = null;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
const deleteRecordsFromVectorStore = (id) => {
|
|
||||||
const ksGitInfoToDelete = codeRepoInfo.value.find(ksGitInfo => ksGitInfo.id === id);
|
|
||||||
|
|
||||||
if (!ksGitInfoToDelete) {
|
|
||||||
console.error('Repository not found');
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
const requestPayload = {
|
|
||||||
ksGitInfoId: id,
|
|
||||||
ksGitIngestionInfoId: ksGitInfoToDelete.ksGitIngestionInfo.id,
|
|
||||||
ksDoctype: ksGitInfoToDelete.ksGitIngestionInfo.metadata.KsDoctype,
|
|
||||||
ksDocSource: ksGitInfoToDelete.ksGitIngestionInfo.metadata.KsDocSource,
|
|
||||||
ksFileSource: ksGitInfoToDelete.ksGitIngestionInfo.metadata.KsFileSource,
|
|
||||||
ksApplicationName: ksGitInfoToDelete.ksGitIngestionInfo.metadata.KsApplicationName,
|
|
||||||
ksBranch: ksGitInfoToDelete.ksGitIngestionInfo.metadata.KsBranch
|
|
||||||
};
|
};
|
||||||
|
console.log("requestPayload",requestPayload)
|
||||||
|
|
||||||
axios.post('/fe-api/vector-store/deleteGitRecords', requestPayload)
|
confirm.require({
|
||||||
.then(response => {
|
target: event.currentTarget,
|
||||||
console.log('Delete resource:', response.data)
|
message: 'Are you sure you want to proceed?',
|
||||||
codeRepoInfo.value = codeRepoInfo.value.filter(ksGitInfo => ksGitInfo.id !== id);
|
icon: 'pi pi-exclamation-circle',
|
||||||
})
|
rejectProps: {
|
||||||
.catch(error => {
|
label: 'Cancel',
|
||||||
console.error('Error deleting records: ', error)
|
severity: 'secondary',
|
||||||
});
|
outlined: true
|
||||||
}
|
},
|
||||||
|
acceptProps: {
|
||||||
|
label: 'Delete Records',
|
||||||
|
severity: 'danger',
|
||||||
|
},
|
||||||
|
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 });
|
||||||
|
});
|
||||||
|
},
|
||||||
|
reject: () => {
|
||||||
|
toast.add({severity: 'error', summary: 'Rejected', detail: 'You have rejected', life: 3000})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
};
|
||||||
|
|
||||||
|
//reingest latest changes
|
||||||
const reIngestWithPullChanges = (data) =>{
|
const reIngestWithPullChanges = (data) =>{
|
||||||
console.log("data",data);
|
console.log("data",data);
|
||||||
console.log("reponame",data.repoName);
|
console.log("reponame",data.repoName);
|
||||||
@@ -350,14 +317,14 @@ const reIngestWithPullChanges = (data) =>{
|
|||||||
confirm.require({
|
confirm.require({
|
||||||
target: event.currentTarget,
|
target: event.currentTarget,
|
||||||
message: 'Are you sure you want to proceed?',
|
message: 'Are you sure you want to proceed?',
|
||||||
icon: 'pi pi-exclamation-triangle',
|
icon: 'pi pi-exclamation-circle',
|
||||||
rejectProps: {
|
rejectProps: {
|
||||||
label: 'Cancel',
|
label: 'Cancel',
|
||||||
severity: 'secondary',
|
severity: 'secondary',
|
||||||
outlined: true
|
outlined: true
|
||||||
},
|
},
|
||||||
acceptProps: {
|
acceptProps: {
|
||||||
label: 'Ingest Changes',
|
label: 'Reingest Latest Changes',
|
||||||
severity: 'danger',
|
severity: 'danger',
|
||||||
},
|
},
|
||||||
accept: () => {
|
accept: () => {
|
||||||
@@ -375,6 +342,14 @@ const reIngestWithPullChanges = (data) =>{
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
};
|
};
|
||||||
|
|
||||||
|
//expand
|
||||||
|
const onRowExpand = (event) => {
|
||||||
|
toast.add({ severity: 'info', summary: 'Product Expanded', detail: event.data, life: 3000 });
|
||||||
|
};
|
||||||
|
const onRowCollapse = (event) => {
|
||||||
|
toast.add({ severity: 'success', summary: 'Product Collapsed', detail: event.data, life: 3000 });
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
@@ -459,4 +434,4 @@ const reIngestWithPullChanges = (data) =>{
|
|||||||
.card {
|
.card {
|
||||||
margin: 2rem;
|
margin: 2rem;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
Reference in New Issue
Block a user