预览文件修改为iframe

src/views/privateOrder/ecosphere/components/componentLeft.vue

@@ -3,7 +3,7 @@
  * @Author: kery.chen
  * @Description: 总体概览左侧
  * @Date: 2021-11-30 11:08:50
- * @LastEditTime: 2023-10-24 16:04:14
+ * @LastEditTime: 2023-10-24 17:15:12
  * @FilePath     : \\tcingiocpro\\src\\views\\privateOrder\\ecosphere\\components\\componentLeft.vue
 -->
 <template>
@@ -334,15 +334,17 @@
           v-if="fileExtension === 'docx' || fileExtension === 'doc'"
           ref="fileDoc"
           class="file-content"
-        ></div>
+        >
+          <iframe style="height: 200%; width: 100%" :src="docxUrl" v-if="!isdevelopment"></iframe>
+        </div>
         <div
           v-if="fileExtension === 'pdf'"
           class="file-content file-content-pdf"
         >
-          <iframe style="height: 100%; width: 100%" :src="pdfUrl"></iframe>
-          <!-- <div v-for="i in numPages" :key="i">
+          <iframe style="height: 100%; width: 100%" :src="pdfUrl" v-if="!isdevelopment"></iframe>
+          <div v-for="i in numPages" :key="i" v-else>
             <pdf ref="pdf" :key="i" :src="pdfUrl" :page="i"></pdf>
-          </div> -->
+          </div>
         </div>
       </div>
       <span slot="footer" class="dialog-footer">
@@ -621,8 +623,10 @@ export default {
       zoologyWidth: "",
       fileExtension: "",
       pdfUrl: "",
+      docxUrl: "",
       numPages: "",
       dongtaiTotal: 0,
+      isdevelopment:false,
     };
   },
   computed: {
@@ -1141,6 +1145,7 @@ export default {
       this.setCurrentPageData();
     },
     rowClick(row) {
+      this.isdevelopment = false;
       // this.dialogDetails = true
       // console.log(process.env.VUE_APP_BASE_API2 + row['材料路径'])
       this.fileExtension = row["材料路径"].substring(
@@ -1156,18 +1161,20 @@ export default {
         this.fileExtension === "docx" ||
         this.fileExtension === "doc"
       ) {
-        axios({
-          method: "get",
-          responseType: "blob", // 设置响应文件格式
-          url: process.env.VUE_APP_BASE_API2 + row["材料路径"],
-        }).then(({ data }) => {
-          if (data) {
-            this.dialogDetails = true;
-            this.$nextTick(() => {
-              docx.renderAsync(data, this.$refs.fileDoc); // 渲染到页面预览
-            });
-          }
-        });
+        // axios({
+        //   method: "get",
+        //   responseType: "blob", // 设置响应文件格式
+        //   url: process.env.VUE_APP_BASE_API2 + row["材料路径"],
+        // }).then(({ data }) => {
+        //   if (data) {
+        //     this.dialogDetails = true;
+        //     this.$nextTick(() => {
+        //       docx.renderAsync(data, this.$refs.fileDoc); // 渲染到页面预览
+        //     });
+        //   }
+        // });
+        this.docxUrl = row['材料路径'];
+        this.dialogDetails = true;
       }
       // if (['png', 'jpg', 'jpeg'].includes(row.材料路径.substring(row.材料路径.lastIndexOf('.') + 1))) {
       //   this.imgSrc = `${process.env.NODE_ENV === 'production' ? window._CONFIG['fileNginxUrl'] : '/fileApi'}${row['材料路径']}`
@@ -1263,6 +1270,7 @@ export default {
     },
     processDetails(val) {
       // this.fileExtension = "docx";
+      this.isdevelopment = true;
       if (
         ["生成整改通知书送达回执", "生成约谈通知书", "登记约谈"].includes(val)
       ) {
@@ -1274,8 +1282,8 @@ export default {
           );
           // console.log(this.fileExtension,'this.fileExtension')
           if (this.fileExtension == "pdf") {
-            this.pdfUrl = row['材料路径'];
-            // this.getNumPages(process.env.VUE_APP_BASE_API2 + res.rows[0].fileUrl);
+            // this.pdfUrl = row['材料路径'];
+            this.getNumPages(process.env.VUE_APP_BASE_API2 + res.rows[0].fileUrl);
             this.dialogDetails = true
           } else if (
             this.fileExtension === "docx" ||