zc

src/components/lookDocumentDialog/lookDocumentDialog.vue

@@ -1,31 +1,111 @@
-<template>
-  <div class="lookDocumentDialog">
+<!--
+    查看单个文档
+
+    import lookDocumentDialog from '@/components/lookDocumentDialog/lookDocumentDialog.vue'
+
+    components: {
+      lookDocumentDialog
+    },
 
-  </div>
+    <lookDocumentDialog v-if="lookDocumentType" :propsLookDocumentData="propsLookDocumentData"></lookDocumentDialog>
+
+    //查看单个文档
+    lookDocumentButton(type){
+      if(type==1){
+        this.$set(this,'propsLookDocumentData',{
+          title:"整改报告",
+          url:this.addForm.data7[0].url
+        });
+        this.$set(this,'lookDocumentType',true);
+      }else{
+        this.$set(this,'lookDocumentType',false);
+      }
+    },
+-->
+<template>
+  <el-dialog class="lookDocumentDialog" :title="lookDocumentTitle"
+             :visible.sync="lookDocumentType" v-if="lookDocumentType"
+             @close="outLook"
+             width="1300px" height="700" append-to-body>
+    <div class="lookDocumentDialog-page">
+      <iframe
+        v-if="lookDocumentSrc"
+        class="iframe"
+        :src="lookDocumentSrc" scrolling="auto" frameborder="0">
+      </iframe>
+      <p class="positionButton" @click="goPage">全屏</p>
+    </div>
+    <div slot="footer" class="dialog-footer dialog-footer-box" style="display: flex">
+      <p class="dialog-footer-button-null"></p>
+      <p class="dialog-footer-button-info" @click="outLook">取消</p>
+      <p class="dialog-footer-button-primary" @click="downloadButton">下载</p>
+      <p class="dialog-footer-button-null"></p>
+    </div>
+  </el-dialog>
 </template>
 
 <script>
   export default {
     name: 'lookDocumentDialog',
+    props:{
+      propsLookDocumentData:{},
+    },
     data(){
       return{
-
+        lookDocumentType:true,
+        lookDocumentTitle:"",
+        lookDocumentSrc:"",
       }
     },
     created(){
-
+      this.$set(this,'lookDocumentTitle',this.propsLookDocumentData.title);
+      this.$set(this,'lookDocumentSrc',this.urlJudge(this.propsLookDocumentData.url));
     },
     mounted(){
 
     },
     methods:{
-
+      // 返回按钮
+      outLook(){
+        this.$parent.lookDocumentButton(2)
+      },
+      // 下载按钮
+      downloadButton(){
+        this.download(this.propsLookDocumentData.url, {}, this.propsLookDocumentData.name)
+      },
+      //打开新窗口
+      goPage(){
+        window.open(this.lookDocumentSrc)
+      },
     }
   }
 </script>
 
 <style scoped lang="scss">
   .lookDocumentDialog{
-
+    .lookDocumentDialog-page{
+      display: flex;
+      flex:1;
+      height:645px;
+      overflow: hidden;
+      padding:0 50px;
+      position: relative;
+      .positionButton{
+        position: absolute;
+        top:15px;
+        right: 225px;
+        border:1px solid #0183fa;
+        border-radius:4px;
+        line-height:30px;
+        width:60px;
+        text-align: center;
+        cursor: pointer;
+        color:#0183fa;
+        background-color: #fff;
+      }
+      .iframe{
+        flex:1;
+      }
+    }
   }
 </style>

src/components/lookDocumentDialog/lookDocumentListDialog.vue

@@ -1,31 +1,198 @@
-<template>
-  <div class="lookDocumentListDialog">
+<!--
+    查看多个文档
+
+    import lookDocumentListDialog from '@/components/lookDocumentDialog/lookDocumentListDialog.vue'
+
+    components: {
+      lookDocumentListDialog
+    },
 
