diff --git a/nezha-fronted/src/components/common/elementSet.vue b/nezha-fronted/src/components/common/elementSet.vue index 4dcc46b7f..db3898206 100644 --- a/nezha-fronted/src/components/common/elementSet.vue +++ b/nezha-fronted/src/components/common/elementSet.vue @@ -136,6 +136,9 @@ export default { border-radius: 4px; z-index: 999999; } +.pop-custom-explore { + top: 33px; +} .relative-position .pop-custom { top: 33px; } diff --git a/nezha-fronted/src/components/page/dashboard/chartBox.vue b/nezha-fronted/src/components/page/dashboard/chartBox.vue index b233283f4..3ce4e1502 100644 --- a/nezha-fronted/src/components/page/dashboard/chartBox.vue +++ b/nezha-fronted/src/components/page/dashboard/chartBox.vue @@ -874,7 +874,7 @@ this.isAlert=false; }, setIsAlertList(){ - this.isAlert=true; + this.isAlert = true; this.isUrl = false; this.isSingleStat = false; }, diff --git a/nezha-fronted/src/components/page/dashboard/explore/explore.vue b/nezha-fronted/src/components/page/dashboard/explore/explore.vue index e4fc0d4d9..a473b0617 100644 --- a/nezha-fronted/src/components/page/dashboard/explore/explore.vue +++ b/nezha-fronted/src/components/page/dashboard/explore/explore.vue @@ -54,17 +54,28 @@ :class="{'shrink-view':!tableVisible || !defaultTableVisible}">
 table
+ + + + - + @@ -187,14 +198,6 @@ instance_cpu_time_ns{app="fox", proc="widget", rev="4d3a513", env="prod", job="c -
@@ -212,7 +215,6 @@ instance_cpu_time_ns{app="fox", proc="widget", rev="4d3a513", env="prod", job="c name: "explore", components: { 'promql-input': promqlInput, - // 'promql-input-plus':promqlInputPlus, 'chart': chart, 'chart-box': chartBox, }, @@ -228,6 +230,14 @@ instance_cpu_time_ns{app="fox", proc="widget", rev="4d3a513", env="prod", job="c bus.timeFormate(new Date(bus.computeTimezone(new Date().getTime())).setHours(new Date(bus.computeTimezone(new Date().getTime())).getHours() - 1),'yyyy-MM-dd hh:mm:ss'), bus.timeFormate(new Date(bus.computeTimezone(new Date().getTime())),'yyyy-MM-dd hh:mm:ss') ], + + /*工具参数*/ + tools: { + loading: false, //是否显示table加载动画 + showCustomTableTitle: false, //自定义列弹框是否显示 + customTableTitle: [], //自定义列工具的数据 + }, + tableTitle: [], showIntroduce: true, defaultChartVisible: true, defaultTableVisible: true, @@ -238,11 +248,7 @@ instance_cpu_time_ns{app="fox", proc="widget", rev="4d3a513", env="prod", job="c pageSize: 50, total: 0 }, - dropCol: [], tableData: [], - tableLabels: [], - showTableLabels: [], - tableLoading: false, saveDisabled: true, panelData: [], chartUnit:0, @@ -352,7 +358,7 @@ instance_cpu_time_ns{app="fox", proc="widget", rev="4d3a513", env="prod", job="c }, 200) }, queryTableData: function () { - this.tableLoading = true, + this.tools.loading = true, setTimeout(() => { if (this.expressions.length > 0) { let requestArr = []; @@ -369,7 +375,7 @@ instance_cpu_time_ns{app="fox", proc="widget", rev="4d3a513", env="prod", job="c let tLabels = []; if (res.length > 0) { this.tableData = []; - this.tableLabels = []; + this.tableTitle = []; //console.log(111111111111111111111,res) res.forEach((response, index) => { if (response.data&&response.status == 'success') { @@ -403,21 +409,20 @@ instance_cpu_time_ns{app="fox", proc="widget", rev="4d3a513", env="prod", job="c this.storedTableData = Object.assign([], tData); this.pageObj.total = this.storedTableData.length; this.tableData = this.filterShowData(this.storedTableData, this.pageObj); - this.tableLabels = Object.assign([], tLabels); - this.showTableLabels = Object.assign([], tLabels); - this.dropCol = Object.assign([], tLabels); + this.tableTitle = Object.assign([], tLabels); + this.tools.customTableTitle = Object.assign([], tLabels); this.defaultTableVisible = true; }else{ // this.defaultTableVisible = false; } } - this.tableLoading = false; + this.tools.loading = false; }) } }, 200) }, expressionChange: function () { - console.log(this.filterTime) + //console.log(this.filterTime) if (this.expressions && this.expressions.length >= 1) { this.queryTableData(); this.queryChartData() @@ -569,36 +574,6 @@ instance_cpu_time_ns{app="fox", proc="widget", rev="4d3a513", env="prod", job="c } }); }, - elementsetShow(s, e) { - var eventfixed = { - shezhi: 0, - screen: 0 - }; - eventfixed[s] = 1; - e.preventDefault(); - this.$store.commit('setEventfixed', eventfixed); - const h = document.documentElement.clientHeight; - const w = document.documentElement.clientWidth; - const dw = this.$refs.elementset.$el.offsetWidth; - const dh = this.$refs.elementset.$el.offsetHeight; - let positionx = - e.clientX + dw <= w - 10 ? e.clientX + 14 : e.clientX + 14 - dw; - let positiony = - e.clientY + dh <= h - 10 - ? e.clientY + 20 - : e.clientY + 20 - (e.clientY + dh - h + 30); - this.$store.commit('setPosition', {positionx, positiony}); - }, - elementsetHide() { - //悬浮点击空白隐藏 - this.$refs.elementset.elementsetHide(); - }, - tablelabelEmit(data) { - //获取子组件传过来的参数 - this.$store.commit('setHeaderTable', data); - console.log(data) - this.showTableLabels = data; - }, jumpTo(data, id) { bus.$emit("menu-change", data); this.$router.push({ @@ -609,8 +584,6 @@ instance_cpu_time_ns{app="fox", proc="widget", rev="4d3a513", env="prod", job="c }); }, }, - mounted() { - }, watch: { promqlCount: function (n, o) { this.expressionChange(); @@ -671,7 +644,9 @@ instance_cpu_time_ns{app="fox", proc="widget", rev="4d3a513", env="prod", job="c } } - + .table-room { + position: relative; + } .explore .view-title { font-weight: 500; margin-right: 8px;