fix: pdf导出边框变形问题

This commit is contained in:
wangjiahao 2022-03-29 20:54:38 +08:00
parent 872dde2fde
commit cd7054a692
14 changed files with 30 additions and 13 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 965 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 518 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

View File

@ -82,6 +82,10 @@ export default {
filters: { filters: {
type: Array, type: Array,
default: () => [] default: () => []
},
screenShot: {
type: Boolean,
default: false
} }
}, },
data() { data() {
@ -100,7 +104,11 @@ export default {
style['border-radius'] = (this.config.commonBackground.borderRadius || 0) + 'px' style['border-radius'] = (this.config.commonBackground.borderRadius || 0) + 'px'
if (this.config.commonBackground.enable) { if (this.config.commonBackground.enable) {
if (this.config.commonBackground.backgroundType === 'innerImage') { if (this.config.commonBackground.backgroundType === 'innerImage') {
style['background'] = `url(${this.config.commonBackground.innerImage}) no-repeat` let innerImage = this.config.commonBackground.innerImage
if (this.screenShot) {
innerImage = innerImage.replace('svg', 'png')
}
style['background'] = `url(${innerImage}) no-repeat`
} else if (this.config.commonBackground.backgroundType === 'outerImage') { } else if (this.config.commonBackground.backgroundType === 'outerImage') {
style['background'] = `url(${this.config.commonBackground.outerImage}) no-repeat` style['background'] = `url(${this.config.commonBackground.outerImage}) no-repeat`
} else if (this.config.commonBackground.backgroundType === 'color') { } else if (this.config.commonBackground.backgroundType === 'color') {

View File

@ -21,6 +21,7 @@
:in-screen="inScreen" :in-screen="inScreen"
:terminal="terminal" :terminal="terminal"
:filters="filterMap[item.propValue && item.propValue.viewId]" :filters="filterMap[item.propValue && item.propValue.viewId]"
:screen-shot="screenShot"
/> />
<!--视图详情--> <!--视图详情-->
<el-dialog <el-dialog

View File

@ -179,7 +179,7 @@
:destroy-on-close="true" :destroy-on-close="true"
:append-to-body="true" :append-to-body="true"
> >
<background /> <background @backgroundSetClose="backgroundSetClose" />
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
@ -1025,13 +1025,13 @@ export default {
_this.positionBoxInfoArray = positionBox _this.positionBoxInfoArray = positionBox
}, 500) }, 500)
} }
eventBus.$on('backgroundSetClose', () => {
this.boardSetVisible = false
})
}, },
created() { created() {
}, },
methods: { methods: {
backgroundSetClose() {
this.boardSetVisible = false
},
boardSet(item) { boardSet(item) {
this.$emit('boardSet', item) this.$emit('boardSet', item)
this.boardSetVisible = true this.boardSetVisible = true

View File

@ -128,19 +128,26 @@ export default {
predefineColors: COLOR_PANEL predefineColors: COLOR_PANEL
} }
}, },
created() {
this.init()
},
mounted() { mounted() {
},
computed: {
...mapState([
'curComponent',
'componentData'
])
},
methods: {
init() {
if (this.curComponent && this.curComponent.commonBackground && this.curComponent.commonBackground.outerImage && typeof (this.curComponent.commonBackground.outerImage) === 'string') { if (this.curComponent && this.curComponent.commonBackground && this.curComponent.commonBackground.outerImage && typeof (this.curComponent.commonBackground.outerImage) === 'string') {
this.fileList.push({ url: this.curComponent.commonBackground.outerImage }) this.fileList.push({ url: this.curComponent.commonBackground.outerImage })
} }
this.backgroundOrigin = deepCopy(this.curComponent.commonBackground) this.backgroundOrigin = deepCopy(this.curComponent.commonBackground)
this.queryBackground() this.queryBackground()
}, },
computed: {
...mapState([
'curComponent'
])
},
methods: {
queryBackground() { queryBackground() {
queryBackground().then(response => { queryBackground().then(response => {
this.BackgroundShowMap = response.data this.BackgroundShowMap = response.data
@ -154,11 +161,12 @@ export default {
this.curComponent.commonBackground.outerImage = this.backgroundOrigin.outerImage this.curComponent.commonBackground.outerImage = this.backgroundOrigin.outerImage
this.curComponent.commonBackground.alpha = this.backgroundOrigin.alpha this.curComponent.commonBackground.alpha = this.backgroundOrigin.alpha
this.curComponent.commonBackground.borderRadius = this.backgroundOrigin.borderRadius this.curComponent.commonBackground.borderRadius = this.backgroundOrigin.borderRadius
eventBus.$emit('backgroundSetClose') this.curComponent.commonBackground.innerPadding = this.backgroundOrigin.innerPadding
this.$emit('backgroundSetClose')
}, },
save() { save() {
this.$store.commit('recordSnapshot') this.$store.commit('recordSnapshot')
eventBus.$emit('backgroundSetClose') this.$emit('backgroundSetClose')
}, },
commitStyle() { commitStyle() {
const canvasStyleData = deepCopy(this.canvasStyleData) const canvasStyleData = deepCopy(this.canvasStyleData)