From 931d066d07db0fec046cd182e3d94398066e7ad5 Mon Sep 17 00:00:00 2001 From: zhangyu Date: Wed, 11 Oct 2023 17:40:10 +0800 Subject: [PATCH] =?UTF-8?q?feat=EF=BC=9A=20=E6=A0=B9=E6=8D=AE=E4=BD=8D?= =?UTF-8?q?=E7=BD=AE=E7=A1=AE=E5=AE=9A=20tooltip=20=E5=90=91=E4=B8=8B=20?= =?UTF-8?q?=E8=BF=98=E6=98=AF=E5=90=91=E4=B8=8A=E6=98=BE=E7=A4=BA?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../page/dashboard/explore/queryPrompt.scss | 12 +-- .../src/components/chart/panelChart.vue | 10 ++- .../common/rightBox/chart/chartConfig.vue | 13 +++- .../common/rightBox/chart/chartRightBox.vue | 18 +++-- .../common/rightBox/chart/publicConfig.js | 2 +- .../components/page/dashboard/dashboard.vue | 2 +- .../page/dashboard/explore/exploreItem.vue | 2 +- .../page/dashboard/explore/promqlInput.vue | 73 +++++++------------ .../explore/queryPrompt/queryPrompt.vue | 35 +++++++-- 9 files changed, 97 insertions(+), 70 deletions(-) diff --git a/nezha-fronted/src/assets/css/components/page/dashboard/explore/queryPrompt.scss b/nezha-fronted/src/assets/css/components/page/dashboard/explore/queryPrompt.scss index 86c46411c..1dc3f1046 100644 --- a/nezha-fronted/src/assets/css/components/page/dashboard/explore/queryPrompt.scss +++ b/nezha-fronted/src/assets/css/components/page/dashboard/explore/queryPrompt.scss @@ -1,13 +1,13 @@ .query-prompt-box { - width: calc(100% - 10px); + //width: calc(100% - 10px); height: 400px; background: $--background-color-empty; box-shadow: 0px 0px 21px 4px $--dropdown-menu-box-shadow-color; border-radius: 2px; - position: absolute; - bottom: -6px; - left: 5px; - transform: translateY(100%); + position: fixed; + //bottom: -6px; + //left: 5px; + transform: unset; z-index: 11; max-height: 400px; .explore-history-box-header { @@ -16,7 +16,7 @@ div.explore-history-item { padding: 0; } - .query-prompt-metric{ + .query-prompt-metric, .query-prompt-log{ display: flex; flex-direction: column; height: calc(100% - 45px); diff --git a/nezha-fronted/src/components/chart/panelChart.vue b/nezha-fronted/src/components/chart/panelChart.vue index a185ccd58..408e5caa5 100644 --- a/nezha-fronted/src/components/chart/panelChart.vue +++ b/nezha-fronted/src/components/chart/panelChart.vue @@ -310,7 +310,15 @@ export default { if (this.from === fromRoute.chartTemp || this.from === fromRoute.dashboardTemp) { return chartTempData } - let query = `${urlPre}/api/v1/query_range?start=${startTime}&end=${endTime}&step=${myStep}` + console.log(element.queryType) + let queryStr = 'query_range' + let query = '' + if (element.queryType == 1) { + queryStr = 'query_instant' + query = `${urlPre}/api/v1/${queryStr}?time=${endTime}` + } else { + query = `${urlPre}/api/v1/${queryStr}?start=${startTime}&end=${endTime}&step=${myStep}` + } if (isTimeSeries(this.chartInfo.type)) { let nullType = this.chartInfo.param.nullType || 'null' nullType = (nullType === 'connected' ? 'null' : nullType) diff --git a/nezha-fronted/src/components/common/rightBox/chart/chartConfig.vue b/nezha-fronted/src/components/common/rightBox/chart/chartConfig.vue index 5e5eea740..4bb9224f0 100644 --- a/nezha-fronted/src/components/common/rightBox/chart/chartConfig.vue +++ b/nezha-fronted/src/components/common/rightBox/chart/chartConfig.vue @@ -123,9 +123,9 @@
- - Range - Instant + + Range + Instant
@@ -135,7 +135,7 @@
{ + this.$refs['promql-' + (index)][0]?.hideQueryPromptShow() + }) } }, created () { diff --git a/nezha-fronted/src/components/common/rightBox/chart/chartRightBox.vue b/nezha-fronted/src/components/common/rightBox/chart/chartRightBox.vue index 73a7111f8..b510a54f8 100644 --- a/nezha-fronted/src/components/common/rightBox/chart/chartRightBox.vue +++ b/nezha-fronted/src/components/common/rightBox/chart/chartRightBox.vue @@ -13,7 +13,7 @@
-
+
@@ -384,7 +384,7 @@ export default { height: 2, unit: 2, type: 'line', - elements: [{ expression: '', legend: '', type: 'expert', id: '', name: 'A', state: 1, step: undefined, queryType: 'range' }], + elements: [{ expression: '', legend: '', type: 'expert', id: '', name: 'A', state: 1, step: undefined, queryType: 1 }], param: { stack: 0, nullType: 'null', @@ -427,7 +427,7 @@ export default { height: 2, unit: 2, type: 'line', - elements: [{ expression: '', legend: '', type: 'expert', id: '', name: 'A', state: 1, step: undefined, queryType: 'range' }], + elements: [{ expression: '', legend: '', type: 'expert', id: '', name: 'A', state: 1, step: undefined, queryType: 1 }], param: { stack: 0, nullType: 'null', @@ -468,7 +468,7 @@ export default { height: 2, unit: 2, type: 'log', - elements: [{ expression: '', legend: '', type: 'expert', id: '', name: 'A', state: 1, step: undefined, queryType: 'range' }], + elements: [{ expression: '', legend: '', type: 'expert', id: '', name: 'A', state: 1, step: undefined, queryType: 1 }], param: { enable: { thresholds: false, @@ -586,6 +586,12 @@ export default { }, 200) } this.previewShow = show + }, + rightBoxScroll: bus.debounce(function () { + this.hideQueryPrompt() + }, 300), + hideQueryPrompt () { + this.$refs['childrenFrom' + this.editChart.datasource]?.hideQueryPromptShow() } }, created () { @@ -611,9 +617,9 @@ export default { handler (n) { const obj = JSON.parse(JSON.stringify(n)) if (obj && obj.elements) { - obj.elements.forEach((item)=>{ + obj.elements.forEach((item) => { if (!item.queryType) { - item.queryType = 'range' + item.queryType = 1 } }) } diff --git a/nezha-fronted/src/components/common/rightBox/chart/publicConfig.js b/nezha-fronted/src/components/common/rightBox/chart/publicConfig.js index f78486851..72d280769 100644 --- a/nezha-fronted/src/components/common/rightBox/chart/publicConfig.js +++ b/nezha-fronted/src/components/common/rightBox/chart/publicConfig.js @@ -414,7 +414,7 @@ export default { elementId: '', state: 1, step: undefined, - queryType: 'range' + queryType: 1 }) this.expressionChange() } else { diff --git a/nezha-fronted/src/components/page/dashboard/dashboard.vue b/nezha-fronted/src/components/page/dashboard/dashboard.vue index 18b3b22e6..f837f3bd6 100644 --- a/nezha-fronted/src/components/page/dashboard/dashboard.vue +++ b/nezha-fronted/src/components/page/dashboard/dashboard.vue @@ -273,7 +273,7 @@ export default { sort: 'none' }, }, - elements: [{ expression: '', legend: '', type: 'expert', id: '', name: 'A', state: 1, orderNum: 0, step: undefined, queryType: 'range' }], + elements: [{ expression: '', legend: '', type: 'expert', id: '', name: 'A', state: 1, orderNum: 0, step: undefined, queryType: 1 }], panel: '', sync: 0, remark: '', diff --git a/nezha-fronted/src/components/page/dashboard/explore/exploreItem.vue b/nezha-fronted/src/components/page/dashboard/explore/exploreItem.vue index ce29b897b..42025c9a5 100644 --- a/nezha-fronted/src/components/page/dashboard/explore/exploreItem.vue +++ b/nezha-fronted/src/components/page/dashboard/explore/exploreItem.vue @@ -84,7 +84,7 @@ :index="index-1" :plugins="['metric-selector', 'metric-input', 'add', 'remove', 'copy','enable', 'history']" :styleType="1" - type="metric" + type="metrics" @enableExpression="enableExpression" @addExpression="addExpression" @copyExpression="copyExpression" diff --git a/nezha-fronted/src/components/page/dashboard/explore/promqlInput.vue b/nezha-fronted/src/components/page/dashboard/explore/promqlInput.vue index 1cac713d4..f2f3076d3 100644 --- a/nezha-fronted/src/components/page/dashboard/explore/promqlInput.vue +++ b/nezha-fronted/src/components/page/dashboard/explore/promqlInput.vue @@ -1,6 +1,6 @@