From fdfc3f5659f6514ef4b894ccfd727d0b41405b4c Mon Sep 17 00:00:00 2001
From: "15881625488@163.com" <15881625488@163.com>
Date: Mon, 2 Feb 2026 16:48:35 +0800
Subject: [PATCH] =?UTF-8?q?feat=EF=BC=9A[=E7=94=B3=E8=AF=B7=E8=A1=A8?=
 =?UTF-8?q?=E5=8D=95=EF=BC=8C=E8=AE=A1=E5=88=92=E8=A1=A8=E5=8D=95]?=
 =?UTF-8?q?=E5=AF=BC=E5=87=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/business/study/studyFormApply.js           |   8 +-
 src/api/business/study/studyFormPlan.js            |   8 +-
 .../comps/template/comps/gsp/SYWZPZJHB.vue         |   4 +-
 src/views/business/study/comp/jhbd/Xq.vue          | 468 +++++++++++++++++++--
 src/views/business/study/comp/sqbd/Xq.vue          | 401 +++++++++++++++---
 src/views/business/study/comp/ytbd/Bj.vue          |  10 +-
 6 files changed, 795 insertions(+), 104 deletions(-)

diff --git a/src/api/business/study/studyFormApply.js b/src/api/business/study/studyFormApply.js
index b14d96c..8c4200b 100644
--- a/src/api/business/study/studyFormApply.js
+++ b/src/api/business/study/studyFormApply.js
@@ -24,7 +24,13 @@ export function studyFormApply_qmxx(query) {
     params: query
   })
 }
