<template>
|
<div class="v-asseaa-report-create colorfff">
|
<div class="_create-content">
|
<div class="_box">
|
<div class="g-action-btn _export-btn">
|
<div class="action-item orange pointer" @click="generateReport">
|
数据导出
|
</div>
|
</div>
|
<vue-html2pdf
|
:show-layout="true"
|
:float-layout="true"
|
:enable-download="true"
|
:preview-modal="true"
|
:paginate-elements-by-height="1400"
|
filename="运营评估报告"
|
:pdf-quality="2"
|
:manual-pagination="true"
|
pdf-format="a4"
|
pdf-orientation="landscape"
|
pdf-content-width="1180px"
|
|
@progress="onProgress($event)"
|
@hasStartedGeneration="hasStartedGeneration()"
|
@hasGenerated="hasGenerated($event)"
|
ref="html2Pdf"
|
>
|
<pdfContent @domRendered="domRendered()" slot="pdf-content" />
|
</vue-html2pdf>
|
|
</div>
|
|
|
</div>
|
</div>
|
|
</template>
|
<script>
|
import * as echarts from "echarts";
|
import moment from "moment";
|
import pdfContent from '@/components/assessReport/pdfContent';
|
import VueHtml2pdf from 'vue-html2pdf'
|
export default {
|
name: "driverappraise",
|
components: {VueHtml2pdf, pdfContent },
|
data() {
|
return {
|
|
};
|
},
|
created() {
|
|
},
|
computed: {
|
|
},
|
activated() {
|
this.getData();
|
},
|
mounted() {
|
},
|
methods: {
|
generateReport () {
|
this.$refs.html2Pdf.generatePdf()
|
},
|
},
|
};
|
</script>
|
|
<style lang="less">
|
.v-asseaa-report-create {
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
margin-top: 20px;
|
.vue-html2pdf .layout-container.show-layout {
|
z-index: 1 !important;
|
top: 80px;
|
background: #141A26;
|
padding-bottom: 200px;
|
}
|
.page-break-after {
|
page-break-after: always;
|
|
}
|
|
|
._create-content {
|
width: 1180px;
|
position: relative;
|
._export-btn {
|
position: absolute;
|
right: -100px;
|
z-index: 1000;
|
}
|
|
}
|
}
|
|
</style>
|
