NEZ-2681 fix:panel更改为dashboard

This commit is contained in:
zyh
2023-03-15 15:39:06 +08:00
parent 0ad70b7463
commit 90692487f0
68 changed files with 371 additions and 1383 deletions

View File

@@ -8,7 +8,8 @@
height: 100%;
width: 100%;
position: absolute;
z-index: 2000;
// z-index: 2000;
z-index: 1000;
background-color: $--background-color-empty;
opacity: 0.8;
margin: 0;

View File

@@ -45,7 +45,7 @@
}
}
}
& > .bottom-panel {
& > .bottom-dashboard {
padding: 15px 10px 0px 10px !important;
}
}
@@ -190,7 +190,7 @@
transition: 0.4s height;
}
.bottom-panel {
.bottom-dashboard {
background-color: $--background-color-empty;
height: calc(100% - 30px);
}

View File

@@ -12,7 +12,7 @@
@import './common/alert/alertMessageInfo.scss';
@import './common/alert/alertDaysInfo.scss';
@import './common/bottomBox/bottomBox.scss';
@import './common/bottomBox/panelTabNew.scss';
@import './common/bottomBox/dashboardTab.scss';
@import './common/bottomBox/issueTab.scss';
@import './common/bottomBox/terminalLogCMDTab.scss';
@import './common/bottomBox/terminalLogMonitorTab.scss';

View File

@@ -21,9 +21,7 @@ const data = {
name: 'ADC-Serve'
},
fields: [],
cabinet: {
name: '机柜'
},
cabinet: null,
pingInfo: {
status: 0,
rtt: null

View File

@@ -130,7 +130,7 @@ export default {
type: Object
},
// 看板id
panelId: {
dashboardId: {
type: Number,
default: 0
},
@@ -179,7 +179,7 @@ export default {
xAxis: [],
theData: [] // series数据组
},
panelIdInner: '', // 看板id=panelId,原写作chart,由set_data获取
panelIdInner: '', // 看板id=dashboardId,原写作chart,由set_data获取
firstLoad: false, // 是否第一次加载
chartType: 'table', // 图表类型
screenModal: false,
@@ -357,7 +357,7 @@ export default {
this.screenPageObj.pageSize = this.pageObj.pageSize
},
// 设置数据, filter区分
setData (chartItem, seriesItem, panelId, filter, area, errorMsg) {
setData (chartItem, seriesItem, dashboardId, filter, area, errorMsg) {
if (filter) {
this.stableFilter = filter
}
@@ -416,7 +416,7 @@ export default {
})
this.firstShow = true // 展示操作按键
this.panelIdInner = panelId
this.panelIdInner = dashboardId
this.storedTableData = seriesItem
this.storedScreanTableData = seriesItem
this.storedTableData = Object.assign([], this.storedTableData.reverse())

View File

@@ -12,7 +12,7 @@
<div class="tooltip--row">
<div class="legend-value legend-value-asset">
<div class="map-asset">
<div class="progress-title">{{$t('panel.assetOk')}}</div>
<div class="progress-title">{{$t('dashboard.assetOk')}}</div>
<div class="success-progress progress-box">
<div class="top-progress" :style="{width: (dcStat.asset.ok / dcStat.asset.total) * 100 + '%' }"></div>
<div style="width: 100%" class="bottom-progress"></div>
@@ -20,7 +20,7 @@
<div class="success-progress progress-content">{{dcStat.asset.ok}}</div>
</div>
<div class="map-asset">
<div class="progress-title">{{$t('panel.assetAlarm')}}</div>
<div class="progress-title">{{$t('dashboard.assetAlarm')}}</div>
<div class="error-progress progress-box">
<div class="top-progress" :style="{width: (dcStat.asset.alarm / dcStat.asset.total) * 100 + '%'}"></div>
<div style="width: 100%" class="bottom-progress"></div>
@@ -31,7 +31,7 @@
<div class="partition"></div>
<div class="legend-value legend-value-agent">
<div class="map-asset">
<div class="progress-title">{{$t('overall.agent')}} {{$t('config.agent.up')}}}</div>
<div class="progress-title">{{$t('overall.agent')}} {{$t('config.agent.up')}}</div>
<div class="success-progress progress-box">
<div class="top-progress" :style="{width: (dcStat.agent.up / (dcStat.agent.up + dcStat.agent.down)) * 100 + '%'}"></div>
<div style="width: 100%" class="bottom-progress"></div>

View File

@@ -220,7 +220,7 @@ export default {
type: Object
},
// 看板id
panelId: {
dashboardId: {
type: Number,
default: 0
},
@@ -254,7 +254,7 @@ export default {
return function (from, type) {
let code = ''
switch (from) {
case this.$CONSTANTS.fromRoute.panel:
case this.$CONSTANTS.fromRoute.dashboard:
if (type == 'chartToEdit') {
code = ''
}
@@ -286,7 +286,7 @@ export default {
xAxis: [],
theData: [] // series数据组
},
panelIdInner: '', // 看板id=panelId,原写作chart,由set_data获取
panelIdInner: '', // 看板id=dashboardId,原写作chart,由set_data获取
chartName: '',
firstLoad: false, // 是否第一次加载
divFirstShow: false,
@@ -1018,9 +1018,9 @@ export default {
delete option.yAxis.maxInterval
}
if (this.fromTopo) {
const panelTime = localStorage.getItem('panelTime') ? JSON.parse(localStorage.getItem('panelTime')) : ['', '']
if (panelTime[0]) {
const numInterval = new Date(panelTime[1]).getTime() - new Date(panelTime[0]).getTime()
const dashboardTime = localStorage.getItem('dashboardTime') ? JSON.parse(localStorage.getItem('dashboardTime')) : ['', '']
if (dashboardTime[0]) {
const numInterval = new Date(dashboardTime[1]).getTime() - new Date(dashboardTime[0]).getTime()
if (numInterval >= 60 * 60 * 1000) {
option.xAxis.minInterval = 20 * 60 * 1000
} else if (numInterval >= 30 * 60 * 1000 && numInterval < 60 * 60 * 1000) {
@@ -1460,7 +1460,7 @@ export default {
}
},
// 设置数据, filter区分
setData (chartItem, seriesItem, panelId, filter, legend, area, errorMsg) {
setData (chartItem, seriesItem, dashboardId, filter, legend, area, errorMsg) {
legend && this.setColor(legend.length)
legend && legend.forEach((t, i) => { t.color = this.bgColorList[i] })
this.filter.from = filter.from
@@ -1486,7 +1486,7 @@ export default {
this.$refs['localLoading' + this.chartIndex].startLoading()
this.divFirstShow = true
this.firstShow = true // 展示操作按键
this.panelIdInner = panelId
this.panelIdInner = dashboardId
this.data = chartItem
this.seriesItem = seriesItem
this.seriesItemScreen = seriesItem
@@ -2125,9 +2125,9 @@ export default {
let minInterval = ''
let splitNumber = ''
if (this.fromTopo) {
const panelTime = localStorage.getItem('panelTime') ? JSON.parse(localStorage.getItem('panelTime')) : ['', '']
if (panelTime[0]) {
const numInterval = new Date(panelTime[1]).getTime() - new Date(panelTime[0]).getTime()
const dashboardTime = localStorage.getItem('dashboardTime') ? JSON.parse(localStorage.getItem('dashboardTime')) : ['', '']
if (dashboardTime[0]) {
const numInterval = new Date(dashboardTime[1]).getTime() - new Date(dashboardTime[0]).getTime()
if (numInterval >= 60 * 60 * 1000) {
minInterval = 20 * 60 * 1000
} else if (numInterval >= 30 * 60 * 1000 && numInterval < 60 * 60 * 1000) {

View File

@@ -107,7 +107,7 @@ export default {
name: 'chartList',
props: {
// TODO isModel
panelId: {},
dashboardId: {},
chartDetailInfo: Object,
timeRange: Array, // 时间范围
isGroup: Boolean,
@@ -231,7 +231,7 @@ export default {
findItem.h = newH
// bus.$emit('groupMove', this.copyDataList, this.groupInfo)
}
this.$put('/visual/panel/chart/modify', {
this.$put('/visual/dashboard/chart/modify', {
id: i,
span: newW,
height: newH
@@ -338,11 +338,11 @@ export default {
}
})
const params = {
panelId: this.panelId,
dashboardId: this.dashboardId,
charts: charts
}
if (charts && charts.length) {
this.$put('/visual/panel/chart/weights', params).then(() => {
this.$put('/visual/dashboard/chart/weights', params).then(() => {
const position = getLayoutPosition(this.copyDataList)
this.$store.commit('setChartLastPosition', position)
})
@@ -480,11 +480,11 @@ export default {
}
})
const chartParams = {
panelId: this.panelId,
dashboardId: this.dashboardId,
charts: charts
}
if (charts && charts.length) {
this.$put('/visual/panel/chart/weights', chartParams).then(() => {
this.$put('/visual/dashboard/chart/weights', chartParams).then(() => {
if (params.cb) {
params.cb()
}

View File

@@ -3,7 +3,7 @@ const data = {
loaded: true,
showHeader: true,
name: '',
panelId: 1244,
dashboardId: 1244,
groupId: 0,
span: 4,
height: 4,
@@ -54,7 +54,7 @@ const data = {
}
],
sync: null,
panel: {
dashboard: {
id: 1244,
name: 'testnodata',
createBy: null,
@@ -71,7 +71,7 @@ const data = {
group: {
id: 0,
name: null,
panelId: null,
dashboardId: null,
groupId: null,
span: null,
height: null,
@@ -89,7 +89,7 @@ const data = {
y: null,
elements: null,
sync: null,
panel: null,
dashboard: null,
group: null,
children: null,
chartNums: null,

View File

@@ -3,7 +3,7 @@ const data = {
loaded: true,
showHeader: true,
name: '',
panelId: 1244,
dashboardId: 1244,
groupId: 0,
span: 4,
height: 4,
@@ -42,7 +42,7 @@ const data = {
y: 12,
elements: [],
sync: null,
panel: {
dashboard: {
id: 1244,
name: 'testnodata',
createBy: null,
@@ -59,7 +59,7 @@ const data = {
group: {
id: 0,
name: null,
panelId: null,
dashboardId: null,
groupId: null,
span: null,
height: null,
@@ -77,7 +77,7 @@ const data = {
y: null,
elements: null,
sync: null,
panel: null,
dashboard: null,
group: null,
children: null,
chartNums: null,

View File

@@ -2,7 +2,7 @@ const TableData = {
id: 697356,
name: 'Table',
loaded: true,
panelId: 1479,
dashboardId: 1479,
groupId: 0,
span: 4.0,
height: 3.0,
@@ -41,7 +41,7 @@ const TableData = {
y: 10.0,
elements: [],
sync: null,
panel: {
dashboard: {
id: 1479,
name: 'Chart Component Configuration Test',
createBy: null,
@@ -58,7 +58,7 @@ const TableData = {
group: {
id: 0,
name: null,
panelId: null,
dashboardId: null,
groupId: null,
span: null,
height: null,
@@ -76,7 +76,7 @@ const TableData = {
y: null,
elements: null,
sync: null,
panel: null,
dashboard: null,
group: null,
children: null,
chartNums: null,

View File

@@ -359,8 +359,8 @@ export default {
}
// assetInfo or endpointInfo
let linkId = ''
if (this.from == 'panel') {
linkId = this.chartInfo.panel.link
if (this.from == 'dashboard') {
linkId = this.chartInfo.varId
} else {
linkId = this.chartDetailInfo.id
}
@@ -718,7 +718,7 @@ export default {
},
chartSync () {
this.loading = true
this.$post('visual/panel/chart/syncTmpl', { ids: [this.chartInfo.id] }).then(res => {
this.$post('visual/dashboard/chart/syncTmpl', { ids: [this.chartInfo.id] }).then(res => {
if (res.code === 200) {
this.$message.success(this.$t('tip.syncSuccess'))
this.$emit('refreshPanel')

View File

@@ -1,7 +1,7 @@
const group = {
id: -2,
name: 'groupTemp',
panelId: 1346,
dashboardId: 1346,
groupId: 0,
span: 12,
height: 1,
@@ -21,9 +21,9 @@ const group = {
y: 0,
elements: null,
sync: null,
panel: {
dashboard: {
id: 1346,
name: 'panel-newChart',
name: 'dashboard-newChart',
createBy: null,
type: null,
link: null,
@@ -38,7 +38,7 @@ const group = {
group: {
id: 0,
name: null,
panelId: null,
dashboardId: null,
groupId: null,
span: null,
height: null,
@@ -56,7 +56,7 @@ const group = {
y: null,
elements: null,
sync: null,
panel: null,
dashboard: null,
group: null,
children: null,
chartNums: null,

View File

@@ -673,9 +673,9 @@ export default {
})
})
}
const panelTime = localStorage.getItem('panelTime') ? JSON.parse(localStorage.getItem('panelTime')) : ['', '']
const endTime = panelTime[1] || this.filterTime[1]
const startTime = panelTime[0] || this.filterTime[0]
const dashboardTime = localStorage.getItem('dashboardTime') ? JSON.parse(localStorage.getItem('dashboardTime')) : ['', '']
const endTime = dashboardTime[1] || this.filterTime[1]
const startTime = dashboardTime[0] || this.filterTime[0]
const step = bus.getStep(startTime, endTime)
data.pens && data.pens.forEach((item, index) => {
this.chartGetData.push({ id: item.id, res: [] })

View File

@@ -23,8 +23,6 @@
<alertMessageTabNew v-if="from === fromRoute.dc && targetTab === 'alertMessageTab'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.dc.alertMessage" @changeTab="changeTab" :targetTab.sync="targetTab"></alertMessageTabNew>
<!--告警信息-->
<alert-message-tab v-if="((from === fromRoute.alertRule || from === fromRoute.asset || from === fromRoute.endpoint || from === fromRoute.project ) && targetTab === 'alertMessage')" v-show="subResizeShow" :from="from" :obj="obj" @changeTab="changeTab" :targetTab.sync="targetTab"></alert-message-tab>
<!--asset页的endpoint列表-->
<endpoint-tab v-if="from === fromRoute.asset && targetTab === fromRoute.endpoint" v-show="subResizeShow" :from="from" :obj="obj" @changeTab="changeTab" :targetTab.sync="targetTab"></endpoint-tab>
<!--terminal-log的记录和回放-->
<terminal-log-cmd-tab v-if="from === fromRoute.terminalLog && targetTab === 'cmdTab'" :from="from" :obj="obj" :tabs="hasTerminalLogTabs" @changeTab="changeTab" :targetTab.sync="targetTab"></terminal-log-cmd-tab>
@@ -38,7 +36,7 @@
<operation-log-tab v-if="from === fromRoute.user && targetTab === 'operationLogTab'" :from="from" :obj="obj" :tabs="tabs.user.operationLog" @changeTab="changeTab" :targetTab.sync="targetTab"></operation-log-tab>
<terminal-log-tab v-if="from === fromRoute.user && targetTab === 'terminalLogTab'" :from="from" :obj="obj" :tabs="tabs.user.terminalLog" @changeTab="changeTab" :targetTab.sync="targetTab"></terminal-log-tab>
<!-- asset列表的3个 -->
<panel-tab-new @exit="closeSubList" @getTableData="getTableData" :paramsType="'asset'" v-if="from === fromRoute.asset && targetTab === 'panelTab'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="assetTabs" :targetTab.sync="targetTab" @changeTab="changeTab"></panel-tab-new>
<dashboard-tab @exit="closeSubList" @getTableData="getTableData" :paramsType="'asset'" v-if="from === fromRoute.asset && targetTab === 'dashboardTab'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="assetTabs" :targetTab.sync="targetTab" @changeTab="changeTab"></dashboard-tab>
<alertMessageTabNew v-if="from === fromRoute.asset && targetTab === 'alertMessageTab'" v-show="subResizeShow" :sign="sign+'alert'" :from="from" :obj="obj" :tabs="assetTabs" :targetTab.sync="targetTab" @changeTab="changeTab" ></alertMessageTabNew>
<endpointTabNew v-if="from === fromRoute.asset && targetTab === 'endpointTab'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="assetTabs" :targetTab.sync="targetTab" @changeTab="changeTab"></endpointTabNew>
<log-bottom-tab v-if="from === fromRoute.asset && targetTab === 'log'" v-show="subResizeShow" :sign="sign+'log'" :from="from" :obj="obj" :tabs="assetTabs" :targetTab.sync="targetTab" @changeTab="changeTab"></log-bottom-tab>
@@ -50,16 +48,16 @@
<!--module列表的tab-->
<endpointTabNew v-if="from === fromRoute.module && targetTab === 'endpoint'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.module.moduleTabTitle" :targetTab="targetTab" @changeTab="changeTab"></endpointTabNew>
<alertMessageTabNew v-if="from === fromRoute.module && targetTab === 'moduleAlertMessage'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.module.moduleTabTitle" @changeTab="changeTab" :targetTab="targetTab"></alertMessageTabNew>
<panel-tab-new @exit="closeSubList" @getTableData="getTableData" :paramsType="'module'" v-if="from === fromRoute.module && targetTab === 'panel'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.module.moduleTabTitle" :targetTab.sync="targetTab" @changeTab="changeTab"></panel-tab-new>
<dashboard-tab @exit="closeSubList" @getTableData="getTableData" :paramsType="'module'" v-if="from === fromRoute.module && targetTab === 'dashboardTab'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.module.moduleTabTitle" :targetTab.sync="targetTab" @changeTab="changeTab"></dashboard-tab>
<!--endpoint列表的tab-->
<panel-tab-new @exit="closeSubList" v-if="from === fromRoute.endpoint && targetTab === 'panelTab'" v-show="subResizeShow" :from="from" :obj="obj" :paramsType="'endpoint'" :tabs="endpointTabs" :targetTab.sync="targetTab" @changeTab="changeTab" @getTableData="getTableData"></panel-tab-new>
<dashboard-tab @exit="closeSubList" v-if="from === fromRoute.endpoint && targetTab === 'dashboardTab'" v-show="subResizeShow" :from="from" :obj="obj" :paramsType="'endpoint'" :tabs="endpointTabs" :targetTab.sync="targetTab" @changeTab="changeTab" @getTableData="getTableData"></dashboard-tab>
<endpointQuery v-if="from === fromRoute.endpoint && targetTab === 'Metrics'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="endpointTabs" :targetTab.sync="targetTab" @changeTab="changeTab"></endpointQuery>
<log-bottom-tab v-if="from === fromRoute.endpoint && targetTab === 'log' && hasLogConfig" :sign="sign+'log'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="endpointTabs" :targetTab.sync="targetTab" @changeTab="changeTab"></log-bottom-tab>
<alertMessageTabNew v-if="from === fromRoute.endpoint && targetTab === 'endpointAlertMessage'" :sign="sign+'alert'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="endpointTabs" :targetTab.sync="targetTab" @changeTab="changeTab"></alertMessageTabNew>
<!--chartTemp的Tab-->
<panel-tab-new @exit="closeSubList" @getTableData="getTableData" :paramsType="'template'" v-if="from === fromRoute.chartTemp && targetTab === 'panel'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.chartTemp.chartTempTabTitle" :targetTab.sync="targetTab" @changeTab="changeTab"></panel-tab-new>
<dashboard-tab @exit="closeSubList" @getTableData="getTableData" :paramsType="'template'" v-if="from === fromRoute.chartTemp && targetTab === 'dashboardTab'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.chartTemp.chartTempTabTitle" :targetTab.sync="targetTab" @changeTab="changeTab"></dashboard-tab>
<!--dashboardTemp的Tab-->
<panel-tab-new @exit="closeSubList" @getTableData="getTableData" :paramsType="'template'" v-if="from === fromRoute.dashboardTemp && targetTab === 'panel'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.dashboardTemp.dashboardTempTabTitle" :targetTab.sync="targetTab" @changeTab="changeTab"></panel-tab-new>
<dashboard-tab @exit="closeSubList" @getTableData="getTableData" :paramsType="'template'" v-if="from === fromRoute.dashboardTemp && targetTab === 'dashboardTab'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.dashboardTemp.dashboardTempTabTitle" :targetTab.sync="targetTab" @changeTab="changeTab"></dashboard-tab>
<!--alertRule Tab-->
<alertMessageTabNew v-if="from === fromRoute.alertRule && targetTab === 'alertRuleAlertMessage'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.alertRule.alertRule" @changeTab="changeTab" :targetTab.sync="targetTab"></alertMessageTabNew>
<alertRuleEvalLog v-if="from === fromRoute.alertRule && targetTab === 'evalLog'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.alertRule.alertRule" @changeTab="changeTab" :targetTab.sync="targetTab"></alertRuleEvalLog>
@@ -94,9 +92,8 @@ import commentsBottomTab from './tabs/commentsBottomTab'
import vsysBottomTab from './tabs/vsysBottomTab'
import endpointQuery from './tabs/endpointQuery'
import recordRulesQuery from './tabs/recordRulesQuery'
import endpointTab from './tabs/endpointTab'
import endpointTabNew from './tabs/endpointTabNew'
import panelTabNew from './tabs/panelTabNew'
import dashboardTab from './tabs/dashboardTab'
import terminalLogRecordTab from './tabs/terminalLogRecordTab'
import terminalLogSftpTab from './tabs/terminalLogSftpTab'
import terminalLogMonitorTab from './tabs/terminalLogMonitorTab'
@@ -127,7 +124,6 @@ export default {
networkBottomTab,
cabinetTab,
alertMessageTab,
endpointTab,
terminalLogRecordTab,
terminalLogSftpTab,
terminalLogMonitorTab,
@@ -137,7 +133,7 @@ export default {
endpointTabNew,
alertMessageTabNew,
endpointQuery,
panelTabNew,
dashboardTab,
assetTab,
assetSubTab,
alertRuleEvalLog,
@@ -194,7 +190,7 @@ export default {
},
asset: {
assetTabTitle: [
{ prop: 'panelTab', name: this.$t('overall.dashboard') },
{ prop: 'dashboardTab', name: this.$t('overall.dashboard') },
{ prop: 'alertMessageTab', name: this.$t('overall.alert') },
{ prop: 'endpointTab', name: this.$t('asset.endpoint') },
{ prop: 'log', name: this.$t('dashboard.panel.chartForm.typeVal.log.label') }
@@ -202,14 +198,13 @@ export default {
},
module: {
moduleTabTitle: [
// { prop: 'panel', name: 'Detail' },
{ prop: 'endpoint', name: this.$t('asset.endpoint') },
{ prop: 'moduleAlertMessage', name: this.$t('overall.alert') }
]
},
endpoint: {
endpointTabTitle: [
{ prop: 'panelTab', name: this.$t('overall.dashboard') },
{ prop: 'dashboardTab', name: this.$t('overall.dashboard') },
{ prop: 'endpointAlertMessage', name: this.$t('overall.alert') },
{ prop: 'Metrics', name: this.$t('overall.metric') },
{ prop: 'log', name: this.$t('dashboard.panel.chartForm.typeVal.log.label') }
@@ -217,12 +212,12 @@ export default {
},
chartTemp: {
chartTempTabTitle: [
{ prop: 'panel', name: this.$t('overall.tempPrev') }
{ prop: 'dashboardTab', name: this.$t('overall.tempPrev') }
]
},
dashboardTemp: {
dashboardTempTabTitle: [
{ prop: 'panel', name: this.$t('overall.dashboardTemp') }
{ prop: 'dashboardTab', name: this.$t('overall.dashboardTemp') }
]
},
alertRule: {
@@ -311,7 +306,7 @@ export default {
const hasProcess = this.obj && this.obj.clientState == '1'
const hasVays = this.obj && this.obj.model && this.obj.model.tsgAppliance == '1'
const tabs = [
{ prop: 'panelTab', name: this.$t('overall.dashboard') },
{ prop: 'dashboardTab', name: this.$t('overall.dashboard') },
{ prop: 'alertMessageTab', name: this.$t('overall.alert') },
{ prop: 'endpointTab', name: this.$t('asset.endpoint') },
{ prop: 'log', name: this.$t('dashboard.panel.chartForm.typeVal.log.label') }
@@ -332,7 +327,7 @@ export default {
const config = this.obj.configs.find(c => c.type === 'logs')
const hasLog = config && config.enable === 1
const tabs = [
{ prop: 'panelTab', name: this.$t('overall.dashboard') },
{ prop: 'dashboardTab', name: this.$t('overall.dashboard') },
{ prop: 'endpointAlertMessage', name: this.$t('overall.alert') },
{ prop: 'Metrics', name: this.$t('overall.metric') }
]

View File

@@ -99,8 +99,8 @@ export default {
subContentClass () {
const className = []
switch (this.targetTab) {
case 'panelTab':
className.push('nz-table-list bottom-panel')
case 'dashboardTab':
className.push('nz-table-list bottom-dashboard')
break
case 'log': {
className.push('bottom-log')

View File

@@ -11,10 +11,10 @@
<template v-if="from == $CONSTANTS.fromRoute.asset">{{obj.host}}</template>
<template v-if="from == $CONSTANTS.fromRoute.rule">{{obj.alertName}}</template>
<template v-if="from == $CONSTANTS.fromRoute.endpoint"><div class="sub-list-tab-title">{{$t("project.endpoint.endpointId")}}: {{obj ? obj.id : ''}}</div></template>
</div><div :id="from+'-change-panelordetail'"
@click="changeTab(from == $CONSTANTS.fromRoute.asset || from == $CONSTANTS.fromRoute.rule || from == $CONSTANTS.fromRoute.endpoint? 'panel' : 'detail')" class="sub-list-tab">{{$t("overall.detail")}}</div><div
class="sub-list-tab sub-list-tab-active">{{$t("alert.alertMessage")}}</div><div v-if="from == $CONSTANTS.fromRoute.asset" :id="from+'-change-modules'"
@click="changeTab('endpoint')" class="sub-list-tab" v-has="'asset_endpoint_view'">{{$t("asset.endpoint")}}</div>
</div>
<div :id="from+'-change-panelordetail'" @click="changeTab(from == $CONSTANTS.fromRoute.asset || from == $CONSTANTS.fromRoute.rule || from == $CONSTANTS.fromRoute.endpoint? 'dashboard' : 'detail')" class="sub-list-tab">{{$t("overall.detail")}}</div>
<div class="sub-list-tab sub-list-tab-active">{{$t("alert.alertMessage")}}</div>
<div v-if="from == $CONSTANTS.fromRoute.asset" :id="from+'-change-modules'" @click="changeTab('endpoint')" class="sub-list-tab" v-has="'asset_endpoint_view'">{{$t("asset.endpoint")}}</div>
<div @click="changeTab('endpointQuery')" class="sub-list-tab" v-has="'project_endpoint_query_chart_view'" v-if="from == $CONSTANTS.fromRoute.endpoint" :id="from+'-change-endpoint'">{{$t("overall.query")}}</div>
</div>
<div class="top-tool-right">

View File

@@ -1,5 +1,5 @@
<template>
<div class="full-width-height chart-list panel-tab-new asset-detail" v-my-loading="panelTabLoading">
<div class="full-width-height chart-list dashboard-tab asset-detail" v-my-loading="dashboardLoading">
<nz-bottom-data-list
:showTitle='showTitle'
:obj='obj'
@@ -15,7 +15,7 @@
<template v-slot:top-tool-right>
<!-- asset -->
<div v-if="from === fromRoute.asset" style="display: flex">
<pick-time ref="pickTime" v-model="searchTime" :refresh-data-func="dateChange" :use-chart-unit="false" :sign="'panel' + obj.id"></pick-time>
<pick-time ref="pickTime" v-model="searchTime" :refresh-data-func="dateChange" :use-chart-unit="false" :sign="'dashboard' + obj.id"></pick-time>
<button id="panel-add-chart" v-has="'main_add'" :title="$t('overall.createChart')" class="top-tool-btn margin-r-10" type="button" @click="addChartBefore">
<i class="nz-icon-create-square nz-icon"></i>
</button>
@@ -28,8 +28,8 @@
:permissions="{import: 'main_add', export: 'main_edit'}"
class="top-tool-export margin-r-10"
export-file-name="asset-charts"
export-url="/visual/panel/export"
import-url="/visual/panel/import"
export-url="/visual/dashboard/export"
import-url="/visual/dashboard/import"
@afterImport="getTableData"
:link="obj"
:showLock="from === fromRoute.asset"
@@ -44,7 +44,7 @@
<el-dropdown-item v-has="'main_edit'">
<div id="chart-temp-sync" @click="chartBySync"><i class="nz-icon nz-icon-sync"></i>{{ $t('overall.syncChart') }}</div>
</el-dropdown-item> -->
<el-dropdown-item v-has="'panel_view'">
<el-dropdown-item v-has="'dashboard_view'">
<div id="chart-export-html" @click="exportType"><i class="nz-icon nz-icon-kuaizhao"></i>{{ $t('overall.snapshoot') }}</div>
</el-dropdown-item>
</template>
@@ -52,7 +52,7 @@
</div>
<!-- endpoint -->
<div v-else-if="from === fromRoute.endpoint" style="display: flex">
<pick-time ref="pickTime" v-model="searchTime" :refresh-data-func="dateChange" :use-chart-unit="false" :sign="'panel' + obj.id"></pick-time>
<pick-time ref="pickTime" v-model="searchTime" :refresh-data-func="dateChange" :use-chart-unit="false" :sign="'dashboard' + obj.id"></pick-time>
<button id="endpoint-create-chart" v-has="'main_add'" :title="$t('overall.createChart')" class="top-tool-btn margin-r-10" @click.stop="addChartBefore">
<i class="nz-icon nz-icon-create-square"></i>
</button>
@@ -67,8 +67,8 @@
:showLock="from === fromRoute.endpoint"
class="top-tool-export margin-r-10"
export-file-name="endpoint-charts"
export-url="/visual/panel/export"
import-url="/visual/panel/import"
export-url="/visual/dashboard/export"
import-url="/visual/dashboard/import"
@afterImport="getTableData"
:exportBoxShow="true"
@export="exportType"
@@ -81,7 +81,7 @@
<el-dropdown-item v-has="'main_edit'">
<div id="chart-temp-sync" @click="chartBySync"><i class="nz-icon nz-icon-sync"></i>{{ $t('overall.syncChart') }}</div>
</el-dropdown-item> -->
<el-dropdown-item v-has="'panel_view'">
<el-dropdown-item v-has="'dashboard_view'">
<div id="chart-export-html" @click="exportType"><i class="nz-icon nz-icon-kuaizhao"></i>{{ $t('overall.snapshoot') }}</div>
</el-dropdown-item>
</template>
@@ -117,7 +117,7 @@
<chart-list
ref="chartList"
name="panel"
:panelId="showPanel.id"
:dashboardId="showPanel.id"
:class="{'show-top':showTopBtn}"
:data-list="dataList"
:nowTimeType="nowTimeType"
@@ -183,7 +183,7 @@ import panelVariables from '@/components/common/panel/panelVariables'
import snapshotProgress from '@/components/common/snapshotProgress/snapshotProgress.vue'
export default {
name: 'panelTabNew',
name: 'dashboardTab',
mixins: [subDataListMixin, detailViewRightMixin, htmlToPdfMixin, exportHtmlMixin],
props: {
from: String,
@@ -209,10 +209,10 @@ export default {
data () {
return {
fromRoute,
tableId: 'panelTabNew',
tableId: 'dashboardTab',
pdfId: 'pdfDom',
htmlTitle: 'panel',
panelTabLoading: false,
htmlTitle: 'dashboard',
dashboardLoading: false,
showTopBtn: false, // top
visible: false,
chartListLoading: true,
@@ -286,7 +286,7 @@ export default {
// searchName: '', //
filter: { //
// productId: 0,
panelId: 0,
dashboardId: 0,
start_time: '',
end_time: '',
searchName: ''
@@ -299,7 +299,7 @@ export default {
blankChartTemp: {
varType: 1,
pid: '',
panelId: null,
dashboardId: null,
varIds: []
},
// removeModal: false, //
@@ -344,10 +344,10 @@ export default {
this.getTableData(clearShowPanel)
},
panelReloadOnlyPanel () { // panel
if (!this.hasButton('panel_view')) {
if (!this.hasButton('dashboard_view')) {
return
}
this.$get('visual/panel?pageSize=-1').then(response => {
this.$get('visual/dashboard?pageSize=-1').then(response => {
if (response.code === 200) {
this.panelData = response.data.list
for (let i = 0; i < this.panelData.length; i++) {
@@ -363,7 +363,7 @@ export default {
addChart () {
this.chart = this.newChart()
this.chart.param.thresholds = [{ value: undefined, color: randomcolor() }]
this.chart.panelId = this.showPanel.id
this.chart.dashboardId = this.showPanel.id
this.chart.panelName = this.showPanel.name
this.$nextTick(() => {
this.$refs.addChartModal.isStable = 'stable'
@@ -371,7 +371,7 @@ export default {
},
addChartByTemp () {
this.chart = JSON.parse(JSON.stringify(this.blankChartTemp))
this.chart.panelId = this.showPanel.id
this.chart.dashboardId = this.showPanel.id
if (this.from === fromRoute.endpoint) {
this.chart.varType = 2
}
@@ -396,7 +396,7 @@ export default {
if (refresh) {
this.refresh()
if (this.from === fromRoute.chartTemp) {
this.$get('/visual/panel/chart', { ids: this.obj.id }).then(res => {
this.$get('/visual/dashboard/chart', { ids: this.obj.id }).then(res => {
res.data.list.forEach(item => {
if (!item.children) {
item.children = []
@@ -404,7 +404,7 @@ export default {
})
this.panelDataList = res.data.list
if (this.panelDataList.length > 0) {
this.showPanel.id = this.filter.panelId = 0
this.showPanel.id = this.filter.dashboardId = 0
this.getData(this.filter)
} else {
this.chartListLoading = false
@@ -422,7 +422,7 @@ export default {
this.chart = JSON.parse(JSON.stringify(data))
this.chart.x = 0
this.chart.y = 0
this.chart.panelId = this.showPanel.id
this.chart.dashboardId = this.showPanel.id
this.chart.panelName = this.showPanel.name
this.chart.id = ''
this.chart.elements.forEach((item) => {
@@ -438,12 +438,12 @@ export default {
}
} else {
this.rightBox.loading = true
this.$get('visual/panel/chart/' + data.id).then(res => {
this.$get('visual/dashboard/chart/' + data.id).then(res => {
this.rightBox.loading = false
if (res.code === 200) {
const chartData = res.data
this.chart = JSON.parse(JSON.stringify(chartData))
this.chart.panelId = this.showPanel.id
this.chart.dashboardId = this.showPanel.id
this.chart.panelName = this.showPanel.name
this.chart.param = JSON.parse(this.chart.param)
if (!this.chart.groupId || this.chart.groupId == -1) {
@@ -474,7 +474,7 @@ export default {
cancelButtonText: this.$t('tip.no'),
type: 'warning'
}).then(() => {
this.$delete('visual/panel/chart?ids=' + data.id).then(response => {
this.$delete('visual/dashboard/chart?ids=' + data.id).then(response => {
if (response.code === 200) {
this.$message({
duration: 2000,
@@ -494,7 +494,7 @@ export default {
addGroupItem (groupId) {
this.chart = this.newChart()
this.chart.groupId = groupId
this.chart.panelId = this.showPanel.id
this.chart.dashboardId = this.showPanel.id
this.chart.panelName = this.showPanel.name
this.chart.isGroup = true
this.rightBox.chart.show = true
@@ -508,7 +508,7 @@ export default {
},
// ,
getData (params) {
if (!this.hasButton('panel_view')) {
if (!this.hasButton('dashboard_view')) {
return
}
this.chartListLoading = true
@@ -521,7 +521,7 @@ export default {
params.from = this.from
}
if (this.from !== 'chartTemp') {
this.$get('visual/panel/chart?panelId=' + params.panelId + '&groupId=0' + '&pageSize=-1').then(response => {
this.$get('visual/dashboard/chart?dashboardId=' + params.dashboardId + '&groupId=0' + '&pageSize=-1').then(response => {
if (response.code === 200) {
this.chartListLoading = false
this.dataList = response.data.list.map(item => {
@@ -550,7 +550,7 @@ export default {
this.setSearchTime(nowTimeType.type, nowTimeType.value)
this.filter.start_time = bus.timeFormate(this.searchTime[0])
this.filter.end_time = bus.timeFormate(this.searchTime[1])
this.filter.panelId = this.showPanel.id
this.filter.dashboardId = this.showPanel.id
this.getData(this.filter)
this.$store.dispatch('dispatchPanelTime', {
time: this.searchTime,
@@ -596,10 +596,10 @@ export default {
if (this.from === this.fromRoute.chartTemp) {
this.variablesInit = true
if (this.obj.type === 'group') {
this.$get('/visual/panel/chart', { ids: this.obj.id }).then(res => {
this.$get('/visual/dashboard/chart', { ids: this.obj.id }).then(res => {
this.panelDataList = res.data.list
if (this.panelDataList.length > 0) {
this.showPanel.id = this.filter.panelId = 0
this.showPanel.id = this.filter.dashboardId = 0
this.getData(this.filter)
}
})
@@ -607,15 +607,15 @@ export default {
}
this.panelDataList = [this.obj]
if (this.panelDataList.length > 0) {
this.showPanel.id = this.filter.panelId = 0
this.showPanel.id = this.filter.dashboardId = 0
this.getData(this.filter)
}
} else if (this.from === this.fromRoute.dashboardTemp) {
this.$get('visual/panel', { type: 'template', ids: this.obj.id }).then(response => {
this.$get('visual/dashboard', { type: 'template', ids: this.obj.id }).then(response => {
if (response.code === 200) {
this.panelData = response.data.list
if (this.panelData.length > 0) {
this.filter.panelId = this.panelData[0].id
this.filter.dashboardId = this.panelData[0].id
this.showPanel = this.$loadsh.cloneDeep(this.panelData[0])
this.variables = this.$loadsh.get(this.panelData, '[0].param.variables')
this.getData(this.filter)
@@ -628,12 +628,12 @@ export default {
}
})
} else {
this.$get('visual/panel', { type: this.from, link: linkId || this.obj.id }).then(response => {
this.$get('visual/dashboard', { type: this.from, link: linkId || this.obj.id }).then(response => {
if (response.code === 200) {
this.panelData = response.data.list
if (this.panelData.length > 0) {
// this.showPanel.id = this.filter.panelId = this.panelData[0].id
this.filter.panelId = this.panelData[0].id
// this.showPanel.id = this.filter.dashboardId = this.panelData[0].id
this.filter.dashboardId = this.panelData[0].id
this.showPanel = this.$loadsh.cloneDeep(this.panelData[0])
this.variables = this.$loadsh.get(this.panelData, '[0].param.variables')
this.getData(this.filter)
@@ -780,7 +780,7 @@ export default {
this.$store.dispatch('dispatchHomeLoading', true)
const params = {}
params.tmplId = this.showPanel.id
this.$post('visual/panel/syncTmpl', params).then(res => {
this.$post('visual/dashboard/syncTmpl', params).then(res => {
this.$store.dispatch('dispatchHomeLoading', false)
if (res.code === 200) {
this.getTableData(this.obj.id)
@@ -918,7 +918,7 @@ export default {
}
}
},
// panelId
//
'showPanel.param.chartShare': {
handler (value) {
// tooltip

View File

@@ -45,7 +45,7 @@
<button @click="dropdownHandler(dropdownShow)" class="nz-btn nz-btn-size-normal nz-btn-style-light export-dropdown-btn" id="browser-go">
<i class="nz-icon nz-icon-arrow-down"></i>
<transition name="el-zoom-in-top">
<div v-if="dropdownShow" class="endpoint-query-dropdown el-popover" style="right: 11px;top: 33px;">
<div v-if="dropdownShow" class="endpoint-query-dropdown el-popover" style="right: 11px;top: 33px;z-index: 1000;">
<span style="padding-top: 2px">{{$t('project.endpoint.hideSameLabels')}}</span>
<el-switch v-model="hideSameLabels" size="small"></el-switch>
</div>

View File

@@ -106,7 +106,8 @@
</pl-table>
<button :class="{'to-top-is-hover': tools.tableHover}" @click="toTop(scrollbarWrap)" class="to-top" v-show="tools.showTopBtn" id="endpoint-list-totop" :title="$t('overall.backToTop')"><i class="nz-icon nz-icon-top"></i></button>
<el-dialog class="line-chart-block-modal nz-dialog endpoint-dialog"
<el-dialog
class="line-chart-block-modal nz-dialog endpoint-dialog"
:title="$t('project.endpoint.dialogTitle')"
:visible.sync="graphShow"
width="90%"
@@ -216,7 +217,7 @@ export default {
}
},
createSuccess (type, response, param, panel) {
this.$confirm(this.$t('dashboard.metric.goPanelTip'), this.$t('tip.saveSuccess'), {
this.$confirm(this.$t('dashboard.metric.goDashboardTip'), this.$t('tip.saveSuccess'), {
confirmButtonText: this.$t('tip.yes'),
cancelButtonText: this.$t('tip.no'),
type: 'success'
@@ -225,7 +226,7 @@ export default {
this.$store.state.showPanel.id = panel.id
this.$store.state.showPanel.name = panel.name
this.$router.push({
path: '/panel',
path: '/dashboard',
query: {
t: +new Date()
}

View File

@@ -1,563 +0,0 @@
<template>
<div style="height: 100%">
<div class="sub-top-tools">
<div class="sub-list-tabs" v-if="from===fromRoute.asset">
<div class="sub-list-tab-title">{{obj.host}}</div>
<div class="sub-list-tab" @click="changeTab('panel')" id="endpoint-tab-change-panel">{{$t("overall.detail")}}</div>
<div @click="changeTab('alertMessage')" class="sub-list-tab" v-has="'asset_alerts_view'" id="endpoint-tab-change-alertmsg">{{$t("alert.alertMessage")}}</div>
<div class="sub-list-tab sub-list-tab-active">{{$t("asset.endpoint")}}</div>
</div>
<div class="sub-list-tabs" v-if="from===fromRoute.module">
<div class="sub-list-tab-title">{{obj.name}}</div>
<div class="sub-list-tab sub-list-tab-active">{{$t("asset.endpoint")}}</div>
<div @click="changeTab('alertMessage')" class="sub-list-tab" id="endpoint-tab-change-alertmsg">{{$t("alert.alertMessage")}}</div>
</div>
<div class="top-tool-right">
<div class="top-tool-search">
<search-input :searchMsg="searchMsg" @search="search" position="endpoint-bottom"></search-input>
</div>
<export-excel
id="endpoint-sub-list"
export-file-name="endpoint"
export-url="/endpoint/export"
import-url="/endpoint/import"
:params="endpointSearchLabel"
:permissions="{import: 'monitor_endpoint_add', export: 'monitor_endpoint_edit'}"
@afterImport="getTableData"
class="margin-l-20"
>
<template slot="optionZone">
<button :title="$t('overall.createEndpoint')" @click.stop="add" class="nz-btn nz-btn-size-normal nz-btn-style-light" id="project-create-project" v-has="'asset_endpoint_toAdd'">
<i class="nz-icon nz-icon-create-square"></i>
</button>
</template>
</export-excel>
<delete-button
ref="deleteButton"
:single="false"
:from="'endpoint'"
:forceDeleteShow="false"
:delete-objs="batchDeleteObjs"
@after="getTableData"
api="endpoint"
v-has="'asset_endpoint_delete'"
id="endpoint-tab-batch-delete"></delete-button>
</div>
</div>
<!-- 自定义table列 -->
<transition name="el-zoom-in-top">
<element-set
id="endpoint-sub-list"
v-if="tools.showCustomTableTitle"
@close="tools.showCustomTableTitle = false"
:custom-table-title.sync="tools.customTableTitle"
:original-table-title="tableTitle"
ref="customTableTitle"
:path="'/projectBottom'"
></element-set>
</transition>
<el-table
id="endpoint-sub-list-table"
:data="tableData"
border
v-my-loading="tools.loading"
:loading="tools.loading"
class="nz-table endpoint-table"
:height="$tableHeight.noPagination"
:cell-class-name="messageStyle"
ref="endpointTable"
style="width: 100%;height: 100%"
@sort-change="tableDataSort"
@selection-change="(selection)=>{this.batchDeleteObjs=selection}"
>
<el-table-column
:resizable="false"
type="selection"
width="40"
align="center">
</el-table-column>
<el-table-column
:resizable="true"
v-for="(item, index) in tools.customTableTitle"
v-if="item.show"
:key="`col-${index}`"
:label="item.label"
:sortable="$tableSet.sortableShow(item.prop,'endpointTab')"
:prop="$tableSet.propTitle(item.prop,'endpointTab')"
:sort-orders="['ascending', 'descending']"
:min-width="item.minWidth || item.width"
>
<template slot-scope="scope" :column="item">
<span v-if="item.prop === 'asset' && scope.row[item.prop]" class="link">
{{scope.row[item.prop].sn}} :
({{scope.row[item.prop].host}})
</span>
<span v-else-if="item.prop === 'project' && scope.row[item.prop]">{{scope.row.project.name}}</span>
<span v-else-if="item.prop === 'module' && scope.row[item.prop]">{{scope.row.module.name}}</span>
<span v-else-if="item.prop === 'param'">
<template v-if="scope.row.paramObj">
<span v-for="(p, i) in scope.row.paramObj" :key="i">{{p.key}}={{p.value}}<span v-if="i < scope.row.paramObj.length-1"></span></span>
</template>
<template v-else>-</template>
</span>
<span v-else-if="item.prop === 'labels'">
<template v-if="scope.row.labelModule">
<span v-for="(p, i) in scope.row.labelModule" :key="i">{{p.key}}={{p.value}}<span v-if="i < scope.row.labelModule.length-1"></span></span>
</template>
<template v-else>-</template>
</span>
<template v-else-if="item.prop === 'type'">{{scope.row.module.type}}</template>
<div v-else-if="item.prop === 'option'">&nbsp;
<span
:id="'edp-edit-'+scope.row.id"
:title="$t('overall.edit')"
@click="editEndpoint(scope.row)"
class="content-right-option"
v-has="'asset_endpoint_toEdit'">
<i class="nz-icon nz-icon-edit"></i>
</span>
<span :id="'asset-del-'+scope.row.id" :title="$t('overall.delete')" @click.stop="delEndpoint(scope.row)" class="content-right-option" v-has="'asset_endpoint_delete'"><i class="nz-icon nz-icon-delete"></i></span>
</div>
<span v-else-if="item.prop === 'lastUpdate'">{{dateFormat(scope.row.lastUpdate)}}</span>
<span v-else-if="item.prop === 'state'" >
<el-popover placement="right" trigger="hover" :content="getStateContent(scope.row)" popper-class="small-pop">
<div slot="reference" style="width: 20px">
<div :class="{'active-icon green':scope.row.state == '1','active-icon red':scope.row.state == '0', 'active-icon gray':scope.row.state == '2'}"></div>
</div>
</el-popover>
</span>
<template v-else-if="item.prop === 'alerts'">
<el-tooltip :content="scope.row.alertNum+' '+$t('overall.active')" placement="top" effect="light" :disabled=" scope.row.alertNum < 99">
<span :id="'endpoint-alerts-'+scope.row.id" >
{{(scope.row.alertNum < 99 ? scope.row.alertNum : 99)}}
<sup class="linkSup" v-if="scope.row.alertNum > 99">+</sup>
{{' ' + $t('overall.active')}}
</span>
</el-tooltip>
</template>
<span v-else-if="scope.row[item.prop]">{{scope.row[item.prop]}}</span>
<template v-else>-</template>
</template>
</el-table-column>
<el-table-column width="28" :resizable="false">
<template slot="header">
<span @mousedown.stop="!tools.showCustomTableTitle && (tools.showCustomTableTitle = true)" class="nz-table-gear" :title="$t('overall.selectColumns')">
<i class="nz-icon nz-icon-gear"></i>
</span>
</template>
<template v-slot="scope">
<button v-if="scope.$index == 0" class="to-top" :style="{top: tools.toTopBtnTop}" :class="{'to-top-is-hover': tools.tableHover}" v-show="tools.showTopBtn" @click="$toTop('ps', 1)" :title="$t('overall.backToTop')"><i class="nz-icon nz-icon-top"></i></button>
</template>
</el-table-column>
</el-table>
<transition name="right-box">
<add-endpoint-box v-if="rightBox.add.show" :current-project="currentProject" :current-module="currentModule" @close="closeRightBox" ref="addEndpointBox"></add-endpoint-box>
</transition>
<transition name="right-box">
<edit-endpoint-box v-if="rightBox.edit.show" :current-project="currentProject" :current-module="currentModule" :endpoint="endpoint" @close="closeRightBox" ref="editEndpointBox"></edit-endpoint-box>
</transition>
<transition name="right-box">
<edit-endpoint-box v-if="rightBox.editEndpoint.show" :project="currentProject" :module="currentModule" :endpoint="endpoint" @close="closeEditEndpointRightBox" ref="editEndpointBox"></edit-endpoint-box>
</transition>
</div>
</template>
<script>
import exportXLSX from '../../exportXLSX'
import bus from '@/libs/bus'
import deleteButton from '../../deleteButton'
import { fromRoute } from '@/components/common/js/constants'
import detailViewRightMixin from '@/components/common/mixin/detailViewRightMixin'
export default {
name: 'endpointTab',
components: {
'export-excel': exportXLSX,
'delete-button': deleteButton
},
props: {
obj: Object, // 关联的实体对象
from: { type: String }
},
mixin: [detailViewRightMixin],
data () {
return {
fromRoute: fromRoute,
rightBox: {
add: { show: false },
edit: { show: false },
editEndpoint: { show: false }
},
/* 工具参数 */
tools: {
loading: false, // 是否显示table加载动画
toTopBtnTop: this.$tableHeight.toTopBtnTop, // to-top按钮的top属性
tableHover: false, // 控制滚动条和top按钮同时出现
showTopBtn: false, // 显示To top按钮
showCustomTableTitle: false, // 自定义列弹框是否显示
customTableTitle: [] // 自定义列工具的数据
},
batchDeleteObjs: [],
endpoint: {}, // 用来查看详情和编辑的对象
tableTitle: [
{
label: this.$t('project.endpoint.endpointId'),
prop: 'id',
show: true
}, {
label: this.$t('project.project.projectName'),
prop: 'project',
show: true,
width: '120'
}, {
label: this.$t('project.module.module'),
prop: 'module',
show: true,
width: '120'
}, {
label: this.$t('asset.asset'),
prop: 'asset',
show: true,
minWidth: '400'
}, {
label: this.$t('asset.host'),
prop: 'host',
show: true,
width: 120
}, {
label: this.$t('asset.port'),
prop: 'port',
show: true,
width: '120'
}, {
label: this.$t('overall.type'),
prop: 'type',
show: false,
width: 120
}, {
label: this.$t('alert.list.labels'),
prop: 'labels',
show: true,
width: 200
}, {
label: this.$t('config.assetLabel.params'),
prop: 'param',
show: true,
width: 200
}, {
label: this.$t('config.terminallog.path'),
prop: 'path',
show: true,
width: 200
}, {
label: this.$t('overall.state'),
prop: 'state',
show: true,
width: '80'
}, {
label: this.$t('overall.alert'),
prop: 'alerts',
show: true,
width: 180
},
/* {
label: this.$t("project.endpoint.lastUpdate"),
prop: 'lastUpdate',
show: true,
}, */
{
label: this.$t('config.account.option'),
prop: 'option',
show: true,
width: 120
}
],
tablelable: [],
dropCol: [],
currentProject: { id: '', name: '', remark: '' }, // endpoint弹框、module列表用来回显project
currentModule: { id: '', name: '', project: {}, port: '', path: '', param: '', paramObj: [] }, // endpoint弹框用来回显module
searchMsg: { // 给搜索框子组件传递的信息
zheze_none: true,
searchLabelList: [{
id: 1,
name: 'ID',
type: 'input',
label: 'id',
disabled: false
}, {
id: 11,
name: this.$t('asset.asset'),
type: 'query',
label: 'query',
disabled: false
}, {
id: 33,
name: this.$t('overall.state'),
// name: this.$t('asset.asset'),
type: 'select',
label: 'endpointState',
disabled: false,
readonly: true
}, {
id: 34,
name: this.$t('project.project.projectName'),
// name: this.$t('asset.asset'),
type: 'input',
label: 'projectName',
disabled: false
}, {
id: 35,
name: this.$t('project.module.module'),
// name: this.$t('asset.asset'),
type: 'input',
label: 'moduleName',
disabled: false
}]
},
endpointSearchLabel: { // 搜索参数
},
tableData: []
}
},
methods: {
// 切换tab
changeTab (tab) {
this.$emit('changeTab', tab)
},
getTableData () {
this.tools.loading = true
if (this.from === fromRoute.asset) {
this.$set(this.endpointSearchLabel, 'assetId', this.asset.id)
} else if (this.from === fromRoute.module) {
this.$set(this.endpointSearchLabel, 'moduleIds', this.module.id)
}
this.$set(this.endpointSearchLabel, 'pageSize', '-1')
this.tools.loading = true
this.$get('monitor/endpoint', this.endpointSearchLabel).then(response => {
this.tools.loading = false
if (response.code === 200) {
for (let i = 0; i < response.data.list.length; i++) {
try {
const param = response.data.list[i].param || '{}'
const tempObj = JSON.parse(param)
response.data.list[i].paramObj = []
const labels = response.data.list[i].labels || '{}'
const tempObj1 = JSON.parse(labels)
response.data.list[i].labelModule = []
for (const k in tempObj) {
response.data.list[i].paramObj.push({ key: k, value: tempObj[k] })
}
for (const k in tempObj1) {
response.data.list[i].labelModule.push({ key: k, value: tempObj1[k] })
}
} catch (err) {
// console.error(response.data.list[i], err);
}
}
this.tableData = response.data.list
this.$emit('reload')
}
})
},
closeRightBox (refresh) {
this.rightBox.add.show = false
this.rightBox.edit.show = false
if (refresh) {
this.getTableData()
}
},
delEndpoint (endpoint) {
this.$confirm(this.$t('tip.confirmDelete'), {
confirmButtonText: this.$t('tip.yes'),
cancelButtonText: this.$t('tip.no'),
type: 'warning'
}).then(() => {
this.$delete('endpoint?ids=' + endpoint.id).then(response => {
if (response.code === 200) {
this.$message({ duration: 1000, type: 'success', message: this.$t('tip.deleteSuccess') })
this.getTableData()
} else {
this.$message.error(response.msg)
}
})
})
},
toEdit (endpoint) {
this.endpoint = JSON.parse(JSON.stringify(endpoint))
if (!this.endpoint.paramObj) {
this.$set(this.endpoint, 'paramObj', [])
}
this.rightBox.edit = true
this.$nextTick(() => {
this.$refs.editEndpointBox.show(true)
this.$refs.editEndpointBox.toEdit(true, this.endpoint.id)
})
},
editEndpoint (endpoint) {
this.endpoint = JSON.parse(JSON.stringify(endpoint))
this.$set(this.endpoint, 'projectId', this.endpoint.project.id)
this.$set(this.endpoint, 'moduleId', this.endpoint.moduleId)
this.rightBox.editEndpoint.show = true
if (!this.endpoint.paramObj) {
this.$set(this.endpoint, 'paramObj', [])
}
if (!this.endpoint.labelModule) {
this.$set(this.endpoint, 'labelModule', [])
}
},
closeEditEndpointRightBox (refresh) {
this.rightBox.editEndpoint.show = false
if (refresh) {
this.getTableData()
}
},
add () {
this.rightBox.add.show = true
},
search (searchObj) {
let orderBy = ''
if (this.endpointSearchLabel.orderBy) {
orderBy = this.endpointSearchLabel.orderBy
}
this.endpointSearchLabel = {}
// this.pageObj.pageNo = 1;
for (const item in searchObj) {
if (searchObj[item] || searchObj[item] === 0) {
if (item === 'endpointState') {
this.$set(this.endpointSearchLabel, 'state', searchObj[item])
} else {
this.$set(this.endpointSearchLabel, item, searchObj[item])
}
}
}
if (orderBy) {
this.$set(this.endpointSearchLabel, 'orderBy', orderBy)
}
if (this.$refs.endpointTable && this.$refs.endpointTable.bodyWrapper) {
this.$refs.endpointTable.bodyWrapper.scrollTop = 0
}
this.getTableData()
},
dateFormat (time) {
if (!time) {
return '-'
}
const date = new Date(time * 1000)
const year = date.getFullYear()
const month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1
const day = date.getDate() < 10 ? '0' + date.getDate() : date.getDate()
const hours = date.getHours() < 10 ? '0' + date.getHours() : date.getHours()
const minutes = date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()
const seconds = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds()
return year + '-' + month + '-' + day + ' ' + hours + ':' + minutes + ':' + seconds
},
getStateContent: function (row) {
if (row) {
if (row.state == 1) {
return 'up'
} else if (row.state == 0) {
return 'down'
} else if (row.state == 2) {
return 'suspended'
}
}
},
formatUpdateTime: function (date) {
const time = new Date(date)
const hours = time.getHours() > 9 ? time.getHours() : '0' + time.getHours()
const minutes = time.getMinutes() > 9 ? time.getMinutes() : '0' + time.getMinutes()
return hours + ':' + minutes
},
getStateErrorMsg: function (row) {
const errCodes = [230009, 230010, 230011]
if (row) {
if (row.state == 0) {
if (errCodes.find((item) => { return row.stateInfo.code == item })) {
return this.$t('project.endpoint.stateInfo_' + row.stateInfo.code)
} else {
this.$message.error('state code error')
return row.stateInfo.msg
}
}
}
},
initEvent () {
bus.$on('current-project-change', project => {
this.currentProject = project
})
bus.$on('current-module-change', module => {
this.currentModule = module
})
// bus.$on("endpoint-list-change", menu => {
// this.getEndpointTableData();
// });
},
// 数据排序
tableDataSort (item) {
let orderBy = ''
if (item.order === 'ascending') {
orderBy = item.prop
}
if (item.order === 'descending') {
orderBy = '-' + item.prop
}
this.$set(this.endpointSearchLabel, 'orderBy', orderBy)
this.getTableData()
},
messageStyle (e) {
if (e.column.label == 'Alerts' || e.column.label == this.$t('overall.alert')) {
if (e.row.alertNum > 0) {
return 'danger'
} else {
return 'success'
}
}
return ''
}
},
watch: {
obj: {
immediate: true,
deep: true,
handler (n) {
if (n) {
this.searchLabel = {}
if (this.from === fromRoute.asset) {
this.asset = JSON.parse(JSON.stringify(n))
this.$nextTick(() => {
this.getTableData()
})
} else if (this.from === fromRoute.module) {
this.module = JSON.parse(JSON.stringify(n))
this.$nextTick(() => {
this.getTableData()
})
}
}
}
}
},
mounted () {
// 初始化表头
this.tools.customTableTitle = localStorage.getItem('nz-tableTitle-' + localStorage.getItem('nz-username') + '-/projectBottom')
? JSON.parse(localStorage.getItem('nz-tableTitle-' + localStorage.getItem('nz-username') + '-/projectBottom'))
: this.tableTitle
this.tableTitleReset(this.tableTitle, this.tools.customTableTitle)
this.initEvent()
},
beforeDestroy () {
bus.$off('current-project-change', project => {
this.currentProject = project
})
bus.$on('current-module-change', module => {
this.currentModule = module
})
// bus.$on("endpoint-list-change", menu => {
// this.getEndpointTableData();
// });
}
}
</script>

View File

@@ -52,7 +52,7 @@
v-if="detailViewRightObj"
:from="from"
:obj="detailViewRightObj"
:target-tab="'panelTab'"
:target-tab="'dashboardTab'"
/>
</div>
</div>

View File

@@ -6,8 +6,6 @@
<alertMessageTabNew :showTitle="false" v-if="from === fromRoute.dc && targetTab === 'alertMessageTab'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.dc.alertMessage" :targetTab="targetTab" @changeTab="changeTab"></alertMessageTabNew>
<!--告警信息-->
<alert-message-tab :showTitle="false" v-if="((from === fromRoute.alertRule || from === fromRoute.asset || from === fromRoute.endpoint || from === fromRoute.project ) && targetTab === 'alertMessage')" v-show="subResizeShow" :from="from" :obj="obj" @changeTab="changeTab" :targetTab="targetTab"></alert-message-tab>
<!--asset页的endpoint列表-->
<endpoint-tab :showTitle="false" v-if="from === fromRoute.asset && targetTab === fromRoute.endpoint" v-show="subResizeShow" :from="from" :obj="obj" @changeTab="changeTab" :targetTab="targetTab"></endpoint-tab>
<!--terminal-log的记录和回放-->
<terminal-log-cmd-tab :showTitle="false" v-if="from === fromRoute.terminalLog && targetTab === 'cmdTab'" :from="from" :obj="obj" :tabs="hasTerminalLogTabs" @changeTab="changeTab" :targetTab="targetTab"></terminal-log-cmd-tab>
@@ -21,7 +19,7 @@
<operation-log-tab :showTitle="false" v-if="from === fromRoute.user && targetTab === 'operationLogTab'" :from="from" :obj="obj" :tabs="tabs.user.operationLog" @changeTab="changeTab" :targetTab="targetTab"></operation-log-tab>
<terminal-log-tab :showTitle="false" v-if="from === fromRoute.user && targetTab === 'terminalLogTab'" :from="from" :obj="obj" :tabs="tabs.user.terminalLog" @changeTab="changeTab" :targetTab="targetTab"></terminal-log-tab>
<!-- asset列表的3个 -->
<panel-tab-new @getTableData="getTableData" :paramsType="'asset'" :showTitle="false" v-if="from === fromRoute.asset && targetTab === 'panelTab'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="assetTabs" :targetTab.sync="targetTab" @changeTab="changeTab"></panel-tab-new>
<dashboard-tab @getTableData="getTableData" :paramsType="'asset'" :showTitle="false" v-if="from === fromRoute.asset && targetTab === 'dashboardTab'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="assetTabs" :targetTab.sync="targetTab" @changeTab="changeTab"></dashboard-tab>
<alertMessageTabNew :showTitle="false" v-if="from === fromRoute.asset && targetTab === 'alertMessageTab'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="assetTabs" :targetTab="targetTab" @changeTab="changeTab"></alertMessageTabNew>
<endpointTabNew :showTitle="false" v-if="from === fromRoute.asset && targetTab === 'endpointTab'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="assetTabs" :targetTab="targetTab" @changeTab="changeTab"></endpointTabNew>
<log-bottom-tab :showTitle="false" v-if="from === fromRoute.asset && targetTab === 'log'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="assetTabs" :targetTab.sync="targetTab" @changeTab="changeTab"></log-bottom-tab>
@@ -33,14 +31,14 @@
<!--module列表的tab-->
<endpointTabNew :showTitle="false" v-if="from === fromRoute.module && targetTab === 'endpoint'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.module.moduleTabTitle" :targetTab="targetTab" @changeTab="changeTab"></endpointTabNew>
<alertMessageTabNew :showTitle="false" v-if="from === fromRoute.module && targetTab === 'moduleAlertMessage'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.module.moduleTabTitle" @changeTab="changeTab" :targetTab="targetTab"></alertMessageTabNew>
<panel-tab-new @getTableData="getTableData" :paramsType="'module'" :showTitle="false" v-if="from === fromRoute.module && targetTab === 'panel'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.module.moduleTabTitle" :targetTab.sync="targetTab" @changeTab="changeTab"></panel-tab-new>
<dashboard-tab @getTableData="getTableData" :paramsType="'module'" :showTitle="false" v-if="from === fromRoute.module && targetTab === 'dashboardTab'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.module.moduleTabTitle" :targetTab.sync="targetTab" @changeTab="changeTab"></dashboard-tab>
<!--endpoint列表的tab-->
<panel-tab-new :showTitle="false" v-if="from === fromRoute.endpoint && targetTab === 'panelTab'" v-show="subResizeShow" :from="from" :obj="obj" :paramsType="'endpoint'" :tabs="endpointTabs" :targetTab.sync="targetTab" @changeTab="changeTab" @getTableData="getTableData"></panel-tab-new>
<dashboard-tab :showTitle="false" v-if="from === fromRoute.endpoint && targetTab === 'dashboardTab'" v-show="subResizeShow" :from="from" :obj="obj" :paramsType="'endpoint'" :tabs="endpointTabs" :targetTab.sync="targetTab" @changeTab="changeTab" @getTableData="getTableData"></dashboard-tab>
<endpointQuery :showTitle="false" v-if="from === fromRoute.endpoint && targetTab === 'endpointQuery'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="endpointTabs" :targetTab.sync="targetTab" @changeTab="changeTab"></endpointQuery>
<log-bottom-tab :showTitle="false" v-if="from === fromRoute.endpoint && targetTab === 'log' && hasLogConfig" v-show="subResizeShow" :from="from" :obj="obj" :tabs="endpointTabs" :targetTab.sync="targetTab" @changeTab="changeTab"></log-bottom-tab>
<alertMessageTabNew :showTitle="false" v-if="from === fromRoute.endpoint && targetTab === 'endpointAlertMessage'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="endpointTabs" :targetTab="targetTab" @changeTab="changeTab"></alertMessageTabNew>
<!--chartTemp的Tab-->
<panel-tab-new @getTableData="getTableData" :paramsType="'template'" :showTitle="false" v-if="from === fromRoute.chartTemp && targetTab === 'panel'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.chartTemp.chartTempTabTitle" :targetTab.sync="targetTab" @changeTab="changeTab"></panel-tab-new>
<dashboard-tab @getTableData="getTableData" :paramsType="'template'" :showTitle="false" v-if="from === fromRoute.chartTemp && targetTab === 'dashboardTab'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.chartTemp.chartTempTabTitle" :targetTab.sync="targetTab" @changeTab="changeTab"></dashboard-tab>
<!--alertRule Tab-->
<alertMessageTabNew v-if="from === fromRoute.alertRule && targetTab === 'alertRuleAlertMessage'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.alertRule.alertRule" @changeTab="changeTab" :targetTab.sync="targetTab"></alertMessageTabNew>
<alertRuleEvalLog v-if="from === fromRoute.alertRule && targetTab === 'evalLog'" v-show="subResizeShow" :from="from" :obj="obj" :tabs="tabs.alertRule.alertRule" @changeTab="changeTab" :targetTab.sync="targetTab"></alertRuleEvalLog>
@@ -59,9 +57,8 @@ import assetSubTab from '@/components/common/bottomBox/tabs/assetSubTab'
import commentsBottomTab from '@/components/common/bottomBox/tabs/commentsBottomTab'
import vsysBottomTab from '@/components/common/bottomBox/tabs/vsysBottomTab'
import endpointQuery from '@/components/common/bottomBox/tabs/endpointQuery'
import endpointTab from '@/components/common/bottomBox/tabs/endpointTab'
import endpointTabNew from '@/components/common/bottomBox/tabs/endpointTabNew'
import panelTabNew from '@/components/common/bottomBox/tabs/panelTabNew'
import dashboardTab from '@/components/common/bottomBox/tabs/dashboardTab'
import terminalLogRecordTab from '@/components/common/bottomBox/tabs/terminalLogRecordTab'
import terminalLogSftpTab from '@/components/common/bottomBox/tabs/terminalLogSftpTab'
import terminalLogMonitorTab from '@/components/common/bottomBox/tabs/terminalLogMonitorTab'
@@ -83,7 +80,6 @@ export default {
LogBottomTab,
cabinetTab,
alertMessageTab,
endpointTab,
terminalLogRecordTab,
terminalLogSftpTab,
terminalLogMonitorTab,
@@ -93,7 +89,7 @@ export default {
endpointTabNew,
alertMessageTabNew,
endpointQuery,
panelTabNew,
dashboardTab,
assetTab,
assetSubTab,
'detail-right-top': detailRightTop,
@@ -159,7 +155,7 @@ export default {
},
asset: {
assetTabTitle: [
{ prop: 'panelTab', name: this.$t('overall.dashboard') },
{ prop: 'dashboardTab', name: this.$t('overall.dashboard') },
{ prop: 'alertMessageTab', name: this.$t('overall.alert') },
{ prop: 'endpointTab', name: this.$t('asset.endpoint') },
{ prop: 'log', name: this.$t('dashboard.panel.chartForm.typeVal.log.label') }
@@ -167,14 +163,13 @@ export default {
},
module: {
moduleTabTitle: [
// { prop: 'panel', name: 'Detail' },
{ prop: 'endpoint', name: this.$t('asset.endpoint') },
{ prop: 'moduleAlertMessage', name: this.$t('overall.alert') }
]
},
endpoint: {
endpointTabTitle: [
{ prop: 'panelTab', name: this.$t('overall.detail') },
{ prop: 'dashboardTab', name: this.$t('overall.detail') },
{ prop: 'endpointAlertMessage', name: this.$t('overall.alert') },
{ prop: 'endpointQuery', name: this.$t('overall.metric') },
{ prop: 'log', name: this.$t('dashboard.panel.chartForm.typeVal.log.label') }
@@ -182,7 +177,7 @@ export default {
},
chartTemp: {
chartTempTabTitle: [
{ prop: 'panel', name: this.$t('overall.tempPrev') }
{ prop: 'dashboardTab', name: this.$t('overall.tempPrev') }
]
},
alertRule: {
@@ -236,7 +231,7 @@ export default {
const hasProcess = this.obj && this.obj.clientState == '1'
const hasVays = this.obj && this.obj.model && this.obj.model.tsgAppliance == '1'
const tabs = [
{ prop: 'panelTab', name: this.$t('overall.dashboard') },
{ prop: 'dashboardTab', name: this.$t('overall.dashboard') },
{ prop: 'alertMessageTab', name: this.$t('overall.alert') },
{ prop: 'endpointTab', name: this.$t('asset.endpoint') },
{ prop: 'log', name: this.$t('dashboard.panel.chartForm.typeVal.log.label') }
@@ -258,7 +253,7 @@ export default {
const config = this.obj.configs.find(c => c.type === 'logs')
const hasLog = config && config.enable === 1
const tabs = [
{ prop: 'panelTab', name: this.$t('overall.detail') },
{ prop: 'dashboardTab', name: this.$t('overall.detail') },
{ prop: 'endpointAlertMessage', name: this.$t('overall.alert') },
{ prop: 'endpointQuery', name: this.$t('overall.metrics') }
]
@@ -310,9 +305,9 @@ export default {
return
}
if (this.from === fromRoute.asset) {
this.targetTab = 'panelTab'
this.targetTab = 'dashboardTab'
} else if (this.from === fromRoute.endpoint) {
this.targetTab = 'panelTab'
this.targetTab = 'dashboardTab'
} else if (this.from === fromRoute.module) {
this.targetTab = 'endpoint'
} else if (this.from === fromRoute.alertRule) {

View File

@@ -1,435 +0,0 @@
<template>
<div class="export-xlsx">
<div class="top-tool-btn-group">
<slot name="optionZone"></slot>
<button id="browser-go" v-has="[permissions.import, permissions.export]" class="top-tool-btn top-tool-btn--dropdown" @mouseenter="exportMenuHandler(true)" @mouseleave="exportMenuHandler(false)">
<i class="nz-icon nz-icon-arrow-down" style="font-size: 12px;"></i>
<transition name="el-zoom-in-top">
<ul v-show="exportShow" class="el-dropdown-menu el-popper el-dropdown-menu--mini nz-dropdown">
<li @click="showImportBox(1)" class="el-dropdown-menu__item dropdown-content" v-has="permissions.import" :id="id+'-xlsx-import'"><i class="nz-icon nz-icon-upload"></i>{{$t('overall.importExcel')}}</li>
<li @click="showImportBox(2)" class="el-dropdown-menu__item dropdown-content" v-has="permissions.export" :id="id+'-xlsx-export'"><i class="nz-icon nz-icon-download1"></i>{{$t('overall.exportExcel')}}</li>
</ul>
</transition>
</button>
</div>
<el-dialog :close-on-click-modal="importBox.type!=3" :show-close="true" :title="importBox.title" :visible.sync="importBox.show" :width="importBox.width" append-to-body class="nz-dialog" @close="closeDialog">
<div v-if="importBox.type == 1">
<div class="upload-body">
<el-upload drag class="upload-demo" ref="uploadExcel" action="" :file-list="importFileList" :on-change="importChange" :auto-upload="false" accept=".xlsx,.xls" :id="id+'-xlsx-input-file'">
<div slot="tip" class="el-upload__tip" >{{$t('overall.importTip')}}</div>
<i class="nz-icon nz-icon-upload"></i>
<div class="el-upload__text">{{$t('overall.dragFileTip')}}{{$t('overall.or')}}&nbsp;<em>{{$t('overall.clickUpload')}}</em></div>
<!--<button type="button" class="nz-btn nz-btn-size-normal nz-btn-style-normal">
<span class="top-tool-btn-txt" >{{$t('overall.upload')}}</span>
</button>-->
</el-upload>
</div>
<div slot="footer" class="footer">
<div class="el-message-box__btns" style="text-align: right;">
<button :id="id+'-xlsx-import-template'" class="el-button el-button--default el-button--small" @click="downloadTemplate">
<span>{{$t('upload.template')}}</span>
</button>
<button :id="id+'-xlsx-import-add'" :class="{'nz-btn-disabled':prevent_opt.import}" :disabled="prevent_opt.import" class="nz-btn el-button el-button--default el-button--small" @click="importExcel">
<span>{{$t('overall.importExcel')}}</span>
</button>
<button :id="id+'-xlsx-import-esc'" class="el-button el-button--default el-button--small" @click="closeDialog">
<span>{{$t('overall.cancel')}}</span>
</button>
</div>
</div>
</div>
<div v-if="importBox.type == 2">
<div class="upload-body">
<button @click="exportCur" class="el-button el-button--default el-button--small" :id="id+'-xlsx-export-current'">
<span>{{$t('overall.current')}}</span>
</button>
<button @click="exportAll" class="el-button el-button--default el-button--small" :id="id+'-xlsx-export-all'">
<span>{{$t('overall.exportAll')}}</span>
</button>
</div>
<div slot="footer" class="footer">
</div>
</div>
<div v-if="importBox.type==3">
<div class="upload-body result-body">
<div>
<span class="result-title">{{$t('overall.result.total')}}:</span>
<span>{{importResult&&importResult.totalNum?importResult.totalNum:0}}</span>
</div>
<div>
<span class="result-title">{{$t('overall.result.failed')}}:</span>
<span>{{importResult&&importResult.failNum?importResult.failNum:0}}</span>
<span class="result-title">{{$t('overall.result.success')}}:</span>
<span>{{importResult&&importResult.successNum?importResult.successNum:0}}</span>
</div>
<div>
<div class="result-title">{{$t('overall.result.failedDetail')}}:</div>
<div class="result-detail" v-if="importResult&&importResult.failDetail">
<div style="height: 100%; overflow: auto;">
<!-- <ul>
<li v-for="(item,index) in importResult.failDetail"><span>{{item.lineNo}}</span>:<span>{{item.errorMsg}}</span> </li>
</ul>-->
<template v-for="(item, index) in importResult.failDetail">
<div :key="index" class="import-result-block">
<div class="import-result-item">
<div class="line-num">{{$t('overall.result.line',[item.lineNo])}}</div>
<div>{{item.errorMsg}}</div>
</div>
</div>
</template>
</div>
</div>
</div>
</div>
<div slot="footer" class="footer">
<div class="el-message-box__btns">
<button :id="id+'-xlsx-import-rollback'" class="nz-btn nz-btn-size-normal nz-btn-style-error" @click="rollbackImport">
<span>{{$t('overall.rollbackImport')}}</span>
</button>
</div>
</div>
</div>
</el-dialog>
</div>
</template>
<script>
import axios from 'axios'
let timeout
export default {
name: 'exportXLSX',
props: {
exportUrl: { type: String, required: true },
params: { type: Object },
exportFileName: { type: String },
importUrl: { type: String, required: true },
link: { type: Object },
permissions: { type: Object },
showCur: { type: Boolean, default: true },
id: { type: String, default: 'export' }
},
data () {
return {
importBox: { show: false, title: this.$t('overall.importExcel'), type: 1 },
importFile: null,
importFileList: [],
importResult: null,
exportShow: false,
paramsType: ''
}
},
created () {
},
mounted () {
this.getParamsType()
},
/* watch: {
permissions: {
immediate: true,
deep: true,
handler(n) {
this.permission = Object(n);
}
}
}, */
methods: {
importChange (file, fileList) {
if (fileList.length > 0) {
this.importFileList = [fileList[fileList.length - 1]]
}
this.importFile = this.importFileList[0]
this.validateFile()
},
rollbackImport () {
let url
if (this.importUrl.indexOf('asset') > -1) {
url = '/asset/asset/cancelImport'
} else if (this.importUrl.indexOf('endpoint') > -1) {
url = '/monitor/endpoint/cancelImport'
} else if (this.importUrl.indexOf('rule') > -1) {
url = '/alert/rule/cancelImport'
} else if (this.importUrl.indexOf('panel') > -1) {
url = '/panel/cancelImport'
} else if (this.importUrl.indexOf('tmpl') > -1) {
url = '/expression/tmpl/cancelImport'
}
this.$delete(url + '?seq=' + this.importResult.seq).then(response => {
if (response.code == 200) {
this.$message({ duration: 2000, type: 'success', message: this.$t('tip.saveSuccess') })
this.$emit('afterImport')
} else {
this.$message.error(response.msg)
}
this.closeDialog()
})
},
importExcel () {
if (this.importFile && this.importFile.raw) {
this.prevent_opt.import = true
const form = new FormData()
form.append('excelFile', this.importFile.raw)
if (this.paramsType) {
form.append('type', this.paramsType)
if (this.paramsType === 'asset' || this.paramsType === 'model') {
form.append('linkId', this.link ? this.link.id : '')
}
}
form.append('language', localStorage.getItem('nz-language') ? localStorage.getItem('nz-language') : 'en')
this.$post(this.importUrl, form, { 'Content-Type': 'multipart/form-data' }).then(response => {
if (response.code == 200 && response.msg == 'success') {
this.importResult = response.data
this.$emit('afterImport')
this.importBox.type = 3
this.importBox.width = '600px'
} else {
this.$message.error(response.msg)
}
this.prevent_opt.import = false
})
} else {
this.$message.error(this.$t('tip.noImportFile'))
}
},
exportMenuHandler (show) {
if (show) {
clearTimeout(timeout)
this.exportShow = true
} else {
timeout = setTimeout(() => {
this.exportShow = false
}, 700)
}
},
closeDialog () {
this.importBox.show = false
this.importResult = null
this.importFileList = []
this.importFile = null
},
downloadTemplate () {
const language = localStorage.getItem('nz-language') || 'en' // 初始未选择默认 en 英文
const fileName = this.exportFileName + '-' + this.$t('overall.template') + '-' + this.getTimeString() + '.xlsx'
let url = null
if (this.importUrl.indexOf('asset') > -1) {
url = '/asset/asset/template'
} else if (this.importUrl.indexOf('rule') > -1) {
url = '/alert/rule/template'
} else if (this.importUrl.indexOf('panel') > -1) {
url = '/panel/template'
} else if (this.importUrl.indexOf('endpoint') > -1) {
url = '/monitor/endpoint/template'
} else if (this.importUrl.indexOf('tmpl') > -1) {
url = '/expression/tmpl/template'
}
const param = { language: language }
if (!url) {
console.error('no interface support')
}
this.exportExcel(url, param, fileName)
},
formatJson (filterVal, jsonData) {
return jsonData.map(v => filterVal.map(j => v[j]))
},
exportCur () {
const params = Object.assign({}, this.params)
params.language = localStorage.getItem('nz-language') || 'en'
this.exportExcel(this.exportUrl, params, this.exportFileName + '-' + this.getTimeString() + '.xlsx')
this.closeDialog()
},
exportAll () {
const params = JSON.parse(JSON.stringify(this.params))
params.pageSize = -1
if (this.importUrl.indexOf('panel') > -1) {
delete params.panelId
}
// if (this.importUrl.indexOf('endpoint') > -1){
// delete params.moduleId
// }
params.language = localStorage.getItem('nz-language') || 'en'
this.exportExcel(this.exportUrl, params, this.exportFileName + '-' + this.getTimeString() + '.xlsx')
this.closeDialog()
},
exportExcel (url, params, fileName) {
if (this.paramsType) {
params.type = this.paramsType
}
axios.get(url, { responseType: 'blob', params: params }).then(res => {
if (window.navigator.msSaveOrOpenBlob) {
// 兼容ie11
const blobObject = new Blob([res.data])
window.navigator.msSaveOrOpenBlob(blobObject, fileName)
} else {
const url = URL.createObjectURL(new Blob([res.data]))
const a = document.createElement('a')
document.body.appendChild(a) // 此处增加了将创建的添加到body当中
a.href = url
a.download = fileName
a.target = '_blank'
a.click()
a.remove() // 将a标签移除
}
}, error => {
const $self = this
const reader = new FileReader()
reader.onload = function (event) {
const responseText = reader.result
const exception = JSON.parse(responseText)
if (exception.message) {
$self.$message.error(exception.message)
} else {
console.error(error)
}
}
reader.readAsText(error.response.data)
})
},
showImportBox (type) {
this.importBox.show = true
this.importBox.type = type
if (type == 2 && (!this.showCur)) {
this.exportCur()
return
}
if (type == 1) { // import
this.importBox.title = this.$t('overall.importExcel')
this.importBox.width = '600px'
} else if (type == 2) { // export
this.importBox.title = this.$t('overall.exportExcel')
this.importBox.width = '300px'
}
},
getTimeString () {
const split = '-'
const date = new Date()
const year = date.getFullYear()
const month = this.formatNum(date.getMonth() + 1)
const day = this.formatNum(date.getDate())
const hours = this.formatNum(date.getHours())
const minutes = this.formatNum(date.getMinutes())
const seconds = this.formatNum(date.getSeconds())
return year + split + month + split + day + ' ' + hours + split + minutes + split + seconds
},
formatNum (num) {
return num > 9 ? num : '0' + num
},
getParamsType () {
const path = this.$route.path
switch (path) {
case '/panel': this.paramsType = 'dashboard'; break
case '/asset': this.paramsType = 'asset'; break
case '/model': this.paramsType = 'model'; break
default: this.paramsType = ''; break
}
}
}
}
</script>
<style scoped>
/*去除上传文件动画start*/
/*.upload-demo {*/
/* display: flex;*/
/*}*/
/deep/ .el-list-enter-active,
/deep/ .el-list-leave-active {
transition: none;
}
.nz-tab {
margin-bottom: 22px;
margin-left: 13px;
}
/deep/ .el-list-enter,
/deep/ .el-list-leave-active {
opacity: 0;
}
/deep/ .el-upload-list {
height: 40px;
}
/*去除上传文件动画end*/
</style>
<style>
.result-detail .import-result-block{
}
.result-detail .import-result-block .import-result-item{
display: flex;
}
.import-result-item .line-num{
/*width: 55px;*/
}
.endpoint-query-dropdown {
position: absolute;
right: 0;
top: 31px;
}
.nz-dropdown {
width: 90px;
right: 0;
left: unset !important;
top: 35px;
}
.endpoint-query-dropdown::after {
content: '';
display: block;
width:0;
height:0;
overflow: hidden;
font-size: 0;
line-height: 0;
border: 5px;
border-style: dashed dashed solid dashed;
border-color: transparent transparent #fff transparent;
position: absolute;
right: 3px;
bottom: 0;
}
.endpoint-query-dropdown::after {
transform: translate(-50%, -45px);
}
.export-xlsx .el-dialog__body{
padding: 10px 20px 20px 20px;
}
.export-xlsx .el-button:focus, .export-xlsx .el-button:hover {
color: unset;
border-color: unset;
background-color:unset;
}
.dropdownBtn .el-button--primary{
top:2px;
padding: 0 8px;
background-image: linear-gradient(180deg, #fff 0%, #E0E0E0 100%);
border: 0;
color: #666;
-webkit-box-shadow: 0 0 1px 1px rgba(162,162,162,0.5);
box-shadow: 0 0 1px 1px rgba(162,162,162,0.5);
letter-spacing: 0;
background-color: unset;
}
.dropdownBtn .el-button--primary:hover{
background-image: linear-gradient(180deg, #F0F0F0 0%, #D8D8D8 99%) !important;
}
.dropdownBtn .el-button--mini{
font-size: 12px;
height: 24px;
}
.dropdownBtn .el-button--mini:first-of-type {
right: 3px;
}
.el-dropdown .el-button-group{
display: block;
position: relative;
top:-2px;
}
.export-xlsx .el-dropdown .el-dropdown__caret-button {
padding-left: 5px;
padding-right: 5px;
border-left: none;
top: 0;
left: -1px;
}
</style>

View File

@@ -406,7 +406,7 @@ export const theme = [
export const sameLabels = ['instance', 'module', 'project', 'asset', 'endpoint', 'datacenter', 'datacenter_id', 'endpoint_id', 'module_id', 'nz_agent_id', 'project_id']
// 公共组件的跳转来源
export const fromRoute = {
panel: 'panel',
dashboard: 'dashboard',
explore: 'explore',
alertMessage: 'alertMessage',
alertRule: 'alertRule',

View File

@@ -600,7 +600,7 @@ export const chartResizeTool = {
if (data.height != originalData.height || data.span != originalData.span) {
originalData.height = data.height
originalData.span = data.span
vm.$put('/visual/panel/chart/modify', originalData)
vm.$put('/visual/dashboard/chart/modify', originalData)
}
// 关闭背景阴影
shadow.classList.remove('resize-shadow-active')

View File

@@ -284,7 +284,7 @@ const cn = {
singleStatErrorTip: '仅支持返回单个系列/表的查询',
panelForm: {
panelName: '面板名称',
panelId: 'ID'
dashboardId: 'ID'
},
createChartTitle: '新增图表',
createChartTempTitle: '新增图表模板',

View File

@@ -293,7 +293,7 @@ const en = {
singleStatErrorTip: 'Only queries that return single series/table is supported',
panelForm: {
panelName: 'Panel name', // "面板名称"
panelId: 'ID' // ID
dashboardId: 'ID' // ID
},
// 图表-侧滑框
createChartTitle: 'New chart', // "新增图表"

View File

@@ -15,13 +15,13 @@ export default {
})
const params = {
format: 'html',
panelId: this.showPanel.id,
dashboardId: this.showPanel.id,
start: this.$stringTimeParseToUnix(bus.formateTimeToTime(this.searchTime[0])),
end: this.$stringTimeParseToUnix(bus.formateTimeToTime(this.searchTime[1])),
vars: vars
}
this.$store.dispatch('dispatchHomeLoading', true)
this.$get('/visual/panel/snapshot', params, 'blob').then(res => {
this.$get('/visual/dashboard/snapshot', params, 'blob').then(res => {
this.$store.dispatch('dispatchHomeLoading', false)
const self = this
let fileName = name

View File

@@ -149,6 +149,7 @@ export default {
}
} else {
delete params.selectObj
delete params.targetTab
}
this.$router.replace({ path: path, query: params }).catch(err => {})
} else if (from === 'nzDetailList' && this.detailViewRightObj) {

View File

@@ -50,7 +50,7 @@
<template v-if="activeIndex === 4">
<div class="desc-text">{{$t('guide.visualizationTip')}}</div>
<div class="guide__btn-group">
<button :class="{'guide__btn--disabled': !hasButton('main_add')}" class="guide__btn" type="button" @click="jumpAndOpen('panel')">{{$t('dashboard.panel.createPanelTitleSec')}}</button>
<button :class="{'guide__btn--disabled': !hasButton('main_add')}" class="guide__btn" type="button" @click="jumpAndOpen('dashboard')">{{$t('dashboard.panel.createPanelTitleSec')}}</button>
<button :class="{'guide__btn--disabled': !hasButton('main_add')}" class="guide__btn" type="button" @click="jumpAndOpen('chart')">{{$t('overall.createChart')}}</button>
</div>
</template>
@@ -107,11 +107,11 @@ export default {
permissionCode: 'project_view'
},
{
route: '/panel',
route: '/dashboard',
title: this.$t('guide.visualization'),
icon: 'nz-icon nz-icon-visualization',
tip: this.$t('guide.visualizationTip'),
permissionCode: 'panel_view'
permissionCode: 'dashboard_view'
},
{
route: '/alertRule',
@@ -288,16 +288,16 @@ export default {
})
break
}
case 'panel': {
case 'dashboard': {
if (!this.hasButton('main_add')) {
return
}
this.$emit('close')
this.$router.push({
path: '/panel',
path: '/dashboard',
query: {
t: +new Date(),
add: 'panel'
add: 'dashboard'
}
})
break
@@ -308,7 +308,7 @@ export default {
}
this.$emit('close')
this.$router.push({
path: '/panel',
path: '/dashboard',
query: {
t: +new Date(),
add: 'chart'

View File

@@ -263,7 +263,7 @@ export default {
// 新增收藏
addStarred: bus.debounceFn(function (data) {
const params = {
type: 'panel',
type: 'dashboard',
tid: data.id
}
this.$post('/sys/user/starred', params).then(async response => {
@@ -290,7 +290,7 @@ export default {
300, true),
// 删除收藏
delStarred: bus.debounceFn(function (data) {
this.$delete('/sys/user/starred?type=panel&tid=' + data.id).then(async response => {
this.$delete('/sys/user/starred?type=dashboard&tid=' + data.id).then(async response => {
if (response.code === 200) {
data.starred = 0
// 更新panelData收藏状态
@@ -345,7 +345,7 @@ export default {
}
})
}
this.$put('visual/panel/tree', toUpdate)
this.$put('visual/dashboard/tree', toUpdate)
},
deletePanel (data) {
this.$emit('deletePanel', data)

View File

@@ -132,7 +132,7 @@ export default {
})
}
this.$put('visual/panel/tree', toUpdate)
this.$put('visual/dashboard/tree', toUpdate)
},
deletePanel (data) {
this.$emit('deletePanel', data)

View File

@@ -6,7 +6,7 @@
</button>
<el-dropdown-menu slot="dropdown" class="right-box-select-top right-public-box-dropdown-top nz-el-dropdown-menu">
<el-dropdown-item v-if="showLock" v-has="'main_edit'">
<div @click="editPanel" id="edit-bottom-panel"><i class="nz-icon nz-icon-edit"></i>{{$t('dashboard.panel.editPanelTitle')}}</div>
<div @click="editPanel" id="edit-bottom-dashboard"><i class="nz-icon nz-icon-edit"></i>{{$t('dashboard.panel.editPanelTitle')}}</div>
</el-dropdown-item>
<el-dropdown-item v-if="showLock" v-has="'main_edit'">
<div @click="panelLock=!panelLock" id="panel-lock"><i :class="{'nz-icon nz-icon-lock':!panelLock,'nz-icon nz-icon-unlock':panelLock}"></i>{{!panelLock ? $t("overall.locked") : $t("overall.unlocked")}}</div>
@@ -279,7 +279,7 @@ export default {
language () { return this.$store.getters.getLanguage },
// 判断是否是dashboard
isDashboard () {
return this.importUrl === '/visual/panel/import'
return this.importUrl === '/visual/dashboard/import'
},
// assetendpoint dashboard导出选项不支持 all data
assetOrEndpoint () {
@@ -379,8 +379,8 @@ export default {
url = '/monitor/module/cancelImport'
} else if (this.importUrl.indexOf('rule') > -1) {
url = '/alert/rule/cancelImport'
} else if (this.importUrl.indexOf('panel') > -1) {
url = 'visual/panel/cancelImport'
} else if (this.importUrl.indexOf('dashboard') > -1) {
url = 'visual/dashboard/cancelImport'
} else if (this.importUrl.indexOf('tmpl') > -1) {
url = '/expression/tmpl/cancelImport'
} else if (this.importUrl.indexOf('dc/cabinet') > -1) {
@@ -489,8 +489,8 @@ export default {
} else if (this.importUrl.indexOf('asset') > -1) {
url = '/asset/asset/template'
param.type = 'asset'
} else if (this.importUrl.indexOf('panel') > -1) {
url = 'visual/panel/template'
} else if (this.importUrl.indexOf('dashboard') > -1) {
url = 'visual/dashboard/template'
param.type = this.paramsType
} else if (this.importUrl.indexOf('endpoint') > -1) {
url = '/monitor/endpoint/template'
@@ -536,7 +536,7 @@ export default {
}
})
}
if (this.exportUrl.indexOf('panel') > -1) {
if (this.exportUrl.indexOf('dashboard') > -1) {
if (this.paramsType !== 'template') {
params.pageSize = -1
}
@@ -545,8 +545,8 @@ export default {
delete params.id
delete params.searchName
delete params.value
params.ids = params.panelId
delete params.panelId
params.ids = params.dashboardId
delete params.dashboardId
}
params.language = localStorage.getItem('nz-language') || 'en'
params.format = this.importBox.format
@@ -570,13 +570,13 @@ export default {
})
}
params.pageSize = -1
if (this.exportUrl.indexOf('panel') > -1) {
if (this.exportUrl.indexOf('dashboard') > -1) {
delete params.start_time
delete params.end_time
delete params.id
delete params.searchName
delete params.value
delete params.panelId
delete params.dashboardId
}
// if (this.importUrl.indexOf('endpoint') > -1){
// delete params.moduleId
@@ -603,13 +603,13 @@ export default {
})
}
params.pageSize = -1
if (this.exportUrl.indexOf('panel') > -1) {
if (this.exportUrl.indexOf('dashboard') > -1) {
delete params.start_time
delete params.end_time
delete params.id
delete params.searchName
delete params.value
delete params.panelId
delete params.dashboardId
}
// if (this.importUrl.indexOf('endpoint') > -1){
// delete params.moduleId
@@ -744,7 +744,7 @@ export default {
return year + split + month + split + day + ' ' + hours + split + minutes + split + seconds
},
editPanel () {
this.$get('visual/panel/' + this.params.panelId).then(res => {
this.$get('visual/dashboard/' + this.params.dashboardId).then(res => {
if (res.code === 200) {
this.panel = res.data
if (!this.$loadsh.get(this.panel, 'param.report', '')) {

View File

@@ -74,11 +74,11 @@ export default {
data () {
return {
tempDom: { height: 250, width: '' },
chartDataTemp: { id: 8832, prev: null, next: null, panelId: 0, title: '123', span: 12, height: 0, createAt: '2021-01-27 07:36:19', unit: 2, weight: 0, pid: null, buildIn: null, seq: null, param: { last: 0, legendValue: { total: 'off', min: 'off', avg: 'off', last: 'off', max: 'off' }, threshold: '', url: '', nullType: 'null' }, sync: null, asset: null, isLoaded: true, from: '__vue_devtool_undefined__', draggable: true, resizable: true, editable: true },
chartDataTemp: { id: 8832, prev: null, next: null, dashboardId: 0, title: '123', span: 12, height: 0, createAt: '2021-01-27 07:36:19', unit: 2, weight: 0, pid: null, buildIn: null, seq: null, param: { last: 0, legendValue: { total: 'off', min: 'off', avg: 'off', last: 'off', max: 'off' }, threshold: '', url: '', nullType: 'null' }, sync: null, asset: null, isLoaded: true, from: '__vue_devtool_undefined__', draggable: true, resizable: true, editable: true },
chartData: {},
filter: {
end_time: bus.timeFormate(bus.getOffsetTimezoneData(), 'YYYY-MM-DD HH:mm:ss'),
panelId: 0,
dashboardId: 0,
searchName: '',
start_time: bus.timeFormate(bus.getOffsetTimezoneData(-1), 'YYYY-MM-DD HH:mm:ss')
}
@@ -126,13 +126,13 @@ export default {
if (len === 0) {
this.$nextTick(() => {
if (this.$refs['editChart' + chartItem.type]) {
this.$refs['editChart' + chartItem.type].setData(chartItem, [], this.filter.panelId, this.filter, [])
this.$refs['editChart' + chartItem.type].setData(chartItem, [], this.filter.dashboardId, this.filter, [])
}
})
} else {
const panelTime = localStorage.getItem('panelTime') ? JSON.parse(localStorage.getItem('panelTime')) : ['', '']
const endTime = panelTime[1] || bus.timeFormate(bus.getOffsetTimezoneData(), 'YYYY-MM-DD HH:mm:ss')
const startTime = panelTime[0] || bus.timeFormate(bus.getOffsetTimezoneData(-1), 'YYYY-MM-DD HH:mm:ss')
const dashboardTime = localStorage.getItem('dashboardTime') ? JSON.parse(localStorage.getItem('dashboardTime')) : ['', '']
const endTime = dashboardTime[1] || bus.timeFormate(bus.getOffsetTimezoneData(), 'YYYY-MM-DD HH:mm:ss')
const startTime = dashboardTime[0] || bus.timeFormate(bus.getOffsetTimezoneData(-1), 'YYYY-MM-DD HH:mm:ss')
const step = bus.getStep(startTime, endTime)
this.$nextTick(() => {
const axiosArr = chartItem.elements.map((ele) => {
@@ -368,7 +368,7 @@ export default {
singleStatRlt: singleStatRlt,
legend: legend,
tableData: tableData,
panelId: this.filter.panelId,
dashboardId: this.filter.dashboardId,
filter: this.filter,
filterType: filterType,
errorMsg: errorMsg
@@ -376,10 +376,10 @@ export default {
if (chartItem.type === 'table') { // 表格
if (filterType === 'showFullScreen') { // 全屏查询
this.$refs['editChart' + chartItem.type].setData(chartItem, tableData,
this.filter.panelId, this.filter, filterType, errorMsg)
this.filter.dashboardId, this.filter, filterType, errorMsg)
} else {
this.$refs['editChart' + chartItem.type].setData(chartItem, tableData,
this.filter.panelId, this.filter, '', errorMsg)
this.filter.dashboardId, this.filter, '', errorMsg)
}
} else if (chartItem.type === 'line' || chartItem.type === 'bar' || chartItem.type === 'stackArea' || chartItem.type === 4 || chartItem.type == 'pie') {
if (series.length && chartItem.type === 4) { // 曲线汇总
@@ -387,18 +387,18 @@ export default {
}
if (filterType === 'showFullScreen') { // 全屏查询
this.$refs['editChart' + chartItem.type].setData(chartItem, series,
this.filter.panelId, this.filter, legend, filterType, errorMsg)
this.filter.dashboardId, this.filter, legend, filterType, errorMsg)
} else {
this.$refs['editChart' + chartItem.type].setData(chartItem, series,
this.filter.panelId, this.filter, legend, '', errorMsg)
this.filter.dashboardId, this.filter, legend, '', errorMsg)
}
} else if (chartItem.type === 'singleStat') {
if (filterType === 'showFullScreen') { // 全屏查询
this.$refs['editChart' + chartItem.type].setData(chartItem, singleStatRlt,
this.filter.panelId, this.filter, filterType, errorMsg)
this.filter.dashboardId, this.filter, filterType, errorMsg)
} else {
this.$refs['editChart' + chartItem.type].setData(chartItem, singleStatRlt,
this.filter.panelId, this.filter, '', errorMsg)
this.filter.dashboardId, this.filter, '', errorMsg)
}
}
}
@@ -407,27 +407,27 @@ export default {
if (this.$refs['editChart' + chartItem.type]) {
if (type === 'table') {
if (filterType === 'showFullScreen') { // table的全屏查询
this.$refs['editChart' + chartItem.type].setData(chartItem, [], this.filter.panelId,
this.$refs['editChart' + chartItem.type].setData(chartItem, [], this.filter.dashboardId,
this.filter, filterType)
} else {
this.$refs['editChart' + chartItem.type].setData(chartItem, [], this.filter.panelId,
this.$refs['editChart' + chartItem.type].setData(chartItem, [], this.filter.dashboardId,
this.filter)
}
} else if (type === 'line' || type === 'bar' || type === 'stackArea' || chartItem.type === 4 || chartItem.type === 'pie') {
if (filterType === 'showFullScreen') { // table的全屏查询
this.$refs['editChart' + chartItem.type].setData(chartItem, [], this.filter.panelId,
this.$refs['editChart' + chartItem.type].setData(chartItem, [], this.filter.dashboardId,
this.filter, filterType)
} else {
this.$refs['editChart' + chartItem.type].setData(chartItem, [], this.filter.panelId,
this.$refs['editChart' + chartItem.type].setData(chartItem, [], this.filter.dashboardId,
this.filter)
}
} else if (chartItem.type === 'singleStat') {
if (filterType === 'showFullScreen') { // 全屏查询
this.$refs['editChart' + chartItem.type].setData(chartItem, '',
this.filter.panelId, this.filter, filterType)
this.filter.dashboardId, this.filter, filterType)
} else {
this.$refs['editChart' + chartItem.type].setData(chartItem, '',
this.filter.panelId, this.filter)
this.filter.dashboardId, this.filter)
}
}
}

View File

@@ -31,7 +31,7 @@
:data="chartlList"
:tb-columns="ChartSearchShowFields"
:params="{
varType: 1, panelId: 0,
varType: 1, dashboardId: 0,
returnChildren:0,groupId:0,
}"
:multiple="true"
@@ -47,7 +47,7 @@
></v-selectpage>
</el-form-item> -->
<!-- DashboardTemplate -->
<el-form-item :label="$t('model.dashboardtemplate')" prop="panelId" ref="dashboardTemplate">
<el-form-item :label="$t('model.dashboardtemplate')" prop="dashboardId" ref="dashboardTemplate">
<v-selectpage
:data="dashboardList"
:tb-columns="DashboardSearchShowFields"
@@ -58,10 +58,10 @@
title="DashboardSearch"
key-field="id"
:width="634"
v-model="editModel.panelId"
v-model="editModel.dashboardId"
show-field="name"
class="form-control"
@values="(data) => {editModel.panelId = data.map(d => d.id).join(',')}"
@values="(data) => {editModel.dashboardId = data.map(d => d.id).join(',')}"
:result-format="resultFormat"
></v-selectpage>
</el-form-item>
@@ -159,7 +159,7 @@ export default {
handler (n) {
this.isEdit = true
this.editModel = JSON.parse(JSON.stringify(n))
this.editModel.panelId = n.panelId ? n.panelId + '' : ''
this.editModel.dashboardId = n.dashboardId ? n.dashboardId + '' : ''
}
}
},
@@ -183,7 +183,7 @@ export default {
if (valid) {
const params = {
...this.editModel,
panelId: this.editModel.panelId == '' ? null : Number(this.editModel.panelId)
dashboardId: this.editModel.dashboardId == '' ? null : Number(this.editModel.dashboardId)
}
if (this.editModel.id) {
this.$put(this.url, params).then(res => {
@@ -258,13 +258,13 @@ export default {
},
// /* 获取chart列表数据 */
// ChartTemplateList () {
// this.$get('visual/panel/chart', { pageSize: -1, varType: 1, panelId: 0, groupId: 0, returnChildren: 0 }).then(res => {
// this.$get('visual/dashboard/chart', { pageSize: -1, varType: 1, dashboardId: 0, groupId: 0, returnChildren: 0 }).then(res => {
// this.chartlList = res.data.list
// })
// },
/* 获取Dashboard列表数据 */
DashboardTemplateList () {
this.$get('visual/panel', { pageSize: -1, varType: 1, type: 'template' }).then(res => {
this.$get('visual/dashboard', { pageSize: -1, varType: 1, type: 'template' }).then(res => {
this.dashboardList = res.data.list
})
},

View File

@@ -18,7 +18,7 @@
:data="moduleList"
:tb-columns="ChartSearchShowFields"
:params="{
varType: 2, panelId: 0,
varType: 2, dashboardId: 0,
returnChildren:0,groupId:0,
}"
:multiple="true"
@@ -37,7 +37,7 @@
:data="assetDataList"
:tb-columns="columns"
:params="{
varType: 2, panelId: 0,
varType: 2, dashboardId: 0,
returnChildren:0,groupId:0,
}"
:multiple="true"

View File

@@ -234,7 +234,7 @@ export default {
const arr = [this.$refs.chartForm.validate()]
arr.push(this.$refs['childrenFrom' + this.editChart.datasource].$refs.chartForm.validate())
Promise.all(arr).then(res => {
this.editChart.panelId = this.panelId
this.editChart.dashboardId = this.dashboardId
const params = JSON.parse(JSON.stringify(this.editChart))
if (params.param.valueMapping) {
params.param.valueMapping.forEach(item => {
@@ -284,19 +284,19 @@ export default {
params.param.datasource[0].filter = params.param.datasource[0].filter.filter(item => item.value)
}
if (params.id) { // 修改
this.$put('visual/panel/chart', params).then(response => {
this.$put('visual/dashboard/chart', params).then(response => {
if (response.code === 200) {
this.$message({ duration: 1000, type: 'success', message: this.$t('tip.saveSuccess') })
if (resetFlag) {
bus.$emit('creat-chart-success', {
...params,
cb: function () {
self.$emit('on-create-success', { id: this.panelId, name: this.panelName })
self.$emit('on-create-success', { id: this.dashboardId, name: this.panelName })
self.esc(true)
}
})
} else {
self.$emit('on-create-success', { id: this.panelId, name: this.panelName })
self.$emit('on-create-success', { id: this.dashboardId, name: this.panelName })
self.esc(true)
}
} else {
@@ -304,19 +304,19 @@ export default {
}
})
} else { // 新增
this.$post('visual/panel/chart', params).then(response => {
this.$post('visual/dashboard/chart', params).then(response => {
if (response.code === 200) {
this.$message({ duration: 1000, type: 'success', message: this.$t('tip.saveSuccess') })
if (resetFlag) {
bus.$emit('creat-chart-success', {
...params,
cb: function () {
self.$emit('on-create-success', { id: this.panelId, name: this.panelName })
self.$emit('on-create-success', { id: this.dashboardId, name: this.panelName })
self.esc(true)
}
})
} else {
self.$emit('on-create-success', { id: this.panelId, name: this.panelName })
self.$emit('on-create-success', { id: this.dashboardId, name: this.panelName })
self.esc(true)
}
} else {
@@ -332,9 +332,9 @@ export default {
selectPanel (panel) {
this.panelName = panel.name
this.editChart.panelName = panel.name
this.panelId = panel.id
this.dashboardId = panel.id
this.editChart.groupId = ''
this.$get('visual/panel/chart?panelId=' + this.panelId + '&pageSize=-1').then(response => {
this.$get('visual/dashboard/chart?dashboardId=' + this.dashboardId + '&pageSize=-1').then(response => {
if (response.code === 200) {
this.groupArr = []
response.data.list.forEach((item, index) => {
@@ -352,7 +352,7 @@ export default {
this.$emit('reloadOnlyPanel')
},
getGroupList () {
this.$get('visual/panel/chart?panelId=' + this.panelId + '&pageSize=-1').then(response => {
this.$get('visual/dashboard/chart?dashboardId=' + this.dashboardId + '&pageSize=-1').then(response => {
if (response.code === 200) {
this.groupArr = []
response.data.list.forEach((item, index) => {
@@ -525,7 +525,7 @@ export default {
deep: true,
handler () {
if (this.showPanel && (this.showPanel.id || this.from === 'chartTemp')) {
this.panelId = this.showPanel.id
this.dashboardId = this.showPanel.id
this.panelName = this.showPanel.name
this.editChart.panelName = this.showPanel.name
}

View File

@@ -43,7 +43,7 @@
:data="chartTempArr"
:tb-columns="ChartSearchShowFields"
:params="{
varType: 2, panelId: 0,
varType: 2, dashboardId: 0,
returnChildren:0,groupId:0,
}"
:multiple="false"
@@ -111,7 +111,7 @@ export default {
return {
fromRoute,
editChartTemp: {},
url: 'visual/panel/chart/fromTmpl',
url: 'visual/dashboard/chart/fromTmpl',
rules: { // 表单校验规则
varType: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
@@ -330,7 +330,7 @@ export default {
// dc, brand, model, type
},
getChartTempData () {
this.$get('visual/panel/chart', { pageSize: -1, panelId: 0, returnChildren: 0, varType: this.editChartTemp.varType, groupId: 0 }).then(response => {
this.$get('visual/dashboard/chart', { pageSize: -1, dashboardId: 0, returnChildren: 0, varType: this.editChartTemp.varType, groupId: 0 }).then(response => {
if (response.code === 200) {
this.chartTempArr = response.data.list
}

View File

@@ -79,7 +79,7 @@ export default {
mixins: [editRigthBox],
data () {
return {
url: '/visual/panel/fromTmpl',
url: '/visual/dashboard/fromTmpl',
rules: {
name: [
{ required: true, message: this.$t('validate.required'), trigger: 'blur' }
@@ -224,7 +224,7 @@ export default {
}, 50),
// 获取dashboard模板列表
getDashboardTempData () {
this.$get('visual/panel', { type: 'template', pageSize: -1 }).then(response => {
this.$get('visual/dashboard', { type: 'template', pageSize: -1 }).then(response => {
if (response.code === 200) {
this.templateList = response.data.list
}

View File

@@ -47,7 +47,7 @@
:data="assetList"
:tb-columns="columns"
:params="{
varType: 2, panelId: 0,
varType: 2, dashboardId: 0,
returnChildren:0,groupId:0,
}"
@values="renderEndpoint"
@@ -89,7 +89,7 @@
<!-- :language="language"-->
<!-- :multiple="true"-->
<!-- :params="{-->
<!-- varType: 2, panelId: 0,-->
<!-- varType: 2, dashboardId: 0,-->
<!-- returnChildren:0,groupId:0,-->
<!-- }"-->
<!-- :result-format="resultFormat"-->
@@ -1471,7 +1471,7 @@ export default {
},
/* 获取chart列表数据 */
ChartTemplateList () {
this.$get('visual/panel/chart', { pageSize: -1, varType: 2, panelId: 0, returnChildren: 0, groupId: 0 }).then(res => {
this.$get('visual/dashboard/chart', { pageSize: -1, varType: 2, dashboardId: 0, returnChildren: 0, groupId: 0 }).then(res => {
this.chartTempList = res.data.list
})
},

View File

@@ -66,7 +66,7 @@
:data="assetList"
:tb-columns="columns"
:params="{
varType: 1, panelId: 0,
varType: 1, dashboardId: 0,
returnChildren:0,groupId:0,
}"
:multiple="true"
@@ -278,7 +278,7 @@ export default {
methods: {
/* 获取asset列表数据 */
assetTemplateList () {
this.$get('asset/asset', { pageSize: -1, varType: 1, panelId: 0, groupId: 0 }).then(res => {
this.$get('asset/asset', { pageSize: -1, varType: 1, dashboardId: 0, groupId: 0 }).then(res => {
this.assetList = res.data.list
})
},

View File

@@ -61,7 +61,7 @@
></el-autocomplete>
</el-form-item>
<!-- DashboardTemplate -->
<el-form-item :label="$t('model.dashboardtemplate')" prop="panelId" ref="dashboardTemplate">
<el-form-item :label="$t('model.dashboardtemplate')" prop="dashboardId" ref="dashboardTemplate">
<v-selectpage
:data="dashboardList"
:tb-columns="DashboardSearchShowFields"
@@ -72,10 +72,10 @@
title="DashboardSearch"
key-field="id"
:width="634"
v-model="editModule.panelId"
v-model="editModule.dashboardId"
show-field="name"
class="form-control"
@values="(data) => {editModule.panelId = data.map(d => d.id).join(',')}"
@values="(data) => {editModule.dashboardId = data.map(d => d.id).join(',')}"
:result-format="resultFormat"
></v-selectpage>
</el-form-item>
@@ -1109,7 +1109,7 @@ export default {
}
if (valid) {
this.prevent_opt.save = true
params.panelId = this.editModule.panelId !== '' ? Number(this.editModule.panelId) : null
params.dashboardId = this.editModule.dashboardId !== '' ? Number(this.editModule.dashboardId) : null
if (this.editModule.id) {
this.$put('monitor/module', params).then(response => {
if (response.code === 200) {
@@ -1502,7 +1502,7 @@ export default {
},
/* 获取Dashboard列表数据 */
DashboardTemplateList () {
this.$get('visual/panel', { pageSize: -1, varType: 2, type: 'template' }).then(res => {
this.$get('visual/dashboard', { pageSize: -1, varType: 2, type: 'template' }).then(res => {
this.dashboardList = res.data.list
})
},
@@ -1579,7 +1579,7 @@ export default {
handler (n, o) {
this.isEdit = true
this.editModule = JSON.parse(JSON.stringify(n))
this.editModule.panelId = n.panelId ? n.panelId + '' : ''
this.editModule.dashboardId = n.dashboardId ? n.dashboardId + '' : ''
this.activeName = 'Basic'
this.activeNameLogs = this.editModule.configs[1].config.map(() => 'Basic')
this.logsCopyValue = this.editModule.configs[1].config.map(() => '')

View File

@@ -381,7 +381,7 @@ export default {
mixins: [editRigthBox],
data () {
return {
url: 'visual/panel',
url: 'visual/dashboard',
editPanel: {},
isShow: 0,
userData: [],

View File

@@ -106,13 +106,13 @@ export default {
})
const params = {
format: 'html',
panelId: this.showPanel.id,
dashboardId: this.showPanel.id,
start: this.$stringTimeParseToUnix(bus.formateTimeToTime(this.searchTime[0])),
end: this.$stringTimeParseToUnix(bus.formateTimeToTime(this.searchTime[1])),
vars: vars
}
// 创建任务
const res = await this.$post('/visual/panel/snapshot/task', params)
const res = await this.$post('/visual/dashboard/snapshot/task', params)
if (res.code === 200) {
this.tid = res.data.tid
this.getResult()
@@ -123,7 +123,7 @@ export default {
this.task = setInterval(async () => {
if (this.process < 100) {
try {
const res = await this.$get('/visual/panel/snapshot/result/' + this.tid)
const res = await this.$get('/visual/dashboard/snapshot/result/' + this.tid)
this.total = res.data.taskId.total
this.done = res.data.taskId.done
this.process = parseFloat(res.data.taskId.process)
@@ -137,7 +137,7 @@ export default {
},
// 导出快照
downloadSnapshot () {
this.$get('/visual/panel/snapshot/download/' + this.tid, {}, 'blob').then(res => {
this.$get('/visual/dashboard/snapshot/download/' + this.tid, {}, 'blob').then(res => {
const self = this
const fileName = this.showPanel.name
if (res.type == 'application/json') {
@@ -204,7 +204,7 @@ export default {
beforeDestroy () {
this.clearTimer()
if (this.tid) {
this.$get('/visual/panel/snapshot/cancel/' + this.tid)
this.$get('/visual/dashboard/snapshot/cancel/' + this.tid)
}
}
}

View File

@@ -12,7 +12,7 @@
@header-dragend="dragend"
@sort-change="tableDataSort"
@selection-change="selectionChange"
@row-dblclick="(row)=>{$emit('showBottomBox', 'panelTab', row)}"
@row-dblclick="(row)=>{$emit('showBottomBox', 'dashboardTab', row)}"
>
<el-table-column
:resizable="false"
@@ -156,7 +156,7 @@
<div slot="header" class="table-operation-title">{{$t('overall.option')}}</div>
<div slot-scope="scope" class="table-operation-items">
<button v-if="assetTab" class="table-operation-item" v-has="'model_edit'" @click="$emit('edit', scope.row)" :title="$t('overall.edit')"><i class="nz-icon nz-icon-edit"></i></button>
<button v-else class="table-operation-item" @click="$emit('showBottomBox', 'panelTab', scope.row)" :title="$t('overall.view')"><i class="nz-icon nz-icon-view1"></i></button>
<button v-else class="table-operation-item" @click="$emit('showBottomBox', 'dashboardTab', scope.row)" :title="$t('overall.view')"><i class="nz-icon nz-icon-view1"></i></button>
<el-dropdown size="medium" v-has="['asset_edit','asset_connect','asset_add','asset_delete', 'alertSilence_add']" trigger="click" @command="tableOperation">
<div class="table-operation-item table-operation-item--more" :title="$t('overall.moreOperations')">
<i class="nz-icon nz-icon-more3"></i>

View File

@@ -9,7 +9,7 @@
@header-dragend="dragend"
@sort-change="tableDataSort"
@selection-change="selectionChange"
@row-dblclick="(row)=>{showBottomBox('panel', row)}"
@row-dblclick="(row)=>{showBottomBox('dashboardTab', row)}"
>
<el-table-column
:resizable="false"
@@ -58,7 +58,7 @@
fixed="right">
<div slot="header" class="table-operation-title">{{$t('overall.option')}}</div>
<div slot-scope="scope" class="table-operation-items">
<button class="table-operation-item" @click="showBottomBox('panel', scope.row)" :title="$t('overall.view')"><i class="nz-icon nz-icon-view1"></i></button>
<button class="table-operation-item" @click="showBottomBox('dashboardTab', scope.row)" :title="$t('overall.view')"><i class="nz-icon nz-icon-view1"></i></button>
<el-dropdown size="medium" v-has="['chartTemplate_edit','chartTemplate_delete']" trigger="click" @command="tableOperation">
<div class="table-operation-item table-operation-item--more" :title="$t('overall.moreOperations')">
<i class="nz-icon nz-icon-more3"></i>

View File

@@ -9,7 +9,7 @@
@header-dragend="dragend"
@sort-change="tableDataSort"
@selection-change="selectionChange"
@row-dblclick="(row)=>{showBottomBox('panel', row)}"
@row-dblclick="(row)=>{showBottomBox('dashboardTab', row)}"
>
<el-table-column
:resizable="false"
@@ -58,7 +58,7 @@
fixed="right">
<div slot="header" class="table-operation-title">{{$t('overall.option')}}</div>
<div slot-scope="scope" class="table-operation-items">
<button class="table-operation-item" @click="showBottomBox('panel', scope.row)" :title="$t('overall.view')"><i class="nz-icon nz-icon-view1"></i></button>
<button class="table-operation-item" @click="showBottomBox('dashboardTab', scope.row)" :title="$t('overall.view')"><i class="nz-icon nz-icon-view1"></i></button>
<el-dropdown size="medium" v-has="['dashboard_temp_add','dashboard_temp_edit','dashboard_temp_delete']" trigger="click" @command="tableOperation">
<div class="table-operation-item table-operation-item--more" :title="$t('overall.moreOperations')">
<i class="nz-icon nz-icon-more3"></i>

View File

@@ -11,7 +11,7 @@
@cell-mouse-enter="cellMouseEnter"
@sort-change="tableDataSort"
@selection-change="selectionChange"
@row-dblclick="(row)=>{$emit('showBottomBox', 'panelTab', row)}"
@row-dblclick="(row)=>{$emit('showBottomBox', 'dashboardTab', row)}"
>
<el-table-column
:resizable="false"
@@ -169,7 +169,7 @@
<div slot="header" class="table-operation-title">{{$t('overall.option')}}</div>
<div slot-scope="scope" class="table-operation-items">
<button v-if="endpointTab" class="table-operation-item" v-has="'monitor_endpoint_edit'" @click="$emit('edit', scope.row)" :title="$t('overall.edit')"><i class="nz-icon nz-icon-edit"></i></button>
<button v-else class="table-operation-item" @click="$emit('showBottomBox', 'panelTab', scope.row)" :title="$t('overall.view')"><i class="nz-icon nz-icon-view1"></i></button>
<button v-else class="table-operation-item" @click="$emit('showBottomBox', 'dashboardTab', scope.row)" :title="$t('overall.view')"><i class="nz-icon nz-icon-view1"></i></button>
<el-dropdown size="medium" v-has="['monitor_endpoint_edit','monitor_endpoint_delete','alertSilence_add']" trigger="click" @command="tableOperation">
<div class="table-operation-item table-operation-item--more" :title="$t('overall.moreOperations')">
<i class="nz-icon nz-icon-more3"></i>

View File

@@ -64,8 +64,8 @@
</template>
</copy>
</template>
<template v-else-if="item.prop === 'panel'">
{{scope.row.panel ? scope.row.panel.name : '-'}}
<template v-else-if="item.prop === 'dashboard'">
{{scope.row.dashboard ? scope.row.dashboard.name : '-'}}
</template>
<span v-else-if="item.prop === 'createTime'">{{utcTimeToTimezoneStr(scope.row[item.prop])}}</span>
<template v-else-if="item.prop === 'assetNum'">
@@ -156,7 +156,7 @@ export default {
show: true
}, {
label: this.$t('model.dashboardtemplate'),
prop: 'panel',
prop: 'dashboard',
minWidth: 200,
show: false
}, {

View File

@@ -76,8 +76,8 @@
/>
</span>
</template>
<template v-else-if="item.prop === 'panel'">
{{scope.row.panel ? scope.row.panel.name : '-'}}
<template v-else-if="item.prop === 'dashboard'">
{{scope.row.dashboard ? scope.row.dashboard.name : '-'}}
</template>
<span v-else-if="item.prop === 'id'" :id="'globalSearch' + scope.row.id">{{scope.row[item.prop]}}</span>
<span v-else-if="scope.row[item.prop]">{{scope.row[item.prop]}}</span>
@@ -167,7 +167,7 @@ export default {
sortable: 'custom'
}, {
label: this.$t('model.dashboardtemplate'),
prop: 'panel',
prop: 'dashboard',
minWidth: 150,
show: false
}, {

View File

@@ -71,9 +71,6 @@
@showFullscreen="showFullscreen"
></panel-chart>
</el-dialog>
<transition name="right-box">
<chart-box :chart="chart" :panel-data="panelData" :show-panel="{id: -1, name: '', type: 'endpointQuery'}" @close="rightBox.show = false" @on-create-success="createSuccess" @reload="getPanelData" @reloadOnlyPanel="getPanelData" box-class="save-chart-box" from="project_endpoint_query" ref="addChartModal" v-if="rightBox.show" style="z-index: 2900" :fromEndpoint="true"></chart-box>
</transition>
<transition name="right-box">
<chart-right-box
v-if="chartRightBoxShow"
@@ -81,7 +78,7 @@
ref="addChartModal"
:chart="chart"
:showPanel="{}"
:from="fromRoute.panel"
:from="fromRoute.dashboard"
:panel-data="panelData"
@close="closeChartBox"
@on-create-success="createSuccess"
@@ -93,7 +90,6 @@
<script>
import chartRightBox from '@/components/common/rightBox/chart/chartRightBox'
import bus from '../../../../libs/bus'
import chart from '@/components/page/dashboard/overview/chart'
import { sameLabels, fromRoute } from '@/components/common/js/constants'
import metaData from '@/components/common/metaData'
import panelChart from '@/components/chart/panelChart'
@@ -102,7 +98,6 @@ import lineData from '@/components/chart/defaultLineData'
export default {
name: 'endpointQueryTab',
components: {
chart,
metaData,
panelChart,
chartRightBox
@@ -168,7 +163,13 @@ export default {
pageNo: 1,
total: 0
},
metaDataList: []
metaDataList: [],
letter: [
'A', 'B', 'C', 'D', 'E', 'F', 'G',
'H', 'I', 'J', 'K', 'L', 'M', 'N',
'O', 'P', 'Q', 'R', 'S', 'T',
'U', 'V', 'W', 'X', 'Y', 'Z'
]
}
},
methods: {
@@ -215,7 +216,7 @@ export default {
},
getPanelData () { // 获取panel数据
return new Promise((resolve, reject) => {
this.$get('visual/panel?pageNo=1&pageSize=-1').then(response => {
this.$get('visual/dashboard?pageNo=1&pageSize=-1').then(response => {
if (response.code === 200) {
this.panelData = response.data.list
resolve()
@@ -362,6 +363,9 @@ export default {
element.expression = endpoint.element
chartInfo.elements.push(element)
}
chartInfo.elements.forEach((item, index) => {
item.name = this.transformNumToLetter(index)
})
this.showFullscreen(true, chartInfo)
})
},
@@ -379,7 +383,7 @@ export default {
})
},
createSuccess (panel) {
this.$confirm(this.$t('dashboard.metric.goPanelTip'), this.$t('tip.saveSuccess'), {
this.$confirm(this.$t('dashboard.metric.goDashboardTip'), this.$t('tip.saveSuccess'), {
confirmButtonText: this.$t('tip.yes'),
cancelButtonText: this.$t('tip.no'),
type: 'success'
@@ -388,7 +392,7 @@ export default {
this.$store.state.showPanel.id = panel.id
this.$store.state.showPanel.name = panel.name
this.$router.push({
path: '/panel',
path: '/dashboard',
query: {
t: +new Date()
}
@@ -429,6 +433,16 @@ export default {
/* if (refresh) {
this.getData(this.filter)
} */
},
transformNumToLetter (num) { // 相当于26进制 获取idaddExpression
const self = this
let letter = ''
const loopNum = parseInt(num / 26)
if (loopNum > 0) {
letter += this.transformNumToLetter(loopNum - 1)
}
letter += self.letter[num % 26]
return letter
}
},
computed: {

View File

@@ -78,7 +78,7 @@
ref="addChartModal"
:chart="chart"
:showPanel="{}"
:from="fromRoute.panel"
:from="fromRoute.dashboard"
:panel-data="panelData"
@close="closeChartBox"
@on-create-success="createSuccess"
@@ -210,7 +210,7 @@ export default {
},
getPanelData () { // 获取panel数据
return new Promise((resolve, reject) => {
this.$get('visual/panel?pageNo=1&pageSize=-1').then(response => {
this.$get('visual/dashboard?pageNo=1&pageSize=-1').then(response => {
if (response.code === 200) {
this.panelData = response.data.list
resolve()
@@ -374,7 +374,7 @@ export default {
})
},
createSuccess (panel) {
this.$confirm(this.$t('dashboard.metric.goPanelTip'), this.$t('tip.saveSuccess'), {
this.$confirm(this.$t('dashboard.metric.goDashboardTip'), this.$t('tip.saveSuccess'), {
confirmButtonText: this.$t('tip.yes'),
cancelButtonText: this.$t('tip.no'),
type: 'success'
@@ -383,7 +383,7 @@ export default {
this.$store.state.showPanel.id = panel.id
this.$store.state.showPanel.name = panel.name
this.$router.push({
path: '/panel',
path: '/dashboard',
query: {
t: +new Date()
}

View File

@@ -376,6 +376,8 @@ export default {
'date-range-history' + this.sign,
JSON.stringify(this.rangeHistory)
)
console.log(this.sign)
this.$set(this.searchTime, 2, '')
this.showDropdown()
this.getRangeHistoryArr()

View File

@@ -105,7 +105,7 @@ export default {
id: '',
name: '',
// chartIds: '',
panelId: '',
dashboardId: '',
sysObjectId: '',
type: { id: '', name: '' },
remark: ''
@@ -145,7 +145,7 @@ export default {
type: 'warning'
}).then(() => {
this.$store.dispatch('dispatchHomeLoading', true)
this.$post('visual/panel/syncTmpl', { model: row.id }).then(res => {
this.$post('visual/dashboard/syncTmpl', { model: row.id }).then(res => {
this.$store.dispatch('dispatchHomeLoading', false)
if (res.code === 200) {
this.getTableData()

View File

@@ -18,12 +18,12 @@
:delete-objs="batchDeleteObjs"
ref="export"
id="expression-template-list"
export-url="/visual/panel/export"
import-url="/visual/panel/import"
export-url="/visual/dashboard/export"
import-url="/visual/dashboard/import"
export-file-name="chart-temp"
:params="searchLabel"
:params2="{
panelId:0,
dashboardId:0,
returnChildren: 0,
groupId: 0
}"
@@ -130,7 +130,7 @@ export default {
},
data () {
return {
url: 'visual/panel/chart',
url: 'visual/dashboard/chart',
tableId: 'chartTemp',
orderBy: 'id',
/* 搜素相关 */
@@ -208,7 +208,7 @@ export default {
methods: {
add () {
this.object = this.newObject()
this.object.panelId = 0
this.object.dashboardId = 0
this.object.panelName = 'template'
this.object.param.thresholds = [{ value: undefined, color: randomcolor() }]
this.rightBox.show = true
@@ -218,7 +218,7 @@ export default {
this.object = JSON.parse(JSON.stringify(data))
this.object.x = 0
this.object.y = 0
this.object.panelId = this.showPanel.id
this.object.dashboardId = this.showPanel.id
this.object.panelName = this.showPanel.name
this.object.id = ''
this.object.elements.forEach((item) => {
@@ -237,12 +237,12 @@ export default {
this.object = {}
this.rightBox.show = true
this.rightBox.loading = true
this.$get('visual/panel/chart/' + data.id).then(res => {
this.$get('visual/dashboard/chart/' + data.id).then(res => {
this.rightBox.loading = false
if (res.code === 200) {
const chartData = res.data
this.object = JSON.parse(JSON.stringify(chartData))
this.object.panelId = this.showPanel.id
this.object.dashboardId = this.showPanel.id
this.object.panelName = this.showPanel.name
this.object.param = JSON.parse(this.object.param)
if (!this.object.groupId || this.object.groupId == -1) {
@@ -281,7 +281,7 @@ export default {
},
chartBySync (row) {
this.$store.dispatch('dispatchHomeLoading', true)
this.$post('visual/panel/chart/syncTmpl', { pid: row.id }).then(res => {
this.$post('visual/dashboard/chart/syncTmpl', { pid: row.id }).then(res => {
this.$store.dispatch('dispatchHomeLoading', false)
if (res.code === 200) {
this.getTableData()
@@ -306,7 +306,7 @@ export default {
this.$set(this.searchLabel, 'pageSize', this.pageObj.pageSize)
this.tools.loading = true
this.updatePath({ ...this.searchLabel, ...this.searchCheckBox, switchTab: this.switchTab })
this.$get(this.url, { ...this.searchLabel, ...this.searchCheckBox, panelId: 0, returnChildren: 0, groupId: 0 }).then(response => {
this.$get(this.url, { ...this.searchLabel, ...this.searchCheckBox, dashboardId: 0, returnChildren: 0, groupId: 0 }).then(response => {
this.tools.loading = false
if (response.code === 200) {
for (let i = 0; i < response.data.list.length; i++) {

View File

@@ -18,8 +18,8 @@
:delete-objs="batchDeleteObjs"
ref="export"
id="dashboard-template-list"
export-url="/visual/panel/export"
import-url="/visual/panel/import"
export-url="/visual/dashboard/export"
import-url="/visual/dashboard/import"
export-file-name="dashboard-temp"
:params="searchLabel"
:paramsType="'template'"
@@ -100,7 +100,7 @@ export default {
data () {
return {
detailType: 'list',
url: 'visual/panel',
url: 'visual/dashboard',
tableId: 'dashboardTemp',
orderBy: 'id',
/* 搜素相关 */
@@ -133,7 +133,7 @@ export default {
},
methods: {
add () {
if (!this.hasButton('panel_view')) {
if (!this.hasButton('dashboard_view')) {
return
}
this.rightBox.show = true
@@ -163,7 +163,7 @@ export default {
}
},
edit (u) {
this.$get('visual/panel/' + u.id).then(res => {
this.$get('visual/dashboard/' + u.id).then(res => {
if (res.code === 200) {
this.object = res.data
if (!this.$loadsh.get(this.object, 'param.report', '')) {
@@ -211,7 +211,7 @@ export default {
cancelButtonText: this.$t('tip.no'),
type: 'warning'
}).then(() => {
this.$post('/visual/panel/duplicate/' + u.id).then(res => {
this.$post('/visual/dashboard/duplicate/' + u.id).then(res => {
if (res.code === 200) {
this.getTableData()
this.$message({ duration: 1000, type: 'success', message: this.$t('tip.saveSuccess') })
@@ -229,7 +229,7 @@ export default {
type: 'warning'
}).then(() => {
this.$store.dispatch('dispatchHomeLoading', true)
this.$post('visual/panel/syncTmpl', { tmplId: row.id }).then(res => {
this.$post('visual/dashboard/syncTmpl', { tmplId: row.id }).then(res => {
this.$store.dispatch('dispatchHomeLoading', false)
if (res.code === 200) {
this.getTableData()

View File

@@ -1,5 +1,5 @@
<template>
<div class="panel list-page" v-my-loading="panelTabLoading">
<div class="panel list-page" v-my-loading="dashboardLoading">
<div class="main-list">
<div>
<transition name="el-zoom-in-center">
@@ -9,7 +9,7 @@
<div class="main-container">
<div class="top-tools panel-top-tools" :class="showTopLine? 'panel-top-tools-bottom' : ''">
<div v-if="panelData.length === 0" class="top-tool-left" style="margin-left: 10px;">
<button id="panel-add-panel" class="nz-btn nz-btn-style-light nz-btn-size-small" @click="toAdd"><i class="nz-icon nz-icon-create-square"></i>&nbsp;&nbsp;{{$t("overall.addDashboard")}}</button>
<button id="dashboard-add-panel" class="nz-btn nz-btn-style-light nz-btn-size-small" v-has="'main_add'" @click="toAdd"><i class="nz-icon nz-icon-create-square"></i>&nbsp;&nbsp;{{$t("overall.addDashboard")}}</button>
</div>
<template v-else>
<div class="top-tool-left" style="cursor: pointer;">
@@ -73,8 +73,8 @@
:paramsType="'dashboard'"
class="top-tool-export"
export-file-name="chart"
export-url="/visual/panel/export"
import-url="/visual/panel/import"
export-url="/visual/dashboard/export"
import-url="/visual/dashboard/import"
:exportBoxShow="true"
@export="exportType"
@afterImport="afterImport"
@@ -91,7 +91,7 @@
<el-dropdown-item v-has="'main_edit'">
<div id="chart-temp-sync" @click="chartBySync"><i class="nz-icon nz-icon-sync"></i>{{ $t('overall.syncChart') }}</div>
</el-dropdown-item> -->
<el-dropdown-item v-has="'panel_view'">
<el-dropdown-item v-has="'dashboard_view'">
<div id="chart-export-html" @click="exportType"><i class="nz-icon nz-icon-kuaizhao"></i>{{ $t('overall.snapshoot') }}</div>
</el-dropdown-item>
</template>
@@ -106,13 +106,13 @@
<chart-list
ref="chartList"
:variablesInit="variablesInit"
name="panel"
:panelId="showPanel.id"
name="dashboard"
:dashboardId="showPanel.id"
:class="{'show-top':showTopBtn, 'is-dashboard': true}"
:data-list="dataList"
:is-export-html="false"
:nowTimeType="nowTimeType"
:from="fromRoute.panel"
:from="fromRoute.dashboard"
:time-range="searchTime"
@edit-chart="editChart"
@on-refresh-time="refreshTime"
@@ -135,7 +135,7 @@
v-my-loading="rightBox.loading"
ref="addChartModal"
:chart="chart"
:from="fromRoute.panel"
:from="fromRoute.dashboard"
:panel-data="panelData"
:show-panel="showPanel"
@close="closeChartBox"
@@ -147,14 +147,14 @@
></chart-right-box>
</transition>
<transition name="right-box">
<chart-temp-box v-if="rightBox.chartTemp.show" :from="fromRoute.panel" :obj="chart" :panel-data="panelData" :show-panel="showPanel" @close="closeChartTempBox" @on-create-success="createSuccess"></chart-temp-box>
<chart-temp-box v-if="rightBox.chartTemp.show" :from="fromRoute.dashboard" :obj="chart" :panel-data="panelData" :show-panel="showPanel" @close="closeChartTempBox" @on-create-success="createSuccess"></chart-temp-box>
</transition>
<transition name="right-box">
<panel-box v-if="rightBox.panel.show" :from="fromRoute.panel" ref="panelBox" :obj="panel" @close="closePanelBox" @reload="panelReload" @reloadForDel="panelReloadForDel" ></panel-box>
<panel-box v-if="rightBox.panel.show" :from="fromRoute.dashboard" ref="panelBox" :obj="panel" @close="closePanelBox" @reload="panelReload" @reloadForDel="panelReloadForDel" ></panel-box>
</transition>
<!-- dashboard模板 -->
<transition name="right-box">
<dashboardTempBox v-if="rightBox.dashboardTemp.show" :from="fromRoute.panel" @close="closeDashboardTempBox"></dashboardTempBox>
<dashboardTempBox v-if="rightBox.dashboardTemp.show" :from="fromRoute.dashboard" @close="closeDashboardTempBox"></dashboardTempBox>
</transition>
<!-- 快照进度 -->
<snapshotProgress v-if="snapshotVisible" :showPanel="showPanel" :searchTime="searchTime" :snapshotVisible.sync="snapshotVisible"></snapshotProgress>
@@ -183,14 +183,14 @@ import dashboardTempBox from '@/components/common/rightBox/dashboardTempBox'
// import FileSaver from 'file-saver'
// import chartData from './testData'
export default {
name: 'panel',
name: 'dashboard',
mixins: [routerPathParams, htmlToPdfMixin, exportHtmlMixin],
data () {
return {
fromRoute,
pdfId: 'pdfDom',
htmlTitle: 'panel',
panelTabLoading: false,
htmlTitle: 'dashboard',
dashboardLoading: false,
overScroll10: false,
isLoading: true,
showTopBtn: false, // top按钮
@@ -210,7 +210,7 @@ export default {
showPanel: { // panel下拉列表
id: '',
name: '',
type: 'panel'
type: 'dashboard'
},
panel: { // 新增panel
id: '',
@@ -275,7 +275,7 @@ export default {
blankChartTemp: {
varType: 1,
pid: '',
panelId: '',
dashboardId: '',
varIds: []
},
panelData: [],
@@ -312,13 +312,13 @@ export default {
// ---图表相关参数--start
dataList: [], // 数据列表
filter: { // 过滤条件
panelId: 0,
dashboardId: 0,
start_time: '',
end_time: '',
searchName: '',
id: 4
},
panelId: 0,
dashboardId: 0,
// ---图表相关参数--end
scrollbarWrap: null,
batchDeleteObjs: [],
@@ -392,17 +392,17 @@ export default {
this.showPanel = val
this.variables = this.$loadsh.cloneDeep(this.$loadsh.get(this, 'showPanel.param.variables', []) || [])
this.showPanel.type = 'dashboard'
this.filter.panelId = this.showPanel.id
this.panelId = this.showPanel.id
this.filter.dashboardId = this.showPanel.id
this.dashboardId = this.showPanel.id
const param = {
panelId: this.panelId,
dashboardId: this.dashboardId,
nowTimeType: JSON.stringify(this.nowTimeType),
searchTime: JSON.stringify(this.searchTime),
mode: this.mode
}
// this.getTableData()
// this.getData(this.filter)
const path = this.fromRoute.panel
const path = this.fromRoute.dashboard
this.updatePath(param, path)
this.dateChange()
this.$refs.chartList.cleanData()
@@ -414,7 +414,7 @@ export default {
cancelButtonText: this.$t('tip.no'),
type: 'warning'
}).then(() => {
this.$delete('visual/panel?ids=' + u.id).then(response => {
this.$delete('visual/dashboard?ids=' + u.id).then(response => {
if (response.code === 200) {
this.$message({
duration: 1000,
@@ -422,12 +422,12 @@ export default {
message: this.$t('tip.deleteSuccess')
})
const param = {
panelId: 0,
dashboardId: 0,
nowTimeType: JSON.stringify(this.nowTimeType),
searchTime: JSON.stringify(this.searchTime),
mode: this.mode
}
const path = this.fromRoute.panel
const path = this.fromRoute.dashboard
this.updatePath(param, path)
this.getTableData(true)
} else {
@@ -440,7 +440,7 @@ export default {
})
},
edit (u) {
this.$get('visual/panel/' + u.id).then(res => {
this.$get('visual/dashboard/' + u.id).then(res => {
if (res.code === 200) {
this.panel = res.data
if (!this.$loadsh.get(this.panel, 'param.report', '')) {
@@ -484,9 +484,10 @@ export default {
// this.panel = Object.assign({}, u)
},
toAdd () {
if (!this.hasButton('panel_view')) {
if (!this.hasButton('dashboard_view')) {
return
}
console.log(this.rightBox.panel.show)
this.rightBox.panel.show = true
// 关闭selectDashboard弹框
this.$refs.selectDashboard && this.$refs.selectDashboard.esc()
@@ -512,7 +513,6 @@ export default {
chartShare: 'none'
}
}
// this.$refs.panelBox.setTitle(this.$t('dashboard.panel.createPanelTitle'))
},
panelReload (clearShowPanel) {
this.getTableData(clearShowPanel)
@@ -532,7 +532,7 @@ export default {
addChart () {
this.chart = this.newChart()
this.chart.param.thresholds = [{ value: undefined, color: randomcolor() }]
this.chart.panelId = this.showPanel.id
this.chart.dashboardId = this.showPanel.id
this.chart.panelName = this.showPanel.name
this.$nextTick(() => {
this.$refs.addChartModal.isStable = 'stable'
@@ -540,13 +540,13 @@ export default {
},
addChartByTemp () {
this.chart = JSON.parse(JSON.stringify(this.blankChartTemp))
this.chart.panelId = this.showPanel.id
this.chart.dashboardId = this.showPanel.id
this.rightBox.chartTemp.show = true
},
addGroupItem (groupId) {
this.chart = this.newChart()
this.chart.groupId = groupId
this.chart.panelId = this.showPanel.id
this.chart.dashboardId = this.showPanel.id
this.chart.panelName = this.showPanel.name
this.chart.isGroup = true
this.$nextTick(() => {
@@ -562,7 +562,7 @@ export default {
this.chart = JSON.parse(JSON.stringify(data))
this.chart.x = 0
this.chart.y = 0
this.chart.panelId = this.showPanel.id
this.chart.dashboardId = this.showPanel.id
this.chart.panelName = this.showPanel.name
this.chart.id = ''
this.chart.elements.forEach((item) => {
@@ -578,12 +578,12 @@ export default {
}
} else {
this.rightBox.loading = true
this.$get('visual/panel/chart/' + data.id).then(res => {
this.$get('visual/dashboard/chart/' + data.id).then(res => {
this.rightBox.loading = false
if (res.code === 200) {
const chartData = res.data
this.chart = JSON.parse(JSON.stringify(chartData))
this.chart.panelId = this.showPanel.id
this.chart.dashboardId = this.showPanel.id
this.chart.panelName = this.showPanel.name
if (this.chart.param) {
this.chart.param = JSON.parse(this.chart.param)
@@ -639,7 +639,7 @@ export default {
cancelButtonText: this.$t('tip.no'),
type: 'warning'
}).then(() => {
this.$delete('visual/panel/chart?ids=' + data.id).then(response => {
this.$delete('visual/dashboard/chart?ids=' + data.id).then(response => {
if (response.code === 200) {
this.$message({
duration: 2000,
@@ -669,18 +669,18 @@ export default {
})
},
delChartOk () {
this.filter.panelId = this.showPanel.id
this.filter.dashboardId = this.showPanel.id
this.getData(this.filter)
},
// 图表创建成功回调panel页面进行图表的刷新
createSuccess (msg, data, params, panel) {
this.filter.panelId = this.showPanel.id
this.filter.dashboardId = this.showPanel.id
this.getData(this.filter)
this.$store.dispatch('clearPanel')
},
// 获取数据,用在子页面
getData (params) {
if (!this.hasButton('panel_view')) {
if (!this.hasButton('dashboard_view')) {
return
}
this.dataList = []
@@ -704,7 +704,7 @@ export default {
delete le5leObservers[key]
})
}
this.$get('visual/panel/chart?panelId=' + params.panelId + '&groupId=0' + '&pageSize=-1').then(response => {
this.$get('visual/dashboard/chart?dashboardId=' + params.dashboardId + '&groupId=0' + '&pageSize=-1').then(response => {
if (response.code === 200) {
this.chartListLoading = false
this.dataList = response.data.list.map(item => {
@@ -733,12 +733,12 @@ export default {
// this.getTableData()
this.getData(this.filter)
const param = {
panelId: this.panelId,
dashboardId: this.dashboardId,
nowTimeType: JSON.stringify(this.nowTimeType),
searchTime: JSON.stringify(this.searchTime),
mode: this.mode
}
const path = this.fromRoute.panel
const path = this.fromRoute.dashboard
this.updatePath(param, path)
this.$store.dispatch('dispatchPanelTime', {
time: this.searchTime,
@@ -779,10 +779,10 @@ export default {
})
},
panelReloadOnlyPanel () { // 仅刷新panel数据
if (!this.hasButton('panel_view')) {
if (!this.hasButton('dashboard_view')) {
return
}
this.$get('visual/panel?pageSize=-1').then(response => {
this.$get('visual/dashboard?pageSize=-1').then(response => {
if (response.code === 200) {
this.panelData = response.data.list
for (let i = 0; i < this.panelData.length; i++) {
@@ -797,7 +797,7 @@ export default {
getTableData (clearShowPanel) {
const vm = this
this.$get('visual/panel?type=dashboard&pageSize=-1').then(response => {
this.$get('visual/dashboard?type=dashboard&pageSize=-1').then(response => {
if (response.code === 200) {
let isInitData = false
this.panelData = JSON.parse(JSON.stringify(response.data.list))
@@ -810,17 +810,17 @@ export default {
}
if (!this.showPanel.id) {
this.showPanel = response.data.list[0]
this.filter.panelId = this.showPanel.id
this.filter.dashboardId = this.showPanel.id
this.getData(this.filter)
isInitData = true
} else {
handler(response.data.list)
this.filter.panelId = this.showPanel.id
this.filter.dashboardId = this.showPanel.id
}
this.isLoading = false
} else {
this.showPanel.id = ''
this.filter.panelId = ''
this.filter.dashboardId = ''
this.isLoading = !response.data.list.length === 0
}
this.pageObj.total = response.data.total
@@ -1049,12 +1049,12 @@ export default {
}
this.$store.commit('setMode', this.mode)
const param = {
panelId: this.panelId,
dashboardId: this.dashboardId,
nowTimeType: JSON.stringify(this.nowTimeType),
searchTime: JSON.stringify(this.searchTime),
mode: this.mode
}
const path = this.fromRoute.panel
const path = this.fromRoute.dashboard
this.updatePath(param, path)
this.$store.dispatch('dispatchPanelTime', {
time: this.searchTime,
@@ -1077,12 +1077,12 @@ export default {
this.mode = ''
this.$store.commit('setMode', this.mode)
const param = {
panelId: this.panelId,
dashboardId: this.dashboardId,
nowTimeType: JSON.stringify(this.nowTimeType),
searchTime: JSON.stringify(this.searchTime),
mode: this.mode
}
const path = this.fromRoute.panel
const path = this.fromRoute.dashboard
this.updatePath(param, path)
}
},
@@ -1095,15 +1095,15 @@ export default {
const searchKeys = {
// key: path 键
// value: vue set 参数
panelId: { target: this, propertyName: 'panelId', type: 'number' },
dashboardId: { target: this, propertyName: 'dashboardId', type: 'number' },
searchTime: { target: this, propertyName: 'searchTime', type: 'jsonParse' },
nowTimeType: { target: this, propertyName: 'nowTimeType', type: 'jsonParse' },
mode: { target: this, propertyName: 'mode', type: 'string' }
}
this.initQueryFromPath(searchKeys)
setTimeout(() => {
this.showPanel.id = this.panelId
this.filter.panelId = this.panelId
this.showPanel.id = this.dashboardId
this.filter.dashboardId = this.dashboardId
})
// 设置查看模式
this.$store.commit('setMode', this.mode)
@@ -1174,7 +1174,7 @@ export default {
immediate: true,
deep: true,
handler (n) {
localStorage.setItem('panelTime', JSON.stringify(n))
localStorage.setItem('dashboardTime', JSON.stringify(n))
}
},
chartRightBoxShow: {
@@ -1208,10 +1208,12 @@ export default {
const add = this.$route.query.add
this.$nextTick(() => {
if (add) {
console.log(add)
if (add === 'chart') {
this.addChartBefore()
}
if (add === 'panel') {
if (add === 'dashboard') {
this.toAdd()
}
const newQuery = JSON.parse(JSON.stringify(this.$route.query)) // 深拷贝
delete newQuery.add
@@ -1232,7 +1234,7 @@ export default {
if (this.scrollbarWrap) {
this.scrollbarWrap.removeEventListener('scroll', bus.debounce)
}
localStorage.removeItem('panelTime')
localStorage.removeItem('dashboardTime')
if (!document.onmousemove) { // 添加鼠标移动事件监听
document.onmousemove = null
}

View File

@@ -4183,7 +4183,7 @@ export default {
this.rightBox.show = true
},
createSuccess (panel) { // 添加chart成功
this.$confirm(this.$t('dashboard.metric.goPanelTip'), this.$t('tip.saveSuccess'), {
this.$confirm(this.$t('dashboard.metric.goDashboardTip'), this.$t('tip.saveSuccess'), {
confirmButtonText: this.$t('tip.yes'),
cancelButtonText: this.$t('tip.no'),
type: 'success'
@@ -4191,7 +4191,7 @@ export default {
bus.$emit('menu-change', 'panel')
this.$store.commit('panelShowPanelChange', panel)
this.$router.push({
path: '/panel',
path: '/dashboard',
query: {
t: +new Date()
}
@@ -4199,7 +4199,7 @@ export default {
})
},
getPanelData () { // 获取panel数据
this.$get('visual/panel?pageNo=1&pageSize=-1').then(response => {
this.$get('visual/dashboard?pageNo=1&pageSize=-1').then(response => {
if (response.code === 200) {
this.panelData = response.data.list
}

View File

@@ -195,7 +195,7 @@ export default {
name: '',
endpointNameTmpl: '{{module.name}}-{{asset.name}}',
port: '',
panelId: '',
dashboardId: '',
metricsEnable: 1,
configs: [
{
@@ -480,7 +480,7 @@ export default {
type: 'warning'
}).then(() => {
this.$store.dispatch('dispatchHomeLoading', true)
this.$post('visual/panel/syncTmpl', { module: row.id }).then(res => {
this.$post('visual/dashboard/syncTmpl', { module: row.id }).then(res => {
this.$store.dispatch('dispatchHomeLoading', false)
if (res.code === 200) {
this.getTableData()

View File

@@ -1,6 +1,6 @@
<template>
<div class="project">
<topologyL5 v-if="reloadFacade" ref="facade" :obj="currentProject" :topologyIndexF="topologyIndexF" targetTab.sync="panel" @changeTopologyIndexF="changeTopologyIndexF"/>
<topologyL5 v-if="reloadFacade" ref="facade" :obj="currentProject" :topologyIndexF="topologyIndexF" @changeTopologyIndexF="changeTopologyIndexF"/>
<transition name="el-zoom-in-bottom">
<bottom-box
@@ -365,29 +365,6 @@ export default {
this.rightBox.addEndpoint.show = true
},
// 查看endpoint详情
detailEndpoint (endpoint) {
this.endpoint = Object.assign({}, endpoint)
this.bottomBox.targetTab = 'panel'
this.bottomBox.showSubList = true
},
delEndpoint (endpoint) {
this.$confirm(this.$t('tip.confirmDelete'), {
confirmButtonText: this.$t('tip.yes'),
cancelButtonText: this.$t('tip.no'),
type: 'warning'
}).then(() => {
this.$delete('endpoint?ids=' + endpoint.id).then(response => {
if (response.code === 200) {
this.delFlag = true
this.$message({ duration: 1000, type: 'success', message: this.$t('tip.deleteSuccess') })
this.getEndpointTableData()
} else {
this.$message.error(response.msg)
}
})
})
},
jumpToAlertMsg (endpoint) {
if (!this.hasButton('project_endpoint_alerts_view')) {
return

View File

@@ -59,7 +59,8 @@
<transition name="right-box">
<projectBox v-if="rightBox.show" :project="object" @close="closeRightBox"></projectBox>
</transition>
<transition name="right-box"><alert-silence-box v-if='silenceBoxShow' :alert-silence="objectSilence" @close="closeSilenceBox"></alert-silence-box>
<transition name="right-box">
<alert-silence-box v-if='silenceBoxShow' :alert-silence="objectSilence" @close="closeSilenceBox"></alert-silence-box>
</transition>
</div>
</template>

View File

@@ -13,7 +13,7 @@
<div style="display: flex;flex-direction: column">
<!-- <i class="nz-icon nz-icon-arrow-down"/>-->
<div style="font-size: 18px;font-weight: 600;color: #333;margin-bottom: 3px;text-align: right" v-if="!dataJson.type"> {{dataJson.panel.data.name}} </div>
<div style="font-size: 18px;font-weight: 600;color: #333;margin-bottom: 3px;text-align: right" v-if="!dataJson.type"> {{dataJson.dashboard.data.name}} </div>
<div style="font-size: 18px;font-weight: 600;color: #333;margin-bottom: 3px;text-align: right" v-if="dataJson.type"> Explore </div>
<span> {{dateFormat(dataJson.start * 1000)}} - {{dateFormat(dataJson.end * 1000)}} ({{dataJson.timezone}})</span>
</div>
@@ -21,14 +21,14 @@
<div v-if="!dataJson.type" id="dashboardScrollbar" class="box-content" ref="dashboardScrollbar" style='overflow:hidden; overflow-y: auto;height: calc(100% - 60px);display: flex;flex-direction: column'>
<chartList
ref="chartList"
name="panel"
:panelId="'export'"
name="dashboard"
:dashboardId="'export'"
:class="{'show-top': true}"
:data-list="dataJson.charts.data.list"
:dataJson = "dataJson.chartsData"
:is-export-html="true"
:nowTimeType="nowTimeType"
:from="'panel'"
:from="'dashboard'"
:time-range="searchTime"
@edit-chart="editChart"
@on-refresh-time="refreshTime"

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -25,7 +25,7 @@ const store = new Vuex.Store({
consoleParam: {}, // 新开console窗口参数
linkData: [], // 导航数据
projectFilter: {
panelId: 0,
dashboardId: 0,
start_time: '',
end_time: '',
searchName: ''

View File

@@ -29,7 +29,7 @@ const store = new Vuex.Store({
consoleParam: {}, // 新开console窗口参数
linkData: [], // 导航数据
projectFilter: {
panelId: 0,
dashboardId: 0,
start_time: '',
end_time: '',
searchName: ''