-
+export function studyFormApply_jcgjqmxxList(query) {
+  return request({
+    url: '/system/business/studyFormApply/jcgjqmxxList',
+    method: 'get',
+    params: query
+  })
+}
 //详情
 export function studyFormApply_info(query) {
   return request({
diff --git a/src/api/business/study/studyFormPlan.js b/src/api/business/study/studyFormPlan.js
index be88b3a..1088999 100644
--- a/src/api/business/study/studyFormPlan.js
+++ b/src/api/business/study/studyFormPlan.js
@@ -24,7 +24,13 @@ export function studyFormPlan_qmxx(query) {
     params: query
   })
 }
-
+export function studyFormPlan_jcgjqmxxList(query) {
+  return request({
+    url: '/system/business/studyFormPlan/jcgjqmxxList',
+    method: 'get',
+    params: query
+  })
+}
 //详情
 export function studyFormPlan_info(query) {
   return request({
diff --git a/src/views/business/comps/template/comps/gsp/SYWZPZJHB.vue b/src/views/business/comps/template/comps/gsp/SYWZPZJHB.vue
index b899488..949c8bc 100644
--- a/src/views/business/comps/template/comps/gsp/SYWZPZJHB.vue
+++ b/src/views/business/comps/template/comps/gsp/SYWZPZJHB.vue
@@ -149,7 +149,7 @@ export default {
 					width: 280,
 					headerSelectKey: "preparationConcentrationUnit",
 					fillType: "actFill",
-					headerOptions: this.$store.state.template.volumeOptions,
+					headerOptions: this.getDictOptions('business_nddw'),
 					defaultValue: "mg",
 					bodyType: "inputNumber",
 					bodyFillType: "actFill",
@@ -161,7 +161,7 @@ export default {
 					width: 280,
 					headerSelectKey: "preparationVolumeUnit",
 					fillType: "actFill",
-					headerOptions: this.$store.state.template.volumeOptions,
+					headerOptions: this.getDictOptions('business_tjdw'),
 					bodyType: "inputNumber",
 					bodyFillType: "actFill",
 					bodyMaxlength: 10,
diff --git a/src/views/business/study/comp/jhbd/Xq.vue b/src/views/business/study/comp/jhbd/Xq.vue
index 32a2fee..cb9c841 100644
--- a/src/views/business/study/comp/jhbd/Xq.vue
+++ b/src/views/business/study/comp/jhbd/Xq.vue
@@ -10,66 +10,174 @@
         </div>
         <div class="right-top">
           <el-button @click="cancel()">{{ $t('form.close') }}</el-button>
+          <el-button type="primary" v-if="form.bdzt === 5 && form.tbzt === 1" @click="openApprove = true">{{
+            $t('page.business.study.studyFormPlan.tb') }}</el-button>
         </div>
       </div>
-      <div class="edit-content ">
-        <div class="content">
-          <!-- 1:流程；3：编辑；5：人员；7：修改；9：补充说明 -->
-          <el-button type="primary" @click="exportExcel(-1)">{{ $t('page.business.study.studyFormPlan.dcqbjcgj') }}
-          </el-button>
-          <el-button type="primary" @click="exportExcel(1)">{{ $t('page.business.study.studyFormPlan.dclcjcgj') }}
-          </el-button>
-          <el-button type="primary" @click="exportExcel(3)">{{ $t('page.business.study.studyFormPlan.dcbjjcgj') }}
-          </el-button>
-          <el-button type="primary" @click="exportExcel(7)">{{ $t('page.business.study.studyFormPlan.dcxgjcgj') }}
-          </el-button>
-          <el-button type="primary" @click="exportExcel(999)">{{ $t('page.business.study.studyFormPlan.dcbhsjgj') }}
-          </el-button>
-          <TemplateTable ref="templateTable" :sn="form.templateSn" fillType="audit" :templateData="form" />
-          <div class="content-title">
-            <div class="line"></div>
-            <div class="subtitle"> {{ $t('page.business.study.studyFormPlan.qmxx') }}</div>
-          </div>
-          <div class="pal">
-            <el-table :data="qmxxList" v-loading="loadingQmxx">
-              <el-table-column :label="$t('page.business.study.studyFormPlan.qmr')" align="center" prop="qmrMc"
-                width="150px" />
-              <el-table-column :label="$t('page.business.study.studyFormPlan.qmyy')" align="center"
-                :prop="$i18n.locale === 'zh_CN' ? 'qmyy' : 'qmyyEn'" width="150px" />
-              <el-table-column :label="$t('page.business.study.studyFormPlan.qmsj')" align="center" prop="createTime"
-                width="150px" />
-              <el-table-column :label="$t('page.business.study.studyFormPlan.bzyy')" align="center" prop="remark"
-                :show-overflow-tooltip="true" />
-            </el-table>
-          </div>
-          <div class="pal">
-            <pagination v-show="totalQmxx > 0" :total="totalQmxx" :page.sync="queryParamsQmxx.pageNum"
+      <!-- 1:流程；3：编辑；5：人员；7：修改；9：补充说明 -->
+      <el-button type="primary" @click="exportExcel(-1)">{{ $t('page.business.study.studyFormPlan.dcqbjcgj') }}
+      </el-button>
+      <el-button type="primary" @click="exportExcel(1)">{{ $t('page.business.study.studyFormPlan.dclcjcgj') }}
+      </el-button>
+      <el-button type="primary" @click="exportExcel(3)">{{ $t('page.business.study.studyFormPlan.dcbjjcgj') }}
+      </el-button>
+      <el-button type="primary" @click="exportExcel(7)">{{ $t('page.business.study.studyFormPlan.dcxgjcgj') }}
+      </el-button>
+      <el-button type="primary" @click="exportExcel(999)">{{ $t('page.business.study.studyFormPlan.dcbhsjgj') }}
+      </el-button>
+      <div class="edit-content">
+        <div class="detail-content" style="width: 100%; height: 100%;">
+          <vue-html2pdf :show-layout="true" pdf-content-width="100%" :pdf-format="form.templatePdfSize" :pdf-quality="2"
+            :float-layout="false" pdf-orientation="landscape" :paginate-elements-by-height="0" :enable-download="true"
+            :preview-modal="false" :filename="form.bdmc" @beforeDownload="addDynamicWatermark" ref="html2Pdf"
+            @progress="onProgress">
+            <section slot="pdf-content">
+              <div class="pdf-content">
+                <TemplateTable ref="templateTable" :sn="form.templateSn" :templateData="form" fillType="detail" />
+                <div v-if="showExport" style="width: 100%; padding: 0px 30px ;">
+                  <div class="content-title" style="margin-bottom: 10px;">
+                    <div class="line"></div>
+                    <div class="subtitle"> {{ $t('page.business.study.studyFormPlan.qmxx') }}</div>
+                  </div>
+                  <table class="datatable">
+                    <thead>
+                      <tr>
+                        <th style="width: 20%;">{{ $t('page.business.study.studyFormPlan.qmr') }}</th>
+                        <th style="width: 20%;">{{ $t('page.business.study.studyFormPlan.qmyy') }}</th>
+                        <th style="width: 20%;">{{ $t('page.business.study.studyFormPlan.qmsj') }}</th>
+                        <th style="width: 40%;">{{ $t('page.business.study.studyFormPlan.bzyy') }}</th>
+                      </tr>
+                    </thead>
+                    <tbody>
+                      <tr v-for="(item, index) in qmxxExportList" :key="index">
+                        <td>{{ item.qmrMc }}</td>
+                        <td>{{ $i18n.locale === 'zh_CN' ? item.qmyy : item.qmyyEn }}</td>
+                        <td>{{ item.createTime }}</td>
+                        <td>{{ item.remark }}</td>
+                      </tr>
+                    </tbody>
+                  </table>
+                  <div class="content-title" style="margin-top: 10px;" v-show="jcgjlxExport != 999">
+                    <div class="line"></div>
+                    <div class="subtitle"> {{ $t('page.business.study.studyFormPlan.jcgj') }}</div>
+                  </div>
+                  <JcgjList ref="jcgjExportList" :readonly="true" v-show="jcgjlxExport != 999" />
+                </div>
+              </div>
+              <div v-if="showExport" id="watermark-overlay"  ref="watermarkContainer" :style="{
+                '--watermark-text': `'${watermarkText}'`,
+                '--watermark-opacity': opacity,
+                '--watermark-size': '14px',
+                '--watermark-color': 'red'
+              }"></div>
+            </section>
+          </vue-html2pdf>
+          <div style="padding: 0px 20px 0px 30px;margin-left: 10px;">
+            <div class="content-title">
+              <div class="line"></div>
+              <div class="subtitle"> {{ $t('page.business.study.studyFormPlan.qmxx') }}</div>
+            </div>
+            <div class="pal">
+              <el-table :data="qmxxList" v-loading="loadingQmxx" style="width: 100%;">
+                <el-table-column :label="$t('page.business.study.studyFormPlan.qmr')" align="center" prop="qmrMc" />
+                <el-table-column :label="$t('page.business.study.studyFormPlan.qmyy')" align="center"
+                  :prop="$i18n.locale === 'zh_CN' ? 'qmyy' : 'qmyyEn'" />
+                <el-table-column :label="$t('page.business.study.studyFormPlan.qmsj')" align="center"
+                  prop="createTime" />
+                <el-table-column :label="$t('page.business.study.studyFormPlan.bzyy')" align="center" prop="remark" />
+              </el-table>
+            </div>
+            <pagination v small layout="prev, pager, next" :total="totalQmxx" :page.sync="queryParamsQmxx.pageNum"
               :limit.sync="queryParamsQmxx.pageSize" @pagination="getQmxxList" />
+            <div class="content-title" style="margin-top: 10px;">
+              <div class="line"></div>
+              <div class="subtitle"> {{ $t('page.business.study.studyFormPlan.jcgj') }}</div>
+            </div>
+            <JcgjList ref="jcgjList" @handleQuery="getJjcgjList" :showXg="true" />
+            <pagination v small layout="prev, pager, next" :total="jcgjTotal" @pagination="getJjcgjList" />
           </div>
-          <div class="content-title">
-            <div class="line"></div>
-            <div class="subtitle"> {{ $t('page.business.study.studyFormPlan.jcgj') }}</div>
-          </div>
-          <JcgjList ref="jcgjList" @handleQuery="getJjcgjList" :showXg="true" />
-          <pagination v-show="jcgjTotal > 0" small layout="prev, pager, next" :total="jcgjTotal"
-            @pagination="getJjcgjList" />
         </div>
       </div>
     </div>
+
+    <!-- 填报 -->
+    <el-dialog :title="$t('page.business.study.studyFormPlan.cjjl')" :visible.sync="openApprove" width="500px"
+      append-to-body :close-on-click-modal="false">
+      <el-form ref="formApprove" :model="formApprove" :rules="rulesApprove" label-width="120px" v-if="openApprove">
+        <el-alert :title="$t('page.business.study.studyFormPlan.ts')" :closable="false" type="success">
+        </el-alert>
+        <el-row>
+          <el-col :span="24">
+            <el-form-item :label="$t('form.qmyy')" prop="qmyy">
+              <el-input type="text" :value="formApprove.qmyy" maxlength="50" disabled
+                :placeholder="$t('form.placeholderInput')" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="24">
+            <el-form-item :label="$t('form.remark')" prop="remark">
+              <el-input type="textarea" v-model="formApprove.remark" :rows="5" maxlength="500"
+                :placeholder="$t('form.placeholderInput')">
+              </el-input>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="24">
+            <el-form-item :label="$t('form.signer')">
+              <el-input type="text" v-model="nickName" maxlength="50" disabled
+                :placeholder="$t('form.placeholderInput')" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-row>
+          <el-col :span="24">
+            <el-form-item :label="$t('form.password')" prop="qmrmm">
+              <el-input type="password" show-password v-model="formApprove.qmrmm" maxlength="20"
+                :placeholder="$t('form.placeholderInput')" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="approve">{{ $t('form.confirm') }}</el-button>
+        <el-button @click="openApprove = false">{{ $t('form.cancel') }}</el-button>
+      </div>
+    </el-dialog>
   </div>
 </template>
 
 <script>
-import { studyFormPlan_info, studyFormPlan_jcgj, studyFormPlan_qmxx, studyFormPlan_exportDetail } from "@/api/business/study/studyFormPlan"
+import { studyFormPlan_jcgjqmxxList, studyFormPlan_tb, studyFormPlan_info, studyFormPlan_jcgj, studyFormPlan_qmxx, studyFormPlan_exportDetail } from "@/api/business/study/studyFormPlan"
 import { mapGetters } from 'vuex'
 import JcgjList from "@/views/business/comps/common/JcgjList";
 import TemplateTable from '@/views/business/comps/template/TemplateTable';
-
+import moment from "moment";
+import VueHtml2pdf from 'vue-html2pdf'
 export default {
   name: "Xq",
-  components: { JcgjList, TemplateTable },
+  components: { JcgjList, TemplateTable, VueHtml2pdf },
   data() {
     return {
+      watermarkText:'',
+      opacity: 0.8,
+      watermarkOpacity: 0.8,
+      watermarkSize: 40,
+      openApprove: false,
+      formApprove: {
+        id: null,
+        qmyy: this.$t('page.business.study.studyFormPlan.cjjl'),
+        remark: '',
+        qmrmm: '',
+      },
+      rulesApprove: {
+        qmrmm: [{
+          required: true,
+          message: ' ',
+          trigger: 'blur'
+        }]
+      },
       qmxxList: [],
       totalQmxx: 0,
       loadingQmxx: true,
@@ -100,7 +208,11 @@ export default {
         pageNum: 1,
         formId: null,
         pageSize: 5,
-      }
+      },
+      showExport: false,
+      qmxxExportList: [],
+      jcgjExportList: [],
+      jcgjlxExport: 0
     }
   },
   computed: {
@@ -111,8 +223,120 @@ export default {
   created() {
   },
   methods: {
+    updateWatermark() {
+      // 创建水印背景
+      const text = this.nickName +' '+ moment().format("YYYY-MM-DD HH:mm:ss");
+      const canvas = document.createElement('canvas');
+      const ctx = canvas.getContext('2d');
+
+      // 设置canvas尺寸
+      canvas.width = 300;
+      canvas.height = 300;
+
+      // 绘制水印
+      ctx.fillStyle = `rgba(255, 0, 0,  ${this.opacity})`;
+      ctx.font = '12px Arial';
+      ctx.textAlign = 'center';
+      ctx.textBaseline = 'middle';
+
+      // 旋转45度
+      ctx.translate(canvas.width / 2, canvas.height / 2);
+      ctx.rotate(-45 * Math.PI / 180);
+      ctx.fillText(text, 0, 0);
+
+      // 设置为背景
+      const container = this.$refs.watermarkContainer;
+      container.style.backgroundImage = `url(${canvas.toDataURL()})`;
+      container.style.backgroundRepeat = 'repeat';
+    },
+    onProgress(progress) {
+      console.log(`生成进度: ${progress}%`)
+      this.removePageBreak()
+      if (progress == 100) {
+        this.showExport = false
+        this.$modal.closeLoading()
+      }
+    },
     exportExcel(jcgjlx) {
       this.$modal.loading()
+      this.jcgjlxExport = jcgjlx
+      this.showExport = true
+      studyFormPlan_jcgjqmxxList({ jcgjlx: jcgjlx, id: this.form.id }).then(response => {
+        this.jcgjExportList = response.data.jcgj
+        this.qmxxExportList = response.data.qmxx
+        this.updateWatermark()
+        this.$refs.jcgjExportList.init(this.jcgjExportList)
+        setTimeout(() => {
+          this.$refs.html2Pdf.generatePdf()
+        }, 200);
+      })
+    },
+    //添加水印
+    async addDynamicWatermark({ pdfContent }) {
+      return new Promise((resolve) => {
+        const canvas = document.createElement('canvas')
+        const ctx = canvas.getContext('2d')
+
+        // 获取内容区域尺寸
+        const rect = this.$refs.contentArea.getBoundingClientRect()
+        canvas.width = rect.width
+        canvas.height = rect.height
+
+        // 绘制动态水印
+        ctx.fillStyle = `rgba(100, 100, 100, ${this.watermarkOpacity})`
+        ctx.font = `${this.watermarkSize}px Arial`
+        ctx.textAlign = 'center'
+        ctx.textBaseline = 'middle'
+
+        // 计算水印密度
+        const stepX = 300
+        const stepY = 200
+
+        // 绘制倾斜水印
+        ctx.save()
+        ctx.translate(canvas.width / 2, canvas.height / 2)
+        ctx.rotate(-Math.PI / 4) // 45度倾斜
+
+        for (let x = -canvas.width; x < canvas.width * 2; x += stepX) {
+          for (let y = -canvas.height; y < canvas.height * 2; y += stepY) {
+            // 动态水印内容
+            const dynamicText = `${this.watermarkText} - ${this.getCurrentTime()}`
+            ctx.fillText(dynamicText, x, y)
+          }
+        }
+        ctx.restore()
+
+        // 创建水印层
+        const watermarkLayer = document.createElement('div')
+        watermarkLayer.className = 'watermark-layer'
+        watermarkLayer.style.cssText = `
+          position: absolute;
+          top: 0;
+          left: 0;
+          width: 100%;
+          height: 100%;
+          pointer-events: none;
+          background-image: url(${canvas.toDataURL('image/png')});
+          background-repeat: repeat;
+          z-index: 9999;
+        `
+
+        // 插入水印
+        this.$refs.contentArea.style.position = 'relative'
+        this.$refs.contentArea.appendChild(watermarkLayer)
+
+        // 等待渲染
+        setTimeout(() => resolve(), 100)
+      })
+    },
+    //移除分页空白
+    removePageBreak() {
+      document.querySelectorAll('.html2pdf__page-break').forEach(el => {
+        el.remove()
+      })
+    },
+    exportExcel_bak(jcgjlx) {
+      this.$modal.loading()
       studyFormPlan_exportDetail(_.merge({}, this.queryParamsJcgj, { jcgjlx: jcgjlx, lang: this.$store.getters.language.split("_")[0] })).then(response => {
         window.open(process.env.VUE_APP_FILE_DOMAIN + response.msg)
       }).finally(() => {
@@ -157,6 +381,7 @@ export default {
     show(row) {
       this.reset()
       this.$modal.loading()
+      this.formApprove.id = row.id
       this.queryParamsJcgj.formId = row.id
       this.queryParamsQmxx.formId = row.id
       studyFormPlan_info({ id: row.id }).then(response => {
@@ -167,7 +392,164 @@ export default {
       }).finally(() => {
         this.$modal.closeLoading()
       })
+    },
+    approve() {
+      this.$refs["formApprove"].validate(valid => {
+        if (valid) {
+          this.$modal.loading()
+          studyFormPlan_tb(this.formApprove).then(response => {
+            this.openApprove = false
+            this.$emit('close')
+            this.open = false
+          }).finally(() => {
+            this.$modal.closeLoading()
+          })
+        }
+      })
     }
   }
 }
 </script>
+<style scoped>
+.content-title {
+  width: 100%;
+  background: #f9f9ff;
+  font-size: 0.96rem;
+  font-weight: bold;
+  padding-left: 10px;
+  height: 40px;
+  line-height: 40px;
+  display: flex;
+  justify-content: flex-start;
+  text-align: left;
+}
+
+.line {
+  width: 2px;
+  float: left;
+  height: 16px;
+  margin-top: 12px;
+  margin-right: 8px;
+  border-left: #3178ff 3px solid;
+}
+
+.subtitle {
+  height: 40px;
+  line-height: 40px;
+  color: #464647 !important;
+}
+
+
+.pdf-content {
+  padding: 20px;
+  font-family: Arial, sans-serif;
+
+  
+}
+#watermark-overlay {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  opacity: 0.6;
+  font-size: 12px;
+  pointer-events: none;
+  z-index: 10;
+  color: red;
+}
+
+.pdf-content h1 {
+  color: #333;
+  border-bottom: 2px solid #4CAF50;
+  padding-bottom: 10px;
+}
+
+.pdf-content table {
+  width: 100%;
+  border-collapse: collapse;
+  margin-top: 20px;
+}
+
+.pdf-content th,
+.pdf-content td {
+  border: 1px solid #ddd;
+  padding: 8px;
+  text-align: left;
+}
+
+.pdf-content th {
+  background-color: #f2f2f2;
+}
+
+.datatable {
+  border-collapse: collapse;
+  width: 100%;
+}
+
+.upload-file-list .el-upload-list__item {
+  margin-bottom: 0px !important;
+}
+
+.datatable thead {
+  border-left: 1px solid #d0d0d0;
+}
+
+.datatable th {
+  padding: 5px 5px 4px 5px;
+  max-width: 200px;
+  line-height: 35px;
+  text-align: center;
+  color: #414753;
+  background: #F5F7FA;
+  border: 1px solid #d0d0d0;
+}
+
+.el-dialog__body {
+  padding: 10px 20px !important;
+}
+
+.datatable th.operate {
+  padding: 5px 5px 4px 5px;
+  width: 100px;
+  line-height: 35px;
+  background: #F5F7FA;
+  border: 1px solid #d0d0d0;
+  text-align: center;
+}
+
+.datatable .rowAlt td,
+.datatable tbody tr:nth-child(2n) td {
+  background: #F5F7FA;
+}
+
+.datatable td {
+  border: solid 1px #d0d0d0;
+  padding: 3px 5px 4px 5px;
+  max-width: 100px;
+  color: #414753;
+  line-height: 35px;
+  text-align: center;
+}
+
+.html2pdf__page-break {
+  display: none !important;
+}
+
+
+.content {
+  position: relative;
+  z-index: 1;
+}
+
+.controls {
+  margin-bottom: 20px;
+  padding: 10px;
+  background: #f5f5f5;
+}
+
+input {
+  margin: 0 10px;
+  padding: 8px;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/business/study/comp/sqbd/Xq.vue b/src/views/business/study/comp/sqbd/Xq.vue
index 0568164..975e963 100644
--- a/src/views/business/study/comp/sqbd/Xq.vue
+++ b/src/views/business/study/comp/sqbd/Xq.vue
@@ -14,52 +14,89 @@
             $t('page.business.study.studyFormApply.tb') }}</el-button>
         </div>
       </div>
-      <div class="edit-content ">
-        <div class="content">
-          <div>
-            <!-- 1:流程；3：编辑；5：人员；7：修改；9：补充说明 -->
-            <el-button type="primary" @click="exportExcel(-1)">{{ $t('page.business.study.studyFormApply.dcqbjcgj') }}
-            </el-button>
-            <el-button type="primary" @click="exportExcel(1)">{{ $t('page.business.study.studyFormApply.dclcjcgj') }}
-            </el-button>
-            <el-button type="primary" @click="exportExcel(3)">{{ $t('page.business.study.studyFormApply.dcbjjcgj') }}
-            </el-button>
-            <el-button type="primary" @click="exportExcel(7)">{{ $t('page.business.study.studyFormApply.dcxgjcgj') }}
-            </el-button>
-            <el-button type="primary" @click="exportExcel(999)">{{ $t('page.business.study.studyFormApply.dcbhsjgj') }}
-            </el-button>
-          </div>
-          <TemplateTable ref="templateTable" :sn="form.templateSn" :templateData="form" fillType="audit" />
-          <div class="content-title">
-            <div class="line"></div>
-            <div class="subtitle"> {{ $t('page.business.study.studyFormApply.qmxx') }}</div>
-          </div>
-          <div class="pal">
-            <el-table :data="qmxxList" v-loading="loadingQmxx">
-              <el-table-column :label="$t('page.business.study.studyFormApply.qmr')" align="center" prop="qmrMc"
-                width="150px" />
-              <el-table-column :label="$t('page.business.study.studyFormApply.qmyy')" align="center"
-                :prop="$i18n.locale === 'zh_CN' ? 'qmyy' : 'qmyyEn'" width="150px" />
-              <el-table-column :label="$t('page.business.study.studyFormApply.qmsj')" align="center" prop="createTime"
-                width="150px" />
-              <el-table-column :label="$t('page.business.study.studyFormApply.bzyy')" align="center" prop="remark"
-                :show-overflow-tooltip="true" />
-            </el-table>
-          </div>
-          <div class="pal">
-            <pagination v-show="totalQmxx > 0" :total="totalQmxx" :page.sync="queryParamsQmxx.pageNum"
+      <!-- 1:流程；3：编辑；5：人员；7：修改；9：补充说明 -->
+      <el-button type="primary" @click="exportExcel(-1)">{{ $t('page.business.study.studyFormApply.dcqbjcgj') }}
+      </el-button>
+      <el-button type="primary" @click="exportExcel(1)">{{ $t('page.business.study.studyFormApply.dclcjcgj') }}
+      </el-button>
+      <el-button type="primary" @click="exportExcel(3)">{{ $t('page.business.study.studyFormApply.dcbjjcgj') }}
+      </el-button>
+      <el-button type="primary" @click="exportExcel(7)">{{ $t('page.business.study.studyFormApply.dcxgjcgj') }}
+      </el-button>
+      <el-button type="primary" @click="exportExcel(999)">{{ $t('page.business.study.studyFormApply.dcbhsjgj') }}
+      </el-button>
+      <div class="edit-content">
+        <div class="detail-content" style="width: 100%; height: 100%;">
+          <vue-html2pdf :show-layout="true" pdf-content-width="100%" :pdf-format="form.templatePdfSize" :pdf-quality="2"
+            :float-layout="false" pdf-orientation="landscape" :paginate-elements-by-height="0" :enable-download="true"
+            :preview-modal="false" :filename="form.bdmc" @beforeDownload="addDynamicWatermark" ref="html2Pdf"
+            @progress="onProgress">
+            <section slot="pdf-content">
+              <div class="pdf-content">
+                <TemplateTable ref="templateTable" :sn="form.templateSn" :templateData="form" fillType="detail" />
+                <div v-if="showExport" style="width: 100%; padding: 0px 30px ;">
+                  <div class="content-title" style="margin-bottom: 10px;">
+                    <div class="line"></div>
+                    <div class="subtitle"> {{ $t('page.business.study.studyFormApply.qmxx') }}</div>
+                  </div>
+                  <table class="datatable">
+                    <thead>
+                      <tr>
+                        <th style="width: 20%;">{{ $t('page.business.study.studyFormApply.qmr') }}</th>
+                        <th style="width: 20%;">{{ $t('page.business.study.studyFormApply.qmyy') }}</th>
+                        <th style="width: 20%;">{{ $t('page.business.study.studyFormApply.qmsj') }}</th>
+                        <th style="width: 40%;">{{ $t('page.business.study.studyFormApply.bzyy') }}</th>
+                      </tr>
+                    </thead>
+                    <tbody>
+                      <tr v-for="(item, index) in qmxxExportList" :key="index">
+                        <td>{{ item.qmrMc }}</td>
+                        <td>{{ $i18n.locale === 'zh_CN' ? item.qmyy : item.qmyyEn }}</td>
+                        <td>{{ item.createTime }}</td>
+                        <td>{{ item.remark }}</td>
+                      </tr>
+                    </tbody>
+                  </table>
+                  <div class="content-title" style="margin-top: 10px;" v-show="jcgjlxExport != 999">
+                    <div class="line"></div>
+                    <div class="subtitle"> {{ $t('page.business.study.studyFormApply.jcgj') }}</div>
+                  </div>
+                  <JcgjList ref="jcgjExportList" :readonly="true" v-show="jcgjlxExport != 999" />
+                </div>
+              </div>
+              <div v-if="showExport" id="watermark-overlay"  ref="watermarkContainer" :style="{
+                '--watermark-text': `'${watermarkText}'`,
+                '--watermark-opacity': opacity,
+                '--watermark-size': '14px',
+                '--watermark-color': 'red'
+              }"></div>
+            </section>
+          </vue-html2pdf>
+          <div style="padding: 0px 20px 0px 30px;margin-left: 10px;">
+            <div class="content-title">
+              <div class="line"></div>
+              <div class="subtitle"> {{ $t('page.business.study.studyFormApply.qmxx') }}</div>
+            </div>
+            <div class="pal">
+              <el-table :data="qmxxList" v-loading="loadingQmxx" style="width: 100%;">
+                <el-table-column :label="$t('page.business.study.studyFormApply.qmr')" align="center" prop="qmrMc" />
+                <el-table-column :label="$t('page.business.study.studyFormApply.qmyy')" align="center"
+                  :prop="$i18n.locale === 'zh_CN' ? 'qmyy' : 'qmyyEn'" />
+                <el-table-column :label="$t('page.business.study.studyFormApply.qmsj')" align="center"
+                  prop="createTime" />
+                <el-table-column :label="$t('page.business.study.studyFormApply.bzyy')" align="center" prop="remark" />
+              </el-table>
+            </div>
+            <pagination v small layout="prev, pager, next" :total="totalQmxx" :page.sync="queryParamsQmxx.pageNum"
               :limit.sync="queryParamsQmxx.pageSize" @pagination="getQmxxList" />
+            <div class="content-title" style="margin-top: 10px;">
+              <div class="line"></div>
+              <div class="subtitle"> {{ $t('page.business.study.studyFormApply.jcgj') }}</div>
+            </div>
+            <JcgjList ref="jcgjList" @handleQuery="getJjcgjList" :showXg="true" />
+            <pagination v small layout="prev, pager, next" :total="jcgjTotal" @pagination="getJjcgjList" />
           </div>
-          <div class="content-title">
-            <div class="line"></div>
-            <div class="subtitle"> {{ $t('page.business.study.studyFormApply.jcgj') }}</div>
-          </div>
-          <JcgjList ref="jcgjList" @handleQuery="getJjcgjList" :showXg="true" />
-
-          <pagination v-show="jcgjTotal > 0" small layout="prev, pager, next" :total="jcgjTotal"
-            @pagination="getJjcgjList" />
         </div>
-
       </div>
     </div>
 
@@ -97,8 +134,7 @@
         <el-row>
           <el-col :span="24">
             <el-form-item :label="$t('form.password')" prop="qmrmm">
-              <div class="sbzdtcma"> <input type="text"></div>
-              <el-input type="password" show-password  v-model="formApprove.qmrmm" maxlength="20"
+              <el-input type="password" show-password v-model="formApprove.qmrmm" maxlength="20"
                 :placeholder="$t('form.placeholderInput')" />
             </el-form-item>
           </el-col>
@@ -113,18 +149,22 @@
 </template>
 
 <script>
-import { studyFormApply_tb, studyFormApply_info, studyFormApply_jcgj, studyFormApply_qmxx, studyFormApply_exportDetail } from "@/api/business/study/studyFormApply"
+import { studyFormApply_jcgjqmxxList, studyFormApply_tb, studyFormApply_info, studyFormApply_jcgj, studyFormApply_qmxx, studyFormApply_exportDetail } from "@/api/business/study/studyFormApply"
 import { mapGetters } from 'vuex'
 import JcgjList from "@/views/business/comps/common/JcgjList";
 import TemplateTable from '@/views/business/comps/template/TemplateTable';
-
+import moment from "moment";
+import VueHtml2pdf from 'vue-html2pdf'
 export default {
   name: "Xq",
-  components: { JcgjList, TemplateTable },
+  components: { JcgjList, TemplateTable, VueHtml2pdf },
   data() {
     return {
+      watermarkText:'',
+      opacity: 0.8,
+      watermarkOpacity: 0.8,
+      watermarkSize: 40,
       openApprove: false,
-      open: false,
       formApprove: {
         id: null,
         qmyy: this.$t('page.business.study.studyFormApply.cjjl'),
@@ -168,7 +208,11 @@ export default {
         pageNum: 1,
         formId: null,
         pageSize: 5,
-      }
+      },
+      showExport: false,
+      qmxxExportList: [],
+      jcgjExportList: [],
+      jcgjlxExport: 0
     }
   },
   computed: {
@@ -179,11 +223,122 @@ export default {
   created() {
   },
   methods: {
+    updateWatermark() {
+      // 创建水印背景
+      const text = this.nickName +' '+ moment().format("YYYY-MM-DD HH:mm:ss");
+      const canvas = document.createElement('canvas');
+      const ctx = canvas.getContext('2d');
+
+      // 设置canvas尺寸
+      canvas.width = 300;
+      canvas.height = 300;
+
+      // 绘制水印
+      ctx.fillStyle = `rgba(255, 0, 0,  ${this.opacity})`;
+      ctx.font = '12px Arial';
+      ctx.textAlign = 'center';
+      ctx.textBaseline = 'middle';
+
+      // 旋转45度
+      ctx.translate(canvas.width / 2, canvas.height / 2);
+      ctx.rotate(-45 * Math.PI / 180);
+      ctx.fillText(text, 0, 0);
+
+      // 设置为背景
+      const container = this.$refs.watermarkContainer;
+      container.style.backgroundImage = `url(${canvas.toDataURL()})`;
+      container.style.backgroundRepeat = 'repeat';
+    },
+    onProgress(progress) {
+      console.log(`生成进度: ${progress}%`)
+      this.removePageBreak()
+      if (progress == 100) {
+        this.showExport = false
+        this.$modal.closeLoading()
+      }
+    },
     exportExcel(jcgjlx) {
       this.$modal.loading()
+      this.jcgjlxExport = jcgjlx
+      this.showExport = true
+      studyFormApply_jcgjqmxxList({ jcgjlx: jcgjlx, id: this.form.id }).then(response => {
+        this.jcgjExportList = response.data.jcgj
+        this.qmxxExportList = response.data.qmxx
+        this.updateWatermark()
+        this.$refs.jcgjExportList.init(this.jcgjExportList)
+        setTimeout(() => {
+          this.$refs.html2Pdf.generatePdf()
+        }, 200);
+      })
+    },
+    //添加水印
+    async addDynamicWatermark({ pdfContent }) {
+      return new Promise((resolve) => {
+        const canvas = document.createElement('canvas')
+        const ctx = canvas.getContext('2d')
+
+        // 获取内容区域尺寸
+        const rect = this.$refs.contentArea.getBoundingClientRect()
+        canvas.width = rect.width
+        canvas.height = rect.height
+
+        // 绘制动态水印
+        ctx.fillStyle = `rgba(100, 100, 100, ${this.watermarkOpacity})`
+        ctx.font = `${this.watermarkSize}px Arial`
+        ctx.textAlign = 'center'
+        ctx.textBaseline = 'middle'
+
+        // 计算水印密度
+        const stepX = 300
+        const stepY = 200
+
+        // 绘制倾斜水印
+        ctx.save()
+        ctx.translate(canvas.width / 2, canvas.height / 2)
+        ctx.rotate(-Math.PI / 4) // 45度倾斜
+
+        for (let x = -canvas.width; x < canvas.width * 2; x += stepX) {
+          for (let y = -canvas.height; y < canvas.height * 2; y += stepY) {
+            // 动态水印内容
+            const dynamicText = `${this.watermarkText} - ${this.getCurrentTime()}`
+            ctx.fillText(dynamicText, x, y)
+          }
+        }
+        ctx.restore()
+
+        // 创建水印层
+        const watermarkLayer = document.createElement('div')
+        watermarkLayer.className = 'watermark-layer'
+        watermarkLayer.style.cssText = `
+          position: absolute;
+          top: 0;
+          left: 0;
+          width: 100%;
+          height: 100%;
+          pointer-events: none;
+          background-image: url(${canvas.toDataURL('image/png')});
+          background-repeat: repeat;
+          z-index: 9999;
+        `
+
+        // 插入水印
+        this.$refs.contentArea.style.position = 'relative'
+        this.$refs.contentArea.appendChild(watermarkLayer)
+
+        // 等待渲染
+        setTimeout(() => resolve(), 100)
+      })
+    },
+    //移除分页空白
+    removePageBreak() {
+      document.querySelectorAll('.html2pdf__page-break').forEach(el => {
+        el.remove()
+      })
+    },
+    exportExcel_bak(jcgjlx) {
+      this.$modal.loading()
       studyFormApply_exportDetail(_.merge({}, this.queryParamsJcgj, { jcgjlx: jcgjlx, lang: this.$store.getters.language.split("_")[0] })).then(response => {
         window.open(process.env.VUE_APP_FILE_DOMAIN + response.msg)
-        this.$modal.closeLoading()
       }).finally(() => {
         this.$modal.closeLoading()
       })
@@ -194,7 +349,6 @@ export default {
         this.jcgjList = response.rows
         this.jcgjTotal = response.total
         this.$refs.jcgjList.init(this.jcgjList)
-        this.$modal.closeLoading()
       }).finally(() => {
         this.$modal.closeLoading()
       })
@@ -256,3 +410,146 @@ export default {
   }
 }
 </script>
+<style scoped>
+.content-title {
+  width: 100%;
+  background: #f9f9ff;
+  font-size: 0.96rem;
+  font-weight: bold;
+  padding-left: 10px;
+  height: 40px;
+  line-height: 40px;
+  display: flex;
+  justify-content: flex-start;
+  text-align: left;
+}
+
+.line {
+  width: 2px;
+  float: left;
+  height: 16px;
+  margin-top: 12px;
+  margin-right: 8px;
+  border-left: #3178ff 3px solid;
+}
+
+.subtitle {
+  height: 40px;
+  line-height: 40px;
+  color: #464647 !important;
+}
+
+
+.pdf-content {
+  padding: 20px;
+  font-family: Arial, sans-serif;
+
+  
+}
+#watermark-overlay {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  opacity: 0.6;
+  font-size: 12px;
+  pointer-events: none;
+  z-index: 10;
+  color: red;
+}
+
+.pdf-content h1 {
+  color: #333;
+  border-bottom: 2px solid #4CAF50;
+  padding-bottom: 10px;
+}
+
+.pdf-content table {
+  width: 100%;
+  border-collapse: collapse;
+  margin-top: 20px;
+}
+
+.pdf-content th,
+.pdf-content td {
+  border: 1px solid #ddd;
+  padding: 8px;
+  text-align: left;
+}
+
+.pdf-content th {
+  background-color: #f2f2f2;
+}
+
+.datatable {
+  border-collapse: collapse;
+  width: 100%;
+}
+
+.upload-file-list .el-upload-list__item {
+  margin-bottom: 0px !important;
+}
+
+.datatable thead {
+  border-left: 1px solid #d0d0d0;
+}
+
+.datatable th {
+  padding: 5px 5px 4px 5px;
+  max-width: 200px;
+  line-height: 35px;
+  text-align: center;
+  color: #414753;
+  background: #F5F7FA;
+  border: 1px solid #d0d0d0;
+}
+
+.el-dialog__body {
+  padding: 10px 20px !important;
+}
+
+.datatable th.operate {
+  padding: 5px 5px 4px 5px;
+  width: 100px;
+  line-height: 35px;
+  background: #F5F7FA;
+  border: 1px solid #d0d0d0;
+  text-align: center;
+}
+
+.datatable .rowAlt td,
+.datatable tbody tr:nth-child(2n) td {
+  background: #F5F7FA;
+}
+
+.datatable td {
+  border: solid 1px #d0d0d0;
+  padding: 3px 5px 4px 5px;
+  max-width: 100px;
+  color: #414753;
+  line-height: 35px;
+  text-align: center;
+}
+
+.html2pdf__page-break {
+  display: none !important;
+}
+
+
+.content {
+  position: relative;
+  z-index: 1;
+}
+
+.controls {
+  margin-bottom: 20px;
+  padding: 10px;
+  background: #f5f5f5;
+}
+
+input {
+  margin: 0 10px;
+  padding: 8px;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/business/study/comp/ytbd/Bj.vue b/src/views/business/study/comp/ytbd/Bj.vue
index fea8fb0..3b12144 100644
--- a/src/views/business/study/comp/ytbd/Bj.vue
+++ b/src/views/business/study/comp/ytbd/Bj.vue
@@ -166,11 +166,11 @@ export default {
           message: this.$t('form.placeholderSelect'),
           trigger: 'blur'
         }],
-        shryId: [{
-          required: true,
-          message: ' ',
-          trigger: 'blur'
-        }]
+        // shryId: [{
+        //   required: true,
+        //   message: ' ',
+        //   trigger: 'blur'
+        // }]
       },
       rules: {
         bdmc: [{