zc

src/assets/styles/button.scss

@@ -354,6 +354,30 @@
     background-color:$buttonColorI;
     border: 1px solid $buttonColorI;
   }
+  .page-top-title-edit-p{
+    font-weight:500;
+    cursor:pointer;
+    display: inline-block;
+    text-align: center;
+    width: 90px;
+    height: 40px;
+    line-height:40px;
+    border-radius: 6px;
+    border: 1px solid $buttonColorC;
+    color:$buttonColorC;
+    font-size: 14px;
+    background-color:$buttonColorA;
+    overflow: hidden;
+    margin-left:20px;
+    i{
+      margin:0 5px 0 0;
+    }
+  }
+  .page-top-title-edit-p:hover{
+    color:$buttonColorA;
+    background-color:$buttonColorI;
+    border: 1px solid $buttonColorI;
+  }
   .page-top-title-button-p{
     font-weight:500;
     cursor:pointer;

src/views/safetyCheck/components/checkItem.vue

@@ -1,9 +1,9 @@
 <!--检查项--->
 <template>
   <div class="page-container checkItem">
-    <div class="page-container checkItem">
+    <div class="page-container checkItem" v-if="pageType == 1">
       <div class="page-top-title-box">
-        <p class="page-top-title-name-p">{{propsData.id?'编辑':'新增'}}</p>
+        <p class="page-top-title-name-p">实验室名称</p>
         <p class="page-top-title-out-p" @click="backPage">返回</p>
       </div>
       <div class="content-box scrollbar-box">
@@ -122,6 +122,7 @@
         </div>
       </div>
     </div>
+    <initiateInspect v-if="pageType == 2"></initiateInspect>
   </div>
 </template>
 
@@ -129,8 +130,12 @@
   //import { getDicts } from "@/api/commonality/noPermission";
   //import { systemUserSelect } from "@/api/commonality/permission";
   //import { getInfo } from "@/api/basicsModules/index";
+  import initiateInspect from "@/views/safetyCheck/components/initiateInspect.vue";
   export default {
     name: 'checkItem',
+    components: {
+      initiateInspect
+    },
     props:{
       propsData:{},
     },
@@ -138,7 +143,7 @@
       return{
         tableButtonType:this.hasPermiDom(['demo:demo:detail','demo:demo:edit','demo:demo:del',]),
         //页面状态
-        pageType:1,
+        pageType:2,
         //状态选项卡
         tableButtonCheckType:1,
         //页面遮罩
@@ -156,7 +161,7 @@
         //时间数据
         dateRange:[],
         //列表数据
-        dataList:[],
+        dataList:[{}],
         //数据数量
         total:0,
       }

src/views/safetyCheck/components/initiateInspect.vue

@@ -0,0 +1,72 @@
+<!--开始检查/编辑检查/检查详情-->
+<template>
+  <div class="page-container initiateInspect">
+    <div class="page-top-title-box">
+      <p class="page-top-title-name-p">开展检查</p>
+      <p class="page-top-title-edit-p" @click="submitForm">保存草稿</p>
+      <p class="page-top-title-edit-p" @click="submitForm">继续检查</p>
+      <p class="page-top-title-add-p" @click="submitForm">提交查看</p>
+      <p class="page-top-title-out-p" @click="backPage">返回</p>
+    </div>
+    <div class="content-box scrollbar-box">
+      <el-form class="add-form-box" :model="newData" ref="form" :rules="rules" label-width="120px">
+        <el-form-item label="名称" prop="name">
+          <el-input v-model="newData.name" placeholder="请输入名称" maxLength="20" style="width:500px;"></el-input>
+        </el-form-item>
+      </el-form>
+    </div>
+  </div>
+</template>
+
+<script>
+  //import { getDicts } from "@/api/commonality/noPermission";
+  //import { systemUserSelect } from "@/api/commonality/permission";
+  //import { getInfo } from "@/api/basicsModules/index";
+  export default {
+    name: 'initiateInspect',
+    props:{
+      propsData:{},
+    },
+    data(){
+      return{
+        newData:{},
+      }
+    },
+    created(){
+      this.initialize();
+    },
+    mounted(){
+
+    },
+    methods:{
+      // 返回按钮
+      backPage(){
+        this.$parent.tableButton(6);
+      },
+      /** 提交按钮 */
+      submitForm(type) {
+        this.$refs["form"].validate(valid => {
+          if (valid) {
+            if(type == 1){
+              //保存草稿
+            }else if(type == 2){
+              //继续检查
+            }else if(type == 3){
+              //提交查看
+            }
+          }
+        })
+      }
+    },
+  }
+</script>
+
+<style scoped lang="scss">
+  .initiateInspect{
+    .content-box{
+      flex:1;
+      display: flex;
+      padding:20px;
+    }
+  }
+</style>

src/views/safetyCheck/components/projectAddPage.vue

@@ -1,12 +1,13 @@
+<!--新增计划/编辑计划/计划详情-->
 <template>
   <div class="page-container projectAddPage">
     <div class="page-top-title-box">
-      <p class="page-top-title-name-p">{{propsData.id?'编辑计划':'创建计划'}}</p>
+      <p class="page-top-title-name-p">{{lookInfoType?'计划详情':(propsData.id?'编辑计划':'创建计划')}}</p>
       <p class="page-top-title-out-p" @click="backPage">返回</p>
-      <p class="page-top-title-add-p" @click="submitForm">提交</p>
+      <p class="page-top-title-add-p" @click="submitForm" v-if="!lookInfoType">提交</p>
     </div>
     <div class="content-box">
-      <div class="content-left-box">
+      <div class="content-left-box" v-if="!lookInfoType">
         <div class="content-left-title-box">
           <img src="@/assets/ZDimages/safetyCheck/icon_jhbt.png">
           <p>计划标题快选</p>
@@ -30,11 +31,11 @@
           <div class="content-right-project-box">
             <p class="project-title-p">计划任务</p>
             <el-form-item label="计划标题" prop="data1" style="margin-top:20px;">
-              <el-input v-model="dialogForm.data1" placeholder="请输入计划标题" maxLength="30" style="width:450px;"></el-input>
+              <el-input v-model="dialogForm.data1" :disabled="lookInfoType" placeholder="请输入计划标题" maxLength="30" style="width:450px;"></el-input>
             </el-form-item>
             <div class="content-right-form-display">
               <el-form-item label="检查类型" prop="data2">
-                <el-select v-model="dialogForm.data2" placeholder="请选择检查类型" style="width: 450px">
+                <el-select v-model="dialogForm.data2" :disabled="lookInfoType" placeholder="请选择检查类型" style="width: 450px">
                   <el-option
                     v-for="dict in inspectType"
                     :key="dict.value"
@@ -46,12 +47,12 @@
               <div class="intersect-inspect-box" @click="intersectInspectCheck"
                    :class="dialogForm.data3?'intersect-inspect-check-box':''">
                 <p>交叉检查</p>
-                <img v-if="dialogForm.data3" src="">
+                <img v-if="dialogForm.data3" src="@/assets/ZDimages/safetyCheck/icom_xjjc_jcjc@1x.png">
               </div>
             </div>
             <div class="content-right-form-display">
               <el-form-item label="检查范围" prop="data4">
-                <el-radio-group v-model="dialogForm.data4">
+                <el-radio-group v-model="dialogForm.data4" :disabled="lookInfoType">
                   <el-radio :label="1">全校</el-radio>
                   <el-radio :label="2">实验室</el-radio>
                 </el-radio-group>
@@ -65,6 +66,7 @@
             <div class="content-right-form-display">
               <el-form-item label="计划周期" prop="dateRange">
                 <el-date-picker
+                  :disabled="lookInfoType"
                   :clearable="false"
                   v-model="dialogForm.dateRange"
                   style="width:450px;"
@@ -76,7 +78,7 @@
                   end-placeholder="结束日期"
                 ></el-date-picker>
               </el-form-item>
-              <div class="date-range-right-box">
+              <div class="date-range-right-box" v-if="!lookInfoType">
                 <p @click="checkTime(1)">本月</p>
                 <p @click="checkTime(2)">本季度</p>
                 <p @click="checkTime(3)">全年</p>
@@ -84,6 +86,7 @@
             </div>
             <el-form-item label="检查组织" prop="data5">
               <el-select
+                :disabled="lookInfoType"
                 style="width:450px;"
                 v-model="dialogForm.data5"
                 filterable
@@ -104,9 +107,10 @@
             </el-form-item>
             <el-form-item label="检查要求:" prop="checkDemand">
               <el-input
+                :disabled="lookInfoType"
                 type="textarea"
                 :autosize="{ minRows: 4, maxRows: 4}"
-                :placeholder="请输入检查要求"
+                placeholder="请输入检查要求"
                 v-model="dialogForm.checkDemand"
                 maxlength="100"
                 resize="none"
@@ -115,7 +119,7 @@
               </el-input>
             </el-form-item>
             <el-form-item label="材料附件:">
-              <div class="avatar-uploader-button-box" v-if="dialogForm.uploadDtoList.length<10">
+              <div class="avatar-uploader-button-box" v-if="dialogForm.uploadDtoList.length<10&&!lookInfoType">
                 <el-upload
                   class="avatar-uploader"
                   :action="uploadFileUrl"
@@ -127,35 +131,41 @@
                 </el-upload>
                 <p class="avatar-uploader-text">支持docx/xlsx/pdf格式文件</p>
               </div>
+              <div class="up-data-table-box">
+                <el-table class="table-box table-null-img-10" border :data="dialogForm.uploadDtoList">
+                  <el-table-column label="文件名" prop="fileName" show-overflow-tooltip/>
+                  <el-table-column label="操作" width="300" show-overflow-tooltip>
+                    <template slot-scope="scope">
+                      <div class="table-button-box">
+                        <p class="table-button-null"></p>
+                        <p class="table-button-p"
+                           @click="lookUploadFile(scope.row)"
+                        >查看</p>
+                        <p class="table-button-p"
+                           v-if="!lookInfoType"
+                           @click="delUploadFile(scope.$index, scope.row)"
+                        >删除</p>
+                        <p class="table-button-p"
+                           v-if="lookInfoType"
+                           @click="downloadButton(scope.row)"
+                        >下载</p>
+                        <p class="table-button-null"></p>
+                      </div>
+                    </template>
+                  </el-table-column>
+                </el-table>
+              </div>
             </el-form-item>
-            <div class="up-data-table-box">
-              <el-table class="table-box table-null-img-10" border :data="dialogForm.uploadDtoList">
-                <el-table-column label="检查类型" prop="fileName" show-overflow-tooltip/>
-                <el-table-column label="操作" width="300" show-overflow-tooltip>
-                  <template slot-scope="scope">
-                    <div class="table-button-box">
-                      <p class="table-button-null"></p>
-                      <p class="table-button-p"
-                         @click="lookUploadFile(scope.row)"
-                      >查看</p>
-                      <p class="table-button-p"
-                         @click="delUploadFile(scope.$index, scope.row)"
-                      >删除</p>
-                      <p class="table-button-null"></p>
-                    </div>
-                  </template>
-                </el-table-column>
-              </el-table>
-            </div>
             <p class="project-title-p" style="margin-top:20px;border-top:1px solid #e0e0e0;">检查设置</p>
             <div class="inspect-for-max-big-box" v-for="(item,index) in dialogForm.inspectList" :key="index">
               <p class="for-index-p">{{index+1}}</p>
-              <img src="" class="del-button" v-if="dialogForm.inspectList[1]" @click="delInspect(index)">
+              <img src="@/assets/ZDimages/safetyCheck/icon_jcsz_gb@1x.png" class="del-button" v-if="dialogForm.inspectList[1]" @click="delInspect(index)">
               <el-form-item label="检查名称" :prop="'inspectList.'+index+'.data6'" :rules="rules.data6" style="margin-top:20px;">
-                <el-input v-model="item.data6" placeholder="请输入检查名称" maxLength="20" style="width:450px;"></el-input>
+                <el-input v-model="item.data6" :disabled="lookInfoType" placeholder="请输入检查名称" maxLength="20" style="width:450px;"></el-input>
               </el-form-item>
               <el-form-item label="检查开始日期" :prop="'inspectList.'+index+'.data7'" :rules="rules.data6">
                 <el-date-picker
+                  :disabled="lookInfoType"
                   style="width:450px;"
                   v-model="item.data7"
                   type="date"
@@ -165,22 +175,26 @@
               <div class="content-right-form-display">
                 <el-form-item label="整改期限" :prop="'inspectList.'+index+'.data8'" :rules="rules.data6">
                   <el-date-picker
+                    :disabled="lookInfoType"
                     style="width:450px;"
                     v-model="item.data8"
                     type="date"
                     placeholder="请选整改期限">
                   </el-date-picker>
                 </el-form-item>
-                <div class="overdue-check-box" @click="overdueCheck(index)">
+                <div class="overdue-check-box" @click="overdueCheck(index)" v-if="!lookInfoType">
                   <div>
                     <p v-if="item.data10"></p>
                   </div>
                   <p class="overdue-p">逾期未完成整改关闭实验室</p>
                 </div>
+                <div class="overdue-check-box" v-if="item.data10">
+                  <p class="overdue-p">逾期未完成整改关闭实验室</p>
+                </div>
               </div>
               <div class="content-right-form-display">
                 <el-form-item label="检查项目来源" prop="data9">
-                  <el-select v-model="dialogForm.data9" placeholder="请选择检查项目来源" style="width: 450px">
+                  <el-select v-model="dialogForm.data9" :disabled="lookInfoType" placeholder="请选择检查项目来源" style="width: 450px">
                     <el-option
                       v-for="dict in inspectSource"
                       :key="dict.value"
@@ -189,11 +203,11 @@
                     ></el-option>
                   </el-select>
                 </el-form-item>
-                <p class="color-text">检查依据模版</p>
+                <p class="color-text" v-if="!lookInfoType">检查依据模版</p>
               </div>
             </div>
           </div>
-          <p class="add-button-p" @click="addInspect">+</p>
+          <p class="add-button-p" @click="addInspect" v-if="!lookInfoType">+</p>
         </el-form>
       </div>
     </div>
@@ -220,6 +234,8 @@
     },
     data(){
       return{
+        //查看详情状态
+        lookInfoType:false,
         schoolCollegeType:1,//1.校级 2.院级
         uploadFileUrl: this.uploadUrl(), // 上传的图片服务器地址
         headers: {
@@ -277,10 +293,6 @@
           data5: [
             { required: true, message: "搜索选择督导组", trigger: "blur" },
           ],
-          // checkDemand: [
-          //   { required: true, message: "请输入检查要求", trigger: "blur" },
-          //   { required: true, message: "请输入检查要求", validator: this.spaceJudgment, trigger: "blur" }
-          // ],
           data6: [
             { required: true, message: "请输入检查名称", trigger: "blur" },
             { required: true, message: "请输入检查名称", validator: this.spaceJudgment, trigger: "blur" }
@@ -375,12 +387,27 @@
       }
     },
     created(){
-      // this.initialize();
+      this.initialize();
     },
     mounted(){
 
     },
     methods:{
+      //初始化
+      initialize(){
+        console.log(this.propsData);
+        if(this.propsData.showType){
+          //查看
+          this.$set(this,'lookInfoType',true);
+        }else{
+          this.$set(this,'lookInfoType',false);
+          if (this.propsData.id){
+            //编辑
+          } else {
+            //新增
+          }
+        }
+      },
       //新增检查
       addInspect(){
         if(this.dialogForm.inspectList[11]){
@@ -453,7 +480,9 @@
       },
       //交叉检查选中
       intersectInspectCheck(){
-        this.$set(this.dialogForm,'data3',!this.dialogForm.data3);
+        if(!this.lookInfoType){
+          this.$set(this.dialogForm,'data3',!this.dialogForm.data3);
+        }
       },
       //选中对应周期
       checkTime(type){
@@ -570,6 +599,10 @@
         }).catch(() => {
         })
       },
+      // 单个下载按钮
+      downloadButton(item){
+        this.downloadUrl(item.fileUrl,item.fileName);
+      },
       //预览文件
       lookUploadFile(item){
         //判断类型
@@ -803,6 +836,7 @@
           }
           .avatar-uploader-button-box{
             display: flex;
+            margin-bottom:20px;
             .avatar-uploader-button{
               width: 120px;
               height: 40px;
@@ -821,7 +855,6 @@
           .up-data-table-box{
             width:820px;
             height:161px;
-            margin-left:120px;
             display: flex;
             overflow: hidden;
           }

src/views/safetyCheck/components/subDialog.vue

@@ -1,3 +1,4 @@
+<!--待检查实验室-->
 <template>
   <el-dialog class="inspectionPlan-dialog-box"
              :close-on-click-modal="false"

src/views/safetyCheck/schoolInspect/inspectManage/index.vue

@@ -174,7 +174,7 @@
       return {
         tableButtonType:this.hasPermiDom(['demo:demo:detail','demo:demo:edit','demo:demo:del',]),
         //页面状态
-        pageType:2,
+        pageType:1,
         //复查状态选项卡
         tableButtonCheckType:1,
         //页面遮罩
@@ -198,7 +198,7 @@
         //搜索模式切换
         advancedType:false,
         //列表数据
-        dataList:[],
+        dataList:[{}],
         //数据数量
         total:0,
         //组件传参

src/views/safetyCheck/schoolInspect/inspectProject/index.vue

@@ -149,7 +149,7 @@
         //时间数据
         dateRange:[],
         //列表数据
-        dataList:[],
+        dataList:[{}],
         //数据数量
         total:0,
         //组件传参
@@ -220,7 +220,6 @@
           //编辑
           this.$set(this,'pageType',2);
           let obj = JSON.parse(JSON.stringify(row))
-          obj.showType = false;
           this.$set(this,'propsData',obj);
         }else if(type == 4){
           //删除