NEZ-2681 fix:panel更改为dashboard
This commit is contained in:
@@ -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;
|
||||
|
||||
@@ -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);
|
||||
}
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
.panel-tab-new {
|
||||
.dashboard-tab {
|
||||
.panel {
|
||||
height: 100%;
|
||||
}
|
||||
@@ -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';
|
||||
|
||||
@@ -21,9 +21,7 @@ const data = {
|
||||
name: 'ADC-Serve'
|
||||
},
|
||||
fields: [],
|
||||
cabinet: {
|
||||
name: '机柜'
|
||||
},
|
||||
cabinet: null,
|
||||
pingInfo: {
|
||||
status: 0,
|
||||
rtt: null
|
||||
|
||||
@@ -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())
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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) {
|
||||
|
||||
@@ -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()
|
||||
}
|
||||
|
||||
@@ -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,
|
||||
|
||||
@@ -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,
|
||||
|
||||
@@ -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,
|
||||
|
||||
@@ -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')
|
||||
|
||||
@@ -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,
|
||||
|
||||
@@ -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: [] })
|
||||
|
||||
@@ -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') }
|
||||
]
|
||||
|
||||
@@ -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')
|
||||
|
||||
@@ -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">
|
||||
|
||||
@@ -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设置显示
|
||||
@@ -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>
|
||||
|
||||
@@ -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()
|
||||
}
|
||||
|
||||
@@ -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'">
|
||||
<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>
|
||||
@@ -52,7 +52,7 @@
|
||||
v-if="detailViewRightObj"
|
||||
:from="from"
|
||||
:obj="detailViewRightObj"
|
||||
:target-tab="'panelTab'"
|
||||
:target-tab="'dashboardTab'"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -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) {
|
||||
|
||||
@@ -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')}} <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>
|
||||
@@ -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',
|
||||
|
||||
@@ -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')
|
||||
|
||||
@@ -284,7 +284,7 @@ const cn = {
|
||||
singleStatErrorTip: '仅支持返回单个系列/表的查询',
|
||||
panelForm: {
|
||||
panelName: '面板名称',
|
||||
panelId: 'ID'
|
||||
dashboardId: 'ID'
|
||||
},
|
||||
createChartTitle: '新增图表',
|
||||
createChartTempTitle: '新增图表模板',
|
||||
|
||||
@@ -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', // "新增图表"
|
||||
|
||||
@@ -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
|
||||
|
||||
@@ -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) {
|
||||
|
||||
@@ -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'
|
||||
|
||||
@@ -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)
|
||||
|
||||
@@ -132,7 +132,7 @@ export default {
|
||||
})
|
||||
}
|
||||
|
||||
this.$put('visual/panel/tree', toUpdate)
|
||||
this.$put('visual/dashboard/tree', toUpdate)
|
||||
},
|
||||
deletePanel (data) {
|
||||
this.$emit('deletePanel', data)
|
||||
|
||||
@@ -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'
|
||||
},
|
||||
// asset,endpoint 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', '')) {
|
||||
|
||||
@@ -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)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -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
|
||||
})
|
||||
},
|
||||
|
||||
@@ -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"
|
||||
|
||||
@@ -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
|
||||
}
|
||||
|
||||
@@ -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
|
||||
}
|
||||
|
||||
@@ -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
|
||||
}
|
||||
|
||||
@@ -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
|
||||
})
|
||||
},
|
||||
|
||||
@@ -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
|
||||
})
|
||||
},
|
||||
|
||||
@@ -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(() => '')
|
||||
|
||||
@@ -381,7 +381,7 @@ export default {
|
||||
mixins: [editRigthBox],
|
||||
data () {
|
||||
return {
|
||||
url: 'visual/panel',
|
||||
url: 'visual/dashboard',
|
||||
editPanel: {},
|
||||
isShow: 0,
|
||||
userData: [],
|
||||
|
||||
@@ -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)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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
|
||||
}, {
|
||||
|
||||
@@ -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
|
||||
}, {
|
||||
|
||||
@@ -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: {
|
||||
|
||||
@@ -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()
|
||||
}
|
||||
|
||||
@@ -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()
|
||||
|
||||
@@ -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()
|
||||
|
||||
@@ -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++) {
|
||||
|
||||
@@ -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()
|
||||
|
||||
@@ -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> {{$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> {{$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
|
||||
}
|
||||
|
||||
@@ -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
|
||||
}
|
||||
|
||||
@@ -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()
|
||||
|
||||
@@ -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
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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
@@ -25,7 +25,7 @@ const store = new Vuex.Store({
|
||||
consoleParam: {}, // 新开console窗口参数
|
||||
linkData: [], // 导航数据
|
||||
projectFilter: {
|
||||
panelId: 0,
|
||||
dashboardId: 0,
|
||||
start_time: '',
|
||||
end_time: '',
|
||||
searchName: ''
|
||||
|
||||
@@ -29,7 +29,7 @@ const store = new Vuex.Store({
|
||||
consoleParam: {}, // 新开console窗口参数
|
||||
linkData: [], // 导航数据
|
||||
projectFilter: {
|
||||
panelId: 0,
|
||||
dashboardId: 0,
|
||||
start_time: '',
|
||||
end_time: '',
|
||||
searchName: ''
|
||||
|
||||
Reference in New Issue
Block a user