Merge pull request #1360 from dataease/pr@1.5@refactor_panel-pdf

fix: 修复PDF导出没有背景的问题

frontend/src/components/canvas/components/Editor/Preview.vue

@@ -4,7 +4,7 @@
       <div
         id="canvasInfoTemp"
         ref="canvasInfoTemp"
-        :style="{height:mainHeight}"
+        :style="[{height:mainHeight},screenShotStyle]"
         class="main-class"
         @mouseup="deselectCurComponent"
         @mousedown="handleMouseDown"
@@ -60,6 +60,10 @@ export default {
     event: 'change'
   },
   props: {
+    screenShot: {
+      type: Boolean,
+      default: false
+    },
     show: {
       type: Boolean,
       default: false
@@ -120,6 +124,9 @@ export default {
       }
       return style
     },
+    screenShotStyle() {
+      return this.screenShot ? this.customStyle : {}
+    },
     // 此处单独计算componentData的值 不放入全局mapState中
     componentDataInfo() {
       return this.componentDataShow

frontend/src/views/panel/SubjectSetting/PanelStyle/BackgroundSelector.vue

@@ -106,6 +106,7 @@ export default {
         _this.panel.imageUrl = reader.result
         this.commitStyle()
       }
+      this.$store.state.styleChangeTimes++
       reader.readAsDataURL(file.raw)
     },
     upload(file) {

frontend/src/views/panel/export/PDFPreExport.vue

@@ -96,7 +96,7 @@ export default {
           const contentWidth = canvas.width
           const contentHeight = canvas.height
           const pageData = canvas.toDataURL('image/jpeg', 1.0)
-          const PDF = new JsPDF('l', 'px', [contentWidth, contentHeight])
+          const PDF = new JsPDF('p', 'pt', [contentWidth, contentHeight])
           PDF.addImage(pageData, 'JPEG', 0, 0, contentWidth, contentHeight)
           PDF.save(_this.panelName + '.pdf')
           _this.$emit('closePreExport')

frontend/src/views/panel/list/PanelViewShow.vue

@@ -75,7 +75,7 @@
       <el-row class="panel-design-preview">
         <div id="imageWrapper" ref="imageWrapper" style="width: 100%;height: 100%">
           <fullscreen style="height: 100%;background: #f7f8fa;overflow-y: auto" :fullscreen.sync="fullscreen">
-            <Preview v-if="showMain" :in-screen="!fullscreen" :show-type="'width'" />
+            <Preview v-if="showMain" :in-screen="!fullscreen" :show-type="'width'" :screen-shot="dataLoading"/>
           </fullscreen>
         </div>
       </el-row>