Browse Source

项目模块打印优化

ljb 6 months ago
parent
commit
8a5cc6a8a4

+ 31 - 15
src/views/project-manage/components/accept-form.vue

@@ -5,26 +5,29 @@
     </div>
   
     <div id="acceptDoc" class="doc-page" v-loading="loading">
-      <h3 class="page-title" style="height: 60px; line-height: 60px; margin: 0;">{{ teantData.tenantName }}</h3>
-      <h3 class="page-title" style="margin: 5px 0 16px;">研发项目验收资料</h3>
+      <div :class="['doc-header', { printCls: isPrintPage }]">
+        <h3 class="page-title" style="height: 60px; line-height: 60px; margin: 0;">{{ teantData.tenantName }}</h3>
+        <h3 class="page-title" style="margin: 5px 0 16px;">研发项目验收资料</h3>
 
-      <div class="project-basic-info">
-        <div class="info-row">{{ `研发项目名称:${ selProject.xmmc || '' }` }}</div>
-        <div class="info-row">{{ `项目负责人:${ selProject.xmfzrxm || '' }` }}</div>
-        <div class="info-row">{{ `项目申请单位:${ selProject.xmsqdw || '' }` }}</div>
-        <div class="info-row">{{ `项目执行期:${ getXmDateRange || '' }` }}</div>
-        <div class="info-row">
-          <span>填报时间:</span>
-          <span>
-            <el-date-picker v-show="!isPrintPage" v-model="formData.tbsj" value-format="yyyy-MM-dd" />
-            <span v-show="isPrintPage">{{ formData.tbsj }}</span>
-          </span>
+        <div class="project-basic-info">
+          <div class="info-row">{{ `研发项目名称:${ selProject.xmmc || '' }` }}</div>
+          <div class="info-row">{{ `项目负责人:${ selProject.xmfzrxm || '' }` }}</div>
+          <div class="info-row">{{ `项目申请单位:${ selProject.xmsqdw || '' }` }}</div>
+          <div class="info-row">{{ `项目执行期:${ getXmDateRange || '' }` }}</div>
+          <div class="info-row">
+            <span>填报时间:</span>
+            <span>
+              <el-date-picker v-show="!isPrintPage" v-model="formData.tbsj" value-format="yyyy-MM-dd" />
+              <span v-show="isPrintPage">{{ formData.tbsj }}</span>
+            </span>
+          </div>
         </div>
       </div>
 
       <!-- 打印强制分页 -->
       <div style="page-break-after: always;"></div>
 
+      <h3 class="page-title" style="margin: 24px 0 16px;">研发项目验收申请表</h3>
       <table style="margin-top: 20px;">
         <tbody>
           <tr>
