feat:panel 添加导出 当前数据
This commit is contained in:
@@ -99,7 +99,8 @@ export default {
|
|||||||
showAllData: false,
|
showAllData: false,
|
||||||
allDataLength: 0,
|
allDataLength: 0,
|
||||||
severityData: this.$store.getters.severityData,
|
severityData: this.$store.getters.severityData,
|
||||||
severityDataWeight: this.$store.getters.severityDataWeight
|
severityDataWeight: this.$store.getters.severityDataWeight,
|
||||||
|
isExportData: false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
@@ -161,6 +162,9 @@ export default {
|
|||||||
query (elements, startTime, endTime, step, params) {
|
query (elements, startTime, endTime, step, params) {
|
||||||
this.isError = false
|
this.isError = false
|
||||||
this.allDataLength = 0
|
this.allDataLength = 0
|
||||||
|
if (this.isExportData) {
|
||||||
|
this.chartData = this.chartInfo.chartData
|
||||||
|
}
|
||||||
try {
|
try {
|
||||||
switch (this.chartInfo.datasource) {
|
switch (this.chartInfo.datasource) {
|
||||||
case 'metrics':
|
case 'metrics':
|
||||||
|
|||||||
@@ -77,6 +77,9 @@
|
|||||||
<el-dropdown-item v-has="'main_add'">
|
<el-dropdown-item v-has="'main_add'">
|
||||||
<div id="chart-htmltopdf" @click="htmlToPdf"><i class="nz-icon nz-icon-download1"></i>{{ $t('overall.downloadToPdf') }}</div>
|
<div id="chart-htmltopdf" @click="htmlToPdf"><i class="nz-icon nz-icon-download1"></i>{{ $t('overall.downloadToPdf') }}</div>
|
||||||
</el-dropdown-item>
|
</el-dropdown-item>
|
||||||
|
<el-dropdown-item v-has="'main_add'">
|
||||||
|
<div id="chart-htmltoData" @click="exportData"><i class="nz-icon nz-icon-download1"></i>{{ $t('overall.downloadToPdf') }}</div>
|
||||||
|
</el-dropdown-item>
|
||||||
</template>
|
</template>
|
||||||
</top-tool-more-options>
|
</top-tool-more-options>
|
||||||
</div>
|
</div>
|
||||||
@@ -163,6 +166,7 @@ import { randomcolor } from '@/components/common/js/radomcolor/randomcolor'
|
|||||||
import { lineChartMove } from '@/components/common/js/common'
|
import { lineChartMove } from '@/components/common/js/common'
|
||||||
import routerPathParams from '@/components/common/mixin/routerPathParams'
|
import routerPathParams from '@/components/common/mixin/routerPathParams'
|
||||||
import htmlToPdfMixin from '@/components/common/mixin/htmlToPdfMixin'
|
import htmlToPdfMixin from '@/components/common/mixin/htmlToPdfMixin'
|
||||||
|
import FileSaver from 'file-saver'
|
||||||
// import chartData from './testData'
|
// import chartData from './testData'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
@@ -832,7 +836,7 @@ export default {
|
|||||||
this.panelReloadOnlyPanel()
|
this.panelReloadOnlyPanel()
|
||||||
},
|
},
|
||||||
htmlToPdf () {
|
htmlToPdf () {
|
||||||
let dom = document.getElementsByClassName(this.pdfId)[0]
|
const dom = document.getElementsByClassName(this.pdfId)[0]
|
||||||
if (dom) {
|
if (dom) {
|
||||||
// dom = dom.getElementsByClassName('vue-grid-layout')[0]
|
// dom = dom.getElementsByClassName('vue-grid-layout')[0]
|
||||||
this.scrollbarWrap.scrollTop = this.scrollbarWrap.scrollHeight
|
this.scrollbarWrap.scrollTop = this.scrollbarWrap.scrollHeight
|
||||||
@@ -857,7 +861,6 @@ export default {
|
|||||||
document.body.style.height = 'auto'
|
document.body.style.height = 'auto'
|
||||||
// document.getElementsByTagName('html')[0].style.overflow = 'visible'
|
// document.getElementsByTagName('html')[0].style.overflow = 'visible'
|
||||||
const position = dom.getBoundingClientRect()
|
const position = dom.getBoundingClientRect()
|
||||||
console.log(position)
|
|
||||||
this.getPdf(dom, -1 * position.left, -1 * position.top)
|
this.getPdf(dom, -1 * position.left, -1 * position.top)
|
||||||
// this.getPdf(dom, 0, 0)
|
// this.getPdf(dom, 0, 0)
|
||||||
}, 2000)
|
}, 2000)
|
||||||
@@ -866,6 +869,44 @@ export default {
|
|||||||
} else {
|
} else {
|
||||||
this.showScreenLoading(false)
|
this.showScreenLoading(false)
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
exportData () {
|
||||||
|
this.scrollbarWrap.scrollTop = this.scrollbarWrap.scrollHeight
|
||||||
|
this.$refs.chartList.onScroll(this.scrollbarWrap.scrollTop)
|
||||||
|
let flag = true
|
||||||
|
let timer = setInterval(() => {
|
||||||
|
flag = true
|
||||||
|
this.$refs.chartList.copyDataList.forEach(chart => {
|
||||||
|
if (chart.type !== 'group') {
|
||||||
|
flag = flag && chart.loaded
|
||||||
|
} else if (chart.collapse) {
|
||||||
|
chart.children.forEach(groupChart => {
|
||||||
|
flag = flag && groupChart.loaded
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
if (flag) {
|
||||||
|
clearInterval(timer)
|
||||||
|
timer = null
|
||||||
|
setTimeout(() => {
|
||||||
|
this.dataList.forEach(item => {
|
||||||
|
if (item.type === 'group') {
|
||||||
|
item.chartData = [item.children]
|
||||||
|
}
|
||||||
|
if (item.type === 'group' && !item.param.collapse) {
|
||||||
|
item.children.forEach(child => {
|
||||||
|
child.chartData = this.$refs.chartList.$refs['chart' + item.id][0].$refs.chart.$refs['chart' + item.id].$refs.chartList.$refs['chart' + child.id][0].chartData
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
item.chartData = this.$refs.chartList.$refs['chart' + item.id][0].chartData
|
||||||
|
}
|
||||||
|
})
|
||||||
|
const data = JSON.stringify(this.dataList)
|
||||||
|
const blob = new Blob([data], { type: '' })
|
||||||
|
FileSaver.saveAs(blob, 'ceshi.json')
|
||||||
|
}, 2000)
|
||||||
|
}
|
||||||
|
}, 200)
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
created () {
|
created () {
|
||||||
|
|||||||
Reference in New Issue
Block a user