Merge branch 'dev-3.2' of https://git.mesalab.cn/nezha/nezha-fronted into dev-3.3

# Conflicts:
#	nezha-fronted/src/assets/css/font/iconfont.css
#	nezha-fronted/src/assets/css/font/iconfont.js
#	nezha-fronted/src/assets/css/font/iconfont.ttf
#	nezha-fronted/src/assets/css/font/iconfont.woff
#	nezha-fronted/src/assets/css/font/iconfont.woff2
#	nezha-fronted/src/assets/css/nzIcon.css
#	nezha-fronted/src/components/page/dashboard/panel.vue
This commit is contained in:
zhangyu
2022-04-13 10:50:11 +08:00
5 changed files with 736 additions and 1400 deletions

File diff suppressed because it is too large Load Diff

View File

@@ -13,8 +13,8 @@
"dependencies": {
"@johmun/vue-tags-input": "^2.1.0",
"@riophae/vue-treeselect": "^0.4.0",
"@svgdotjs/svg.js": "3.0.16",
"@svgdotjs/svg.panzoom.js": "2.1.1",
"@svgdotjs/svg.js": "^3.0.16",
"@svgdotjs/svg.panzoom.js": "^2.1.1",
"@topology/activity-diagram": "^0.3.0",
"@topology/chart-diagram": "^0.3.0",
"@topology/class-diagram": "^0.3.0",

View File

@@ -761,7 +761,7 @@ export default {
// document.getElementsByTagName('html')[0].style.overflow = 'visible'
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.searchTime)
// this.getPdf(dom, 0, 0)
}, 2000)
}

View File

@@ -4,7 +4,7 @@ import { Loading } from 'element-ui' // 此处根据你实际使用的框架的l
let loading
export default {
install (Vue, options) {
Vue.prototype.getPdf = function (dom, x, y) { // 传入需要导出的 dom
Vue.prototype.getPdf = function (dom, x, y, time) { // 传入需要导出的 dom
const title = this.htmlTitle || 'pdf'
// html2Canvas(document.querySelector('#pdfDom'), { //这是在界面上设置一个id
// 只下载id为pdfDom的内容
@@ -31,7 +31,24 @@ export default {
// a4纸的尺寸[595.28,841.89]html页面生成的canvas在pdf中图片的宽高
const imgWidth = 595.28
const imgHeight = 592.28 / contentWidth * contentHeight
const pageData = canvas.toDataURL('image/jpeg', 1.0)
console.log(canvas)
// canvas.paddingTop = '30px'
const pageDataImg = canvas.toDataURL('image/jpeg', 1.0)
const img = new Image()
img.src = pageDataImg
img.onload = function () {
const canvasBox = document.createElement('canvas')
canvasBox.setAttribute('width', contentWidth + 30 + '')
canvasBox.setAttribute('height', contentHeight + '')
const ctx = canvasBox.getContext('2d')
ctx.fillStyle = '#fff'
ctx.fillRect(0, 0, contentWidth + 30, contentHeight)
ctx.font = '12pt Roboto-Regular'
ctx.strokeStyle = '#333333'
ctx.fillStyle = '#333333'
ctx.fillText(time[0] + ' - ' + time[1], 10, 24)
ctx.drawImage(this, 0, 30, contentWidth, contentHeight)
const pageData = canvasBox.toDataURL('image/jpeg', 1.0)
const PDF = new JsPDF('', 'pt', 'a4')
// 有两个高度需要区分一个是html页面的实际高度和生成pdf的页面高度(841.89)
// 当内容未超过pdf一页显示的范围无需分页
@@ -48,6 +65,7 @@ export default {
}
}
PDF.save(title + '.pdf')
}
})
}
Vue.prototype.showScreenLoading = function (flag) {

View File

@@ -826,6 +826,10 @@ export default {
this.htmlTitle = this.panel.name
this.scrollbarWrap.scrollTop = this.scrollbarWrap.scrollHeight
this.$refs.chartList.onScroll(this.scrollbarWrap.scrollTop)
// const div = document.createElement('div')
// div.setAttribute('class', 'el-loading-spinner')
// div.innerText = '12321312312312321'
// dom.insertBefore(div,)
let flag = true
this.showScreenLoading(true)
let timer = setInterval(() => {
@@ -847,7 +851,7 @@ export default {
document.getElementsByClassName('left-menu')[0].style.height = '100vh'
// document.getElementsByTagName('html')[0].style.overflow = 'visible'
const position = dom.getBoundingClientRect()
this.getPdf(dom, -1 * position.left, -1 * position.top)
this.getPdf(dom, -1 * position.left, -1 * position.top, this.searchTime)
// this.getPdf(dom, 0, 0)
}, 2000)
}
@@ -940,9 +944,6 @@ export default {
}, 100)
}
},
beforeDestroy () {
this.$store.dispatch('dispatchPanelLock', { flag: true })
},
watch: {
'filter.searchName': function (n, o) {
const temp = this
@@ -994,6 +995,7 @@ export default {
}
},
beforeDestroy () {
this.$store.dispatch('dispatchPanelLock', { flag: true })
if (document.querySelector('#tableList')) {
document.querySelector('#tableList').removeEventListener('mouseenter', this.tableListEnter)
document.querySelector('#tableList').removeEventListener('mouseleave', this.tableListLeave)