PLEASE HELP!
I’m trying to generate a pdf using vue-html2pdf.

I have a component that generate the infos and send to my ExportToPdf.vue component:

<template>
  <div>
    <v-btn @click="generate" color="primary" :outlined="outlined" :block="block" :large="largeButton">
      <v-icon v-text="buttonIcon" left />
      {{ buttonText }}
    </v-btn>

    <vue-html2pdf :show-layout="false" :float-layout="true" :enable-download="download" :preview-modal="previewModal"
      :paginate-elements-by-height="1122" :filename="fileName" :pdf-quality="quality" :manual-pagination="true"
      :pdf-format="format" :pdf-margin="margin" :pdf-orientation="orientation" :pdf-content-width="width"
      ref="html2Pdf">
      <section slot="pdf-content" class="pdf-content">
        <slot name="content" />
      </section>
    </vue-html2pdf>
  </div>
</template>

<script>
import VueHtml2pdf from 'vue-html2pdf'

export default {
  name: 'ExportToPDF',
  components: { VueHtml2pdf },

  props: {
    fileName: { type: String, default: 'PDF_File' },
    quality: { type: [String, Number], default: 2 },
    margin: { type: [String, Number], default: 0 },
    format: { type: String, default: 'a4' },
    orientation: { type: String, default: 'portrait' },
    width: { type: String, default: '810px' },
    buttonIcon: { type: String, default: 'mdi-file-download' },
    buttonText: { type: String, default: 'Exportar para PDF' },
    largeButton: { type: Boolean, default: false },
    block: { type: Boolean, default: false },
    outlined: { type: Boolean, default: false },
    download: { type: Boolean, default: true },
    previewModal: { type: Boolean, default: false },
  },

  methods: {
    async generate() {
      await this.$refs.html2Pdf.generatePdf()
    },
  },
}
</script>

But the background from another component is not filling all the second page. And the margin is not woking, so it’s breaking the text in the middle.

Print of issues

I’m trying to break page with margin and fill the page with my background.