-  </div>
+    <lookDocumentListDialog v-if="lookDocumentListType" :propsLookDocumentListData="propsLookDocumentListData"></lookDocumentListDialog>
+
+      //查看多个文档
+      lookDocumentListButton(type){
+        if(type==1){
+          this.$set(this,'propsLookDocumentListData',{
+            title:"查看附件",
+            list:this.addForm.data7
+          });
+          this.$set(this,'lookDocumentListType',true);
+        }else{
+          this.$set(this,'lookDocumentListType',false);
+        }
+      },
+-->
+<template>
+  <el-dialog class="lookDocumentListDialog" :title="lookDocumentListTitle"
+             :visible.sync="lookDocumentListType" v-if="lookDocumentListType"
+             @close="outLook"
+             width="1300px" height="700" append-to-body>
+    <div class="lookDocumentListDialog-page">
+      <div class="left-box">
+        <div class="left-title-box">
+          <img src="@/assets/ZDimages/safetyCheck/icon_dr_wj.png">
+          <p>材料附件</p>
+        </div>
+        <div class="left-for-box scrollbar-box">
+          <p class="left-for-p" v-for="(iframeItem,iframeIndex) in lookDocumentList" :key="iframeIndex"
+             @click="lookDocumentListCheck(iframeIndex)"
+             :class="lookDocumentListIndex == iframeIndex?'check-p':''">{{iframeItem.name}}</p>
+        </div>
+      </div>
+      <div class="center-border"></div>
+      <div class="right-box">
+        <iframe
+          v-if="lookDocumentSrc"
+          class="iframe"
+          :src="lookDocumentSrc" scrolling="auto" frameborder="0">
+        </iframe>
+        <p class="positionButton" @click="goPage">全屏</p>
+      </div>
+    </div>
+    <div slot="footer" class="dialog-footer dialog-footer-box" style="display: flex">
+      <p class="dialog-footer-button-null"></p>
+      <p class="dialog-footer-button-info" @click="outLook">取消</p>
+      <p class="dialog-footer-button-primary" @click="downloadButton">下载</p>
+      <p class="dialog-footer-button-null"></p>
+    </div>
+  </el-dialog>
 </template>
 
 <script>
   export default {
     name: 'lookDocumentListDialog',
+    props:{
+      propsLookDocumentListData:{},
+    },
     data(){
       return{
-
+        lookDocumentListType:true,
+        lookDocumentListTitle:"",
+        lookDocumentList:[],
+        lookDocumentSrc:"",
+        lookDocumentListIndex:0,
       }
     },
     created(){
-
+      this.$set(this,'lookDocumentListTitle',this.propsLookDocumentListData.title);
+      this.$set(this,'lookDocumentList',this.propsLookDocumentListData.list);
+      this.$set(this,'lookDocumentSrc',this.urlJudge(this.propsLookDocumentListData.list[0].url));
     },
     mounted(){
 
     },
     methods:{
-
+      // 切换按钮
+      lookDocumentListCheck(val){
+        console.log(val)
+        this.$set(this,'lookDocumentListIndex',val);
+        this.$set(this,'lookDocumentSrc',this.urlJudge(this.lookDocumentList[val].url));
+      },
+      // 返回按钮
+      outLook(){
+        this.$parent.lookDocumentListButton(2)
+      },
+      // 下载按钮
+      downloadButton(){
+        this.download(this.lookDocumentList[this.lookDocumentListIndex].url, {}, this.lookDocumentList[this.lookDocumentListIndex].name)
+      },
+      //打开新窗口
+      goPage(){
+        window.open(this.lookDocumentSrc)
+      },
     }
   }
 </script>
 
 <style scoped lang="scss">
   .lookDocumentListDialog{
-
+    .lookDocumentListDialog-page{
+      display: flex;
+      flex:1;
+      height:645px;
+      overflow: hidden;
+      padding:0 50px;
+      .left-box{
+        display: flex;
+        flex-direction: column;
+        overflow: hidden;
+        width:265px;
+        .left-title-box{
+          padding-bottom:20px;
+          display: flex;
+          width:230px;
+          border-bottom:1px dashed #D8D8D8;
+          img{
+            width:16px;
+            height:13px;
+            margin:13px 15px 13px 0;
+          }
+          p{
+            line-height:40px;
+            width:230px;
+            font-size:16px;
+            color:#0183FA;
+          }
+        }
+        .left-for-box{
+          flex:1;
+          .left-for-p{
+            padding:0 10px;
+            width:230px;
+            line-height:40px;
+            margin-top:10px;
+            font-size:16px;
+            color:#333;
+            display:block;
+            overflow:hidden;
+            text-overflow:ellipsis;
+            white-space:nowrap;
+            cursor: pointer;
+          }
+          .check-p{
+            background-color:rgba(1,131,250,0.2);
+            color:#0183FA;
+          }
+        }
+      }
+      .center-border{
+        border-right:1px dashed #D8D8D8;
+      }
+      .right-box{
+        flex:1;
+        display: flex;
+        margin-left:57px;
+        position: relative;
+        .positionButton{
+          position: absolute;
+          top:15px;
+          right: 35px;
+          border:1px solid #0183fa;
+          border-radius:4px;
+          line-height:30px;
+          width:60px;
+          text-align: center;
+          cursor: pointer;
+          color:#0183fa;
+          background-color: #fff;
+        }
+        .iframe{
+          flex:1;
+        }
+      }
+      .out-button{
+        width:60px;
+        line-height:30px;
+        color:#999;
+        background-color: #dedede;
+        border-radius:4px;
+        text-align: center;
+        cursor: pointer;
+        position: absolute;
+        top:17px;
+        right:17px;
+        z-index:99999;
+      }
+    }
   }
 </style>

src/components/lookImgDialog/lookImgDialog.vue

@@ -14,7 +14,7 @@
         this.$refs.lookImgDialog.lookImgDialogOpen(1,list,index);
 -->
 <template>
-  <el-dialog class="look-img-dialog" title="隐患照片" :visible.sync="lookImgDialogType" v-if="lookImgDialogType" width="1070px" height="700" append-to-body>
+  <el-dialog class="look-img-dialog" :title="lookImgDialogTitle" :visible.sync="lookImgDialogType" v-if="lookImgDialogType" width="1070px" height="700" append-to-body>
     <div class="look-img-dialog-min scrollbar-box">
       <img style="width:1026px;" :src="lookImgList[lookImgIndex].url">
     </div>