@@ -426,7 +429,7 @@ export default {
 <style lang="scss" scoped>
 .page-title {
   text-align: center;
-  font-size: 24px;
+  font-size: 26px;
 }
 
 .project-basic-info .info-row {
@@ -434,8 +437,21 @@ export default {
   color: #333;
 }
 
+.doc-header.printCls {
+  padding-top: 50mm;
+  .project-basic-info {
+    padding-top: 20mm;
+    padding-left: 30mm;
+    font-size: 20px;
+    font-weight: 600;
+    .info-row {
+      line-height: 50px;
+    }
+  }
+}
+
 .doc-page {
-  width: 800px;
+  width: 760px;
   margin: 0 auto 30px;
 }
 table {

+ 24 - 9
src/views/project-manage/components/apply-form.vue

@@ -5,13 +5,15 @@
       <el-button size="small" type="primary" icon="el-icon-printer" v-print="printConfig" @click="isPrintPage = true">打印</el-button>
     </div>
     <div id="applyDoc" class="apply-form" v-loading="loading">
-      <h3 class="page-title" style="height: 60px; line-height: 60px; margin: 0;">{{ teantData.tenantName }}</h3>
-      <h3 class="page-title" style="margin: 5px 0 16px;">{{ getDocTile }}</h3>
-      <div class="project-basic-info">
-        <div class="info-row">{{ `研发项目名称:${ formData.xmmc || '' }` }}</div>
-        <div class="info-row">{{ `项目负责人:${ getXmfzrName || '' }` }}</div>
-        <div class="info-row">{{ `项目申请单位:${ xmsqdwName }` }}</div>
-        <div class="info-row">{{ `项目执行期:${ getXmDateRange || '' }` }}</div>
+      <div :class="['doc-header', { printCls: isPrintPage }]">
+        <h3 class="page-title" style="height: 60px; line-height: 60px; margin: 0;">{{ teantData.tenantName }}</h3>
+        <h3 class="page-title" style="margin: 5px 0 16px;">{{ getDocTile }}</h3>
+        <div class="project-basic-info">
+          <div class="info-row">{{ `研发项目名称:${ formData.xmmc || '' }` }}</div>
+          <div class="info-row">{{ `项目负责人:${ getXmfzrName || '' }` }}</div>
+          <div class="info-row">{{ `项目申请单位:${ xmsqdwName }` }}</div>
+          <div class="info-row">{{ `项目执行期:${ getXmDateRange || '' }` }}</div>
+        </div>
       </div>
 
       <!-- 打印强制分页 -->
@@ -731,7 +733,7 @@ export default {
 <style lang="scss" scoped>
 .page-title {
   text-align: center;
-  font-size: 24px;
+  font-size: 26px;
 }
 
 .project-basic-info .info-row {
@@ -739,8 +741,21 @@ export default {
   color: #333;
 }
 
+.doc-header.printCls {
+  padding-top: 50mm;
+  .project-basic-info {
+    padding-top: 20mm;
+    padding-left: 30mm;
+    font-size: 20px;
+    font-weight: 600;
+    .info-row {
+      line-height: 50px;
+    }
+  }
+}
+
 .apply-form {
-  width: 800px;
+  width: 760px;
   margin: 30px auto;
 }
 table {

+ 1 - 1
src/views/project-manage/components/change-form.vue

@@ -448,7 +448,7 @@ export default {
 }
 
 .doc-page {
-  width: 800px;
+  width: 760px;
   margin: 0 auto;
 }
 table {

+ 40 - 23
src/views/project-manage/components/implement-form.vue

@@ -4,33 +4,36 @@
       <el-button v-if="implementId" size="small" type="primary" icon="el-icon-printer" v-print="printConfig" @click="isPrintPage = true">打印</el-button>
     </div>
     <div id="implementDoc" class="doc-page" v-loading="loading">
-      <h3 class="page-title" style="height: 60px; line-height: 60px; margin: 0;">{{ teantData.tenantName }}</h3>
-      <h3 class="page-title" style="margin: 5px 0 16px;">研发项目阶段性报告</h3>
+      <div :class="['doc-header', { printCls: isPrintPage }]">
+        <h3 class="page-title" style="height: 60px; line-height: 60px; margin: 0;">{{ teantData.tenantName }}</h3>
+        <h3 class="page-title" style="margin: 5px 0 16px;">研发项目阶段性报告</h3>
 
-      <div class="project-basic-info">
-        <div class="info-row">
-          <span v-if="!disabled">{{ `研发项目名称:${ selProject.xmmc || '' }` }}</span>
-          <span v-else>{{ `研发项目名称:${ formData.xmEntity ? formData.xmEntity.xmmc : '' }` }}</span>
-        </div>
-        <div class="info-row">
-          <span v-if="!disabled">{{ `项目负责人:${ selProject.xmmc || '' }` }}</span>
-          <span v-else>{{ `项目负责人:${ formData.xmEntity ? formData.xmEntity.xmfzrxm : '' }` }}</span>
-        </div>
-        <div class="info-row">
-          <span v-if="!disabled">{{ `项目申请单位:${ selProject.xmsqdw || '' }` }}</span>
-          <span v-else>{{ `项目申请单位:${ formData.xmEntity ? formData.xmEntity.xmsqdw : '' }` }}</span>
-        </div>
-        <div class="info-row">{{ `项目执行期:${ getXmDateRange || '' }` }}</div>
-        <div class="info-row">
-          <span>填报时间:</span>
-          <span v-if="!disabled"><el-date-picker v-model="formData.fillDate" value-format="yyyy-MM-dd" @change="handleFillDateChange" :disabled="disabled" /></span>
-          <span v-else>{{ formData.fillDate }}</span>
+        <div class="project-basic-info">
+          <div class="info-row">
+            <span v-if="!disabled">{{ `研发项目名称:${ selProject.xmmc || '' }` }}</span>
+            <span v-else>{{ `研发项目名称:${ formData.xmEntity ? formData.xmEntity.xmmc : '' }` }}</span>
+          </div>
+          <div class="info-row">
+            <span v-if="!disabled">{{ `项目负责人:${ selProject.xmmc || '' }` }}</span>
+            <span v-else>{{ `项目负责人:${ formData.xmEntity ? formData.xmEntity.xmfzrxm : '' }` }}</span>
+          </div>
+          <div class="info-row">
+            <span v-if="!disabled">{{ `项目申请单位:${ selProject.xmsqdw || '' }` }}</span>
+            <span v-else>{{ `项目申请单位:${ formData.xmEntity ? formData.xmEntity.xmsqdw : '' }` }}</span>
+          </div>
+          <div class="info-row">{{ `项目执行期:${ getXmDateRange || '' }` }}</div>
+          <div class="info-row">
+            <span>填报时间:</span>
+            <span v-if="!disabled"><el-date-picker v-model="formData.fillDate" value-format="yyyy-MM-dd" @change="handleFillDateChange" :disabled="disabled" /></span>
+            <span v-else>{{ formData.fillDate }}</span>
+          </div>
         </div>
       </div>
 
       <!-- 打印强制分页 -->
       <div style="page-break-after: always;"></div>
 
+       <h3 class="page-title" style="margin: 5px 0 16px;">研发项目实施申请表</h3>
       <table style="margin-top: 20px;">
         <tbody>
           <tr>
@@ -365,14 +368,14 @@ export default {
 
 <style lang="scss" scoped>
 .tool-btn {
-  width: 800px;
+  width: 760px;
   text-align: right;
   margin: 0 auto;
 }
 
 .page-title {
   text-align: center;
-  font-size: 24px;
+  font-size: 26px;
 }
 
 .project-basic-info .info-row {
@@ -380,8 +383,22 @@ export default {
   color: #333;
 }
 
+.doc-header.printCls {
+  padding-top: 50mm;
+  .project-basic-info {
+    padding-top: 20mm;
+    padding-left: 30mm;
+    font-size: 20px;
+    font-weight: 600;
+    .info-row {
+      line-height: 50px;
+    }
+  }
+}
+
+
 .doc-page {
-  width: 800px;
+  width: 760px;
   margin: 30px auto;
 }
 table {