|
|
|
@ -10,7 +10,9 @@ |
|
|
|
</div> |
|
|
|
<div class="right-top"> |
|
|
|
<el-button @click="cancel()">{{ $t('form.cancel') }}</el-button> |
|
|
|
<el-button type="primary" @click="yuedu" v-if="form.zt == 0">{{ |
|
|
|
<el-button type="primary" @click="handleExport" v-if="showExportBtn">{{ |
|
|
|
$t('page.business.study.studyMethod.daochu') }}</el-button> |
|
|
|
<el-button type="primary" @click="yuedu" v-if="form.zt == 0 && !showExportBtn">{{ |
|
|
|
$t('page.business.study.studyMethod.yuedu') }}</el-button> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
@ -29,14 +31,31 @@ |
|
|
|
class="el-icon-arrow-right el-icon--right"></i></el-button> |
|
|
|
</el-button-group> |
|
|
|
</div> |
|
|
|
<div ref="contentToPdf"> |
|
|
|
<div class="content-title"> |
|
|
|
<div class="line"></div> |
|
|
|
<div class="subtitle"> {{ $t('page.business.study.studyMethod.qmhz') }}</div> |
|
|
|
</div> |
|
|
|
<el-table v-loading="loading" :data="list"> |
|
|
|
<el-table-column :label="$t('page.business.study.studyMethod.qmr')" prop="qmrMc" /> |
|
|
|
<el-table-column :label="$t('page.business.study.studyMethod.qmsj')" prop="createTime" /> |
|
|
|
<el-table-column :label="$t('page.business.study.studyMethod.qmyy')" prop="qmyy" /> |
|
|
|
<el-table-column :label="$t('page.business.study.studyMethod.remark')" prop="remark" /> |
|
|
|
</el-table> |
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<Yd ref="Yd" @callback="closeYd"/> |
|
|
|
<Yd ref="Yd" @callback="closeYd" /> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
import { studyMethod_readList, studyMethod_export } from '@/api/business/study/studyMethod' |
|
|
|
import html2canvas from 'html2canvas'; |
|
|
|
import { PDFDocument } from 'pdf-lib' |
|
|
|
import { mapGetters } from 'vuex' |
|
|
|
import pdf from 'vue-pdf' |
|
|
|
import Yd from './Yd.vue' |
|
|
|
@ -45,12 +64,15 @@ export default { |
|
|
|
components: { pdf, Yd }, |
|
|
|
data() { |
|
|
|
return { |
|
|
|
showExportBtn: false, |
|
|
|
pdfSrc: '', |
|
|
|
open: false, |
|
|
|
pageNum: 1, |
|
|
|
loadedRatio: 0, // 当前页面的加载进度,范围是0-1 ,等于1的时候代表当前页已经完全加载完成了 |
|
|
|
totalPages: 0, //pdf总页数 |
|
|
|
form: {}, |
|
|
|
list: [], |
|
|
|
loading: false, |
|
|
|
} |
|
|
|
}, |
|
|
|
computed: { |
|
|
|
@ -71,25 +93,42 @@ export default { |
|
|
|
}, |
|
|
|
|
|
|
|
show(row) { |
|
|
|
this.showExportBtn = false |
|
|
|
this.open = true |
|
|
|
this.form = row |
|
|
|
this.pdfSrc = process.env.VUE_APP_FILE_DOMAIN + row.fileUrl |
|
|
|
this.getPageNum() |
|
|
|
}, |
|
|
|
showExport(row) { |
|
|
|
this.loading = true |
|
|
|
this.open = true |
|
|
|
this.showExportBtn = true |
|
|
|
this.form = row |
|
|
|
this.pdfSrc = process.env.VUE_APP_FILE_DOMAIN + row.fileUrl |
|
|
|
|
|
|
|
studyMethod_readList({ studyMethodId: row.id }).then(response => { |
|
|
|
this.list = response.data |
|
|
|
this.loading = false |
|
|
|
this.getPageNum() |
|
|
|
}) |
|
|
|
}, |
|
|
|
|
|
|
|
// 获取PDF总页数 |
|
|
|
getPageNum() { |
|
|
|
let loadingTask = pdf.createLoadingTask(this.fileUrl); |
|
|
|
let loadingTask = pdf.createLoadingTask(this.pdfSrc); |
|
|
|
loadingTask.promise |
|
|
|
.then((pdf) => { |
|
|
|
this.totalPages = pdf.numPages; |
|
|
|
this.$nextTick(() => { |
|
|
|
this.setWatermarkContent(); |
|
|
|
}); |
|
|
|
this.loadPdfFromUrl() |
|
|
|
// this.$nextTick(() => { |
|
|
|
// this.setWatermarkContent(); |
|
|
|
// }); |
|
|
|
|
|
|
|
}) |
|
|
|
.catch((err) => { |
|
|
|
this.$message.warning("pdf加载失败"); |
|
|
|
this.$message.msgError("pdf加载失败"); |
|
|
|
}); |
|
|
|
|
|
|
|
}, |
|
|
|
// 上一页 |
|
|
|
prePage() { |
|
|
|
@ -109,7 +148,14 @@ export default { |
|
|
|
|
|
|
|
closeYd(val) { |
|
|
|
this.form.zt = val |
|
|
|
}, |
|
|
|
|
|
|
|
handleExport() { |
|
|
|
studyMethod_export({studyMethodId:6}).then(response => { |
|
|
|
|
|
|
|
}) |
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
</script> |
|
|
|
|