@@ -29,9 +29,10 @@
     name: 'lookImgDialog',
     data(){
       return{
+        lookImgDialogTitle:"",
         lookImgDialogType:false,
         lookImgList:[],
-        lookImgIndex:[],
+        lookImgIndex:null,
       }
     },
     created(){
@@ -41,10 +42,11 @@
 
     },
     methods:{
-      lookImgDialogOpen(type,list,index){
+      lookImgDialogOpen(type,list,index,title){
         if(type == 1){
           this.$set(this,'lookImgList',list);
-          this.$set(this,'lookImgIndex',index);
+          this.$set(this,'lookImgIndex',index?index:0);
+          this.$set(this,'lookImgDialogTitle',title?title:'照片');
           this.$set(this,'lookImgDialogType',true);
         }else if(type == 2){
           this.$set(this,'lookImgDialogType',false);

src/views/safetyCheck/components/infoDialog/infoDialog.vue

@@ -65,7 +65,7 @@
         </div>
         <div class="button-box">
           <p>整改通知书?整改告知书</p>
-          <p class="inquire-button-one" @click="lookDocument">查看</p>
+          <p class="inquire-button-one" @click="lookDocument(1,infoDialogData.data18)">查看</p>
           <p class="add-button-one-90">下载</p>
         </div>
         <div class="text-box-two-box">
@@ -195,7 +195,7 @@
           </div>
           <div class="button-box">
             <p>整改报告书</p>
-            <p class="inquire-button-one" @click="lookDocument">查看</p>
+            <p class="inquire-button-one" @click="lookDocument(2,item.dataL)">查看</p>
             <p class="add-button-one-90">下载</p>
           </div>
         </div>
@@ -274,6 +274,27 @@
         </iframe>
         <p class="out-button" @click="outLook">返回</p>
       </div>
+      <div class="info-dialog-content-document-list" v-if="imgDocumentType == 3">
+        <div class="left-box">
+          <div class="left-title-box">
+            <img src="@/assets/ZDimages/safetyCheck/icon_dr_wj.png">
+            <p>材料附件</p>
+          </div>
+          <div class="left-for-box scrollbar-box">
+            <p class="left-for-p" v-for="(iframeItem,iframeIndex) in iframeSrcList" :key="iframeIndex"
+               @click="lookDocumentListCheck(iframeIndex)"
+               :class="iframeSrcIndex == iframeIndex?'check-p':''">{{iframeItem.name}}</p>
+          </div>
+        </div>
+        <div class="center-border"></div>
+        <div class="right-box">
+          <iframe
+            class="iframe"
+            :src="iframeSrc" scrolling="auto" frameborder="0">
+          </iframe>
+        </div>
+        <p class="out-button" @click="outLook">返回</p>
+      </div>
     </div>
     <div class="bottom-button-box dialog-footer-box" v-if="infoDialogCheckIndex == 'add'">
       <p class="dialog-footer-button-null"></p>
@@ -326,6 +347,60 @@
             {name:"4",url:'https://img0.baidu.com/it/u=561734853,2461096286&fm=253&fmt=auto&app=138&f=JPEG?w=889&h=500'},
             {name:"5",url:'https://img2.baidu.com/it/u=567357414,4240886412&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=500'},
           ],
+          data18:[
+            {
+              name:"我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容",
+              url:"statics/bigFile/2023022011/f23a32c8-bf8e-40b5-9e52-04cf73fc6037.docx",
+            },
+            {
+              name:"我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容",
+              url:"statics/bigFile/2023022011/f23a32c8-bf8e-40b5-9e52-04cf73fc6037.docx",
+            },
+            {
+              name:"我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容",
+              url:"statics/bigFile/2023022011/f23a32c8-bf8e-40b5-9e52-04cf73fc6037.docx",
+            },
+            {
+              name:"我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容",
+              url:"statics/bigFile/2023022011/f23a32c8-bf8e-40b5-9e52-04cf73fc6037.docx",
+            },
+            {
+              name:"我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容",
+              url:"statics/bigFile/2023022011/f23a32c8-bf8e-40b5-9e52-04cf73fc6037.docx",
+            },
+            {
+              name:"我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容",
+              url:"statics/bigFile/2023022011/f23a32c8-bf8e-40b5-9e52-04cf73fc6037.docx",
+            },
+            {
+              name:"我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容",
+              url:"statics/bigFile/2023022011/f23a32c8-bf8e-40b5-9e52-04cf73fc6037.docx",
+            },
+            {
+              name:"我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容",
+              url:"statics/bigFile/2023022011/f23a32c8-bf8e-40b5-9e52-04cf73fc6037.docx",
+            },
+            {
+              name:"我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容",
+              url:"statics/bigFile/2023022011/f23a32c8-bf8e-40b5-9e52-04cf73fc6037.docx",
+            },
+            {
+              name:"我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容",
+              url:"statics/bigFile/2023022011/f23a32c8-bf8e-40b5-9e52-04cf73fc6037.docx",
+            },
+            {
+              name:"我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容",
+              url:"statics/bigFile/2023022011/f23a32c8-bf8e-40b5-9e52-04cf73fc6037.docx",
+            },
+            {
+              name:"我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容",
+              url:"statics/bigFile/2023022011/f23a32c8-bf8e-40b5-9e52-04cf73fc6037.docx",
+            },
+            {
+              name:"我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容我是内容",
+              url:"statics/bigFile/2023022011/f23a32c8-bf8e-40b5-9e52-04cf73fc6037.docx",
+            }
+          ],
         },
         infoDialogList:[
           {
@@ -350,6 +425,7 @@
             dataF:"请补充照片",
             dataG:"李腾腾",
             dataH:"2023-03-26  14:00",
+            dataL:"statics/bigFile/2023022011/f23a32c8-bf8e-40b5-9e52-04cf73fc6037.docx",
           },
         ],
         //图片
@@ -358,6 +434,8 @@
         saveIndex:0,
         //文档地址
         iframeSrc:"",
+        iframeSrcIndex:0,
+        iframeSrcList:[],
         // 提交数据
         addFormType:"2",//1整改 2审核
         addFormTitle:"二次整改",
@@ -402,9 +480,21 @@
         this.$set(this.addForm,'dataY',val);
       },
       //点击查看文档
-      lookDocument(url){
-        this.$set(this,'iframeSrc',this.urlJudge(url));
-        this.$set(this,'imgDocumentType',2);
+      lookDocument(type,data){
+        if(type == 1){
+          console.log('data',data)
+          this.$set(this,'iframeSrcIndex',0);
+          this.$set(this,'iframeSrcList',data);
+          this.$set(this,'iframeSrc',this.urlJudge(data[0].url));
+          this.$set(this,'imgDocumentType',3);
+        }else if(type == 2){
+          this.$set(this,'iframeSrc',this.urlJudge(data));
+          this.$set(this,'imgDocumentType',2);
+        }
+      },
+      lookDocumentListCheck(val){
+        this.$set(this,'iframeSrcIndex',val);
+        this.$set(this,'iframeSrc',this.urlJudge(this.iframeSrcList[val].url));
       },
       //点击查看图片
       lookImg(list,index){
@@ -1030,10 +1120,82 @@
       .info-dialog-content-document{
         display: flex;
         flex:1;
-        height:700px;
+        height:570px;
         .iframe{
           flex:1;
-          height:700px;
+        }
+        .out-button{
+          width:60px;
+          line-height:30px;
+          color:#999;
+          background-color: #dedede;
+          border-radius:4px;
+          text-align: center;
+          cursor: pointer;
+          position: absolute;
+          top:17px;
+          right:17px;
+          z-index:99999;
+        }
+      }
+      .info-dialog-content-document-list{
+        display: flex;
+        flex:1;
+        height:570px;
+        overflow: hidden;
+        .left-box{
+          display: flex;
+          flex-direction: column;
+          overflow: hidden;
+          width:265px;
+          .left-title-box{
+            padding-bottom:20px;
+            display: flex;
+            width:230px;
+            border-bottom:1px dashed #D8D8D8;
+            img{
+              width:16px;
+              height:13px;
+              margin:13px 15px 13px 0;
+            }
+            p{
+              line-height:40px;
+              width:230px;
+              font-size:16px;
+              color:#0183FA;
+            }
+          }
+          .left-for-box{
+            flex:1;
+            .left-for-p{
+              padding:0 10px;
+              width:230px;
+              line-height:40px;
+              margin-top:10px;
+              font-size:16px;
+              color:#333;
+              display:block;
+              overflow:hidden;
+              text-overflow:ellipsis;
+              white-space:nowrap;
+              cursor: pointer;
+            }
+            .check-p{
+              background-color:rgba(1,131,250,0.2);
+              color:#0183FA;
+            }
+          }
+        }
+        .center-border{
+          border-right:1px dashed #D8D8D8;
+        }
+        .right-box{
+          flex:1;
+          display: flex;
+          margin-left:57px;
+          .iframe{
+            flex:1;
+          }
         }
         .out-button{
           width:60px;

src/views/safetyCheck/laboratorySelfTest/selfInspectionManagement/index.vue

@@ -84,13 +84,15 @@
           <el-table-column label="任务周期" align="center" prop="deptName" show-overflow-tooltip width="270"/>
           <el-table-column label="检查时间" sortable align="center" prop="deptName" show-overflow-tooltip width="157"/>
           <el-table-column label="操作" align="center" prop="deptName" width="230">
-            <div class="table-button-box">
-              <p class="table-button-p" @click="goAddPage(3)">详情</p>
-              <p class="table-button-p" @click="goAddPage(2)">开始检查</p>
-              <!--<p class="table-button-p">编辑</p>-->
-              <!--<p class="table-button-p">整改报告</p>-->
-              <!--<p class="table-button-p">查看附件</p>-->
-            </div>
+            <template slot-scope="scope">
+              <div class="table-button-box">
+                <p class="table-button-p" @click="goAddPage(3)">详情</p>
+                <p class="table-button-p" @click="goAddPage(2)">开始检查</p>
+                <p class="table-button-p">编辑</p>
+                <p class="table-button-p" @click="lookDocumentButton(1,scope.row)">整改报告</p>
+                <p class="table-button-p" @click="lookDocumentListButton(1,scope.row)">查看附件</p>
+              </div>
+            </template>
           </el-table-column>
         </el-table>
         <pagination :page-sizes="[20, 30, 40, 50]"
@@ -104,21 +106,32 @@
     </div>
     <addPage v-if="pageType==2"></addPage>
     <infoPage v-if="pageType==3"></infoPage>
+    <lookDocumentDialog v-if="lookDocumentType" :propsLookDocumentData="propsLookDocumentData"></lookDocumentDialog>
+    <lookDocumentListDialog v-if="lookDocumentListType" :propsLookDocumentListData="propsLookDocumentListData"></lookDocumentListDialog>
   </div>
 </template>
 
 <script>
   import addPage from './addPage.vue'
   import infoPage from '@/views/safetyCheck/components/infoPage/infoPage.vue'
+  import lookDocumentDialog from '@/components/lookDocumentDialog/lookDocumentDialog.vue'
+  import lookDocumentListDialog from '@/components/lookDocumentDialog/lookDocumentListDialog.vue'
   export default {
     name: 'index',
     components: {
       addPage,
-      infoPage
+      infoPage,
+      lookDocumentDialog,
+      lookDocumentListDialog
     },
     data(){
       return{
-        pageType:3,
+        //子组件数据
+        lookDocumentType:false,
+        propsLookDocumentData:{},
+        lookDocumentListType:false,
+        propsLookDocumentListData:{},
+        pageType:1,
         queryParams:{
           pageNum:1,
           pageSize:20,
@@ -190,6 +203,31 @@
         });
         this.handleQuery();
       },
+      //查看单个文档
+      lookDocumentButton(type,row){
+        if(type==1){
+          this.$set(this,'propsLookDocumentData',{
+            title:"整改报告",
+            name:row.name,
+            url:row.url
+          });
+          this.$set(this,'lookDocumentType',true);
+        }else{
+          this.$set(this,'lookDocumentType',false);
+        }
+      },
+      //查看多个文档
+      lookDocumentListButton(type,row){
+        if(type==1){
+          this.$set(this,'propsLookDocumentListData',{
+            title:"查看附件",
+            list:row.list
+          });
+          this.$set(this,'lookDocumentListType',true);
+        }else{
+          this.$set(this,'lookDocumentListType',false);
+        }
+      },
     },
   }
 </script>

src/views/safetyCheck/laboratorySelfTest/selfInspectionTask/addDialog.vue

@@ -1,7 +1,7 @@
 <template>
   <el-dialog class="inspectionPlan-dialog-box"
              :title="addDialogTitle" :visible.sync="addDialogType" v-if="addDialogType"
-             @close="addDialogOff" width="1303px" append-to-body>
+             @close="addDialogAllOff" width="1303px" append-to-body>
     <div class="inspectionPlan-dialog-add-box" v-show="addDialogBoxType==1">
       <div class="left-max-box" v-if="!lookInfoType">
         <div class="left-max-title-box">
@@ -358,6 +358,9 @@
   import { getToken } from "@/utils/auth";
   export default {
     name: 'addDialog',
+    props:{
+      addDialogData:{},
+    },
     data(){
       return{
         uploadImgUrl: this.uploadUrl(), // 上传的图片服务器地址
@@ -367,7 +370,7 @@
         addDialogTitle:"",
         addDialogType:true,
         //弹窗内容状态
-        addDialogBoxType:2,
+        addDialogBoxType:1,
         // 设置只能选择当前日期及之后的日期
         pickerOptions: {
           disabledDate(time) {
@@ -485,30 +488,26 @@
       }
     },
     created(){
-
+      this.$set(this,'addDialogTitle',this.addDialogData.title);
+      this.$set(this,'lookInfoType',this.addDialogData.lookInfoType);
+      if(this.addDialogData.addType){
+        //新增
+      }else{
+        //编辑
+      }
     },
     mounted(){
 
     },
     methods:{
       /*===================================弹窗相关===================================*/
-      //弹窗开启
-      addDialogOpen(type,data){
-        if(type==1){
-          this.$set(this,'lookInfoType',false);
-          this.$set(this,'addDialogTitle','创建巡查计划');
-        }else if(type==2){
-          this.$set(this,'lookInfoType',false);
-          this.$set(this,'addDialogTitle','编辑巡查计划');
-        }else{
-          this.$set(this,'lookInfoType',true);
-        }
-        this.$set(this,'addDialogType',true);
-      },
       //弹窗关闭
+      addDialogAllOff(){
+        this.$parent.addDialogOpen(4)
+      },
       addDialogOff(){
         if(this.addDialogBoxType == 1){
-          this.$set(this,'addDialogType',false);
+          this.$parent.addDialogOpen(4)
         }else{
           this.dialogClickType(1);
         }

src/views/safetyCheck/laboratorySelfTest/selfInspectionTask/index.vue

@@ -77,7 +77,7 @@
                 <p class="table-button-p">删除</p>
                 <p class="table-button-p" @click="addDialogOpen(3,scope.row)">详情</p>
                 <p class="table-button-p" @click="goPage(2,scope.row)">自查管理</p>
-                <!--<p class="table-button-p">查看附件</p>-->
+                <p class="table-button-p" @click="lookDocumentListButton(1,scope.row)">查看附件</p>
               </div>
             </template>
           </el-table-column>
@@ -91,22 +91,30 @@
         />
       </div>
     </div>
-    <add-dialog ref="addDialog"></add-dialog>
     <list-page v-if="pageType == 2"></list-page>
+    <add-dialog v-if="addDialogType" :addDialogData="addDialogData"></add-dialog>
+    <lookDocumentListDialog v-if="lookDocumentListType" :propsLookDocumentListData="propsLookDocumentListData"></lookDocumentListDialog>
   </div>
 </template>
 
 <script>
   import addDialog from './addDialog.vue'
   import listPage from './listPage.vue'
+  import lookDocumentListDialog from '@/components/lookDocumentDialog/lookDocumentListDialog.vue'
   export default {
     name: 'index',
     components: {
       addDialog,
-      listPage
+      listPage,
+      lookDocumentListDialog
     },
     data(){
       return{
+        //子组件数据
+        lookDocumentListType:false,
+        propsLookDocumentListData:{},
+        addDialogType:false,
+        addDialogData:{},
         pageType:1,
         queryParams:{
           pageNum:1,
@@ -136,11 +144,28 @@
       //弹窗开启
       addDialogOpen(type,data){
         if(type==1){
-          this.$refs.addDialog.addDialogOpen(type);
+          this.$set(this,'addDialogData',{
+            title:"创建自查任务",
+            lookInfoType:false,
+            addType:false,
+          })
+          this.$set(this,'addDialogType',true);
         }else if(type==2){
-          this.$refs.addDialog.addDialogOpen(type,data);
-        }else{
-          this.$refs.addDialog.addDialogOpen(type,data);
+          this.$set(this,'addDialogData',{
+            title:"编辑自查任务",
+            lookInfoType:false,
+            addType:true,
+          })
+          this.$set(this,'addDialogType',true);
+        }else if(type==3){
+          this.$set(this,'addDialogData',{
+            title:"巡查自查任务",
+            lookInfoType:true,
+            addType:true,
+          })
+          this.$set(this,'addDialogType',true);
+        }else if(type==4){
+          this.$set(this,'addDialogType',false);
         }
       },
       //范围选择
@@ -183,6 +208,18 @@
         });
         this.handleQuery();
       },
+      //查看多个文档
+      lookDocumentListButton(type,row){
+        if(type==1){
+          this.$set(this,'propsLookDocumentListData',{
+            title:"查看附件",
+            list:row.list
+          });
+          this.$set(this,'lookDocumentListType',true);
+        }else{
+          this.$set(this,'lookDocumentListType',false);
+        }
+      },
     }
   }
 </script>

src/views/safetyCheck/laboratorySelfTest/selfInspectionTask/listPage.vue

@@ -79,13 +79,15 @@
           <el-table-column label="任务周期" align="center" prop="deptName" show-overflow-tooltip width="270"/>
           <el-table-column label="检查时间" sortable align="center" prop="deptName" show-overflow-tooltip width="157"/>
           <el-table-column label="操作" align="center" prop="deptName" width="230">
-            <div class="table-button-box">
-              <p class="table-button-p" @click="goAddPage(3)">详情</p>
-              <p class="table-button-p" @click="goAddPage(2)">开始检查</p>
-              <!--<p class="table-button-p">编辑</p>-->
-              <!--<p class="table-button-p">整改报告</p>-->
-              <!--<p class="table-button-p">查看附件</p>-->
-            </div>
+            <template slot-scope="scope">
+              <div class="table-button-box">
+                <p class="table-button-p" @click="goAddPage(3)">详情</p>
+                <p class="table-button-p" @click="goAddPage(2)">开始检查</p>
+                <p class="table-button-p">编辑</p>
+                <p class="table-button-p" @click="lookDocumentButton(1,scope.row)">整改报告</p>
+                <p class="table-button-p" @click="lookDocumentListButton(1,scope.row)">查看附件</p>
+              </div>
+            </template>
           </el-table-column>
         </el-table>
         <pagination :page-sizes="[20, 30, 40, 50]"
@@ -99,21 +101,32 @@
     </div>
     <addPage v-if="pageType==2"></addPage>
     <infoPage v-if="pageType==3"></infoPage>
+    <lookDocumentDialog v-if="lookDocumentType" :propsLookDocumentData="propsLookDocumentData"></lookDocumentDialog>
+    <lookDocumentListDialog v-if="lookDocumentListType" :propsLookDocumentListData="propsLookDocumentListData"></lookDocumentListDialog>
   </div>
 </template>
 
 <script>
   import addPage from './addPage.vue'
   import infoPage from '@/views/safetyCheck/components/infoPage/infoPage.vue'
+  import lookDocumentDialog from '@/components/lookDocumentDialog/lookDocumentDialog.vue'
+  import lookDocumentListDialog from '@/components/lookDocumentDialog/lookDocumentListDialog.vue'
   export default {
     name: 'index',
     components: {
       addPage,
-      infoPage
+      infoPage,
+      lookDocumentDialog,
+      lookDocumentListDialog
     },
     data(){
       return{
-        pageType:3,
+        //子组件数据
+        lookDocumentType:false,
+        propsLookDocumentData:{},
+        lookDocumentListType:false,
+        propsLookDocumentListData:{},
+        pageType:1,
         queryParams:{
           pageNum:1,
           pageSize:20,
@@ -186,6 +199,31 @@
         });
         this.handleQuery();
       },
+      //查看单个文档
+      lookDocumentButton(type,row){
+        if(type==1){
+          this.$set(this,'propsLookDocumentData',{
+            title:"整改报告",
+            name:row.name,
+            url:row.url
+          });
+          this.$set(this,'lookDocumentType',true);
+        }else{
+          this.$set(this,'lookDocumentType',false);
+        }
+      },
+      //查看多个文档
+      lookDocumentListButton(type,row){
+        if(type==1){
+          this.$set(this,'propsLookDocumentListData',{
+            title:"查看附件",
+            list:row.list
+          });
+          this.$set(this,'lookDocumentListType',true);
+        }else{
+          this.$set(this,'lookDocumentListType',false);
+        }
+      },
     },
   }
 </script>

src/views/safetyCheck/schoolInspection/inspectionGroup/addDialog.vue

@@ -1,7 +1,7 @@
 <template>
   <el-dialog class="inspectionGroup-dialog-box"
              :title="addDialogTitle" :visible.sync="addDialogType" v-if="addDialogType"
-             @close="addDialogOff" width="1303px" append-to-body>
+             @close="addDialogAllOff" width="1303px" append-to-body>
     <div class="add-max-box" v-if="addDialogBoxType == 1">
       <el-form  :model="dialogForm" :rules="rules" label-width="100px" class="add-form-box">
         <el-form-item label="是否启用:" prop="data1">
@@ -182,6 +182,9 @@
 <script>
   export default {
     name: 'addDialog',
+    props:{
+      addDialogData:{},
+    },
     data(){
       return{
         addDialogTitle:"",
@@ -228,30 +231,25 @@
       }
     },
     created(){
-
+      this.$set(this,'addDialogTitle',this.addDialogData.title);
+      this.$set(this,'lookInfoType',this.addDialogData.lookInfoType);
+      if(this.addDialogData.addType){
+        //新增
+      }else{
+        //编辑
+      }
     },
     mounted(){
 
     },
     methods:{
-      //弹窗开启
-      addDialogOpen(type,data){
-        if(type==1){
-          this.$set(this,'addDialogTitle','创建巡查计划');
-          this.$set(this,'lookInfoType',false);
-        }else if(type == 2){
-          this.$set(this,'addDialogTitle','编辑巡查计划');
-          this.$set(this,'lookInfoType',false);
-        }else {
-          this.$set(this,'addDialogTitle','巡查计划详情');
-          this.$set(this,'lookInfoType',true);
-        }
-        this.$set(this,'addDialogType',true);
-      },
       //弹窗关闭
+      addDialogAllOff(){
+        this.$parent.addDialogOpen(4)
+      },
       addDialogOff(){
         if(this.addDialogBoxType == 1){
-          this.$set(this,'addDialogType',false);
+          this.$parent.addDialogOpen(4)
         }else{
           this.dialogClickType(1);
         }

src/views/safetyCheck/schoolInspection/inspectionGroup/index.vue

@@ -92,7 +92,7 @@
                   @pagination="getList"
       />
     </div>
-    <addDialog ref="addDialog"></addDialog>
+    <addDialog v-if="addDialogType" :addDialogData="addDialogData"></addDialog>
   </div>
 </template>
 
@@ -105,6 +105,8 @@
     },
     data(){
       return{
+        addDialogType:false,
+        addDialogData:{},
         queryParams:{},
         tableList:[{}],
         total:0,
@@ -122,11 +124,28 @@
       //弹窗开启
       addDialogOpen(type,data){
         if(type==1){
-          this.$refs.addDialog.addDialogOpen(type);
+          this.$set(this,'addDialogData',{
+            title:"新增巡察组",
+            addType:false,
+            lookInfoType:false,
+          })
+          this.$set(this,'addDialogType',true)
         }else if(type == 2){
-          this.$refs.addDialog.addDialogOpen(type,data);
+          this.$set(this,'addDialogData',{
+            title:"编辑巡察组",
+            addType:true,
+            lookInfoType:false,
+          })
+          this.$set(this,'addDialogType',true)
+        }else if(type == 3){
+          this.$set(this,'addDialogData',{
+            title:"巡察组详情",
+            addType:false,
+            lookInfoType:true,
+          })
+          this.$set(this,'addDialogType',true)
         }else{
-          this.$refs.addDialog.addDialogOpen(type,data);
+          this.$set(this,'addDialogType',false)
         }
       },
       // 开关

src/views/safetyCheck/schoolInspection/inspectionManagement/index.vue

@@ -84,13 +84,15 @@
           <el-table-column label="计划周期" align="center" prop="deptName" show-overflow-tooltip width="270"/>
           <el-table-column label="检查时间" sortable align="center" prop="deptName" show-overflow-tooltip width="157"/>
           <el-table-column label="操作" align="center" prop="deptName" width="230">
-            <div class="table-button-box">
-              <p class="table-button-p" @click="goAddPage(3)">详情</p>
-              <p class="table-button-p" @click="goAddPage(2)">开始检查</p>
-              <!--<p class="table-button-p">编辑</p>-->
-              <!--<p class="table-button-p">整改报告</p>-->
-              <!--<p class="table-button-p">查看附件</p>-->
-            </div>
+            <template slot-scope="scope">
+              <div class="table-button-box">
+                <p class="table-button-p" @click="goAddPage(3)">详情</p>
+                <p class="table-button-p" @click="goAddPage(2)">开始检查</p>
+                <p class="table-button-p">编辑</p>
+                <p class="table-button-p" @click="lookDocumentButton(1,scope.row)">整改报告</p>
+                <p class="table-button-p" @click="lookDocumentListButton(1,scope.row)">查看附件</p>
+              </div>
+            </template>
           </el-table-column>
         </el-table>
         <pagination :page-sizes="[20, 30, 40, 50]"
@@ -104,20 +106,31 @@
     </div>
     <addPage v-if="pageType==2"></addPage>
     <infoPage v-if="pageType==3"></infoPage>
+    <lookDocumentDialog v-if="lookDocumentType" :propsLookDocumentData="propsLookDocumentData"></lookDocumentDialog>
+    <lookDocumentListDialog v-if="lookDocumentListType" :propsLookDocumentListData="propsLookDocumentListData"></lookDocumentListDialog>
   </div>
 </template>
 
 <script>
   import addPage from './addPage.vue'
   import infoPage from '@/views/safetyCheck/components/infoPage/infoPage.vue'
+  import lookDocumentDialog from '@/components/lookDocumentDialog/lookDocumentDialog.vue'
+  import lookDocumentListDialog from '@/components/lookDocumentDialog/lookDocumentListDialog.vue'
   export default {
     name: 'index',
     components: {
       addPage,
-      infoPage
+      infoPage,
+      lookDocumentDialog,
+      lookDocumentListDialog
     },
     data(){
       return{
+        //子组件数据
+        lookDocumentType:false,
+        propsLookDocumentData:{},
+        lookDocumentListType:false,
+        propsLookDocumentListData:{},
         pageType:1,
         queryParams:{
           pageNum:1,
@@ -190,6 +203,31 @@
         });
         this.handleQuery();
       },
+      //查看单个文档
+      lookDocumentButton(type,row){
+        if(type==1){
+          this.$set(this,'propsLookDocumentData',{
+            title:"整改报告",
+            name:row.name,
+            url:row.url
+          });
+          this.$set(this,'lookDocumentType',true);
+        }else{
+          this.$set(this,'lookDocumentType',false);
+        }
+      },
+      //查看多个文档
+      lookDocumentListButton(type,row){
+        if(type==1){
+          this.$set(this,'propsLookDocumentListData',{
+            title:"查看附件",
+            list:row.list
+          });
+          this.$set(this,'lookDocumentListType',true);
+        }else{
+          this.$set(this,'lookDocumentListType',false);
+        }
+      },
     }
   }
 </script>

src/views/safetyCheck/schoolInspection/inspectionPlan/addDialog.vue

@@ -1,7 +1,7 @@
 <template>
   <el-dialog class="inspectionPlan-dialog-box"
              :title="addDialogTitle" :visible.sync="addDialogType" v-if="addDialogType"
-             @close="addDialogOff" width="1303px" append-to-body>
+             @close="addDialogAllOff" width="1303px" append-to-body>
     <div class="inspectionPlan-dialog-add-box" v-show="addDialogBoxType==1">
       <div class="left-max-box" v-if="!lookInfoType">
         <div class="left-max-title-box">
@@ -490,6 +490,9 @@
   import { getToken } from "@/utils/auth";
   export default {
     name: 'addDialog',
+    props:{
+      addDialogData:{},
+    },
     data(){
       return{
         uploadImgUrl: this.uploadUrl(), // 上传的图片服务器地址
@@ -499,7 +502,7 @@
         addDialogTitle:"",
         addDialogType:true,
         //弹窗内容状态
-        addDialogBoxType:2,
+        addDialogBoxType:1,
         // 设置只能选择当前日期及之后的日期
         pickerOptions: {
           disabledDate(time) {
@@ -617,30 +620,26 @@
       }
     },
     created(){
-
+      this.$set(this,'addDialogTitle',this.addDialogData.title);
+      this.$set(this,'lookInfoType',this.addDialogData.lookInfoType);
+      if(this.addDialogData.addType){
+        //新增
+      }else{
+        //编辑
+      }
     },
     mounted(){
 
     },
     methods:{
       /*===================================弹窗相关===================================*/
-      //弹窗开启
-      addDialogOpen(type,data){
-        if(type==1){
-          this.$set(this,'lookInfoType',false);
-          this.$set(this,'addDialogTitle','创建巡查计划');
-        }else if(type==2){
-          this.$set(this,'lookInfoType',false);
-          this.$set(this,'addDialogTitle','编辑巡查计划');
-        }else{
-          this.$set(this,'lookInfoType',true);
-        }
-        this.$set(this,'addDialogType',true);
-      },
       //弹窗关闭
+      addDialogAllOff(){
+        this.$parent.addDialogOpen(4)
+      },
       addDialogOff(){
         if(this.addDialogBoxType == 1){
-          this.$set(this,'addDialogType',false);
+          this.$parent.addDialogOpen(4)
         }else{
           this.dialogClickType(1);
         }

src/views/safetyCheck/schoolInspection/inspectionPlan/index.vue

@@ -77,7 +77,7 @@
                 <p class="table-button-p">删除</p>
                 <p class="table-button-p" @click="addDialogOpen(3,scope.row)">详情</p>
                 <p class="table-button-p" @click="goPage(2,scope.row)">巡查管理</p>
-                <!--<p class="table-button-p">查看附件</p>-->
+                <p class="table-button-p" @click="lookDocumentListButton(1,scope.row)">查看附件</p>
               </div>
             </template>
           </el-table-column>
@@ -91,23 +91,31 @@
         />
       </div>
     </div>
-    <add-dialog ref="addDialog"></add-dialog>
     <list-page v-if="pageType == 2"></list-page>
+    <add-dialog v-if="addDialogType" :addDialogData="addDialogData"></add-dialog>
+    <lookDocumentListDialog v-if="lookDocumentListType" :propsLookDocumentListData="propsLookDocumentListData"></lookDocumentListDialog>
   </div>
 </template>
 
 <script>
   import addDialog from './addDialog.vue'
   import listPage from './listPage.vue'
+  import lookDocumentListDialog from '@/components/lookDocumentDialog/lookDocumentListDialog.vue'
   export default {
     name: 'index',
     components: {
       addDialog,
-      listPage
+      listPage,
+      lookDocumentListDialog
     },
     data(){
       return{
-        pageType:2,
+        //子组件数据
+        lookDocumentListType:false,
+        propsLookDocumentListData:{},
+        addDialogType:false,
+        addDialogData:{},
+        pageType:1,
         queryParams:{
           pageNum:1,
           pageSize:20,
@@ -137,11 +145,28 @@
       //弹窗开启
       addDialogOpen(type,data){
         if(type==1){
-          this.$refs.addDialog.addDialogOpen(type);
+          this.$set(this,'addDialogData',{
+            title:"创建巡查计划",
+            lookInfoType:false,
+            addType:false,
+          })
+          this.$set(this,'addDialogType',true);
         }else if(type==2){
-          this.$refs.addDialog.addDialogOpen(type,data);
-        }else{
-          this.$refs.addDialog.addDialogOpen(type,data);
+          this.$set(this,'addDialogData',{
+            title:"编辑巡查计划",
+            lookInfoType:false,
+            addType:true,
+          })
+          this.$set(this,'addDialogType',true);
+        }else if(type==3){
+          this.$set(this,'addDialogData',{
+            title:"巡查计划详情",
+            lookInfoType:true,
+            addType:true,
+          })
+          this.$set(this,'addDialogType',true);
+        }else if(type==4){
+          this.$set(this,'addDialogType',false);
         }
       },
       //范围选择
@@ -217,6 +242,18 @@
         }
         return type;
       },
+      //查看多个文档
+      lookDocumentListButton(type,row){
+        if(type==1){
+          this.$set(this,'propsLookDocumentListData',{
+            title:"查看附件",
+            list:row.list
+          });
+          this.$set(this,'lookDocumentListType',true);
+        }else{
+          this.$set(this,'lookDocumentListType',false);
+        }
+      },
     }
   }
 </script>

src/views/safetyCheck/schoolInspection/inspectionPlan/listPage.vue

@@ -79,13 +79,15 @@
           <el-table-column label="任务周期" align="center" prop="deptName" show-overflow-tooltip width="270"/>
           <el-table-column label="检查时间" sortable align="center" prop="deptName" show-overflow-tooltip width="157"/>
           <el-table-column label="操作" align="center" prop="deptName" width="230">
-            <div class="table-button-box">
-              <p class="table-button-p" @click="goAddPage(3)">详情</p>
-              <p class="table-button-p" @click="goAddPage(2)">开始检查</p>
-              <!--<p class="table-button-p">编辑</p>-->
-              <!--<p class="table-button-p">整改报告</p>-->
-              <!--<p class="table-button-p">查看附件</p>-->
-            </div>
+            <template slot-scope="scope">
+              <div class="table-button-box">
+                <p class="table-button-p" @click="goAddPage(3)">详情</p>
+                <p class="table-button-p" @click="goAddPage(2)">开始检查</p>
+                <p class="table-button-p">编辑</p>
+                <p class="table-button-p" @click="lookDocumentButton(1,scope.row)">整改报告</p>
+                <p class="table-button-p" @click="lookDocumentListButton(1,scope.row)">查看附件</p>
+              </div>
+            </template>
           </el-table-column>
         </el-table>
         <pagination :page-sizes="[20, 30, 40, 50]"
@@ -99,21 +101,32 @@
     </div>
     <addPage v-if="pageType==2"></addPage>
     <infoPage v-if="pageType==3"></infoPage>
+    <lookDocumentDialog v-if="lookDocumentType" :propsLookDocumentData="propsLookDocumentData"></lookDocumentDialog>
+    <lookDocumentListDialog v-if="lookDocumentListType" :propsLookDocumentListData="propsLookDocumentListData"></lookDocumentListDialog>
   </div>
 </template>
 
 <script>
   import addPage from './addPage.vue'
   import infoPage from '@/views/safetyCheck/components/infoPage/infoPage.vue'
+  import lookDocumentDialog from '@/components/lookDocumentDialog/lookDocumentDialog.vue'
+  import lookDocumentListDialog from '@/components/lookDocumentDialog/lookDocumentListDialog.vue'
   export default {
     name: 'index',
     components: {
       addPage,
-      infoPage
+      infoPage,
+      lookDocumentDialog,
+      lookDocumentListDialog
     },
     data(){
       return{
-        pageType:3,
+        //子组件数据
+        lookDocumentType:false,
+        propsLookDocumentData:{},
+        lookDocumentListType:false,
+        propsLookDocumentListData:{},
+        pageType:1,
         queryParams:{
           pageNum:1,
           pageSize:20,
@@ -186,6 +199,31 @@
         });
         this.handleQuery();
       },
+      //查看单个文档
+      lookDocumentButton(type,row){
+        if(type==1){
+          this.$set(this,'propsLookDocumentData',{
+            title:"整改报告",
+            name:row.name,
+            url:row.url
+          });
+          this.$set(this,'lookDocumentType',true);
+        }else{
+          this.$set(this,'lookDocumentType',false);
+        }
+      },
+      //查看多个文档
+      lookDocumentListButton(type,row){
+        if(type==1){
+          this.$set(this,'propsLookDocumentListData',{
+            title:"查看附件",
+            list:row.list
+          });
+          this.$set(this,'lookDocumentListType',true);
+        }else{
+          this.$set(this,'lookDocumentListType',false);
+        }
+      },
     },
   }
 </script>