wangpeng
/
integrated_traffic_vue
forked from integrated_whb/integrated_whb_vue
1
0
Fork 0
Code Pull Requests Activity

pdf导出改为打印

pull/1/head
LiuJiaNan 2024-02-21 17:31:16 +08:00
parent 8bf89a3736
commit b82fce61b9
2 changed files with 173 additions and 175 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

81
src/views/continuous_improvement/enterprise_report/index.vue
View File

@ -1,7 +1,10 @@
<template> <template>
<layout-card> <layout-card>
<div class="pdf-page"> <div class="tr">
<div class="pdf-cover"> <el-button v-print="'#printContainer'" type="primary">打印</el-button>
</div>
<div id="printContainer">
<div class="cover print_use page_break">
<div class="top"> <div class="top">
<h1>{{ data.cpd.CORP_NAME }}</h1> <h1>{{ data.cpd.CORP_NAME }}</h1>
<h1>秦安双重预防机制建设平台</h1> <h1>秦安双重预防机制建设平台</h1>
@ -11,12 +14,9 @@
<h1>{{ data.cpd.CORP_NAME }}</h1> <h1>{{ data.cpd.CORP_NAME }}</h1>
<h1>{{ dayjs(startDate).format("YYYY年MM月") }}</h1> <h1>{{ dayjs(startDate).format("YYYY年MM月") }}</h1>
</div> </div>
<img src="/src/assets/images/print/cover-bg.png" alt="" />
</div> </div>
<div class="pdf-print"> <div class="content">
<!-- TODO"-->
<el-button type="primary">PDF导出</el-button>
</div>
<div class="pdf-content">
<h1>1.概述</h1> <h1>1.概述</h1>
<p> <p>
{{ data.cpd.CORP_NAME }}公司统一社会信用代码为：{{ {{ data.cpd.CORP_NAME }}公司统一社会信用代码为：{{
@ -60,7 +60,7 @@
</p> </p>
</div> </div>
<div class="pdf-content"> <div class="content">
<h1>3.隐患排查</h1> <h1>3.隐患排查</h1>
<h4>3.1清单管理</h4> <h4>3.1清单管理</h4>
<p> <p>
@ -152,7 +152,7 @@
data.yys_count data.yys_count
}}项，已超期{{ data.cq_count }}项。 }}项，已超期{{ data.cq_count }}项。
</p> </p>
<p class="pdf-subtitle">隐患治理情况见表2</p> <p class="subtitle">隐患治理情况见表2</p>
<table class="print_table"> <table class="print_table">
<thead> <thead>
<tr> <tr>
@ -175,15 +175,20 @@
<td>{{ item.DEPARTMENT_NAME }}</td> <td>{{ item.DEPARTMENT_NAME }}</td>
<td>{{ item.HIDDENDESCR }}</td> <td>{{ item.HIDDENDESCR }}</td>
<td>{{ item.RECTIFYDESCR }}</td> <td>{{ item.RECTIFYDESCR }}</td>
<td v-if="item.STATE === '-1'">已超期</td> <td>
<td v-if="item.STATE === '1'"> <span v-if="item.STATE === '1'">
{{ {{
item.HIDDENLEVEL === "hiddenLevel0001" ? "待整改" : "整改中" item.HIDDENLEVEL === "hiddenLevel0001" ? "待整改" : "整改中"
}} }}
</span>
<span v-else-if="item.STATE === '3'"> 已整改 </span>
<span v-else-if="item.STATE === '4'"> 已验收 </span>
<span v-else-if="item.STATE === '-1'"> 已超期 </span>
<span v-else-if="item.STATE === '10'"> 验收打回 </span>
<span v-else-if="item.STATE === '100'"> 暂存 </span>
<span v-else-if="item.STATE === '101'"> 待指派 </span>
<span v-else-if="item.STATE === '102'"> 指派中 </span>
</td> </td>
<td v-if="item.STATE === '2'">已整改</td>
<td v-if="item.STATE === '3'">已整改</td>
<td v-if="item.STATE === '4'">已验收</td>
<td> <td>
<viewer :images="[VITE_FILE_URL + item.HD_IMGS]"> <viewer :images="[VITE_FILE_URL + item.HD_IMGS]">
<img <img
@ -210,7 +215,7 @@
</table> </table>
</div> </div>
<div class="pdf-content"> <div class="content">
<h1>4.风险分析记录</h1> <h1>4.风险分析记录</h1>
<p>改进信息显示风险辨识台账更新记录</p> <p>改进信息显示风险辨识台账更新记录</p>
<table class="print_table"> <table class="print_table">
@ -238,7 +243,7 @@
</table> </table>
</div> </div>
<div class="pdf-content"> <div class="content">
<h1>5.教育培训情况</h1> <h1>5.教育培训情况</h1>
<h4>5.1教育培训</h4> <h4>5.1教育培训</h4>
<p> <p>
@ -314,7 +319,7 @@
</p> </p>
</div> </div>
<div class="pdf-content"> <div class="content">
<h1>6.特殊作业管理</h1> <h1>6.特殊作业管理</h1>
<p> <p>
{{ dayjs(startDate).format("YYYY年MM月DD日") }}-{{ {{ dayjs(startDate).format("YYYY年MM月DD日") }}-{{
@ -333,7 +338,7 @@
</p> </p>
</div> </div>
<div class="pdf-content"> <div class="content">
<h1>7.绩效考核</h1> <h1>7.绩效考核</h1>
<p> <p>
{{ dayjs(startDate).format("YYYY年MM月DD日") }}-{{ {{ dayjs(startDate).format("YYYY年MM月DD日") }}-{{
@ -449,7 +454,7 @@
</table> </table>
</div> </div>
<div class="pdf-content"> <div class="content">
<h1>8.结论建议</h1> <h1>8.结论建议</h1>
<p> <p>
{{ data.corp_advice.ADVICE }} {{ data.corp_advice.ADVICE }}
@ -676,26 +681,9 @@ const fnConclusion = () => {
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.pdf-page { .cover {
width: 100%;
border: 1px solid var(--el-border-color);
padding: 20px;
position: relative; position: relative;
.pdf-print {
float: right;
}
.pdf-cover {
top: -1523px;
position: absolute;
width: 100%;
height: 1497px;
background: #fff url("/src/assets/images/print/cover-bg.png") no-repeat 0
bottom;
background-size: 100% 630px;
.top { .top {
padding-top: 400px; padding-top: 400px;
@ -706,19 +694,29 @@ const fnConclusion = () => {
} }
.bot { .bot {
padding-top: 700px; padding-top: 200px;
h1 { h1 {
font-size: 18px; font-size: 18px;
text-align: center; text-align: center;
} }
} }
}
.pdf-content { img {
position: absolute;
left: 0;
right: 0;
bottom: -100px;
height: 407px;
width: 100%;
z-index: -1;
}
}
.content {
position: relative; position: relative;
.pdf-subtitle { .subtitle {
text-align: center; text-align: center;
text-indent: 0; text-indent: 0;
margin-bottom: 1em; margin-bottom: 1em;
@ -739,7 +737,6 @@ const fnConclusion = () => {
margin: 0 0 0.2em; margin: 0 0 0.2em;
line-height: 1.6; line-height: 1.6;
} }
}
} }
img { img {

45
src/views/dynamic_evaluation/risk_control_menu/add.vue
View File

@ -1,15 +1,15 @@
<template> <template>
<div> <div>
<layout-card> <layout-card>
<div class="pdf-page"> <div id="printContainer">
<div class="pdf-cover"> <div class="cover print_use page_break">
<div class="top"> <div class="top">
<h1>{{ info.CREATOR_NAME }}</h1> <h1>{{ info.CREATOR_NAME }}</h1>
<h1> <h1>
{{ dayjs(info.CREATTIME).format("YYYY") }}年度风险管控动态评估报告 {{ dayjs(info.CREATTIME).format("YYYY") }}年度风险管控动态评估报告
</h1> </h1>
</div> </div>
<div style="padding-top: 200px; margin: auto; width: 400px"> <div style="margin: auto; width: 400px">
<div style="display: flex"> <div style="display: flex">
<h1>编制：</h1> <h1>编制：</h1>
<div style="border-bottom: 1px solid #606266; width: 80%" /> <div style="border-bottom: 1px solid #606266; width: 80%" />
@ -19,12 +19,12 @@
<div style="border-bottom: 1px solid #606266; width: 80%" /> <div style="border-bottom: 1px solid #606266; width: 80%" />
</div> </div>
</div> </div>
<div class="bot" style="padding-top: 300px"> <div class="bot">
<h1>{{ info.CREATOR_NAME }}</h1> <h1>{{ info.CREATOR_NAME }}</h1>
<h1>{{ dayjs(info.CREATTIME).format("YYYY年MM月DD日") }}</h1> <h1>{{ dayjs(info.CREATTIME).format("YYYY年MM月DD日") }}</h1>
</div> </div>
<img src="/src/assets/images/print/cover-bg.png" alt="" />
</div> </div>
<div class="pdf-content">
<table class="print_table"> <table class="print_table">
<tr v-for="(item, index) in list" :key="index"> <tr v-for="(item, index) in list" :key="index">
<td <td
@ -89,13 +89,17 @@
</tr> </tr>
</table> </table>
</div> </div>
</div>
<div class="tc mt-10"> <div class="tc mt-10">
<el-button v-if="type !== 'view'" type="primary" @click="fnSubmit"> <el-button v-if="type !== 'view'" type="primary" @click="fnSubmit">
确定 确定
</el-button> </el-button>
<!-- TODO"--> <el-button
<el-button v-if="type === 'view'" type="primary">导出PDF</el-button> v-if="type === 'view'"
v-print="'#printContainer'"
type="primary"
>
打印
</el-button>
</div> </div>
</layout-card> </layout-card>
<assessment-results <assessment-results
@ -222,21 +226,9 @@ const fnSubmit = debounce(
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.pdf-page { .cover {
width: 100%;
padding: 20px;
position: relative; position: relative;
.pdf-cover {
top: -1523px;
position: absolute;
width: 100%;
height: 1497px;
background: #fff url("/src/assets/images/print/cover-bg.png") no-repeat 0
bottom;
background-size: 100% 630px;
.top { .top {
padding-top: 400px; padding-top: 400px;
@ -247,13 +239,22 @@ const fnSubmit = debounce(
} }
.bot { .bot {
padding-top: 700px; padding-top: 200px;
h1 { h1 {
font-size: 18px; font-size: 18px;
text-align: center; text-align: center;
} }
} }
img {
position: absolute;
left: 0;
right: 0;
bottom: -100px;
height: 407px;
width: 100%;
z-index: -1;
} }
} }
</style> </style>