diff --git a/web/src/components/ingestion/logs/Index.vue b/web/src/components/ingestion/logs/Index.vue index 8b3b143a7c..284f63fb55 100644 --- a/web/src/components/ingestion/logs/Index.vue +++ b/web/src/components/ingestion/logs/Index.vue @@ -90,7 +90,6 @@ along with this program. If not, see . content-class="tab_content" /> child.name === "ingestLogs") ?.children.push(...[sysLog, sysLogNg]); - } else { - ingestionRoutes[0].children - .find((child: any) => child.name === "custom") - .children.find((child: any) => child.name === "ingestLogs") - ?.children.push(...[kinesisFirehose, gcpPubSub]); } + + ingestionRoutes[0].children + .find((child: any) => child.name === "custom") + .children.find((child: any) => child.name === "ingestLogs") + ?.children.push(...[kinesisFirehose, gcpPubSub]); + return ingestionRoutes; }; diff --git a/web/src/composables/useLogs.ts b/web/src/composables/useLogs.ts index 1a6638834d..8be6b4b1a7 100644 --- a/web/src/composables/useLogs.ts +++ b/web/src/composables/useLogs.ts @@ -52,7 +52,8 @@ import { start } from "repl"; const defaultObject = { organizationIdetifier: "", runQuery: false, - loading: true, + loading: false, + loadingHistogram: false, config: { splitterModel: 20, lastSplitterPosition: 0, @@ -136,7 +137,15 @@ const defaultObject = { queryResults: [], sortedQueryResults: [], streamResults: [], - histogram: {}, + histogram: { + xData: [], + yData: [], + chartParams: { + title: "", + unparsed_x_data: [], + timezone: "", + }, + }, editorValue: "", datetime: { startTime: 0, @@ -156,11 +165,13 @@ const defaultObject = { tempFunctionLoading: false, savedViews: [], customDownloadQueryObj: {}, + functionError: "", }, }; +const searchObj = reactive(Object.assign({}, defaultObject)); + const useLogs = () => { - const searchObj = reactive(Object.assign({}, defaultObject)); const store = useStore(); const { t } = useI18n(); const $q = useQuasar(); @@ -185,7 +196,11 @@ const useLogs = () => { searchObj.data.histogram = { xData: [], yData: [], - chartParams: {}, + chartParams: { + title: "", + unparsed_x_data: [], + timezone: "", + }, }; searchObj.data.tempFunctionContent = ""; searchObj.data.query = ""; @@ -261,14 +276,14 @@ const useLogs = () => { } function resetQueryData() { - searchObj.data.queryResults = {}; + // searchObj.data.queryResults = {}; searchObj.data.sortedQueryResults = []; - searchObj.data.histogram = { - xData: [], - yData: [], - chartParams: {}, - }; - searchObj.data.resultGrid.columns = []; + // searchObj.data.histogram = { + // xData: [], + // yData: [], + // chartParams: {}, + // }; + // searchObj.data.resultGrid.columns = []; searchObj.data.resultGrid.currentPage = 1; searchObj.runQuery = false; searchObj.data.errorMsg = ""; @@ -487,7 +502,6 @@ const useLogs = () => { //replace backticks with \" for sql_mode query = query.replace(/`/g, '"'); - searchObj.loading = true; searchObj.data.queryResults.hits = []; searchObj.data.queryResults.total = 0; } @@ -571,11 +585,18 @@ const useLogs = () => { searchObj.meta.showHistogram === false ) { delete req.aggs; - req.query.track_total_hits = true; if (searchObj.meta.showHistogram === false) { // delete searchObj.data.histogram; - searchObj.data.histogram = { xData: [], yData: [], chartParams: {} }; + searchObj.data.histogram = { + xData: [], + yData: [], + chartParams: { + title: "", + unparsed_x_data: [], + timezone: "", + }, + }; searchObj.meta.histogramDirtyFlag = true; } else { searchObj.meta.histogramDirtyFlag = false; @@ -603,7 +624,7 @@ const useLogs = () => { const getQueryData = (isPagination = false) => { return new Promise((resolve, reject) => { - let dismiss = () => {}; + const dismiss = () => {}; try { searchObj.meta.showDetailTab = false; @@ -638,7 +659,7 @@ const useLogs = () => { ); } - if (isPagination) dismiss = showNotification(); + // if (isPagination) dismiss = showNotification(); if (searchObj.data.datetime.type === "relative") { if (!isPagination) initialQueryPayload.value = cloneDeep(queryReq); @@ -682,7 +703,8 @@ const useLogs = () => { if ( searchObj.meta.refreshInterval > 0 && router.currentRoute.value.name == "logs" && - searchObj.data.queryResults.hasOwnProperty("hits") + searchObj.data.queryResults.hasOwnProperty("hits") && + searchObj.data.queryResults.hits.length > 0 ) { searchObj.data.queryResults.from = res.data.from; searchObj.data.queryResults.scan_size = res.data.scan_size; @@ -691,17 +713,17 @@ const useLogs = () => { const lastRecordTimeStamp = parseInt( searchObj.data.queryResults.hits[0]._timestamp ); - // searchObj.data.queryResults.hits = res.data.hits; - for (let i = 0; i < res.data.hits.length; i++) { - if ( - lastRecordTimeStamp < - parseInt(res.data.hits[i]._timestamp) - ) { - searchObj.data.queryResults.hits.unshift( - res.data.hits[i] - ); - } - } + searchObj.data.queryResults.hits = res.data.hits; + // for (let i = 0; i < res.data.hits.length; i++) { + // if ( + // lastRecordTimeStamp < + // parseInt(res.data.hits[i]._timestamp) + // ) { + // searchObj.data.queryResults.hits.unshift( + // res.data.hits[i] + // ); + // } + // } // searchObj.data.queryResults.hits = // searchObj.data.queryResults.hits.splice(0, 150); @@ -732,9 +754,19 @@ const useLogs = () => { // disabled histogram case, generate histogram histogram title if ( searchObj.data.resultGrid.currentPage == 1 && - (searchObj.meta.showHistogram === false || searchObj.meta.sqlMode) + (searchObj.meta.showHistogram === false || + searchObj.meta.sqlMode) ) { - searchObj.data.histogram.chartParams.title = getHistogramTitle(); + searchObj.data.histogram.chartParams.title = + getHistogramTitle(); + } + + searchObj.data.functionError = ""; + if ( + res.data.hasOwnProperty("function_error") && + res.data.function_error + ) { + searchObj.data.functionError = res.data.function_error; } searchObj.loading = false; @@ -775,6 +807,7 @@ const useLogs = () => { return new Promise((resolve, reject) => { const dismiss = () => {}; try { + searchObj.loadingHistogram = true; queryReq.query.size = 0; queryReq.query.track_total_hits = true; searchService @@ -784,17 +817,18 @@ const useLogs = () => { page_type: searchObj.data.stream.streamType, }) .then((res) => { - dismiss(); + searchObj.loading = false; searchObj.data.errorMsg = ""; searchObj.data.queryResults.aggs = res.data.aggs; searchObj.data.queryResults.total = res.data.total; generateHistogramData(); // searchObj.data.histogram.chartParams.title = getHistogramTitle(); - searchObj.loading = false; + searchObj.loadingHistogram = false; + dismiss(); resolve(true); }) .catch((err) => { - searchObj.loading = false; + searchObj.loadingHistogram = false; if (err.response != undefined) { searchObj.data.errorMsg = err.response.data.error; } else { @@ -812,7 +846,7 @@ const useLogs = () => { }); } catch (e: any) { dismiss(); - searchObj.loading = false; + searchObj.loadingHistogram = false; showErrorNotification("Error while fetching histogram data"); reject(false); } @@ -1183,7 +1217,7 @@ const useLogs = () => { ) { clearInterval(store.state.refreshIntervalID); const refreshIntervalID = setInterval(async () => { - // searchObj.loading = true; + searchObj.loading = true; await getQueryData(false); generateHistogramData(); updateGridColumns(); diff --git a/web/src/locales/languages/en.json b/web/src/locales/languages/en.json index 2742324d62..28b3701fa9 100644 --- a/web/src/locales/languages/en.json +++ b/web/src/locales/languages/en.json @@ -92,7 +92,9 @@ "initialNumber": "Initial Number", "range": "No of Records", "btnDownload": "Download", - "customDownloadMessage": "Enter the initial number and select the range for downloading data." + "customDownloadMessage": "Enter the initial number and select the range for downloading data.", + "noRecordFound": "No Record Found", + "functionErrorLabel": "Function not applied: (expand for more details)" }, "menu": { "home": "Home", diff --git a/web/src/plugins/logs/Index.vue b/web/src/plugins/logs/Index.vue index 208c562b69..abad1effa8 100644 --- a/web/src/plugins/logs/Index.vue +++ b/web/src/plugins/logs/Index.vue @@ -85,110 +85,90 @@ along with this program. If not, see . @@ -216,6 +196,7 @@ import { import { useQuasar } from "quasar"; import { useStore } from "vuex"; import { useRouter } from "vue-router"; +import { useI18n } from "vue-i18n"; import SearchBar from "./SearchBar.vue"; import IndexList from "./IndexList.vue"; @@ -265,14 +246,7 @@ export default defineComponent({ async getMoreData() { if ( this.searchObj.meta.sqlMode == false && - this.searchObj.meta.refreshInterval == 0 && - this.searchObj.data.queryResults.total > - this.searchObj.data.queryResults.from && - this.searchObj.data.queryResults.total > - this.searchObj.data.queryResults.size && - this.searchObj.data.queryResults.total > - this.searchObj.data.queryResults.size + - this.searchObj.data.queryResults.from + this.searchObj.meta.refreshInterval == 0 ) { // this.searchObj.data.resultGrid.currentPage = // ((this.searchObj.data.queryResults?.hits?.length || 0) + @@ -281,7 +255,7 @@ export default defineComponent({ // 1; // this.searchObj.data.resultGrid.currentPage = // this.searchObj.data.resultGrid.currentPage + 1; - + this.searchObj.loading = true; await this.getQueryData(true); this.refreshHistogramChart(); @@ -332,6 +306,7 @@ export default defineComponent({ }, }, setup() { + const { t } = useI18n(); const store = useStore(); const router = useRouter(); const $q = useQuasar(); @@ -416,6 +391,7 @@ export default defineComponent({ }); onBeforeMount(() => { + searchObj.loading = true; searchObj.organizationIdetifier = store.state.selectedOrganization.identifier; restoreUrlQueryParams(); @@ -542,6 +518,7 @@ export default defineComponent({ }; return { + t, store, router, parser, diff --git a/web/src/plugins/logs/SearchBar.vue b/web/src/plugins/logs/SearchBar.vue index 0696ea026b..111cdd0c1b 100644 --- a/web/src/plugins/logs/SearchBar.vue +++ b/web/src/plugins/logs/SearchBar.vue @@ -328,6 +328,28 @@ clickable v-close-popup> + + + + {{ confirmMessageSavedView }} + + + + + + + + @@ -349,6 +371,7 @@ clickable v-close-popup> filled dense tabindex="0" + min="0" /> v-close-popup /> { this.customDownloadDialog = false; - this.downloadLogs(res.data.hits); + if (res.data.hits.length > 0) { + this.downloadLogs(res.data.hits); + } else { + this.$q.notify({ + message: "No data found to download.", + color: "positive", + position: "top", + timeout: 2000, + }); + } }) .catch((err) => { this.$q.notify({ @@ -742,6 +783,7 @@ export default defineComponent({ const saveFunctionLoader = ref(false); const confirmDialogVisible: boolean = ref(false); + const confirmSavedViewDialogVisible: boolean = ref(false); let confirmCallback; let fnEditorobj: any = null; let streamName = ""; @@ -1225,7 +1267,13 @@ export default defineComponent({ confirmCallback = callback; }; + const showSavedViewConfirmDialog = (callback) => { + confirmSavedViewDialogVisible.value = true; + confirmCallback = callback; + }; + const cancelConfirmDialog = () => { + confirmSavedViewDialogVisible.value = false; confirmDialogVisible.value = false; confirmCallback = null; }; @@ -1400,11 +1448,15 @@ export default defineComponent({ } } else { if (savedViewSelectedName.value.view_id) { - saveViewLoader.value = true; - updateSavedViews( - savedViewSelectedName.value.view_id, - savedViewSelectedName.value.view_name - ); + saveViewLoader.value = false; + showSavedViewConfirmDialog(() => { + saveViewLoader.value = true; + updateSavedViews( + savedViewSelectedName.value.view_id, + savedViewSelectedName.value.view_name + ); + }); + } else { $q.notify({ message: `Please select saved view to update.`, @@ -1588,6 +1640,7 @@ export default defineComponent({ isSavedViewAction.value = "create"; savedViewSelectedName.value = ""; saveViewLoader.value = false; + confirmSavedViewDialogVisible.value = false; } else { saveViewLoader.value = false; $q.notify({ @@ -1655,8 +1708,14 @@ export default defineComponent({ }; const resetFilters = () => { - searchObj.data.query = ""; + if (searchObj.meta.sqlMode == true) { + searchObj.data.query = `SELECT * FROM "${searchObj.data.stream.selectedStream.value}"`; + } else { + searchObj.data.query = ""; + } searchObj.data.editorValue = ""; + queryEditorRef.value.setValue(searchObj.data.query); + handleRunQuery(); }; const customDownloadDialog = ref(false); @@ -1679,6 +1738,7 @@ export default defineComponent({ updateQueryValue, updateDateTime, showConfirmDialog, + showSavedViewConfirmDialog, cancelConfirmDialog, confirmDialogOK, udpateQuery, @@ -1722,6 +1782,7 @@ export default defineComponent({ downloadCustomRange, downloadCustomRangeOptions, buildSearch, + confirmSavedViewDialogVisible, }; }, computed: { @@ -1734,6 +1795,9 @@ export default defineComponent({ confirmMessage() { return "Are you sure you want to update the function?"; }, + confirmMessageSavedView() { + return "Are you sure you want to update the saved view?"; + }, resetFunction() { return this.searchObj.data.tempFunctionName; }, diff --git a/web/src/plugins/logs/SearchResult.vue b/web/src/plugins/logs/SearchResult.vue index 32dd669591..d719050698 100644 --- a/web/src/plugins/logs/SearchResult.vue +++ b/web/src/plugins/logs/SearchResult.vue @@ -30,11 +30,15 @@ along with this program. If not, see .
. + + +
+ + {{ t("confirmDialog.loading") }} +
+ + + + +
+ + + {{ t("search.functionErrorLabel") }} +
+ + + + +
{{ searchObj.data.functionError }}
+ +