zc

src/components/lookDocumentDialog/components/informDom.vue

@@ -65,7 +65,7 @@
 </template>
 
 <script>
-  import { getRectifyNotificationView } from '@/api/safetyCheck/index'
+  import { getRectifyNotificationView } from '@/apiDemo/safetyCheck/index'
   export default {
     name: 'informDom',
     props:{

src/components/lookDocumentDialog/components/noticeDom.vue

@@ -90,7 +90,7 @@
 </template>
 
 <script>
-  import { getRectifyAdviceNoteView } from '@/api/safetyCheck/index'
+  import { getRectifyAdviceNoteView } from '@/apiDemo/safetyCheck/index'
   export default {
     name: 'noticeDom',
     props:{

src/components/lookDocumentDialog/components/rectificationReportDom.vue

@@ -74,7 +74,7 @@
 </template>
 
 <script>
-  import { viewReport } from '@/api/safetyCheck/index'
+  import { viewReport } from '@/apiDemo/safetyCheck/index'
   export default {
     name: 'rectificationReportDom',
     props:{

src/store/modules/permission.js

@@ -224,6 +224,9 @@ export const loadView = (view) => { // 路由懒加载
   }else if(pathName === 'chemicalManage'){
     //化学品管理
     return (resolve) => require([`@/views/chemicalManage${pathUrl}`], resolve)
+  }else if(pathName === 'safetyCheck'){
+    //安全检查
+    return (resolve) => require([`@/views/safetyCheck${pathUrl}`], resolve)
   }
 }
 

src/views/safetyCheck/checkConfiguration/checkUserPage.vue

@@ -0,0 +1,144 @@
+<template>
+  <div class="checkUserPage">
+    <el-form :model="queryParams" class="form-box" ref="queryForm" :inline="true">
+      <el-form-item label="关键字" prop="searchValue" label-width="80px">
+        <el-input
+          maxLength="30"
+          v-model="queryParams.searchValue"
+          placeholder="实验室/房间号/姓名"
+          clearable
+          style="width: 200px"/>
+      </el-form-item>
+      <el-form-item label="学院" prop="deptId" label-width="50px">
+        <el-select v-model="queryParams.deptId" clearable placeholder="请选择学院">
+          <el-option
+            v-for="item in deptSelectList"
+            :key="item.deptId"
+            :label="item.deptName"
+            :value="item.deptId">
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item>
+        <p class="inquire-button-one" @click="handleQuery" style="margin-right:10px;">查询</p>
+        <p class="reset-button-one" @click="resetQuery">重置</p>
+      </el-form-item>
+      <el-form-item style="float: right;" v-hasPermi="['check:set:query']">
+        <el-col :span="1.5">
+          <p class="inquire-button-one"
+             style="width:100px;"
+             @click="configButton(1)"
+          >检查者配置</p>
+        </el-col>
+      </el-form-item>
+    </el-form>
+    <el-table  border :data="tableList" ref="multipleTable">
+      <el-table-column label="序号" align="center"  type="index" width="60" />
+      <el-table-column label="实验室" align="center" prop="subName" show-overflow-tooltip/>
+      <el-table-column label="学院" align="center" prop="deptName" show-overflow-tooltip width="300"/>
+      <el-table-column label="检查者" align="center" prop="nickNames" show-overflow-tooltip width="500"/>
+      <el-table-column label="操作人" align="center" prop="createName" show-overflow-tooltip width="200"/>
+      <!--<el-table-column label="操作时间" align="center" prop="createTime" show-overflow-tooltip width="300"/>-->
+    </el-table>
+    <pagination :page-sizes="[20, 30, 40, 50]"
+                v-show="total>0"
+                :total="total"
+                :page.sync="queryParams.pageNum"
+                :limit.sync="queryParams.pageSize"
+                @pagination="getList"
+    />
+    <configDialog v-if="configDialogType" :configDialogData="queryParams"></configDialog>
+  </div>
+</template>
+
+<script>
+  import { listDepartments } from "@/apiDemo/system/dept";
+  import { checkStaffList } from '@/apiDemo/safetyCheck/index'
+  import configDialog from './configDialog.vue'
+  export default {
+    name: 'checkUserPage',
+    components: {
+      configDialog
+    },
+    data(){
+      return{
+        // 组件数据
+        configDialogType:false,
+        configDialogData:{
+          configType:1,//1.检查人员配置 2.整改人员配置
+        },
+        //查询数据
+        deptSelectList:[],
+        queryParams:{
+          pageNum:1,
+          pageSize:20,
+          staffType:1,
+          searchValue:"",
+          deptId:""
+        },
+        tableList:[],
+        total:0,
+      }
+    },
+    created(){
+
+    },
+    mounted(){
+      this.listDepartments();
+      this.getList();
+    },
+    methods:{
+      //配置按钮
+      configButton(type){
+        console.log('type',type)
+        if(type == 1){
+          this.$set(this,'configDialogType',true);
+        }else if(type == 2){
+          this.$set(this,'configDialogType',false);
+        }else if(type == 3){
+          this.getList();
+          this.$set(this,'configDialogType',false);
+        }
+      },
+      //获取数据列表
+      getList(){
+        checkStaffList(this.queryParams).then(response => {
+          this.total = response.data.total;
+          this.tableList = response.data.records;
+        });
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.$set(this.queryParams,'pageNum',1);
+        this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.$set(this,'queryParams',{
+          pageNum:1,
+          pageSize:20,
+          staffType:1,
+          searchValue:"",
+          deptId:""
+        });
+        this.handleQuery();
+      },
+      //获取学院列表
+      listDepartments(){
+        listDepartments().then(response => {
+          this.deptSelectList = response.data;
+        });
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .checkUserPage{
+    padding:20px;
+    flex:1;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+  }
+</style>

src/views/safetyCheck/checkConfiguration/configDialog.vue

@@ -0,0 +1,738 @@
+<template>
+  <el-dialog class="configDialog"
+             :close-on-click-modal="false"
+             :title="configDialogData.staffType==1?'检查人员配置':'整改人员配置'" :visible.sync="configDialogType" v-if="configDialogType"
+             @close="addDialogAllOff" width="1373px" append-to-body>
+    <div class="configDialog-box" v-if="configPageType == 1">
+      <div class="configDialog-content-box">
+        <div class="configDialog-content-min-box">
+          <p class="configDialog-content-min-title">实验室{{configDialogData.staffType==1?'检查':(configDialogData.staffType==2?'整改':'')}}人员配置：</p>
+          <div class="configDialog-content-min-checkbox">
+            <el-checkbox-group v-model="checkDataList" @change="checkboxChange" :disabled="!editType">
+              <el-checkbox style="width:170px;margin-right:70px;"
+                           v-for="item in checkList" :value="item.key" :label="item.key" :key="item.key">{{item.label}}</el-checkbox>
+            </el-checkbox-group>
+          </div>
+          <p v-if="checkType" class="configDialog-content-min-button" @click="configUserButton(2)">配置</p>
+          <div class="configDialog-content-min-text-box" v-if="versionField() !== 'xiBeiNongLinDaXue'">
+            <p></p>
+            <p></p>
+            <p>实验室白名单内的老师</p>
+            <p v-if="checkType">拥有实验室安全准入资格的学生</p>
+          </div>
+        </div>
+      </div>
+      <div class="dialog-footer-box" v-hasPermi="['check:set:edit']">
+        <p class="dialog-footer-button-null"></p>
+        <p class="dialog-footer-button-info" @click="addDialogOff">取消</p>
+        <p class="dialog-footer-button-primary" @click="upDataButton">确定</p>
+        <p class="dialog-footer-button-null"></p>
+      </div>
+    </div>
+    <div class="configDialog-user-box" v-if="configPageType == 2">
+      <div class="configDialog-user-content-box">
+        <div class="left-max-box">
+          <div class="dept-table-title-box">
+            <p>待选人员</p>
+            <p>{{userNumLeft}}/{{userTotalLeft}}</p>
+          </div>
+          <div class="dept-table-max-box">
+            <el-form :model="userQueryParamsLeft" class="form-box" ref="queryForm" :inline="true" label-width="50px">
+              <el-form-item label="" prop="deptId">
+                <el-select v-model="userQueryParamsLeft.deptId" clearable @change="userHandleQueryLeft" placeholder="选择部门" style="width: 110px">
+                  <el-option
+                    v-for="item in deptSelectList"
+                    :key="item.deptId"
+                    :label="item.deptName"
+                    :value="item.deptId">
+                  </el-option>
+                </el-select>
+              </el-form-item>
+              <el-form-item>
+                <el-date-picker
+                  :clearable="false"
+                  v-model="leftDateRange"
+                  size="small"
+                  style="width: 180px"
+                  value-format="yyyy-MM-dd"
+                  type="daterange"
+                  range-separator="-"
+                  start-placeholder="开始日期"
+                  end-placeholder="结束日期"
+                ></el-date-picker>
+              </el-form-item>
+              <el-form-item label="" prop="searchValue" class="form-index" style="margin-right:0;">
+                <el-input
+                  maxLength="30"
+                  v-model="userQueryParamsLeft.searchValue"
+                  placeholder="姓名/手机号/实验室"
+                  style="width: 178px">
+                  <p class="el-icon-search" slot="append" @click="userHandleQueryLeft"></p>
+                </el-input>
+              </el-form-item>
+              <el-form-item style="margin-right:0;margin-left: 10px;">
+                <p class="inquire-button-one" @click="userResetQueryLeft" style="width:60px;margin-right:0;">重置</p>
+              </el-form-item>
+            </el-form>
+            <el-table ref="leftUserTable" border :data="userTableListLeft" @selection-change="userChangeLeft" :row-key="getRowKeys">
+              <el-table-column v-if="editType" type="selection" width="50" :reserve-selection="true" align="center"/>
+              <el-table-column label="姓名" align="center" prop="userName" show-overflow-tooltip/>
+              <el-table-column label="学号" align="center" prop="userNumber" show-overflow-tooltip width="80"/>
+              <el-table-column label="手机号" align="center" prop="phonenumber" show-overflow-tooltip width="100"/>
+              <el-table-column label="实验室" align="center" prop="subjectName" show-overflow-tooltip width="80"/>
+              <el-table-column label="准入有效期" align="center" prop="deptName" show-overflow-tooltip width="200">
+                <template slot-scope="scope">{{scope.row.validBeginTime}} 至 {{scope.row.validEndTime}}</template>
+              </el-table-column>
+            </el-table>
+            <pagination :page-sizes="[20, 30, 40, 50]"
+                        v-show="userTotalLeft>0"
+                        :total="userTotalLeft"
+                        :page.sync="userQueryParamsLeft.pageNum"
+                        :limit.sync="userQueryParamsLeft.pageSize"
+                        @pagination="userGetListLeft"/>
+          </div>
+        </div>
+        <div class="center-box">
+          <p v-if="editType" class="el-icon-arrow-left" @click="userArrowButton(1)"></p>
+          <p v-if="editType" class="el-icon-arrow-right" @click="userArrowButton(2)"></p>
+        </div>
+        <div class="right-max-box">
+          <div class="dept-table-title-box">
+            <p>已选成员</p>
+            <p>{{userNumRight}}/{{userTotalRight}}</p>
+          </div>
+          <div class="dept-table-max-box">
+            <el-form :model="userQueryParamsRight" class="form-box" ref="queryForm" :inline="true" label-width="50px">
+              <el-form-item label="" prop="deptId">
+                <el-select v-model="userQueryParamsRight.deptId" clearable @change="userHandleQueryRight" placeholder="选择部门" style="width: 110px">
+                  <el-option
+                    v-for="item in deptSelectList"
+                    :key="item.deptId"
+                    :label="item.deptName"
+                    :value="item.deptId">
+                  </el-option>
+                </el-select>
+              </el-form-item>
+              <el-form-item>
+                <el-date-picker
+                  :clearable="false"
+                  v-model="rightDateRange"
+                  size="small"
+                  style="width: 180px"
+                  value-format="yyyy-MM-dd"
+                  type="daterange"
+                  range-separator="-"
+                  start-placeholder="开始日期"
+                  end-placeholder="结束日期"
+                ></el-date-picker>
+              </el-form-item>
+              <el-form-item label="" prop="searchValue" class="form-index" style="margin-right:0;">
+                <el-input
+                  maxLength="30"
+                  v-model="userQueryParamsRight.searchValue"
+                  placeholder="姓名/手机号/实验室"
+                  style="width: 178px">
+                  <p class="el-icon-search" slot="append" @click="userHandleQueryRight"></p>
+                </el-input>
+              </el-form-item>
+              <el-form-item style="margin-right:0;margin-left: 10px;">
+                <p class="inquire-button-one" @click="userResetQueryRight" style="width:60px;margin-right:0;">重置</p>
+              </el-form-item>
+            </el-form>
+            <el-table ref="rightUserTable" border :data="userTableListRight" @selection-change="userChangeRight" :row-key="getRowKeys">
+              <el-table-column v-if="editType" type="selection" width="50" :reserve-selection="true" align="center"/>
+              <el-table-column label="姓名" align="center" prop="userName" show-overflow-tooltip/>
+              <el-table-column label="学号" align="center" prop="userNumber" show-overflow-tooltip width="80"/>
+              <el-table-column label="手机号" align="center" prop="phonenumber" show-overflow-tooltip width="100"/>
+              <el-table-column label="实验室" align="center" prop="subjectName" show-overflow-tooltip width="80"/>
+              <el-table-column label="准入有效期" align="center" prop="deptName" show-overflow-tooltip width="200">
+                <template slot-scope="scope">{{scope.row.validBeginTime}} 至 {{scope.row.validEndTime}}</template>
+              </el-table-column>
+            </el-table>
+            <pagination :page-sizes="[20, 30, 40, 50]"
+                        v-show="userTotalRight>0"
+                        :total="userTotalRight"
+                        :page.sync="userQueryParamsRight.pageNum"
+                        :limit.sync="userQueryParamsRight.pageSize"
+                        @pagination="userGetListRight"/>
+          </div>
+        </div>
+      </div>
+      <div class="dialog-footer-box" v-hasPermi="['check:set:edit']">
+        <p class="dialog-footer-button-null"></p>
+        <p class="dialog-footer-button-info" @click="addDialogOff">返回</p>
+        <p class="dialog-footer-button-primary" @click="addUserButton">确定</p>
+        <p class="dialog-footer-button-null"></p>
+      </div>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+  import { listDepartments } from "@/apiDemo/system/dept";
+  import { checkSet,checkSetAdd,checkStaffUserList } from '@/apiDemo/safetyCheck/index'
+  export default {
+    name: 'configDialog',
+    props:{
+      configDialogData:{},
+    },
+    data(){
+      return{
+        editType:this.hasPermiDom(['check:set:edit']),
+        configDialogType:true,
+        configPageType:1,
+        checkDataList:[],
+        checkList:[],
+        checkType:false,
+        /*===================================人员选择相关===================================*/
+        deptSelectList:[],
+        userQueryParamsLeft:{
+          pageNum:1,
+          pageSize:20,
+          searchValue:"",
+          deptId:"",
+          filtType:1
+        },
+        userTableListLeft:[],
+        userTotalLeft:0,
+        userNumLeft:0,
+        userIdsLeft:[],
+        userQueryParamsRight:{
+          pageNum:1,
+          pageSize:20,
+          deptId:"",
+          searchValue:"",
+          filtType:2
+        },
+        userTableListRight:[],
+        userTotalRight:0,
+        userNumRight:0,
+        userIdsRight:[],
+        leftDateRange:[],
+        rightDateRange:[],
+        //选中巡查人员列表
+        dialogTableList:[],
+        //选中页面人员列表数据
+        dialogTableDataList:[],
+      }
+    },
+    created(){
+
+    },
+    mounted(){
+      this.checkSet();
+      this.listDepartments();
+    },
+    methods:{
+      //提交
+      upDataButton(){
+        let self = this;
+        let obj = {
+          staffType:this.configDialogData.staffType,
+          setSubjectLead:false,
+          setSubjectSafety:false,
+          setTeacher:false,
+          setStudent:false,
+        };
+
+        if(this.versionField() === 'xiBeiNongLinDaXue'){
+          for(let i=0;i<self.checkDataList.length;i++){
+            if(self.checkDataList[i] == '2'){
+              obj.setSubjectLead = true;
+            }else if(self.checkDataList[i] == '1'){
+              obj.setSubjectSafety = true;
+            }
+          }
+          obj.sysUserVoList = []
+        }else{
+          for(let i=0;i<self.checkDataList.length;i++){
+            if(self.checkDataList[i] == '2'){
+              obj.setSubjectLead = true;
+            }else if(self.checkDataList[i] == '1'){
+              obj.setSubjectSafety = true;
+            }else if(self.checkDataList[i] == '3'){
+              obj.setTeacher = true;
+            }else if(self.checkDataList[i] == '4'){
+              obj.setStudent = true;
+            }
+          }
+          obj.sysUserVoList = obj.setStudent?this.dialogTableList:[]
+        }
+        if(obj.setStudent){
+          if(!obj.sysUserVoList[0]){
+            this.msgError('并未勾选任何学生')
+            return
+          }
+        }
+        checkSetAdd(obj).then(response => {
+          this.msgSuccess(response.msg);
+          this.$parent.configButton(3)
+        })
+      },
+      //获取配置
+      checkSet(){
+        checkSet({staffType:this.configDialogData.staffType}).then(response => {
+          let list = [];
+          console.log('this.versionField()',this.versionField())
+          if(this.versionField() === 'xiBeiNongLinDaXue'){
+            if(response.data.setSubjectLead){
+              //实验室负责人
+              list.push('2');
+            }
+            if(response.data.setSubjectSafety){
+              //实验室安全责任人
+              list.push('1');
+            }
+            this.$set(this,'checkList',[
+              {
+                key:"2",
+                label:"实验室负责人",
+              },
+              {
+                key:"1",
+                label:"实验室安全责任人",
+              }
+            ]);
+          }else{
+            if(response.data.setSubjectLead){
+              //实验室负责人
+              list.push('2');
+            }
+            if(response.data.setSubjectSafety){
+              //实验室安全责任人
+              list.push('1');
+            }
+            if(response.data.setTeacher){
+              //全部老师
+              list.push('3');
+            }
+            if(response.data.setStudent){
+              //全部学生
+              list.push('4');
+              this.$set(this,'checkType',true);
+            }
+            this.$set(this,'checkList',[
+              {
+                key:"2",
+                label:"实验室负责人",
+              },
+              {
+                key:"1",
+                label:"实验室安全责任人",
+              },
+              {
+                key:"3",
+                label:"老师",
+              },
+              {
+                key:"4",
+                label:"学生",
+              },
+            ]);
+          }
+          this.$set(this,'checkDataList',list);
+          this.$set(this,'dialogTableList',response.data.userStuList);
+        });
+      },
+      //人员选择
+      configUserButton(type){
+        let self = this;
+        if(this.configPageType != type){
+          if(type == 2){
+            this.$set(self,'dialogTableDataList',JSON.parse(JSON.stringify(this.dialogTableList)));
+            this.userResetQueryLeft();
+            this.userResetQueryRight();
+            this.$set(this,'configPageType',type);
+          }else{
+            checkStaffUserList.then(response => {
+              this.dialogTableList = response.data;
+            });
+            this.$set(this,'configPageType',type);
+          }
+        }
+      },
+      //选择器
+      checkboxChange(val){
+        if(val[0]){
+          let num = 0;
+          for(let i=0;i<val.length;i++){
+            if(val[i] == '4'){
+              num++
+            }
+          }
+          this.$set(this,'checkType',num != 0?true:false);
+        }else{
+          this.$set(this,'checkType',false);
+        }
+      },
+      //窗口关闭
+      addDialogAllOff(){
+        this.$parent.configButton(2)
+      },
+      addDialogOff(){
+        if(this.configPageType == 1){
+          this.$parent.configButton(2)
+        }else{
+          this.$set(this,'configPageType',1);
+        }
+      },
+      addUserButton(){
+        this.$set(this,'dialogTableList',this.dialogTableDataList);
+        this.$set(this,'configPageType',1);
+      },
+      /*===================================人员选择相关===================================*/
+      //查询
+      userHandleQueryLeft(){
+        this.$set(this.userQueryParamsLeft,'pageNum',1);
+        this.$set(this,'userNumLeft',0);
+        this.$set(this,'userIdsLeft',[]);
+        if (this.$refs.leftUserTable){
+          this.$refs.leftUserTable.clearSelection();
+        }
+        this.userGetListLeft();
+      },
+      //重置
+      userResetQueryLeft(){
+        this.$set(this,'leftDateRange',[])
+        this.$set(this,'userQueryParamsLeft',{
+          pageNum:1,
+          pageSize:20,
+          searchValue:"",
+          deptId:"",
+          filtType:1
+        });
+        this.userHandleQueryLeft();
+      },
+      //查询接口
+      userGetListLeft(){
+        let self = this;
+        let leftObj = JSON.parse(JSON.stringify(this.userQueryParamsLeft));
+        leftObj.filtCheckUserIdList = [];
+        for(let i=0;i<self.dialogTableDataList.length;i++){
+          let obj = {
+            userId:self.dialogTableDataList[i].userId,
+            subjectId:self.dialogTableDataList[i].subId
+          }
+          leftObj.filtCheckUserIdList.push(obj)
+        }
+        if(this.leftDateRange[0]){
+          leftObj.beginTime = this.leftDateRange[0]
+        }else{
+          leftObj.beginTime = ""
+        }
+        if(this.leftDateRange[1]){
+          leftObj.endTime = this.leftDateRange[1]
+        }else{
+          leftObj.endTime = ""
+        }
+        checkStaffUserList(leftObj).then(response => {
+          this.userTotalLeft = response.data.total;
+          this.userTableListLeft = response.data.records;
+        });
+      },
+      //查询
+      userHandleQueryRight(){
+        this.$set(this.userQueryParamsRight,'pageNum',1);
+        this.$set(this,'userNumRight',0);
+        this.$set(this,'userIdsRight',[]);
+        if(this.$refs.rightUserTable){
+          this.$refs.rightUserTable.clearSelection();
+        }
+        this.userGetListRight();
+      },
+      //重置
+      userResetQueryRight(){
+        this.$set(this,'rightDateRange',[])
+        this.$set(this,'userQueryParamsRight',{
+          pageNum:1,
+          pageSize:20,
+          deptId:"",
+          searchValue:"",
+          filtType:2
+        });
+        this.userHandleQueryRight();
+      },
+      //查询接口
+      userGetListRight(){
+        let self = this;
+        let rightObj = JSON.parse(JSON.stringify(this.userQueryParamsRight));
+        rightObj.notFiltCheckUserIdList = [];
+        for(let i=0;i<self.dialogTableDataList.length;i++){
+          let obj = {
+            userId:self.dialogTableDataList[i].userId,
+            subjectId:self.dialogTableDataList[i].subId
+          }
+          rightObj.notFiltCheckUserIdList.push(obj)
+        }
+
+        if(this.rightDateRange[0]){
+          rightObj.beginTime = this.rightDateRange[0]
+        }else{
+          rightObj.beginTime = ""
+        }
+        if(this.rightDateRange[1]){
+          rightObj.endTime = this.rightDateRange[1]
+        }else{
+          rightObj.endTime = ""
+        }
+        checkStaffUserList(rightObj).then(response => {
+          this.userTotalRight = response.data.total;
+          this.userTableListRight = response.data.records;
+        });
+      },
+      //穿梭按钮
+      userArrowButton(type){
+        let self = this;
+        if(type == 1){
+          //右至左
+          if(this.$refs.rightUserTable.selection[0]){
+            let list = JSON.parse(JSON.stringify(this.dialogTableDataList));
+            let userIdsRight = JSON.parse(JSON.stringify(this.$refs.rightUserTable.selection))
+            for(let i=0;i<userIdsRight.length;i++){
+              for(let s=0;s<list.length;s++){
+                if(userIdsRight[i].userId == list[s].userId && userIdsRight[i].subjectId == list[s].subId){
+                  list.splice(s,1);
+                  s--
+                }
+              }
+            }
+            this.$set(this,'dialogTableDataList',list);
+            this.$refs.rightUserTable.clearSelection();
+            this.userHandleQueryLeft();
+            this.userHandleQueryRight();
+          }else{
+            this.msgError('请先勾选右侧列表')
+          }
+        }else if(type == 2){
+          //左至右
+          if(this.$refs.leftUserTable.selection[0]){
+            let list = JSON.parse(JSON.stringify(this.dialogTableDataList));
+            let userIdsLeft = JSON.parse(JSON.stringify(this.$refs.leftUserTable.selection))
+            console.log('userIdsLeft',userIdsLeft)
+            for(let i=0;i<userIdsLeft.length;i++){
+              let obj = {
+                subId:userIdsLeft[i].subjectId,
+                subName:userIdsLeft[i].subjectName,
+                subRom:userIdsLeft[i].roomNum,
+                deptId:userIdsLeft[i].deptId,
+                deptName:userIdsLeft[i].deptName,
+                userId:userIdsLeft[i].userId,
+                nickName:userIdsLeft[i].userName,
+                userNumber:userIdsLeft[i].userNumber,
+                phonenumber:userIdsLeft[i].phonenumber,
+                validBeginTime:userIdsLeft[i].validBeginTime,
+                validEndTime:userIdsLeft[i].validEndTime,
+              }
+              list.push(obj);
+            }
+            this.$set(this,'dialogTableDataList',list);
+            this.$refs.leftUserTable.clearSelection();
+            this.userHandleQueryLeft();
+            this.userHandleQueryRight();
+          }else{
+            this.msgError('请先勾选左侧列表')
+          }
+        }
+      },
+      /*===记录勾选数据===
+        需要再el-table 添加  :row-key="getRowKeys"
+        需要在selection 添加 :reserve-selection="true"
+      */
+      getRowKeys(row) {
+        return row.id
+      },
+      userChangeLeft(selection){
+        this.userNumLeft = selection.length;
+        this.userIdsLeft = selection.map(item => item.userId);
+      },
+      userChangeRight(selection){
+        this.userNumRight = selection.length;
+        this.userIdsRight = selection.map(item => item.userId);
+      },
+      //获取学院列表
+      listDepartments(){
+        listDepartments().then(response => {
+          this.deptSelectList = response.data;
+        });
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .configDialog{
+    overflow: hidden;
+    .configDialog-box{
+      height:600px;
+      display: flex;
+      flex-direction: column;
+      overflow: hidden;
+      .configDialog-content-box{
+        flex:1;
+        padding:0 70px;
+        .configDialog-content-min-box{
+          height:160px;
+          border-radius:4px;
+          border: 1px solid #F5F5F5;
+          padding:0 30px;
+          position: relative;
+          .configDialog-content-min-title{
+            margin-top:19px;
+            margin-bottom:32px;
+            line-height:20px;
+            font-size:14px;
+            color:#333;
+          }
+          .configDialog-content-min-checkbox{
+
+          }
+          .configDialog-content-min-button{
+            position: absolute;
+            top:65px;
+            right:205px;
+            background-color: #0045AF;
+            width:70px;
+            height:30px;
+            line-height:30px;
+            text-align: center;
+            color:#fff;
+            border-radius:4px;
+            cursor: pointer;
+          }
+          .configDialog-content-min-text-box{
+            display: flex;
+            margin-top:15px;
+            p{
+              width:240px;
+              color:#999999;
+            }
+          }
+        }
+      }
+      .dialog-footer-box{
+        display: flex;
+      }
+    }
+    .configDialog-user-box{
+      height:600px;
+      display: flex;
+      flex-direction: column;
+      overflow: hidden;
+      .configDialog-user-content-box{
+        flex:1;
+        display: flex;
+        overflow: hidden;
+        .dept-table-title-box{
+          display: flex;
+          padding:0 20px;
+          background: rgba(1,131,250,0.1);
+          p{
+            flex:1;
+            color:#0183FA;
+            font-size:16px;
+            line-height:40px;
+          }
+          p:nth-child(1){
+            text-align: left;
+          }
+          p:nth-child(2){
+            text-align: right;
+          }
+        }
+        .dept-table-max-box{
+          border: 1px solid #e0e0e0;
+          flex:1;
+          display: flex;
+          flex-direction: column;
+          overflow: hidden;
+          padding:20px;
+          .form-index{
+            .el-input__inner{
+              border-right:none;
+              padding-right:0;
+            }
+            .el-input-group__append{
+              background: #fff;
+              cursor: pointer;
+              padding:0 10px;
+            }
+          }
+          input{
+            border: 1px solid #DCDFE6;
+          }
+        }
+        .left-max-box{
+          height:550px;
+          display: flex;
+          flex-direction: column;
+          overflow: hidden;
+          width:639px;
+        }
+        .right-max-box{
+          height:550px;
+          display: flex;
+          flex-direction: column;
+          overflow: hidden;
+          width:639px;
+        }
+        .center-box{
+          width:60px;
+          p{
+            display: block;
+            border-radius:50%;
+            width:30px;
+            height:30px;
+            line-height:30px;
+            text-align: center;
+            background: rgba(245,245,245,1);
+            color:rgba(62,62,62,1);
+            cursor: pointer;
+            font-size:16px;
+          }
+          p:nth-child(1){
+            margin:270px 16px 0;
+          }
+          p:nth-child(2){
+            margin:14px 16px 0;
+          }
+          p:hover{
+            color:#fff;
+            background: #0183fa;
+          }
+        }
+        ::v-deep .el-range-editor--small .el-range__icon{
+          display: none;
+        }
+        ::v-deep .el-range-editor--small .el-range__close-icon{
+          display: none;
+        }
+        ::v-deep .el-date-editor .el-range-input{
+          width:45%;
+        }
+        ::v-deep .el-range-editor--small .el-range-separator{
+          line-height:30px;
+        }
+        ::v-deep .el-input-group__append, .el-input-group__prepend{
+          background-color: #fff;
+        }
+        .form-index{
+          ::v-deep .el-input--medium .el-input__inner{
+            border:1px solid #DCDFE6;
+            border-right:none;
+            padding-right:0;
+          }
+          ::v-deep .el-input-group__append{
+            padding:0 10px;
+            cursor: pointer;
+          }
+        }
+      }
+      .dialog-footer-box{
+        display: flex;
+      }
+    }
+    ::v-deep .el-dialog__body{
+      padding: 30px 20px!important;
+    }
+  }
+</style>

src/views/safetyCheck/checkConfiguration/index.vue

@@ -0,0 +1,92 @@
+<template>
+  <div class="app-container checkConfiguration">
+    <div class="checkConfiguration-title-box">
+      <div :class="buttonType==1?'check-box':''" @click="buttonTitleClick(1)">
+        <p>检查人员</p>
+        <p></p>
+      </div>
+      <div :class="buttonType==2?'check-box':''" @click="buttonTitleClick(2)">
+        <p>整改人员</p>
+        <p></p>
+      </div>
+    </div>
+    <checkUserPage v-if="buttonType==1"></checkUserPage>
+    <rectificationUserPage v-if="buttonType==2"></rectificationUserPage>
+  </div>
+</template>
+
+<script>
+  import checkUserPage from './checkUserPage.vue'
+  import rectificationUserPage from './rectificationUserPage.vue'
+  export default {
+    name: 'index',
+    components: {
+      checkUserPage,
+      rectificationUserPage,
+    },
+    data(){
+      return{
+        buttonType:1,
+      }
+    },
+    created(){
+
+    },
+    mounted(){
+
+    },
+    methods:{
+      //页面切换
+      buttonTitleClick(type){
+        if(this.buttonType != type){
+          this.$set(this,'buttonType',type)
+        }
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .checkConfiguration{
+    flex:1;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden!important;
+    *{
+      font-weight:500;
+    }
+    .checkConfiguration-title-box{
+      padding:0 20px;
+      display: flex;
+      border-bottom:1px solid #E0E0E0;
+      div{
+        height:80px;
+        margin-right:40px;
+        cursor: pointer;
+        p:nth-child(1){
+          width:80px;
+          font-size:16px;
+          text-align: center;
+          color:#333;
+          line-height:40px;
+          height:40px;
+          margin-top:20px;
+        }
+        p:nth-child(2){
+          width:60px;
+          height: 4px;
+          border-radius:4px;
+          margin:0 10px;
+        }
+      }
+      .check-box{
+        p:nth-child(1){
+          color:#0045AF;
+        }
+        p:nth-child(2){
+          background-color: #0045AF;
+        }
+      }
+    }
+  }
+</style>

src/views/safetyCheck/checkConfiguration/rectificationUserPage.vue

@@ -0,0 +1,143 @@
+<template>
+  <div class="rectificationUserPage">
+    <el-form :model="queryParams" class="form-box" ref="queryForm" :inline="true">
+      <el-form-item label="关键字" prop="searchValue" label-width="80px">
+        <el-input
+          maxLength="30"
+          v-model="queryParams.searchValue"
+          placeholder="实验室/房间号/姓名"
+          clearable
+          style="width: 200px"/>
+      </el-form-item>
+      <el-form-item label="学院" prop="deptId" label-width="50px">
+        <el-select v-model="queryParams.deptId" clearable placeholder="请选择学院">
+          <el-option
+            v-for="item in deptSelectList"
+            :key="item.deptId"
+            :label="item.deptName"
+            :value="item.deptId">
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item>
+        <p class="inquire-button-one" @click="handleQuery" style="margin-right:10px;">查询</p>
+        <p class="reset-button-one" @click="resetQuery">重置</p>
+      </el-form-item>
+      <el-form-item style="float: right;" v-hasPermi="['check:set:query']">
+        <el-col :span="1.5">
+          <p class="inquire-button-one"
+             style="width:100px;"
+             @click="configButton(1)"
+          >整改者配置</p>
+        </el-col>
+      </el-form-item>
+    </el-form>
+    <el-table  border :data="tableList" ref="multipleTable">
+      <el-table-column label="序号" align="center"  type="index" width="60" />
+      <el-table-column label="实验室" align="center" prop="subName" show-overflow-tooltip/>
+      <el-table-column label="学院" align="center" prop="deptName" show-overflow-tooltip width="300"/>
+      <el-table-column label="整改人" align="center" prop="nickNames" show-overflow-tooltip width="500"/>
+      <el-table-column label="操作人" align="center" prop="createName" show-overflow-tooltip width="200"/>
+      <!--<el-table-column label="操作时间" align="center" prop="createTime" show-overflow-tooltip width="300"/>-->
+    </el-table>
+    <pagination :page-sizes="[20, 30, 40, 50]"
+                v-show="total>0"
+                :total="total"
+                :page.sync="queryParams.pageNum"
+                :limit.sync="queryParams.pageSize"
+                @pagination="getList"
+    />
+    <configDialog v-if="configDialogType" :configDialogData="queryParams"></configDialog>
+  </div>
+</template>
+
+<script>
+  import { listDepartments } from "@/apiDemo/system/dept";
+  import { checkStaffList } from '@/apiDemo/safetyCheck/index'
+  import configDialog from './configDialog.vue'
+  export default {
+    name: 'rectificationUserPage',
+    components: {
+      configDialog
+    },
+    data(){
+      return{
+        // 组件数据
+        configDialogType:false,
+        configDialogData:{
+          configType:2,//1.检查人员配置 2.整改人员配置
+        },
+        //查询数据
+        deptSelectList:[],
+        queryParams:{
+          pageNum:1,
+          staffType:2,
+          pageSize:20,
+          searchValue:"",
+          deptId:""
+        },
+        tableList:[],
+        total:0,
+      }
+    },
+    created(){
+
+    },
+    mounted(){
+      this.listDepartments();
+      this.getList();
+    },
+    methods:{
+      //配置按钮
+      configButton(type){
+        if(type == 1){
+          this.$set(this,'configDialogType',true);
+        }else if(type == 2){
+          this.$set(this,'configDialogType',false);
+        }else if(type == 3){
+          this.getList();
+          this.$set(this,'configDialogType',false);
+        }
+      },
+      //获取数据列表
+      getList(){
+        checkStaffList(this.queryParams).then(response => {
+          this.total = response.data.total;
+          this.tableList = response.data.records;
+        });
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.$set(this.queryParams,'pageNum',1);
+        this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.$set(this,'queryParams',{
+          pageNum:1,
+          staffType:2,
+          pageSize:20,
+          searchValue:"",
+          deptId:""
+        });
+        this.handleQuery();
+      },
+      //获取学院列表
+      listDepartments(){
+        listDepartments().then(response => {
+          this.deptSelectList = response.data;
+        });
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .rectificationUserPage{
+    padding:20px;
+    flex:1;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+  }
+</style>

src/views/safetyCheck/checkItemLibrary/index.vue

@@ -0,0 +1,839 @@
+<!--检查项目库-->
+<template>
+  <div class="app-container checkItemLibrary">
+    <div class="title-box">
+      <el-form class="form-box" :model="queryParams" ref="examineForm" :inline="true" label-width="80px">
+        <el-form-item label="关键字" prop="name">
+          <el-input
+            maxlength="10"
+            v-model="queryParams.searchValue"
+            placeholder="序号/检查项目/检查要点"
+            clearable
+            size="small"/>
+        </el-form-item>
+        <el-form-item>
+          <p class="inquire-button-one" @click="onSearch">查询</p>
+          <p class="reset-button-one" @click="resetForm">重置</p>
+        </el-form-item>
+        <el-form-item style="float: right;" v-hasPermi="['check:option:add']">
+          <p class="inquire-button-one" style="width:80px;" @click="addDialogOpen(1)">+ 添加</p>
+        </el-form-item>
+        <el-form-item style="float: right;" v-hasPermi="['check:option:remove']">
+          <p class="add-button-two-90" style="width:100px;" @click="allDel">批量删除</p>
+        </el-form-item>
+        <el-form-item style="float: right;" v-hasPermi="['check:option:export']">
+          <export-component :exportConfig="exportConfig"></export-component>
+        </el-form-item>
+        <el-form-item style="float: right;" v-hasPermi="['check:option:import']">
+          <import-component :importConfig="importConfig"></import-component>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div class="content-box">
+      <el-table border
+                :data="tableData"
+                ref="multipleTable" :row-key="getRowKeys"
+                default-expand-all
+                :select-on-indeterminate="false"
+                @select="select"
+                @select-all="selectAll"
+                :tree-props="{children: 'children', hasChildren: 'hasChildren'}">
+        <el-table-column type="selection" width="50" align="center"/>
+        <el-table-column label="序号" prop="code" width="240"/>
+        <el-table-column label="检查项目" prop="name"/>
+<!--        <el-table-column label="检查要点" prop="mainPoint" width="700" show-overflow-tooltip/>-->
+        <el-table-column label="操作" width="180">
+          <template slot-scope="scope">
+            <div class="table-button-box">
+              <p class="table-button-null"></p>
+              <p class="table-button-p" v-if="scope.row.level != 4" v-hasPermi="['check:option:add']"
+                 @click="addDialogOpen(2,scope.row)">新增</p>
+              <p class="table-button-p" @click="addDialogOpen(3,scope.row)" v-hasPermi="['check:option:edit']">编辑</p>
+              <p class="table-button-p" @click="delItem(scope.row)" v-hasPermi="['check:option:remove']">删除</p>
+              <p class="table-button-null"></p>
+            </div>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <!--添加窗口-->
+    <el-dialog :title="addDialogTitle" :visible.sync="addDialogType" v-if="addDialogType" @close="addDialogOff" width="780px" append-to-body class="checkItemLibrary-dialog-box"
+               :close-on-click-modal="false">
+      <el-form ref="addDialogForm" :model="addDialogForm" :rules="rules" label-width="120px">
+        <el-form-item label="上级指标" prop="parentId">
+          <el-cascader
+            style="width:548px;"
+            v-model="addDialogForm.parentId"
+            :options="cascaderData"
+            :props="{ checkStrictly: true, value: 'id', label: 'labelName',emitPath:false }"
+            @change="cascaderCheck">
+            <template slot-scope="{data}">
+              <el-tooltip :content="data.labelName" v-if="data.labelName.length>22">
+                <p style="max-width:300px;overflow: hidden;text-overflow:ellipsis;white-space:nowrap;">{{data.labelName}}</p>
+              </el-tooltip>
+              <p v-else style="max-width:300px;overflow: hidden;text-overflow:ellipsis;white-space:nowrap;">{{data.labelName}}</p>
+            </template>
+          </el-cascader>
+        </el-form-item>
+        <el-form-item label="添加序号" prop="code">
+          <div class="code-max-box">
+            <el-input v-model="addDialogForm.code" placeholder="未选择指标"
+                      maxLength="6" disabled style="width:500px;"/>
+            <div class="code-button-box">
+              <p class="el-icon-arrow-up" @click="codeButton(1)"></p>
+              <p class="el-icon-arrow-down" @click="codeButton(2)"></p>
+            </div>
+          </div>
+        </el-form-item>
+        <el-form-item label="检查项目" prop="name">
+          <el-input
+            type="textarea"
+            :autosize="{ minRows: 5, maxRows: 5}"
+            placeholder="请输入检查项目内容"
+            v-model="addDialogForm.name"
+            maxlength="200"
+            resize="none"
+            show-word-limit
+            style="width:548px;">
+          </el-input>
+        </el-form-item>
+<!--        <el-form-item label="检查要点" prop="mainPoint" v-if="addDialogLevel>1">-->
+<!--          <el-input-->
+<!--            type="textarea"-->
+<!--            :autosize="{ minRows: 8, maxRows: 8}"-->
+<!--            placeholder="请输入检查检查要点："-->
+<!--            v-model="addDialogForm.mainPoint"-->
+<!--            maxlength="300"-->
+<!--            resize="none"-->
+<!--            show-word-limit-->
+<!--            style="width:548px;">-->
+<!--          </el-input>-->
+<!--        </el-form-item>-->
+      </el-form>
+      <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="addDialogOff">取消</p>
+        <p class="dialog-footer-button-primary" @click="upDataButton">确定</p>
+        <p class="dialog-footer-button-null"></p>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+  import { checkOptionList,checkOptionAdd,checkOptionUpdate,checkOptionDelete,checkOptionBatchDelete } from '@/apiDemo/safetyCheck/index'
+  import { getToken } from "@/utils/auth";
+  //            V3
+  import exportComponent from "@/components/exportComponent/exportComponent.vue";
+  import importComponent from "@/components/importComponent/importComponent.vue";
+  export default {
+    name: 'index',
+    components: {
+      exportComponent,
+      importComponent,
+    },
+    data(){
+      return{
+        //导出
+        exportConfig:{
+          api:'/zd-security/checkOption/export/',             //导出接口地址
+          ids:'',                                       //勾选导出,勾选的IDS
+          fileName:'项目检查库',                         //导出文件的命名
+        },
+        //导入
+        importConfig:{
+          upLoadApi:'/zd-security/checkOption/importData',                //上传接口地址
+          downloadApi:'/zd-security/checkOption/importTemplate',          //下载模板接口地址
+          loseApi:'/zd-security/checkOption/importErrorData',             //失败报表接口地址
+          fileName:'导入模板-',                                   //下载模板命名
+        },
+        uploadImgUrl: window.location.href.split('://')[0]+'://' + this.judgmentNetworkReturnAddress() + "/zd-security/checkOption/importData", // 上传地址
+        headers: {
+          Authorization: "Bearer " + getToken(),
+        },
+        // 遮罩层
+        loading: false,
+        queryParams:{
+          searchValue:"",
+        },
+        //导入弹层开关
+        importOpen:false,
+        //导入数据
+        upImportData:{
+          sysUserEnable:true,
+          upDate:false,
+        },
+        getImportData:{
+          downFile:false,
+          successNum:0,
+          failureNum:0,
+          textName:"",
+        },
+        // 检查项选项表格数据
+        tableData: [],
+        cascaderData:[],
+        cascaderDataPrimitive:[],
+        total:0,
+        addDialogType:false,
+        addDialogTitle:null,
+        addDialogLevel:0,
+        addDialogForm:{
+          parentId:"",
+          code:"",
+          name:"",
+          mainPoint:"",
+        },
+        // 表单校验
+        rules: {
+          parentId: [
+            { required: true, message: "请选择上级指标", trigger: "change" },
+            { required: true, message: "请选择上级指标", validator: this.spaceJudgment, trigger: "change" },
+          ],
+          name: [
+            { required: true, message: "请输入检查项目内容", trigger: "change" },
+            { required: true, message: "请输入检查项目内容", validator: this.spaceJudgment, trigger: "change" },
+          ],
+        },
+        checkList:[],
+      }
+    },
+    created(){
+
+    },
+    mounted(){
+      this.getList();
+    },
+    methods:{
+      //确定按钮
+      upDataButton(){
+        this.$refs["addDialogForm"].validate(valid => {
+          if (valid) {
+            if(this.addDialogForm.id){
+              //编辑
+              let obj = JSON.parse(JSON.stringify(this.addDialogForm))
+              obj.level = this.addDialogLevel+1;
+              obj.mainPoint = this.addDialogLevel>1?obj.mainPoint:'';
+              checkOptionUpdate(obj).then( response => {
+                this.msgSuccess(response.msg)
+                this.addDialogOff();
+                this.getList();
+              })
+            }else{
+              //新增
+              let obj = JSON.parse(JSON.stringify(this.addDialogForm))
+              obj.level = this.addDialogLevel+1;
+              checkOptionAdd(obj).then( response => {
+                this.msgSuccess(response.msg)
+                this.addDialogOff();
+                this.getList();
+              })
+            }
+          }
+        })
+      },
+      //添加页面开启
+      addDialogOpen(type,row){
+        console.log('row',row)
+        if(type == 1){
+          //新增
+          this.$set(this,'addDialogTitle','添加检查项目');
+          this.$set(this,'addDialogLevel',0);
+          this.$set(this,'addDialogForm',{
+            parentId:"",
+            code:"",
+            name:"",
+            mainPoint:"",
+          });
+          this.$set(this,'addDialogType',true);
+        }else if(type == 2){
+          //列表新增
+          this.$set(this,'addDialogTitle','添加检查项目');
+          let obj = this.cascaderCheckData(row.id,this.cascaderDataPrimitive);
+          this.$set(this,'checkList',JSON.parse(JSON.stringify(row.children)));
+          this.$set(this,'addDialogLevel',obj.level);
+          this.$set(this,'addDialogForm',{
+            parentId:row.id,
+            code:obj.key,
+            name:"",
+            mainPoint:"",
+          });
+          this.$set(this,'addDialogType',true);
+        }else if(type == 3){
+          //编辑
+          this.$set(this,'addDialogTitle','编辑检查项目');
+          this.$set(this,'addDialogLevel',row.level-1);
+          this.$set(this,'addDialogForm',{
+            id:row.id,
+            parentId:row.parentId,
+            code:row.code,
+            name:row.name,
+            mainPoint:row.mainPoint,
+          });
+          this.getCodeButton(this.cascaderDataPrimitive,row.parentId,row.id);
+          this.$set(this,'addDialogType',true);
+        }
+      },
+      //添加页面关闭
+      addDialogOff(){
+        this.$set(this,'addDialogType',false);
+      },
+      //联级选中
+      cascaderCheck(val){
+        let obj = this.cascaderCheckData(val,this.cascaderDataPrimitive);
+        this.$set(this.addDialogForm,'code',obj.key);
+        this.getCodeButton(this.cascaderDataPrimitive,obj.parentId,val);
+        this.$set(this,'addDialogLevel',obj.level);
+      },
+      //序号自增
+      cascaderCheckData(val,list){
+        let self = this;
+        for(let i=0;i<list.length;i++){
+          if(list[i].id == val){
+            let obj = {
+              parentId:list[i].id,
+              parentKey:list[i].code,
+              level:list[i].level,
+              key:'',
+            }
+            if(list[i].children){
+              if(list[i].children[0]){
+                obj.key = list[i].code ? list[i].code + '.' + self.getListKey(list[i].children) : self.getListKey(list[i].children)
+              }else{
+                obj.key = list[i].code ? list[i].code+'.1':'1'
+              }
+            }else{
+              obj.key = list[i].code ? list[i].code+'.1':'1'
+            }
+            return obj
+          }else{
+            if (list[i].level<3){
+              if(list[i].children){
+                if(list[i].children[0]){
+                  let obj = self.cascaderCheckData(val,list[i].children);
+                  if(obj){
+                    return obj
+                  }
+                }
+              }
+            }
+          }
+        }
+      },
+      //自动补位计算
+      getListKey(dataList){
+        let num = 0;
+        for(let i=0;i<dataList.length;i++){
+          let list = dataList[i].code.split('.');
+          if(num === 0 && parseInt(list[list.length-1]) !== 1){
+            return 1
+          }else{
+            if(num+1 === parseInt(list[list.length-1])){
+              num = parseInt(list[list.length-1]);
+            }else{
+              return num+1
+            }
+          }
+        }
+        return num+1
+      },
+      //序号调整按钮
+      codeButton(type){
+        let obj = this.getListCode(this.addDialogForm.code,type,this.checkList);
+        if(obj.type){
+          this.$set(this.addDialogForm,'code',obj.value);
+        }
+      },
+      getListCode(code,type,list){
+        let codeList = code.split('.');
+        let codeNum = parseInt(codeList[codeList.length-1]);
+        let codeText = '';
+        let obj = {type:false,value:""}
+        if(!list[0]){
+          return obj
+        }
+        if(type == 1){
+          if(codeNum==1 || !list[0]){
+            return obj
+          }
+        }else if(type == 2){
+          let maxList = list[list.length-1].code.split('.')
+          let maxCode = parseInt(maxList[maxList.length-1]);
+          if(codeNum > maxCode){
+            return obj
+          }
+        }
+        for(let i=0;i<codeList.length-1;i++){
+          if(i===0){
+            codeText = codeText + codeList[i]
+          }else{
+            codeText = codeText +'.'+ codeList[i]
+          }
+        }
+        let age = parseInt(codeNum);
+        if(type == 1){
+          age--
+          for(age;age>0;age--){
+            let counter = 0;
+            for(let o=0;o<list.length;o++){
+              let codeList = list[o].code.split('.');
+              let code = parseInt(codeList[codeList.length-1]);
+              if(code == age){
+                counter++
+              }
+            }
+            if(counter == 0){
+              return {
+                type:true,
+                value:codeText?codeText+'.'+age:age+''
+              }
+            }
+          }
+          return obj;
+        }else if(type == 2){
+          age++
+          for(age;age<999;age++){
+            let counter = 0;
+            for(let o=0;o<list.length;o++){
+              let codeList = list[o].code.split('.');
+              let code = parseInt(codeList[codeList.length-1]);
+              if(code == age){
+                counter++
+              }
+            }
+            if(counter == 0){
+              return {
+                type:true,
+                value:codeText?codeText+'.'+age:age+''
+              }
+            }
+          }
+          return obj;
+        }
+      },
+      //选中同级数据
+      getCodeButton(list,parentId,id){
+        let self = this;
+        for(let i=0;i<list.length;i++){
+          if(list[i].id == parentId){
+            if(list[i].children){
+              let newList = JSON.parse(JSON.stringify(list[i].children))
+              for(let o=0;o<newList.length;o++){
+                if(newList[o].id == id){
+                  newList.splice(o,1)
+                }
+              }
+              this.$set(this,'checkList',newList);
+              return
+            }
+          }else{
+            if (list[i].level<3){
+              if(list[i].children){
+                if(list[i].children[0]){
+                  self.getCodeButton(list[i].children,parentId,id)
+                }
+              }
+            }
+          }
+        }
+      },
+      //删除
+      delItem(row){
+        let self = this;
+        this.$confirm('是否确认删除?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(function() {
+          checkOptionDelete(row.id).then( response => {
+            self.msgSuccess(response.msg)
+            self.getList();
+          })
+        }).then(() => {
+        }).catch(() => {});
+      },
+      //批量删除
+      allDel(){
+        let self = this;
+        if(!this.$refs.multipleTable.selection[0]){
+          this.msgError('请勾选数据')
+          return
+        }
+        this.$confirm('是否确认删除?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(function() {
+          let list = self.$refs.multipleTable.selection;
+          let ids = [];
+          for(let i=0;i<list.length;i++){
+            ids.push(list[i].id)
+          }
+          checkOptionBatchDelete(ids+'').then( response => {
+            self.msgSuccess(response.msg);
+            self.getList();
+          })
+        }).then(() => {
+        }).catch(() => {});
+      },
+      /** 查询检查项选项列表 */
+      getList() {
+        this.loading = true;
+        checkOptionList(this.queryParams).then( response => {
+          this.$set(this,'tableData',JSON.parse(JSON.stringify(response.data)));
+          let list = [{
+            id:'0',
+            name:"最上级",
+            code:false,
+            level:0,
+            children:JSON.parse(JSON.stringify(response.data)),
+          }]
+          this.$set(this,'cascaderData',list);
+          this.$set(this,'cascaderDataPrimitive',JSON.parse(JSON.stringify(list)));
+          this.getCascaderData(this.cascaderData);
+          this.$set(this,'total',response.total);
+          this.loading = false;
+        });
+      },
+      //联级选择器数据处理
+      getCascaderData(list){
+        let self = this;
+        for(let i=0;i<list.length;i++){
+          list[i].labelName = list[i].code? list[i].code +' '+ list[i].name:list[i].name
+          if(list[i].level == 0 || list[i].level == 1 || list[i].level == 2){
+            self.getCascaderData(list[i].children)
+          }else{
+            delete list[i].children
+          }
+        }
+      },
+      //查询
+      onSearch() {
+        this.getList();
+      },
+      //重置
+      resetForm() {
+        this.$set(this.queryParams,'searchValue',null);
+        this.$set(this,'total',0);
+        this.onSearch();
+      },
+      //****************************************导入功能**************************************
+      handleAvatarSuccess(res, file) {
+        if(res.code == 200){
+          this.getImportData.downFile = true
+          this.getImportData.successNum = res.data.successNum
+          this.getImportData.failureNum = res.data.failureNum
+          // this.importOpen = false;
+          // this.getList();
+        }else{
+          this.msgError(res.msg);
+        }
+        this.loading = false;
+      },
+      beforeAvatarUpload(file) {
+        let type = false;
+        console.log('file',file);
+        if (file.type == 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' || file.type == 'application/vnd.ms-excel') {
+          if(file.size> 5250000){
+            this.msgError('上传大小不能超过5M')
+            return false
+          }
+          this.getImportData.textName = file.name;
+          type = true;
+          this.loading = true;
+        }else{
+          this.$message.error('只能上传xls/xlsx格式文件');
+          type = false;
+        }
+        return type;
+      },
+      //导入页面关闭
+      importOpenOff(){
+        this.importOpen = false;
+        this.getImportData.downFile = false;
+        this.getImportData.successNum = 0;
+        this.getImportData.failureNum = 0;
+        this.getImportData.textName = "";
+      },
+      /** 导入按钮操作 */
+      importButton(item){
+        if(item.command == 1){
+          //  下载模板
+          this.download('/zd-security/checkOption/importTemplate', {}, `项目检查库批量导入模板.xlsx`)
+        }else if(item.command == 2){
+          //  导入数据
+          console.log('导入数据');
+          this.importOpen = true;
+        }
+      },
+      /** 当前时间 */
+      getCurrentTime () {
+        const yy = new Date().getFullYear()
+        const mm = new Date().getMonth() + 1
+        const dd = new Date().getDate()
+        const hh = new Date().getHours()
+        const mf = new Date().getMinutes() < 10 ? '0' + new Date().getMinutes() : new Date().getMinutes()
+        const ss = new Date().getSeconds() < 10 ? '0' + new Date().getSeconds() : new Date().getSeconds()
+        return yy + '-' + mm + '-' + dd
+      },
+      /** 导出按钮操作 */
+      exportButton(item) {
+        let self = this;
+        this.currentDate=this.getCurrentTime()
+
+        if(item.command == 1){
+          self.$confirm(`确认导出全部数据?`, "提示", {
+            confirmButtonText: "确定",
+            cancelButtonText: "取消",
+            type: "warning"
+          }).then(async () => {
+            self.download('/zd-security/checkOption/export/', {...self.queryParams}, '项目检查库.xlsx')
+          }).catch(() => {})
+        }else if(item.command == 2){
+          let list = self.$refs.multipleTable.selection;
+          let ids = [];
+          for(let i=0;i<list.length;i++){
+            ids.push(list[i].id)
+          }
+          if(ids.length>0) {
+            self.$confirm(`确认导出选中数据?`, "提示", {
+              confirmButtonText: "确定",
+              cancelButtonText: "取消",
+              type: "warning"
+            }).then(async () => {
+              let obj = {
+                ids :ids.join(',')
+              }
+              self.download(`/zd-security/checkOption/export/`,obj, '项目检查库.xlsx')
+              this.$refs.multipleTable.clearSelection();
+            }).catch(() => {})
+          }else {
+            this.msgError('请选择要导出的数据')
+          }
+        }
+      },
+      /** 下载模板操作 */
+      importTemplate() {
+        this.download('/zd-security/checkOption/importTemplate', {}, `项目检查库批量导入模板.xlsx`)
+      },
+      /*下载失败列表*/
+      failureExcel(){
+        this.download('/zd-security/checkOption/importErrorData', {}, `项目检查库批量导入失败报表.xlsx`)
+      },
+      /*===记录勾选数据===
+        需要再el-table 添加  :row-key="getRowKeys"
+        需要在selection 添加 :reserve-selection="true"
+      */
+      getRowKeys(row) {
+        return row.id
+      },
+      // 单选
+      select (selection, row) {
+        if (selection.some(el => { return row.id === el.id })) {
+          if (row.children) {
+            this.setChildren(row.children, true)
+          }
+        } else {
+          if (row.children) {
+            this.setChildren(row.children, false)
+          }
+        }
+      },
+      // 全选
+      selectAll (selection) {
+        const isSelect = selection.some(el => {
+          const tableDataIds = this.tableData.map(j => j.id)
+          return tableDataIds.includes(el.id)
+        })
+        const isCancel = !this.tableData.every(el => {
+          const selectIds = selection.map(j => j.id)
+          return selectIds.includes(el.id)
+        })
+        if (isSelect) {
+          selection.map(el => {
+            if (el.children) {
+              this.setChildren(el.children, true)
+            }
+          })
+        }
+        if (isCancel) {
+          this.tableData.map(el => {
+            if (el.children) {
+              this.setChildren(el.children, false)
+            }
+          })
+        }
+      },
+      setChildren (children, type) {
+        children.map(j => {
+          this.toggleSelection(j, type)
+          if (j.children) {
+            this.setChildren(j.children, type)
+          }
+        })
+      },
+      toggleSelection (row, select) {
+        if (row) {
+          this.$nextTick(() => {
+            this.$refs.multipleTable && this.$refs.multipleTable.toggleRowSelection(row, select)
+          })
+        }
+      },
+    },
+  }
+</script>
+
+<style scoped lang="scss">
+  .checkItemLibrary{
+    flex:1;
+    display: flex!important;
+    flex-direction: column;
+    overflow: hidden;
+    .title-box{
+      padding-top:20px;
+      .form-box{
+        border-bottom:1px solid #E0E0E0;
+        .form-dropdown-box{
+          display: flex;
+          margin:0;
+          padding:0 10px;
+          cursor: pointer;
+          height:40px;
+          img:nth-child(1){
+            width:16px;
+            height:16px;
+            margin-top:12px;
+          }
+          p{
+            width:47px;
+            text-align: center;
+            font-size:14px;
+            margin:0;
+            line-height:40px;
+          }
+          img:nth-child(3){
+            width:10px;
+            height:6px;
+            margin-top:17px;
+          }
+        }
+      }
+    }
+    .content-box{
+      flex:1;
+      overflow: hidden;
+      display: flex;
+      flex-direction: column;
+      padding:20px;
+    }
+  }
+</style>
+<style lang="scss">
+  .checkItemLibrary-dialog-box{
+    .teacher-import-dialog-upLoad-box{
+      .el-upload{
+        width:450px;
+        margin:0 55px;
+        .el-upload-dragger{
+          width:450px;
+          .el-icon-upload{
+            font-size:100px;
+            color:#CBE6FE;
+          }
+          .el-upload__text{
+            margin-top:20px;
+          }
+        }
+      }
+      .el-upload__tip{
+        margin-left:60px;
+        font-size:14px;
+        margin-top:10px;
+      }
+      .el-upload-text-box{
+        background: #F5F5F5;
+        border-radius: 10px;
+        margin:15px 30px 0;
+        padding:0 20px 15px;
+        overflow: hidden;
+        *{
+          margin:0;
+        }
+        .img-text-box{
+          display: flex;
+          margin-top:15px;
+          img{
+            width:16px;
+            height:16px;
+            margin-right:13px;
+          }
+          p{
+            height:16px;
+            line-height:16px;
+            font-size:12px;
+          }
+        }
+        .text-p{
+          margin-top:15px;
+          margin-left:29px;
+          height:16px;
+          line-height:16px;
+          font-size:12px;
+        }
+      }
+    }
+    .teacher-import-dialog-button-box{
+      display: flex;
+      width:190px;
+      margin:0 auto;
+      p{
+        width:70px;
+        height:30px;
+        line-height:30px;
+        font-size:14px;
+        margin:0 auto;
+      }
+    }
+    .teacher-import-dialog-position-box{
+      width:100%;
+      height:100%;
+      position: absolute;
+      top:0;
+      left:0;
+      z-index: 999;
+      background: rgba(255,255,255,0.4);
+      border-radius:20px;
+    }
+    .code-max-box{
+      display: flex;
+      .code-button-box{
+        display: flex;
+        flex-direction: column;
+        margin-left:8px;
+        p{
+          width:40px;
+          text-align: center;
+          line-height:19px;
+          font-size:14px;
+          cursor: pointer;
+          color:#d8d8d8;
+        }
+        p:nth-child(1){
+          border:1px solid #d8d8d8;
+          border-top-left-radius: 4px;
+          border-top-right-radius: 4px;
+        }
+        p:nth-child(2){
+          border-bottom:1px solid #d8d8d8;
+          border-left:1px solid #d8d8d8;
+          border-right:1px solid #d8d8d8;
+          border-bottom-left-radius: 4px;
+          border-bottom-right-radius: 4px;
+        }
+        p:hover{
+          color:#fff;
+          background-color: #d8d8d8;
+        }
+      }
+    }
+  }
+</style>

src/views/safetyCheck/components/addPage/addPage.vue

@@ -0,0 +1,954 @@
+<template>
+  <div class="inspectionManagement-addPage" v-loading.fullscreen.lock="loading">
+    <div class="title-max-box">
+      <p class="title-p">{{addPageTitle}}</p>
+      <p class="title-button add-button-one-90" @click="outButton">返回</p>
+      <img class="position-img" v-if="addForm.checkRange == 1" src="@/assets/ZDimages/safetyCheck/icon_xyxc_qx.png">
+      <img class="position-img" v-if="addForm.checkRange == 2" src="@/assets/ZDimages/safetyCheck/icon_xyxc_xy.png">
+      <img class="position-img" v-if="addForm.checkRange == 3" src="@/assets/ZDimages/safetyCheck/icon_xyxc_sys.png">
+    </div>
+    <div class="content-max-box scrollbar-box">
+      <el-form ref="addForm" :model="addForm" :rules="rules" label-width="82px">
+        <div class="top-form-box">
+          <div class="top-form-left-box">
+            <el-form-item label="计划标题" prop="title">
+              <el-input disabled v-model="addForm.title" placeholder="未填写" style="width: 690px"/>
+            </el-form-item>
+            <div style="display: flex">
+              <el-form-item label="学院" prop="collegeName">
+                <el-input disabled v-model="addForm.collegeName" placeholder="未填写" style="width: 300px"/>
+              </el-form-item>
+              <el-form-item label="实验室" prop="subjectName" label-width="110px">
+                <el-input disabled v-model="addForm.roomNumber?addForm.subjectName+'-'+addForm.roomNumber:addForm.subjectName" placeholder="未填写" style="width: 280px"/>
+              </el-form-item>
+            </div>
+            <el-form-item label="检查要求" prop="checkDemand">
+              <p style="background-color: #f5f5f5;color:#333;border-radius:4px;width:690px;padding:10px 15px;font-size:14px;line-height:20px;min-height:40px;">{{addForm.checkDemand}}<span v-if="!addForm.checkDemand" style="color:#999;">未输入</span></p>
+            </el-form-item>
+            <el-form-item label="检查类型" prop="checkCategory">
+              <p style="background-color: #f5f5f5;width:690px;padding:0 15px;line-height:40px;border-radius:4px;">{{addForm.checkCategory==1?'综合检查':(addForm.checkCategory==2?'专项检查':'')}}</p>
+            </el-form-item>
+            <el-form-item label="检查结果" prop="checkResult" v-if="addForm.checkCategory==1">
+              <el-select v-model="addForm.checkResult" @change="checkResultChange" placeholder="请选择检查结果" style="width: 690px">
+                <el-option :key="0" label="不符合" :value="0"></el-option>
+                <el-option :key="1" label="符合" :value="1"></el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item label="整改通知" prop="rectifyNotice" v-if="addForm.checkResult === 0 || addForm.checkCategory==2">
+              <el-radio-group v-model="addForm.rectifyNotice" style="margin-top:5px;">
+                <el-radio :label="1">整改告知书</el-radio>
+                <el-radio :label="2">整改通知书</el-radio>
+              </el-radio-group>
+            </el-form-item>
+          </div>
+          <div class="top-form-right-box">
+            <el-form-item label="检查组织" prop="checkType">
+              <p style="background-color: #f5f5f5;width:450px;padding:0 15px;line-height:40px;border-radius:4px;">{{addForm.checkType==1?'校院巡查':(addForm.checkType==2?'实验室自查':'')}}</p>
+            </el-form-item>
+            <el-form-item label="楼栋" prop="buildName">
+              <el-input disabled v-model="addForm.buildName" placeholder="未填写" maxLength="10" style="width: 450px"/>
+            </el-form-item>
+            <el-form-item :label="addForm.checkType==1?'计划周期':(addForm.checkType==2?'任务周期':'')" prop="data9">
+              <el-input disabled v-model="addForm.cycleStartTime+' 至 '+addForm.cycleEndTime" placeholder="未填写" maxLength="10" style="width: 450px"/>
+            </el-form-item>
+            <el-form-item label="整改期限" prop="rectifyDeadline" v-if="addForm.checkResult === 0 || addForm.checkCategory==2">
+              <el-date-picker
+                style="width: 450px"
+                v-model="addForm.rectifyDeadline"
+                type="date"
+                value-format="yyyy-MM-dd"
+                :picker-options="pickerOptions"
+                :clearable="false"
+                placeholder="选择整改期限">
+              </el-date-picker>
+            </el-form-item>
+          </div>
+        </div>
+        <!--综合检查-->
+        <div class="bottom-form-box" v-if="addForm.checkResult === 0 && addForm.checkCategory==1">
+          <div class="bottom-form-title-box">
+            <p>不符合项</p>
+            <p>隐患数：{{addForm.checkHazardDtoList.length}}</p>
+          </div>
+          <div class="for-max-big-box" v-for="(item,index) in addForm.checkHazardDtoList" :key="index">
+            <div class="for-title-box">
+              <p class="for-title-p">第{{index+1}}隐患项</p>
+              <div class="for-del-box">
+                <p class="el-icon-delete"></p>
+                <p @click="delCheckHazardDtoList(index)">删除此项</p>
+              </div>
+              <div class="for-button-box" @click="dataLookButton(item)">
+                <p :class="item.lookType?'el-icon-arrow-up':'el-icon-arrow-down'"></p>
+                <p>{{item.lookType?'收起':'展开'}}</p>
+              </div>
+            </div>
+            <div class="for-big-box" v-if="item.lookType">
+              <el-form-item label="隐患等级" :prop="'checkHazardDtoList.'+index+'.hazardLevel'" :rules="rules.hazardLevel" label-width="123px">
+                <el-select v-model="item.hazardLevel" clearable placeholder="请选择隐患等级" style="width: 408px">
+                  <el-option :key="2" label="一般隐患" :value="2"></el-option>
+                  <el-option :key="1" label="重大隐患" :value="1"></el-option>
+                  <el-option :key="3" label="管理问题" :value="3"></el-option>
+                </el-select>
+              </el-form-item>
+              <el-form-item label="检查项目" :prop="'checkHazardDtoList.'+index+'.hazardCheckPro'" :rules="rules.hazardCheckPro" label-width="123px">
+                <el-cascader
+                  @change="(val)=>cascaderChange(val,'',index)"
+                  v-model="item.hazardCheckPro"
+                  style="width: 898px"
+                  placeholder="请选择检查项"
+                  :options="options"
+                  :props="{ checkStrictly: false, value: 'id', label: 'labelName',emitPath:false }"
+                  popper-class="cascader-filterable-hazardCheckPro"
+                  filterable>
+                  <template slot-scope="{data}">
+                    <el-tooltip :content="data.labelName" v-if="data.labelName.length>22">
+                      <p style="max-width:300px;overflow: hidden;text-overflow:ellipsis;white-space:nowrap;">{{data.labelName}}</p>
+                    </el-tooltip>
+                    <p v-else style="max-width:300px;overflow: hidden;text-overflow:ellipsis;white-space:nowrap;">{{data.labelName}}</p>
+                  </template>
+                </el-cascader>
+                <p class="hazard-check-count-p" v-if="hazardCheckCount>0">此检查项在当前实验室累计出现 <span>{{hazardCheckCount}}</span> 次隐患</p>
+              </el-form-item>
+              <el-form-item label="检查要点" label-width="123px">
+                <el-input
+                  style="width: 898px"
+                  type="textarea"
+                  :autosize="{ minRows: 6, maxRows: 20}"
+                  placeholder="未查到此项检查要点，可在此输入添加"
+                  resize="none"
+                  maxlength="1000"
+                  show-word-limit
+                  v-model="item.hazardCheckPoint">
+                </el-input>
+              </el-form-item>
+              <el-form-item label="隐患描述" :prop="'checkHazardDtoList.'+index+'.hazardDescribe'" :rules="rules.hazardDescribe" label-width="123px">
+                <el-input
+                  style="width: 898px"
+                  type="textarea"
+                  :autosize="{ minRows: 4, maxRows: 4}"
+                  placeholder="请输入隐患描述"
+                  resize="none"
+                  maxlength="100"
+                  show-word-limit
+                  v-model="item.hazardDescribe">
+                </el-input>
+              </el-form-item>
+              <el-form-item label="语音备注：" label-width="123px" class="el-form-item-bottom" v-if="item.voiceRemark[0]">
+                <div class="audio-box">
+                  <div class="audio-box-li" v-for="(voiceItem,voiceIndex) in item.voiceRemark" :key="voiceIndex">
+                    <div class="audio-box-li-l" @click="voicePlay(voiceItem.url)">{{voiceItem.times}}″</div>
+                    <img class="audio-box-li-r" @click="voiceDele('',index,voiceIndex)" src="@/assets/ZDimages/safetyCheck/icon_delete.png">
+                  </div>
+                </div>
+              </el-form-item>
+              <el-form-item label="隐患照片" :prop="'checkHazardDtoList.'+index+'.uploadDtoList'" :rules="rules.uploadDtoList" label-width="123px">
+                <div class="for-img-box" v-for="(img,imgIndex) in item.uploadDtoList" :key="imgIndex">
+                  <img class="for-img" :src="img.fileUrl" @click="lookImg(item.uploadDtoList,imgIndex)">
+                  <p class="for-del-button el-icon-circle-close" @click="delImg('',index,imgIndex)"></p>
+                </div>
+                <el-upload
+                  style="display: inline-block;overflow: hidden"
+                  v-if="item.uploadDtoList.length<5"
+                  class="avatar-uploader"
+                  :action="uploadImgUrl"
+                  :show-file-list="false"
+                  :on-success="(res)=>handleAvatarSuccess(res,item)"
+                  :headers="headers"
+                  :before-upload="(res)=>beforeAvatarUpload(res,item)">
+                  <p class="el-icon-plus up-img-p" style="display: inline-block"></p>
+                </el-upload>
+              </el-form-item>
+              <el-form-item label="" label-width="123px" style="margin-bottom:40px;">
+                <p>支持jpg/png/bmp/gif格式，且不超过2M，最多上传5张</p>
+              </el-form-item>
+            </div>
+          </div>
+          <p class="add-bottom-button" @click="addObject">+新增隐患检查项</p>
+        </div>
+        <!--专项检查项-->
+        <div class="bottom-form-box" v-if="addForm.checkCategory==2">
+          <div class="bottom-form-title-box">
+            <p>检查项</p>
+            <p>检查项：{{addForm.checkHazardInfoVoList.length}}</p>
+          </div>
+          <div class="for-max-big-box for-max-big-box-special" v-for="(item,index) in addForm.checkHazardInfoVoList" :key="index">
+            <div class="for-title-box">
+              <p class="for-title-p">{{index+1}}、【{{item.hazardName}}-{{item.code}}】专项检查</p>
+              <div class="for-button-box" @click="dataLookButton(item)">
+                <p :class="item.lookType?'el-icon-arrow-up':'el-icon-arrow-down'"></p>
+                <p>{{item.lookType?'收起':'展开'}}</p>
+              </div>
+            </div>
+            <div class="for-big-box for-big-box-special"  v-if="item.lookType" v-for="(item2,index2) in item.checkHazardDtoList">
+              <el-form-item label="检查项目" :prop="'checkHazardInfoVoList.'+index+'.checkHazardDtoList.'+index2+'.hazardCheckPro'" :rules="rules.hazardCheckPro" label-width="123px">
+                <el-radio-group v-model="item2.checkFlag" style="margin-right: 20px;">
+                  <el-radio :label="1">符合</el-radio>
+                  <el-radio :label="0">不符合</el-radio>
+                </el-radio-group>
+                <el-cascader
+                  @change="(val)=>cascaderChange(val,item2,index2)"
+                  v-model="item2.hazardCheckPro"
+                  style="width: 730px"
+                  placeholder="请选择检查项"
+                  :options="options"
+                  :props="{ checkStrictly: false, value: 'id', label: 'labelName',emitPath:false }"
+                  popper-class="cascader-filterable-hazardCheckPro"
+                  filterable>
+                  <template slot-scope="{data}">
+                    <el-tooltip :content="data.labelName" v-if="data.labelName.length>22">
+                      <p style="max-width:300px;overflow: hidden;text-overflow:ellipsis;white-space:nowrap;">{{data.labelName}}</p>
+                    </el-tooltip>
+                    <p v-else style="max-width:300px;overflow: hidden;text-overflow:ellipsis;white-space:nowrap;">{{data.labelName}}</p>
+                  </template>
+                </el-cascader>
+                <p class="hazard-check-count-p" v-if="hazardCheckCount>0">此检查项在当前实验室累计出现 <span>{{hazardCheckCount}}</span> 次隐患</p>
+              </el-form-item>
+              <el-form-item v-if="item2.checkFlag==0" label="隐患等级" :prop="'checkHazardInfoVoList.'+index+'.checkHazardDtoList.'+index2+'.hazardLevel'" :rules="rules.hazardLevel" label-width="123px">
+                <el-select v-model="item2.hazardLevel" clearable placeholder="请选择隐患等级" style="width: 408px">
+                  <el-option :key="2" label="一般隐患" :value="2"></el-option>
+                  <el-option :key="1" label="重大隐患" :value="1"></el-option>
+                  <el-option :key="3" label="管理问题" :value="3"></el-option>
+                </el-select>
+              </el-form-item>
+              <el-form-item v-if="item2.checkFlag==0" label="隐患描述"  label-width="123px">
+                <el-input
+                  style="width: 898px"
+                  type="textarea"
+                  :autosize="{ minRows: 4, maxRows: 4}"
+                  placeholder="请输入隐患描述"
+                  resize="none"
+                  maxlength="100"
+                  show-word-limit
+                  v-model="item2.hazardDescribe">
+                </el-input>
+              </el-form-item>
+              <el-form-item label="语音备注：" label-width="123px" class="el-form-item-bottom" v-if="item2.voiceRemark[0]">
+                <div class="audio-box">
+                  <div class="audio-box-li" v-for="(voiceItem,voiceIndex) in item2.voiceRemark" :key="voiceIndex">
+                    <div class="audio-box-li-l" @click="voicePlay(voiceItem.url)">{{voiceItem.times}}″</div>
+                    <img class="audio-box-li-r" @click="voiceDele(item2,index2,voiceIndex)" src="@/assets/ZDimages/safetyCheck/icon_delete.png">
+                  </div>
+                </div>
+              </el-form-item>
+              <el-form-item v-if="item2.checkFlag==0" label="隐患照片" :prop="'checkHazardInfoVoList.'+index+'.checkHazardDtoList.'+index2+'.uploadDtoList'" :rules="rules.uploadDtoList" label-width="123px">
+                <div class="for-img-box" v-for="(img,imgIndex) in item2.uploadDtoList" :key="imgIndex">
+                  <img class="for-img" :src="img.fileUrl" @click="lookImg(item2.uploadDtoList,imgIndex)">
+                  <p class="for-del-button el-icon-circle-close" @click="delImg(item2,index,imgIndex)"></p>
+                </div>
+                <el-upload
+                  v-if="item2.uploadDtoList.length<5"
+                  style="display: inline-block;overflow: hidden"
+                  class="avatar-uploader"
+                  :action="uploadImgUrl"
+                  :show-file-list="false"
+                  :on-success="(res)=>handleAvatarSuccess(res,item2)"
+                  :headers="headers"
+                  :before-upload="(res)=>beforeAvatarUpload(res,item2)">
+                  <p class="el-icon-plus up-img-p" style="display: inline-block"></p>
+                </el-upload>
+              </el-form-item>
+              <el-form-item v-if="item2.checkFlag==0" label="" label-width="123px" style="margin-bottom:40px;color:#999;">
+                <p>支持jpg/png/bmp/gif格式，且不超过2M，最多上传5张</p>
+              </el-form-item>
+            </div>
+          </div>
+        </div>
+
+      </el-form>
+    </div>
+    <div class="bottom-button-max-box">
+      <p class="null-p"></p>
+      <p class="reset-button-one" @click="outButton">取消</p>
+      <p class="add-button-two-90" @click="upDataButton(1)">保存</p>
+      <p class="inquire-button-one" @click="upDataButton(2)">提交</p>
+      <p class="null-p"></p>
+    </div>
+    <lookImgDialog ref="lookImgDialog"></lookImgDialog>
+  </div>
+</template>
+
+<script>
+  import { getToken } from "@/utils/auth";
+  import lookImgDialog from '@/components/lookImgDialog/lookImgDialog.vue'
+  import { findCheckManage,checkOptionList,checkManageUpdate,countHazardNum } from '@/apiDemo/safetyCheck/index'
+  import { delUserHaikang } from '@/apiDemo/laboratory/subject'
+  export default {
+    name: 'addPage',
+    props:{
+      propsAddData:{},
+    },
+    components: {
+      lookImgDialog,
+    },
+    data(){
+      return{
+        loading:false,
+        uploadImgUrl: this.uploadUrl(), // 上传的图片服务器地址
+        headers: {
+          Authorization: "Bearer " + getToken(),
+        },
+        //期限时间
+        pickerOptions: {
+          disabledDate(time) {
+            return time.getTime() < Date.now() - 8.64e7;//如果没有后面的-8.64e7就是不可以选择今天的
+          }
+        },
+        addPageTitle:"",
+        //新增-编辑
+        options:[],
+        addForm:{},
+        //上传用名称保存
+        upDataName:"",
+        // 表单校验
+        rules: {
+          checkResult: [
+            { required: true, message: "请选择检查结果", trigger: "blur" },
+          ],
+          rectifyNotice: [
+            { required: true, message: "请选择整改通知", trigger: "blur" },
+          ],
+          rectifyDeadline: [
+            { required: true, message: "请选择整改期限", trigger: "blur" },
+          ],
+          hazardLevel: [
+            { required: true, message: "请选择隐患等级", trigger: "blur" },
+          ],
+          hazardCheckPro: [
+            { required: true, message: "请选择检查项目", trigger: "blur" },
+          ],
+          hazardDescribe: [
+            { required: true, message: "请输入隐患描述", trigger: "blur" },
+            { required: true, message: "请输入隐患描述", validator: this.spaceJudgment, trigger: "blur" },
+          ],
+          uploadDtoList: [
+            { required: true, message: "请上传隐患照片", trigger: "blur" },
+          ],
+        },
+        //隐患发生次数
+        hazardCheckCount:0,
+      }
+    },
+    created(){
+      this.$set(this,'addPageTitle',this.propsAddData.title);
+
+      this.findCheckManage();
+    },
+    mounted(){},
+    methods:{
+      //语音备忘播放
+      voicePlay(item){
+        let myaudio = new Audio();
+        myaudio.src = item;
+        myaudio.play();
+      },
+      //语音备忘删除
+      async voiceDele(item,index,voiceIndex){
+        let self = this;
+        this.$confirm('确定删除此语音吗?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(function() {
+          if(self.addForm.checkCategory==1){//综合检查
+            self.addForm.checkHazardDtoList[index].voiceRemark.splice(voiceIndex,1);
+          }else if(self.addForm.checkCategory==2){//专项检查
+            item.voiceRemark.splice(voiceIndex,1);
+          }
+        }).then(() => {
+
+        }).catch(() => {});
+      },
+      //保存/提交按钮
+      upDataButton(type){
+        this.$refs["addForm"].validate(valid => {
+          if (valid) {
+            let obj = JSON.parse(JSON.stringify(this.addForm));
+            obj.manageStatus = type
+            if(this.addForm.checkCategory==1){//综合检查
+              //语音备注JSON对象转字符串
+              for(let i=0;i<obj.checkHazardDtoList.length;i++){
+                if(obj.checkHazardDtoList[i].voiceRemark){
+                  obj.checkHazardDtoList[i].voiceRemark=JSON.stringify(obj.checkHazardDtoList[i].voiceRemark)
+                }
+              }
+              if(obj.checkResult === 0){
+                if(!obj.checkHazardDtoList[0]){
+                  this.msgError('请添加隐患检查项')
+                  return
+                }
+                for(let i=0;i<obj.checkHazardDtoList.length;i++){
+                  obj.checkHazardDtoList[i].checkCategory=this.addForm.checkCategory
+                  delete obj.checkHazardDtoList[i].lookType
+                }
+                obj.dangerNum = obj.checkHazardDtoList.length
+              }else{
+                obj.checkHazardDtoList = [];
+              }
+            }else if(this.addForm.checkCategory==2){//专项检查
+
+              let list=[]
+              let checkFlagList=[];
+              for(let i=0;i<this.addForm.checkHazardInfoVoList.length;i++){
+                for(let b=0;b<this.addForm.checkHazardInfoVoList[i].checkHazardDtoList.length;b++){
+                  checkFlagList.push(this.addForm.checkHazardInfoVoList[i].checkHazardDtoList[b].checkFlag)
+                  //语音备注JSON对象转字符串
+                  if(this.addForm.checkHazardInfoVoList[i].checkHazardDtoList[b].voiceRemark){
+                    this.addForm.checkHazardInfoVoList[i].checkHazardDtoList[b].voiceRemark=JSON.stringify(this.addForm.checkHazardInfoVoList[i].checkHazardDtoList[b].voiceRemark)
+                  }
+                  let obj={
+                    checkFlag:this.addForm.checkHazardInfoVoList[i].checkHazardDtoList[b].checkFlag,
+                    checkCategory:this.addForm.checkHazardInfoVoList[i].checkHazardDtoList[b].checkCategory,
+                    hazardCheckCode:this.addForm.checkHazardInfoVoList[i].checkHazardDtoList[b].hazardCheckCode,
+                    hazardCheckName:this.addForm.checkHazardInfoVoList[i].checkHazardDtoList[b].hazardCheckName,
+                    hazardCheckPro:this.addForm.checkHazardInfoVoList[i].checkHazardDtoList[b].hazardCheckPro,
+                    hazardDescribe:this.addForm.checkHazardInfoVoList[i].checkHazardDtoList[b].hazardDescribe,
+                    hazardLevel:this.addForm.checkHazardInfoVoList[i].checkHazardDtoList[b].hazardLevel,
+                    uploadDtoList:this.addForm.checkHazardInfoVoList[i].checkHazardDtoList[b].uploadDtoList,
+                    voiceRemark:this.addForm.checkHazardInfoVoList[i].checkHazardDtoList[b].voiceRemark,
+                    code:this.addForm.checkHazardInfoVoList[i].code,
+                    hazardId:this.addForm.checkHazardInfoVoList[i].hazardId,
+                    hazardName:this.addForm.checkHazardInfoVoList[i].hazardName,
+                    hazardTypeMode:this.addForm.checkHazardInfoVoList[i].hazardTypeMode,
+                    hazardTypeModeName:this.addForm.checkHazardInfoVoList[i].hazardTypeModeName,
+                    joinHazardId:this.addForm.checkHazardInfoVoList[i].joinHazardId,
+                  }
+                  list.push(obj)
+                }
+              }
+              if(checkFlagList.every(item=>{return item==1})){//符合
+                obj.checkResult=1;
+              }else{//不符合
+                obj.checkResult=0;
+              }
+              obj.checkHazardDtoList=list;
+            }
+
+            checkManageUpdate(obj).then(response => {
+              this.msgSuccess(response.msg);
+              this.$parent.goAddPage(4);
+            });
+          }
+        })
+      },
+      //查询详情
+      findCheckManage(){
+        findCheckManage({id:this.propsAddData.id}).then(response => {
+          if(response.data.checkCategory==1){//综合检查
+            // response.data.checkResult = response.data.checkResult === 0 || response.data.checkResult === 1?response.data.checkResult:"";
+            response.data.rectifyNotice = response.data.rectifyNotice?response.data.rectifyNotice:"";
+            response.data.rectifyDeadline = response.data.rectifyDeadline?response.data.rectifyDeadline:"";
+            for(let i=0;i<response.data.checkHazardDtoList.length;i++){
+              response.data.checkHazardDtoList[i].lookType = true;
+              response.data.checkHazardDtoList[i].voiceRemark = response.data.checkHazardDtoList[i].voiceRemark?JSON.parse(response.data.checkHazardDtoList[i].voiceRemark):[];
+            }
+          }else if(response.data.checkCategory==2){//专项检查
+            response.data.rectifyNotice = response.data.rectifyNotice?response.data.rectifyNotice:"";
+            response.data.rectifyDeadline = response.data.rectifyDeadline?response.data.rectifyDeadline:"";
+            if(response.data.checkHazardInfoVoList[0]){
+              response.data.checkHazardInfoVoList.forEach(function(item) {
+                item.lookType = true;
+                item.checkHazardDtoList.forEach(function(item2) {
+                  //item2.hazardCheckCode=item2.code
+                  item2.voiceRemark=item2.voiceRemark?JSON.parse(item2.voiceRemark):[];
+                })
+              })
+            }
+          }
+          this.$set(this,'addForm',response.data);
+          this.checkOptionList();//获取检查项
+        });
+      },
+      //返回事件
+      outButton(){
+        this.$parent.goAddPage(1);
+      },
+      // 删除图片
+      delImg(item,index,imgIndex){
+        console.log(item)
+        if(this.addForm.checkCategory==1){//综合检查
+          this.addForm.checkHazardDtoList[index].uploadDtoList.splice(imgIndex,1);
+        }else if(this.addForm.checkCategory==2){//专项检查
+          item.uploadDtoList.splice(imgIndex,1);
+        }
+
+      },
+      //收起/展开
+      dataLookButton(item){
+        item.lookType = !item.lookType
+
+      },
+      //检查结果选中
+      checkResultChange(val){
+        if(val == 0){
+          //不符合时如果没有检查项则写入一条
+          if(!this.addForm.checkHazardDtoList[0]){
+            this.addObject();
+          }
+        }
+      },
+      //新增检查
+      addObject(){
+        if(this.addForm.checkHazardDtoList.length<10){
+          let obj = {
+            hazardCheckCode:'',
+            hazardCheckName:'',
+            hazardCheckPoint:'',
+            hazardCheckPro:'',
+            hazardDescribe:'',
+            hazardLevel:'',
+            lookType:true,
+            uploadDtoList:[],
+            voiceRemark:[],
+          };
+          this.addForm.checkHazardDtoList.push(obj);
+        }
+      },
+      //删除检查项
+      delCheckHazardDtoList(index){
+        let self = this;
+        this.$confirm('是否确认删除?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(function() {
+          self.addForm.checkHazardDtoList.splice(index,1);
+        }).then(() => {
+        }).catch(() => {});
+      },
+      //检查项选中
+      cascaderChange(val,item,index){
+        let obj = this.getCascaderDataQuery(val,this.options);
+        console.log(item.hazardCheckPro)
+        if(this.addForm.checkCategory==1){//综合检查
+          if(!obj){
+            this.$set(this.addForm.checkHazardDtoList[index],'hazardCheckPro','');
+            this.msgError('未找到相关项目')
+            return
+          }
+          this.$set(this.addForm.checkHazardDtoList[index],'hazardCheckCode',obj.code);
+          this.$set(this.addForm.checkHazardDtoList[index],'hazardCheckName',obj.name);
+          this.$set(this.addForm.checkHazardDtoList[index],'hazardCheckPoint',obj.mainPoint);
+          countHazardNum({subId:this.addForm.subId, hazardCheckPro:val}).then( response => {
+            this.$set(this,'hazardCheckCount',response.data);
+          })
+        }else if(this.addForm.checkCategory==2){//专项检查
+          if(!obj){
+            this.$set(this.addForm.specialCheckHazardDtoList[index],'hazardCheckPro','');
+            this.msgError('未找到相关项目')
+            return
+          }
+          item.hazardCheckCode=obj.code;
+          item.hazardCheckName=obj.name;
+          countHazardNum({subId:this.addForm.subId, hazardCheckPro:val}).then( response => {
+            this.$set(this,'hazardCheckCount',response.data);
+          })
+        }
+      },
+      //查看图片
+      lookImg(list,index){
+        for(let i=0;i<list.length;i++){
+          list[i].name = list[i].fileName;
+          list[i].url = list[i].fileUrl;
+        }
+        this.$refs.lookImgDialog.lookImgDialogOpen(1,list,index);
+      },
+      /*==========上传相关==========*/
+      handleAvatarSuccess(res,item) {
+        this.$set(this,'loading',false);
+        if(item.uploadDtoList.length>4){
+          this.msgError('最多只可上传5张')
+          return
+        }
+        let suffixName= this.upDataName.split('.')[this.upDataName.split('.').length - 2]
+        //判断文件名中是否有逗号和分号
+        if(suffixName.indexOf(',')==-1 && suffixName.indexOf(';')==-1){
+        }else{
+          this.msgError('文件名里包含逗号或分号，请修改后重新上传！')
+          return
+        }
+        let obj ={
+          fileName:this.upDataName,
+          fileUrl:res.data.url,
+          fileType:2,
+          source:2,
+        };
+        item.uploadDtoList.push(obj);
+        this.$forceUpdate()
+      },
+      beforeAvatarUpload(file,item) {
+        if(item.uploadDtoList.length>4){
+          this.msgError('最多只可上传5张')
+          return false
+        }
+        let type = false;
+        if (file.type == 'image/png' || file.type == 'image/jpeg' || file.type == 'image/gif' || file.type == 'image/bmp') {
+          if(file.size> 2100000){
+            this.msgError('上传图片大小不能超过2M')
+            return false
+          }
+          this.$set(this,'loading',true);
+          this.upDataName = file.name;
+          type = true;
+        }else{
+          this.msgError('仅支持jpg/png/bmp/gif格式')
+          type = false;
+        }
+        return type;
+      },
+      //获取检查项
+      checkOptionList(){
+        checkOptionList().then( response => {
+          this.$set(this,'options',response.data);
+          this.getCascaderData(this.options);
+        })
+      },
+      //联级选择器数据处理
+      getCascaderData(list){
+        let self = this;
+        if(this.addForm.checkCategory==1){//综合检查
+          for(let i=0;i<list.length;i++){
+            list[i].labelName = list[i].code? list[i].code +' '+ list[i].name:list[i].name
+            if(list[i].level == 0 || list[i].level == 1 || list[i].level == 2){
+              if(list[i].children){
+                if(list[i].children[0]){
+                  self.getCascaderData(list[i].children)
+                  if(list[i].children){
+                    if(!list[i].children[0]){
+                      list.splice(i,1)
+                      i--
+                    }
+                  }else{
+                    list.splice(i,1)
+                    i--
+                  }
+                }else{
+                  list.splice(i,1)
+                  i--
+                }
+              }else{
+                list.splice(i,1)
+                i--
+              }
+            }else{
+              if(list[i].level == 3){
+                if(list[i].children[0]){
+                  let mainPoint=[]
+                  for(let b=0;b<list[i].children.length;b++){
+                    mainPoint.push(list[i].children[b].name)
+                    list[i].mainPoint=mainPoint.join(',')
+                  }
+                }else{
+                  list[i].mainPoint='';
+                }
+              }
+
+              delete list[i].children
+            }
+          }
+        }else if(this.addForm.checkCategory==2){//专项检查
+          for(let i=0;i<list.length;i++){
+            list[i].labelName = list[i].code? list[i].code +' '+ list[i].name:list[i].name
+            if(list[i].level == 0 || list[i].level == 1 || list[i].level == 2 || list[i].level == 3){
+              if(list[i].children){
+                if(list[i].children[0]){
+                  self.getCascaderData(list[i].children)
+                  if(list[i].children){
+                    if(!list[i].children[0]){
+                      list.splice(i,1)
+                      i--
+                    }
+                  }else{
+                    list.splice(i,1)
+                    i--
+                  }
+                }else{
+                  list.splice(i,1)
+                  i--
+                }
+              }else{
+                list.splice(i,1)
+                i--
+              }
+            }else{
+              delete list[i].children
+            }
+          }
+        }
+
+      },
+      //获取学院列表
+      getCascaderDataQuery(text,list){
+        let self = this;
+        for(let i=0;i<list.length;i++){
+          if(list[i].id == text){
+            return list[i]
+          }else{
+            if(list[i].children){
+              let obj = self.getCascaderDataQuery(text,list[i].children)
+              if(obj){
+                return obj
+              }
+            }
+          }
+        }
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .inspectionManagement-addPage{
+    flex: 1;
+    display: flex !important;
+    flex-direction: column;
+    overflow: hidden;
+    *{
+      font-weight:500;
+    }
+    .title-max-box{
+      position: relative;
+      height:90px;
+      display: flex;
+      border-bottom:1px solid #dedede;
+      .title-p{
+        flex:1;
+        color:#0045AF;
+        margin-left:64px;
+        line-height:90px;
+        font-size:16px;
+      }
+      .title-button{
+        width:70px;
+        margin:24px 31px;
+      }
+      .position-img{
+        width:80px;
+        height:80px;
+        position: absolute;
+        top:0;
+        left:0;
+      }
+    }
+    .content-max-box{
+      flex:1;
+      display: flex;
+      flex-direction: column;
+      .top-form-box{
+        padding:40px 85px 20px;
+        display: flex;
+        .top-form-left-box{
+          min-height:317px;
+          width:770px;
+          margin-right:90px;
+        }
+        .top-form-right-box{
+          min-height:317px;
+          width:534px;
+
+        }
+      }
+      .bottom-form-box{
+        .bottom-form-title-box{
+          background: #F5F5F5;
+          display: flex;
+          margin-bottom:31px;
+          p{
+            font-size:16px;
+            line-height:50px;
+          }
+          p:nth-child(1){
+            color:#333;
+            margin-left:30px;
+            flex:1;
+          }
+          p:nth-child(2){
+            color:#0183FA;
+            margin-right:37px;
+          }
+        }
+        .add-bottom-button{
+          cursor: pointer;
+          color:#0183FA;
+          border-radius:4px;
+          border:1px dashed #0183FA;
+          width:800px;
+          line-height:40px;
+          text-align: center;
+          font-size:14px;
+          margin: 20px auto;
+        }
+      }
+    }
+    .for-max-big-box{
+      border:1px solid #dedede;
+      overflow: hidden;
+      margin:0 81px;
+      .for-title-box{
+        display: flex;
+        background: #F5F5F5;
+        border-bottom:1px solid #dedede;
+        line-height:50px;
+        .for-title-p{
+          color:#333333;
+          font-size:16px;
+          margin-left: 30px;
+          flex:1;
+        }
+        .for-del-box{
+          color:#0183FA;
+          margin-left:46px;
+          cursor: pointer;
+          display: flex;
+          p{
+            font-size:14px;
+            line-height:50px;
+            margin-right:8px;
+          }
+        }
+        .for-button-box{
+          color:#0183FA;
+          margin-left:46px;
+          margin-right:43px;
+          cursor: pointer;
+          display: flex;
+          p{
+            font-size:14px;
+            line-height:50px;
+            margin-right:8px;
+          }
+        }
+      }
+      .for-big-box{
+        padding-top:27px;
+        .up-img-p{
+          height:80px;
+          width:80px;
+          line-height:80px;
+          text-align: center;
+          font-size:16px;
+          border-radius:4px;
+          border:1px dashed #E0E0E0;
+        }
+        .for-img-box{
+          width:80px;
+          height:80px;
+          border-radius:4px;
+          display: inline-block;
+          overflow: hidden;
+          margin-right:20px;
+          position: relative;
+          .for-img{
+            width:80px;
+            height:80px;
+            display: inline-block;
+            overflow: hidden;
+            cursor: pointer;
+          }
+          .for-del-button{
+            background: rgba(0,0,0,0.7);
+            width:20px;
+            height:20px;
+            line-height: 20px;
+            text-align: center;
+            color:#fff;
+            border-bottom-left-radius:4px;
+            cursor: pointer;
+            position: absolute;
+            top:0;
+            right:0;
+          }
+        }
+        .hazard-check-count-p{
+          display: inline-block;
+          margin-left: 20px;
+          font-size: 14px;
+          line-height: 40px;
+          span{
+            color:#FF0000;
+          }
+        }
+      }
+    }
+    /*专项检查*/
+    .for-max-big-box-special{
+      margin-bottom: 20px;
+      .for-big-box-special{
+        border-bottom: 1px dotted #D8D8D8;
+        margin:30px;
+      }
+      .for-big-box-special:last-of-type{
+        border-bottom: none;
+      }
+
+    }
+    /*语音备注*/
+    .audio-box{
+      padding: 16px 0 6px 16px;
+      box-sizing: border-box;
+      width: 898px;
+      min-height: 20px;
+      background: #F5F5F5;
+      border-radius: 4px 4px 4px 4px;
+      .audio-box-li{
+        display: flex;
+        justify-content: flex-start;
+        align-items: center;
+        margin-bottom: 10px;
+        .audio-box-li-l{
+          width: 278px;
+          height: 20px;
+          background: #0183FA;
+          border-radius: 4px 4px 4px 4px;
+          text-align: right;
+          display: inline-block;
+          font-style: normal;
+          font-size: 14px;
+          font-family: Microsoft YaHei, Microsoft YaHei;
+          font-weight: 400;
+          color: #FFFFFF;
+          line-height: 20px;
+          padding-right: 26px;
+          box-sizing: border-box;
+          cursor: pointer;
+        }
+        .audio-box-li-r{
+          width: 16px;
+          height: 16px;
+          margin-left: 6px;
+          cursor: pointer;
+        }
+      }
+    }
+    .bottom-button-max-box{
+      height:80px;
+      display: flex;
+      border-top:1px solid #dedede;
+      p{
+        margin-top:20px;
+      }
+      .null-p{
+        flex:1;
+      }
+      p:nth-child(2){
+        width:90px;
+        margin-right:20px;
+      }
+      p:nth-child(3){
+        width:90px;
+        margin-right:20px;
+      }
+      p:nth-child(4){
+        width:90px;
+        margin-right:20px;
+      }
+    }
+  }
+  ::v-deep .is-disabled{
+    .el-input__inner{
+      background-color: #f5f5f5;
+      color: #333;
+      border-color: #f5f5f5;
+      cursor:auto;
+    }
+  }
+</style>

src/views/safetyCheck/components/infoPage/infoPage.vue

@@ -0,0 +1,845 @@
+<template>
+  <div class="inspectionManagement-infoPage">
+    <div class="title-max-box">
+      <p class="title-p">检查详情</p>
+      <p class="title-button add-button-one-90" @click="outButton">返回</p>
+      <img class="position-img" v-if="addForm.checkRange == 1" src="@/assets/ZDimages/safetyCheck/icon_xyxc_qx.png">
+      <img class="position-img" v-if="addForm.checkRange == 2" src="@/assets/ZDimages/safetyCheck/icon_xyxc_xy.png">
+      <img class="position-img" v-if="addForm.checkRange == 3" src="@/assets/ZDimages/safetyCheck/icon_xyxc_sys.png">
+    </div>
+    <div class="content-max-box scrollbar-box">
+      <el-form  :model="addForm" label-width="82px">
+        <div class="top-form-box">
+          <div class="top-form-left-box">
+            <el-form-item label="计划标题" prop="title">
+              <el-input disabled v-model="addForm.title" placeholder="未填写" style="width: 690px"/>
+            </el-form-item>
+            <el-form-item label="检查组织" prop="checkType">
+              <p style="background-color: #f5f5f5;color:#333;border-radius:4px;width:690px;padding:0 15px;">{{addForm.checkCategory==1?'综合检查':(addForm.checkCategory==2?'专项检查':'')}}</p>
+            </el-form-item>
+            <div style="display: flex">
+              <el-form-item label="学院" prop="collegeName">
+                <el-input disabled v-model="addForm.collegeName" placeholder="未填写" style="width: 300px"/>
+              </el-form-item>
+              <el-form-item label="实验室" prop="subjectName" label-width="110px">
+                <el-input disabled v-model="addForm.roomNumber?addForm.subjectName+'-'+addForm.roomNumber:addForm.subjectName" placeholder="未填写" style="width: 280px"/>
+              </el-form-item>
+            </div>
+            <el-form-item label="检查要求" prop="checkDemand">
+              <p style="background-color: #f5f5f5;color:#333;border-radius:4px;width:690px;padding:10px 15px;font-size:14px;line-height:20px;min-height:40px;">{{addForm.checkDemand}}<span v-if="!addForm.checkDemand" style="color:#999;">未输入</span></p>
+              <!--<el-input disabled v-model="addForm.checkDemand" placeholder="未填写" style="width: 690px"/>-->
+            </el-form-item>
+            <el-form-item label="检查结果" prop="checkResult" v-if="addForm.checkResult == 0 || addForm.checkResult == 1">
+              <p style="background-color: #f5f5f5;color:#333;border-radius:4px;width:690px;padding:0 15px;">{{addForm.checkResult==0?'不符合':(addForm.checkResult==1?'符合':'')}}</p>
+            </el-form-item>
+            <div style="display: flex">
+              <el-form-item v-if="addForm.checkResult==0" :label="addForm.rectifyNotice == 1?'整改告知书':'整改通知书'" style="width: 300px">
+                <div class="data-button-box">
+                  <p class="look-button" @click="lookDocumentButton(1)">查看</p>
+                  <p class="download-button" @click="downloadButton">下载</p>
+                </div>
+              </el-form-item>
+              <el-form-item label="材料附件" style="width: 300px" v-if="addForm.checkResult!=1&&addForm.isAttachment == 1">
+                <div class="data-button-box">
+                  <p class="look-button" @click="lookDocumentListButton(1)">查看</p>
+                </div>
+              </el-form-item>
+            </div>
+          </div>
+          <div class="top-form-right-box">
+            <el-form-item label="检查组织" prop="checkType">
+              <p style="background-color: #f5f5f5;color:#333;border-radius:4px;width:450px;padding:0 15px;">{{addForm.checkType==1?'校院巡查':(addForm.checkType==2?'实验室自查':'')}}</p>
+            </el-form-item>
+            <el-form-item label="楼栋" prop="buildName">
+              <el-input disabled v-model="addForm.buildName" placeholder="未填写" maxLength="10" style="width: 450px"/>
+            </el-form-item>
+            <el-form-item :label="addForm.checkType==1?'计划周期':(addForm.checkType==2?'任务周期':'')" prop="data9">
+              <el-input disabled v-model="addForm.cycleStartTime+' 至 '+addForm.cycleEndTime" placeholder="未填写" maxLength="10" style="width: 450px"/>
+            </el-form-item>
+            <el-form-item label="整改期限" prop="rectifyDeadline" v-if="addForm.checkResult==0">
+              <el-input disabled v-model="addForm.rectifyDeadline" placeholder="未填写" maxLength="10" style="width: 450px"/>
+            </el-form-item>
+            <el-form-item label="材料附件" style="width: 450px" v-if="addForm.checkResult==1&&addForm.isAttachment == 1">
+              <div class="data-button-box">
+                <p class="look-button" @click="lookDocumentListButton(1)">查看</p>
+              </div>
+            </el-form-item>
+          </div>
+        </div>
+        <!--综合检查-->
+        <div class="bottom-form-box" v-if="addForm.checkResult==0 && addForm.checkCategory==1">
+          <div class="bottom-form-title-box">
+            <p>不符合项</p>
+            <p>隐患数：{{addForm.dangerNum}}</p>
+          </div>
+          <div class="for-max-big-box" v-for="(item,index) in addForm.checkHazardDtoList" :key="index">
+            <div class="for-title-box">
+              <p class="for-title-p">第{{index+1}}隐患项</p>
+            </div>
+            <div class="for-content-box">
+              <div class="content-box">
+                <div class="min-content-box">
+                  <div class="left-min-content-box">
+                    <p></p>
+                    <p>隐患状态</p>
+                    <p></p>
+                  </div>
+                  <div class="right-min-content-box">
+                    <p class="button-p" @click="addDialogOpen(true,item)">{{item.rectifyStatus==1?'已完成':(item.rectifyStatus==2?'待整改':(item.rectifyStatus==3?'待复核':(item.rectifyStatus==4?'暂无法整改':'')))}} <i class="el-icon-d-arrow-right"></i></p>
+                  </div>
+                </div>
+                <div class="min-content-box">
+                  <div class="left-min-content-box">
+                    <p></p>
+                    <p>检查项目</p>
+                    <p></p>
+                  </div>
+                  <div class="right-min-content-box" style="height:120px;">
+                    <div class="inspection-box">
+                      <p class="scrollbar-box">{{item.hazardCheckProStr}}</p>
+                      <p v-if="item.hazardCheckCount>0">此检查项在当前实验室累计出现 <span>{{item.hazardCheckCount}}</span> 次隐患</p>
+                    </div>
+                  </div>
+                </div>
+                <div class="min-content-box">
+                  <div class="left-min-content-box">
+                    <p></p>
+                    <p>隐患描述</p>
+                    <p></p>
+                  </div>
+                  <div class="right-min-content-box" style="height:120px;">
+                    <div class="text-box">
+                      <p class="null-p"></p>
+                      <p class="text-p scrollbar-box">{{item.hazardDescribe}}</p>
+                      <p class="null-p"></p>
+                    </div>
+                  </div>
+                </div>
+                <div class="min-content-box" v-if="item.voiceRemark[0]">
+                  <div class="left-min-content-box">
+                    <p></p>
+                    <p>语音备注</p>
+                    <p></p>
+                  </div>
+                  <div class="right-min-content-box" style="height:120px; padding: 10px; overflow-y: auto;">
+                    <div class="audio-box-li" v-for="(voiceItem,voiceIndex) in item.voiceRemark" :key="voiceIndex">
+                      <div class="audio-box-li-l" @click="voicePlay(voiceItem.url)">{{voiceItem.times}}″</div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+              <div class="content-box">
+                <div class="min-content-box">
+                  <div class="left-min-content-box">
+                    <p></p>
+                    <p>隐患等级</p>
+                    <p></p>
+                  </div>
+                  <div class="right-min-content-box">
+                    <p class="title-p">{{item.hazardLevel==2?'一般隐患':(item.hazardLevel==1?'重大隐患':(item.hazardLevel==3?'管理问题':''))}}</p>
+                  </div>
+                </div>
+                <div class="min-content-box">
+                  <div class="left-min-content-box">
+                    <p></p>
+                    <p>检查要点</p>
+                    <p></p>
+                  </div>
+                  <div class="right-min-content-box" style="height:120px;">
+                    <div class="text-box">
+                      <p class="null-p"></p>
+                      <p class="text-p scrollbar-box">{{item.hazardCheckPoint}}</p>
+                      <p class="null-p"></p>
+                    </div>
+                  </div>
+                </div>
+                <div class="min-content-box">
+                  <div class="left-min-content-box">
+                    <p></p>
+                    <p>隐患照片</p>
+                    <p></p>
+                  </div>
+                  <div class="right-min-content-box" style="height:120px;">
+                    <div class="img-box">
+                      <img :src="imgItem.fileUrl" @click="lookImg(item.uploadDtoList,imgIndex)"
+                           v-for="(imgItem,imgIndex) in item.uploadDtoList" :ley="imgIndex">
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <!--专项检查项-->
+        <div class="bottom-form-box" v-if="(addForm.checkResult==0||addForm.checkResult==1) && addForm.checkCategory==2">
+          <div class="bottom-form-title-box">
+            <p>检查项</p>
+            <p>检查项：{{addForm.checkHazardInfoVoList.length}}</p>
+          </div>
+          <div class="for-max-big-box for-max-big-box-special" v-for="(item,index) in addForm.checkHazardInfoVoList" :key="index">
+            <div class="for-title-box">
+              <p class="for-title-p">{{index+1}}、【{{item.hazardName}}-{{item.code}}】专项检查</p>
+              <div class="for-button-box" @click="dataLookButton(item)">
+                <p :class="item.lookType?'el-icon-arrow-up':'el-icon-arrow-down'"></p>
+                <p>{{item.lookType?'收起':'展开'}}</p>
+              </div>
+            </div>
+            <div class="for-big-box for-big-box-special" v-if="item.lookType" v-for="(item2,index2) in item.checkHazardDtoList">
+              <el-form-item label="检查项目"  label-width="123px">
+                <el-radio-group v-model="item2.checkFlag" style="margin-right: 20px;" disabled>
+                  <el-radio :label="1">符合</el-radio>
+                  <el-radio :label="0">不符合</el-radio>
+                </el-radio-group>
+                <el-cascader
+                  disabled
+                  @change="(val)=>cascaderChange(val,item2,index2)"
+                  v-model="item2.hazardCheckPro"
+                  style="width: 730px"
+                  placeholder="请选择检查项"
+                  :options="options"
+                  :props="{ checkStrictly: false, value: 'id', label: 'labelName',emitPath:false }"
+                  popper-class="cascader-filterable-hazardCheckPro"
+                  filterable>
+                  <template slot-scope="{data}">
+                    <el-tooltip :content="data.labelName" v-if="data.labelName.length>22">
+                      <p style="max-width:300px;overflow: hidden;text-overflow:ellipsis;white-space:nowrap;">{{data.labelName}}</p>
+                    </el-tooltip>
+                    <p v-else style="max-width:300px;overflow: hidden;text-overflow:ellipsis;white-space:nowrap;">{{data.labelName}}</p>
+                  </template>
+                </el-cascader>
+                <p class="button-p" v-if="item2.checkFlag==0" @click="addDialogOpen(true,item2)">{{item2.rectifyStatus==1?'已完成':(item2.rectifyStatus==2?'待整改':(item2.rectifyStatus==3?'待复核':(item2.rectifyStatus==4?'暂无法整改':'')))}} <i class="el-icon-d-arrow-right"></i></p>
+              </el-form-item>
+              <el-form-item v-if="item2.checkFlag==0" label="隐患等级"  label-width="123px">
+                <el-select v-model="item2.hazardLevel" clearable placeholder="请选择隐患等级" style="width: 408px" disabled>
+                  <el-option :key="2" label="一般隐患" :value="2"></el-option>
+                  <el-option :key="1" label="重大隐患" :value="1"></el-option>
+                  <el-option :key="3" label="管理问题" :value="3"></el-option>
+                </el-select>
+              </el-form-item>
+              <el-form-item v-if="item2.checkFlag==0" label="隐患描述"  label-width="123px" >
+                <el-input
+                  disabled
+                  style="width: 898px"
+                  type="textarea"
+                  :autosize="{ minRows: 4, maxRows: 4}"
+                  placeholder="请输入隐患描述"
+                  resize="none"
+                  maxlength="100"
+                  show-word-limit
+                  v-model="item2.hazardDescribe">
+                </el-input>
+              </el-form-item>
+              <el-form-item label="语音备注：" label-width="123px" class="el-form-item-bottom" v-if="item2.voiceRemark[0]">
+                <div class="audio-box">
+                    <div class="audio-box-li" v-for="(voiceItem,voiceIndex) in item2.voiceRemark" :key="voiceIndex">
+                        <div class="audio-box-li-l" @click="voicePlay(voiceItem.url)">{{voiceItem.times}}″</div>
+                    </div>
+                </div>
+              </el-form-item>
+              <el-form-item v-if="item2.checkFlag==0" label="隐患照片"  label-width="123px">
+                <div class="for-img-box" v-for="(img,imgIndex) in item2.uploadDtoList" :key="imgIndex">
+                  <img class="for-img" :src="img.fileUrl" @click="lookImg(item2.uploadDtoList,imgIndex)">
+                </div>
+              </el-form-item>
+            </div>
+          </div>
+        </div>
+
+      </el-form>
+    </div>
+    <lookImgDialog ref="lookImgDialog"></lookImgDialog>
+    <infoDialog v-if="infoDialogType" :propsInfoDialogData="propsInfoDialogData"></infoDialog>
+    <lookDocumentDataDialog v-if="lookDocumentType" :propsLookDocumentData="propsLookDocumentData"></lookDocumentDataDialog>
+    <lookDocumentListDialog v-if="lookDocumentListType" :propsLookDocumentListData="propsLookDocumentListData"></lookDocumentListDialog>
+  </div>
+</template>
+
+<script>
+import { checkOptionList, findCheckManage, getFindByCheckPlanId } from '@/apiDemo/safetyCheck/index'
+  import lookImgDialog from '@/components/lookImgDialog/lookImgDialog.vue'
+  import lookDocumentDataDialog from '@/components/lookDocumentDialog/lookDocumentDataDialog.vue'
+  import lookDocumentListDialog from '@/components/lookDocumentDialog/lookDocumentListDialog.vue'
+  import infoDialog from '@/views/safetyCheck/components/infoDialog/infoDialog.vue'
+import { getToken } from '@/utils/auth'
+  export default {
+    name: 'infoPage',
+    props:{
+      propsInfoData:{},
+    },
+    components: {
+      lookImgDialog,
+      infoDialog,
+      lookDocumentDataDialog,
+      lookDocumentListDialog
+    },
+    data(){
+      return{
+        uploadImgUrl: this.uploadUrl(), // 上传的图片服务器地址
+        headers: {
+          Authorization: "Bearer " + getToken(),
+        },
+        //子组件数据
+        lookDocumentType:false,
+        propsLookDocumentData:{},
+        lookDocumentListType:false,
+        propsLookDocumentListData:{},
+        propsInfoDialogData:{},
+        //页面
+        imgType:1,
+        infoDialogType:false,
+        addForm:{},
+        options:[],
+      }
+    },
+    created(){},
+    mounted(){
+      this.checkOptionList();
+      this.findCheckManage();
+    },
+    methods:{
+      //语音备忘播放
+      voicePlay(item){
+        let myaudio = new Audio();
+        myaudio.src = item;
+        myaudio.play();
+      },
+      //查询详情
+      findCheckManage(){
+        findCheckManage({id:this.propsInfoData.id}).then(response => {
+          if(response.data.checkCategory==1){//综合检查
+            // response.data.checkResult = response.data.checkResult === 0 || response.data.checkResult === 1?response.data.checkResult:"";
+            response.data.rectifyNotice = response.data.rectifyNotice?response.data.rectifyNotice:"";
+            response.data.rectifyDeadline = response.data.rectifyDeadline?response.data.rectifyDeadline:"";
+            for(let i=0;i<response.data.checkHazardDtoList.length;i++){
+              response.data.checkHazardDtoList[i].lookType = true;
+              response.data.checkHazardDtoList[i].voiceRemark = response.data.checkHazardDtoList[i].voiceRemark?JSON.parse(response.data.checkHazardDtoList[i].voiceRemark):[];
+            }
+          } else if(response.data.checkCategory==2){//专项检查
+            if(response.data.checkHazardInfoVoList[0]){
+              response.data.checkHazardInfoVoList.forEach(function(item) {
+                item.lookType = true;
+                item.checkHazardDtoList.forEach(function(item2) {
+                  //item2.hazardCheckCode=item2.code
+                  item2.voiceRemark=item2.voiceRemark?JSON.parse(item2.voiceRemark):[];
+                })
+              })
+            }
+          }
+          this.$set(this,'addForm',response.data);
+          console.log(this.addForm)
+        });
+
+      },
+      //开关详情页面
+      addDialogOpen(type,data){
+        if(this.infoDialogType != type){
+          if(type){
+            let obj = {
+              id:data.id
+            }
+            console.log(obj)
+            this.$set(this,'propsInfoDialogData',obj);
+            this.$set(this,'infoDialogType',type);
+          }else{
+            this.$set(this,'infoDialogType',type);
+          }
+        }
+      },
+      //获取检查项
+      checkOptionList(){
+        checkOptionList().then( response => {
+          this.$set(this,'options',response.data);
+          this.getCascaderData(this.options);
+        })
+      },
+      //联级选择器数据处理
+      getCascaderData(list){
+        let self = this;
+        for(let i=0;i<list.length;i++){
+          list[i].labelName = list[i].code? list[i].code +' '+ list[i].name:list[i].name
+          if(list[i].level == 0 || list[i].level == 1 || list[i].level == 2 || list[i].level == 3){
+            if(list[i].children){
+              if(list[i].children[0]){
+                self.getCascaderData(list[i].children)
+                if(list[i].children){
+                  if(!list[i].children[0]){
+                    list.splice(i,1)
+                    i--
+                  }
+                }else{
+                  list.splice(i,1)
+                  i--
+                }
+              }else{
+                list.splice(i,1)
+                i--
+              }
+            }else{
+              list.splice(i,1)
+              i--
+            }
+          }else{
+            delete list[i].children
+          }
+        }
+
+      },
+      //返回事件
+      outButton(){
+        this.$parent.goAddPage(1);
+      },
+      //收起/展开
+      dataLookButton(item){
+        item.lookType = !item.lookType
+      },
+      //查看图片
+      lookImg(list,index){
+        for(let i=0;i<list.length;i++){
+          list[i].name = list[i].fileName;
+          list[i].url = list[i].fileUrl;
+        }
+        this.$refs.lookImgDialog.lookImgDialogOpen(1,list,index);
+      },
+      // 单个下载按钮
+      downloadButton(){
+        if(this.addForm.rectifyNotice == 1){
+          //告知
+          this.download('/zd-security/checkManage/getRectifyNotification/'+this.addForm.id, {}, this.addForm.title+'(整改告知书).docx')
+        }else if(this.addForm.rectifyNotice == 2){
+          //通知
+          this.download('/zd-security/checkManage/getRectifyAdviceNote/'+this.addForm.id, {}, this.addForm.title+'(整改通知书).docx')
+        }
+      },
+      //查看单个文档
+      lookDocumentButton(type){
+        if(type==1){
+          this.$set(this,'propsLookDocumentData',{
+            title:this.addForm.rectifyNotice == 1?'整改告知书':'整改通知书',
+            type:this.addForm.rectifyNotice == 1?3:2,
+            id:this.addForm.id,
+            name:this.addForm.title
+          });
+          this.$set(this,'lookDocumentType',true);
+        }else{
+          this.$set(this,'lookDocumentType',false);
+        }
+      },
+      // 多个下载按钮
+      allDownloadButton(){
+        this.download(this.lookDocumentList[this.lookDocumentListIndex].url, {}, this.lookDocumentList[this.lookDocumentListIndex].name)
+      },
+      //查看多个文档
+      lookDocumentListButton(type){
+        if(type==1){
+          getFindByCheckPlanId({checkPlanId:this.addForm.checkPlanId}).then(response => {
+            let list = [];
+            for(let i=0;i<response.data.length;i++){
+              let obj = {
+                name:response.data[i].fileName,
+                url:response.data[i].fileUrl,
+              }
+              list.push(obj);
+            }
+            this.$set(this,'propsLookDocumentListData',{
+              title:"查看附件",
+              list:list
+            });
+            this.$set(this,'lookDocumentListType',true);
+          });
+        }else{
+          this.$set(this,'lookDocumentListType',false);
+        }
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .inspectionManagement-infoPage{
+    flex: 1;
+    display: flex !important;
+    flex-direction: column;
+    overflow: hidden;
+    *{
+      font-weight:500;
+    }
+    .title-max-box{
+      position: relative;
+      height:90px;
+      display: flex;
+      border-bottom:1px solid #dedede;
+      .title-p{
+        flex:1;
+        color:#0045AF;
+        margin-left:64px;
+        line-height:90px;
+        font-size:16px;
+      }
+      .title-button{
+        width:70px;
+        margin:24px 31px;
+      }
+      .position-img{
+        width:80px;
+        height:80px;
+        position: absolute;
+        top:0;
+        left:0;
+      }
+    }
+    .content-max-box{
+      flex:1;
+      display: flex;
+      flex-direction: column;
+      .top-form-box{
+        padding:40px 85px 20px;
+        display: flex;
+        .top-form-left-box{
+          min-height:317px;
+          width:770px;
+          margin-right:90px;
+        }
+        .top-form-right-box{
+          min-height:317px;
+          width:534px;
+        }
+        .data-button-box{
+          display: flex;
+          padding-top: 5px;
+          .look-button{
+            width: 70px;
+            height: 30px;
+            background: #0045AF;
+            border-radius: 4px 4px 4px 4px;
+            color:#fff;
+            font-size:14px;
+            text-align: center;
+            line-height:30px;
+            margin-right:12px;
+            cursor: pointer;
+          }
+          .download-button{
+            width: 70px;
+            height: 30px;
+            border-radius: 4px 4px 4px 4px;
+            opacity: 1;
+            border: 1px solid #0045AF;
+            color:#0045AF;
+            font-size:14px;
+            text-align: center;
+            line-height:30px;
+            cursor: pointer;
+          }
+        }
+      }
+      .bottom-form-box{
+        .bottom-form-title-box{
+          background: #F5F5F5;
+          display: flex;
+          margin-bottom:31px;
+          p{
+            font-size:16px;
+            line-height:50px;
+          }
+          p:nth-child(1){
+            color:#333;
+            margin-left:30px;
+            flex:1;
+          }
+          p:nth-child(2){
+            color:#0183FA;
+            margin-right:37px;
+          }
+        }
+        .add-bottom-button{
+          cursor: pointer;
+          color:#0183FA;
+          border-radius:4px;
+          border:1px dashed #0183FA;
+          width:800px;
+          line-height:40px;
+          text-align: center;
+          font-size:14px;
+          margin: 20px auto;
+        }
+      }
+    }
+    .for-max-big-box{
+      border:1px solid #dedede;
+      border-bottom:none;
+      overflow: hidden;
+      margin:0 81px 40px;
+      .for-title-box{
+        display: flex;
+        background: #F5F5F5;
+        border-bottom:1px solid #dedede;
+        line-height:50px;
+        .for-title-p{
+          color:#333333;
+          font-size:16px;
+          margin-left: 30px;
+          flex:1;
+        }
+        .for-button-box{
+          color:#0183FA;
+          margin-left:46px;
+          margin-right:43px;
+          cursor: pointer;
+          display: flex;
+          p{
+            font-size:14px;
+            line-height:50px;
+            margin-right:8px;
+          }
+        }
+      }
+      .for-content-box{
+        display: flex;
+        .content-box{
+          flex:1;
+          display: flex;
+          flex-direction: column;
+          .min-content-box{
+            display: flex;
+            /*语音备注*/
+            .audio-box-li{
+              display: flex;
+              justify-content: flex-start;
+              align-items: center;
+              margin-bottom: 10px;
+              .audio-box-li-l{
+                width: 278px;
+                height: 20px;
+                background: #0183FA;
+                border-radius: 4px 4px 4px 4px;
+                text-align: right;
+                display: inline-block;
+                font-style: normal;
+                font-size: 14px;
+                font-family: Microsoft YaHei, Microsoft YaHei;
+                font-weight: 400;
+                color: #FFFFFF;
+                line-height: 20px;
+                padding-right: 26px;
+                box-sizing: border-box;
+                cursor: pointer;
+              }
+              .audio-box-li-r{
+                width: 16px;
+                height: 16px;
+                margin-left: 6px;
+                cursor: pointer;
+              }
+            }
+            .left-min-content-box{
+              display: flex;
+              flex-direction: column;
+              width:120px;
+              border-right:1px solid #E0E0E0;
+              border-bottom:1px solid #E0E0E0;
+              p:nth-child(1){
+                flex:1;
+              }
+              p:nth-child(2){
+                font-size:16px;
+                color:#333;
+                text-align: center;
+                min-height:40px;
+                line-height:40px;
+              }
+              p:nth-child(3){
+                flex:1;
+              }
+            }
+            .right-min-content-box{
+              width:588px;
+              border-right:1px solid #E0E0E0;
+              border-bottom:1px solid #E0E0E0;
+              .button-p{
+                width:200px;
+                color:#0183FA;
+                font-size:16px;
+                min-height:40px;
+                line-height:40px;
+                margin-left:39px;
+                cursor: pointer;
+                i{
+                  font-size:14px;
+                }
+              }
+              .inspection-box{
+                height:120px;
+                padding:12px 20px;
+                font-size:14px;
+                color:#333;
+                line-height:18px;
+                display: flex;
+                flex-direction: column;
+                overflow: hidden;
+                p:nth-child(1){
+                  flex:1;
+                }
+                p:nth-child(2){
+                  margin-top:10px;
+                  height:20px;
+                  line-height:20px;
+                  span{
+                    color:#FF0000;
+                  }
+                }
+              }
+              .text-box{
+                height:120px;
+                padding:0 20px;
+                display: flex;
+                flex-direction: column;
+                .null-p{
+                  flex:1;
+                }
+                .text-p{
+                  max-height:100px;
+                  font-size:14px;
+                  color:#333;
+                  line-height:18px;
+                }
+              }
+              .title-p{
+                font-size:16px;
+                color:#333;
+                min-height:40px;
+                line-height:40px;
+                margin-left:18px;
+              }
+              .img-box{
+                height:120px;
+                padding:0 20px;
+                img{
+                  height:80px;
+                  width:80px;
+                  border-radius:4px;
+                  display: inline-block;
+                  overflow: hidden;
+                  margin:20px 10px 0 0;
+                  cursor: pointer;
+                }
+
+              }
+            }
+          }
+        }
+      }
+    }
+    .for-big-box{
+      padding-top:27px;
+      .up-img-p{
+        height:80px;
+        width:80px;
+        line-height:80px;
+        text-align: center;
+        font-size:16px;
+        border-radius:4px;
+        border:1px dashed #E0E0E0;
+      }
+      .for-img-box{
+        width:80px;
+        height:80px;
+        border-radius:4px;
+        display: inline-block;
+        overflow: hidden;
+        margin-right:20px;
+        position: relative;
+        .for-img{
+          width:80px;
+          height:80px;
+          display: inline-block;
+          overflow: hidden;
+          cursor: pointer;
+        }
+        .for-del-button{
+          background: rgba(0,0,0,0.7);
+          width:20px;
+          height:20px;
+          line-height: 20px;
+          text-align: center;
+          color:#fff;
+          border-bottom-left-radius:4px;
+          cursor: pointer;
+          position: absolute;
+          top:0;
+          right:0;
+        }
+      }
+      .button-p{
+        display: inline-block;
+        margin-left: 20px;
+        width:200px;
+        color:#0183FA;
+        font-size:16px;
+        min-height:40px;
+        line-height:40px;
+        margin-left:39px;
+        cursor: pointer;
+        i{
+          font-size:14px;
+        }
+      }
+    }
+    /*专项检查*/
+    .for-max-big-box-special{
+      margin-bottom: 20px;
+      .for-big-box-special{
+        border-bottom: 1px dotted #D8D8D8;
+        margin:30px;
+      }
+      .for-big-box-special:last-of-type{
+        border-bottom: none;
+      }
+      /*语音备注*/
+      .audio-box{
+        padding: 16px 0 6px 16px;
+        box-sizing: border-box;
+        width: 898px;
+        min-height: 20px;
+        background: #F5F5F5;
+        border-radius: 4px 4px 4px 4px;
+        .audio-box-li{
+          display: flex;
+          justify-content: flex-start;
+          align-items: center;
+          margin-bottom: 10px;
+          .audio-box-li-l{
+            width: 278px;
+            height: 20px;
+            background: #0183FA;
+            border-radius: 4px 4px 4px 4px;
+            text-align: right;
+            display: inline-block;
+            font-style: normal;
+            font-size: 14px;
+            font-family: Microsoft YaHei, Microsoft YaHei;
+            font-weight: 400;
+            color: #FFFFFF;
+            line-height: 20px;
+            padding-right: 26px;
+            box-sizing: border-box;
+            cursor: pointer;
+          }
+          .audio-box-li-r{
+            width: 16px;
+            height: 16px;
+            margin-left: 6px;
+            cursor: pointer;
+          }
+        }
+      }
+    }
+  }
+  ::v-deep .is-disabled{
+    .el-input__inner{
+      background-color: #f5f5f5;
+      color: #333;
+      border-color: #f5f5f5;
+      cursor:auto;
+    }
+  }
+</style>

src/views/safetyCheck/dataStatistics/checkIndexStatistics.vue

@@ -0,0 +1,356 @@
+<!--指标统计列表-->
+<template>
+  <div class="checkIndexStatistics">
+    <el-form :model="queryParams" class="form-box" ref="queryForm" :inline="true">
+      <el-form-item label="" prop="deptId" label-width="50px" v-if="!userFlg">
+        <el-select v-model="queryParams.deptId" clearable placeholder="全部">
+          <el-option
+            v-for="item in deptSelectList"
+            :key="item.deptId"
+            :label="item.deptName"
+            :value="item.deptId">
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="" prop="subId" label-width="50px" v-if="userFlg">
+        <el-select placeholder="请输入关键词" filterable remote reserve-keyword
+                   v-model="queryParams.subId" :remote-method="getSubList">
+          <el-option
+            v-for="item in subSelectList"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id">
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="" prop="searchValue" label-width="80px">
+        <el-input
+          maxLength="30"
+          v-model="queryParams.searchValue"
+          placeholder="计划任务"
+          clearable
+          style="width: 200px"/>
+      </el-form-item>
+      <el-form-item label="" prop="dateRange" label-width="70px">
+        <el-date-picker
+          :clearable="false"
+          v-model="dateRange"
+          size="small"
+          style="width: 240px"
+          value-format="yyyy-MM-dd"
+          type="daterange"
+          range-separator="-"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+        ></el-date-picker>
+      </el-form-item>
+      <el-form-item>
+        <p class="inquire-button-one" @click="handleQuery" style="margin-right:10px;">查询</p>
+        <p class="reset-button-one" @click="resetQuery">重置</p>
+      </el-form-item>
+      <el-form-item style="float: right;" v-hasPermi="['safety:dataSub:export']">
+        <export-component :exportConfig="exportConfig"></export-component>
+
+      </el-form-item>
+    </el-form>
+    <div class="num-data-box">
+      共搜索到隐患总数 {{numData.sumTotal}}，一级指标隐患总数 {{numData.level1}}，占比 {{numData.percent1}}，二级指标隐患总数 {{numData.level2}}，占比 {{numData.percent2}}，三级指标隐患总数 {{numData.level3}}，占比 {{numData.percent3}}，四级指标隐患总数 {{numData.level4}}，占比 {{numData.percent4}}
+    </div>
+    <el-table  border :data="tableList" ref="multipleTable"
+               :row-key="getRowKeys"
+               @select="select" @select-all="selectAll">
+      <el-table-column type="selection" width="50" align="center"/>
+      <el-table-column label="序号" align="center"  type="index" width="60" />
+      <el-table-column label="计划任务" align="center" prop="title" show-overflow-tooltip/>
+      <el-table-column v-if="!userFlg" label="学院" align="center" prop="collegeName" show-overflow-tooltip width="230"/>
+      <el-table-column v-if="userFlg" label="实验室" align="center" prop="subjectName" show-overflow-tooltip width="230"/>
+      <el-table-column label="隐患总数" align="center" prop="sumTotal" show-overflow-tooltip width="120"/>
+      <el-table-column label="一级指标隐患数" align="center" prop="itemsTotal1" show-overflow-tooltip width="130"/>
+      <el-table-column label="一级指标占比" align="center" prop="percent" show-overflow-tooltip width="130"/>
+      <el-table-column label="二级指标隐患数" align="center" prop="itemsTotal2" show-overflow-tooltip width="130"/>
+      <el-table-column label="二级指标占比" align="center" prop="percent2" show-overflow-tooltip width="130"/>
+      <el-table-column label="三级指标隐患数" align="center" prop="itemsTotal3" show-overflow-tooltip width="130"/>
+      <el-table-column label="三级指标占比" align="center" prop="percent3" show-overflow-tooltip width="130"/>
+      <el-table-column label="四级指标隐患数" align="center" prop="itemsTotal4" show-overflow-tooltip width="130"/>
+      <el-table-column label="四级指标占比" align="center" prop="percent4" show-overflow-tooltip width="130"/>
+    </el-table>
+    <pagination :page-sizes="[20, 30, 40, 50]"
+                v-show="total>0"
+                :total="total"
+                :page.sync="queryParams.pageNum"
+                :limit.sync="queryParams.pageSize"
+                @pagination="getList"
+    />
+  </div>
+</template>
+
+<script>
+  import { listDepartments } from "@/apiDemo/system/dept";
+  import { dataStatisticsItemsList,dataStatisticsItemsListTop,isSCollege,getloginUser,
+           hiddenDataItemsSubList,hiddenDataItemsSubListTop,listSubAdmin } from "@/apiDemo/safetyCheck/index";
+  //            V3
+  import exportComponent from "@/components/exportComponent/exportComponent.vue";
+
+  export default {
+    name: 'checkIndexStatistics',
+    components: {
+      exportComponent,
+    },
+    props:{
+      propsData:{},
+    },
+    data(){
+      return{
+        //导出
+        exportConfig:{
+          api:this.userFlg?'/zd-security/collegCheck/collegeItemsExport/':'/zd-security/DataStatistics/itemsExport/',             //导出接口地址
+          ids:'',                                       //勾选导出,勾选的IDS
+          fileName:this.userFlg?'检查指标统计':'检查指标统计',                         //导出文件的命名
+        },
+        deptSelectList:[],
+        subSelectList:[],
+        classTypeList:[],
+        classifiedList:[],
+        dateRange:[],
+        queryParams:{},
+        setChildren:"",
+        numData:{},
+        tableList:[],
+        total:0,
+        userFlg:false,
+        deptId:"",
+      }
+    },
+    created(){
+    },
+    mounted(){
+      this.initializationInterface();
+    },
+    methods:{
+      initializationInterface(){
+        let self = this;
+        this.$set(this,'queryParams',{
+          pageNum:1,
+          pageSize:20,
+          searchValue:"",
+        });
+        //获取学院列表
+        listDepartments().then(response => {
+          this.deptSelectList = response.data;
+        });
+        getloginUser().then(response => {
+          this.$set(this,'deptId',response.data.deptId)
+          this.getSubList('');
+        });
+        isSCollege().then(response => {
+          this.$set(this,'userFlg',response.data.userFlg);
+          if(this.userFlg){
+            this.$set(this.queryParams,'subId','')
+          }else{
+            this.$set(this.queryParams,'deptId','')
+          }
+          setTimeout(function(){
+            self.getList();
+          },200);
+        })
+      },
+      //实验室搜索
+      getSubList(val){
+        console.log('val',val)
+        listSubAdmin({deptId:this.deptId,name:val}).then(response => {
+          this.subSelectList = response.data;
+        });
+      },
+      //获取数据列表
+      getList(){
+        let obj = JSON.parse(JSON.stringify(this.queryParams))
+        let objTop = JSON.parse(JSON.stringify(this.queryParams))
+        if(this.dateRange[0]){
+          obj.beginTime = this.dateRange[0];
+          objTop.beginTime = this.dateRange[0];
+        }else{
+          obj.beginTime = "";
+          objTop.beginTime = "";
+        }
+        if(this.dateRange[1]){
+          obj.endTime = this.dateRange[1];
+          objTop.endTime = this.dateRange[1];
+        }else{
+          obj.endTime = "";
+          objTop.endTime = "";
+        }
+        delete objTop.pageNum
+        delete objTop.pageSize
+        if(this.userFlg){
+          //院级
+          hiddenDataItemsSubList(obj).then(response => {
+            this.total = response.data.total;
+            this.tableList = response.data.records;
+          });
+          hiddenDataItemsSubListTop(objTop).then(response => {
+            this.$set(this,'numData',response.data);
+          });
+        }else{
+          //校级
+          dataStatisticsItemsList(obj).then(response => {
+            this.total = response.data.total;
+            this.tableList = response.data.records;
+          });
+          dataStatisticsItemsListTop(objTop).then(response => {
+            this.$set(this,'numData',response.data);
+          });
+        }
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.$set(this.queryParams,'pageNum',1);
+        this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.$set(this,'dateRange',[]);
+        this.$set(this,'queryParams',{
+          pageNum:1,
+          pageSize:20,
+          searchValue:"",
+        });
+        if(this.userFlg){
+          this.$set(this.queryParams,'subId','')
+        }else{
+          this.$set(this.queryParams,'deptId','')
+        }
+        this.handleQuery();
+      },
+      /** 导出按钮操作 */
+      exportButton(item) {
+        let self = this;
+        if(item.command == 1){
+          self.$confirm(`确认导出全部数据?`, "提示", {
+            confirmButtonText: "确定",
+            cancelButtonText: "取消",
+            type: "warning"
+          }).then(async () => {
+
+            if(self.userFlg){
+              self.download('/zd-security/collegCheck/collegeItemsExport/', {}, '检查指标统计-.xlsx')
+            }else{
+              self.download('/zd-security/DataStatistics/itemsExport/', {}, '检查指标统计-.xlsx')
+            }
+          }).catch(() => {})
+        }else if(item.command == 2){
+          let list = self.$refs.multipleTable.selection;
+          let ids = [];
+          for(let i=0;i<list.length;i++){
+            ids.push(list[i].id)
+          }
+          if(ids.length>0) {
+            self.$confirm(`确认导出选中数据?`, "提示", {
+              confirmButtonText: "确定",
+              cancelButtonText: "取消",
+              type: "warning"
+            }).then(async () => {
+              if(self.userFlg){
+                self.download(`/zd-security/collegCheck/collegeItemsExport/?ids=`+ids,{}, '检查指标统计.xlsx')
+                this.$refs.multipleTable.clearSelection();
+              }else{
+                self.download(`/zd-security/DataStatistics/itemsExport/?ids=`+ids,{}, '检查指标统计.xlsx')
+                this.$refs.multipleTable.clearSelection();
+              }
+            }).catch(() => {})
+          }else {
+            this.msgError('请选择要导出的数据')
+          }
+        }
+      },
+      /*===记录勾选数据===
+        需要再el-table 添加  :row-key="getRowKeys"
+        需要在selection 添加 :reserve-selection="true"
+      */
+      getRowKeys(row) {
+        return row.id
+      },
+      // 单选
+      select (selection, row) {
+        if (selection.some(el => { return row.id === el.id })) {
+          if (row.children) {
+            this.setChildren(row.children, true)
+          }
+        } else {
+          if (row.children) {
+            this.setChildren(row.children, false)
+          }
+        }
+      },
+      // 全选
+      selectAll (selection) {
+        const isSelect = selection.some(el => {
+          const tableDataIds = this.tableData.map(j => j.id)
+          return tableDataIds.includes(el.id)
+        })
+        const isCancel = !this.tableData.every(el => {
+          const selectIds = selection.map(j => j.id)
+          return selectIds.includes(el.id)
+        })
+        if (isSelect) {
+          selection.map(el => {
+            if (el.children) {
+              this.setChildren(el.children, true)
+            }
+          })
+        }
+        if (isCancel) {
+          this.tableData.map(el => {
+            if (el.children) {
+              this.setChildren(el.children, false)
+            }
+          })
+        }
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .checkIndexStatistics{
+    flex:1;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+    padding:20px;
+    .form-box{
+      .form-dropdown-box{
+        display: flex;
+        margin:0;
+        padding:0 10px;
+        cursor: pointer;
+        height:40px;
+        img:nth-child(1){
+          width:16px;
+          height:16px;
+          margin-top:12px;
+        }
+        p{
+          width:47px;
+          text-align: center;
+          font-size:14px;
+          margin:0;
+          line-height:40px;
+        }
+        img:nth-child(3){
+          width:10px;
+          height:6px;
+          margin-top:17px;
+        }
+      }
+    }
+    .num-data-box{
+      background: rgba(1,131,250,0.2);
+      color:#0183FA;
+      font-size:14px;
+      line-height:40px;
+      padding:0 20px;
+      border-radius:4px;
+      margin-bottom:20px;
+    }
+  }
+</style>

src/views/safetyCheck/dataStatistics/index.vue

@@ -0,0 +1,111 @@
+<template>
+  <div class="app-container dataStatistics">
+    <div class="title-box">
+      <div :class="pageType == 1?'checkTitle':''" @click="checkTitleButton(1)">
+        <p>按实验室</p>
+        <p></p>
+      </div>
+      <div :class="pageType == 2?'checkTitle':''" @click="checkTitleButton(2)">
+        <p>按安全隐患</p>
+        <p></p>
+      </div>
+      <div :class="pageType == 3?'checkTitle':''" @click="checkTitleButton(3)">
+        <p>按检查指标</p>
+        <p></p>
+      </div>
+      <div :class="pageType == 4?'checkTitle':''" @click="checkTitleButton(4)">
+        <p>按检查内容</p>
+        <p></p>
+      </div>
+    </div>
+    <laboratoryStatistics v-if="pageType == 1"></laboratoryStatistics>
+    <safetyHazardStatistics v-if="pageType == 2"></safetyHazardStatistics>
+    <checkIndexStatistics v-if="pageType == 3" :propsData="propsData"></checkIndexStatistics>
+    <inspectContent v-if="pageType == 4" ></inspectContent>
+  </div>
+</template>
+
+<script>
+  import laboratoryStatistics from './laboratoryStatistics.vue'
+  import safetyHazardStatistics from './safetyHazardStatistics.vue'
+  import checkIndexStatistics from './checkIndexStatistics.vue'
+  import inspectContent from './inspectContent.vue'
+  export default {
+    name: 'index',
+    components: {
+      laboratoryStatistics,
+      safetyHazardStatistics,
+      checkIndexStatistics,
+      inspectContent
+    },
+    data(){
+      return{
+        pageType:1,
+        propsData:{
+          jumpType:false,
+        }
+      }
+    },
+    created(){
+      if(this.$route.query.type){
+        this.$set(this,'pageType',3);
+      }
+    },
+    mounted(){
+
+    },
+    methods:{
+      checkTitleButton(type){
+        if(this.pageType != type){
+          this.$set(this,'pageType',type);
+        }
+      }
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .dataStatistics{
+    flex:1;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+    *{
+      font-weight: 500;
+    }
+    .title-box{
+      display: flex;
+      height:80px;
+      border-bottom:1px solid #d8d8d8;
+      padding:0 40px;
+      div{
+        height:80px;
+        margin-right:80px;
+        cursor: pointer;
+        p:nth-child(1){
+          width:80px;
+          font-size:16px;
+          text-align: center;
+          color:#333;
+          line-height:40px;
+          height:40px;
+          margin-top:20px;
+        }
+        p:nth-child(2){
+          width:60px;
+          height: 4px;
+          border-radius:4px;
+          margin:0 10px;
+        }
+      }
+      .checkTitle{
+        p:nth-child(1){
+          color:#0045AF;
+        }
+        p:nth-child(2){
+          background-color: #0045AF;
+        }
+      }
+    }
+  }
+</style>

src/views/safetyCheck/dataStatistics/inspectContent.vue

@@ -0,0 +1,336 @@
+<!--检查内容统计列表-->
+<template>
+  <div class="safetyHazardStatistics">
+    <el-form :model="queryParams" class="form-box" ref="queryForm" :inline="true">
+      <el-form-item label="" prop="rectifyStatus">
+        <el-select v-model="queryParams.hazardTypeMode" clearable placeholder="全部检查内容">
+          <el-option
+            v-for="item in materialTypeList"
+            :key="item.dictValue"
+            :label="item.dictLabel"
+            :value="item.dictValue">
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="" prop="deptId" label-width="50px">
+        <el-select v-model="queryParams.deptId" @change="handleNodeClick" clearable placeholder="全部学院">
+          <el-option
+            v-for="item in deptSelectList"
+            :key="item.deptId"
+            :label="item.deptName"
+            :value="item.deptId">
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="" prop="subId" label-width="58px">
+        <el-select v-model="queryParams.subId" placeholder="请选择实验室">
+          <el-option
+            v-for="item in subjectOptions"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id">
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="" prop="dateRange" label-width="70px">
+        <el-date-picker
+          :clearable="false"
+          v-model="dateRange"
+          size="small"
+          style="width: 240px"
+          value-format="yyyy-MM-dd"
+          type="daterange"
+          range-separator="-"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+        ></el-date-picker>
+      </el-form-item>
+      <el-form-item>
+        <p class="inquire-button-one" @click="handleQuery" style="margin-right:10px;">查询</p>
+        <p class="reset-button-one" @click="resetQuery">重置</p>
+      </el-form-item>
+      <el-form-item style="float: right;" v-hasPermi="['safety:dataSub:export']">
+        <export-component :exportConfig="exportConfig"></export-component>
+
+      </el-form-item>
+    </el-form>
+    <div class="num-data-box">
+      共搜索到隐患总数 {{numData.numData}}，已整改数 {{numData.sumYzg}}， 未整改数 {{numData.sumWzg}}，整改率 {{numData.rate}}
+    </div>
+    <el-table  border :data="tableList" ref="multipleTable"
+               :row-key="getRowKeys"
+               @select="select" @select-all="selectAll">
+      <el-table-column type="selection" width="50" align="center" fixed/>
+      <el-table-column label="序号" align="center"  type="index" width="60" fixed/>
+      <el-table-column label="检查内容" align="center" prop="hazardName" show-overflow-tooltip width="200" fixed/>
+      <el-table-column label="学院" align="center" prop="collegeName" show-overflow-tooltip width="200" fixed/>
+      <el-table-column label="实验室" align="center" prop="subjectName" show-overflow-tooltip width="180"/>
+      <el-table-column label="隐患总数" align="center" prop="sumTotal" show-overflow-tooltip width="100"/>
+      <el-table-column label="隐患占比" align="center" prop="percent" show-overflow-tooltip width="180"/>
+      <el-table-column label="已整改" align="center" prop="sumYzg" show-overflow-tooltip width="180"/>
+      <el-table-column label="未整改" align="center" prop="sumWzg" show-overflow-tooltip width="180"/>
+      <el-table-column label="整改率" align="center" prop="percent2" show-overflow-tooltip width="180"/>
+    </el-table>
+    <pagination :page-sizes="[20, 30, 40, 50]"
+                v-show="total>0"
+                :total="total"
+                :page.sync="queryParams.pageNum"
+                :limit.sync="queryParams.pageSize"
+                @pagination="getList"
+    />
+  </div>
+</template>
+
+<script>
+  import { listDepartments } from "@/apiDemo/system/dept";
+  import { dataStatisticsContentList,dataStatisticsContentListTop } from "@/apiDemo/safetyCheck/index";
+  import { dangerList } from '@/apiDemo/gasManage3_0/gasManage'
+  import { subjectDictList } from '@/apiDemo/laboratory/record'
+  //            V3
+  import exportComponent from "@/components/exportComponent/exportComponent.vue";
+
+  export default {
+    name: 'safetyHazardStatistics',
+    components: {
+      exportComponent,
+    },
+    data(){
+      return{
+        //导出
+        exportConfig:{
+          api:'/zd-security/DataStatistics/contentExport/',             //导出接口地址
+          ids:'',                                       //勾选导出,勾选的IDS
+          fileName:'检查内容统计',                         //导出文件的命名
+        },
+        deptSelectList:[],
+        materialTypeList:[],
+        subjectOptions:[],
+        levelList:[{label:"一般隐患",key:"2"},{label:"重大隐患",key:"1"},{label:"管理问题",key:"3"}],
+        dateRange:[],
+        queryParams:{
+          pageNum:1,
+          pageSize:20,
+          hazardTypeMode:"",
+          deptId:"",
+          subId:"",
+        },
+        setChildren:"",
+        numData:{},
+        tableList:[],
+        total:0,
+      }
+    },
+    created(){
+
+    },
+    mounted(){
+      this.dangerList();
+      this.initializationInterface();
+      this.getList();
+    },
+    methods:{
+      initializationInterface(){
+        //获取学院列表
+        listDepartments().then(response => {
+          this.deptSelectList = response.data;
+        });
+      },
+      //获取危险源类型
+      dangerList(){
+        let _this=this;
+        dangerList().then( response => {
+          let res=response.rows;
+          _this.materialTypeList=res;
+        });
+      },
+      // 节点单击事件
+      handleNodeClick(data) {
+        this.queryParams.deptId = data;
+        this.getSubjectDictList(data);
+      },
+      /** 查询实验室字典列表 */
+      getSubjectDictList (deptId) {
+        this.subjectOptions = null;
+        this.loading = true;
+        let params = {};
+        params.deptId = deptId;
+        this.queryParams.subId = "";
+        subjectDictList(params).then(response => {
+          this.subjectOptions = response.data;
+          this.loading = false;
+        });
+      },
+      //获取数据列表
+      getList(){
+        let obj = JSON.parse(JSON.stringify(this.queryParams))
+        if(this.dateRange[0]){
+          obj.beginTime = this.dateRange[0];
+        }else{
+          obj.beginTime = "";
+        }
+        if(this.dateRange[1]){
+          obj.endTime = this.dateRange[1];
+        }else{
+          obj.endTime = "";
+        }
+        dataStatisticsContentList(obj).then(response => {
+          this.total = response.data.total;
+          this.tableList = response.data.records;
+        });
+        dataStatisticsContentListTop(obj).then(response => {
+          this.$set(this,'numData',response.data);
+        });
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.$set(this.queryParams,'pageNum',1);
+        this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.$set(this,'dateRange',[]);
+        this.$set(this,'queryParams',{
+          pageNum:1,
+          pageSize:20,
+          hazardTypeMode:"",
+          deptId:"",
+          subId:"",
+        });
+        this.handleQuery();
+      },
+      /** 导出按钮操作 */
+      exportButton(item) {
+        let self = this;
+        if(item.command == 1){
+          self.$confirm(`确认导出全部数据?`, "提示", {
+            confirmButtonText: "确定",
+            cancelButtonText: "取消",
+            type: "warning"
+          }).then(async () => {
+            self.download('/zd-security/DataStatistics/contentExport/', {}, '检查内容统计.xlsx')
+          }).catch(() => {})
+        }else if(item.command == 2){
+          let list = self.$refs.multipleTable.selection;
+          let ids = [];
+          for(let i=0;i<list.length;i++){
+            ids.push(list[i].id)
+          }
+          if(ids.length>0) {
+            self.$confirm(`确认导出选中数据?`, "提示", {
+              confirmButtonText: "确定",
+              cancelButtonText: "取消",
+              type: "warning"
+            }).then(async () => {
+              self.download(`/zd-security/DataStatistics/contentExport/?ids=`+ids,{}, '检查内容统计.xlsx')
+              this.$refs.multipleTable.clearSelection();
+            }).catch(() => {})
+          }else {
+            this.msgError('请选择要导出的数据')
+          }
+        }
+      },
+      /*===记录勾选数据===
+        需要再el-table 添加  :row-key="getRowKeys"
+        需要在selection 添加 :reserve-selection="true"
+      */
+      getRowKeys(row) {
+        return row.id
+      },
+      // 单选
+      select (selection, row) {
+        if (selection.some(el => { return row.id === el.id })) {
+          if (row.children) {
+            this.setChildren(row.children, true)
+          }
+        } else {
+          if (row.children) {
+            this.setChildren(row.children, false)
+          }
+        }
+      },
+      // 全选
+      selectAll (selection) {
+        const isSelect = selection.some(el => {
+          const tableDataIds = this.tableData.map(j => j.id)
+          return tableDataIds.includes(el.id)
+        })
+        const isCancel = !this.tableData.every(el => {
+          const selectIds = selection.map(j => j.id)
+          return selectIds.includes(el.id)
+        })
+        if (isSelect) {
+          selection.map(el => {
+            if (el.children) {
+              this.setChildren(el.children, true)
+            }
+          })
+        }
+        if (isCancel) {
+          this.tableData.map(el => {
+            if (el.children) {
+              this.setChildren(el.children, false)
+            }
+          })
+        }
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  ::v-deep .el-table__body-wrapper{
+    padding-bottom: 8px;
+  }
+  ::v-deep .el-table__fixed{
+    margin-top:-1px;
+    margin-left:-1px;
+    height:calc(100% - 8px)!important;
+  }
+  ::v-deep .el-table__fixed-body-wrapper{
+    height: calc(100% - 48px);
+    overflow-y: auto;
+  }
+  .safetyHazardStatistics{
+    flex:1;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+    padding:20px;
+    .form-box{
+      .form-dropdown-box{
+        display: flex;
+        margin:0;
+        padding:0 10px;
+        cursor: pointer;
+        height:40px;
+        img:nth-child(1){
+          width:16px;
+          height:16px;
+          margin-top:12px;
+        }
+        p{
+          width:47px;
+          text-align: center;
+          font-size:14px;
+          margin:0;
+          line-height:40px;
+        }
+        img:nth-child(3){
+          width:10px;
+          height:6px;
+          margin-top:17px;
+        }
+      }
+    }
+    .num-data-box{
+      background: rgba(1,131,250,0.2);
+      color:#0183FA;
+      font-size:14px;
+      line-height:40px;
+      padding:0 20px;
+      border-radius:4px;
+      margin-bottom:20px;
+    }
+
+  }
+</style>

src/views/safetyCheck/dataStatistics/laboratoryStatistics.vue

@@ -0,0 +1,333 @@
+<!--实验室统计列表-->
+<template>
+  <div class="laboratoryStatistics">
+    <el-form :model="queryParams" class="form-box" ref="queryForm" :inline="true">
+      <el-form-item label="" prop="deptId" label-width="50px">
+        <el-select v-model="queryParams.deptId" clearable placeholder="全部">
+          <el-option
+            v-for="item in deptSelectList"
+            :key="item.deptId"
+            :label="item.deptName"
+            :value="item.deptId">
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="" prop="typeId">
+        <el-select v-model="queryParams.typeId" clearable placeholder="安全分类" style="width: 120px">
+          <el-option
+            v-for="item in classTypeList"
+            :key="item.id"
+            :label="item.typeName"
+            :value="item.id">
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="" prop="level">
+        <el-select v-model="queryParams.level" clearable placeholder="安全分级" style="width: 120px">
+          <el-option
+            v-for="item in classifiedList"
+            :key="item.id"
+            :label="item.classifiedName"
+            :value="item.id">
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="" prop="searchValue" label-width="80px">
+        <el-input
+          maxLength="30"
+          v-model="queryParams.searchValue"
+          placeholder="实验室/房间号"
+          clearable
+          style="width: 200px"/>
+      </el-form-item>
+      <!--<el-form-item label="" prop="dateRange" label-width="70px">-->
+        <!--<el-date-picker-->
+          <!--:clearable="false"-->
+          <!--v-model="dateRange"-->
+          <!--size="small"-->
+          <!--style="width: 240px"-->
+          <!--value-format="yyyy-MM-dd"-->
+          <!--type="daterange"-->
+          <!--range-separator="-"-->
+          <!--start-placeholder="开始日期"-->
+          <!--end-placeholder="结束日期"-->
+        <!--&gt;</el-date-picker>-->
+      <!--</el-form-item>-->
+      <el-form-item>
+        <p class="inquire-button-one" @click="handleQuery" style="margin-right:10px;">查询</p>
+        <p class="reset-button-one" @click="resetQuery">重置</p>
+      </el-form-item>
+      <el-form-item style="float: right;" v-hasPermi="['safety:dataSub:export']">
+        <export-component :exportConfig="exportConfig"></export-component>
+      </el-form-item>
+    </el-form>
+    <div class="num-data-box">
+      搜索到实验室总数 {{numData.sumTotal}}，存在危险源的实验室数 {{numData.hazardSubjectTotal}}，危险源总数 {{numData.hazardTotal}}<span v-for="item in numData.classListVo">，{{item.levelName}} {{item.amount}}</span>
+    </div>
+    <el-table  border :data="tableList" ref="multipleTable"
+               tooltip-effect="dark" :row-key="getRowKeys"
+               @select="select" @select-all="selectAll">
+      <el-table-column type="selection" width="50" align="center" fixed/>
+      <el-table-column label="序号" align="center"  type="index" width="60" fixed/>
+      <el-table-column label="学院" align="center" prop="collegeName" show-overflow-tooltip width="200" fixed/>
+      <el-table-column label="实验室" align="center" prop="subjectName" show-overflow-tooltip width="180" fixed/>
+      <el-table-column label="房间号" align="center" prop="roomNumber" show-overflow-tooltip width="100"/>
+      <el-table-column label="楼栋" align="center" prop="buildName" show-overflow-tooltip width="180"/>
+      <el-table-column label="安全分类" align="center" prop="typeName" show-overflow-tooltip width="100"/>
+      <el-table-column label="安全分级" align="center" prop="levelName" show-overflow-tooltip width="100"/>
+      <el-table-column label="危险源" align="center" prop="hazardName" show-overflow-tooltip width="260"/>
+      <el-table-column label="实验室安全责任人" align="center" prop="safeUserNameAdminPhone" show-overflow-tooltip width="185"/>
+      <el-table-column label="实验室负责人" align="center" prop="adminNameAndPhone" show-overflow-tooltip width="180"/>
+      <el-table-column label="隐患总数" align="center" prop="dangerNum" show-overflow-tooltip width="100"/>
+      <el-table-column label="整改率" align="center" prop="percent" show-overflow-tooltip width="100"/>
+      <el-table-column label="复核通过率" align="center" prop="percent2" show-overflow-tooltip width="100"/>
+    </el-table>
+    <pagination :page-sizes="[20, 30, 40, 50]"
+                v-show="total>0"
+                :total="total"
+                :page.sync="queryParams.pageNum"
+                :limit.sync="queryParams.pageSize"
+                @pagination="getList"
+    />
+  </div>
+</template>
+
+<script>
+  import { listDepartments } from "@/apiDemo/system/dept";
+  import { listClassifiedAll } from "@/apiDemo/laboratory/classified";
+  import { listClasstypeAll } from "@/apiDemo/laboratory/classtype";
+  import { dataStatisticsSubList,dataStatisticsSubListTop } from "@/apiDemo/safetyCheck/index";
+  //            V3
+  import exportComponent from "@/components/exportComponent/exportComponent.vue";
+
+  export default {
+    name: 'laboratoryStatistics',
+    components: {
+      exportComponent,
+    },
+    data(){
+      return{
+        //导出
+        exportConfig:{
+          api:'/zd-security/DataStatistics/subExport/',             //导出接口地址
+          ids:'',                                       //勾选导出,勾选的IDS
+          fileName:'实验室统计',                         //导出文件的命名
+        },
+        deptSelectList:[],
+        classTypeList:[],
+        classifiedList:[],
+        dateRange:[],
+        queryParams:{
+          pageNum:1,
+          pageSize:20,
+          searchValue:"",
+          deptId:"",
+          typeId:"",
+          level:""
+        },
+        setChildren:"",
+        numData:{},
+        tableList:[],
+        total:0,
+      }
+    },
+    created(){
+
+    },
+    mounted(){
+      this.initializationInterface();
+      this.getList();
+    },
+    methods:{
+      initializationInterface(){
+        //获取学院列表
+        listDepartments().then(response => {
+          this.deptSelectList = response.data;
+        });
+        /**获取分级*/
+        listClassifiedAll().then(response=>{
+          this.classifiedList = response.data
+        })
+        /**获取分类*/
+        listClasstypeAll().then(response=>{
+          this.classTypeList = response.data;
+        });
+      },
+      //获取数据列表
+      getList(){
+        let obj = JSON.parse(JSON.stringify(this.queryParams))
+        if(this.dateRange[0]){
+          obj.beginTime = this.dateRange[0];
+        }else{
+          obj.beginTime = "";
+        }
+        if(this.dateRange[1]){
+          obj.endTime = this.dateRange[1];
+        }else{
+          obj.endTime = "";
+        }
+        dataStatisticsSubList(obj).then(response => {
+          this.total = response.data.total;
+          this.tableList = response.data.records;
+        });
+        dataStatisticsSubListTop(obj).then(response => {
+          this.$set(this,'numData',response.data);
+        });
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.$set(this.queryParams,'pageNum',1);
+        this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.$set(this,'dateRange',[]);
+        this.$set(this,'queryParams',{
+          pageNum:1,
+          pageSize:20,
+          searchValue:"",
+          deptId:"",
+          typeId:"",
+          level:""
+        });
+        this.handleQuery();
+      },
+      /** 导出按钮操作 */
+      exportButton(item) {
+        let self = this;
+        if(item.command == 1){
+          self.$confirm(`确认导出全部数据?`, "提示", {
+            confirmButtonText: "确定",
+            cancelButtonText: "取消",
+            type: "warning"
+          }).then(async () => {
+            self.download('/zd-security/DataStatistics/subExport/', {}, '实验室统计-.xlsx')
+          }).catch(() => {})
+        }else if(item.command == 2){
+          let list = self.$refs.multipleTable.selection;
+          let ids = [];
+          for(let i=0;i<list.length;i++){
+            ids.push(list[i].subId)
+          }
+          console.log('list',list);
+          console.log('ids',ids);
+          if(ids.length>0) {
+            self.$confirm(`确认导出选中数据?`, "提示", {
+              confirmButtonText: "确定",
+              cancelButtonText: "取消",
+              type: "warning"
+            }).then(async () => {
+              self.download(`/zd-security/DataStatistics/subExport/?ids=`+ids,{}, '实验室统计.xlsx')
+              this.$refs.multipleTable.clearSelection();
+            }).catch(() => {})
+          }else {
+            this.msgError('请选择要导出的数据')
+          }
+        }
+      },
+      /*===记录勾选数据===
+        需要再el-table 添加  :row-key="getRowKeys"
+        需要在selection 添加 :reserve-selection="true"
+      */
+      getRowKeys(row) {
+        return row.id
+      },
+      // 单选
+      select (selection, row) {
+        console.log('selection',selection)
+        console.log('row',row)
+        if (selection.some(el => { return row.id === el.id })) {
+          if (row.children) {
+            this.setChildren(row.children, true)
+          }
+        } else {
+          if (row.children) {
+            this.setChildren(row.children, false)
+          }
+        }
+      },
+      // 全选
+      selectAll (selection) {
+        const isSelect = selection.some(el => {
+          const tableDataIds = this.tableData.map(j => j.id)
+          return tableDataIds.includes(el.id)
+        })
+        const isCancel = !this.tableData.every(el => {
+          const selectIds = selection.map(j => j.id)
+          return selectIds.includes(el.id)
+        })
+        if (isSelect) {
+          selection.map(el => {
+            if (el.children) {
+              this.setChildren(el.children, true)
+            }
+          })
+        }
+        if (isCancel) {
+          this.tableData.map(el => {
+            if (el.children) {
+              this.setChildren(el.children, false)
+            }
+          })
+        }
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  ::v-deep .el-table__body-wrapper{
+    padding-bottom: 8px;
+  }
+  ::v-deep .el-table__fixed{
+    margin-top:-1px;
+    margin-left:-1px;
+    height:calc(100% - 8px)!important;
+  }
+  ::v-deep .el-table__fixed-body-wrapper{
+    height: calc(100% - 48px);
+    overflow-y: auto;
+  }
+  .laboratoryStatistics{
+    flex:1;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+    padding:20px;
+    .form-box{
+      .form-dropdown-box{
+        display: flex;
+        margin:0;
+        padding:0 10px;
+        cursor: pointer;
+        height:40px;
+        img:nth-child(1){
+          width:16px;
+          height:16px;
+          margin-top:12px;
+        }
+        p{
+          width:47px;
+          text-align: center;
+          font-size:14px;
+          margin:0;
+          line-height:40px;
+        }
+        img:nth-child(3){
+          width:10px;
+          height:6px;
+          margin-top:17px;
+        }
+      }
+    }
+    .num-data-box{
+      background: rgba(1,131,250,0.2);
+      color:#0183FA;
+      font-size:14px;
+      line-height:40px;
+      padding:0 20px;
+      border-radius:4px;
+      margin-bottom:20px;
+    }
+  }
+</style>

src/views/safetyCheck/dataStatistics/safetyHazardStatistics.vue

@@ -0,0 +1,334 @@
+<!--安全隐患统计列表-->
+<template>
+  <div class="safetyHazardStatistics">
+    <el-form :model="queryParams" class="form-box" ref="queryForm" :inline="true">
+      <el-form-item label="" prop="deptId" label-width="50px">
+        <el-select v-model="queryParams.deptId" clearable placeholder="全部">
+          <el-option
+            v-for="item in deptSelectList"
+            :key="item.deptId"
+            :label="item.deptName"
+            :value="item.deptId">
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="" prop="rectifyStatus">
+        <el-select v-model="queryParams.rectifyStatus" clearable placeholder="全部状态" style="width: 120px">
+          <el-option
+            v-for="item in typeList"
+            :key="item.key"
+            :label="item.label"
+            :value="item.key">
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="" prop="hdLevel">
+        <el-select v-model="queryParams.hdLevel" clearable placeholder="全部隐患等级" style="width: 140px">
+          <el-option
+            v-for="item in levelList"
+            :key="item.key"
+            :label="item.label"
+            :value="item.key">
+          </el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="" prop="searchValue" label-width="80px">
+        <el-input
+          maxLength="30"
+          v-model="queryParams.searchValue"
+          placeholder="计划任务/实验室/房间号"
+          clearable
+          style="width: 200px"/>
+      </el-form-item>
+      <el-form-item label="" prop="dateRange" label-width="70px">
+        <el-date-picker
+          :clearable="false"
+          v-model="dateRange"
+          size="small"
+          style="width: 240px"
+          value-format="yyyy-MM-dd"
+          type="daterange"
+          range-separator="-"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+        ></el-date-picker>
+      </el-form-item>
+      <el-form-item>
+        <p class="inquire-button-one" @click="handleQuery" style="margin-right:10px;">查询</p>
+        <p class="reset-button-one" @click="resetQuery">重置</p>
+      </el-form-item>
+      <el-form-item style="float: right;" v-hasPermi="['safety:dataSub:export']">
+        <export-component :exportConfig="exportConfig"></export-component>
+      </el-form-item>
+    </el-form>
+    <div class="num-data-box">
+      共搜索到隐患总数 {{numData.sumTotal}}，重大隐患数 {{numData.zdHazardTotal}}，一般隐患数 {{numData.ybHazardTotal}}，管理问题数 {{numData.glHazardTotal}} ，待整改总数 {{numData.rectifiedTotal}}，复核总数 {{numData.resultTotal}}，复核通过率 {{numData.rate}}
+    </div>
+    <el-table  border :data="tableList" ref="multipleTable"
+               :row-key="getRowKeys"
+               @select="select" @select-all="selectAll">
+      <el-table-column type="selection" width="50" align="center" fixed/>
+      <el-table-column label="序号" align="center"  type="index" width="60" fixed/>
+      <el-table-column label="计划任务" align="center" prop="title" show-overflow-tooltip width="200" fixed/>
+      <el-table-column label="学院" align="center" prop="collegeName" show-overflow-tooltip width="200" fixed/>
+      <el-table-column label="实验室" align="center" prop="subjectName" show-overflow-tooltip width="180"/>
+      <el-table-column label="房间号" align="center" prop="subRoom" show-overflow-tooltip width="100"/>
+      <el-table-column label="楼栋" align="center" prop="buildName" show-overflow-tooltip width="180"/>
+      <el-table-column label="隐患等级" align="center" prop="hazardLevel" show-overflow-tooltip width="100">
+        <template slot-scope="scope">
+          {{scope.row.hazardLevel==1?'重大隐患':(scope.row.hazardLevel==2?'一般隐患':(scope.row.hazardLevel==3?'管理问题':''))}}
+        </template>
+      </el-table-column>
+      <el-table-column label="不符合项" align="center" prop="hazardCheckPoint" show-overflow-tooltip width="260">
+        <template slot-scope="scope">
+          <span>{{scope.row.hazardCheckCode}}</span>
+          <span v-if="scope.row.checkCategory==1">{{scope.row.hazardCheckPoint}}</span>
+          <span v-if="scope.row.checkCategory!=1">{{scope.row.hazardCheckName}}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="历史出现次数" align="center" prop="sumTotal" show-overflow-tooltip width="120"/>
+      <el-table-column label="隐患描述" align="center" prop="hazardDescribe" show-overflow-tooltip width="180"/>
+      <el-table-column label="检查者" align="center" prop="checkUser" show-overflow-tooltip width="100"/>
+      <el-table-column label="检查时间" align="center" prop="checkTime2" show-overflow-tooltip width="180"/>
+      <el-table-column label="状态" align="center" prop="rectifyStatus" show-overflow-tooltip width="100">
+        <template slot-scope="scope">
+          {{scope.row.rectifyStatus==1?'复核完毕':(scope.row.rectifyStatus==2?'未整改':(scope.row.rectifyStatus==3?'已整改':(scope.row.rectifyStatus==4?'暂无法整改':'')))}}
+        </template>
+      </el-table-column>
+    </el-table>
+    <pagination :page-sizes="[20, 30, 40, 50]"
+                v-show="total>0"
+                :total="total"
+                :page.sync="queryParams.pageNum"
+                :limit.sync="queryParams.pageSize"
+                @pagination="getList"
+    />
+  </div>
+</template>
+
+<script>
+  import { listDepartments } from "@/apiDemo/system/dept";
+  import { dataStatisticsHazardList,dataStatisticsHazardListTop } from "@/apiDemo/safetyCheck/index";
+  //            V3
+  import exportComponent from "@/components/exportComponent/exportComponent.vue";
+
+  export default {
+    name: 'safetyHazardStatistics',
+    components: {
+      exportComponent,
+    },
+    data(){
+      return{
+        //导出
+        exportConfig:{
+          api:'/zd-security/DataStatistics/hazardExport/',             //导出接口地址
+          ids:'',                                       //勾选导出,勾选的IDS
+          fileName:'安全隐患统计',                         //导出文件的命名
+        },
+        deptSelectList:[],
+        typeList:[{label:"未整改",key:"2"},{label:"已整改",key:"3"},{label:"暂无法整改",key:"4"},{label:"复核完毕",key:"1"}],
+        levelList:[{label:"一般隐患",key:"2"},{label:"重大隐患",key:"1"},{label:"管理问题",key:"3"}],
+        dateRange:[],
+        queryParams:{
+          pageNum:1,
+          pageSize:20,
+          searchValue:"",
+          deptId:"",
+          rectifyStatus:"",
+          hdLevel:"",
+        },
+        setChildren:"",
+        numData:{},
+        tableList:[],
+        total:0,
+      }
+    },
+    created(){
+
+    },
+    mounted(){
+      this.initializationInterface();
+      this.getList();
+    },
+    methods:{
+      initializationInterface(){
+        //获取学院列表
+        listDepartments().then(response => {
+          this.deptSelectList = response.data;
+        });
+      },
+      //获取数据列表
+      getList(){
+        let obj = JSON.parse(JSON.stringify(this.queryParams))
+        if(this.dateRange[0]){
+          obj.beginTime = this.dateRange[0];
+        }else{
+          obj.beginTime = "";
+        }
+        if(this.dateRange[1]){
+          obj.endTime = this.dateRange[1];
+        }else{
+          obj.endTime = "";
+        }
+        dataStatisticsHazardList(obj).then(response => {
+          this.total = response.data.total;
+          this.tableList = response.data.records;
+        });
+        dataStatisticsHazardListTop(obj).then(response => {
+          this.$set(this,'numData',response.data);
+        });
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.$set(this.queryParams,'pageNum',1);
+        this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.$set(this,'dateRange',[]);
+        this.$set(this,'queryParams',{
+          pageNum:1,
+          pageSize:20,
+          searchValue:"",
+          deptId:"",
+          rectifyStatus:"",
+          hdLevel:"",
+        });
+        this.handleQuery();
+      },
+      /** 导出按钮操作 */
+      exportButton(item) {
+        let self = this;
+        if(item.command == 1){
+          self.$confirm(`确认导出全部数据?`, "提示", {
+            confirmButtonText: "确定",
+            cancelButtonText: "取消",
+            type: "warning"
+          }).then(async () => {
+            self.download('/zd-security/DataStatistics/hazardExport/', {}, '安全隐患统计.xlsx')
+          }).catch(() => {})
+        }else if(item.command == 2){
+          let list = self.$refs.multipleTable.selection;
+          let ids = [];
+          for(let i=0;i<list.length;i++){
+            ids.push(list[i].id)
+          }
+          if(ids.length>0) {
+            self.$confirm(`确认导出选中数据?`, "提示", {
+              confirmButtonText: "确定",
+              cancelButtonText: "取消",
+              type: "warning"
+            }).then(async () => {
+              self.download(`/zd-security/DataStatistics/hazardExport/?ids=`+ids,{}, '安全隐患统计.xlsx')
+              this.$refs.multipleTable.clearSelection();
+            }).catch(() => {})
+          }else {
+            this.msgError('请选择要导出的数据')
+          }
+        }
+      },
+      /*===记录勾选数据===
+        需要再el-table 添加  :row-key="getRowKeys"
+        需要在selection 添加 :reserve-selection="true"
+      */
+      getRowKeys(row) {
+        return row.id
+      },
+      // 单选
+      select (selection, row) {
+        if (selection.some(el => { return row.id === el.id })) {
+          if (row.children) {
+            this.setChildren(row.children, true)
+          }
+        } else {
+          if (row.children) {
+            this.setChildren(row.children, false)
+          }
+        }
+      },
+      // 全选
+      selectAll (selection) {
+        const isSelect = selection.some(el => {
+          const tableDataIds = this.tableData.map(j => j.id)
+          return tableDataIds.includes(el.id)
+        })
+        const isCancel = !this.tableData.every(el => {
+          const selectIds = selection.map(j => j.id)
+          return selectIds.includes(el.id)
+        })
+        if (isSelect) {
+          selection.map(el => {
+            if (el.children) {
+              this.setChildren(el.children, true)
+            }
+          })
+        }
+        if (isCancel) {
+          this.tableData.map(el => {
+            if (el.children) {
+              this.setChildren(el.children, false)
+            }
+          })
+        }
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  ::v-deep .el-table__body-wrapper{
+    padding-bottom: 8px;
+  }
+  ::v-deep .el-table__fixed{
+    margin-top:-1px;
+    margin-left:-1px;
+    height:calc(100% - 8px)!important;
+  }
+  ::v-deep .el-table__fixed-body-wrapper{
+    height: calc(100% - 48px);
+    overflow-y: auto;
+  }
+  .safetyHazardStatistics{
+    flex:1;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+    padding:20px;
+    .form-box{
+      .form-dropdown-box{
+        display: flex;
+        margin:0;
+        padding:0 10px;
+        cursor: pointer;
+        height:40px;
+        img:nth-child(1){
+          width:16px;
+          height:16px;
+          margin-top:12px;
+        }
+        p{
+          width:47px;
+          text-align: center;
+          font-size:14px;
+          margin:0;
+          line-height:40px;
+        }
+        img:nth-child(3){
+          width:10px;
+          height:6px;
+          margin-top:17px;
+        }
+      }
+    }
+    .num-data-box{
+      background: rgba(1,131,250,0.2);
+      color:#0183FA;
+      font-size:14px;
+      line-height:40px;
+      padding:0 20px;
+      border-radius:4px;
+      margin-bottom:20px;
+    }
+
+  }
+</style>

src/views/safetyCheck/equipmentConfig/index.vue

@@ -0,0 +1,427 @@
+<!--设备检查配置-->
+<template>
+  <div class="app-container approval_handle">
+    <div class="approval_handle-page" v-if="pageType == 1">
+      <el-form :model="queryParams" ref="queryForm" style="margin-top:20px;" :inline="true">
+        <el-form-item label="类型:" prop="checkLevel">
+          <el-select  v-model="queryParams.hazardType" placeholder="请选择类型">
+            <el-option
+              v-for="item in dangerArr"
+              :key="item.dictValue"
+              :label="item.dictLabel"
+              :value="item.dictValue">
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="关键字" prop="name">
+          <el-input
+            v-model="queryParams.searchValue"
+            placeholder="名称/型号"
+            clearable
+            maxLength="30"
+            size="small"
+          />
+        </el-form-item>
+        <el-form-item>
+          <p class="inquire-button-one" @click="handleQuery">查询</p>
+          <p class="reset-button-one" @click="resetQuery">重置</p>
+        </el-form-item>
+        <el-form-item style="float: right;">
+          <p class="inquire-button-one" v-hasPermi="['check:device:add']" style="width:120px;" @click="handleClick('','','add')">+ 新增检查内容</p>
+        </el-form-item>
+      </el-form>
+      <el-table border v-loading="loading" :data="tableData">
+        <el-table-column label="序号"  width="100" align="left"  type="index"/>
+        <el-table-column label="类型" align="left" prop="dictLabel"/>
+        <el-table-column label="名称" align="left" prop="anotherName"></el-table-column>
+        <el-table-column label="型号" align="left" prop="anotherCode"></el-table-column>
+        <el-table-column label="检查项目数" align="left" prop="checkNum"></el-table-column>
+        <el-table-column label="编辑人" align="left" prop="createName"></el-table-column>
+        <el-table-column label="编辑时间" align="left" prop="createTimeStr"></el-table-column>
+        <el-table-column label="操作" width="180">
+          <template slot-scope="scope">
+            <div class="table-button-box">
+              <p class="table-button-null"></p>
+              <p class="table-button-p" v-hasPermi="['check:device:query']" @click="handleClick('',scope.row,'detail')">详情</p>
+              <p class="table-button-p" v-hasPermi="['check:device:edit']" @click="handleClick('',scope.row,'edit')">编辑</p>
+              <p class="table-button-p" v-hasPermi="['check:device:remove']" @click="handleClick('',scope.row,'delete')">删除</p>
+              <p class="table-button-null"></p>
+            </div>
+          </template>
+        </el-table-column>
+      </el-table>
+      <pagination :page-sizes="[20, 30, 40, 50]"
+                  :total="total"
+                  layout="total, prev, pager, next, sizes, jumper"
+                  :page.sync="queryParams.pageNum"
+                  :limit.sync="queryParams.pageSize"
+                  @pagination="getList"
+      />
+    </div>
+    <!--添加窗口-->
+    <el-dialog :title="addDialogTitle" :visible.sync="addDialogType" @close="addDialogOff" width="780px" append-to-body class="checkItemLibrary-dialog-box"
+               :close-on-click-modal="false">
+      <el-form ref="addDialogForm" :model="addDialogForm" :rules="rules" label-width="120px">
+        <el-form-item label="检查内容:" prop="joinHazardReid">
+          <el-select  v-model="addDialogForm.joinHazardReid" clearable placeholder="请选择检查项" :disabled="isDetail" style="width:548px;">
+            <el-option
+              v-for="item in materialTypeList"
+              :key="item.id"
+              :label="item.anotherName"
+              :value="item.id">
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <div class="small_title">对应检查项目</div>
+        <el-form-item label="检查类目" prop="joinCheckOpList" v-if="!isDetail">
+          <el-cascader
+            style="width:548px;"
+            v-model="addDialogForm.joinCheckOpList"
+            :options="cascaderData"
+            :props="{ multiple: true, value: 'id', label: 'labelName',emitPath:false }"
+            @change="cascaderCheck">
+            <template slot-scope="{data}">
+              <el-tooltip :content="data.labelName" v-if="data.labelName.length>22">
+                <p style="max-width:300px;overflow: hidden;text-overflow:ellipsis;white-space:nowrap;">{{data.labelName}}</p>
+              </el-tooltip>
+              <p v-else style="max-width:300px;overflow: hidden;text-overflow:ellipsis;white-space:nowrap;">{{data.labelName}}</p>
+            </template>
+          </el-cascader>
+        </el-form-item>
+        <div style="height: 300px;overflow-y: auto">
+          <el-form-item label="">
+            <el-tree
+              ref="tree"
+              :data="cascaderTreeData"
+              :props="defaultProps"
+              show-checkbox
+              node-key="id"
+              default-expand-all
+              :default-checked-keys="cascaderCheckedData"
+              >
+            </el-tree>
+          </el-form-item>
+        </div>
+
+      </el-form>
+      <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="addDialogOff">取消</p>
+        <p class="dialog-footer-button-primary" @click="upDataButton">确定</p>
+        <p class="dialog-footer-button-null"></p>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { dangerList, gasApplyDetail, gasApplyList } from '@/apiDemo/gasManage3_0/gasManage'
+import { getToken } from "@/utils/auth";
+import {
+  checkOptionAdd,
+  checkOptionList,
+  checkOptionUpdate,
+  checkDeviceList,
+  checkDeviceAdd,
+  inspectContentList, checkDeviceDetail, checkDeviceEdit, checkDeviceDelete, checkOptionDelete
+} from '@/apiDemo/safetyCheck'
+import { delCertificate } from '@/apiDemo/exam/certificate'
+import { delHxpChemicalInfo } from '@/apiDemo/medicUniversity-3_1'
+export default {
+  name: "Approval",
+  components: {
+
+  },
+  data() {
+    return {
+      //页面状态
+      pageType:1,
+      loading:false,
+      headers: {
+        Authorization: "Bearer " + getToken()
+      },
+      // 查询参数
+      queryParams: {
+        pageNum: 1,
+        pageSize:20,
+        hazardType:'',
+        searchValue:'',
+      },
+      total:0,
+      tableData:[{}],
+      dateRange:[],
+      pageData2:{},
+      addDialogTitle:'新增检查项',
+      addDialogType:false,
+      addDialogForm:{
+        joinHazardReid:'',
+        joinCheckOpList:[],
+      },
+      //检查项
+      cascaderData:[],
+      cascaderTreeData:[],
+      cascaderDataPrimitive:[],
+      dangerArr:[],//危险源类型
+      materialTypeList:[],//检查内容
+      // 表单校验
+      rules: {
+        joinCheckOpList: [
+          { required: true, message: "请选择", trigger: "blur" },
+          { required: true, message: "请选择", validator: this.spaceJudgment, trigger: "blur" }
+        ],
+        joinHazardReid: [
+          { required: true, message: "请输入检查项目内容", trigger: "blur" },
+          { required: true, message: "请输入检查项目内容", validator: this.spaceJudgment, trigger: "blur" }
+        ],
+      },
+
+      defaultProps: {
+        children: 'children',
+        label: 'labelName'
+      },
+      cascaderCheckedData:[],//检查类目树回显
+      isDetail:false,
+    }
+
+  },
+  methods: {
+
+    handleClick(index,row,doType){
+      let _this=this;
+      if(doType=='add'){//新增
+        this.isDetail=false;
+        this.$set(this,'addDialogType',true);
+        this.$set(this,'addDialogTitle','新增检查项');
+        this.inspectContentList()//检查内容
+        this.$nextTick(function () {
+          //Dom更新完毕
+          this.$refs.tree.setCheckedKeys([]);
+        });
+      }else if(doType=='detail'){//详情
+        this.isDetail=true;
+        this.$set(this,'addDialogType',true);
+        this.$set(this,'addDialogTitle','编辑检查项');
+        this.getInfo(row.id)
+        this.inspectContentList(row.id)//检查内容
+        this.$nextTick(function () {
+          //Dom更新完毕
+          this.$refs.tree.setCheckedKeys([]);
+        });
+      }else if(doType=='edit'){//编辑
+        this.isDetail=false;
+        this.$set(this,'addDialogType',true);
+        this.$set(this,'addDialogTitle','编辑检查项');
+        this.getInfo(row.id)
+        this.inspectContentList(row.id)//检查内容
+        this.$nextTick(function () {
+          //Dom更新完毕
+          this.$refs.tree.setCheckedKeys([]);
+        });
+
+      }else if(doType=='delete'){//删除
+        this.$confirm('是否确认删除?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(() => {
+          checkDeviceDelete(row.id).then(response => {
+            if(response.code == 200){
+              this.getList();
+              this.msgSuccess("删除成功");
+            }
+          });
+        }).catch(() => {});
+      }
+    },
+    //添加页面关闭
+    addDialogOff(){
+      this.$set(this.addDialogForm,'joinCheckOpList',null);
+      this.$set(this.addDialogForm,'joinHazardReid','');
+      this.$set(this,'addDialogType',false);
+    },
+    //联级选中
+    cascaderCheck(val){
+
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNum = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.queryParams.searchValue = "";
+      this.queryParams.hazardType='',
+        this.handleQuery();
+    },
+    /** 查询检查项选项列表 */
+    checkOptionList() {
+      this.loading = true;
+      checkOptionList(this.queryParams).then( response => {
+        let list=JSON.parse(JSON.stringify(response.data))
+        this.$set(this,'cascaderData',list);
+        this.$set(this,'cascaderTreeData',JSON.parse(JSON.stringify(list)));
+        this.$set(this,'cascaderDataPrimitive',JSON.parse(JSON.stringify(list)));
+        this.getCascaderData(this.cascaderData);
+        this.getCascaderTreeData(this.cascaderTreeData);
+        this.loading = false;
+      });
+    },
+    //联级选择器数据处理
+    getCascaderData(list){
+      let self = this;
+      for(let i=0;i<list.length;i++){
+        list[i].labelName = list[i].code? list[i].code +' '+ list[i].name:list[i].name
+        if(list[i].level == 1 || list[i].level == 2 || list[i].level == 3){
+          self.getCascaderData(list[i].children)
+        }else{
+          delete list[i].children
+        }
+      }
+    },
+    //树形选择器数据处理
+    getCascaderTreeData(list){
+      let self = this;
+      for(let i=0;i<list.length;i++){
+        list[i].labelName = list[i].code? list[i].code +' '+ list[i].name:list[i].name
+        list[i].disabled = true;
+        if(list[i].level == 1 || list[i].level == 2 || list[i].level == 3){
+          self.getCascaderTreeData(list[i].children)
+        }else{
+          delete list[i].children
+        }
+      }
+    },
+    //获取危险源类型
+    dangerList(){
+      let _this=this;
+      dangerList().then( response => {
+        let res=response.rows;
+        _this.dangerArr=res;
+      });
+    },
+    //检查内容
+    inspectContentList(joinHazardReid){
+      let _this=this;
+      if(joinHazardReid){//编辑的时候
+        inspectContentList({joinHazardReid:joinHazardReid}).then( response => {
+          let res=response.data;
+          _this.materialTypeList=res;
+        });
+      }else{//新增的时候
+        inspectContentList().then( response => {
+          let res=response.data;
+          _this.materialTypeList=res;
+        });
+      }
+
+    },
+    //详情
+    getInfo(id){
+      let _this=this;
+      checkDeviceDetail(({id:id})).then( response => {
+        let res=response.data;
+        if(response.code==200){
+          let list=[];
+          this.addDialogForm.joinHazardReOldid=res.hazardId;
+          this.addDialogForm.joinHazardReid=res.hazardId;
+          res.checkList.forEach(function(item) {
+            list.push(item.joinCheckOpid)
+          })
+          this.addDialogForm.joinCheckOpList=list
+          this.cascaderCheckedData=list
+        }
+      });
+    },
+    //列表
+    getList(){
+      let _this=this;
+      checkDeviceList(_this.queryParams).then( response => {
+        let res=response.data.records;
+        _this.tableData=res;
+        _this.total=response.data.total;
+      });
+    },
+    //新增编辑
+    upDataButton(){
+      this.$refs["addDialogForm"].validate(valid => {
+        if (valid) {
+          if(this.addDialogForm.joinHazardReOldid){
+            //编辑
+            let obj={
+              joinHazardReOldid:JSON.parse(JSON.stringify(this.addDialogForm)).joinHazardReOldid,
+              joinHazardReid:JSON.parse(JSON.stringify(this.addDialogForm)).joinHazardReid,
+              joinCheckOpList:JSON.parse(JSON.stringify(this.addDialogForm)).joinCheckOpList,
+            }
+            checkDeviceEdit(obj).then( response => {
+              this.msgSuccess(response.msg)
+              this.addDialogOff();
+              this.getList();
+              this.inspectContentList()
+            })
+          }else{
+            //新增
+            let obj={
+              joinHazardReid:JSON.parse(JSON.stringify(this.addDialogForm)).joinHazardReid,
+              joinCheckOpList:JSON.parse(JSON.stringify(this.addDialogForm)).joinCheckOpList,
+            }
+            checkDeviceAdd(obj).then( response => {
+              this.msgSuccess(response.msg)
+              this.addDialogOff();
+              this.getList();
+              this.inspectContentList()
+            })
+          }
+        }
+      })
+    },
+  },
+  mounted() {
+    this.checkOptionList();
+    this.inspectContentList()
+    this.dangerList()
+    this.getList()
+  }
+};
+</script>
+
+<style scoped lang="scss">
+.approval_handle {
+  display: flex!important;
+  flex-direction: column;
+  .goods-category-cascader-stocking-page .el-cascader-menu:nth-of-type(1) .el-checkbox__input {
+    display: none !important;
+  }
+  .approval_handle-page{
+    flex:1;
+    display: flex!important;
+    flex-direction: column;
+    box-shadow: 0 0 8px 2px rgba(0, 0, 0, 0.1);
+    padding:20px 20px 20px!important;
+    border-radius:10px;
+
+    .button-box{
+      width:200px;
+      display: flex;
+    }
+
+  }
+
+}
+.el-dialog__body{
+  padding: 20px 0!important;
+}
+
+.small_title{
+  width: 100%;
+  height: 40px;
+  background: #F5F5F5;
+  font-size: 16px;
+  font-family: Microsoft YaHei-Regular, Microsoft YaHei;
+  font-weight: 400;
+  color: #0045AF;
+  line-height: 40px;
+  padding-left: 50px;
+  margin-bottom:20px;
+}
+</style>

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

@@ -0,0 +1,448 @@
+<!--自查管理-->
+<template>
+  <div class="app-container selfInspectionManagement">
+    <div class="selfInspectionManagement-page" v-if="pageType == 1">
+      <div class="title-box">
+        <el-form :model="queryParams" class="form-box" ref="queryForm" :inline="true" label-width="80px">
+          <div class="form-button-max-big-box">
+            <div class="form-button-big-box" style="margin-left:10px;">
+              <p class="text-p" :class="queryParams.manageStatus=='-1'?'checkDiv':''" @click="topLeftClickType('-1')">全部</p>
+              <p class="text-p" :class="queryParams.manageStatus=='0'?'checkDiv':''" @click="topLeftClickType('0')">待检查</p>
+              <p class="text-p" :class="queryParams.manageStatus=='1'?'checkDiv':''" @click="topLeftClickType('1')">检查中</p>
+              <p class="text-p" :class="queryParams.manageStatus=='2'?'checkDiv':''" @click="topLeftClickType('2')">已检查</p>
+            </div>
+          </div>
+          <!--与我相关-->
+          <div class="form-button-max-big-box-me">
+            <div class="form-button-big-box-me">
+              <div :class="queryParams.myRelated==1?'checkDiv-me':''" @click="topRightClickType">
+                <p class="text-p-me">与我有关{{correlationNum}}</p>
+                <p class="el-icon-check icon-p-me" v-if="queryParams.myRelated==1"></p>
+              </div>
+            </div>
+          </div>
+          <el-form-item label="关键字" prop="searchValue">
+            <el-input
+              maxLength="30"
+              v-model="queryParams.searchValue"
+              placeholder="计划标题/实验室/房间号/检查者"
+              clearable
+              style="width: 250px"
+            />
+          </el-form-item>
+          <el-form-item label="学院" prop="deptId" label-width="50px">
+            <el-select v-model="queryParams.deptId" clearable placeholder="请选择学院" style="width: 150px">
+              <el-option
+                v-for="item in deptSelectList"
+                :key="item.deptId"
+                :label="item.deptName"
+                :value="item.deptId">
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="检查时间" prop="dateRange" style="margin-left:10px;" label-width="70px">
+            <el-date-picker
+              :clearable="false"
+              v-model="dateRange"
+              size="small"
+              style="width: 240px"
+              value-format="yyyy-MM-dd"
+              type="daterange"
+              range-separator="-"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+            ></el-date-picker>
+          </el-form-item>
+          <el-form-item>
+            <p class="inquire-button-one" @click="handleQuery" style="margin-right:10px;">查询</p>
+            <p class="reset-button-one" @click="resetQuery">重置</p>
+          </el-form-item>
+        </el-form>
+      </div>
+      <div class="content-box">
+        <el-table  border :data="tableList" ref="multipleTable" @sort-change="sortChange">
+          <el-table-column label="序号" align="center"  type="index" width="60" fixed/>
+          <el-table-column label="计划标题" align="center" prop="title" show-overflow-tooltip width="250" fixed/>
+          <el-table-column label="实验室" align="center" prop="subjectName" show-overflow-tooltip width="220" fixed>
+            <template slot-scope="scope">{{scope.row.roomNumber?scope.row.subjectName+'-'+scope.row.roomNumber:scope.row.subjectName}}</template>
+          </el-table-column>
+          <el-table-column label="学院" align="center" prop="collegeName" show-overflow-tooltip width="150"/>
+          <el-table-column label="检查类型" align="center" prop="checkRange" show-overflow-tooltip width="120">
+            <template slot-scope="scope">
+              <p>{{scope.row.checkCategory==1?'综合检查':(scope.row.checkCategory==2?'专项检查':'-')}}</p>
+            </template>
+          </el-table-column>
+          <el-table-column label="检查状态" align="center" prop="manageStatus" show-overflow-tooltip width="90">
+            <template slot-scope="scope">
+              <p :class="scope.row.manageStatus==0?'manageStatus-color-1':(scope.row.manageStatus==1?'manageStatus-color-2':(scope.row.manageStatus==2?'manageStatus-color-3':''))">
+                {{scope.row.manageStatus==0?'待检查':(scope.row.manageStatus==1?'检查中':(scope.row.manageStatus==2?'已检查':''))}}
+              </p>
+            </template>
+          </el-table-column>
+          <el-table-column label="检查者" align="center" prop="checkUser" show-overflow-tooltip width="100"/>
+          <el-table-column label="检查结果" align="center" prop="checkResult" show-overflow-tooltip width="80">
+            <template slot-scope="scope">
+              <p>{{scope.row.checkResult==0?'不符合':(scope.row.checkResult==1?'符合':'')}}</p>
+            </template>
+          </el-table-column>
+          <el-table-column label="隐患数" align="center" prop="dangerNum" show-overflow-tooltip width="80"/>
+          <el-table-column label="整改进度" align="center" prop="rectifySchedule" show-overflow-tooltip width="200"/>
+          <el-table-column label="计划周期" align="center" prop="startTime" show-overflow-tooltip width="270">
+            <template slot-scope="scope">
+              <p>{{scope.row.cycleStartTime}} 至 {{scope.row.cycleEndTime}}<span style="color:#EE0606;margin-left:15px;" v-if="scope.row.isOverdue==1">已逾期</span></p>
+            </template>
+          </el-table-column>
+          <el-table-column label="检查时间" sortable="custom" align="center" prop="checkTime" show-overflow-tooltip width="157"/>
+          <el-table-column label="操作" align="center" prop="deptName" width="280">
+            <template slot-scope="scope">
+              <div class="table-button-box">
+                <p class="table-button-null"></p>
+                <p class="table-button-p" v-hasPermi="['safety:checkManage_1:query']"
+                   v-show="scope.row.manageStatus==0||scope.row.manageStatus==2" @click="goAddPage(3,scope.row.id)">详情</p>
+                <p class="table-button-p" v-hasPermiAnd="['safety:checkManage_1:query','safety:checkManage_1:edit']"
+                   v-show="scope.row.manageStatus==1 && scope.row.isCheck==1 && scope.row.isSelfData==1" @click="goAddPage(2,scope.row.id)">编辑</p>
+                <p class="table-button-p" v-hasPermiAnd="['safety:checkManage_1:query','safety:checkManage_1:edit']"
+                   v-show="scope.row.manageStatus==0 && scope.row.isCheck==1 && scope.row.isSelfData==1" @click="goAddPage(2,scope.row.id)">开始检查</p>
+                <p class="table-button-p" v-hasPermiAnd="['safety:checkManage_1:query','safety:checkManage_1:edit']"
+                   style="color:#999" v-show="scope.row.manageStatus==0 && scope.row.isCheck==0 && scope.row.isSelfData==1">开始检查</p>
+                <p class="table-button-p" v-show="scope.row.isEndProcess==1 && scope.row.checkResult==0" @click="lookDocumentButton(1,scope.row)">整改报告</p>
+                <p class="table-button-p" v-show="scope.row.isAttachment == 1" @click="lookDocumentListButton(1,scope.row)">查看附件</p>
+                <p class="table-button-null"></p>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+        <pagination :page-sizes="[20, 30, 40, 50]"
+                    v-show="total>0"
+                    :total="total"
+                    :page.sync="queryParams.pageNum"
+                    :limit.sync="queryParams.pageSize"
+                    @pagination="getList"
+        />
+      </div>
+    </div>
+    <addPage v-if="pageType==2" :propsAddData="propsAddData"></addPage>
+    <infoPage v-if="pageType==3" :propsInfoData="propsInfoData"></infoPage>
+    <lookDocumentDataDialog v-if="lookDocumentType" :propsLookDocumentData="propsLookDocumentData"></lookDocumentDataDialog>
+    <lookDocumentListDialog v-if="lookDocumentListType" :propsLookDocumentListData="propsLookDocumentListData"></lookDocumentListDialog>
+  </div>
+</template>
+
+<script>
+  import { listDepartments } from "@/apiDemo/system/dept";
+  import { checkManageList,getFindByCheckPlanId } from '@/apiDemo/safetyCheck/index'
+  import addPage from '@/views/safetyCheck/components/addPage/addPage.vue'
+  import infoPage from '@/views/safetyCheck/components/infoPage/infoPage.vue'
+  import lookDocumentDataDialog from '@/components/lookDocumentDialog/lookDocumentDataDialog.vue'
+  import lookDocumentListDialog from '@/components/lookDocumentDialog/lookDocumentListDialog.vue'
+  export default {
+    name: 'index',
+    components: {
+      addPage,
+      infoPage,
+      lookDocumentDataDialog,
+      lookDocumentListDialog
+    },
+    data(){
+      return{
+        //子组件数据
+        lookDocumentType:false,
+        propsLookDocumentData:{},
+        lookDocumentListType:false,
+        propsLookDocumentListData:{},
+        propsAddData:{},
+        propsInfoData:{},
+        //学院列表
+        deptSelectList:[],
+        pageType:1,
+        queryParams:{
+          pageNum:1,
+          pageSize:20,
+          checkType:2,
+          manageStatus:'-1',
+          checkTimeSort:0,
+          searchValue:"",
+          deptId:"",
+          myRelated:1,
+        },
+        dateRange:[],
+        tableList:[],
+        total:0,
+        correlationNum:'',
+      }
+    },
+    created(){
+      if(this.$route.query.id){
+        this.goAddPage(2,this.$route.query.id);
+      }
+    },
+    mounted(){
+      this.listDepartments();
+      this.getList();
+    },
+    methods:{
+      //获取相关数量
+      getCorrelationNum(){
+        checkManageList({
+          pageNum:1,
+          pageSize:20,
+          checkType:2,
+          checkTimeSort:0,
+          myRelated:1,
+          manageStatus:this.queryParams.manageStatus,
+          searchValue:this.queryParams.searchValue,
+          deptId:this.queryParams.deptId,
+          startTime:this.dateRange[0]?this.dateRange[0]:'',
+          endTime:this.dateRange[1]?this.dateRange[1]:'',
+        }).then(response => {
+          this.$set(this,'correlationNum',response.data.total>999?' 999+':(response.data.total<1?'':' '+response.data.total));
+        });
+      },
+      //与我相关按钮
+      topRightClickType(){
+        this.$set(this.queryParams,'myRelated',this.queryParams.myRelated==1?0:1);
+        this.handleQuery();
+      },
+      //开始检查
+      goAddPage(type,id){
+        if(this.pageType != type){
+          if(type == 1){
+            //返回
+            this.$set(this,'pageType',type);
+          }else if(type == 2){
+            //开始检查/编辑
+            this.$set(this,'propsAddData',{
+              id:id,
+              title:'实验室自查',
+            });
+            this.$set(this,'pageType',type);
+          }else if(type == 3){
+            //详情
+            this.$set(this,'propsInfoData',{id:id});
+            this.$set(this,'pageType',type);
+          }else if(type == 4){
+            //返回并刷新
+            this.getList();
+            this.$set(this,'pageType',1);
+          }
+        }
+      },
+      //时间排序方法
+      sortChange(val){
+        if(val.prop == 'checkTime'){
+          this.$set(this.queryParams,'checkTimeSort',val.order=='ascending'?'1':(val.order=='descending'?'2':"0"));
+          this.handleQuery();
+        }
+      },
+      //范围选择
+      topLeftClickType(type){
+        if(this.queryParams.manageStatus != type){
+          this.$set(this.queryParams,'manageStatus',type);
+          this.handleQuery();
+        }
+      },
+      //获取数据列表
+      getList(){
+        let obj = JSON.parse(JSON.stringify(this.queryParams))
+        if(this.dateRange[0]){
+          obj.startTime = this.dateRange[0];
+        }else{
+          obj.startTime = "";
+        }
+        if(this.dateRange[1]){
+          obj.endTime = this.dateRange[1];
+        }else{
+          obj.endTime = "";
+        }
+        let self = this;
+        setTimeout(function(){
+          self.getCorrelationNum();
+        },500);
+        checkManageList(obj).then(response => {
+          this.total = response.data.total;
+          this.tableList = response.data.records;
+        });
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.$set(this.queryParams,'pageNum',1);
+        this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.$set(this,'dateRange',[]);
+        this.$set(this,'queryParams',{
+          pageNum:1,
+          pageSize:20,
+          checkType:2,
+          manageStatus:'-1',
+          checkTimeSort:0,
+          searchValue:"",
+          deptId:"",
+          myRelated:1,
+        });
+        this.handleQuery();
+      },
+      //查看单个文档
+      lookDocumentButton(type,row){
+        if(type==1){
+          this.$set(this,'propsLookDocumentData',{
+            title:"整改报告",
+            type:1,
+            id:row.id,
+            name:row.title
+          });
+          this.$set(this,'lookDocumentType',true);
+        }else{
+          this.$set(this,'lookDocumentType',false);
+        }
+      },
+      //查看多个文档
+      lookDocumentListButton(type,row){
+        if(type==1){
+          getFindByCheckPlanId({checkPlanId:row.checkPlanId}).then(response => {
+            let list = [];
+            for(let i=0;i<response.data.length;i++){
+              let obj = {
+                name:response.data[i].fileName,
+                url:response.data[i].fileUrl,
+              }
+              list.push(obj);
+            }
+            this.$set(this,'propsLookDocumentListData',{
+              title:"查看附件",
+              list:list
+            });
+            this.$set(this,'lookDocumentListType',true);
+          });
+        }else{
+          this.$set(this,'lookDocumentListType',false);
+        }
+      },
+      //获取学院列表
+      listDepartments(){
+        listDepartments().then(response => {
+          this.deptSelectList = response.data;
+        });
+      },
+    },
+  }
+</script>
+
+<style scoped lang="scss">
+  ::v-deep .el-table__body-wrapper{
+    padding-bottom: 8px;
+  }
+  ::v-deep .el-table__fixed{
+    margin-top:-1px;
+    margin-left:-1px;
+    height:calc(100% - 8px)!important;
+  }
+  ::v-deep .el-table__fixed-body-wrapper{
+    height: calc(100% - 48px);
+    overflow-y: auto;
+  }
+  .selfInspectionManagement{
+    flex: 1;
+    display: flex !important;
+    flex-direction: column;
+    overflow: hidden;
+    .selfInspectionManagement-page{
+      flex: 1;
+      display: flex !important;
+      flex-direction: column;
+      overflow: hidden;
+      .title-box{
+        padding-top:20px;
+        border-bottom:1px solid #dedede;
+        .form-button-max-big-box{
+          display: inline-block;
+          margin-left:10px;
+          .form-button-big-box{
+            display: flex;
+            p:nth-child(1){
+              border-top-left-radius: 4px;
+              border-bottom-left-radius: 4px;
+              border-top:1px solid #E0E0E0;
+              border-bottom:1px solid #E0E0E0;
+            }
+            p:nth-child(2){
+              border-top:1px solid #E0E0E0;
+              border-bottom:1px solid #E0E0E0;
+            }
+            p:nth-child(3){
+              border-top:1px solid #E0E0E0;
+              border-bottom:1px solid #E0E0E0;
+            }
+            p:nth-child(4){
+              border-top-right-radius: 4px;
+              border-bottom-right-radius: 4px;
+              border-top:1px solid #E0E0E0;
+              border-bottom:1px solid #E0E0E0;
+              border-right:1px solid #E0E0E0;
+            }
+            p{
+              height:40px;
+              width:80px;
+              line-height: 40px;
+              text-align: center;
+              color:#666666;
+              font-size:14px;
+              font-weight:500;
+              cursor: pointer;
+              border-left:1px solid #E0E0E0;
+            }
+            .checkDiv{
+              color:#fff!important;
+              border:1px solid #0183FA!important;
+              background-color: #0183FA;
+            }
+          }
+        }
+        .form-button-max-big-box-me{
+          display: inline-block;
+          .form-button-big-box-me{
+            display: flex;
+            div{
+              position: relative;
+              height:40px;
+              width:130px;
+              line-height: 40px;
+              text-align: center;
+              color:#999;
+              font-size:14px;
+              border:1px solid #999;
+              border-radius:4px;
+              margin-left:10px;
+              font-weight:500;
+              cursor: pointer;
+              .icon-p-me{
+                width:15px;
+                height:15px;
+                line-height:15px;
+                text-align: center;
+                position: absolute;
+                right:0;
+                bottom:0;
+                color:#fff;
+                background: #0183fa;
+                border-top-left-radius:4px;
+              }
+            }
+            .checkDiv-me{
+              color:#0183FA!important;
+              border:1px solid #0183FA!important;
+            }
+          }
+        }
+      }
+      .content-box{
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+        padding:20px;
+        overflow: hidden;
+      }
+    }
+  }
+</style>

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

@@ -0,0 +1,439 @@
+<!--自查任务-->
+<template>
+  <div class="app-container selfInspectionTask">
+    <div class="selfInspectionTask-page" v-if="pageType == 1">
+      <div class="title-box">
+        <el-form :model="queryParams" class="form-box" ref="queryForm" :inline="true" label-width="80px">
+          <div class="form-button-max-big-box">
+            <div class="form-button-big-box" style="margin-left:10px;">
+              <p class="text-p" :class="queryParams.checkStatus=='0'?'checkDiv':''" @click="topLeftClickType('0')">全部</p>
+              <p class="text-p" :class="queryParams.checkStatus=='1'?'checkDiv':''" @click="topLeftClickType('1')">未开始</p>
+              <p class="text-p" :class="queryParams.checkStatus=='2'?'checkDiv':''" @click="topLeftClickType('2')">进行中</p>
+              <p class="text-p" :class="queryParams.checkStatus=='3'?'checkDiv':''" @click="topLeftClickType('3')">已结束</p>
+            </div>
+          </div>
+          <!--与我相关-->
+          <div class="form-button-max-big-box-me">
+            <div class="form-button-big-box-me">
+              <div :class="queryParams.myRelated==1?'checkDiv-me':''" @click="topRightClickType">
+                <p class="text-p-me">与我有关{{correlationNum}}</p>
+                <p class="el-icon-check icon-p-me" v-if="queryParams.myRelated==1"></p>
+              </div>
+            </div>
+          </div>
+          <el-form-item label="关键字" prop="searchValue">
+            <el-input
+              maxLength="30"
+              v-model="queryParams.searchValue"
+              placeholder="计划标题/创建人"
+              clearable
+              style="width: 200px"
+            />
+          </el-form-item>
+          <el-form-item label="检查周期" prop="dateRange" style="margin-left:10px;" label-width="70px">
+            <el-date-picker
+              :clearable="false"
+              v-model="dateRange"
+              size="small"
+              style="width: 240px"
+              value-format="yyyy-MM-dd"
+              type="daterange"
+              range-separator="-"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+            ></el-date-picker>
+          </el-form-item>
+          <el-form-item>
+            <p class="inquire-button-one" @click="handleQuery" style="margin-right:10px;">查询</p>
+            <p class="reset-button-one" @click="resetQuery">重置</p>
+          </el-form-item>
+          <el-form-item style="float: right;" v-hasPermi="['security:checkPlan_1:add']">
+            <el-col :span="1.5">
+              <p class="inquire-button-one"
+                 style="width:130px;"
+                 @click="addDialogOpen(1)"
+              ><i class="el-icon-plus"></i> 创建自查任务</p>
+            </el-col>
+          </el-form-item>
+        </el-form>
+      </div>
+      <div class="content-box">
+        <el-table  border :data="tableList" ref="multipleTable" @sort-change="sortChange">
+          <el-table-column label="序号" align="center"  type="index" width="60" />
+          <el-table-column label="计划标题" align="center" prop="title" show-overflow-tooltip/>
+          <el-table-column label="检查范围" align="center" prop="checkRange" show-overflow-tooltip width="120">
+            <template slot-scope="scope">
+              <p>{{scope.row.checkRange==1?'全校':(scope.row.checkRange==2?'学院':(scope.row.checkRange==3?'实验室':''))}}</p>
+            </template>
+          </el-table-column>
+          <el-table-column label="检查类型" align="center" prop="checkRange" show-overflow-tooltip width="120">
+            <template slot-scope="scope">
+              <p>{{scope.row.checkCategory==1?'综合检查':(scope.row.checkCategory==2?'专项检查':'-')}}</p>
+            </template>
+          </el-table-column>
+          <el-table-column label="任务周期" align="center" prop="cycleStartTime" show-overflow-tooltip width="260">
+            <template slot-scope="scope">
+              <p>{{scope.row.cycleStartTime}} 至 {{scope.row.cycleEndTime}}<span style="color:#EE0606;margin-left:15px;" v-if="scope.row.isOverdue==1">已逾期</span></p>
+            </template>
+          </el-table-column>
+          <el-table-column label="状态" align="center" prop="checkStatus" show-overflow-tooltip width="80">
+            <template slot-scope="scope">
+              <p :class="scope.row.checkStatus==1?'checkStatus-color-1':(scope.row.checkStatus==2?'checkStatus-color-2':(scope.row.checkStatus==3?'checkStatus-color-3':''))">{{scope.row.checkStatus==1?'未开始':(scope.row.checkStatus==2?'进行中':(scope.row.checkStatus==3?'已结束':''))}}</p>
+            </template>
+          </el-table-column>
+          <el-table-column label="检查进度" align="center" prop="checkSchedule" show-overflow-tooltip width="210"/>
+          <el-table-column label="创建人" align="center" prop="createName" show-overflow-tooltip width="130"/>
+          <el-table-column label="创建时间" sortable="custom" align="center" prop="createTime" show-overflow-tooltip width="157"/>
+          <el-table-column label="操作" align="center" prop="deptName" width="280">
+            <template slot-scope="scope">
+              <div class="table-button-box">
+                <p class="table-button-null"></p>
+                <p class="table-button-p" v-hasPermi="['security:checkPlan_1:query']"
+                   v-show="scope.row.checkStatus!=1" @click="addDialogOpen(3,scope.row)">详情</p>
+                <p class="table-button-p" v-hasPermiAnd="['security:checkPlan_1:query','security:checkPlan_1:edit']"
+                   v-show="scope.row.checkStatus==1&&scope.row.isSelfData == 1" @click="addDialogOpen(2,scope.row)">编辑</p>
+                <p class="table-button-p" v-hasPermi="['security:checkManage_3:list']"
+                   @click="goPage(2,scope.row)">自查管理</p>
+                <p class="table-button-p" v-hasPermi="['security:checkPlan_1:remove']"
+                   v-show="scope.row.checkStatus==1&&scope.row.isSelfData == 1" @click="deleteObj(scope.row)">删除</p>
+                <p class="table-button-p" v-show="scope.row.isAttachment == 1" @click="lookDocumentListButton(1,scope.row)">查看附件</p>
+                <p class="table-button-null"></p>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+        <pagination :page-sizes="[20, 30, 40, 50]"
+                    v-show="total>0"
+                    :total="total"
+                    :page.sync="queryParams.pageNum"
+                    :limit.sync="queryParams.pageSize"
+                    @pagination="getList"
+        />
+      </div>
+    </div>
+    <list-page v-if="pageType == 2" :propsListPageData="propsListPageData"></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'
+  import { checkPlanList,checkPlanDelete,getFindByCheckPlanId } from '@/apiDemo/safetyCheck/index'
+  export default {
+    name: 'index',
+    components: {
+      addDialog,
+      listPage,
+      lookDocumentListDialog
+    },
+    data(){
+      return{
+        //子组件数据
+        lookDocumentListType:false,
+        propsLookDocumentListData:{},
+        propsListPageData:{},
+        addDialogType:false,
+        addDialogData:{},
+        pageType:1,
+        queryParams:{
+          pageNum:1,
+          pageSize:20,
+          checkStatus:0,
+          createTimeSort:0,
+          searchValue:"",
+          checkType:2,
+          myRelated:1,
+        },
+        dateRange:[],
+        tableList:[],
+        total:0,
+        correlationNum:'',
+      }
+    },
+    created(){
+
+    },
+    mounted(){
+      this.getList();
+    },
+    methods:{
+      //获取相关数量
+      getCorrelationNum(){
+        checkPlanList({
+          pageNum:1,
+          pageSize:20,
+          createTimeSort:0,
+          checkType:2,
+          myRelated:1,
+          checkStatus:this.queryParams.checkStatus,
+          searchValue:this.queryParams.searchValue,
+          cycleStartTime:this.dateRange[0]?this.dateRange[0]:'',
+          cycleEndTime:this.dateRange[1]?this.dateRange[1]:'',
+        }).then(response => {
+          this.$set(this,'correlationNum',response.data.total>999?' 999+':(response.data.total<1?'':' '+response.data.total));
+        });
+      },
+      //与我相关按钮
+      topRightClickType(){
+        this.$set(this.queryParams,'myRelated',this.queryParams.myRelated==1?0:1);
+        this.handleQuery();
+      },
+      //切换页面
+      goPage(type,data){
+        if(this.pageType != type){
+          if(type == 2){
+            this.$set(this,'propsListPageData',data);
+            this.$set(this,'pageType',type);
+          }else if(type == 1){
+            this.$set(this,'pageType',type);
+          }else if(type == 3){
+            this.$set(this,'pageType',1);
+            this.getList();
+          }
+        }
+      },
+      //弹窗开启
+      addDialogOpen(type,data){
+        if(type==1){
+          this.$set(this,'addDialogData',{
+            title:"创建自查任务",
+            lookInfoType:false,
+            addType:true,
+          })
+          this.$set(this,'addDialogType',true);
+        }else if(type==2){
+          this.$set(this,'addDialogData',{
+            title:"编辑自查任务",
+            id:data.id,
+            lookInfoType:false,
+            addType:false,
+          })
+          this.$set(this,'addDialogType',true);
+        }else if(type==3){
+          this.$set(this,'addDialogData',{
+            title:"自查任务详情",
+            id:data.id,
+            lookInfoType:true,
+            addType:false,
+          })
+          this.$set(this,'addDialogType',true);
+        }else if(type==4){
+          this.$set(this,'addDialogType',false);
+        }else if(type == 5){
+          this.$set(this,'addDialogType',false);
+          this.getList();
+        }
+      },
+      //范围选择
+      topLeftClickType(type){
+        if(this.queryParams.checkStatus != type){
+          this.$set(this.queryParams,'checkStatus',type);
+          this.handleQuery();
+        }
+      },
+      //时间排序方法
+      sortChange(val){
+        if(val.prop == 'createTime'){
+          this.$set(this.queryParams,'createTimeSort',val.order=='ascending'?'1':(val.order=='descending'?'2':'0'));
+          this.handleQuery();
+        }
+      },
+      //获取数据列表
+      getList(){
+        let obj = JSON.parse(JSON.stringify(this.queryParams))
+        if(this.dateRange[0]){
+          obj.cycleStartTime = this.dateRange[0];
+        }else{
+          obj.cycleStartTime = "";
+        }
+        if(this.dateRange[1]){
+          obj.cycleEndTime = this.dateRange[1];
+        }else{
+          obj.cycleEndTime = "";
+        }
+        let self = this;
+        setTimeout(function(){
+          self.getCorrelationNum();
+        },500);
+        checkPlanList(obj).then(response => {
+          this.total = response.data.total;
+          this.tableList = response.data.records;
+        });
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.$set(this.queryParams,'pageNum',1);
+        this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.$set(this,'dateRange',[]);
+        this.$set(this,'queryParams',{
+          pageNum:1,
+          pageSize:20,
+          checkStatus:0,
+          createTimeSort:0,
+          searchValue:"",
+          checkType:2,
+          myRelated:1,
+        });
+        this.handleQuery();
+      },
+      //删除
+      deleteObj(obj){
+        let self = this;
+        this.$confirm('是否确认删除?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(function() {
+          checkPlanDelete({id:obj.id,checkType:obj.checkType}).then(response => {
+            self.msgSuccess(response.msg)
+            self.getList();
+          })
+        }).then(() => {
+        }).catch(() => {});
+      },
+      //查看多个文档
+      lookDocumentListButton(type,row){
+        if(type==1){
+          getFindByCheckPlanId({checkPlanId:row.id}).then(response => {
+            let list = [];
+            for(let i=0;i<response.data.length;i++){
+              let obj = {
+                name:response.data[i].fileName,
+                url:response.data[i].fileUrl,
+              }
+              list.push(obj);
+            }
+            this.$set(this,'propsLookDocumentListData',{
+              title:"查看附件",
+              list:list
+            });
+            this.$set(this,'lookDocumentListType',true);
+          });
+        }else{
+          this.$set(this,'lookDocumentListType',false);
+        }
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .selfInspectionTask{
+    flex: 1;
+    display: flex !important;
+    flex-direction: column;
+    overflow: hidden;
+    .selfInspectionTask-page{
+      flex: 1;
+      display: flex !important;
+      flex-direction: column;
+      overflow: hidden;
+      .title-box{
+        padding-top:20px;
+        border-bottom:1px solid #dedede;
+        .form-button-max-big-box{
+          display: inline-block;
+          margin-left:10px;
+          .form-button-big-box{
+            display: flex;
+            p:nth-child(1){
+              border-top-left-radius: 4px;
+              border-bottom-left-radius: 4px;
+              border-top:1px solid #E0E0E0;
+              border-bottom:1px solid #E0E0E0;
+            }
+            p:nth-child(2){
+              border-top:1px solid #E0E0E0;
+              border-bottom:1px solid #E0E0E0;
+            }
+            p:nth-child(3){
+              border-top:1px solid #E0E0E0;
+              border-bottom:1px solid #E0E0E0;
+            }
+            p:nth-child(4){
+              border-top-right-radius: 4px;
+              border-bottom-right-radius: 4px;
+              border-top:1px solid #E0E0E0;
+              border-bottom:1px solid #E0E0E0;
+              border-right:1px solid #E0E0E0;
+            }
+            p{
+              height:40px;
+              width:80px;
+              line-height: 40px;
+              text-align: center;
+              color:#666666;
+              font-size:14px;
+              font-weight:500;
+              cursor: pointer;
+              border-left:1px solid #E0E0E0;
+            }
+            .checkDiv{
+              color:#fff!important;
+              border:1px solid #0183FA!important;
+              background-color: #0183FA;
+            }
+          }
+        }
+        .form-button-max-big-box-me{
+          display: inline-block;
+          .form-button-big-box-me{
+            display: flex;
+            div{
+              position: relative;
+              height:40px;
+              width:130px;
+              line-height: 40px;
+              text-align: center;
+              color:#999;
+              font-size:14px;
+              border:1px solid #999;
+              border-radius:4px;
+              margin-left:10px;
+              font-weight:500;
+              cursor: pointer;
+              .icon-p-me{
+                width:15px;
+                height:15px;
+                line-height:15px;
+                text-align: center;
+                position: absolute;
+                right:0;
+                bottom:0;
+                color:#fff;
+                background: #0183fa;
+                border-top-left-radius:4px;
+              }
+            }
+            .checkDiv-me{
+              color:#0183FA!important;
+              border:1px solid #0183FA!important;
+            }
+          }
+        }
+      }
+      .content-box{
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+        padding:20px;
+        overflow: hidden;
+        .checkStatus-color-1{
+          color:#0183FA;
+        }
+        .checkStatus-color-2{
+          color:#EE0606;
+        }
+        .checkStatus-color-3{
+          color:#23B303;
+        }
+      }
+    }
+  }
+</style>

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

@@ -0,0 +1,378 @@
+<!--自查子项管理-->
+<template>
+  <div class="selfInspectionManagement">
+    <div class="selfInspectionManagement-page" v-if="pageType == 1">
+      <div class="title-box">
+        <el-form :model="queryParams" class="form-box" ref="queryForm" :inline="true" label-width="80px">
+          <div class="form-button-max-big-box">
+            <div class="form-button-big-box" style="margin-left:10px;">
+              <div :class="queryParams.manageStatus=='-1'?'checkDiv':''" @click="topLeftClickType('-1')">
+                <p class="text-p">全部</p>
+                <p class="el-icon-check icon-p" v-if="queryParams.manageStatus=='-1'"></p>
+              </div>
+              <div :class="queryParams.manageStatus==0?'checkDiv':''" @click="topLeftClickType(0)">
+                <p class="text-p">待检查</p>
+                <p class="el-icon-check icon-p" v-if="queryParams.manageStatus==0"></p>
+              </div>
+              <div :class="queryParams.manageStatus==1?'checkDiv':''" @click="topLeftClickType(1)">
+                <p class="text-p">检查中</p>
+                <p class="el-icon-check icon-p" v-if="queryParams.manageStatus==1"></p>
+              </div>
+              <div :class="queryParams.manageStatus==2?'checkDiv':''" @click="topLeftClickType(2)">
+                <p class="text-p">已检查</p>
+                <p class="el-icon-check icon-p" v-if="queryParams.manageStatus==2"></p>
+              </div>
+            </div>
+          </div>
+          <el-form-item label="关键字" prop="searchValue">
+            <el-input
+              maxLength="30"
+              v-model="queryParams.searchValue"
+              placeholder="计划标题/实验室/房间号/检查者"
+              clearable
+              style="width: 250px"
+            />
+          </el-form-item>
+          <el-form-item label="学院" prop="deptId" label-width="50px">
+            <el-select v-model="queryParams.deptId" clearable placeholder="请选择学院" style="width: 150px">
+              <el-option
+                v-for="item in deptSelectList"
+                :key="item.deptId"
+                :label="item.deptName"
+                :value="item.deptId">
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="检查时间" prop="dateRange" style="margin-left:10px;" label-width="70px">
+            <el-date-picker
+              :clearable="false"
+              v-model="dateRange"
+              size="small"
+              style="width: 240px"
+              value-format="yyyy-MM-dd"
+              type="daterange"
+              range-separator="-"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+            ></el-date-picker>
+          </el-form-item>
+          <el-form-item>
+            <p class="inquire-button-one" @click="handleQuery" style="margin-right:10px;">查询</p>
+            <p class="reset-button-one" @click="resetQuery">重置</p>
+          </el-form-item>
+          <el-form-item style="float: right">
+            <p class="add-button-one-90" style="width:80px;" @click="outButton">返回</p>
+          </el-form-item>
+        </el-form>
+      </div>
+      <div class="content-box">
+        <el-table  border :data="tableList" ref="multipleTable" @sort-change="sortChange">
+          <el-table-column label="序号" align="center"  type="index" width="60" fixed/>
+          <el-table-column label="计划标题" align="center" prop="title" show-overflow-tooltip width="250" fixed/>
+          <el-table-column label="实验室" align="center" prop="subjectName" show-overflow-tooltip width="220" fixed>
+            <template slot-scope="scope">{{scope.row.roomNumber?scope.row.subjectName+'-'+scope.row.roomNumber:scope.row.subjectName}}</template>
+          </el-table-column>
+          <el-table-column label="学院" align="center" prop="collegeName" show-overflow-tooltip width="150"/>
+          <el-table-column label="检查状态" align="center" prop="manageStatus" show-overflow-tooltip width="90">
+            <template slot-scope="scope">
+              <p :class="scope.row.manageStatus==0?'manageStatus-color-1':(scope.row.manageStatus==1?'manageStatus-color-2':(scope.row.manageStatus==2?'manageStatus-color-3':''))">{{scope.row.manageStatus==0?'待检查':(scope.row.manageStatus==1?'检查中':(scope.row.manageStatus==2?'已检查':''))}}</p>
+            </template>
+          </el-table-column>
+          <el-table-column label="检查者" align="center" prop="checkUser" show-overflow-tooltip width="100"/>
+          <el-table-column label="检查结果" align="center" prop="checkResult" show-overflow-tooltip width="80">
+            <template slot-scope="scope">
+              <p>{{scope.row.checkResult==0?'不符合':(scope.row.checkResult==1?'符合':'')}}</p>
+            </template>
+          </el-table-column>
+          <el-table-column label="隐患数" align="center" prop="dangerNum" show-overflow-tooltip width="80"/>
+          <el-table-column label="整改进度" align="center" prop="rectifySchedule" show-overflow-tooltip width="200"/>
+          <el-table-column label="任务周期" align="center" prop="startTime" show-overflow-tooltip width="270">
+            <template slot-scope="scope">
+              <p>{{scope.row.cycleStartTime}} 至 {{scope.row.cycleEndTime}}<span style="color:#EE0606;margin-left:15px;" v-if="scope.row.isOverdue==1">已逾期</span></p>
+            </template>
+          </el-table-column>
+          <el-table-column label="检查时间" sortable="custom" align="center" prop="checkTime" show-overflow-tooltip width="157"/>
+          <el-table-column label="操作" align="center" prop="deptName" width="280">
+            <template slot-scope="scope">
+              <div class="table-button-box">
+                <p class="table-button-null"></p>
+                <p class="table-button-p" v-hasPermi="['security:checkManage_3:query']"
+                   v-show="scope.row.manageStatus==0||scope.row.manageStatus==2 && scope.row.isSelfData==1" @click="goAddPage(3,scope.row.id)">详情</p>
+                <p class="table-button-p" v-hasPermiAnd="['security:checkManage_3:query','security:checkManage_3:edit']"
+                   v-show="scope.row.manageStatus==1 && scope.row.isCheck==1 && scope.row.isSelfData==1" @click="goAddPage(2,scope.row.id)">编辑</p>
+                <p class="table-button-p" v-hasPermiAnd="['security:checkManage_3:query','security:checkManage_3:edit']"
+                   v-show="scope.row.manageStatus==0 && scope.row.isCheck==1 && scope.row.isSelfData==1" @click="goAddPage(2,scope.row.id)">开始检查</p>
+                <p class="table-button-p"
+                   style="color:#999" v-show="scope.row.manageStatus==0 && scope.row.isCheck==0">开始检查</p>
+                <p class="table-button-p" v-show="scope.row.isEndProcess==1 && scope.row.checkResult==0" @click="lookDocumentButton(1,scope.row)">整改报告</p>
+                <p class="table-button-p" v-show="scope.row.isAttachment == 1" @click="lookDocumentListButton(1,scope.row)">查看附件</p>
+                <p class="table-button-null"></p>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+        <pagination :page-sizes="[20, 30, 40, 50]"
+                    v-show="total>0"
+                    :total="total"
+                    :page.sync="queryParams.pageNum"
+                    :limit.sync="queryParams.pageSize"
+                    @pagination="getList"
+        />
+      </div>
+    </div>
+    <addPage v-if="pageType==2" :propsAddData="propsAddData"></addPage>
+    <infoPage v-if="pageType==3" :propsInfoData="propsInfoData"></infoPage>
+    <lookDocumentDataDialog v-if="lookDocumentType" :propsLookDocumentData="propsLookDocumentData"></lookDocumentDataDialog>
+    <lookDocumentListDialog v-if="lookDocumentListType" :propsLookDocumentListData="propsLookDocumentListData"></lookDocumentListDialog>
+  </div>
+</template>
+
+<script>
+  import { listDepartments } from "@/apiDemo/system/dept";
+  import { findByCheckPlanId,getFindByCheckPlanId } from '@/apiDemo/safetyCheck/index'
+  import addPage from '@/views/safetyCheck/components/addPage/addPage.vue'
+  import infoPage from '@/views/safetyCheck/components/infoPage/infoPage.vue'
+  import lookDocumentDataDialog from '@/components/lookDocumentDialog/lookDocumentDataDialog.vue'
+  import lookDocumentListDialog from '@/components/lookDocumentDialog/lookDocumentListDialog.vue'
+  export default {
+    name: 'index',
+    props:{
+      propsListPageData:{},
+    },
+    components: {
+      addPage,
+      infoPage,
+      lookDocumentDataDialog,
+      lookDocumentListDialog
+    },
+    data(){
+      return{
+        //子组件数据
+        lookDocumentType:false,
+        propsLookDocumentData:{},
+        lookDocumentListType:false,
+        propsLookDocumentListData:{},
+        propsAddData:{},
+        propsInfoData:{},
+        //学院列表
+        deptSelectList:[],
+        pageType:1,
+        queryParams:{
+          pageNum:1,
+          pageSize:20,
+          manageStatus:'-1',
+          checkTimeSort:0,
+          searchValue:"",
+          deptId:""
+        },
+        dateRange:[],
+        tableList:[],
+        total:0,
+      }
+    },
+    created(){
+
+    },
+    mounted(){
+      this.listDepartments();
+      this.getList();
+    },
+    methods:{
+      //返回按钮
+      outButton(){
+        this.$parent.goPage(3);
+      },
+      //开始检查
+      goAddPage(type,id){
+        if(this.pageType != type){
+          if(type == 1){
+            //返回
+            this.$set(this,'pageType',type);
+          }else if(type == 2){
+            //开始检查/编辑
+            this.$set(this,'propsAddData',{
+              id:id,
+              title:'实验室自查',
+            });
+            this.$set(this,'pageType',type);
+          }else if(type == 3){
+            //详情
+            this.$set(this,'propsInfoData',{id:id});
+            this.$set(this,'pageType',type);
+          }else if(type == 4){
+            //返回并刷新
+            this.getList();
+            this.$set(this,'pageType',1);
+          }
+        }
+      },
+      //时间排序方法
+      sortChange(val){
+        if(val.prop == 'checkTime'){
+          this.$set(this.queryParams,'checkTimeSort',val.order=='ascending'?'1':(val.order=='descending'?'2':"0"));
+          this.handleQuery();
+        }
+      },
+      //范围选择
+      topLeftClickType(type){
+        if(this.queryParams.manageStatus != type){
+          this.$set(this.queryParams,'manageStatus',type);
+          this.handleQuery();
+        }
+      },
+      //获取数据列表
+      getList(){
+        let obj = JSON.parse(JSON.stringify(this.queryParams))
+        obj.checkPlanId = this.propsListPageData.id;
+        if(this.dateRange[0]){
+          obj.startTime = this.dateRange[0];
+        }else{
+          obj.startTime = "";
+        }
+        if(this.dateRange[1]){
+          obj.endTime = this.dateRange[1];
+        }else{
+          obj.endTime = "";
+        }
+        findByCheckPlanId(obj).then(response => {
+          this.total = response.data.total;
+          this.tableList = response.data.records;
+        });
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.$set(this.queryParams,'pageNum',1);
+        this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.$set(this,'dateRange',[]);
+        this.$set(this,'queryParams',{
+          pageNum:1,
+          pageSize:20,
+          manageStatus:'-1',
+          checkTimeSort:0,
+          searchValue:"",
+          deptId:""
+        });
+        this.handleQuery();
+      },
+      //查看单个文档
+      lookDocumentButton(type,row){
+        if(type==1){
+          this.$set(this,'propsLookDocumentData',{
+            title:"整改报告",
+            type:1,
+            id:row.id,
+            name:row.title
+          });
+          this.$set(this,'lookDocumentType',true);
+        }else{
+          this.$set(this,'lookDocumentType',false);
+        }
+      },
+      //查看多个文档
+      lookDocumentListButton(type,row){
+        if(type==1){
+          getFindByCheckPlanId({checkPlanId:row.checkPlanId}).then(response => {
+            let list = [];
+            for(let i=0;i<response.data.length;i++){
+              let obj = {
+                name:response.data[i].fileName,
+                url:response.data[i].fileUrl,
+              }
+              list.push(obj);
+            }
+            this.$set(this,'propsLookDocumentListData',{
+              title:"查看附件",
+              list:list
+            });
+            this.$set(this,'lookDocumentListType',true);
+          });
+        }else{
+          this.$set(this,'lookDocumentListType',false);
+        }
+      },
+      //获取学院列表
+      listDepartments(){
+        listDepartments().then(response => {
+          this.deptSelectList = response.data;
+        });
+      },
+    },
+  }
+</script>
+
+<style scoped lang="scss">
+  ::v-deep .el-table__body-wrapper{
+    padding-bottom: 8px;
+  }
+  ::v-deep .el-table__fixed{
+    margin-top:-1px;
+    margin-left:-1px;
+    height:calc(100% - 8px)!important;
+  }
+  ::v-deep .el-table__fixed-body-wrapper{
+    height: calc(100% - 48px);
+    overflow-y: auto;
+  }
+  .selfInspectionManagement{
+    flex: 1;
+    display: flex !important;
+    flex-direction: column;
+    overflow: hidden;
+    .selfInspectionManagement-page{
+      flex: 1;
+      display: flex !important;
+      flex-direction: column;
+      overflow: hidden;
+      .title-box{
+        padding-top:20px;
+        border-bottom:1px solid #dedede;
+        .form-button-max-big-box{
+          display: inline-block;
+          .form-button-big-box{
+            display: flex;
+            div{
+              position: relative;
+              height:40px;
+              width:80px;
+              line-height: 40px;
+              text-align: center;
+              color:#999;
+              font-size:14px;
+              border:1px solid #999;
+              border-radius:4px;
+              margin-left:10px;
+              font-weight:500;
+              cursor: pointer;
+              .icon-p{
+                width:15px;
+                height:15px;
+                line-height:15px;
+                text-align: center;
+                position: absolute;
+                right:0;
+                bottom:0;
+                color:#fff;
+                background: #0183fa;
+                border-top-left-radius:4px;
+              }
+            }
+            .checkDiv{
+              color:#0183FA;
+              border:1px solid #0183FA;
+            }
+          }
+        }
+      }
+      .content-box{
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+        padding:20px;
+        overflow: hidden;
+      }
+    }
+  }
+</style>

src/views/safetyCheck/rectificationReport/index.vue

@@ -0,0 +1,350 @@
+<template>
+  <div class="app-container rectificationReport">
+    <div class="rectificationReport-page" v-if="pageType == 1">
+      <div class="title-box">
+        <el-form :model="queryParams" class="form-box" ref="queryForm" :inline="true" label-width="80px">
+          <!--与我相关-->
+          <div class="form-button-max-big-box-me" style="margin-left:10px;">
+            <div class="form-button-big-box-me">
+              <div :class="queryParams.myRelated==1?'checkDiv-me':''" @click="topRightClickType">
+                <p class="text-p-me">与我有关{{correlationNum}}</p>
+                <p class="el-icon-check icon-p-me" v-if="queryParams.myRelated==1"></p>
+              </div>
+            </div>
+          </div>
+          <el-form-item label="关键字" prop="searchValue">
+            <el-input
+              maxLength="30"
+              v-model="queryParams.searchValue"
+              placeholder="计划任务/实验室/房间号"
+              clearable
+              style="width: 200px"
+            />
+          </el-form-item>
+          <el-form-item label="学院" prop="deptId" label-width="50px">
+            <el-select v-model="queryParams.deptId" clearable placeholder="学院" style="width: 150px">
+              <el-option
+                v-for="item in deptSelectList"
+                :key="item.deptId"
+                :label="item.deptName"
+                :value="item.deptId">
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="检查时间" prop="dateRange" style="margin-left:10px;" label-width="70px">
+            <el-date-picker
+              :clearable="false"
+              v-model="dateRange"
+              size="small"
+              style="width: 240px"
+              value-format="yyyy-MM-dd"
+              type="daterange"
+              range-separator="-"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+            ></el-date-picker>
+          </el-form-item>
+          <el-form-item>
+            <p class="inquire-button-one" @click="handleQuery" style="margin-right:10px;">查询</p>
+            <p class="reset-button-one" @click="resetQuery">重置</p>
+          </el-form-item>
+          <el-form-item style="float: right;" v-hasPermi="['safety:checkRectify:export']">
+            <el-col :span="1.5">
+              <p class="inquire-button-one"
+                 style="width:100px;"
+                 @click="allDownload"
+              >批量下载</p>
+            </el-col>
+          </el-form-item>
+        </el-form>
+      </div>
+      <div class="content-box">
+        <el-table  border :data="tableList" ref="multipleTable" @selection-change="handleSelectionChange"  :row-key="getRowKeys">
+          <el-table-column type="selection" width="50" align="center" :reserve-selection="true"/>
+          <el-table-column label="序号" align="center"  type="index" width="50" />
+          <el-table-column label="计划任务" align="center" prop="title" show-overflow-tooltip/>
+          <el-table-column label="学院" align="center" prop="collegeName" show-overflow-tooltip width="160"/>
+          <el-table-column label="实验室" align="center" prop="subjectName" show-overflow-tooltip width="160"/>
+          <el-table-column label="房间号" align="center" prop="roomNumber" show-overflow-tooltip width="80"/>
+          <el-table-column label="楼栋" align="center" prop="buildName" show-overflow-tooltip width="100"/>
+          <el-table-column label="隐患数" align="center" prop="hazardCount" show-overflow-tooltip width="80"/>
+          <el-table-column label="计划周期" align="center" prop="cycleTime" show-overflow-tooltip width="200"/>
+          <el-table-column label="检查者" align="center" prop="checkUser" show-overflow-tooltip width="80"/>
+          <el-table-column label="检查时间" align="center" prop="checkTime" show-overflow-tooltip width="120"/>
+          <el-table-column label="操作" align="center" prop="deptName" width="200">
+            <template slot-scope="scope">
+              <div class="table-button-box">
+                <p class="table-button-null"></p>
+                <p class="table-button-p" @click="goPage(2,scope.row)">检查详情</p>
+                <p class="table-button-p" @click="lookDocumentButton(1,scope.row)">查看</p>
+                <p class="table-button-p" @click="downloadButton(scope.row)">下载</p>
+                <p class="table-button-null"></p>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+        <pagination :page-sizes="[20, 30, 40, 50]"
+                    v-show="total>0"
+                    :total="total"
+                    :page.sync="queryParams.pageNum"
+                    :limit.sync="queryParams.pageSize"
+                    @pagination="getList"
+        />
+      </div>
+    </div>
+    <listPage v-if="pageType == 2" :propsListPageData="propsListPageData"></listPage>
+    <lookDocumentDataDialog v-if="lookDocumentType" :propsLookDocumentData="propsLookDocumentData"></lookDocumentDataDialog>
+  </div>
+</template>
+
+<script>
+  import { listDepartments } from "@/apiDemo/system/dept";
+  import { checkRectifyList,genReport,genReportZip } from '@/apiDemo/safetyCheck/index'
+  import listPage from './listPage.vue'
+  import lookDocumentDataDialog from '@/components/lookDocumentDialog/lookDocumentDataDialog.vue'
+  export default {
+    name: 'index',
+    components: {
+      listPage,
+      lookDocumentDataDialog
+    },
+    data(){
+      return{
+        //子组件数据
+        lookDocumentType:false,
+        propsLookDocumentData:{},
+        propsListPageData:{},
+        pageType:1,
+        deptSelectList:[],
+        queryParams:{
+          pageNum:1,
+          pageSize:20,
+          deptId:'',
+          searchValue:'',
+          myRelated:1,
+        },
+        dateRange:[],
+        tableList:[],
+        total:0,
+        selectedNum:0,
+        ids:[],
+        correlationNum:'',
+      }
+    },
+    created(){
+
+    },
+    mounted(){
+      this.listDepartments();
+      this.getList();
+    },
+    methods:{
+      //获取相关数量
+      getCorrelationNum(){
+        checkRectifyList({
+          pageNum:1,
+          pageSize:20,
+          myRelated:1,
+          deptId:this.queryParams.deptId,
+          searchValue:this.queryParams.searchValue,
+          beginTime:this.dateRange[0]?this.dateRange[0]:'',
+          endTime:this.dateRange[1]?this.dateRange[1]:'',
+        }).then(response => {
+          this.$set(this,'correlationNum',response.data.total>999?' 999+':(response.data.total<1?'':' '+response.data.total));
+        });
+      },
+      //与我相关按钮
+      topRightClickType(){
+        this.$set(this.queryParams,'myRelated',this.queryParams.myRelated==1?0:1);
+        this.handleQuery();
+      },
+      // 批量下载
+      allDownload(){
+        let self = this;
+        if(!this.ids[0]){
+          this.msgError('请先勾选数据')
+          return
+        }
+        this.$confirm('是否批量下载?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(function() {
+          let text = self.ids+'';
+          self.download('/zd-security/checkRectify/genReport/zip/'+text, {}, '批量报告下载.zip')
+        }).then(() => {
+        }).catch(() => {});
+      },
+      // 单个下载按钮
+      downloadButton(row){
+        this.download('/zd-security/checkRectify/genReport/'+row.id, {}, row.title+'(整改报告).docx')
+      },
+      //开关详情页面
+      goPage(type,data){
+        if(this.pageType != type){
+          if(type == 2){
+            this.$set(this.propsListPageData,'id',data.id);
+          }
+          this.$set(this,'pageType',type);
+        }
+      },
+      //查看单个文档
+      lookDocumentButton(type,row){
+        if(type==1){
+          this.$set(this,'propsLookDocumentData',{
+            title:"整改报告",
+            type:1,
+            id:row.id,
+            name:row.title
+          });
+          this.$set(this,'lookDocumentType',true);
+        }else{
+          this.$set(this,'lookDocumentType',false);
+        }
+      },
+      //获取数据列表
+      getList(){
+        let obj = JSON.parse(JSON.stringify(this.queryParams))
+        if(this.dateRange[0]){
+          obj.beginTime = this.dateRange[0]
+        }else{
+          obj.beginTime = ""
+        }
+        if(this.dateRange[1]){
+          obj.endTime = this.dateRange[1]
+        }else{
+          obj.endTime = ""
+        }
+        let self = this;
+        setTimeout(function(){
+          self.getCorrelationNum();
+        },500);
+        checkRectifyList(obj).then(response => {
+          this.total = response.data.total;
+          this.tableList = response.data.records;
+        });
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.$set(this.queryParams,'pageNum',1);
+        this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.$set(this,'dateRange',[]);
+        this.$set(this,'queryParams',{
+          pageNum:1,
+          pageSize:20,
+          deptId:'',
+          searchValue:'',
+          myRelated:1,
+        });
+        this.handleQuery();
+      },
+      /*===记录勾选数据===
+        需要再el-table 添加  :row-key="getRowKeys"
+        需要在selection 添加 :reserve-selection="true"
+      */
+      getRowKeys(row) {
+        return row.id
+      },
+      // 多选框选中数据
+      handleSelectionChange(selection) {
+        this.selectedNum = selection.length;
+        this.ids = selection.map(item => item.id)
+      },
+      //获取学院列表
+      listDepartments(){
+        listDepartments().then(response => {
+          this.deptSelectList = response.data;
+        });
+      },
+    },
+  }
+</script>
+
+<style scoped lang="scss">
+  .rectificationReport{
+    flex: 1;
+    display: flex !important;
+    flex-direction: column;
+    overflow: hidden;
+    .rectificationReport-page{
+      flex: 1;
+      display: flex !important;
+      flex-direction: column;
+      overflow: hidden;
+      .title-box{
+        padding-top:20px;
+        .form-button-max-big-box{
+          display: inline-block;
+          .form-button-big-box{
+            display: flex;
+            div{
+              position: relative;
+              height:40px;
+              width:100px;
+              line-height: 40px;
+              text-align: center;
+              color:#0045AF;
+              font-size:14px;
+              border:1px solid #0045AF;
+              border-radius:4px;
+              margin-left:10px;
+              font-weight:500;
+              cursor: pointer;
+            }
+            .checkDiv{
+              color:#fff;
+              background-color:#0045AF;
+              border:1px solid #0045AF;
+            }
+          }
+        }
+        .form-button-max-big-box-me{
+          display: inline-block;
+          .form-button-big-box-me{
+            display: flex;
+            div{
+              position: relative;
+              height:40px;
+              width:130px;
+              line-height: 40px;
+              text-align: center;
+              color:#999;
+              font-size:14px;
+              border:1px solid #999;
+              border-radius:4px;
+              margin-left:10px;
+              font-weight:500;
+              cursor: pointer;
+              .icon-p-me{
+                width:15px;
+                height:15px;
+                line-height:15px;
+                text-align: center;
+                position: absolute;
+                right:0;
+                bottom:0;
+                color:#fff;
+                background: #0183fa;
+                border-top-left-radius:4px;
+              }
+            }
+            .checkDiv-me{
+              color:#0183FA!important;
+              border:1px solid #0183FA!important;
+            }
+          }
+        }
+      }
+      .content-box{
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+        padding:0 20px 20px;
+        overflow: hidden;
+      }
+    }
+  }
+</style>

src/views/safetyCheck/rectificationReport/listPage.vue

@@ -0,0 +1,230 @@
+<!--自查子项管理-->
+<template>
+  <div class="rectificationReport-listPage">
+    <div class="rectificationReport-listPage-page" v-if="pageType == 1">
+      <div class="title-box">
+        <p>检查详情</p>
+        <p class="add-button-one-90" style="width:80px;" @click="outButton">返回</p>
+      </div>
+      <div class="content-box">
+        <el-table  border :data="tableList" ref="multipleTable" @sort-change="sortChange">
+          <el-table-column label="序号" align="center"  type="index" width="60" />
+          <el-table-column label="计划标题" align="center" prop="title" show-overflow-tooltip/>
+          <el-table-column label="隐患描述" align="center" prop="hazardDescribe" show-overflow-tooltip width="220"/>
+          <el-table-column label="实验室" align="center" prop="subRoom" show-overflow-tooltip width="170"/>
+          <el-table-column label="检查时间" sortable="custom" align="center" prop="checkTime" show-overflow-tooltip width="160"/>
+          <el-table-column label="整改人" align="center" prop="rectifyName" show-overflow-tooltip width="90"/>
+          <el-table-column label="整改期限" sortable="custom" align="center" prop="rectifyDeadline" show-overflow-tooltip width="130"/>
+          <el-table-column label="整改状态" align="center" prop="rectifyStatus" show-overflow-tooltip width="110">
+            <template slot-scope="scope">
+              <p :class="scope.row.rectifyStatus==1?'rectifyStatusColorA':(scope.row.rectifyStatus==2||scope.row.rectifyStatus==3?'rectifyStatusColorB':(scope.row.rectifyStatus==4?'rectifyStatusColorC':''))">{{scope.row.rectifyStatus==1?'已完成':(scope.row.rectifyStatus==2?'待整改':(scope.row.rectifyStatus==3?'待复核':(scope.row.rectifyStatus==4?'暂无法整改':'')))}}</p>
+            </template>
+          </el-table-column>
+          <el-table-column label="整改时间" sortable="custom" align="center" prop="rectifyTime" show-overflow-tooltip width="220">
+            <template slot-scope="scope">
+              <p>{{scope.row.rectifyTime}}<span v-if="scope.row.overdueStatus==1" style="margin-left:10px;color:#EE0606;">已逾期</span></p>
+            </template>
+          </el-table-column>
+          <el-table-column label="审核状态" align="center" prop="examineResult" show-overflow-tooltip width="80">
+            <template slot-scope="scope">
+              {{scope.row.examineResult == 1?'已通过':(scope.row.examineResult == 2?'已驳回':(scope.row.examineResult == 3?'待审核':''))}}
+            </template>
+          </el-table-column>
+          <el-table-column label="操作" align="center" width="80">
+            <template slot-scope="scope">
+              <div class="table-button-box">
+                <p class="table-button-null"></p>
+                <p class="table-button-p" @click="addDialogOpen(true,scope.row)">详情</p>
+                <p class="table-button-null"></p>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+        <pagination :page-sizes="[20, 30, 40, 50]"
+                    v-show="total>0"
+                    :total="total"
+                    :page.sync="queryParams.pageNum"
+                    :limit.sync="queryParams.pageSize"
+                    @pagination="getList"
+        />
+      </div>
+    </div>
+    <infoDialog v-if="infoDialogType" :propsInfoDialogData="propsInfoDialogData"></infoDialog>
+    <lookDocumentDataDialog v-if="lookDocumentType" :propsLookDocumentData="propsLookDocumentData"></lookDocumentDataDialog>
+  </div>
+</template>
+
+<script>
+  import { checkHazardList } from '@/apiDemo/safetyCheck/index'
+  import infoDialog from '@/views/safetyCheck/components/infoDialog/infoDialog.vue'
+  import lookDocumentDataDialog from '@/components/lookDocumentDialog/lookDocumentDataDialog.vue'
+  export default {
+    name: 'index',
+    props:{
+      propsListPageData:{},
+    },
+    components: {
+      lookDocumentDataDialog,
+      infoDialog
+    },
+    data(){
+      return{
+        //子组件数据
+        lookDocumentType:false,
+        propsLookDocumentData:{},
+        infoDialogType:false,
+        propsInfoDialogData:{},
+        //学院列表
+        deptSelectList:[],
+        pageType:1,
+        queryParams:{
+          pageNum:1,
+          pageSize:20,
+          manageStatus:'-1',
+          checkTimeSort:0,
+          searchValue:"",
+          deptId:""
+        },
+        dateRange:[],
+        tableList:[],
+        total:0,
+      }
+    },
+    created(){
+
+    },
+    mounted(){
+      this.getList();
+    },
+    methods:{
+      //开关详情页面
+      addDialogOpen(type,data){
+        if(this.infoDialogType != type){
+          if(type){
+            let obj = {
+              id:data.id
+            }
+            this.$set(this,'propsInfoDialogData',obj);
+            this.$set(this,'infoDialogType',type);
+          }else{
+            this.getList();
+            this.$set(this,'infoDialogType',type);
+          }
+        }
+      },
+      //返回按钮
+      outButton(){
+        this.$parent.goPage(1);
+      },
+      //开始检查
+      goAddPage(type,id){
+        if(this.pageType != type){
+          if(type == 1){
+            //返回
+            this.$set(this,'pageType',type);
+          }else if(type == 2){
+            //开始检查/编辑
+            this.$set(this,'propsAddData',{
+              id:id,
+              title:'实验室自查',
+            });
+            this.$set(this,'pageType',type);
+          }else if(type == 3){
+            //详情
+            this.$set(this,'propsInfoData',{id:id});
+            this.$set(this,'pageType',type);
+          }else if(type == 4){
+            //返回并刷新
+            this.getList();
+            this.$set(this,'pageType',1);
+          }
+        }
+      },
+      //时间排序方法
+      sortChange(val){
+        if(val.prop == 'checkTime'){
+          this.$set(this.queryParams,'checkTimeSort',val.order=='ascending'?'1':(val.order=='descending'?'2':"0"));
+          this.handleQuery();
+        }
+      },
+      //范围选择
+      topLeftClickType(type){
+        if(this.queryParams.buttonType != type){
+          this.$set(this.queryParams,'buttonType',type);
+          this.handleQuery();
+        }
+      },
+      //获取数据列表
+      getList(){
+        checkHazardList({managerId:this.propsListPageData.id}).then(response => {
+          this.total = response.data.total;
+          this.tableList = response.data.records;
+        });
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.$set(this.queryParams,'pageNum',1);
+        this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.$set(this,'dateRange',[]);
+        this.$set(this,'queryParams',{
+          pageNum:1,
+          pageSize:20,
+          manageStatus:'-1',
+          checkTimeSort:0,
+          searchValue:"",
+          deptId:""
+        });
+        this.handleQuery();
+      },
+    },
+  }
+</script>
+
+<style scoped lang="scss">
+  .rectificationReport-listPage{
+    flex: 1;
+    display: flex !important;
+    flex-direction: column;
+    overflow: hidden;
+    .rectificationReport-listPage-page{
+      flex: 1;
+      display: flex !important;
+      flex-direction: column;
+      overflow: hidden;
+      .title-box{
+        border-bottom:1px solid #dedede;
+        display: flex;
+        p:nth-child(1){
+          flex:1;
+          font-size:16px;
+          margin-left:20px;
+          line-height:80px;
+          color:#0045AF;
+          font-weight:500;
+        }
+        p:nth-child(2){
+          margin:20px 20px 0 0;
+        }
+      }
+      .content-box{
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+        padding:20px;
+        overflow: hidden;
+        .rectifyStatusColorA{
+          color:#23B303;
+        }
+        .rectifyStatusColorB{
+          color:#0183FA;
+        }
+        .rectifyStatusColorC{
+          color:#EE0606;
+        }
+      }
+    }
+  }
+</style>

src/views/safetyCheck/safetyHazard/batchAudit.vue

@@ -0,0 +1,374 @@
+<!--批量审核-->
+<template>
+  <div class="batchAudit">
+    <div class="batchAudit-page">
+      <div class="title-box">
+        <el-form :model="queryParams" class="form-box" ref="queryForm" :inline="true" label-width="80px">
+          <el-form-item label="关键字" prop="searchValue">
+            <el-input
+              maxLength="30"
+              v-model="queryParams.searchValue"
+              placeholder="计划标题/实验室/房间号"
+              clearable
+              style="width: 200px"
+            />
+          </el-form-item>
+          <el-form-item label="整改时间" prop="dateRange" style="margin-left:10px;" label-width="70px">
+            <el-date-picker
+              :clearable="false"
+              v-model="dateRange"
+              size="small"
+              style="width: 240px"
+              value-format="yyyy-MM-dd"
+              type="daterange"
+              range-separator="-"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+            ></el-date-picker>
+          </el-form-item>
+          <el-form-item>
+            <p class="inquire-button-one" @click="handleQuery" style="margin-right:10px;">查询</p>
+            <p class="reset-button-one" @click="resetQuery">重置</p>
+          </el-form-item>
+        </el-form>
+      </div>
+      <div class="content-box">
+        <el-table  border :data="tableList" ref="multipleTable" @sort-change="sortChange"
+                   @selection-change="tableChange" :row-key="getRowKeys">
+          <el-table-column type="selection" width="50" :reserve-selection="true" align="center"/>
+          <el-table-column label="序号" align="center"  type="index" width="60" />
+          <el-table-column label="计划标题" align="center" prop="title" show-overflow-tooltip/>
+          <el-table-column label="隐患描述" align="center" prop="hazardDescribe" show-overflow-tooltip width="220"/>
+          <el-table-column label="实验室" align="center" prop="subRoom" show-overflow-tooltip width="170"/>
+          <el-table-column label="安全责任人" align="center" prop="safeUserName" show-overflow-tooltip width="170"/>
+          <el-table-column label="检查时间" sortable="custom" align="center" prop="checkTime" show-overflow-tooltip width="160"/>
+          <el-table-column label="整改人" align="center" prop="rectifyName" show-overflow-tooltip width="90"/>
+          <el-table-column label="整改期限" sortable="custom" align="center" prop="rectifyDeadline" show-overflow-tooltip width="130"/>
+          <el-table-column label="状态" align="center" prop="rectifyStatus" show-overflow-tooltip width="110">
+            <template slot-scope="scope">
+              <p :class="scope.row.rectifyStatus==1?'rectifyStatusColorA':(scope.row.rectifyStatus==2?'rectifyStatusColorB':(scope.row.rectifyStatus==3?'rectifyStatusColorC':''))">{{scope.row.rectifyStatus==1?'已完成':(scope.row.rectifyStatus==2?'待整改':(scope.row.rectifyStatus==3?'待复核':''))}}</p>
+            </template>
+          </el-table-column>
+          <el-table-column label="整改时间" sortable="custom" align="center" prop="rectifyTime" show-overflow-tooltip width="220">
+            <template slot-scope="scope">
+              <p>{{scope.row.rectifyTime}}<span v-if="scope.row.overdueStatus==1" style="margin-left:10px;color:#EE0606;">已逾期</span></p>
+            </template>
+          </el-table-column>
+          <el-table-column label="操作" align="center" width="80">
+            <template slot-scope="scope">
+              <div class="table-button-box">
+                <p class="table-button-null"></p>
+                <p class="table-button-p" @click="addDialogOpen(true,scope.row)">详情</p>
+                <p class="table-button-null"></p>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+        <pagination :page-sizes="[20, 30, 40, 50]"
+                    v-show="total>0"
+                    :total="total"
+                    :page.sync="queryParams.pageNum"
+                    :limit.sync="queryParams.pageSize"
+                    @pagination="getList"
+        />
+      </div>
+      <div class="dialog-footer-box">
+        <p class="dialog-footer-button-null"></p>
+        <p class="dialog-footer-button-info" @click="outButton">返回</p>
+        <p class="dialog-footer-button-primary" @click="openDialogPage(1)">确认</p>
+        <p class="dialog-footer-button-null"></p>
+      </div>
+    </div>
+    <infoDialog v-if="infoDialogType" :propsInfoDialogData="propsInfoDialogData"></infoDialog>
+    <el-dialog class="inspectionPlan-dialog-box"
+               :close-on-click-modal="false"
+               title="批量审核" :visible.sync="dialogType" v-if="dialogType"
+               @close="openDialogPage(2)" width="1303px" append-to-body>
+
+      <el-table border :data="dialogTableList">
+        <el-table-column label="序号" align="center"  type="index" width="60" />
+        <el-table-column label="计划标题" align="center" prop="title" show-overflow-tooltip/>
+        <el-table-column label="隐患描述" align="center" prop="hazardDescribe" show-overflow-tooltip width="220"/>
+        <el-table-column label="实验室" align="center" prop="subRoom" show-overflow-tooltip width="170"/>
+        <el-table-column label="整改人" align="center" prop="rectifyName" show-overflow-tooltip width="90"/>
+        <el-table-column label="操作" align="center" prop="examineResult" width="140">
+          <template slot-scope="scope">
+            <el-select v-model="scope.row.examineResult" placeholder="请选择">
+              <el-option
+                v-for="item in dialogOptions"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value">
+              </el-option>
+            </el-select>
+          </template>
+        </el-table-column>
+        <el-table-column label="审核意见" align="center" prop="examineOpinion" width="400">
+          <template slot-scope="scope">
+            <el-input v-model="scope.row.examineOpinion" placeholder="请输入审核意见" maxLength="100"></el-input>
+          </template>
+        </el-table-column>
+      </el-table>
+      <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="openDialogPage(2)">返回</p>
+        <p class="dialog-footer-button-primary" @click="dialogButton">批量审核</p>
+        <p class="dialog-footer-button-null"></p>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+  import { batchApprovalList,batchApprove } from '@/apiDemo/safetyCheck/index'
+  import infoDialog from '@/views/safetyCheck/components/infoDialog/infoDialog.vue'
+  export default {
+    name: 'batchAudit',
+    props:{
+      propsBatchAuditData:{},
+    },
+    components: {
+      infoDialog
+    },
+    data(){
+      return{
+        //组件传参
+        propsInfoDialogData:{},
+        infoDialogType:false,
+        queryParams:{
+          pageNum:1,
+          pageSize:20,
+          rectifyStatus:3,
+          searchValue:"",
+        },
+        dateRange:[],
+        tableList:[],
+        total:0,
+        tableNum:0,
+        tableIds:[],
+        //审批弹窗数据
+        dialogType:false,
+        dialogTableList:[],
+        dialogOptions:[
+          {value:"0",label:"驳回"},
+          {value:"1",label:"通过"},
+        ],
+      }
+    },
+    created(){
+
+    },
+    mounted(){
+      this.getList();
+    },
+    methods:{
+      //批量审核
+      dialogButton(){
+        let self = this;
+        let list = [];
+        for(let i=0;i<self.dialogTableList.length;i++){
+          if(!self.dialogTableList[i].examineResult){
+            this.msgError('第'+(i+1)+'条数据,未选择审核结果')
+            return
+          }
+          if(!self.dialogTableList[i].examineOpinion){
+            this.msgError('第'+(i+1)+'条数据,未输入审核意见')
+            return
+          }
+          let obj = {
+            id:self.dialogTableList[i].rectifyId,
+            checkHazardId:self.dialogTableList[i].id,
+            examineResult:self.dialogTableList[i].examineResult,
+            examineOpinion:self.dialogTableList[i].examineOpinion,
+
+          };
+          list.push(obj);
+        }
+        batchApprove(list).then(response => {
+          this.$refs.multipleTable.clearSelection();
+          this.msgSuccess(response.msg)
+          this.$parent.goPage(3);
+        });
+      },
+      //批量审核弹窗
+      openDialogPage(type){
+        if(type == 1){
+          if(!this.$refs.multipleTable.selection[0]){
+            this.msgError('请勾选需要审批的数据')
+            return
+          }
+          let list = JSON.parse(JSON.stringify(this.$refs.multipleTable.selection));
+          for(let i=0;i<list.length;i++){
+            list[i].examineResult = '';
+            list[i].examineOpinion = '';
+          }
+          this.$set(this,'dialogTableList',list);
+          this.$set(this,'dialogType',true);
+        }else{
+          this.$set(this,'dialogType',false);
+        }
+      },
+      //开关详情页面
+      addDialogOpen(type,data){
+        if(this.infoDialogType != type){
+          if(type){
+            let obj = {
+              id:data.id
+            }
+            this.$set(this,'propsInfoDialogData',obj);
+            this.$set(this,'infoDialogType',type);
+          }else{
+            this.$refs.multipleTable.clearSelection();
+            this.getList();
+            this.$set(this,'infoDialogType',type);
+          }
+        }
+      },
+      //返回
+      outButton(){
+        this.$parent.goPage(1);
+      },
+      //时间排序方法
+      sortChange(val){
+        if(val.prop == 'checkTime'){
+          this.$set(this.queryParams,'checkTimeOrder',val.order=='ascending'?'1':(val.order=='descending'?'2':''));
+          this.$set(this.queryParams,'zgTimeOrder','');
+          this.$set(this.queryParams,'zgTermOrder','');
+          this.handleQuery();
+        }else if(val.prop == 'rectifyTime'){
+          this.$set(this.queryParams,'zgTimeOrder',val.order=='ascending'?'1':(val.order=='descending'?'2':''));
+          this.$set(this.queryParams,'checkTimeOrder','');
+          this.$set(this.queryParams,'zgTermOrder','');
+          this.handleQuery();
+        }else if(val.prop == 'rectifyDeadline'){
+          this.$set(this.queryParams,'zgTermOrder',val.order=='ascending'?'1':(val.order=='descending'?'2':''));
+          this.$set(this.queryParams,'checkTimeOrder','');
+          this.$set(this.queryParams,'zgTimeOrder','');
+          this.handleQuery();
+        }
+      },
+      //获取数据列表
+      getList(){
+        let obj = JSON.parse(JSON.stringify(this.queryParams))
+        if(this.dateRange[0]){
+          obj.beginTime = this.dateRange[0];
+        }else{
+          obj.beginTime = "";
+        }
+        if(this.dateRange[1]){
+          obj.endTime = this.dateRange[1];
+        }else{
+          obj.endTime = "";
+        }
+        obj.hazardType = this.propsBatchAuditData.hazardType
+        batchApprovalList(obj).then(response => {
+          this.total = response.data.total;
+          this.tableList = response.data.records;
+        });
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.$set(this.queryParams,'pageNum',1);
+        this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.$set(this,'dateRange',[]);
+        this.$set(this,'queryParams',{
+          pageNum:1,
+          pageSize:20,
+          rectifyStatus:3,
+          searchValue:"",
+        });
+        this.handleQuery();
+      },
+      /*===记录勾选数据===
+        需要再el-table 添加  :row-key="getRowKeys"
+        需要在selection 添加 :reserve-selection="true"
+      */
+      getRowKeys(row) {
+        return row.id
+      },
+      tableChange(selection){
+        this.tableNum = selection.length;
+        this.tableIds = selection.map(item => item.userId);
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .batchAudit{
+    flex: 1;
+    display: flex !important;
+    flex-direction: column;
+    overflow: hidden;
+    .batchAudit-page{
+      flex: 1;
+      display: flex !important;
+      flex-direction: column;
+      overflow: hidden;
+      .title-box{
+        padding-top:20px;
+        .form-button-max-big-box{
+          display: inline-block;
+          .form-button-big-box{
+            display: flex;
+            div{
+              position: relative;
+              height:40px;
+              width:80px;
+              line-height: 40px;
+              text-align: center;
+              color:#999;
+              font-size:14px;
+              border:1px solid #999;
+              border-radius:4px;
+              margin-left:10px;
+              font-weight:500;
+              cursor: pointer;
+              .icon-p{
+                width:15px;
+                height:15px;
+                line-height:15px;
+                text-align: center;
+                position: absolute;
+                right:0;
+                bottom:0;
+                color:#fff;
+                background: #0183fa;
+                border-top-left-radius:4px;
+              }
+            }
+            .checkDiv{
+              color:#0183FA;
+              border:1px solid #0183FA;
+            }
+          }
+        }
+      }
+      .content-box{
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+        padding:0 20px 20px;
+        overflow: hidden;
+        .rectifyStatusColorA{
+          color:#23B303;
+        }
+        .rectifyStatusColorB{
+          color:#0183FA;
+        }
+        .rectifyStatusColorC{
+          color:#EE0606;
+        }
+      }
+      .dialog-footer-box{
+        padding:20px 0;
+        height:70px;
+        border-top:1px solid #D8D8D8;
+        display: flex;
+      }
+    }
+  }
+</style>

src/views/safetyCheck/safetyHazard/cannotListPage.vue

@@ -0,0 +1,313 @@
+<!--暂无法整改隐患-->
+<template>
+  <div class="cannotListPage">
+    <div class="title-box">
+      <el-form :model="queryParams" class="form-box" ref="queryForm" :inline="true" label-width="80px">
+        <div class="form-button-max-big-box">
+          <div class="form-button-big-box" style="margin-left:10px;">
+            <p class="text-p" :class="queryParams.hazardType=='1'?'checkDiv':''" @click="topLeftClickType('1')">校院巡查</p>
+            <p class="text-p" :class="queryParams.hazardType=='2'?'checkDiv':''" @click="topLeftClickType('2')">实验室自查</p>
+          </div>
+        </div>
+        <!--与我相关-->
+        <div class="form-button-max-big-box-me">
+          <div class="form-button-big-box-me">
+            <div :class="queryParams.myRelated==1?'checkDiv-me':''" @click="topRightClickType">
+              <p class="text-p-me">与我有关{{correlationNum}}</p>
+              <p class="el-icon-check icon-p-me" v-if="queryParams.myRelated==1"></p>
+            </div>
+          </div>
+        </div>
+        <el-form-item label="关键字" prop="searchValue">
+          <el-input
+            maxLength="30"
+            v-model="queryParams.searchValue"
+            placeholder="计划标题/实验室/房间号"
+            clearable
+            style="width: 200px"
+          />
+        </el-form-item>
+        <el-form-item label="处置时间" prop="dateRange" style="margin-left:10px;" label-width="70px">
+          <el-date-picker
+            :clearable="false"
+            v-model="dateRange"
+            size="small"
+            style="width: 240px"
+            value-format="yyyy-MM-dd"
+            type="daterange"
+            range-separator="-"
+            start-placeholder="开始日期"
+            end-placeholder="结束日期"
+          ></el-date-picker>
+        </el-form-item>
+        <el-form-item>
+          <p class="inquire-button-one" @click="handleQuery" style="margin-right:10px;">查询</p>
+          <p class="reset-button-one" @click="resetQuery">重置</p>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div class="content-box">
+      <el-table  border :data="tableList" ref="multipleTable" @sort-change="sortChange">
+        <el-table-column label="序号" align="center"  type="index" width="60" />
+        <el-table-column label="计划标题" align="center" prop="title" show-overflow-tooltip/>
+        <el-table-column label="检查组织" align="center" prop="deptName" show-overflow-tooltip width="180">
+          <template slot-scope="scope">
+            {{scope.row.hazardType == 1?'校院巡查':(scope.row.hazardType == 2?'实验室自查':'')}}
+          </template>
+        </el-table-column>
+        <el-table-column label="实验室" align="center" prop="subRoom" show-overflow-tooltip width="240"/>
+        <el-table-column label="检查类型" align="center" prop="checkRange" show-overflow-tooltip width="120">
+          <template slot-scope="scope">
+            <p>{{scope.row.checkCategory==1?'综合检查':(scope.row.checkCategory==2?'专项检查':'-')}}</p>
+          </template>
+        </el-table-column>
+        <el-table-column label="检查内容" align="center" prop="checkRange" show-overflow-tooltip width="120">
+          <template slot-scope="scope">
+            <p>{{scope.row.hazardName?scope.row.hazardName:'-'}}</p>
+          </template>
+        </el-table-column>
+        <el-table-column label="检查时间" sortable align="center" prop="checkTime" show-overflow-tooltip width="160"/>
+        <el-table-column label="处理人" align="center" prop="rectifyName" show-overflow-tooltip width="90"/>
+        <el-table-column label="原因描述" align="center" prop="rectifyMeasure" show-overflow-tooltip width="435"/>
+        <el-table-column label="操作" align="center" width="80">
+          <template slot-scope="scope">
+            <div class="table-button-box">
+              <p class="table-button-null"></p>
+              <p class="table-button-p" v-hasPermi="['safety:rectifyHazard:query']"
+                 @click="addDialogOpen(true,scope.row)">详情</p>
+              <p class="table-button-null"></p>
+            </div>
+          </template>
+        </el-table-column>
+      </el-table>
+      <pagination :page-sizes="[20, 30, 40, 50]"
+                  v-show="total>0"
+                  :total="total"
+                  :page.sync="queryParams.pageNum"
+                  :limit.sync="queryParams.pageSize"
+                  @pagination="getList"
+      />
+    </div>
+    <infoDialog v-if="infoDialogType" :propsInfoDialogData="propsInfoDialogData"></infoDialog>
+  </div>
+</template>
+
+<script>
+  import { unableRectifyList } from '@/apiDemo/safetyCheck/index'
+  import infoDialog from '@/views/safetyCheck/components/infoDialog/infoDialog.vue'
+  export default {
+    name: 'cannotListPage',
+    components: {
+      infoDialog
+    },
+    data(){
+      return{
+        propsInfoDialogData:{},
+        infoDialogType:false,
+        queryParams:{
+          pageNum:1,
+          pageSize:20,
+          rectifyStatus:4,
+          hazardType:1,
+          searchValue:"",
+          checkTimeOrder:"",
+          myRelated:1,
+        },
+        dateRange:[],
+        tableList:[],
+        total:0,
+        correlationNum:'',
+      }
+    },
+    created(){},
+    mounted(){
+      this.getList();
+    },
+    methods:{
+      //获取相关数量
+      getCorrelationNum(){
+        unableRectifyList({
+          pageNum:1,
+          pageSize:20,
+          rectifyStatus:4,
+          checkTimeOrder:"",
+          myRelated:1,
+          hazardType:this.queryParams.hazardType,
+          searchValue:this.queryParams.searchValue,
+          beginTime:this.dateRange[0]?this.dateRange[0]:'',
+          endTime:this.dateRange[1]?this.dateRange[1]:'',
+        }).then(response => {
+          this.$set(this,'correlationNum',response.data.total>999?' 999+':(response.data.total<1?'':' '+response.data.total));
+        });
+      },
+      //与我相关按钮
+      topRightClickType(){
+        this.$set(this.queryParams,'myRelated',this.queryParams.myRelated==1?0:1);
+        this.handleQuery();
+      },
+      //开关详情页面
+      addDialogOpen(type,data){
+        if(this.infoDialogType != type){
+          if(type){
+            let obj = {
+              id:data.id
+            }
+            this.$set(this,'propsInfoDialogData',obj);
+            this.$set(this,'infoDialogType',type);
+          }else{
+            this.getList();
+            this.$set(this,'infoDialogType',type);
+          }
+        }
+      },
+      //范围选择
+      topLeftClickType(type){
+        if(this.queryParams.hazardType != type){
+          this.$set(this.queryParams,'hazardType',type);
+          this.handleQuery();
+        }
+      },
+      //时间排序方法
+      sortChange(val){
+        if(val.prop == 'checkTime'){
+          this.$set(this.queryParams,'checkTimeOrder',val.order=='ascending'?'1':(val.order=='descending'?'2':''));
+          this.$set(this.queryParams,'zgTimeOrder','');
+          this.$set(this.queryParams,'zgTermOrder','');
+          this.handleQuery();
+        }
+      },
+      //获取数据列表
+      getList(){
+        let obj = JSON.parse(JSON.stringify(this.queryParams))
+        if(this.dateRange[0]){
+          obj.beginTime = this.dateRange[0];
+        }else{
+          obj.beginTime = "";
+        }
+        if(this.dateRange[1]){
+          obj.endTime = this.dateRange[1];
+        }else{
+          obj.endTime = "";
+        }
+        let self = this;
+        setTimeout(function(){
+          self.getCorrelationNum();
+        },500);
+        unableRectifyList(obj).then(response => {
+          this.total = response.data.total;
+          this.tableList = response.data.records;
+        });
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.$set(this.queryParams,'pageNum',1);
+        this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.$set(this,'dateRange',[]);
+        this.$set(this,'queryParams',{
+          pageNum:1,
+          pageSize:20,
+          rectifyStatus:4,
+          hazardType:1,
+          searchValue:"",
+          checkTimeOrder:"",
+          myRelated:1,
+        });
+        this.handleQuery();
+      },
+    },
+  }
+</script>
+
+<style scoped lang="scss">
+  .cannotListPage{
+    flex: 1;
+    display: flex !important;
+    flex-direction: column;
+    overflow: hidden;
+    .title-box{
+      padding-top:20px;
+      .form-button-max-big-box{
+        display: inline-block;
+        margin-left:10px;
+        .form-button-big-box{
+          display: flex;
+          p:nth-child(1){
+            border-top-left-radius: 4px;
+            border-bottom-left-radius: 4px;
+            border-top:1px solid #E0E0E0;
+            border-bottom:1px solid #E0E0E0;
+          }
+          p:nth-child(2){
+            border-top-right-radius: 4px;
+            border-bottom-right-radius: 4px;
+            border-top:1px solid #E0E0E0;
+            border-bottom:1px solid #E0E0E0;
+            border-right:1px solid #E0E0E0;
+          }
+          p{
+            height:40px;
+            width:100px;
+            line-height: 40px;
+            text-align: center;
+            color:#666666;
+            font-size:14px;
+            font-weight:500;
+            cursor: pointer;
+            border-left:1px solid #E0E0E0;
+          }
+          .checkDiv{
+            color:#fff!important;
+            border:1px solid #0183FA!important;
+            background-color: #0183FA;
+          }
+        }
+      }
+      .form-button-max-big-box-me{
+        display: inline-block;
+        .form-button-big-box-me{
+          display: flex;
+          div{
+            position: relative;
+            height:40px;
+            width:130px;
+            line-height: 40px;
+            text-align: center;
+            color:#999;
+            font-size:14px;
+            border:1px solid #999;
+            border-radius:4px;
+            margin-left:10px;
+            font-weight:500;
+            cursor: pointer;
+            .icon-p-me{
+              width:15px;
+              height:15px;
+              line-height:15px;
+              text-align: center;
+              position: absolute;
+              right:0;
+              bottom:0;
+              color:#fff;
+              background: #0183fa;
+              border-top-left-radius:4px;
+            }
+          }
+          .checkDiv-me{
+            color:#0183FA!important;
+            border:1px solid #0183FA!important;
+          }
+        }
+      }
+    }
+    .content-box{
+      flex: 1;
+      display: flex;
+      flex-direction: column;
+      padding:0 20px 20px;
+      overflow: hidden;
+    }
+  }
+</style>

src/views/safetyCheck/safetyHazard/departmentListPage.vue

@@ -0,0 +1,423 @@
+<!--实验室自查隐患-->
+<template>
+  <div class="departmentListPage">
+    <div class="departmentListPage-page" v-if="minPageType == 1">
+      <div class="title-box">
+        <el-form :model="queryParams" class="form-box" ref="queryForm" :inline="true" label-width="80px">
+          <div class="form-button-max-big-box">
+            <div class="form-button-big-box" style="margin-left:10px;">
+              <p class="text-p" :class="queryParams.rectifyStatus=='2'?'checkDiv':''" @click="topLeftClickType('2')">待整改</p>
+              <p class="text-p" :class="queryParams.rectifyStatus=='3'?'checkDiv':''" @click="topLeftClickType('3')">待复核</p>
+              <p class="text-p" :class="queryParams.rectifyStatus=='1'?'checkDiv':''" @click="topLeftClickType('1')">已完成</p>
+            </div>
+          </div>
+          <!--与我相关-->
+          <div class="form-button-max-big-box-me">
+            <div class="form-button-big-box-me">
+              <div :class="queryParams.myRelated==1?'checkDiv-me':''" @click="topRightClickType">
+                <p class="text-p-me">与我有关{{correlationNum}}</p>
+                <p class="el-icon-check icon-p-me" v-if="queryParams.myRelated==1"></p>
+              </div>
+            </div>
+          </div>
+          <el-form-item label="关键字" prop="searchValue">
+            <el-input
+              maxLength="30"
+              v-model="queryParams.searchValue"
+              placeholder="计划标题/实验室/房间号"
+              clearable
+              style="width: 200px"
+            />
+          </el-form-item>
+          <el-form-item label="整改时间" prop="dateRange" style="margin-left:10px;" label-width="70px">
+            <el-date-picker
+              :clearable="false"
+              v-model="dateRange"
+              size="small"
+              style="width: 240px"
+              value-format="yyyy-MM-dd"
+              type="daterange"
+              range-separator="-"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+            ></el-date-picker>
+          </el-form-item>
+          <el-form-item label="审核状态" prop="examineResult">
+            <el-select v-model="queryParams.examineResult" placeholder="请选择" style="width: 160px">
+              <el-option
+                v-for="item in options"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value">
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item>
+            <p class="inquire-button-one" @click="handleQuery" style="margin-right:10px;">查询</p>
+            <p class="reset-button-one" @click="resetQuery">重置</p>
+          </el-form-item>
+          <el-form-item style="float: right;" v-hasPermi="['safety:rectifyHazard:approve']">
+            <el-col :span="1.5">
+              <p class="inquire-button-one"
+                 style="width:90px;"
+                 @click="goPage(2)"
+              >批量审核</p>
+            </el-col>
+          </el-form-item>
+        </el-form>
+      </div>
+      <div class="content-box">
+        <el-table  border :data="tableList" ref="multipleTable" @sort-change="sortChange">
+          <el-table-column label="序号" align="center"  type="index" width="60" />
+          <el-table-column label="计划标题" align="center" prop="title" show-overflow-tooltip/>
+          <el-table-column label="隐患描述" align="center" prop="hazardDescribe" show-overflow-tooltip width="220"/>
+          <el-table-column label="实验室" align="center" prop="subRoom" show-overflow-tooltip width="170"/>
+          <el-table-column label="检查类型" align="center" prop="checkRange" show-overflow-tooltip width="120">
+            <template slot-scope="scope">
+              <p>{{scope.row.checkCategory==1?'综合检查':(scope.row.checkCategory==2?'专项检查':'-')}}</p>
+            </template>
+          </el-table-column>
+          <el-table-column label="检查内容" align="center" prop="checkRange" show-overflow-tooltip width="120">
+            <template slot-scope="scope">
+              <p>{{scope.row.hazardName?scope.row.hazardName:'-'}}</p>
+            </template>
+          </el-table-column>
+          <el-table-column label="检查时间" sortable="custom" align="center" prop="checkTime" show-overflow-tooltip width="160"/>
+          <el-table-column label="整改人" align="center" prop="rectifyName" show-overflow-tooltip width="90"/>
+          <el-table-column label="整改期限" sortable="custom" align="center" prop="rectifyDeadline" show-overflow-tooltip width="180">
+            <template slot-scope="scope">
+              <p>{{scope.row.rectifyDeadline}}<span v-if="scope.row.overdueStatus==1" style="margin-left:10px;color:#EE0606;">已逾期</span></p>
+            </template>
+          </el-table-column>
+          <el-table-column label="整改状态" align="center" prop="rectifyStatus" show-overflow-tooltip width="110">
+            <template slot-scope="scope">
+              <p :class="scope.row.rectifyStatus==1?'rectifyStatusColorA':(scope.row.rectifyStatus==2||scope.row.rectifyStatus==3?'rectifyStatusColorB':'')">{{scope.row.rectifyStatus==1?'已完成':(scope.row.rectifyStatus==2?'待整改':(scope.row.rectifyStatus==3?'待复核':''))}}</p>
+            </template>
+          </el-table-column>
+          <el-table-column label="整改时间" sortable="custom" align="center" prop="rectifyTime" show-overflow-tooltip width="170"/>
+          <el-table-column label="审核状态" align="center" prop="examineResult" show-overflow-tooltip width="80">
+            <template slot-scope="scope">
+              {{scope.row.examineResult == 1?'已通过':(scope.row.examineResult == 0?'已驳回':(scope.row.examineResult == 2?'待审核':''))}}
+            </template>
+          </el-table-column>
+          <el-table-column label="操作" align="center" width="80">
+            <template slot-scope="scope">
+              <div class="table-button-box">
+                <p class="table-button-null"></p>
+                <p class="table-button-p" v-hasPermi="['safety:rectifyHazard:query']"
+                   @click="addDialogOpen(true,scope.row)">详情</p>
+                <p class="table-button-null"></p>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+        <pagination :page-sizes="[20, 30, 40, 50]"
+                    v-show="total>0"
+                    :total="total"
+                    :page.sync="queryParams.pageNum"
+                    :limit.sync="queryParams.pageSize"
+                    @pagination="getList"
+        />
+      </div>
+    </div>
+    <batchAudit v-if="minPageType == 2" :propsBatchAuditData="propsBatchAuditData"></batchAudit>
+    <infoDialog v-if="infoDialogType" :propsInfoDialogData="propsInfoDialogData"></infoDialog>
+  </div>
+</template>
+
+<script>
+  import { rectifyList, recheckList, overList } from '@/apiDemo/safetyCheck/index'
+  import batchAudit from './batchAudit.vue'
+  import infoDialog from '@/views/safetyCheck/components/infoDialog/infoDialog.vue'
+  export default {
+    name: 'departmentListPage',
+    components: {
+      batchAudit,
+      infoDialog
+    },
+    data(){
+      return{
+        //子组件参数
+        propsBatchAuditData:{},
+        propsInfoDialogData:{},
+        minPageType:1,
+        infoDialogType:false,
+        options:[
+          {value:"2",label:"待审核"},
+          {value:"1",label:"已通过"},
+          {value:"0",label:"已驳回"},
+        ],
+        queryParams:{
+          pageNum:1,
+          pageSize:20,
+          hazardType:2,
+          rectifyStatus:"2",
+          examineResult:"",
+          searchValue:"",
+          checkTimeOrder:"",
+          zgTimeOrder:"",
+          zgTermOrder:"",
+          myRelated:1,
+        },
+        dateRange:[],
+        tableList:[],
+        total:0,
+        correlationNum:'',
+      }
+    },
+    created(){},
+    mounted(){
+      this.getList();
+    },
+    methods:{
+      //获取相关数量
+      getCorrelationNum(){
+        rectifyList({
+          pageNum:1,
+          pageSize:20,
+          hazardType:2,
+          checkTimeOrder:"",
+          zgTimeOrder:"",
+          zgTermOrder:"",
+          myRelated:1,
+          rectifyStatus:this.queryParams.rectifyStatus,
+          examineResult:this.queryParams.examineResult,
+          searchValue:this.queryParams.searchValue,
+          beginTime:this.dateRange[0]?this.dateRange[0]:'',
+          endTime:this.dateRange[1]?this.dateRange[1]:'',
+        }).then(response => {
+          this.$set(this,'correlationNum',response.data.total>999?' 999+':(response.data.total<1?'':' '+response.data.total));
+        });
+      },
+      //与我相关按钮
+      topRightClickType(){
+        this.$set(this.queryParams,'myRelated',this.queryParams.myRelated==1?0:1);
+        this.handleQuery();
+      },
+      //开关详情页面
+      addDialogOpen(type,data){
+        if(this.infoDialogType != type){
+          if(type){
+            let obj = {
+              id:data.id
+            }
+            this.$set(this,'propsInfoDialogData',obj);
+            this.$set(this,'infoDialogType',type);
+          }else{
+            this.getList();
+            this.$set(this,'infoDialogType',type);
+          }
+        }
+      },
+      //页面切换
+      goPage(type){
+        if(this.minPageType != type){
+          if(type == 1){
+            //返回
+            this.$set(this,'minPageType',type);
+          }else if(type == 2){
+            //批量审核
+            this.$set(this,'propsBatchAuditData',{hazardType:2,});
+            this.$set(this,'minPageType',type);
+          }else if(type == 3){
+            //返回并刷新
+            this.getList();
+            this.$set(this,'minPageType',1);
+          }
+        }
+      },
+      //范围选择
+      topLeftClickType(type){
+        if(this.queryParams.rectifyStatus != type){
+          this.$set(this.queryParams,'rectifyStatus',type);
+          this.handleQuery();
+        }
+      },
+      //时间排序方法
+      sortChange(val){
+        if(val.prop == 'checkTime'){
+          this.$set(this.queryParams,'checkTimeOrder',val.order=='ascending'?'1':(val.order=='descending'?'2':''));
+          this.$set(this.queryParams,'zgTimeOrder','');
+          this.$set(this.queryParams,'zgTermOrder','');
+          this.handleQuery();
+        }else if(val.prop == 'rectifyTime'){
+          this.$set(this.queryParams,'zgTimeOrder',val.order=='ascending'?'1':(val.order=='descending'?'2':''));
+          this.$set(this.queryParams,'checkTimeOrder','');
+          this.$set(this.queryParams,'zgTermOrder','');
+          this.handleQuery();
+        }else if(val.prop == 'rectifyDeadline'){
+          this.$set(this.queryParams,'zgTermOrder',val.order=='ascending'?'1':(val.order=='descending'?'2':''));
+          this.$set(this.queryParams,'checkTimeOrder','');
+          this.$set(this.queryParams,'zgTimeOrder','');
+          this.handleQuery();
+        }
+      },
+      //获取数据列表
+      getList(){
+        let obj = JSON.parse(JSON.stringify(this.queryParams))
+        if(this.dateRange[0]){
+          obj.beginTime = this.dateRange[0];
+        }else{
+          obj.beginTime = "";
+        }
+        if(this.dateRange[1]){
+          obj.endTime = this.dateRange[1];
+        }else{
+          obj.endTime = "";
+        }
+        let self = this;
+        setTimeout(function(){
+          self.getCorrelationNum();
+        },500);
+        if(this.queryParams.rectifyStatus == 2){
+          rectifyList(obj).then(response => {
+            this.total = response.data.total;
+            this.tableList = response.data.records;
+          });
+        } else if (this.queryParams.rectifyStatus == 3){
+          recheckList(obj).then(response => {
+            this.total = response.data.total;
+            this.tableList = response.data.records;
+          });
+        }  else if (this.queryParams.rectifyStatus == 1){
+          overList(obj).then(response => {
+            this.total = response.data.total;
+            this.tableList = response.data.records;
+          });
+        }
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.$set(this.queryParams,'pageNum',1);
+        this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.$set(this,'dateRange',[]);
+        this.$set(this,'queryParams',{
+          pageNum:1,
+          pageSize:20,
+          hazardType:2,
+          rectifyStatus:"2",
+          examineResult:"",
+          searchValue:"",
+          checkTimeOrder:"",
+          zgTimeOrder:"",
+          zgTermOrder:"",
+          myRelated:1,
+        });
+        this.handleQuery();
+      },
+    },
+  }
+</script>
+
+<style scoped lang="scss">
+  .departmentListPage{
+    flex: 1;
+    display: flex !important;
+    flex-direction: column;
+    overflow: hidden;
+    .departmentListPage-page{
+      flex: 1;
+      display: flex !important;
+      flex-direction: column;
+      overflow: hidden;
+      .title-box{
+        padding-top:20px;
+        .form-button-max-big-box{
+          display: inline-block;
+          margin-left:10px;
+          .form-button-big-box{
+            display: flex;
+            p:nth-child(1){
+              border-top-left-radius: 4px;
+              border-bottom-left-radius: 4px;
+              border-top:1px solid #E0E0E0;
+              border-bottom:1px solid #E0E0E0;
+            }
+            p:nth-child(2){
+              border-top:1px solid #E0E0E0;
+              border-bottom:1px solid #E0E0E0;
+            }
+            p:nth-child(3){
+              border-top-right-radius: 4px;
+              border-bottom-right-radius: 4px;
+              border-top:1px solid #E0E0E0;
+              border-bottom:1px solid #E0E0E0;
+              border-right:1px solid #E0E0E0;
+            }
+            p{
+              height:40px;
+              width:80px;
+              line-height: 40px;
+              text-align: center;
+              color:#666666;
+              font-size:14px;
+              font-weight:500;
+              cursor: pointer;
+              border-left:1px solid #E0E0E0;
+            }
+            .checkDiv{
+              color:#fff!important;
+              border:1px solid #0183FA!important;
+              background-color: #0183FA;
+            }
+          }
+        }
+        .form-button-max-big-box-me{
+          display: inline-block;
+          .form-button-big-box-me{
+            display: flex;
+            div{
+              position: relative;
+              height:40px;
+              width:130px;
+              line-height: 40px;
+              text-align: center;
+              color:#999;
+              font-size:14px;
+              border:1px solid #999;
+              border-radius:4px;
+              margin-left:10px;
+              font-weight:500;
+              cursor: pointer;
+              .icon-p-me{
+                width:15px;
+                height:15px;
+                line-height:15px;
+                text-align: center;
+                position: absolute;
+                right:0;
+                bottom:0;
+                color:#fff;
+                background: #0183fa;
+                border-top-left-radius:4px;
+              }
+            }
+            .checkDiv-me{
+              color:#0183FA!important;
+              border:1px solid #0183FA!important;
+            }
+          }
+        }
+      }
+      .content-box{
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+        padding:0 20px 20px;
+        overflow: hidden;
+        .rectifyStatusColorA{
+          color:#23B303;
+        }
+        .rectifyStatusColorB{
+          color:#0183FA;
+        }
+        .rectifyStatusColorC{
+          color:#EE0606;
+        }
+      }
+    }
+  }
+</style>

src/views/safetyCheck/safetyHazard/index.vue

@@ -0,0 +1,105 @@
+<!--安全隐患-->
+<template>
+  <div class="app-container safetyHazard">
+    <div class="safetyHazard-page">
+      <div class="title-button-box">
+        <div :class="pageType == 1?'check-div':''" @click="goPage(1)">
+          <p>校院巡查隐患</p>
+          <p></p>
+        </div>
+        <div :class="pageType == 2?'check-div':''" @click="goPage(2)">
+          <p>实验室自查隐患</p>
+          <p></p>
+        </div>
+        <div :class="pageType == 3?'check-div':''" @click="goPage(3)">
+          <p>暂无法整改隐患</p>
+          <p></p>
+        </div>
+      </div>
+      <schoolListPage v-if="pageType == 1"></schoolListPage>
+      <departmentListPage v-if="pageType == 2"></departmentListPage>
+      <cannotListPage v-if="pageType == 3"></cannotListPage>
+    </div>
+  </div>
+</template>
+
+<script>
+  import schoolListPage from './schoolListPage.vue'
+  import departmentListPage from './departmentListPage.vue'
+  import cannotListPage from './cannotListPage.vue'
+  export default {
+    name: 'index',
+    components: {
+      schoolListPage,
+      departmentListPage,
+      cannotListPage
+    },
+    data(){
+      return{
+        pageType:1,
+
+      }
+    },
+    created(){
+
+    },
+    mounted(){
+
+    },
+    methods:{
+      goPage(type){
+        if(this.pageType != type){
+          this.$set(this,'pageType',type);
+        }
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .safetyHazard{
+    flex: 1;
+    display: flex !important;
+    flex-direction: column;
+    overflow: hidden;
+    .safetyHazard-page{
+      flex: 1;
+      display: flex !important;
+      flex-direction: column;
+      overflow: hidden;
+      .title-button-box{
+        display: flex;
+        height:80px;
+        border-bottom:1px solid #E0E0E0;
+        div{
+          width:120px;
+          margin-left:47px;
+          overflow: hidden;
+          cursor: pointer;
+          p:nth-child(1){
+            font-size:16px;
+            color:#333;
+            text-align: center;
+            line-height:40px;
+            margin-top:20px;
+            font-weight: 500;
+          }
+          p:nth-child(2){
+            width:60px;
+            height:4px;
+            border-radius:4px;
+            margin:0 30px;
+          }
+        }
+        .check-div{
+          p:nth-child(1){
+            color:#0045AF;
+          }
+          p:nth-child(2){
+            background-color: #0045AF;
+          }
+        }
+      }
+    }
+  }
+</style>

src/views/safetyCheck/safetyHazard/schoolListPage.vue

@@ -0,0 +1,423 @@
+<!--校院巡查隐患-->
+<template>
+  <div class="schoolListPage">
+    <div class="schoolListPage-page" v-if="minPageType == 1">
+      <div class="title-box">
+        <el-form :model="queryParams" class="form-box" ref="queryForm" :inline="true" label-width="80px">
+          <div class="form-button-max-big-box">
+            <div class="form-button-big-box" style="margin-left:10px;">
+              <p class="text-p" :class="queryParams.rectifyStatus=='2'?'checkDiv':''" @click="topLeftClickType('2')">待整改</p>
+              <p class="text-p" :class="queryParams.rectifyStatus=='3'?'checkDiv':''" @click="topLeftClickType('3')">待复核</p>
+              <p class="text-p" :class="queryParams.rectifyStatus=='1'?'checkDiv':''" @click="topLeftClickType('1')">已完成</p>
+            </div>
+          </div>
+          <!--与我相关-->
+          <div class="form-button-max-big-box-me">
+            <div class="form-button-big-box-me">
+              <div :class="queryParams.myRelated==1?'checkDiv-me':''" @click="topRightClickType">
+                <p class="text-p-me">与我有关{{correlationNum}}</p>
+                <p class="el-icon-check icon-p-me" v-if="queryParams.myRelated==1"></p>
+              </div>
+            </div>
+          </div>
+          <el-form-item label="关键字" prop="searchValue">
+            <el-input
+              maxLength="30"
+              v-model="queryParams.searchValue"
+              placeholder="计划标题/实验室/房间号"
+              clearable
+              style="width: 200px"
+            />
+          </el-form-item>
+          <el-form-item label="整改时间" prop="dateRange" style="margin-left:10px;" label-width="70px">
+            <el-date-picker
+              :clearable="false"
+              v-model="dateRange"
+              size="small"
+              style="width: 240px"
+              value-format="yyyy-MM-dd"
+              type="daterange"
+              range-separator="-"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+            ></el-date-picker>
+          </el-form-item>
+          <el-form-item label="审核状态" prop="examineResult">
+            <el-select v-model="queryParams.examineResult" placeholder="请选择" style="width: 160px">
+              <el-option
+                v-for="item in options"
+                :key="item.value"
+                :label="item.label"
+                :value="item.value">
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item>
+            <p class="inquire-button-one" @click="handleQuery" style="margin-right:10px;">查询</p>
+            <p class="reset-button-one" @click="resetQuery">重置</p>
+          </el-form-item>
+          <el-form-item style="float: right;" v-hasPermi="['safety:rectifyHazard:approve']">
+            <el-col :span="1.5">
+              <p class="inquire-button-one"
+                 style="width:90px;"
+                 @click="goPage(2)"
+              >批量审核</p>
+            </el-col>
+          </el-form-item>
+        </el-form>
+      </div>
+      <div class="content-box">
+        <el-table  border :data="tableList" ref="multipleTable" @sort-change="sortChange">
+          <el-table-column label="序号" align="center"  type="index" width="60" />
+          <el-table-column label="计划标题" align="center" prop="title" show-overflow-tooltip/>
+          <el-table-column label="隐患描述" align="center" prop="hazardDescribe" show-overflow-tooltip width="220"/>
+          <el-table-column label="实验室" align="center" prop="subRoom" show-overflow-tooltip width="170"/>
+          <el-table-column label="检查类型" align="center" prop="checkRange" show-overflow-tooltip width="120">
+            <template slot-scope="scope">
+              <p>{{scope.row.checkCategory==1?'综合检查':(scope.row.checkCategory==2?'专项检查':'-')}}</p>
+            </template>
+          </el-table-column>
+          <el-table-column label="检查内容" align="center" prop="checkRange" show-overflow-tooltip width="120">
+            <template slot-scope="scope">
+              <p>{{scope.row.hazardName?scope.row.hazardName:'-'}}</p>
+            </template>
+          </el-table-column>
+          <el-table-column label="检查时间" sortable="custom" align="center" prop="checkTime" show-overflow-tooltip width="160"/>
+          <el-table-column label="整改人" align="center" prop="rectifyName" show-overflow-tooltip width="90"/>
+          <el-table-column label="整改期限" sortable="custom" align="center" prop="rectifyDeadline" show-overflow-tooltip width="180">
+            <template slot-scope="scope">
+              <p>{{scope.row.rectifyDeadline}}<span v-if="scope.row.overdueStatus==1" style="margin-left:10px;color:#EE0606;">已逾期</span></p>
+            </template>
+          </el-table-column>
+          <el-table-column label="整改状态" align="center" prop="rectifyStatus" show-overflow-tooltip width="110">
+            <template slot-scope="scope">
+              <p :class="scope.row.rectifyStatus==1?'rectifyStatusColorA':(scope.row.rectifyStatus==2||scope.row.rectifyStatus==3?'rectifyStatusColorB':'')">{{scope.row.rectifyStatus==1?'已完成':(scope.row.rectifyStatus==2?'待整改':(scope.row.rectifyStatus==3?'待复核':''))}}</p>
+            </template>
+          </el-table-column>
+          <el-table-column label="整改时间" sortable="custom" align="center" prop="rectifyTime" show-overflow-tooltip width="170"/>
+          <el-table-column label="审核状态" align="center" prop="examineResult" show-overflow-tooltip width="80">
+            <template slot-scope="scope">
+              {{scope.row.examineResult == 1?'已通过':(scope.row.examineResult == 0?'已驳回':(scope.row.examineResult == 2?'待审核':''))}}
+            </template>
+          </el-table-column>
+          <el-table-column label="操作" align="center" width="80">
+            <template slot-scope="scope">
+              <div class="table-button-box">
+                <p class="table-button-null"></p>
+                <p class="table-button-p" v-hasPermi="['safety:rectifyHazard:query']"
+                   @click="addDialogOpen(true,scope.row)">详情</p>
+                <p class="table-button-null"></p>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+        <pagination :page-sizes="[20, 30, 40, 50]"
+                    v-show="total>0"
+                    :total="total"
+                    :page.sync="queryParams.pageNum"
+                    :limit.sync="queryParams.pageSize"
+                    @pagination="getList"
+        />
+      </div>
+    </div>
+    <batchAudit v-if="minPageType == 2" :propsBatchAuditData="propsBatchAuditData"></batchAudit>
+    <infoDialog v-if="infoDialogType" :propsInfoDialogData="propsInfoDialogData"></infoDialog>
+  </div>
+</template>
+
+<script>
+  import { rectifyList, recheckList, overList } from '@/apiDemo/safetyCheck/index'
+  import batchAudit from './batchAudit.vue'
+  import infoDialog from '@/views/safetyCheck/components/infoDialog/infoDialog.vue'
+  export default {
+    name: 'schoolListPage',
+    components: {
+      batchAudit,
+      infoDialog
+    },
+    data(){
+      return{
+        //子组件参数
+        propsBatchAuditData:{},
+        propsInfoDialogData:{},
+        minPageType:1,
+        infoDialogType:false,
+        options:[
+          {value:"2",label:"待审核"},
+          {value:"1",label:"已通过"},
+          {value:"0",label:"已驳回"},
+        ],
+        queryParams:{
+          pageNum:1,
+          pageSize:20,
+          hazardType:1,
+          rectifyStatus:"2",
+          examineResult:"",
+          searchValue:"",
+          checkTimeOrder:"",
+          zgTimeOrder:"",
+          zgTermOrder:"",
+          myRelated:1,
+        },
+        dateRange:[],
+        tableList:[],
+        total:0,
+        correlationNum:'',
+      }
+    },
+    created(){},
+    mounted(){
+      this.getList();
+    },
+    methods:{
+      //获取相关数量
+      getCorrelationNum(){
+        rectifyList({
+          pageNum:1,
+          pageSize:20,
+          hazardType:1,
+          checkTimeOrder:"",
+          zgTimeOrder:"",
+          zgTermOrder:"",
+          myRelated:1,
+          rectifyStatus:this.queryParams.rectifyStatus,
+          examineResult:this.queryParams.examineResult,
+          searchValue:this.queryParams.searchValue,
+          beginTime:this.dateRange[0]?this.dateRange[0]:'',
+          endTime:this.dateRange[1]?this.dateRange[1]:'',
+        }).then(response => {
+          this.$set(this,'correlationNum',response.data.total>999?' 999+':(response.data.total<1?'':' '+response.data.total));
+        });
+      },
+      //与我相关按钮
+      topRightClickType(){
+        this.$set(this.queryParams,'myRelated',this.queryParams.myRelated==1?0:1);
+        this.handleQuery();
+      },
+      //开关详情页面
+      addDialogOpen(type,data){
+        if(this.infoDialogType != type){
+          if(type){
+            let obj = {
+              id:data.id
+            }
+            this.$set(this,'propsInfoDialogData',obj);
+            this.$set(this,'infoDialogType',type);
+          }else{
+            this.getList();
+            this.$set(this,'infoDialogType',type);
+          }
+        }
+      },
+      //页面切换
+      goPage(type){
+        if(this.minPageType != type){
+          if(type == 1){
+            //返回
+            this.$set(this,'minPageType',type);
+          }else if(type == 2){
+            //批量审核
+            this.$set(this,'propsBatchAuditData',{hazardType:1,});
+            this.$set(this,'minPageType',type);
+          }else if(type == 3){
+            //返回并刷新
+            this.getList();
+            this.$set(this,'minPageType',1);
+          }
+        }
+      },
+      //范围选择
+      topLeftClickType(type){
+        if(this.queryParams.rectifyStatus != type){
+          this.$set(this.queryParams,'rectifyStatus',type);
+          this.handleQuery();
+        }
+      },
+      //时间排序方法
+      sortChange(val){
+        if(val.prop == 'checkTime'){
+          this.$set(this.queryParams,'checkTimeOrder',val.order=='ascending'?'1':(val.order=='descending'?'2':''));
+          this.$set(this.queryParams,'zgTimeOrder','');
+          this.$set(this.queryParams,'zgTermOrder','');
+          this.handleQuery();
+        }else if(val.prop == 'rectifyTime'){
+          this.$set(this.queryParams,'zgTimeOrder',val.order=='ascending'?'1':(val.order=='descending'?'2':''));
+          this.$set(this.queryParams,'checkTimeOrder','');
+          this.$set(this.queryParams,'zgTermOrder','');
+          this.handleQuery();
+        }else if(val.prop == 'rectifyDeadline'){
+          this.$set(this.queryParams,'zgTermOrder',val.order=='ascending'?'1':(val.order=='descending'?'2':''));
+          this.$set(this.queryParams,'checkTimeOrder','');
+          this.$set(this.queryParams,'zgTimeOrder','');
+          this.handleQuery();
+        }
+      },
+      //获取数据列表
+      getList(){
+        let obj = JSON.parse(JSON.stringify(this.queryParams))
+        if(this.dateRange[0]){
+          obj.beginTime = this.dateRange[0];
+        }else{
+          obj.beginTime = "";
+        }
+        if(this.dateRange[1]){
+          obj.endTime = this.dateRange[1];
+        }else{
+          obj.endTime = "";
+        }
+        let self = this;
+        setTimeout(function(){
+          self.getCorrelationNum();
+        },500);
+        if(this.queryParams.rectifyStatus == 2){
+          rectifyList(obj).then(response => {
+            this.total = response.data.total;
+            this.tableList = response.data.records;
+          });
+        } else if (this.queryParams.rectifyStatus == 3){
+          recheckList(obj).then(response => {
+            this.total = response.data.total;
+            this.tableList = response.data.records;
+          });
+        }  else if (this.queryParams.rectifyStatus == 1){
+          overList(obj).then(response => {
+            this.total = response.data.total;
+            this.tableList = response.data.records;
+          });
+        }
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.$set(this.queryParams,'pageNum',1);
+        this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.$set(this,'dateRange',[]);
+        this.$set(this,'queryParams',{
+          pageNum:1,
+          pageSize:20,
+          hazardType:1,
+          rectifyStatus:"2",
+          examineResult:"",
+          searchValue:"",
+          checkTimeOrder:"",
+          zgTimeOrder:"",
+          zgTermOrder:"",
+          myRelated:1,
+        });
+        this.handleQuery();
+      },
+    },
+  }
+</script>
+
+<style scoped lang="scss">
+  .schoolListPage{
+    flex: 1;
+    display: flex !important;
+    flex-direction: column;
+    overflow: hidden;
+    .schoolListPage-page{
+      flex: 1;
+      display: flex !important;
+      flex-direction: column;
+      overflow: hidden;
+      .title-box{
+        padding-top:20px;
+        .form-button-max-big-box{
+          display: inline-block;
+          margin-left:10px;
+          .form-button-big-box{
+            display: flex;
+            p:nth-child(1){
+              border-top-left-radius: 4px;
+              border-bottom-left-radius: 4px;
+              border-top:1px solid #E0E0E0;
+              border-bottom:1px solid #E0E0E0;
+            }
+            p:nth-child(2){
+              border-top:1px solid #E0E0E0;
+              border-bottom:1px solid #E0E0E0;
+            }
+            p:nth-child(3){
+              border-top-right-radius: 4px;
+              border-bottom-right-radius: 4px;
+              border-top:1px solid #E0E0E0;
+              border-bottom:1px solid #E0E0E0;
+              border-right:1px solid #E0E0E0;
+            }
+            p{
+              height:40px;
+              width:80px;
+              line-height: 40px;
+              text-align: center;
+              color:#666666;
+              font-size:14px;
+              font-weight:500;
+              cursor: pointer;
+              border-left:1px solid #E0E0E0;
+            }
+            .checkDiv{
+              color:#fff!important;
+              border:1px solid #0183FA!important;
+              background-color: #0183FA;
+            }
+          }
+        }
+        .form-button-max-big-box-me{
+          display: inline-block;
+          .form-button-big-box-me{
+            display: flex;
+            div{
+              position: relative;
+              height:40px;
+              width:130px;
+              line-height: 40px;
+              text-align: center;
+              color:#999;
+              font-size:14px;
+              border:1px solid #999;
+              border-radius:4px;
+              margin-left:10px;
+              font-weight:500;
+              cursor: pointer;
+              .icon-p-me{
+                width:15px;
+                height:15px;
+                line-height:15px;
+                text-align: center;
+                position: absolute;
+                right:0;
+                bottom:0;
+                color:#fff;
+                background: #0183fa;
+                border-top-left-radius:4px;
+              }
+            }
+            .checkDiv-me{
+              color:#0183FA!important;
+              border:1px solid #0183FA!important;
+            }
+          }
+        }
+      }
+      .content-box{
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+        padding:0 20px 20px;
+        overflow: hidden;
+        .rectifyStatusColorA{
+          color:#23B303;
+        }
+        .rectifyStatusColorB{
+          color:#0183FA;
+        }
+        .rectifyStatusColorC{
+          color:#EE0606;
+        }
+      }
+    }
+  }
+</style>

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

@@ -0,0 +1,742 @@
+<template>
+  <el-dialog class="inspectionGroup-dialog-box"
+             :close-on-click-modal="false"
+             :title="addDialogTitle" :visible.sync="addDialogType" v-if="addDialogType"
+             @close="addDialogAllOff" width="1303px" append-to-body>
+    <div class="add-max-box" v-if="addDialogBoxType == 1">
+      <el-form ref="addDialogForm" :model="dialogForm" :rules="rules" label-width="100px" class="add-form-box">
+        <el-form-item label="是否启用:" prop="enable">
+          <el-switch
+            v-if="!lookInfoType"
+            @click.native="changeIsNeedCaptcha(dialogForm.enable)"
+            class="switch captcha-img"
+            :active-value="1"
+            :inactive-value="0"
+            active-color="#0183FA"
+            inactive-color="#999"
+            v-model="dialogForm.enable"
+            active-text="启用"
+            inactive-text="停用"
+          ></el-switch>
+          <p v-if="lookInfoType" :class="dialogForm.enable==1?'switchFontColor':''" style="line-height:40px;">{{dialogForm.enable==1?'启用':'停用'}}</p>
+        </el-form-item>
+        <el-form-item label="巡查组名称:" prop="groupName">
+          <el-input :disabled="lookInfoType" v-model="dialogForm.groupName" placeholder="请输入巡查组名称" maxLength="20" style="width:450px;"/>
+        </el-form-item>
+      </el-form>
+      <div class="dialog-table-box">
+        <div class="dialog-table-title-box">
+          <img src="@/assets/ZDimages/safetyCheck/icon_xyxc_cy.png">
+          <p class="dialog-table-title-p">巡查成员</p>
+          <p v-if="!lookInfoType" class="inquire-button-one dialog-table-title-button" @click="dialogClickType(2)">+ 添加</p>
+          <p v-if="lookInfoType" class="dialog-table-title-text">{{dialogTableList[0]?dialogTableList.length+'人':'0人'}}</p>
+        </div>
+        <el-table border :data="dialogTableList">
+          <el-table-column label="序号" align="center"  type="index" width="140"/>
+          <el-table-column label="姓名" align="center" prop="name" show-overflow-tooltip/>
+          <el-table-column label="工号" align="center" prop="jobNum" show-overflow-tooltip/>
+          <el-table-column label="所在部门" align="center" prop="deptName" show-overflow-tooltip/>
+          <el-table-column label="是否启用" align="center" prop="enable" width="150">
+            <template slot-scope="scope">
+              <el-switch
+                v-if="!lookInfoType"
+                @click.native="changeIsNeedCaptcha(scope.row.deptName)"
+                class="switch captcha-img"
+                :active-value="1"
+                :inactive-value="0"
+                active-color="#0183FA"
+                inactive-color="#999"
+                v-model="scope.row.enable"
+                active-text="启用"
+                inactive-text="停用"
+              ></el-switch>
+              <p v-if="lookInfoType" :class="scope.row.enable==1?'switchFontColor':''">{{scope.row.enable==1?'启用':'停用'}}</p>
+            </template>
+          </el-table-column>
+          <el-table-column label="操作" align="center" prop="deptName" width="150" v-if="!lookInfoType">
+            <template slot-scope="scope">
+              <div class="table-button-box">
+                <p class="table-button-null"></p>
+                <p class="table-button-p" @click="delTable(scope.row)">删除</p>
+                <p class="table-button-null"></p>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+    </div>
+    <div class="inspectionPlan-dialog-user-box" v-show="addDialogBoxType == 2">
+      <div class="left-max-box">
+      <div class="dept-table-title-box">
+        <p>待选人员</p>
+        <p>{{userNumLeft}}/{{userTotalLeft}}</p>
+      </div>
+      <div class="dept-table-max-box">
+        <el-form :model="userQueryParamsLeft" class="form-box" ref="queryForm" :inline="true" label-width="50px">
+          <el-form-item label="" prop="deptId">
+            <el-select v-model="userQueryParamsLeft.deptId" @change="userHandleQueryLeft" clearable placeholder="选择部门" style="width: 110px">
+              <el-option
+                v-for="item in deptSelectList"
+                :key="item.deptId"
+                :label="item.deptName"
+                :value="item.deptId">
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="" prop="searchValue" class="form-index">
+            <el-input
+              maxLength="20"
+              v-model="userQueryParamsLeft.searchValue"
+              placeholder="搜索姓名/工号"
+              clearable
+              style="width: 240px">
+              <p class="el-icon-search" slot="append" @click="userHandleQueryLeft"></p>
+            </el-input>
+          </el-form-item>
+          <el-form-item style="margin-right:0;">
+            <p class="reset-button-one" @click="userResetQueryLeft" style="width:60px;">重置</p>
+          </el-form-item>
+        </el-form>
+        <el-table ref="leftUserTable" border :data="userTableListLeft" @selection-change="userChangeLeft" :row-key="getRowKeys">
+          <el-table-column type="selection" width="50" :reserve-selection="true" align="center"/>
+          <el-table-column label="姓名" align="center" prop="nickName" show-overflow-tooltip/>
+          <el-table-column label="工号" align="center" prop="userName" show-overflow-tooltip width="150"/>
+          <el-table-column label="所在部门" align="center" prop="deptName" show-overflow-tooltip width="168"/>
+        </el-table>
+        <pagination layout="total, prev, pager, next, jumper"
+                    v-show="userTotalLeft>0"
+                    :total="userTotalLeft"
+                    :pager-count="5"
+                    :page.sync="userQueryParamsLeft.pageNum"
+                    :limit.sync="userQueryParamsLeft.pageSize"
+                    @pagination="userGetListLeft"/>
+      </div>
+    </div>
+      <div class="center-box">
+        <p class="el-icon-arrow-left" @click="userArrowButton(1)"></p>
+        <p class="el-icon-arrow-right" @click="userArrowButton(2)"></p>
+      </div>
+      <div class="right-max-box">
+        <div class="dept-table-title-box">
+          <p>已选成员</p>
+          <p>{{userNumRight}}/{{userTotalRight}}</p>
+        </div>
+        <div class="dept-table-max-box">
+          <el-form :model="userQueryParamsRight" class="form-box" ref="queryForm" :inline="true" label-width="50px">
+            <el-form-item label="" prop="deptId">
+              <el-select v-model="userQueryParamsRight.deptId" clearable @change="userHandleQueryRight" placeholder="选择部门" style="width: 110px">
+                <el-option
+                  v-for="item in deptSelectList"
+                  :key="item.deptId"
+                  :label="item.deptName"
+                  :value="item.deptId">
+                </el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item label="" prop="searchValue" class="form-index">
+              <el-input
+                maxLength="20"
+                v-model="userQueryParamsRight.searchValue"
+                placeholder="搜索姓名/工号"
+                clearable
+                style="width: 240px">
+                <p class="el-icon-search" slot="append" @click="userHandleQueryRight"></p>
+              </el-input>
+            </el-form-item>
+            <el-form-item style="margin-right:0;">
+              <p class="reset-button-one" @click="userResetQueryRight" style="width:60px;">重置</p>
+            </el-form-item>
+          </el-form>
+          <el-table ref="rightUserTable" border :data="userTableListRight" @selection-change="userChangeRight" :row-key="getRowKeys">
+            <el-table-column type="selection" width="50" :reserve-selection="true" align="center"/>
+            <el-table-column label="姓名" align="center" prop="nickName" show-overflow-tooltip/>
+            <el-table-column label="工号" align="center" prop="userName" show-overflow-tooltip width="150"/>
+            <el-table-column label="所在部门" align="center" prop="deptName" show-overflow-tooltip width="168"/>
+          </el-table>
+          <pagination layout="total, prev, pager, next, jumper"
+                      v-show="userTotalRight>0"
+                      :total="userTotalRight"
+                      :pager-count="5"
+                      :page.sync="userQueryParamsRight.pageNum"
+                      :limit.sync="userQueryParamsRight.pageSize"
+                      @pagination="userGetListRight"/>
+        </div>
+      </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="addDialogOff">{{addDialogBoxType==1?'取消':'返回'}}</p>
+      <p class="dialog-footer-button-primary" v-if="!lookInfoType" @click="addUserButton">确定</p>
+      <p class="dialog-footer-button-null"></p>
+    </div>
+
+  </el-dialog>
+</template>
+
+<script>
+  import { listDepartments } from "@/apiDemo/system/dept";
+  import { checkGroupFind,findUserList,checkGroupAdd,checkGroupUpdate } from '@/apiDemo/safetyCheck/index'
+  export default {
+    name: 'addDialog',
+    props:{
+      addDialogData:{},
+    },
+    data(){
+      return{
+        addDialogTitle:"",
+        addDialogType:true,
+        addDialogBoxType:1,
+        lookInfoType:false,
+        dialogForm:{
+          enable:1,
+          groupName:"",
+        },
+        //层级
+        dialogRangeOptions:[{key:1,label:"校级"},{key:2,label:"院级"}],
+        //院系
+        deptSelectList:[],
+        //选中巡查人员列表
+        dialogTableList:[],
+        //选中页面人员列表数据
+        dialogTableDataList:[],
+        //弹窗内容状态
+        userQueryParamsLeft:{
+          pageNum: 1,
+          pageSize: 20,
+          deptId:"",
+          searchValue:"",
+          filtType:1
+        },
+        userTableListLeft:[],
+        userTotalLeft:0,
+        userNumLeft:0,
+        userIdsLeft:[],
+        userQueryParamsRight:{
+          pageNum: 1,
+          pageSize: 20,
+          deptId:"",
+          searchValue:"",
+          filtType:2
+        },
+        userTableListRight:[],
+        userTotalRight:0,
+        userNumRight:0,
+        userIdsRight:[],
+        // 表单校验
+        rules: {
+          enable: [
+            { required: true, message: "请选择是否启用", trigger: "change" },
+          ],
+          groupName: [
+            { required: true, message: "请输入巡查组名称", trigger: "change" },
+            { required: true, message: "请输入巡查组名称", validator: this.spaceJudgment, trigger: "change" },
+          ],
+        },
+      }
+    },
+    created(){
+      this.$set(this,'addDialogTitle',this.addDialogData.title);
+      this.$set(this,'lookInfoType',this.addDialogData.lookInfoType);
+      if(this.addDialogData.addType){
+        //新增
+      }else{
+        //详情-编辑
+        this.checkGroupFind();
+      }
+    },
+    mounted(){
+      this.listDepartments();
+    },
+    methods:{
+      //获取详情
+      checkGroupFind(){
+        checkGroupFind({id:this.addDialogData.id,selectEnable:0}).then(response => {
+          this.$set(this.dialogForm,'id',response.data.id?response.data.id:'');
+          this.$set(this.dialogForm,'enable',response.data.enable);
+          this.$set(this.dialogForm,'groupName',response.data.groupName);
+          this.$set(this,'dialogTableList',response.data.checkGroupMemberList);
+        });
+      },
+      //弹窗关闭
+      addDialogAllOff(){
+        this.$parent.addDialogOpen(4)
+      },
+      addDialogOff(){
+        if(this.addDialogBoxType == 1){
+          this.$parent.addDialogOpen(4)
+        }else{
+          this.dialogClickType(1);
+        }
+      },
+      //添加人员
+      addUserButton(){
+        let self = this;
+        if(this.addDialogBoxType == 1){
+          this.$refs["addDialogForm"].validate(valid => {
+            if (valid) {
+              if(!this.dialogTableList[0]){
+                this.msgError('请添加至少一名巡查成员')
+                return
+              }
+              if(this.dialogForm.id){
+                //编辑
+                let obj = this.dialogForm;
+                obj.checkGroupMemberList = this.dialogTableList
+                checkGroupUpdate(obj).then(response => {
+                  this.msgSuccess(response.msg);
+                  this.$parent.addDialogOpen(5)
+                })
+              }else{
+                //新增
+                let obj = this.dialogForm;
+                obj.checkGroupMemberList = this.dialogTableList
+                checkGroupAdd(obj).then(response => {
+                  this.msgSuccess(response.msg);
+                  this.$parent.addDialogOpen(5)
+                })
+              }
+            }
+          })
+        }else{
+          let list = [];
+          let newObj = {};
+          for(let o=0;o<self.dialogTableDataList.length;o++){
+            let num = 0;
+            for(let i=0;i<self.dialogTableList.length;i++){
+              if(self.dialogTableList[i].userId == self.dialogTableDataList[o].userId){
+                num++
+                newObj = JSON.parse(JSON.stringify(self.dialogTableList[i]))
+              }
+            }
+            if(num == 0){
+              let obj = {
+                userId:self.dialogTableDataList[o].userId,
+                name:self.dialogTableDataList[o].name,
+                jobNum:self.dialogTableDataList[o].jobNum,
+                deptName:self.dialogTableDataList[o].deptName,
+                deptId:self.dialogTableDataList[o].deptId,
+                userType:self.dialogTableDataList[o].userType,
+                enable:1,
+              };
+              list.push(obj)
+            }else{
+              let obj = {
+                userId:self.dialogTableDataList[o].userId,
+                name:self.dialogTableDataList[o].name,
+                jobNum:self.dialogTableDataList[o].jobNum,
+                deptName:self.dialogTableDataList[o].deptName,
+                deptId:self.dialogTableDataList[o].deptId,
+                userType:self.dialogTableDataList[o].userType,
+                enable:newObj.enable,
+              };
+              list.push(obj)
+            }
+          }
+          this.$set(this,'dialogTableList',list);
+          this.dialogClickType(1);
+        }
+      },
+      //弹窗状态切换
+      dialogClickType(type){
+        let self = this;
+        if(type == 2){
+          this.$set(self,'dialogTableDataList',JSON.parse(JSON.stringify(this.dialogTableList)));
+          this.userResetQueryLeft();
+          this.userResetQueryRight();
+          this.$set(this,'addDialogBoxType',type);
+        }else{
+          this.$set(this,'addDialogBoxType',type);
+        }
+      },
+      //删除弹窗列表
+      delTable(row){
+        let self = this;
+        for(let i=0;i<self.dialogTableList.length;i++){
+          if(row.userId == self.dialogTableList[i].userId){
+            this.dialogTableList.splice(i,1)
+          }
+        }
+      },
+      /*===================================人员选择相关===================================*/
+      //查询
+      userHandleQueryLeft(){
+        this.$set(this.userQueryParamsLeft,'pageNum',1);
+        this.$set(this,'userNumLeft',0);
+        this.$set(this,'userIdsLeft',[]);
+        this.$refs.leftUserTable.clearSelection();
+        this.userGetListLeft();
+      },
+      //重置
+      userResetQueryLeft(){
+        this.$set(this,'userQueryParamsLeft',{
+          pageNum: 1,
+          pageSize: 20,
+          deptId:"",
+          searchValue:"",
+          filtType:1
+        });
+        this.userHandleQueryLeft();
+      },
+      //查询接口
+      userGetListLeft(){
+        let self = this;
+        let leftObj = JSON.parse(JSON.stringify(this.userQueryParamsLeft));
+        leftObj.selectedUserIds = [];
+        for(let i=0;i<self.dialogTableDataList.length;i++){
+          leftObj.selectedUserIds.push(self.dialogTableDataList[i].userId);
+        }
+        findUserList(leftObj).then(response => {
+          this.userTotalLeft = response.total;
+          this.userTableListLeft = response.rows;
+        });
+      },
+      //查询
+      userHandleQueryRight(){
+        this.$set(this.userQueryParamsRight,'pageNum',1);
+        this.$set(this,'userNumRight',0);
+        this.$set(this,'userIdsRight',[]);
+        this.$refs.rightUserTable.clearSelection();
+        this.userGetListRight();
+      },
+      //重置
+      userResetQueryRight(){
+        this.$set(this,'userQueryParamsRight',{
+          pageNum: 1,
+          pageSize: 20,
+          deptId:"",
+          searchValue:"",
+          filtType:2
+        });
+        this.userHandleQueryRight();
+      },
+      //查询接口
+      userGetListRight(){
+        let self = this;
+        let rightObj = JSON.parse(JSON.stringify(this.userQueryParamsRight));
+        rightObj.userIds = [];
+        for(let i=0;i<self.dialogTableDataList.length;i++){
+          rightObj.userIds.push(self.dialogTableDataList[i].userId);
+        }
+        findUserList(rightObj).then(response => {
+          this.userTotalRight = response.total;
+          this.userTableListRight = response.rows;
+        });
+      },
+      //穿梭按钮
+      userArrowButton(type){
+        let self = this;
+        if(type == 1){
+          //右至左
+          if(this.$refs.rightUserTable.selection[0]){
+            let list = JSON.parse(JSON.stringify(this.dialogTableDataList));
+            let userIdsRight = JSON.parse(JSON.stringify(this.$refs.rightUserTable.selection))
+            for(let i=0;i<userIdsRight.length;i++){
+              for(let s=0;s<list.length;s++){
+                if(userIdsRight[i].userId == list[s].userId){
+                  list.splice(s,1);
+                  s--
+                }
+              }
+            }
+            this.$set(this,'dialogTableDataList',list);
+            this.$refs.rightUserTable.clearSelection();
+            this.userHandleQueryLeft();
+            this.userHandleQueryRight();
+          }else{
+            this.msgError('请先勾选右侧列表')
+          }
+        }else if(type == 2){
+          //左至右
+          if(this.$refs.leftUserTable.selection[0]){
+            let list = JSON.parse(JSON.stringify(this.dialogTableDataList));
+            let userIdsLeft = JSON.parse(JSON.stringify(this.$refs.leftUserTable.selection))
+            for(let i=0;i<userIdsLeft.length;i++){
+              let obj = {
+                userId:userIdsLeft[i].userId,
+                name:userIdsLeft[i].nickName,
+                jobNum:userIdsLeft[i].userName,
+                deptName:userIdsLeft[i].deptName,
+                deptId:userIdsLeft[i].deptId,
+                userType:userIdsLeft[i].userType,
+              }
+              list.push(obj);
+            }
+            if(list.length>50){
+              this.msgError('巡查成员最多50人')
+              return
+            }
+            this.$set(this,'dialogTableDataList',list);
+            this.$refs.leftUserTable.clearSelection();
+            this.userHandleQueryLeft();
+            this.userHandleQueryRight();
+          }else{
+            this.msgError('请先勾选左侧列表')
+          }
+        }
+      },
+      /*===记录勾选数据===
+        需要再el-table 添加  :row-key="getRowKeys"
+        需要在selection 添加 :reserve-selection="true"
+      */
+      getRowKeys(row) {
+        return row.userId
+      },
+      userChangeLeft(selection){
+        this.userNumLeft = selection.length;
+        this.userIdsLeft = selection.map(item => item.userId);
+      },
+      userChangeRight(selection){
+        this.userNumRight = selection.length;
+        this.userIdsRight = selection.map(item => item.userId);
+      },
+      changeIsNeedCaptcha(data){
+        if(this.lookInfoType){
+          return
+        }
+        data = data == 1?0:1;
+        this.$forceUpdate()
+      },
+      //获取学院列表
+      listDepartments(){
+        listDepartments().then(response => {
+          this.deptSelectList = response.data;
+        });
+      },
+    }
+  }
+</script>
+
+<style lang="scss">
+  .inspectionGroup-dialog-box{
+    .el-dialog__body{
+      padding:20px 30px 20px 30px;
+    }
+    .is-disabled{
+      background-color: #f5f5f5;
+      color: #333;
+      border-color: #f5f5f5;
+      cursor:auto;
+      border-radius: 4px;
+      .el-input__icon{
+        display: none;
+      }
+      .el-input__inner{
+        background-color: #f5f5f5;
+        color: #333;
+        border-color: #f5f5f5;
+        cursor:auto!important;
+        border-radius: 4px;
+      }
+      .el-range-input{
+        background-color: #f5f5f5;
+        color: #333;
+        border-color: #f5f5f5;
+        cursor:auto;
+        border-radius: 4px;
+      }
+      .el-textarea__inner{
+        background-color: #f5f5f5;
+        color: #333;
+        border-color: #f5f5f5;
+        cursor:auto;
+        border-radius: 4px;
+      }
+    }
+    .switchFontColor{
+      color:#0183FA;
+    }
+    .add-max-box{
+      display: flex;
+      flex-direction: column;
+      overflow: hidden;
+      height:610px;
+      .add-form-box{
+        .switch .el-switch__label {
+          position: absolute;
+          display: none;
+          color: #fff !important;
+        }
+        .switch .el-switch__label--right {
+          z-index: 1;
+        }
+        .switch .el-switch__label--right span{
+          margin-left: 10px;
+          margin-top: 8px;
+        }
+        .switch .el-switch__label--left {
+          z-index: 1;
+        }
+        .switch .el-switch__label--left span{
+          margin-top: 8px;
+          margin-left: 30px;
+        }
+        .switch .el-switch__label.is-active {
+          display: block;
+        }
+        .el-switch__core:after{
+          width:20px;
+          height:20px;
+          top:4px;
+          margin-left: 4px;
+        }
+        .el-switch.is-checked .el-switch__core::after{
+          width:20px;
+          height:20px;
+          top:4px;
+          margin-left: -24px;
+
+        }
+        .switch.el-switch .el-switch__core,
+        .el-switch .el-switch__label {
+          width: 70px !important;
+          height:30px !important;
+          border-radius: 50px 50px 50px 50px;
+          margin: 0;
+        }
+      }
+      .dialog-table-box{
+        margin-top:20px;
+        display: flex;
+        flex-direction: column;
+        flex:1;
+        overflow: hidden;
+        .dialog-table-title-box{
+          display: flex;
+          border:1px solid #e0e0e0;
+          border-bottom:none;
+          img{
+            width:14px;
+            height:14px;
+            margin:18px 12px 18px 12px;
+          }
+          .dialog-table-title-p{
+            line-height:50px;
+            flex:1;
+            font-size:16px;
+          }
+          .dialog-table-title-button{
+            width:70px;
+            height:30px;
+            line-height:28px;
+            margin:10px 26px;
+          }
+          .dialog-table-title-text{
+            height:30px;
+            line-height:28px;
+            margin:10px 26px;
+          }
+        }
+        .switch .el-switch__label {
+          position: absolute;
+          display: none;
+        }
+        .switch .el-switch__label--right {
+          z-index: 1;
+          color: #fff !important;
+        }
+        .switch .el-switch__label--right span{
+          margin-left: 10px;
+        }
+        .switch .el-switch__label--left {
+          z-index: 1;
+          color: #fff !important;
+        }
+        .switch .el-switch__label--left span{
+          margin-left: 24px;
+        }
+        .switch .el-switch__label.is-active {
+          display: block;
+        }
+        .switch.el-switch .el-switch__core,
+        .el-switch .el-switch__label {
+          width: 60px !important;
+          margin: 0;
+        }
+      }
+    }
+    .inspectionPlan-dialog-user-box{
+      display: flex;
+      overflow: hidden;
+      height:610px;
+      .dept-table-title-box{
+        display: flex;
+        padding:0 20px;
+        background: rgba(1,131,250,0.1);
+        p{
+          flex:1;
+          color:#0183FA;
+          font-size:16px;
+          line-height:40px;
+        }
+        p:nth-child(1){
+          text-align: left;
+        }
+        p:nth-child(2){
+          text-align: right;
+        }
+      }
+      .dept-table-max-box{
+        border: 1px solid #e0e0e0;
+        flex:1;
+        display: flex;
+        flex-direction: column;
+        overflow: hidden;
+        padding:20px;
+        .form-index{
+          .el-input__inner{
+            border-right:none;
+            padding-right:0;
+          }
+          .el-input-group__append{
+            background: #fff;
+            cursor: pointer;
+            padding:0 10px;
+          }
+        }
+        input{
+          border: 1px solid #DCDFE6;
+        }
+      }
+      .left-max-box{
+        height:610px;
+        display: flex;
+        flex-direction: column;
+        overflow: hidden;
+        width:588px;
+      }
+      .right-max-box{
+        height:610px;
+        display: flex;
+        flex-direction: column;
+        overflow: hidden;
+        width:588px;
+        flex:1;
+      }
+      .center-box{
+        width:68px;
+        p{
+          display: block;
+          border-radius:50%;
+          width:30px;
+          height:30px;
+          line-height:30px;
+          text-align: center;
+          background: rgba(245,245,245,1);
+          color:rgba(62,62,62,1);
+          cursor: pointer;
+          font-size:16px;
+        }
+        p:nth-child(1){
+          margin:270px 19px 0;
+        }
+        p:nth-child(2){
+          margin:14px 19px 0;
+        }
+        p:hover{
+          color:#fff;
+          background: #0183fa;
+        }
+      }
+    }
+  }
+</style>

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

@@ -0,0 +1,236 @@
+<!--校院巡查组-->
+<template>
+  <div class="app-container inspectionGroup">
+    <div class="title-box">
+      <el-form :model="queryParams" class="form-box" ref="queryForm" :inline="true" label-width="80px">
+        <el-form-item label="关键字" prop="searchValue">
+          <el-input
+            maxLength="30"
+            v-model="queryParams.searchValue"
+            placeholder="巡查组名称"
+            clearable
+            style="width: 200px"
+          />
+        </el-form-item>
+        <el-form-item label="状态" prop="enable" label-width="60px">
+          <el-select v-model="queryParams.enable" clearable placeholder="请选择状态" style="width: 150px">
+            <el-option
+              v-for="item in optionsTwo"
+              :key="item.key"
+              :label="item.label"
+              :value="item.key">
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <p class="inquire-button-one" @click="handleQuery" style="margin-right:10px;">查询</p>
+          <p class="reset-button-one" @click="resetQuery">重置</p>
+        </el-form-item>
+        <el-form-item style="float: right;" v-hasPermi="['security:checkGroup:add']">
+          <el-col :span="1.5">
+            <p class="inquire-button-one"
+               style="width:130px;"
+               @click="addDialogOpen(1)"
+            ><i class="el-icon-plus"></i>添加巡查组</p>
+          </el-col>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div class="content-box">
+      <el-table  border :data="tableList" ref="multipleTable">
+        <el-table-column label="序号"  width="60" align="center"  type="index"/>
+        <el-table-column label="巡查组名称" align="center" prop="groupName" show-overflow-tooltip/>
+        <el-table-column label="成员人数" align="center" prop="peopleNum" show-overflow-tooltip width="150"/>
+        <el-table-column label="是否启用" align="center" prop="enable" show-overflow-tooltip width="185">
+          <template slot-scope="scope">
+            <div style="width:70px;margin-left:50px;">
+              <el-switch
+                @click.native="switchClick(scope.row)"
+                class="switch"
+                v-model="scope.row.enable"
+                :active-value="1"
+                :inactive-value="0"
+                active-color="#0183FA"
+                inactive-color="#E0E0E0"
+                active-text="启用"
+                inactive-text="停用"
+                disabled
+              ></el-switch>
+            </div>
+          </template>
+        </el-table-column>
+        <el-table-column label="操作人" align="center" prop="deptName" show-overflow-tooltip width="150">
+          <template slot-scope="scope">{{scope.row.updateName?scope.row.updateName:scope.row.createName}}</template>
+        </el-table-column>
+        <el-table-column label="操作时间" align="center" prop="updateTime" show-overflow-tooltip width="250">
+          <template slot-scope="scope">{{scope.row.updateTime?scope.row.updateTime:scope.row.createTime}}</template>
+        </el-table-column>
+        <el-table-column label="操作" align="center" prop="deptName" width="200" v-if="tableButtonType">
+          <template slot-scope="scope">
+            <div class="table-button-box">
+              <p class="table-button-null"></p>
+              <p class="table-button-p" @click="addDialogOpen(3,scope.row)" v-hasPermi="['security:checkGroup:query']">详情</p>
+              <p class="table-button-p" @click="addDialogOpen(2,scope.row)" v-hasPermiAnd="['security:checkGroup:query','security:checkGroup:edit']">编辑</p>
+              <p class="table-button-p" @click="deleteObj(scope.row)" v-hasPermi="['security:checkGroup:remove']">删除</p>
+              <p class="table-button-null"></p>
+            </div>
+          </template>
+        </el-table-column>
+      </el-table>
+      <pagination :page-sizes="[20, 30, 40, 50]"
+                  v-show="total>0"
+                  :total="total"
+                  :page.sync="queryParams.pageNum"
+                  :limit.sync="queryParams.pageSize"
+                  @pagination="getList"
+      />
+    </div>
+    <addDialog v-if="addDialogType" :addDialogData="addDialogData"></addDialog>
+  </div>
+</template>
+
+<script>
+  import addDialog from './addDialog.vue'
+  import { checkGroupList,checkGroupDelete,checkGroupEnable } from '@/apiDemo/safetyCheck/index'
+  export default {
+    name: 'index',
+    components: {
+      addDialog,
+    },
+    data(){
+      return{
+        tableButtonType:this.hasPermiDom(['security:checkGroup:query','security:checkGroup:edit','security:checkGroup:remove']),
+        addDialogType:false,
+        addDialogData:{},
+        queryParams:{
+          pageNum:1,
+          pageSize:20,
+          searchValue:"",
+          enable:"",
+        },
+        tableList:[],
+        total:0,
+        optionsOne:[{key:1,label:"校级"},{key:2,label:"院级"}],
+        optionsTwo:[{key:1,label:"启用"},{key:0,label:"停用"}],
+      }
+    },
+    created(){
+
+    },
+    mounted(){
+      this.getList();
+    },
+    methods:{
+      //弹窗开启
+      addDialogOpen(type,data){
+        if(type==1){
+          this.$set(this,'addDialogData',{
+            title:"新增巡查组",
+            addType:true,
+            lookInfoType:false,
+          })
+          this.$set(this,'addDialogType',true)
+        }else if(type == 2){
+          this.$set(this,'addDialogData',{
+            title:"编辑巡查组",
+            addType:false,
+            lookInfoType:false,
+            id:data.id
+          })
+          this.$set(this,'addDialogType',true)
+        }else if(type == 3){
+          this.$set(this,'addDialogData',{
+            title:"巡查组详情",
+            addType:false,
+            lookInfoType:true,
+            id:data.id
+          })
+          this.$set(this,'addDialogType',true)
+        }else if(type == 5){
+          this.getList();
+          this.$set(this,'addDialogType',false)
+        }else{
+          this.$set(this,'addDialogType',false)
+        }
+      },
+      // 开关
+      switchClick(data){
+        console.log('data',data);
+        let self = this;
+        this.$confirm('是否确认'+(data.enable==1?'停用':'启用')+'?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(function() {
+          let obj = {
+            checkGroupId:data.id,
+            enable:data.enable==1?0:1
+          };
+          checkGroupEnable(obj).then(response => {
+            self.msgSuccess(response.msg)
+            self.getList();
+          });
+        }).then(() => {
+        }).catch(() => {});
+      },
+      //获取数据列表
+      getList(){
+        checkGroupList(this.queryParams).then(response => {
+          this.total = response.data.total;
+          this.tableList = response.data.records;
+        });
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.$set(this.queryParams,'pageNum',1);
+        this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.$set(this,'queryParams',{
+          pageNum:1,
+          pageSize:20,
+          searchValue:"",
+          enable:"",
+        });
+        this.handleQuery();
+      },
+      //删除
+      deleteObj(data){
+        let self = this;
+        this.$confirm('是否确认删除?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(function() {
+          checkGroupDelete({id:data.id}).then(response => {
+            self.msgSuccess(response.msg)
+            self.getList();
+          });
+        }).then(() => {
+        }).catch(() => {});
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .inspectionGroup {
+    flex: 1;
+    display: flex !important;
+    flex-direction: column;
+    overflow: hidden;
+    .title-box{
+      padding-top:20px;
+      border-bottom:1px solid #dedede;
+    }
+    .content-box{
+      flex: 1;
+      display: flex;
+      flex-direction: column;
+      padding:20px;
+      overflow: hidden;
+    }
+  }
+</style>
+

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

@@ -0,0 +1,446 @@
+<!--巡查管理-->-
+<template>
+  <div class="app-container inspectionManagement">
+    <div class="inspectionManagement-page" v-if="pageType == 1">
+      <div class="title-box">
+        <el-form :model="queryParams" class="form-box" ref="queryForm" :inline="true" label-width="80px">
+          <div class="form-button-max-big-box">
+            <div class="form-button-big-box" style="margin-left:10px;">
+              <p class="text-p" :class="queryParams.manageStatus=='-1'?'checkDiv':''" @click="topLeftClickType('-1')">全部</p>
+              <p class="text-p" :class="queryParams.manageStatus=='0'?'checkDiv':''" @click="topLeftClickType('0')">待检查</p>
+              <p class="text-p" :class="queryParams.manageStatus=='1'?'checkDiv':''" @click="topLeftClickType('1')">检查中</p>
+              <p class="text-p" :class="queryParams.manageStatus=='2'?'checkDiv':''" @click="topLeftClickType('2')">已检查</p>
+            </div>
+          </div>
+          <!--与我相关-->
+          <div class="form-button-max-big-box-me">
+            <div class="form-button-big-box-me">
+              <div :class="queryParams.myRelated==1?'checkDiv-me':''" @click="topRightClickType">
+                <p class="text-p-me">与我相关{{correlationNum}}</p>
+                <p class="el-icon-check icon-p-me" v-if="queryParams.myRelated==1"></p>
+              </div>
+            </div>
+          </div>
+          <el-form-item label="关键字" prop="searchValue">
+            <el-input
+              maxLength="30"
+              v-model="queryParams.searchValue"
+              placeholder="计划标题/实验室/房间号/检查者"
+              clearable
+              style="width: 250px"
+            />
+          </el-form-item>
+          <el-form-item label="学院" prop="deptId" label-width="50px">
+            <el-select v-model="queryParams.deptId" clearable placeholder="请选择学院" style="width: 150px">
+              <el-option
+                v-for="item in deptSelectList"
+                :key="item.deptId"
+                :label="item.deptName"
+                :value="item.deptId">
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="检查时间" prop="dateRange" style="margin-left:10px;" label-width="70px">
+            <el-date-picker
+              :clearable="false"
+              v-model="dateRange"
+              size="small"
+              style="width: 240px"
+              value-format="yyyy-MM-dd"
+              type="daterange"
+              range-separator="-"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+            ></el-date-picker>
+          </el-form-item>
+          <el-form-item>
+            <p class="inquire-button-one" @click="handleQuery" style="margin-right:10px;">查询</p>
+            <p class="reset-button-one" @click="resetQuery">重置</p>
+          </el-form-item>
+        </el-form>
+      </div>
+      <div class="content-box">
+        <el-table  border :data="tableList" ref="multipleTable" @sort-change="sortChange">
+          <el-table-column label="序号" align="center"  type="index" width="60" fixed/>
+          <el-table-column label="计划标题" align="center" prop="title" show-overflow-tooltip width="250" fixed/>
+          <el-table-column label="实验室" align="center" prop="subjectName" show-overflow-tooltip width="220" fixed>
+            <template slot-scope="scope">{{scope.row.roomNumber?scope.row.subjectName+'-'+scope.row.roomNumber:scope.row.subjectName}}</template>
+          </el-table-column>
+          <el-table-column label="学院" align="center" prop="collegeName" show-overflow-tooltip width="150"/>
+          <el-table-column label="检查类型" align="center" prop="checkRange" show-overflow-tooltip width="120">
+            <template slot-scope="scope">
+              <p>{{scope.row.checkCategory==1?'综合检查':(scope.row.checkCategory==2?'专项检查':'-')}}</p>
+            </template>
+          </el-table-column>
+          <el-table-column label="检查状态" align="center" prop="manageStatus" show-overflow-tooltip width="90">
+            <template slot-scope="scope">
+              <p :class="scope.row.manageStatus==0?'manageStatus-color-1':(scope.row.manageStatus==1?'manageStatus-color-2':(scope.row.manageStatus==2?'manageStatus-color-3':''))">{{scope.row.manageStatus==0?'待检查':(scope.row.manageStatus==1?'检查中':(scope.row.manageStatus==2?'已检查':''))}}</p>
+            </template>
+          </el-table-column>
+          <el-table-column label="检查者" align="center" prop="checkUser" show-overflow-tooltip width="100"/>
+          <el-table-column label="检查结果" align="center" prop="checkResult" show-overflow-tooltip width="80">
+            <template slot-scope="scope">
+              <p>{{scope.row.checkResult==0?'不符合':(scope.row.checkResult==1?'符合':'')}}</p>
+            </template>
+          </el-table-column>
+          <el-table-column label="隐患数" align="center" prop="dangerNum" show-overflow-tooltip width="80"/>
+          <el-table-column label="整改进度" align="center" prop="rectifySchedule" show-overflow-tooltip width="200"/>
+          <el-table-column label="计划周期" align="center" prop="startTime" show-overflow-tooltip width="270">
+            <template slot-scope="scope">
+              <p>{{scope.row.cycleStartTime}} 至 {{scope.row.cycleEndTime}}<span style="color:#EE0606;margin-left:15px;" v-if="scope.row.isOverdue==1">已逾期</span></p>
+            </template>
+          </el-table-column>
+          <el-table-column label="检查时间" sortable="custom" align="center" prop="checkTime" show-overflow-tooltip width="157"/>
+          <el-table-column label="操作" align="center" prop="deptName" width="280">
+            <template slot-scope="scope">
+              <div class="table-button-box">
+                <p class="table-button-null"></p>
+                <p class="table-button-p" v-hasPermi="['safety:checkManage:query']"
+                   v-show="scope.row.manageStatus==0||scope.row.manageStatus==2" @click="goAddPage(3,scope.row.id)">详情</p>
+                <p class="table-button-p" v-hasPermiAnd="['safety:checkManage:query','safety:checkManage:edit']"
+                   v-show="scope.row.manageStatus==1 && scope.row.isCheck==1 && scope.row.isSelfData==1" @click="goAddPage(2,scope.row.id)">编辑</p>
+                <p class="table-button-p" v-hasPermiAnd="['safety:checkManage:query','safety:checkManage:edit']"
+                   v-show="scope.row.manageStatus==0 && scope.row.isCheck==1 && scope.row.isSelfData==1" @click="goAddPage(2,scope.row.id)">开始检查</p>
+                <p class="table-button-p" v-hasPermiAnd="['safety:checkManage:query','safety:checkManage:edit']"
+                   style="color:#999" v-show="scope.row.manageStatus==0 && scope.row.isCheck==0 && scope.row.isSelfData==1">开始检查</p>
+                <p class="table-button-p" v-show="scope.row.isEndProcess==1 && scope.row.checkResult==0" @click="lookDocumentButton(1,scope.row)">整改报告</p>
+                <p class="table-button-p" v-show="scope.row.isAttachment == 1" @click="lookDocumentListButton(1,scope.row)">查看附件</p>
+                <p class="table-button-null"></p>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+        <pagination :page-sizes="[20, 30, 40, 50]"
+                    v-show="total>0"
+                    :total="total"
+                    :page.sync="queryParams.pageNum"
+                    :limit.sync="queryParams.pageSize"
+                    @pagination="getList"
+        />
+      </div>
+    </div>
+    <addPage v-if="pageType==2" :propsAddData="propsAddData"></addPage>
+    <infoPage v-if="pageType==3" :propsInfoData="propsInfoData"></infoPage>
+    <lookDocumentDataDialog v-if="lookDocumentType" :propsLookDocumentData="propsLookDocumentData"></lookDocumentDataDialog>
+    <lookDocumentListDialog v-if="lookDocumentListType" :propsLookDocumentListData="propsLookDocumentListData"></lookDocumentListDialog>
+  </div>
+</template>
+
+<script>
+  import { listDepartments } from "@/apiDemo/system/dept";
+  import { checkManageList,getFindByCheckPlanId } from '@/apiDemo/safetyCheck/index'
+  import addPage from '@/views/safetyCheck/components/addPage/addPage.vue'
+  import infoPage from '@/views/safetyCheck/components/infoPage/infoPage.vue'
+  import lookDocumentDataDialog from '@/components/lookDocumentDialog/lookDocumentDataDialog.vue'
+  import lookDocumentListDialog from '@/components/lookDocumentDialog/lookDocumentListDialog.vue'
+  export default {
+    name: 'index',
+    components: {
+      addPage,
+      infoPage,
+      lookDocumentDataDialog,
+      lookDocumentListDialog
+    },
+    data(){
+      return{
+        //子组件数据
+        lookDocumentType:false,
+        propsLookDocumentData:{},
+        lookDocumentListType:false,
+        propsLookDocumentListData:{},
+        propsAddData:{},
+        propsInfoData:{},
+        //学院列表
+        deptSelectList:[],
+        pageType:1,
+        queryParams:{
+          pageNum:1,
+          pageSize:20,
+          checkType:1,
+          manageStatus:'-1',
+          checkTimeSort:0,
+          searchValue:"",
+          deptId:"",
+          myRelated:1,
+        },
+        dateRange:[],
+        tableList:[],
+        total:0,
+        correlationNum:'',
+      }
+    },
+    created(){
+      if(this.$route.query.id){
+        this.goAddPage(2,this.$route.query.id);
+      }
+    },
+    mounted(){
+      this.listDepartments();
+      this.getList();
+    },
+    methods:{
+      //获取相关数量
+      getCorrelationNum(){
+        checkManageList({
+          pageNum:1,
+          pageSize:20,
+          checkType:1,
+          checkTimeSort:0,
+          myRelated:1,
+          manageStatus:this.queryParams.manageStatus,
+          searchValue:this.queryParams.searchValue,
+          deptId:this.queryParams.deptId,
+          startTime:this.dateRange[0]?this.dateRange[0]:'',
+          endTime:this.dateRange[1]?this.dateRange[1]:'',
+        }).then(response => {
+          this.$set(this,'correlationNum',response.data.total>999?' 999+':(response.data.total<1?'':' '+response.data.total));
+        });
+      },
+      //开始检查
+      goAddPage(type,id){
+        if(this.pageType != type){
+          if(type == 1){
+            //返回
+            this.$set(this,'pageType',type);
+          }else if(type == 2){
+            //开始检查/编辑
+            this.$set(this,'propsAddData',{
+              id:id,
+              title:'校院巡查',
+            });
+            this.$set(this,'pageType',type);
+          }else if(type == 3){
+            //详情
+            this.$set(this,'propsInfoData',{id:id});
+            this.$set(this,'pageType',type);
+          }else if(type == 4){
+            //返回并刷新
+            this.getList();
+            this.$set(this,'pageType',1);
+          }
+        }
+      },
+      //时间排序方法
+      sortChange(val){
+        if(val.prop == 'checkTime'){
+          this.$set(this.queryParams,'checkTimeSort',val.order=='ascending'?'1':(val.order=='descending'?'2':"0"));
+          this.handleQuery();
+        }
+      },
+      //范围选择
+      topLeftClickType(type){
+        if(this.queryParams.manageStatus != type){
+          this.$set(this.queryParams,'manageStatus',type);
+          this.handleQuery();
+        }
+      },
+      //与我相关按钮
+      topRightClickType(){
+        this.$set(this.queryParams,'myRelated',this.queryParams.myRelated==1?0:1);
+        this.handleQuery();
+      },
+      //获取数据列表
+      getList(){
+        let obj = JSON.parse(JSON.stringify(this.queryParams))
+        if(this.dateRange[0]){
+          obj.startTime = this.dateRange[0];
+        }else{
+          obj.startTime = "";
+        }
+        if(this.dateRange[1]){
+          obj.endTime = this.dateRange[1];
+        }else{
+          obj.endTime = "";
+        }
+        let self = this;
+        setTimeout(function(){
+          self.getCorrelationNum();
+        },500);
+        checkManageList(obj).then(response => {
+          this.total = response.data.total;
+          this.tableList = response.data.records;
+        });
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.$set(this.queryParams,'pageNum',1);
+        this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.$set(this,'dateRange',[]);
+        this.$set(this,'queryParams',{
+          pageNum:1,
+          pageSize:20,
+          checkType:1,
+          manageStatus:'-1',
+          checkTimeSort:0,
+          searchValue:"",
+          deptId:"",
+          myRelated:1,
+        });
+        this.handleQuery();
+      },
+      //查看单个文档
+      lookDocumentButton(type,row){
+        if(type==1){
+          this.$set(this,'propsLookDocumentData',{
+            title:"整改报告",
+            type:1,
+            id:row.id,
+            name:row.title
+          });
+          this.$set(this,'lookDocumentType',true);
+        }else{
+          this.$set(this,'lookDocumentType',false);
+        }
+      },
+      //查看多个文档
+      lookDocumentListButton(type,row){
+        if(type==1){
+          getFindByCheckPlanId({checkPlanId:row.checkPlanId}).then(response => {
+            let list = [];
+            for(let i=0;i<response.data.length;i++){
+              let obj = {
+                name:response.data[i].fileName,
+                url:response.data[i].fileUrl,
+              }
+              list.push(obj);
+            }
+            this.$set(this,'propsLookDocumentListData',{
+              title:"查看附件",
+              list:list
+            });
+            this.$set(this,'lookDocumentListType',true);
+          });
+        }else{
+          this.$set(this,'lookDocumentListType',false);
+        }
+      },
+      //获取学院列表
+      listDepartments(){
+        listDepartments().then(response => {
+          this.deptSelectList = response.data;
+        });
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  ::v-deep .el-table__body-wrapper{
+    padding-bottom: 8px;
+  }
+  ::v-deep .el-table__fixed{
+    margin-top:-1px;
+    margin-left:-1px;
+    height:calc(100% - 8px)!important;
+  }
+  ::v-deep .el-table__fixed-body-wrapper{
+    height: calc(100% - 48px);
+    overflow-y: auto;
+  }
+  .inspectionManagement{
+    flex: 1;
+    display: flex !important;
+    flex-direction: column;
+    overflow: hidden;
+    .inspectionManagement-page{
+      flex: 1;
+      display: flex !important;
+      flex-direction: column;
+      overflow: hidden;
+      .title-box{
+        padding-top:20px;
+        border-bottom:1px solid #dedede;
+        .form-button-max-big-box{
+          display: inline-block;
+          margin-left:10px;
+          .form-button-big-box{
+            display: flex;
+            p:nth-child(1){
+              border-top-left-radius: 4px;
+              border-bottom-left-radius: 4px;
+              border-top:1px solid #E0E0E0;
+              border-bottom:1px solid #E0E0E0;
+            }
+            p:nth-child(2){
+              border-top:1px solid #E0E0E0;
+              border-bottom:1px solid #E0E0E0;
+            }
+            p:nth-child(3){
+              border-top:1px solid #E0E0E0;
+              border-bottom:1px solid #E0E0E0;
+            }
+            p:nth-child(4){
+              border-top-right-radius: 4px;
+              border-bottom-right-radius: 4px;
+              border-top:1px solid #E0E0E0;
+              border-bottom:1px solid #E0E0E0;
+              border-right:1px solid #E0E0E0;
+            }
+            p{
+              height:40px;
+              width:80px;
+              line-height: 40px;
+              text-align: center;
+              color:#666666;
+              font-size:14px;
+              font-weight:500;
+              cursor: pointer;
+              border-left:1px solid #E0E0E0;
+            }
+            .checkDiv{
+              color:#fff!important;
+              border:1px solid #0183FA!important;
+              background-color: #0183FA;
+            }
+          }
+        }
+        .form-button-max-big-box-me{
+          display: inline-block;
+          .form-button-big-box-me{
+            display: flex;
+            div{
+              position: relative;
+              height:40px;
+              width:130px;
+              line-height: 40px;
+              text-align: center;
+              color:#999;
+              font-size:14px;
+              border:1px solid #999;
+              border-radius:4px;
+              margin-left:10px;
+              font-weight:500;
+              cursor: pointer;
+              .icon-p-me{
+                width:15px;
+                height:15px;
+                line-height:15px;
+                text-align: center;
+                position: absolute;
+                right:0;
+                bottom:0;
+                color:#fff;
+                background: #0183fa;
+                border-top-left-radius:4px;
+              }
+            }
+            .checkDiv-me{
+              color:#0183FA!important;
+              border:1px solid #0183FA!important;
+            }
+          }
+        }
+      }
+      .content-box{
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+        padding:20px;
+        overflow: hidden;
+      }
+    }
+  }
+</style>

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

@@ -0,0 +1,439 @@
+<!--巡查计划-->
+<template>
+  <div class="app-container inspectionPlan">
+    <div class="inspectionPlan-page" v-if="pageType == 1">
+      <div class="title-box">
+        <el-form :model="queryParams" class="form-box" ref="queryForm" :inline="true" label-width="80px">
+          <div class="form-button-max-big-box">
+            <div class="form-button-big-box" style="margin-left:10px;">
+              <p class="text-p" :class="queryParams.checkStatus=='0'?'checkDiv':''" @click="topLeftClickType('0')">全部</p>
+              <p class="text-p" :class="queryParams.checkStatus=='1'?'checkDiv':''" @click="topLeftClickType('1')">未开始</p>
+              <p class="text-p" :class="queryParams.checkStatus=='2'?'checkDiv':''" @click="topLeftClickType('2')">进行中</p>
+              <p class="text-p" :class="queryParams.checkStatus=='3'?'checkDiv':''" @click="topLeftClickType('3')">已结束</p>
+            </div>
+          </div>
+          <!--与我相关-->
+          <div class="form-button-max-big-box-me">
+            <div class="form-button-big-box-me">
+              <div :class="queryParams.myRelated==1?'checkDiv-me':''" @click="topRightClickType">
+                <p class="text-p-me">与我有关{{correlationNum}}</p>
+                <p class="el-icon-check icon-p-me" v-if="queryParams.myRelated==1"></p>
+              </div>
+            </div>
+          </div>
+          <el-form-item label="关键字" prop="searchValue">
+            <el-input
+              maxLength="30"
+              v-model="queryParams.searchValue"
+              placeholder="计划标题/创建人"
+              clearable
+              style="width: 200px"
+            />
+          </el-form-item>
+          <el-form-item label="检查周期" prop="dateRange" style="margin-left:10px;" label-width="70px">
+            <el-date-picker
+              :clearable="false"
+              v-model="dateRange"
+              size="small"
+              style="width: 240px"
+              value-format="yyyy-MM-dd"
+              type="daterange"
+              range-separator="-"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+            ></el-date-picker>
+          </el-form-item>
+          <el-form-item>
+            <p class="inquire-button-one" @click="handleQuery" style="margin-right:10px;">查询</p>
+            <p class="reset-button-one" @click="resetQuery">重置</p>
+          </el-form-item>
+          <el-form-item style="float: right;" v-hasPermi="['security:checkPlan:add']">
+            <el-col :span="1.5">
+              <p class="inquire-button-one"
+                 style="width:130px;"
+                 @click="addDialogOpen(1)"
+              ><i class="el-icon-plus"></i> 创建巡查计划</p>
+            </el-col>
+          </el-form-item>
+        </el-form>
+      </div>
+      <div class="content-box">
+        <el-table  border :data="tableList" ref="multipleTable" @sort-change="sortChange">
+          <el-table-column label="序号" align="center"  type="index" width="60" />
+          <el-table-column label="计划标题" align="center" prop="title" show-overflow-tooltip/>
+          <el-table-column label="检查范围" align="center" prop="checkRange" show-overflow-tooltip width="120">
+            <template slot-scope="scope">
+              <p>{{scope.row.checkRange==1?'全校':(scope.row.checkRange==2?'学院':(scope.row.checkRange==3?'实验室':''))}}</p>
+            </template>
+          </el-table-column>
+          <el-table-column label="检查类型" align="center" prop="checkRange" show-overflow-tooltip width="120">
+            <template slot-scope="scope">
+              <p>{{scope.row.checkCategory==1?'综合检查':(scope.row.checkCategory==2?'专项检查':'-')}}</p>
+            </template>
+          </el-table-column>
+          <el-table-column label="计划周期" align="center" prop="cycleStartTime" show-overflow-tooltip width="260">
+            <template slot-scope="scope">
+              <p>{{scope.row.cycleStartTime}} 至 {{scope.row.cycleEndTime}}<span style="color:#EE0606;margin-left:15px;" v-if="scope.row.isOverdue==1">已逾期</span></p>
+            </template>
+          </el-table-column>
+          <el-table-column label="状态" align="center" prop="checkStatus" show-overflow-tooltip width="80">
+            <template slot-scope="scope">
+              <p :class="scope.row.checkStatus==1?'checkStatus-color-1':(scope.row.checkStatus==2?'checkStatus-color-2':(scope.row.checkStatus==3?'checkStatus-color-3':''))">{{scope.row.checkStatus==1?'未开始':(scope.row.checkStatus==2?'进行中':(scope.row.checkStatus==3?'已结束':''))}}</p>
+            </template>
+          </el-table-column>
+          <el-table-column label="检查进度" align="center" prop="checkSchedule" show-overflow-tooltip width="210"/>
+          <el-table-column label="创建人" align="center" prop="createName" show-overflow-tooltip width="130"/>
+          <el-table-column label="创建时间" sortable="custom" align="center" prop="createTime" show-overflow-tooltip width="157"/>
+          <el-table-column label="操作" align="center" prop="deptName" width="280">
+            <template slot-scope="scope">
+              <div class="table-button-box">
+                <p class="table-button-null"></p>
+                <p class="table-button-p" v-hasPermi="['security:checkPlan:query']"
+                   v-show="scope.row.checkStatus!=1" @click="addDialogOpen(3,scope.row)">详情</p>
+                <p class="table-button-p" v-hasPermiAnd="['security:checkPlan:query','security:checkPlan:edit']"
+                   v-show="scope.row.checkStatus==1&&scope.row.isSelfData == 1" @click="addDialogOpen(2,scope.row)">编辑</p>
+                <p class="table-button-p" v-hasPermi="['security:checkManage_2:list']"
+                   @click="goPage(2,scope.row)">巡查管理</p>
+                <p class="table-button-p" v-hasPermi="['security:checkPlan:remove']"
+                   v-show="scope.row.checkStatus==1&&scope.row.isSelfData == 1" @click="deleteObj(scope.row)">删除</p>
+                <p class="table-button-p" v-show="scope.row.isAttachment == 1" @click="lookDocumentListButton(1,scope.row)">查看附件</p>
+                <p class="table-button-null"></p>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+        <pagination :page-sizes="[20, 30, 40, 50]"
+                    v-show="total>0"
+                    :total="total"
+                    :page.sync="queryParams.pageNum"
+                    :limit.sync="queryParams.pageSize"
+                    @pagination="getList"
+        />
+      </div>
+    </div>
+    <list-page v-if="pageType == 2" :propsListPageData="propsListPageData"></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'
+  import { checkPlanList,checkPlanDelete,getFindByCheckPlanId } from '@/apiDemo/safetyCheck/index'
+  export default {
+    name: 'index',
+    components: {
+      addDialog,
+      listPage,
+      lookDocumentListDialog
+    },
+    data(){
+      return{
+        //子组件数据
+        lookDocumentListType:false,
+        propsLookDocumentListData:{},
+        propsListPageData:{},
+        addDialogType:false,
+        addDialogData:{},
+        pageType:1,
+        queryParams:{
+          pageNum:1,
+          pageSize:20,
+          checkStatus:0,
+          createTimeSort:0,
+          searchValue:"",
+          checkType:1,
+          myRelated:1,
+        },
+        dateRange:[],
+        tableList:[],
+        total:0,
+        correlationNum:'',
+      }
+    },
+    created(){
+
+    },
+    mounted(){
+      this.getList();
+    },
+    methods:{
+      //获取相关数量
+      getCorrelationNum(){
+        checkPlanList({
+          pageNum:1,
+          pageSize:20,
+          createTimeSort:0,
+          checkType:1,
+          myRelated:1,
+          checkStatus:this.queryParams.checkStatus,
+          searchValue:this.queryParams.searchValue,
+          cycleStartTime:this.dateRange[0]?this.dateRange[0]:'',
+          cycleEndTime:this.dateRange[1]?this.dateRange[1]:'',
+        }).then(response => {
+          this.$set(this,'correlationNum',response.data.total>999?' 999+':(response.data.total<1?'':' '+response.data.total));
+        });
+      },
+      //与我相关按钮
+      topRightClickType(){
+        this.$set(this.queryParams,'myRelated',this.queryParams.myRelated==1?0:1);
+        this.handleQuery();
+      },
+      //切换页面
+      goPage(type,data){
+        if(this.pageType != type){
+          if(type == 2){
+            this.$set(this,'propsListPageData',data);
+            this.$set(this,'pageType',type);
+          }else if(type == 1){
+            this.$set(this,'pageType',type);
+          }else if(type == 3){
+            this.$set(this,'pageType',1);
+            this.getList();
+          }
+        }
+      },
+      //弹窗开启
+      addDialogOpen(type,data){
+        if(type==1){
+          this.$set(this,'addDialogData',{
+            title:"创建巡查计划",
+            lookInfoType:false,
+            addType:true,
+          })
+          this.$set(this,'addDialogType',true);
+        }else if(type==2){
+          this.$set(this,'addDialogData',{
+            title:"编辑巡查计划",
+            id:data.id,
+            lookInfoType:false,
+            addType:false,
+          })
+          this.$set(this,'addDialogType',true);
+        }else if(type==3){
+          this.$set(this,'addDialogData',{
+            title:"巡查计划详情",
+            id:data.id,
+            lookInfoType:true,
+            addType:false,
+          })
+          this.$set(this,'addDialogType',true);
+        }else if(type==4){
+          this.$set(this,'addDialogType',false);
+        }else if(type == 5){
+          this.$set(this,'addDialogType',false);
+          this.getList();
+        }
+      },
+      //范围选择
+      topLeftClickType(type){
+        if(this.queryParams.checkStatus != type){
+          this.$set(this.queryParams,'checkStatus',type);
+          this.handleQuery();
+        }
+      },
+      //时间排序方法
+      sortChange(val){
+        if(val.prop == 'createTime'){
+          this.$set(this.queryParams,'createTimeSort',val.order=='ascending'?'1':(val.order=='descending'?'2':'0'));
+          this.handleQuery();
+        }
+      },
+      //获取数据列表
+      getList(){
+        let obj = JSON.parse(JSON.stringify(this.queryParams))
+        if(this.dateRange[0]){
+          obj.cycleStartTime = this.dateRange[0];
+        }else{
+          obj.cycleStartTime = "";
+        }
+        if(this.dateRange[1]){
+          obj.cycleEndTime = this.dateRange[1];
+        }else{
+          obj.cycleEndTime = "";
+        }
+        let self = this;
+        setTimeout(function(){
+          self.getCorrelationNum();
+        },500);
+        checkPlanList(obj).then(response => {
+          this.total = response.data.total;
+          this.tableList = response.data.records;
+        });
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.$set(this.queryParams,'pageNum',1);
+        this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.$set(this,'dateRange',[]);
+        this.$set(this,'queryParams',{
+          pageNum:1,
+          pageSize:20,
+          checkStatus:0,
+          createTimeSort:0,
+          searchValue:"",
+          checkType:1,
+          myRelated:1,
+        });
+        this.handleQuery();
+      },
+      //删除
+      deleteObj(obj){
+        let self = this;
+        this.$confirm('是否确认删除?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(function() {
+          checkPlanDelete({id:obj.id,checkType:obj.checkType}).then(response => {
+            self.msgSuccess(response.msg)
+            self.getList();
+          })
+        }).then(() => {
+        }).catch(() => {});
+      },
+      //查看多个文档
+      lookDocumentListButton(type,row){
+        if(type==1){
+          getFindByCheckPlanId({checkPlanId:row.id}).then(response => {
+            let list = [];
+            for(let i=0;i<response.data.length;i++){
+              let obj = {
+                name:response.data[i].fileName,
+                url:response.data[i].fileUrl,
+              }
+              list.push(obj);
+            }
+            this.$set(this,'propsLookDocumentListData',{
+              title:"查看附件",
+              list:list
+            });
+            this.$set(this,'lookDocumentListType',true);
+          });
+        }else{
+          this.$set(this,'lookDocumentListType',false);
+        }
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .inspectionPlan{
+    flex: 1;
+    display: flex !important;
+    flex-direction: column;
+    overflow: hidden;
+    .inspectionPlan-page{
+      flex: 1;
+      display: flex !important;
+      flex-direction: column;
+      overflow: hidden;
+      .title-box{
+        padding-top:20px;
+        border-bottom:1px solid #dedede;
+        .form-button-max-big-box{
+          display: inline-block;
+          margin-left:10px;
+          .form-button-big-box{
+            display: flex;
+            p:nth-child(1){
+              border-top-left-radius: 4px;
+              border-bottom-left-radius: 4px;
+              border-top:1px solid #E0E0E0;
+              border-bottom:1px solid #E0E0E0;
+            }
+            p:nth-child(2){
+              border-top:1px solid #E0E0E0;
+              border-bottom:1px solid #E0E0E0;
+            }
+            p:nth-child(3){
+              border-top:1px solid #E0E0E0;
+              border-bottom:1px solid #E0E0E0;
+            }
+            p:nth-child(4){
+              border-top-right-radius: 4px;
+              border-bottom-right-radius: 4px;
+              border-top:1px solid #E0E0E0;
+              border-bottom:1px solid #E0E0E0;
+              border-right:1px solid #E0E0E0;
+            }
+            p{
+              height:40px;
+              width:80px;
+              line-height: 40px;
+              text-align: center;
+              color:#666666;
+              font-size:14px;
+              font-weight:500;
+              cursor: pointer;
+              border-left:1px solid #E0E0E0;
+            }
+            .checkDiv{
+              color:#fff!important;
+              border:1px solid #0183FA!important;
+              background-color: #0183FA;
+            }
+          }
+        }
+        .form-button-max-big-box-me{
+          display: inline-block;
+          .form-button-big-box-me{
+            display: flex;
+            div{
+              position: relative;
+              height:40px;
+              width:130px;
+              line-height: 40px;
+              text-align: center;
+              color:#999;
+              font-size:14px;
+              border:1px solid #999;
+              border-radius:4px;
+              margin-left:10px;
+              font-weight:500;
+              cursor: pointer;
+              .icon-p-me{
+                width:15px;
+                height:15px;
+                line-height:15px;
+                text-align: center;
+                position: absolute;
+                right:0;
+                bottom:0;
+                color:#fff;
+                background: #0183fa;
+                border-top-left-radius:4px;
+              }
+            }
+            .checkDiv-me{
+              color:#0183FA!important;
+              border:1px solid #0183FA!important;
+            }
+          }
+        }
+      }
+      .content-box{
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+        padding:20px;
+        overflow: hidden;
+        .checkStatus-color-1{
+          color:#0183FA;
+        }
+        .checkStatus-color-2{
+          color:#EE0606;
+        }
+        .checkStatus-color-3{
+          color:#23B303;
+        }
+      }
+    }
+  }
+</style>

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

@@ -0,0 +1,392 @@
+<!--巡查子项管理-->
+<template>
+  <div class="selfInspectionManagement">
+    <div class="selfInspectionManagement-page" v-if="pageType == 1">
+      <div class="title-box">
+        <el-form :model="queryParams" class="form-box" ref="queryForm" :inline="true" label-width="80px">
+          <div class="form-button-max-big-box">
+            <div class="form-button-big-box" style="margin-left:10px;">
+              <div :class="queryParams.manageStatus=='-1'?'checkDiv':''" @click="topLeftClickType('-1')">
+                <p class="text-p">全部</p>
+                <p class="el-icon-check icon-p" v-if="queryParams.manageStatus=='-1'"></p>
+              </div>
+              <div :class="queryParams.manageStatus==0?'checkDiv':''" @click="topLeftClickType(0)">
+                <p class="text-p">待检查</p>
+                <p class="el-icon-check icon-p" v-if="queryParams.manageStatus==0"></p>
+              </div>
+              <div :class="queryParams.manageStatus==1?'checkDiv':''" @click="topLeftClickType(1)">
+                <p class="text-p">检查中</p>
+                <p class="el-icon-check icon-p" v-if="queryParams.manageStatus==1"></p>
+              </div>
+              <div :class="queryParams.manageStatus==2?'checkDiv':''" @click="topLeftClickType(2)">
+                <p class="text-p">已检查</p>
+                <p class="el-icon-check icon-p" v-if="queryParams.manageStatus==2"></p>
+              </div>
+            </div>
+          </div>
+          <el-form-item label="关键字" prop="searchValue">
+            <el-input
+              maxLength="30"
+              v-model="queryParams.searchValue"
+              placeholder="计划标题/实验室/房间号/检查者"
+              clearable
+              style="width: 250px"
+            />
+          </el-form-item>
+          <el-form-item label="学院" prop="deptId" label-width="50px">
+            <el-select v-model="queryParams.deptId" clearable placeholder="请选择学院" style="width: 150px">
+              <el-option
+                v-for="item in deptSelectList"
+                :key="item.deptId"
+                :label="item.deptName"
+                :value="item.deptId">
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="检查时间" prop="dateRange" style="margin-left:10px;" label-width="70px">
+            <el-date-picker
+              :clearable="false"
+              v-model="dateRange"
+              size="small"
+              style="width: 240px"
+              value-format="yyyy-MM-dd"
+              type="daterange"
+              range-separator="-"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+            ></el-date-picker>
+          </el-form-item>
+          <el-form-item>
+            <p class="inquire-button-one" @click="handleQuery" style="margin-right:10px;">查询</p>
+            <p class="reset-button-one" @click="resetQuery">重置</p>
+          </el-form-item>
+          <el-form-item style="float: right">
+            <p class="add-button-one-90" style="width:80px;" @click="outButton">返回</p>
+          </el-form-item>
+        </el-form>
+      </div>
+      <div class="content-box">
+        <el-table  border :data="tableList" ref="multipleTable" @sort-change="sortChange">
+          <el-table-column label="序号" align="center"  type="index" width="60" fixed/>
+          <el-table-column label="计划标题" align="center" prop="title" show-overflow-tooltip width="250" fixed/>
+          <el-table-column label="实验室" align="center" prop="subjectName" show-overflow-tooltip width="220" fixed>
+            <template slot-scope="scope">{{scope.row.roomNumber?scope.row.subjectName+'-'+scope.row.roomNumber:scope.row.subjectName}}</template>
+          </el-table-column>
+          <el-table-column label="学院" align="center" prop="collegeName" show-overflow-tooltip width="150"/>
+          <el-table-column label="检查类型" align="center" prop="checkRange" show-overflow-tooltip width="120">
+            <template slot-scope="scope">
+              <p>{{scope.row.checkCategory==1?'综合检查':(scope.row.checkCategory==2?'专项检查':'-')}}</p>
+            </template>
+          </el-table-column>
+          <el-table-column label="检查状态" align="center" prop="manageStatus" show-overflow-tooltip width="90">
+            <template slot-scope="scope">
+              <p :class="scope.row.manageStatus==0?'manageStatus-color-1':(scope.row.manageStatus==1?'manageStatus-color-2':(scope.row.manageStatus==2?'manageStatus-color-3':''))">{{scope.row.manageStatus==0?'待检查':(scope.row.manageStatus==1?'检查中':(scope.row.manageStatus==2?'已检查':''))}}</p>
+            </template>
+          </el-table-column>
+          <el-table-column label="检查者" align="center" prop="checkUser" show-overflow-tooltip width="100"/>
+          <el-table-column label="检查结果" align="center" prop="checkResult" show-overflow-tooltip width="80">
+            <template slot-scope="scope">
+              <p>{{scope.row.checkResult==0?'不符合':(scope.row.checkResult==1?'符合':'')}}</p>
+            </template>
+          </el-table-column>
+          <el-table-column label="隐患数" align="center" prop="dangerNum" show-overflow-tooltip width="80"/>
+          <el-table-column label="整改进度" align="center" prop="rectifySchedule" show-overflow-tooltip width="200"/>
+          <el-table-column label="计划周期" align="center" prop="startTime" show-overflow-tooltip width="270">
+            <template slot-scope="scope">
+              <p>{{scope.row.cycleStartTime}} 至 {{scope.row.cycleEndTime}}<span style="color:#EE0606;margin-left:15px;" v-if="scope.row.isOverdue==1">已逾期</span></p>
+            </template>
+          </el-table-column>
+          <el-table-column label="检查时间" sortable="custom" align="center" prop="checkTime" show-overflow-tooltip width="157"/>
+          <el-table-column label="操作" align="center" prop="deptName" width="280">
+            <template slot-scope="scope">
+              <div class="table-button-box">
+                <p class="table-button-null"></p>
+                <p class="table-button-p" v-hasPermi="['security:checkManage_2:query']"
+                   v-show="scope.row.manageStatus==0||scope.row.manageStatus==2" @click="goAddPage(3,scope.row.id)">详情</p>
+                <p class="table-button-p" v-hasPermiAnd="['security:checkManage_2:query','security:checkManage_2:edit']"
+                   v-show="scope.row.manageStatus==1 && scope.row.isCheck==1 && scope.row.isSelfData==1" @click="goAddPage(2,scope.row.id)">编辑</p>
+                <p class="table-button-p" v-hasPermiAnd="['security:checkManage_2:query','security:checkManage_2:edit']"
+                   v-show="scope.row.manageStatus==0 && scope.row.isCheck==1 && scope.row.isSelfData==1" @click="goAddPage(2,scope.row.id)">开始检查</p>
+                <p class="table-button-p" v-hasPermiAnd="['security:checkManage_2:query','security:checkManage_2:edit']"
+                   style="color:#999" v-show="scope.row.manageStatus==0 && scope.row.isCheck==0 && scope.row.isSelfData==1">开始检查</p>
+                <p class="table-button-p" v-show="scope.row.isEndProcess==1 && scope.row.checkResult==0" @click="lookDocumentButton(1,scope.row)">整改报告</p>
+                <p class="table-button-p" v-show="scope.row.isAttachment == 1" @click="lookDocumentListButton(1,scope.row)">查看附件</p>
+                <p class="table-button-null"></p>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+        <pagination :page-sizes="[20, 30, 40, 50]"
+                    v-show="total>0"
+                    :total="total"
+                    :page.sync="queryParams.pageNum"
+                    :limit.sync="queryParams.pageSize"
+                    @pagination="getList"
+        />
+      </div>
+    </div>
+    <addPage v-if="pageType==2" :propsAddData="propsAddData"></addPage>
+    <infoPage v-if="pageType==3" :propsInfoData="propsInfoData"></infoPage>
+    <lookDocumentDataDialog v-if="lookDocumentType" :propsLookDocumentData="propsLookDocumentData"></lookDocumentDataDialog>
+    <lookDocumentListDialog v-if="lookDocumentListType" :propsLookDocumentListData="propsLookDocumentListData"></lookDocumentListDialog>
+  </div>
+</template>
+
+<script>
+  import { listDepartments } from "@/apiDemo/system/dept";
+  import { findByCheckPlanId,getFindByCheckPlanId } from '@/apiDemo/safetyCheck/index'
+  import addPage from '@/views/safetyCheck/components/addPage/addPage.vue'
+  import infoPage from '@/views/safetyCheck/components/infoPage/infoPage.vue'
+  import lookDocumentDataDialog from '@/components/lookDocumentDialog/lookDocumentDataDialog.vue'
+  import lookDocumentListDialog from '@/components/lookDocumentDialog/lookDocumentListDialog.vue'
+  export default {
+    name: 'index',
+    props:{
+      propsListPageData:{},
+    },
+    components: {
+      addPage,
+      infoPage,
+      lookDocumentDataDialog,
+      lookDocumentListDialog
+    },
+    data(){
+      return{
+        //子组件数据
+        lookDocumentType:false,
+        propsLookDocumentData:{},
+        lookDocumentListType:false,
+        propsLookDocumentListData:{},
+        propsAddData:{},
+        propsInfoData:{},
+        //学院列表
+        deptSelectList:[],
+        pageType:1,
+        queryParams:{
+          pageNum:1,
+          pageSize:20,
+          manageStatus:'-1',
+          checkTimeSort:0,
+          searchValue:"",
+          deptId:""
+        },
+        dateRange:[],
+        tableList:[],
+        total:0,
+      }
+    },
+    created(){
+
+    },
+    mounted(){
+      this.listDepartments();
+      this.getList();
+    },
+    methods:{
+      //返回按钮
+      outButton(){
+        this.$parent.goPage(3);
+      },
+      //开始检查
+      goAddPage(type,id){
+        if(this.pageType != type){
+          if(type == 1){
+            //返回
+            this.$set(this,'pageType',type);
+          }else if(type == 2){
+            //开始检查/编辑
+            this.$set(this,'propsAddData',{
+              id:id,
+              title:'校院巡查',
+            });
+            this.$set(this,'pageType',type);
+          }else if(type == 3){
+            //详情
+            this.$set(this,'propsInfoData',{id:id});
+            this.$set(this,'pageType',type);
+          }else if(type == 4){
+            //返回并刷新
+            this.getList();
+            this.$set(this,'pageType',1);
+          }
+        }
+      },
+      //时间排序方法
+      sortChange(val){
+        if(val.prop == 'checkTime'){
+          this.$set(this.queryParams,'checkTimeSort',val.order=='ascending'?'1':(val.order=='descending'?'2':"0"));
+          this.handleQuery();
+        }
+      },
+      //范围选择
+      topLeftClickType(type){
+        if(this.queryParams.manageStatus != type){
+          this.$set(this.queryParams,'manageStatus',type);
+          this.handleQuery();
+        }
+      },
+      //获取数据列表
+      getList(){
+        let obj = JSON.parse(JSON.stringify(this.queryParams))
+        obj.checkPlanId = this.propsListPageData.id;
+        if(this.dateRange[0]){
+          obj.startTime = this.dateRange[0];
+        }else{
+          obj.startTime = "";
+        }
+        if(this.dateRange[1]){
+          obj.endTime = this.dateRange[1];
+        }else{
+          obj.endTime = "";
+        }
+        findByCheckPlanId(obj).then(response => {
+          this.total = response.data.total;
+          this.tableList = response.data.records;
+        });
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.$set(this.queryParams,'pageNum',1);
+        this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.$set(this,'dateRange',[]);
+        this.$set(this,'queryParams',{
+          pageNum:1,
+          pageSize:20,
+          manageStatus:'-1',
+          checkTimeSort:0,
+          searchValue:"",
+          deptId:""
+        });
+        this.handleQuery();
+      },
+      //查看单个文档
+      lookDocumentButton(type,row){
+        if(type==1){
+          this.$set(this,'propsLookDocumentData',{
+            title:"整改报告",
+            type:1,
+            id:row.id,
+            name:row.title
+          });
+          this.$set(this,'lookDocumentType',true);
+        }else{
+          this.$set(this,'lookDocumentType',false);
+        }
+      },
+      //查看多个文档
+      lookDocumentListButton(type,row){
+        if(type==1){
+          getFindByCheckPlanId({checkPlanId:row.checkPlanId}).then(response => {
+            let list = [];
+            for(let i=0;i<response.data.length;i++){
+              let obj = {
+                name:response.data[i].fileName,
+                url:response.data[i].fileUrl,
+              }
+              list.push(obj);
+            }
+            this.$set(this,'propsLookDocumentListData',{
+              title:"查看附件",
+              list:list
+            });
+            this.$set(this,'lookDocumentListType',true);
+          });
+        }else{
+          this.$set(this,'lookDocumentListType',false);
+        }
+      },
+      //获取学院列表
+      listDepartments(){
+        listDepartments().then(response => {
+          this.deptSelectList = response.data;
+        });
+      },
+    },
+  }
+</script>
+
+<style scoped lang="scss">
+  ::v-deep .el-table__body-wrapper{
+    padding-bottom: 8px;
+  }
+  ::v-deep .el-table__fixed{
+    margin-top:-1px;
+    margin-left:-1px;
+    height:calc(100% - 8px)!important;
+  }
+  ::v-deep .el-table__fixed-body-wrapper{
+    height: calc(100% - 48px);
+    overflow-y: auto;
+  }
+  .selfInspectionManagement{
+    flex: 1;
+    display: flex !important;
+    flex-direction: column;
+    overflow: hidden;
+    .selfInspectionManagement-page{
+      flex: 1;
+      display: flex !important;
+      flex-direction: column;
+      overflow: hidden;
+      .title-box{
+        padding-top:20px;
+        border-bottom:1px solid #dedede;
+        .form-button-max-big-box{
+          display: inline-block;
+          .form-button-big-box{
+            display: flex;
+            div{
+              position: relative;
+              height:40px;
+              width:80px;
+              line-height: 40px;
+              text-align: center;
+              color:#999;
+              font-size:14px;
+              border:1px solid #999;
+              border-radius:4px;
+              margin-left:10px;
+              font-weight:500;
+              cursor: pointer;
+              .icon-p{
+                width:15px;
+                height:15px;
+                line-height:15px;
+                text-align: center;
+                position: absolute;
+                right:0;
+                bottom:0;
+                color:#fff;
+                background: #0183fa;
+                border-top-left-radius:4px;
+              }
+            }
+            .checkDiv{
+              color:#0183FA;
+              border:1px solid #0183FA;
+            }
+          }
+        }
+      }
+      .content-box{
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+        padding:20px;
+        overflow: hidden;
+        .manageStatus-color-1{
+          color:#0183FA;
+        }
+        .manageStatus-color-2{
+          color:#EE0606;
+        }
+        .manageStatus-color-3{
+          color:#23B303;
+        }
+      }
+    }
+  }
+</style>

src/views/safetyCheck/snapshotManagement/index.vue

@@ -0,0 +1,625 @@
+<template>
+  <div class="app-container snapshotManagement">
+    <div class="snapshotManagement-page" v-if="pageType == 1">
+      <div class="title-box">
+        <el-form :model="queryParams" class="form-box" ref="queryForm" :inline="true" label-width="70px">
+          <div class="form-button-max-big-box">
+            <div class="form-button-big-box" style="margin-left:10px;">
+              <p class="text-p" :class="queryParams.rectifyStatus==''?'checkDiv':''" @click="topLeftClickType('')">全部</p>
+              <p class="text-p" :class="queryParams.rectifyStatus=='0'?'checkDiv':''" @click="topLeftClickType('0')">待整改</p>
+              <p class="text-p" :class="queryParams.rectifyStatus=='1'?'checkDiv':''" @click="topLeftClickType('1')">已整改</p>
+              <p class="text-p" :class="queryParams.rectifyStatus=='2'?'checkDiv':''" @click="topLeftClickType('2')">暂无法整改</p>
+            </div>
+          </div>
+          <!--与我相关-->
+          <div class="form-button-max-big-box-me">
+            <div class="form-button-big-box-me">
+              <div :class="queryParams.myRelated==1?'checkDiv-me':''" @click="topRightClickType">
+                <p class="text-p-me">与我有关{{correlationNum}}</p>
+                <p class="el-icon-check icon-p-me" v-if="queryParams.myRelated==1"></p>
+              </div>
+            </div>
+          </div>
+          <el-form-item label="关键字" prop="searchValue">
+            <el-input
+              maxLength="30"
+              v-model="queryParams.searchValue"
+              placeholder="实验室/房间号/上报人"
+              clearable
+              style="width: 180px"/>
+          </el-form-item>
+          <el-form-item label="学院" prop="deptId" label-width="40px">
+            <el-select v-model="queryParams.deptId" clearable placeholder="学院" style="width: 130px">
+              <el-option
+                v-for="item in deptSelectList"
+                :key="item.deptId"
+                :label="item.deptName"
+                :value="item.deptId">
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="上报时间" prop="dateRange"  label-width="70px">
+            <el-date-picker
+              :clearable="false"
+              v-model="dateRange"
+              size="small"
+              style="width: 220px"
+              value-format="yyyy-MM-dd"
+              type="daterange"
+              range-separator="-"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+            ></el-date-picker>
+          </el-form-item>
+          <el-form-item>
+            <p class="inquire-button-one" @click="handleQuery" style="margin-right:10px;">查询</p>
+            <p class="reset-button-one" @click="resetQuery">重置</p>
+          </el-form-item>
+          <el-form-item style="float: right;" v-hasPermi="['safety:rectifyClap:add']">
+            <el-col :span="1.5">
+              <p class="inquire-button-one"
+                 style="width:70px;margin-right:0;"
+                 @click="addButton"
+              >随手拍</p>
+            </el-col>
+          </el-form-item>
+          <el-form-item style="float: right;">
+            <el-col :span="1.5">
+              <p class="add-button-one-90"
+                 style="width:80px;"
+                 @click="goPage(2)"
+              >上报记录</p>
+            </el-col>
+          </el-form-item>
+        </el-form>
+      </div>
+      <div class="content-box">
+        <el-table  border :data="tableList" ref="multipleTable" @sort-change="sortChange">
+          <el-table-column label="序号" align="center"  type="index" width="60" />
+          <el-table-column label="学院" align="center" prop="deptName" show-overflow-tooltip/>
+          <el-table-column label="实验室" align="center" prop="subName" show-overflow-tooltip width="220">
+            <template slot-scope="scope">{{scope.row.roomNum?scope.row.subName+'-'+scope.row.roomNum:scope.row.subName}}</template>
+          </el-table-column>
+          <el-table-column label="安全责任人" align="center" prop="safetyPeople" show-overflow-tooltip width="120"/>
+          <el-table-column label="上报人" align="center" prop="createName" show-overflow-tooltip width="90"/>
+          <el-table-column label="上报时间" sortable="custom" align="center" prop="createTime" show-overflow-tooltip width="157"/>
+          <el-table-column label="隐患描述" align="center" prop="hazardDescribe" show-overflow-tooltip width="280"/>
+          <el-table-column label="整改人" align="center" prop="rectifyPeople" show-overflow-tooltip width="100"/>
+          <el-table-column label="整改时间" sortable="custom" align="center" prop="rectifyTime" show-overflow-tooltip width="157"/>
+          <el-table-column label="整改状态" align="center" prop="rectifyStatus" show-overflow-tooltip width="120">
+            <template slot-scope="scope">
+              {{scope.row.rectifyStatus==0?'待整改':(scope.row.rectifyStatus==1?'已整改':(scope.row.rectifyStatus==2?'暂无法整改':''))}}
+            </template>
+          </el-table-column>
+          <el-table-column label="操作" align="center" prop="deptName" width="70">
+            <template slot-scope="scope">
+              <div class="table-button-box">
+                <p class="table-button-null"></p>
+                <p class="table-button-p" @click="goPage(3,scope.row)" v-hasPermi="['safety:rectifyClap:query']">详情</p>
+                <p class="table-button-null"></p>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+        <pagination :page-sizes="[20, 30, 40, 50]"
+                    v-show="total>0"
+                    :total="total"
+                    :page.sync="queryParams.pageNum"
+                    :limit.sync="queryParams.pageSize"
+                    @pagination="getList"/>
+      </div>
+    </div>
+    <listPage v-if="pageType == 2"></listPage>
+    <infoPage v-if="pageType == 3" :infoPropsData="infoPropsData"></infoPage>
+    <el-dialog class="safetyHazard-info-dialog-box" @close="outDialog"
+               :close-on-click-modal="false"
+               v-loading="loading"
+               title="随手拍上报" :visible.sync="addDialogType" v-if="addDialogType"
+               width="787px" append-to-body>
+      <div>
+        <el-form  ref="addDialogForm" :model="addDialogForm" :rules="rules" label-width="140px">
+          <el-form-item label="学院：" prop="deptId">
+            <el-select v-model="addDialogForm.deptId" @change="dialogDeptChange" placeholder="请选择学院" style="width:548px;">
+              <el-option
+                v-for="item in deptSelectList"
+                :key="item.deptId"
+                :label="item.deptName"
+                :value="item.deptId">
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="实验室：" prop="subId">
+            <el-select
+              style="width:548px;"
+              v-model="addDialogForm.subId"
+              filterable
+              remote
+              reserve-keyword
+              placeholder="搜索选择实验室"
+              @change="dialogSubChange"
+              :remote-method="getSelectList"
+              :loading="dialogLoading">
+              <el-option
+                v-for="item in dialogSubList"
+                :key="item.id"
+                :label="item.name"
+                :value="item.id">
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="隐患描述：" prop="hazardDescribe">
+            <el-input
+              type="textarea"
+              :autosize="{ minRows: 4, maxRows: 4}"
+              placeholder="请输入隐患描述"
+              v-model="addDialogForm.hazardDescribe"
+              maxlength="100"
+              resize="none"
+              show-word-limit
+              style="width:548px;">
+            </el-input>
+          </el-form-item>
+          <el-form-item label="隐患照片:" prop="imgDtoList">
+            <div class="snapshotManagement-for-img-box" v-for="(img,imgIndex) in addDialogForm.imgDtoList" :key="imgIndex">
+              <img class="for-img" :src="img.fileUrl">
+              <p class="for-del-button el-icon-circle-close" @click="delImg(imgIndex)"></p>
+            </div>
+            <el-upload
+              v-if="addDialogForm.imgDtoList.length<5"
+              style="display: inline-block;overflow: hidden"
+              class="avatar-uploader"
+              :action="uploadImgUrl"
+              :show-file-list="false"
+              :on-success="(res)=>handleAvatarSuccess(res)"
+              :headers="headers"
+              :before-upload="(res)=>beforeAvatarUpload(res)">
+              <p class="el-icon-plus up-img-p" style="display: inline-block"></p>
+            </el-upload>
+            <p class="dialog-material-text">支持jpg/png/bmp/gif格式，最多上传5张</p>
+          </el-form-item>
+        </el-form>
+      </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="outDialog">取消</p>
+        <p class="dialog-footer-button-primary" @click="upDialogButton">确定</p>
+        <p class="dialog-footer-button-null"></p>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+  import { securityCheckClapList,checkClapAdd } from '@/apiDemo/safetyCheck/index'
+  import { getSubjectDictByViolation } from "@/apiDemo/laboratory/violation";
+  import { listDepartments } from "@/apiDemo/system/dept";
+  import listPage from './listPage.vue'
+  import infoPage from './infoPage.vue'
+  import { getToken } from "@/utils/auth";
+  export default {
+    name: 'index',
+    components: {
+      listPage,
+      infoPage
+    },
+    data(){
+      return{
+        loading:false,
+        uploadImgUrl: this.uploadUrl(), // 上传的图片服务器地址
+        headers: {
+          Authorization: "Bearer " + getToken(),
+        },
+        pageType:1,
+        deptSelectList:[],
+        queryParams:{
+          pageNum:1,
+          pageSize:20,
+          deptId:'',
+          searchValue:'',
+          rectifyStatus:'',
+          upTimeOrder:"",
+          zgTimeOrder:"",
+          myRelated:1,
+        },
+        dateRange:[],
+        tableList:[],
+        total:0,
+        correlationNum:'',
+        //新增窗口
+        addDialogType:false,
+        addDialogForm:{
+          deptId:"",
+          deptName:"",
+          subId:"",
+          subName:"",
+          hazardDescribe:"",
+          imgDtoList:[],
+        },
+        rules:{
+          deptId: [
+            { required: true, message: "请选择学院", trigger: "change" },
+          ],
+          subId: [
+            { required: true, message: "请选择实验室", trigger: "change" },
+          ],
+          imgDtoList: [
+            { required: true, message: "请上传隐患照片", trigger: "change" },
+          ],
+        },
+        dialogDeptOptions:[],
+        dialogLoading:false,
+        dialogSubList:[],
+        dialogSubListData:[],
+        suffixName:"",
+        //详情
+        infoPropsData:{}
+      }
+    },
+    created(){
+
+    },
+    mounted(){
+      this.listDepartments();
+      this.getList();
+    },
+    methods:{
+      //获取相关数量
+      getCorrelationNum(){
+        securityCheckClapList({
+          pageNum:1,
+          pageSize:20,
+          upTimeOrder:"",
+          zgTimeOrder:"",
+          myRelated:1,
+          deptId:this.queryParams.deptId,
+          searchValue:this.queryParams.searchValue,
+          rectifyStatus:this.queryParams.rectifyStatus,
+          beginTime:this.dateRange[0]?this.dateRange[0]:'',
+          endTime:this.dateRange[1]?this.dateRange[1]:'',
+        }).then(response => {
+          this.$set(this,'correlationNum',response.data.total>999?' 999+':(response.data.total<1?'':' '+response.data.total));
+        });
+      },
+      //与我相关按钮
+      topRightClickType(){
+        this.$set(this.queryParams,'myRelated',this.queryParams.myRelated==1?0:1);
+        this.handleQuery();
+      },
+      goPage(type,data){
+        if(this.pageType != type){
+          if (type==1){
+            this.$set(this,'pageType',type);
+          } else if(type==2){
+            this.$set(this,'pageType',type);
+          } else if(type==3){
+            this.$set(this,'infoPropsData',data);
+            this.$set(this,'pageType',type);
+          } else if(type==4){
+            this.$set(this,'pageType',1);
+            this.getList();
+          }
+        }
+      },
+      //范围选择
+      topLeftClickType(type){
+        if(this.queryParams.rectifyStatus !== type){
+          this.$set(this.queryParams,'rectifyStatus',type);
+          this.handleQuery();
+        }
+      },
+      //时间排序方法
+      sortChange(val){
+        if(val.prop == 'rectifyTime'){
+          this.$set(this.queryParams,'zgTimeOrder',val.order=='ascending'?'1':(val.order=='descending'?'2':''));
+          this.$set(this.queryParams,'upTimeOrder','');
+          this.handleQuery();
+        }else if(val.prop == 'createTime'){
+          this.$set(this.queryParams,'upTimeOrder',val.order=='ascending'?'1':(val.order=='descending'?'2':''));
+          this.$set(this.queryParams,'zgTimeOrder','');
+          this.handleQuery();
+        }
+      },
+      //获取数据列表
+      getList(){
+        let obj = JSON.parse(JSON.stringify(this.queryParams))
+        if(this.dateRange[0]){
+          obj.beginTime = this.dateRange[0]
+        }else{
+          obj.beginTime = ""
+        }
+        if(this.dateRange[1]){
+          obj.endTime = this.dateRange[1]
+        }else{
+          obj.endTime = ""
+        }
+        let self = this;
+        setTimeout(function(){
+          self.getCorrelationNum();
+        },500);
+        securityCheckClapList(obj).then(response => {
+          this.total = response.data.total;
+          this.tableList = response.data.records;
+        });
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.$set(this.queryParams,'pageNum',1);
+        this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.$set(this,'dateRange',[]);
+        this.$set(this,'queryParams',{
+          pageNum:1,
+          pageSize:20,
+          deptId:'',
+          searchValue:'',
+          rectifyStatus:'',
+          upTimeOrder:"",
+          zgTimeOrder:"",
+          myRelated:1,
+        });
+        this.handleQuery();
+      },
+      /*==========上传相关==========*/
+      handleAvatarSuccess(res) {
+        this.$set(this,'loading',false);
+        if(this.addDialogForm.imgDtoList.length>4){
+          this.msgError('最多只可上传5张')
+          return
+        }
+        let suffixName= this.upDataName.split('.')[this.upDataName.split('.').length - 2]
+        //判断文件名中是否有逗号和分号
+        if(suffixName.indexOf(',')==-1 && suffixName.indexOf(';')==-1){
+        }else{
+          this.msgError('文件名里包含逗号或分号，请修改后重新上传！')
+          return
+        }
+        let obj ={
+          fileName:this.upDataName,
+          fileUrl:res.data.url,
+        };
+        this.addDialogForm.imgDtoList.push(obj);
+        this.$forceUpdate()
+      },
+      beforeAvatarUpload(file) {
+        if(this.addDialogForm.imgDtoList.length>4){
+          this.msgError('最多只可上传5张')
+          return false
+        }
+        let type = false;
+        if (file.type == 'image/png' || file.type == 'image/jpeg' || file.type == 'image/gif' || file.type == 'image/bmp') {
+          if(file.size> 2100000){
+            this.msgError('上传图片大小不能超过2M')
+            return false
+          }
+          this.$set(this,'loading',true);
+          this.upDataName = file.name;
+          type = true;
+        }else{
+          this.msgError('仅支持jpg/png/bmp/gif格式')
+          type = false;
+        }
+        return type;
+      },
+      //删除照片
+      delImg(imgIndex){
+        this.addDialogForm.imgDtoList.splice(imgIndex,1);
+      },
+      /**************** 新增窗口 ******************/
+      //提交
+      upDialogButton(){
+        this.$refs["addDialogForm"].validate(valid => {
+          if (valid) {
+            checkClapAdd(this.addDialogForm).then(response => {
+              this.msgSuccess(response.msg);
+              this.outDialog();
+              this.getList();
+            });
+          }
+        })
+      },
+      addButton(){
+        this.$set(this,'addDialogForm',{
+          deptId:"",
+          deptName:"",
+          subId:"",
+          subName:"",
+          hazardDescribe:"",
+          imgDtoList:[],
+        });
+        this.$set(this,'addDialogType',true);
+      },
+      outDialog(){
+        this.$set(this,'addDialogType',false);
+      },
+      //选中院系
+      dialogDeptChange(val){
+        let self = this;
+        let obj = {
+          deptId:val,
+        }
+        getSubjectDictByViolation(obj).then(response => {
+          this.$set(this,'dialogSubListData',response.data);
+          this.$set(this,'dialogSubList',response.data);
+          for(let i=0;i<self.deptSelectList.length;i++){
+            if(val == self.deptSelectList[i].deptId){
+              self.$set(self.addDialogForm,'deptName',self.deptSelectList[i].deptName);
+            }
+          }
+          this.$set(this.addDialogForm,'subId','');
+          this.$set(this.addDialogForm,'subName','');
+        });
+      },
+      //实验室选中
+      dialogSubChange(val){
+        let self = this;
+        for(let i=0;i<self.dialogSubList.length;i++){
+          if(val == self.dialogSubList[i].id){
+            self.$set(self.addDialogForm,'subName',self.dialogSubList[i].name);
+          }
+        }
+      },
+      /** 实验室-本地懒加载 */
+      getSelectList(val) {
+        let self = this;
+        let list = [];
+        for(let i=0;i<self.dialogSubListData.length;i++){
+          if(self.dialogSubListData[i].name.indexOf(val) != -1){
+            list.push(self.dialogSubListData[i]);
+          }
+        }
+        this.dialogSubList = JSON.parse(JSON.stringify(list))
+      },
+      //获取学院列表
+      listDepartments(){
+        listDepartments().then(response => {
+          this.deptSelectList = response.data;
+        });
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .snapshotManagement{
+    flex: 1;
+    display: flex !important;
+    flex-direction: column;
+    overflow: hidden;
+    .snapshotManagement-page{
+      flex: 1;
+      display: flex !important;
+      flex-direction: column;
+      overflow: hidden;
+      .title-box{
+        padding-top:20px;
+        border-bottom:1px solid #dedede;
+        .form-button-max-big-box{
+          display: inline-block;
+          margin-left:10px;
+          .form-button-big-box{
+            display: flex;
+            p:nth-child(1){
+              border-top-left-radius: 4px;
+              border-bottom-left-radius: 4px;
+              border-top:1px solid #E0E0E0;
+              border-bottom:1px solid #E0E0E0;
+            }
+            p:nth-child(2){
+              border-top:1px solid #E0E0E0;
+              border-bottom:1px solid #E0E0E0;
+            }
+            p:nth-child(3){
+              border-top:1px solid #E0E0E0;
+              border-bottom:1px solid #E0E0E0;
+            }
+            p:nth-child(4){
+              border-top-right-radius: 4px;
+              border-bottom-right-radius: 4px;
+              border-top:1px solid #E0E0E0;
+              border-bottom:1px solid #E0E0E0;
+              border-right:1px solid #E0E0E0;
+            }
+            p{
+              height:40px;
+              width:80px;
+              line-height: 40px;
+              text-align: center;
+              color:#666666;
+              font-size:14px;
+              font-weight:500;
+              cursor: pointer;
+              border-left:1px solid #E0E0E0;
+            }
+            .checkDiv{
+              color:#fff!important;
+              border:1px solid #0183FA!important;
+              background-color: #0183FA;
+            }
+          }
+        }
+        .form-button-max-big-box-me{
+          margin-left:10px;
+          display: inline-block;
+          .form-button-big-box-me{
+            display: flex;
+            div{
+              position: relative;
+              height:40px;
+              width:130px;
+              line-height: 40px;
+              text-align: center;
+              color:#999;
+              font-size:14px;
+              border:1px solid #999;
+              border-radius:4px;
+              font-weight:500;
+              cursor: pointer;
+              .icon-p-me{
+                width:15px;
+                height:15px;
+                line-height:15px;
+                text-align: center;
+                position: absolute;
+                right:0;
+                bottom:0;
+                color:#fff;
+                background: #0183fa;
+                border-top-left-radius:4px;
+              }
+            }
+            .checkDiv-me{
+              color:#0183FA!important;
+              border:1px solid #0183FA!important;
+            }
+          }
+        }
+      }
+      .content-box{
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+        padding:20px;
+        overflow: hidden;
+      }
+    }
+  }
+  ::v-deep .snapshotManagement-for-img-box{
+    width:80px;
+    height:80px;
+    border-radius:4px;
+    display: inline-block;
+    overflow: hidden;
+    margin-right:20px;
+    position: relative;
+    .for-img{
+      width:80px;
+      height:80px;
+      display: inline-block;
+      overflow: hidden;
+    }
+    .for-del-button{
+      background: rgba(0,0,0,0.7);
+      width:20px;
+      height:20px;
+      line-height: 20px;
+      text-align: center;
+      color:#fff;
+      border-bottom-left-radius:4px;
+      cursor: pointer;
+      position: absolute;
+      top:0;
+      right:0;
+    }
+  }
+  ::v-deep .up-img-p{
+    height:80px;
+    width:80px;
+    line-height:80px;
+    text-align: center;
+    font-size:16px;
+    border-radius:4px;
+    border:1px dashed #E0E0E0;
+  }
+</style>

src/views/safetyCheck/snapshotManagement/infoPage.vue

@@ -0,0 +1,512 @@
+<template>
+  <div class="snapshotManagement-infoPage" v-loading.fullscreen.lock="loading">
+    <div class="title-box">
+      <p>随手拍详情</p>
+      <p class="add-button-one-90" @click="outButton" style="width:100px;margin-right:10px;">返回</p>
+    </div>
+    <div class="content-box scrollbar-box">
+      <div class="info-box">
+        <div class="info-box-text">
+          <p>学院</p>
+          <p>{{infoData.deptName}}</p>
+        </div>
+        <div class="info-box-text">
+          <p>实验室</p>
+          <p>{{infoData.subName}}</p>
+        </div>
+        <div class="info-box-text">
+          <p>隐患描述</p>
+          <p>{{infoData.hazardDescribe}}</p>
+        </div>
+        <div class="info-box-img">
+          <p>隐患照片</p>
+          <div>
+            <img :src="imgItem.fileUrl" @click="lookImg(infoData.yhDtoList,index)"
+                 v-for="(imgItem,index) in infoData.yhDtoList" :key="index">
+          </div>
+        </div>
+        <div class="info-box-text-two">
+          <div class="left-box">
+            <p>上报人</p>
+            <p>{{infoData.createName}}</p>
+          </div>
+          <div class="right-box">
+            <p>上报时间</p>
+            <p>{{infoData.createTime}}</p>
+          </div>
+        </div>
+      </div>
+      <div class="type-box" v-if="infoData.rectifyStatus == 1 || infoData.rectifyStatus == 2">
+        <div class="info-box-type">
+          <p>整改结果</p>
+          <p>{{infoData.rectifyStatus == 1?'已整改':(infoData.rectifyStatus == 2?'暂无法整改':'')}}</p>
+        </div>
+        <div class="info-box-text">
+          <p>{{infoData.rectifyStatus == 1?'整改措施':(infoData.rectifyStatus == 2?'原因描述':'')}}</p>
+          <p>{{infoData.rectifyDescribe}}</p>
+        </div>
+        <div class="info-box-img">
+          <p>上传照片</p>
+          <div>
+            <img :src="imgItem.fileUrl" @click="lookImg(infoData.zgDtoList,index)"
+                 v-for="(imgItem,index) in infoData.zgDtoList" :key="index">
+            <p v-if="!infoData.zgDtoList[0]" style="font-size:14px;color:#999;">未上传照片</p>
+          </div>
+        </div>
+        <div class="info-box-text-two">
+          <div class="left-box">
+            <p>整改人</p>
+            <p>{{infoData.rectifyPeople}}</p>
+          </div>
+          <div class="right-box">
+            <p>整改时间</p>
+            <p>{{infoData.rectifyTime}}</p>
+          </div>
+        </div>
+      </div>
+      <div class="up-data-box" v-if="infoData.rectifyStatus == 0 && infoData.rectifyGentle">
+        <el-form ref="addDialogForm" :model="upFormData" :rules="rules" label-width="140px">
+          <el-form-item label="整改结果：" prop="rectifyStatus">
+            <el-radio-group v-model="upFormData.rectifyStatus" style="margin-top:5px;">
+              <el-radio :label="1">已整改</el-radio>
+              <el-radio :label="2">暂无法整改</el-radio>
+            </el-radio-group>
+          </el-form-item>
+          <el-form-item :label="upFormData.rectifyStatus==1?'整改措施：':(upFormData.rectifyStatus==2?'原因描述：':'')" prop="rectifyDescribe">
+            <el-input
+              type="textarea"
+              :autosize="{ minRows: 4, maxRows: 4}"
+              :placeholder="upFormData.rectifyStatus==1?'请输入整改措施':(upFormData.rectifyStatus==2?'请输入原因描述':'')"
+              v-model="upFormData.rectifyDescribe"
+              maxlength="100"
+              resize="none"
+              show-word-limit
+              style="width:548px;">
+            </el-input>
+          </el-form-item>
+          <el-form-item label="上传照片:" prop="imgDtoList">
+            <div class="snapshotManagement-for-img-box" v-for="(img,imgIndex) in upFormData.imgDtoList" :key="imgIndex">
+              <img class="for-img" :src="img.fileUrl">
+              <p class="for-del-button el-icon-circle-close" @click="delImg(imgIndex)"></p>
+            </div>
+            <el-upload
+              v-if="upFormData.imgDtoList.length<5"
+              style="display: inline-block;overflow: hidden"
+              class="avatar-uploader"
+              :action="uploadImgUrl"
+              :show-file-list="false"
+              :on-success="(res)=>handleAvatarSuccess(res)"
+              :headers="headers"
+              :before-upload="(res)=>beforeAvatarUpload(res)">
+              <p class="el-icon-plus up-img-p" style="display: inline-block"></p>
+            </el-upload>
+            <p class="dialog-material-text">支持jpg/png/bmp/gif格式，最多上传5张</p>
+          </el-form-item>
+        </el-form>
+      </div>
+    </div>
+    <div class="button-box dialog-footer-box" v-if="infoData.rectifyStatus == 0 && infoData.rectifyGentle">
+      <p class="dialog-footer-button-null"></p>
+      <p class="dialog-footer-button-info" @click="outButton">取消</p>
+      <p class="dialog-footer-button-primary" @click="upDataButton">确定</p>
+      <p class="dialog-footer-button-null"></p>
+    </div>
+    <lookImgDialog ref="lookImgDialog"></lookImgDialog>
+  </div>
+</template>
+
+<script>
+  import { findById,clapApprove } from '@/apiDemo/safetyCheck/index'
+  import lookImgDialog from '@/components/lookImgDialog/lookImgDialog.vue'
+  import { getToken } from "@/utils/auth";
+  export default {
+    name: 'infoPage',
+    props:{
+      infoPropsData:{},
+    },
+    components: {
+      lookImgDialog
+    },
+    data(){
+      return{
+        loading:false,
+        uploadImgUrl: this.uploadUrl(), // 上传的图片服务器地址
+        headers: {
+          Authorization: "Bearer " + getToken(),
+        },
+        infoData:{},
+        upFormData:{
+          rectifyStatus:1,
+          rectifyDescribe:"",
+          imgDtoList:[],
+        },
+        upDataName:"",
+        rules:{
+          rectifyStatus: [
+            { required: true, message: "请选择整改结果", trigger: "change" },
+          ],
+        }
+      }
+    },
+    created(){
+      this.findById();
+    },
+    mounted(){
+
+    },
+    methods:{
+      //提交整改
+      upDataButton(){
+        let self = this;
+        this.$refs["addDialogForm"].validate(valid => {
+          if (valid) {
+            this.$confirm('确定提交?', "警告", {
+              confirmButtonText: "确定",
+              cancelButtonText: "取消",
+              type: "warning"
+            }).then(function() {
+              let obj = JSON.parse(JSON.stringify(self.upFormData))
+              obj.id = self.infoPropsData.id;
+              clapApprove(obj).then(response => {
+                self.msgSuccess(response.msg)
+                self.$parent.goPage(4);
+              })
+            }).then(() => {
+            }).catch(() => {});
+          }
+        })
+      },
+      //查询详情
+      findById(){
+        findById({id:this.infoPropsData.id}).then(response => {
+          this.$set(this,'infoData',response.data);
+        })
+      },
+      outButton(){
+        this.$parent.goPage(1);
+      },
+      lookImg(list,index){
+        for(let i=0;i<list.length;i++){
+          list[i].name = list[i].fileName;
+          list[i].url = list[i].fileUrl;
+        }
+        this.$refs.lookImgDialog.lookImgDialogOpen(1,list,index);
+      },
+      /*==========上传相关==========*/
+      handleAvatarSuccess(res) {
+        this.$set(this,'loading',false);
+        if(this.upFormData.imgDtoList.length>4){
+          this.msgError('最多只可上传5张')
+          return
+        }
+        let suffixName= this.upDataName.split('.')[this.upDataName.split('.').length - 2]
+        //判断文件名中是否有逗号和分号
+        if(suffixName.indexOf(',')==-1 && suffixName.indexOf(';')==-1){
+        }else{
+          this.msgError('文件名里包含逗号或分号，请修改后重新上传！')
+          return
+        }
+        let obj ={
+          fileName:this.upDataName,
+          fileUrl:res.data.url,
+        };
+        this.upFormData.imgDtoList.push(obj);
+        this.$forceUpdate()
+      },
+      beforeAvatarUpload(file) {
+        if(this.upFormData.imgDtoList.length>4){
+          this.msgError('最多只可上传5张')
+          return false
+        }
+        let type = false;
+        if (file.type == 'image/png' || file.type == 'image/jpeg' || file.type == 'image/gif' || file.type == 'image/bmp') {
+          if(file.size> 2100000){
+            this.msgError('上传图片大小不能超过2M')
+            return false
+          }
+          this.$set(this,'loading',true);
+          this.upDataName = file.name;
+          type = true;
+        }else{
+          this.msgError('仅支持jpg/png/bmp/gif格式')
+          type = false;
+        }
+        return type;
+      },
+      //删除照片
+      delImg(imgIndex){
+        this.upFormData.imgDtoList.splice(imgIndex,1);
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .snapshotManagement-infoPage{
+    flex: 1;
+    display: flex !important;
+    flex-direction: column;
+    overflow: hidden;
+    *{
+      font-weight:500;
+    }
+    .title-box{
+      border-bottom:1px solid #dedede;
+      display: flex;
+      p:nth-child(1){
+        line-height:80px;
+        margin-left:30px;
+        flex:1;
+        color:#0045AF;
+      }
+      p:nth-child(2){
+        width:70px;
+        height:40px;
+        line-height:40px;
+        margin:20px 30px;
+      }
+    }
+    .content-box{
+      flex:1;
+      .info-box{
+        margin:0 32px;
+        padding:40px 50px;
+        .info-box-text{
+          display: flex;
+          margin-bottom:20px;
+          p:nth-child(1){
+            width:70px;
+            font-size:16px;
+            color:#333;
+            margin-right:30px;
+            line-height:40px;
+            text-align: right;
+          }
+          p:nth-child(2){
+            padding:12px 20px;
+            background-color: #F5F5F5;
+            width:953px;
+            border-radius:4px;
+            font-size:14px;
+            color:#333;
+          }
+        }
+        .info-box-img{
+          display: flex;
+          margin-bottom:20px;
+          p:nth-child(1){
+            width:70px;
+            font-size:16px;
+            color:#333;
+            margin-right:30px;
+            line-height:40px;
+            text-align: right;
+          }
+          div{
+            img{
+              width:80px;
+              height:80px;
+              border-radius:4px;
+              margin-right:10px;
+              cursor: pointer;
+            }
+          }
+        }
+        .info-box-text-two{
+          display: flex;
+          .left-box{
+            display: flex;
+            p:nth-child(1){
+              width:70px;
+              font-size:16px;
+              color:#333;
+              margin-right:30px;
+              line-height:40px;
+              text-align: right;
+            }
+            p:nth-child(2){
+              padding:12px 20px;
+              background-color: #F5F5F5;
+              width:425px;
+              border-radius:4px;
+              font-size:14px;
+              color:#333;
+            }
+          }
+          .right-box{
+            display: flex;
+            p:nth-child(1){
+              width:90px;
+              font-size:16px;
+              color:#333;
+              margin-right:13px;
+              line-height:40px;
+              text-align: right;
+            }
+            p:nth-child(2){
+              padding:12px 20px;
+              background-color: #F5F5F5;
+              width:425px;
+              border-radius:4px;
+              font-size:14px;
+              color:#333;
+            }
+          }
+        }
+      }
+      .type-box{
+        margin:0 32px;
+        padding:40px 50px;
+        border-top: 1px dashed #D8D8D8;
+        .info-box-type{
+          display: flex;
+          margin-bottom:20px;
+          p:nth-child(1){
+            width:70px;
+            font-size:16px;
+            color:#333;
+            margin-right:30px;
+            line-height:40px;
+            text-align: right;
+          }
+          p:nth-child(2){
+            padding:12px 20px;
+            font-size:14px;
+            color:#0183FA;
+          }
+        }
+        .info-box-text{
+          display: flex;
+          margin-bottom:20px;
+          p:nth-child(1){
+            width:70px;
+            font-size:16px;
+            color:#333;
+            margin-right:30px;
+            line-height:40px;
+            text-align: right;
+          }
+          p:nth-child(2){
+            padding:12px 20px;
+            background-color: #F5F5F5;
+            width:953px;
+            border-radius:4px;
+            font-size:14px;
+            color:#333;
+          }
+        }
+        .info-box-img{
+          display: flex;
+          margin-bottom:20px;
+          p:nth-child(1){
+            width:70px;
+            font-size:16px;
+            color:#333;
+            margin-right:30px;
+            line-height:40px;
+            text-align: right;
+          }
+          div{
+            img{
+              width:80px;
+              height:80px;
+              border-radius:4px;
+              margin-right:10px;
+              cursor: pointer;
+            }
+          }
+        }
+        .info-box-text-two{
+          display: flex;
+          .left-box{
+            display: flex;
+            p:nth-child(1){
+              width:70px;
+              font-size:16px;
+              color:#333;
+              margin-right:30px;
+              line-height:40px;
+              text-align: right;
+            }
+            p:nth-child(2){
+              padding:12px 20px;
+              background-color: #F5F5F5;
+              width:425px;
+              border-radius:4px;
+              font-size:14px;
+              color:#333;
+            }
+          }
+          .right-box{
+            display: flex;
+            p:nth-child(1){
+              width:90px;
+              font-size:16px;
+              color:#333;
+              margin-right:13px;
+              line-height:40px;
+              text-align: right;
+            }
+            p:nth-child(2){
+              padding:12px 20px;
+              background-color: #F5F5F5;
+              width:425px;
+              border-radius:4px;
+              font-size:14px;
+              color:#333;
+            }
+          }
+        }
+      }
+      .up-data-box{
+        margin:0 32px;
+        padding:40px 50px;
+        border-top: 1px dashed #D8D8D8;
+      }
+    }
+    .up-data-box{
+
+      .snapshotManagement-for-img-box{
+        width:80px;
+        height:80px;
+        border-radius:4px;
+        display: inline-block;
+        overflow: hidden;
+        margin-right:20px;
+        position: relative;
+        .for-img{
+          width:80px;
+          height:80px;
+          display: inline-block;
+          overflow: hidden;
+        }
+        .for-del-button{
+          background: rgba(0,0,0,0.7);
+          width:20px;
+          height:20px;
+          line-height: 20px;
+          text-align: center;
+          color:#fff;
+          border-bottom-left-radius:4px;
+          cursor: pointer;
+          position: absolute;
+          top:0;
+          right:0;
+        }
+      }
+      .up-img-p{
+        height:80px;
+        width:80px;
+        line-height:80px;
+        text-align: center;
+        font-size:16px;
+        border-radius:4px;
+        border:1px dashed #E0E0E0;
+      }
+    }
+    .button-box{
+      padding:20px;
+      display: flex;
+    }
+  }
+</style>

src/views/safetyCheck/snapshotManagement/listPage.vue

@@ -0,0 +1,296 @@
+<template>
+  <div class="snapshotManagement-listPage">
+    <div class="snapshotManagement-listPage-min" v-if="infoPageType == 1">
+      <div class="title-box">
+        <el-form :model="queryParams" class="form-box" ref="queryForm" :inline="true" label-width="80px">
+          <div class="form-button-max-big-box">
+            <div class="form-button-big-box" style="margin-left:10px;">
+              <div :class="queryParams.rectifyStatus===''?'checkDiv':''" @click="topLeftClickType('')">
+                <p class="text-p">全部</p>
+                <p class="el-icon-check icon-p" v-if="queryParams.rectifyStatus===''"></p>
+              </div>
+              <div :class="queryParams.rectifyStatus===0?'checkDiv':''" @click="topLeftClickType(0)">
+                <p class="text-p">待整改</p>
+                <p class="el-icon-check icon-p" v-if="queryParams.rectifyStatus===0"></p>
+              </div>
+              <div :class="queryParams.rectifyStatus===1?'checkDiv':''" @click="topLeftClickType(1)">
+                <p class="text-p">已整改</p>
+                <p class="el-icon-check icon-p" v-if="queryParams.rectifyStatus===1"></p>
+              </div>
+              <div :class="queryParams.rectifyStatus===2?'checkDiv':''" @click="topLeftClickType(2)">
+                <p class="text-p">暂无法整改</p>
+                <p class="el-icon-check icon-p" v-if="queryParams.rectifyStatus===2"></p>
+              </div>
+            </div>
+          </div>
+          <el-form-item label="关键字" prop="searchValue">
+            <el-input
+              maxLength="30"
+              v-model="queryParams.searchValue"
+              placeholder="实验室/房间号/上报人"
+              clearable
+              style="width: 180px"
+            />
+          </el-form-item>
+          <el-form-item label="学院" prop="deptId" label-width="50px">
+            <el-select v-model="queryParams.deptId" clearable placeholder="学院" style="width: 150px">
+              <el-option
+                v-for="item in deptSelectList"
+                :key="item.deptId"
+                :label="item.deptName"
+                :value="item.deptId">
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="上报时间" prop="dateRange" style="margin-left:10px;" label-width="70px">
+            <el-date-picker
+              :clearable="false"
+              v-model="dateRange"
+              size="small"
+              style="width: 220px"
+              value-format="yyyy-MM-dd"
+              type="daterange"
+              range-separator="-"
+              start-placeholder="开始日期"
+              end-placeholder="结束日期"
+            ></el-date-picker>
+          </el-form-item>
+          <el-form-item>
+            <p class="inquire-button-one" @click="handleQuery" style="margin-right:10px;">查询</p>
+            <p class="reset-button-one" @click="resetQuery">重置</p>
+          </el-form-item>
+          <el-form-item style="float: right;">
+            <el-col :span="1.5">
+              <p class="add-button-one-90"
+                 style="width:100px;font-weight:500;"
+                 @click="outButton"
+              >返回</p>
+            </el-col>
+          </el-form-item>
+        </el-form>
+      </div>
+      <div class="content-box">
+        <el-table  border :data="tableList" ref="multipleTable" @sort-change="sortChange">
+          <el-table-column label="序号" align="center"  type="index" width="60" />
+          <el-table-column label="学院" align="center" prop="deptName" show-overflow-tooltip/>
+          <el-table-column label="实验室" align="center" prop="subName" show-overflow-tooltip width="220">
+            <template slot-scope="scope">{{scope.row.roomNum?scope.row.subName+'-'+scope.row.roomNum:scope.row.subName}}</template>
+          </el-table-column>
+          <el-table-column label="安全责任人" align="center" prop="safetyPeople" show-overflow-tooltip width="120"/>
+          <el-table-column label="上报人" align="center" prop="createName" show-overflow-tooltip width="90"/>
+          <el-table-column label="上报时间" sortable="custom" align="center" prop="createTime" show-overflow-tooltip width="157"/>
+          <el-table-column label="隐患描述" align="center" prop="hazardDescribe" show-overflow-tooltip width="280"/>
+          <el-table-column label="整改人" align="center" prop="rectifyPeople" show-overflow-tooltip width="100"/>
+          <el-table-column label="整改时间" sortable="custom" align="center" prop="rectifyTime" show-overflow-tooltip width="157"/>
+          <el-table-column label="整改状态" align="center" prop="rectifyStatus" show-overflow-tooltip width="120">
+            <template slot-scope="scope">
+              {{scope.row.rectifyStatus==0?'待整改':(scope.row.rectifyStatus==1?'已整改':(scope.row.rectifyStatus==2?'暂无法整改':''))}}
+            </template>
+          </el-table-column>
+          <el-table-column label="操作" align="center" prop="deptName" width="70">
+            <template slot-scope="scope">
+              <div class="table-button-box">
+                <p class="table-button-null"></p>
+                <p class="table-button-p" @click="goPage(3,scope.row)" v-hasPermi="['safety:rectifyClap:query']">详情</p>
+                <p class="table-button-null"></p>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+        <pagination :page-sizes="[20, 30, 40, 50]"
+                    v-show="total>0"
+                    :total="total"
+                    :page.sync="queryParams.pageNum"
+                    :limit.sync="queryParams.pageSize"
+                    @pagination="getList"
+        />
+      </div>
+    </div>
+    <infoPage v-if="infoPageType == 3" :infoPropsData="infoPropsData"></infoPage>
+  </div>
+</template>
+
+<script>
+  import { listDepartments } from "@/apiDemo/system/dept";
+  import { checkClapMylist } from '@/apiDemo/safetyCheck/index'
+  import infoPage from './infoPage.vue'
+  export default {
+    name: 'listPage',
+    components: {
+      infoPage
+    },
+    data(){
+      return{
+        infoPageType:1,
+        deptSelectList:[],
+        queryParams:{
+          pageNum:1,
+          pageSize:20,
+          deptId:'',
+          searchValue:'',
+          rectifyStatus:'',
+          upTimeOrder:"",
+          zgTimeOrder:"",
+        },
+        dateRange:[],
+        tableList:[],
+        total:0,
+        //详情
+        infoPropsData:{}
+      }
+    },
+    created(){
+
+    },
+    mounted(){
+      this.listDepartments();
+      this.getList();
+    },
+    methods:{
+      //详情按钮
+      goPage(type,data){
+        if(this.infoPageType != type){
+          if (type==1){
+            this.$set(this,'infoPageType',type);
+          } else if(type==2){
+            this.$set(this,'infoPageType',type);
+          } else if(type==3){
+            this.$set(this,'infoPropsData',data);
+            this.$set(this,'infoPageType',type);
+          } else if(type==4){
+            this.$set(this,'infoPageType',1);
+            this.getList();
+          }
+        }
+      },
+      //返回按钮
+      outButton(){
+        this.$parent.goPage(1);
+      },
+      //范围选择
+      topLeftClickType(type){
+        if(this.queryParams.rectifyStatus !== type){
+          this.$set(this.queryParams,'rectifyStatus',type);
+          this.handleQuery();
+        }
+      },
+      //时间排序方法
+      sortChange(val){
+        if(val.prop == 'rectifyTime'){
+          this.$set(this.queryParams,'zgTimeOrder',val.order=='ascending'?'1':(val.order=='descending'?'2':''));
+          this.$set(this.queryParams,'upTimeOrder','');
+          this.handleQuery();
+        }else if(val.prop == 'createTime'){
+          this.$set(this.queryParams,'upTimeOrder',val.order=='ascending'?'1':(val.order=='descending'?'2':''));
+          this.$set(this.queryParams,'zgTimeOrder','');
+          this.handleQuery();
+        }
+      },
+      //获取数据列表
+      getList(){
+        let obj = JSON.parse(JSON.stringify(this.queryParams))
+        if(this.dateRange[0]){
+          obj.beginTime = this.dateRange[0]
+        }else{
+          obj.beginTime = ""
+        }
+        if(this.dateRange[1]){
+          obj.endTime = this.dateRange[1]
+        }else{
+          obj.endTime = ""
+        }
+        checkClapMylist(obj).then(response => {
+          this.total = response.data.total;
+          this.tableList = response.data.records;
+        });
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.$set(this.queryParams,'pageNum',1);
+        this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.$set(this,'dateRange',[]);
+        this.$set(this,'queryParams',{
+          pageNum:1,
+          pageSize:20,
+          deptId:'',
+          searchValue:'',
+          rectifyStatus:'',
+          upTimeOrder:"",
+          zgTimeOrder:"",
+        });
+        this.handleQuery();
+      },
+      //获取学院列表
+      listDepartments(){
+        listDepartments().then(response => {
+          this.deptSelectList = response.data;
+        });
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .snapshotManagement-listPage{
+    flex: 1;
+    display: flex !important;
+    flex-direction: column;
+    overflow: hidden;
+    .snapshotManagement-listPage-min{
+      flex: 1;
+      display: flex !important;
+      flex-direction: column;
+      overflow: hidden;
+      .title-box{
+        padding-top:20px;
+        border-bottom:1px solid #dedede;
+        .form-button-max-big-box{
+          display: inline-block;
+          .form-button-big-box{
+            display: flex;
+            div{
+              position: relative;
+              height:40px;
+              width:80px;
+              line-height: 40px;
+              text-align: center;
+              color:#999;
+              font-size:14px;
+              border:1px solid #999;
+              border-radius:4px;
+              margin-left:10px;
+              font-weight:500;
+              cursor: pointer;
+              .icon-p{
+                width:15px;
+                height:15px;
+                line-height:15px;
+                text-align: center;
+                position: absolute;
+                right:0;
+                bottom:0;
+                color:#fff;
+                background: #0183fa;
+                border-top-left-radius:4px;
+              }
+            }
+            .checkDiv{
+              color:#0183FA;
+              border:1px solid #0183FA;
+            }
+          }
+        }
+      }
+      .content-box{
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+        padding:20px;
+        overflow: hidden;
+      }
+    }
+  }
+</style>

src/views/safetyCheck/worktable/coverageRateEcharts.vue

@@ -0,0 +1,212 @@
+<template>
+  <div class="coverageRateEcharts" id="coverageRateEcharts-box">
+  </div>
+</template>
+
+<script>
+  import echarts from 'echarts'
+  import { yearRate } from '@/apiDemo/safetyCheck/index'
+  export default {
+    name: 'coverageRateEcharts',
+    data(){
+      return{
+
+      }
+    },
+    created(){
+
+    },
+    mounted(){
+      this.eCharts();
+    },
+    methods:{
+      //eCharts方法
+      eCharts(){
+        yearRate().then(response => {
+          let myChart = this.$echarts.init(document.getElementById('coverageRateEcharts-box'));
+          let getname = ['未检查', '已检查', '检查中'];
+          let getbl = [0, 0, 0]; // 比例
+          let getNum = [0, 0, 0]; // 数量
+          for(let i=0;i<response.data.length;i++){
+            if(response.data[i].type == 0){
+              if(response.data[i].rate.indexOf('%') != -1){
+                response.data[i].rate = response.data[i].rate.split('%')[0]
+                getbl[0] = response.data[i].rate
+              }else{
+                getbl[0] = response.data[i].rate
+              }
+              getNum[0] = response.data[i].number
+            }else if(response.data[i].type == 2){
+              if(response.data[i].rate.indexOf('%') != -1){
+                response.data[i].rate = response.data[i].rate.split('%')[0]
+                getbl[1] = response.data[i].rate
+              }else{
+                getbl[1] = response.data[i].rate
+              }
+              getNum[1] = response.data[i].number
+            }else if(response.data[i].type == 1){
+              if(response.data[i].rate.indexOf('%') != -1){
+                response.data[i].rate = response.data[i].rate.split('%')[0]
+                getbl[2] = response.data[i].rate
+              }else{
+                getbl[2] = response.data[i].rate
+              }
+              getNum[2] = response.data[i].number
+            }
+          }
+          let data = [];
+          for (let i = 0; i < getname.length; i++) {
+            data.push({ name: getname[i], value: getbl[i], num: getNum[i] })
+          }
+          let option = {
+            legend: {
+              type: "scroll",
+              orient: 'vertical',
+              height: '100%',
+              right: '0%',
+              top: 'center',
+              //icon: "circle", //设置为圆，删除则为矩形
+              itemWidth: 14,
+              itemHeight: 6,
+              itemGap: 25,
+              data: getname,
+              formatter: function (name) {
+                for (let i = 0; i < getname.length; i++) {
+                  if (name == data[i].name) {
+                    return '{name|' + name + '}'
+                  }
+                }
+              },
+              textStyle: {
+                rich: {
+                  name: {
+                    fontSize: 14,
+                    fontWeight: 400,
+                    width: 100,
+                    height: 20,
+                    padding: [0, 0, 0, 5],
+                    color: 'rgba(0, 0, 0, 0.85)',
+                    fontFamily: 'Source Han Sans CN-Regular',
+                  },
+                  num: {
+                    fontSize: 14,
+                    fontWeight: 500,
+                    height: 20,
+                    width: 50,
+                    color: 'rgba(0, 0, 0, 0.65)',
+                    fontFamily: 'Source Han Sans CN-Regular',
+                  },
+                  value: {
+                    fontSize: 14,
+                    fontWeight: 500,
+                    height: 20,
+                    width: 50,
+                    color: 'rgba(0, 0, 0, 0.65)',
+                    fontFamily: 'Source Han Sans CN-Regular',
+                  }
+                }
+              }
+
+            },
+            series: [{
+              type: 'pie',
+              top:20,
+              bottom:20,
+              left:10,
+              right:10,
+              radius: ['55%', '70%'],
+              center: ["38%", "50%"],
+              // label: {
+              //   formatter: params => {
+              //     let name = params.name;
+              //     if (name == getname[0]) {
+              //       return `{name0|${name}：${params.data.num}\n${params.value}%}`
+              //     } else if (name == getname[1]) {
+              //       return `{name1|${name}：${params.data.num}\n${params.value}%}`
+              //     } else if (name == getname[2]) {
+              //       return `{name2|${name}：${params.data.num}\n${params.value}%}`
+              //     }
+              //   },
+              //   rich: {
+              //     name0: {
+              //       fontSize: 14,
+              //       fontFamily: 'Source Han Sans CN-Regular',
+              //       color: fontColor[0],
+              //       padding: [2, 6, 4, 6],
+              //       borderRadius: 100
+              //     },
+              //     name1: {
+              //       fontSize: 14,
+              //       fontFamily: 'Source Han Sans CN-Regular',
+              //       color: fontColor[1],
+              //       padding: [2, 6, 4, 6],
+              //       borderRadius: 100
+              //     },
+              //     name2: {
+              //       fontSize: 14,
+              //       fontFamily: 'Source Han Sans CN-Regular',
+              //       color: fontColor[2],
+              //       padding: [2, 6, 4, 6],
+              //       borderRadius: 100
+              //     },
+              //   }
+              // },
+              // labelLine: {
+              //   show: false,
+              //   normal: {
+              //     length: 5,
+              //     length2: 50
+              //   }
+              // },
+              label: {
+                normal: {
+                    formatter: params => {
+                      let name = params.name;
+                      if (name == getname[0]) {
+                        return `${name}：${params.data.num}\n${params.value}%`
+                      } else if (name == getname[1]) {
+                        return `${name}：${params.data.num}\n${params.value}%`
+                      } else if (name == getname[2]) {
+                        return `${name}：${params.data.num}\n${params.value}%`
+                      }
+                    },
+                  textStyle: {
+                    fontSize: 12,
+                    color:'#333'
+                  },
+                  padding: [0, -60, 26, -60],
+                }
+              },
+              labelLine: {
+                normal: {
+                  length: 10,
+                  length2: 60,
+                }
+              },
+              data: data,
+              itemStyle: {
+                shadowBlur: 8,
+                shadowColor: "rgba(255, 255, 255, 0)",
+                borderColor: '#FFF',
+                borderWidth: 2,
+                color: function (colors) {
+                  var colorList = ['#FFA200', '#0183FA', '#FF5D3D'];
+                  return colorList[colors.dataIndex];
+                }
+              },
+            }
+            ]
+          };
+
+          myChart.setOption(option);
+        });
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .coverageRateEcharts{
+    height:183px;
+  }
+</style>

src/views/safetyCheck/worktable/hiddenDangerStatisticsEcharts.vue

@@ -0,0 +1,325 @@
+<template>
+  <div class="hiddenDangerStatisticsEcharts">
+    <div class="title-button-box">
+      <p :class="hdLevel==1?'check-p':''" @click="titleButtonClick(1)">一级指标</p>
+      <p :class="hdLevel==2?'check-p':''" @click="titleButtonClick(2)">二级指标</p>
+      <p :class="hdLevel==3?'check-p':''" @click="titleButtonClick(3)">三级指标</p>
+    </div>
+    <img  v-if="nullType" class="null-img" src="@/assets/ZDimages/basicsModules/null-data-1.png">
+    <div class="hiddenDangerStatisticsEcharts-box" id="hiddenDangerStatisticsEcharts-box">
+    </div>
+  </div>
+</template>
+
+<script>
+  import echarts from 'echarts'
+  import { hiddenCountByType, collegCheckHiddenCountByType,isSCollege } from '@/apiDemo/safetyCheck/index'
+  export default {
+    name: 'hiddenDangerStatisticsEcharts',
+    data(){
+      return{
+        hdLevel:1,
+        userFlg:true,
+        nullType:false,
+      }
+    },
+    created(){
+
+    },
+    mounted(){
+      this.isSCollege();
+    },
+    methods:{
+      isSCollege(){
+        isSCollege().then(response => {
+          this.$set(this,'userFlg',response.data.userFlg);
+          if(this.userFlg){
+            this.departmentEcharts();
+          }else{
+            this.schoolEcharts();
+          }
+        })
+      },
+      titleButtonClick(type){
+        if(this.hdLevel != type){
+          this.$set(this,'hdLevel',type);
+          if(this.userFlg){
+            this.departmentEcharts();
+          }else{
+            this.schoolEcharts();
+          }
+        }
+      },
+      //院系
+      departmentEcharts(){
+        collegCheckHiddenCountByType({hdLevel:this.hdLevel}).then(response => {
+          console.log('院系',response)
+          let myChart = this.$echarts.init(document.getElementById('hiddenDangerStatisticsEcharts-box'));
+          let data = {
+            name:[],
+            nameText:[],
+            text:[],
+            num: [],
+            percent: [],
+          }
+          if(!response.rows[0]){
+            this.$set(this,'nullType',true);
+            return
+          }else{
+            this.$set(this,'nullType',false);
+          }
+          response.rows.sort(this.compare('sumTotal', true))
+          for(let i=0;i<response.rows.length;i++){
+            data.name.push(response.rows[i].subjectName.length>8?response.rows[i].subjectName.substring(0,8)+'..':response.rows[i].subjectName)
+            data.nameText.push(response.rows[i].subjectName)
+            data.text.push(response.rows[i].hazardCheckName)
+            data.num.push(response.rows[i].sumTotal)
+            data.percent.push(response.rows[i].percent)
+          }
+          let option = {
+            grid: {
+              left: '30%',
+              top: '8%',
+              right: '15%',
+              bottom: '15%',
+            },
+            tooltip: {
+              trigger: 'axis',
+              formatter: params => {
+                return data.nameText[params[0].dataIndex] +' 隐患:'+ data.num[params[0].dataIndex]+' 占比:'+data.percent[params[0].dataIndex]
+                // return `${params.data.nameText} 隐患:${params.data.value} 占比:${params.percent}%`
+              },
+              backgroundColor: 'rgba(0, 0, 0, 0.6)', // 提示框背景色
+              borderColor: '#05050F', // 提示框边框色
+              textStyle: {
+                color: '#fff', // 提示框文本颜色
+              },
+              axisPointer: {
+                type: 'none',
+              },
+            },
+            legend: {
+              show:false,
+            },
+            xAxis: {
+              type: 'value',
+              position: "bottom",
+              splitLine: {
+                show: false,
+              },
+              axisTick: {
+                show: false,
+              },
+              axisLabel: {
+                textStyle: {
+                  color: '#333',
+                  fontSize: 12,
+                },
+              },
+              axisLine: {
+                show: true,
+                lineStyle: {
+                  color: 'rgba(216,216,216,1)',
+                },
+              },
+            },
+            yAxis: {
+              type: 'category',
+              splitLine: {
+                show: false,
+              },
+              axisTick: {
+                show: false,
+              },
+              data: data.name,
+              axisLabel: {
+                textStyle: {
+                  color: '#333',
+                  fontSize: 12,
+                },
+              },
+              axisLine: {
+                lineStyle: {
+                  color: 'rgba(216,216,216,1)',
+                },
+              },
+            },
+            series: [
+              {
+                name: '隐患',
+                type: 'bar',
+                barWidth:15,
+                data: data.num,
+                itemStyle: {
+                  emphasis: {
+                    barBorderRadius: [0, 20, 20, 0],
+                  },
+                  normal: {
+                    barBorderRadius: [0, 20, 20, 0],
+                    color: new echarts.graphic.LinearGradient(0, 0, 1, 0,
+                      [
+                        {
+                          offset: 0,
+                          color: 'rgba(246,111,0,0.1)', // 0% 处的颜色
+                        },
+                        {
+                          offset: 1,
+                          color: 'rgba(246,111,0,1)', // 100% 处的颜色
+                        },
+                      ],
+                      false
+                    ),
+                  },
+                },
+                label: {
+                  normal: {
+                    show: true,
+                    formatter: params => {
+                      return '隐患'+params.data
+                    },
+                    position: 'insideRight',
+                    offset: [40, 1.5],
+                    textStyle: {
+                      color: '#333',
+                      fontSize: 12,
+                    },
+                  },
+                },
+              },
+            ],
+            barCategoryGap: '60%',
+          };
+          myChart.setOption(option);
+        })
+      },
+      //校级
+      schoolEcharts(){
+        hiddenCountByType({hdLevel:this.hdLevel}).then(response => {
+          let myChart = this.$echarts.init(document.getElementById('hiddenDangerStatisticsEcharts-box'));
+          let data = [];
+          if(!response.rows[0]){
+            this.$set(this,'nullType',true);
+            return
+          }else{
+            this.$set(this,'nullType',false);
+          }
+          for(let i=0;i<response.rows.length;i++){
+            // substring
+            let obj = {
+              name:response.rows[i].collegeName.length>8?response.rows[i].collegeName.substring(0,8)+'..':response.rows[i].collegeName,
+              nameText:response.rows[i].collegeName,
+              value:response.rows[i].sumTotal,
+            }
+            data.push(obj);
+          }
+          let option = {
+            legend: {
+              show:false,
+            },
+            tooltip: {
+              confine: true,
+              trigger: 'item',
+              // formatter: '{b} : {c}'
+
+              formatter: params => {
+                console.log('params',params)
+                return `${params.data.nameText} 隐患:${params.data.value} 占比:${params.percent}%`
+              },
+            },
+            series: [
+              {
+                avoidLabelOverlap: false,
+                type: 'pie',
+                left:20,
+                right:20,
+                roseType: 'area', // 玫瑰图
+                center: ['50%', '50%'],
+                radius: ['0%', '40%'],
+                label: {
+                  normal: {
+                    formatter: '{b}\n隐患{c}\t占比{d}%',
+                    textStyle: {
+                      fontSize: 12,
+                      color:'#333'
+                    },
+                    padding: [0, -110, 26, -110],
+                  }
+                },
+                labelLine: {
+                  normal: {
+                    length: 30,
+                    length2: 110,
+                  }
+                },
+                data: data,
+                itemStyle: {
+                  normal: {
+                    color: function (colors) {
+                      var colorList = ['#0183FA', '#A069FF', '#80C459', '#FFA200', '#39DBED', '#FF2A00', '#009DFF', '#41BE26', '#2758E0', '#FFE019', '#FF5E86'];
+                      return colorList[colors.dataIndex];
+                    }
+                  },
+                }
+              }
+            ]
+          };
+          myChart.setOption(option);
+        });
+      },
+      compare (attr,rev) {
+        // console.log(attr, rev)
+        if(rev ==  undefined){
+          rev = 1;
+        }else{
+          rev = (rev) ? 1 : -1;
+        }
+        return (a,b) => {
+          a = a[attr];
+          b = b[attr];
+          if(a < b){
+            return rev * -1;
+          }
+          if(a > b){
+            return rev * 1;
+          }
+          return 0;
+        }
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .hiddenDangerStatisticsEcharts{
+    height:483px;
+    overflow: hidden;
+    .null-img{
+      width:160px;
+      margin:100px 0 0 170px;
+    }
+    .title-button-box{
+      display: flex;
+      border:1px solid #0183fa;
+      width:300px;
+      margin:32px 71px 0;
+      p{
+        width:100px;
+        line-height:30px;
+        text-align: center;
+        color:#0183fa;
+        cursor: pointer;
+      }
+      p:nth-child(2){
+        border-left:1px solid #0183fa;
+        border-right:1px solid #0183fa;
+      }
+      .check-p{
+        background-color: #0183fa;
+        color:#fff;
+      }
+    }
+    .hiddenDangerStatisticsEcharts-box{
+      height:420px;
+    }
+  }
+</style>

src/views/safetyCheck/worktable/index.vue

@@ -0,0 +1,530 @@
+<template>
+  <div class="app-container worktable">
+    <div class="top-max-big-box">
+      <!--校级数据卡-->
+      <div class="school-data-box">
+        <div class="left-min-box">
+          <img src="@/assets/ZDimages/safetyCheck/icon_gzt_xyxc.png">
+          <div>
+            <p>校院巡查</p>
+            <el-tooltip class="item" effect="dark" :content="'校院巡查总数：'+schoolWorkData.xcCount" placement="top">
+              <p>{{schoolWorkData.xcCount}}</p>
+            </el-tooltip>
+          </div>
+        </div>
+        <div class="right-min-box">
+          <div>
+            <img src="@/assets/ZDimages/safetyCheck/icon_gzt_aqyh.png">
+            <el-tooltip class="item" effect="dark" :content="'发现隐患数：'+schoolWorkData.yhCount" placement="top">
+              <p>{{schoolWorkData.yhCount}}</p>
+            </el-tooltip>
+          </div>
+          <div>
+            <img src="@/assets/ZDimages/safetyCheck/icon_gzt_yjcsys.png">
+            <el-tooltip class="item" effect="dark" :content="'涉及实验室数：'+schoolWorkData.subCount" placement="top">
+              <p>{{schoolWorkData.subCount}}</p>
+            </el-tooltip>
+          </div>
+        </div>
+      </div>
+      <!--院级数据卡-->
+      <div class="department-data-box">
+        <div class="left-min-box">
+          <img src="@/assets/ZDimages/safetyCheck/icon_gzt_syszc.png">
+          <div>
+            <p>实验室自查</p>
+            <el-tooltip class="item" effect="dark" :content="'实验室自查总数：'+schoolWorkSubData.zcCount" placement="top">
+              <p>{{schoolWorkSubData.zcCount}}</p>
+            </el-tooltip>
+          </div>
+        </div>
+        <div class="right-min-box">
+          <div>
+            <img src="@/assets/ZDimages/safetyCheck/icon_gzt_aqyh.png">
+            <el-tooltip class="item" effect="dark" :content="'发现隐患数：'+schoolWorkSubData.yhCount" placement="top">
+              <p>{{schoolWorkSubData.yhCount}}</p>
+            </el-tooltip>
+          </div>
+          <div>
+            <img src="@/assets/ZDimages/safetyCheck/icon_gzt_yjcsys.png">
+            <el-tooltip class="item" effect="dark" :content="'涉及实验室数：'+schoolWorkSubData.subCount" placement="top">
+              <p>{{schoolWorkSubData.subCount}}</p>
+            </el-tooltip>
+          </div>
+        </div>
+      </div>
+      <!--页面跳转按钮盒子-->
+      <div class="page-button-box">
+        <worktableButtonBox></worktableButtonBox>
+      </div>
+    </div>
+    <div class="bottom-max-big-box">
+      <!--待办事项-->
+      <div class="bottom-left-max-big-box">
+        <div class="min-title-box">
+          <p></p>
+          <p>待办事项</p>
+        </div>
+        <toDoListBox></toDoListBox>
+      </div>
+      <div class="bottom-center-max-big-box">
+        <!--存在隐患-->
+        <div class="hidden-danger-box">
+          <div class="min-title-box">
+            <p></p>
+            <p>存在隐患</p>
+          </div>
+          <div class="hidden-danger-big-box">
+            <div class="hidden-danger-min-box">
+              <img src="@/assets/ZDimages/safetyCheck/icon_gzt_gjyh_2.png">
+              <el-tooltip class="item" effect="dark" :content="'未整改隐患总数：'+hiddenCountData.hiddenCount" placement="top">
+                <p>共计{{hiddenCountData.hiddenCount}}项隐患</p>
+              </el-tooltip>
+            </div>
+            <p class="center-null-p"></p>
+            <div class="hidden-danger-min-box">
+              <img src="@/assets/ZDimages/safetyCheck/icon_gzt_sjsys_2.png">
+              <el-tooltip class="item" effect="dark" :content="'隐患涉及实验室总数：'+hiddenCountData.subjectCount" placement="top">
+                <p>涉及{{hiddenCountData.subjectCount}}个实验室</p>
+              </el-tooltip>
+            </div>
+          </div>
+        </div>
+        <!--检查率覆盖-->
+        <div class="coverage-rate-box">
+          <div class="min-title-box">
+            <p></p>
+            <p>当年检查覆盖率</p>
+          </div>
+          <coverageRateEcharts></coverageRateEcharts>
+        </div>
+        <!--检查统计-->
+        <div class="statistics-box">
+          <div class="min-title-box">
+            <p></p>
+            <p>检查统计</p>
+          </div>
+          <inspectionStatisticsEcharts></inspectionStatisticsEcharts>
+        </div>
+      </div>
+      <div class="bottom-right-max-big-box">
+        <!--已处理隐患-->
+        <div class="dealt-with-danger">
+          <div class="min-title-box">
+            <p></p>
+            <p>已处理隐患</p>
+          </div>
+          <div class="dealt-with-danger-big-box" style="margin-top:7px;">
+            <div class="dealt-with-danger-min-box">
+              <img src="@/assets/ZDimages/safetyCheck/icon_gzt_dy.png">
+              <el-tooltip class="item" effect="dark" :content="'当周已处理隐患数：'+hiddenDangerRectifyData.weekCount" placement="top">
+                <p>当周 <span>{{hiddenDangerRectifyData.weekCount}}</span> 项</p>
+              </el-tooltip>
+            </div>
+            <div class="dealt-with-danger-min-box">
+              <img src="@/assets/ZDimages/safetyCheck/icon_gzt_sy.png">
+              <el-tooltip class="item" effect="dark" :content="'上月已处理隐患数：'+hiddenDangerRectifyData.lastMonthCount" placement="top">
+                <p>上月 <span>{{hiddenDangerRectifyData.lastMonthCount}}</span> 项</p>
+              </el-tooltip>
+            </div>
+          </div>
+          <div class="dealt-with-danger-big-box">
+            <div class="dealt-with-danger-min-box">
+              <img src="@/assets/ZDimages/safetyCheck/icon_gzt_by.png">
+              <el-tooltip class="item" effect="dark" :content="'当月已处理隐患数：'+hiddenDangerRectifyData.monthCount" placement="top">
+                <p>当月 <span>{{hiddenDangerRectifyData.monthCount}}</span> 项</p>
+              </el-tooltip>
+            </div>
+            <div class="dealt-with-danger-min-box">
+              <img src="@/assets/ZDimages/safetyCheck/icon_gzt_dn.png">
+              <el-tooltip class="item" effect="dark" :content="'当年已处理隐患数：'+hiddenDangerRectifyData.yearCount" placement="top">
+                <p>当年 <span>{{hiddenDangerRectifyData.yearCount}}</span> 项</p>
+              </el-tooltip>
+            </div>
+          </div>
+        </div>
+        <!--隐患统计-->
+        <div class="hidden-danger-statistics">
+          <div class="min-title-box">
+            <p></p>
+            <p>检查指标隐患统计</p>
+            <p @click="goPage">查看全部</p>
+          </div>
+          <hiddenDangerStatisticsEcharts></hiddenDangerStatisticsEcharts>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+  import { schoolWorkCheck, schoolWorkSubCheck, hiddenCount, hiddenDangerRectify } from '@/apiDemo/safetyCheck/index'
+  import toDoListBox from './toDoListBox.vue'
+  import worktableButtonBox from './worktableButtonBox.vue'
+  import coverageRateEcharts from './coverageRateEcharts.vue'
+  import inspectionStatisticsEcharts from './inspectionStatisticsEcharts.vue'
+  import hiddenDangerStatisticsEcharts from './hiddenDangerStatisticsEcharts.vue'
+  export default {
+    name: 'index',
+    components: {
+      toDoListBox,
+      worktableButtonBox,
+      coverageRateEcharts,
+      inspectionStatisticsEcharts,
+      hiddenDangerStatisticsEcharts,
+    },
+    data(){
+      return{
+        //用户身份 校级/院级
+        userType:"",
+        schoolWorkData:{
+          subCount:0,
+          yhCount:0,
+          xcCount:0
+        },
+        schoolWorkSubData:{
+          subCount:0,
+          zcCount:0,
+          yhCount:0
+        },
+        hiddenCountData:{
+          hiddenCount:0,
+          subjectCount:0
+        },
+        hiddenDangerRectifyData:{
+          yearCount:0,   //当年隐患总数
+          weekCount:0,   //本周隐患总数
+          lastMonthCount:0,   //上月隐患总数
+          monthCount:0,   //本月隐患总数
+        },
+        //数据统计页面权限
+        goDataStatistics:false
+      }
+    },
+    created(){
+      this.schoolWorkCheck();
+      this.schoolWorkSubCheck();
+      this.hiddenCount();
+      this.hiddenDangerRectify();
+      this.setButtonList();
+    },
+    mounted(){
+
+    },
+    methods:{
+      //校级巡查数据
+      schoolWorkCheck(){
+        schoolWorkCheck().then(response => {
+          this.$set(this,'schoolWorkData',response.data);
+        });
+      },
+      //实验室巡查数据
+      schoolWorkSubCheck(){
+        schoolWorkSubCheck().then(response => {
+          this.$set(this,'schoolWorkSubData',response.data);
+        });
+      },
+      //存在隐患
+      hiddenCount(){
+        hiddenCount().then(response => {
+          this.$set(this,'hiddenCountData',response.data);
+        });
+      },
+      //已处理隐患
+      hiddenDangerRectify(){
+        hiddenDangerRectify().then(response => {
+          this.$set(this,'hiddenDangerRectifyData',response.data);
+        });
+      },
+      //去数据统计页面
+      goPage(){
+        if(this.goDataStatistics){
+          this.$router.push({
+            path: '/safetyCheck/dataStatistics',
+            query:{
+              type:true
+            }
+          });
+        }else{
+          this.msgError('没有相关权限,请联系管理员')
+        }
+        // safetyCheck/dataStatistics
+      },
+      //权限查找
+      setButtonList() {
+        let localRoute = JSON.parse(localStorage.getItem("routeData"))
+        this.forRouteData('dataStatistics',localRoute);
+      },
+      forRouteData(item,list){
+        let self = this;
+        for(let i=0;i<list.length;i++){
+          if(item == list[i].path){
+            if(item == 'dataStatistics'){
+              self.$set(self,'goDataStatistics',true);
+            }
+          }else{
+            if(list[i].children){
+              self.forRouteData(item,list[i].children)
+            }
+          }
+        }
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .worktable{
+    flex:1;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+    padding:10px!important;
+    font-weight: 400;
+    .top-max-big-box{
+      height:140px;
+      display: flex;
+      .school-data-box{
+        width:330px;
+        height:120px;
+        margin:10px;
+        background: #009DFF;
+        border-radius:10px;
+        display: flex;
+        .left-min-box{
+          display: flex;
+          img{
+            width:50px;
+            height:50px;
+            margin:35px 14px 35px 20px;
+          }
+          div{
+            width:118px;
+            color:#fff;
+            p:nth-child(1){
+              font-size:16px;
+              line-height:40px;
+              margin-top:20px;
+              font-weight: 400;
+            }
+            p:nth-child(2){
+              font-size:24px;
+              font-weight: 700;
+              line-height:40px;
+              cursor: default;
+            }
+          }
+        }
+        .right-min-box{
+          width:58px;
+          display: flex;
+          div{
+            width:94px;
+            img{
+              width:20px;
+              height:20px;
+              margin:38px 19px 8px;
+            }
+            p{
+              color:#fff;
+              text-align: center;
+              line-height:20px;
+              font-size:16px;
+              font-weight: 400;
+              cursor: default;
+            }
+          }
+        }
+      }
+      .department-data-box{
+        width:330px;
+        height:120px;
+        margin:10px;
+        background: #2CCFDA;
+        border-radius:10px;
+        display: flex;
+        .left-min-box{
+          display: flex;
+          img{
+            width:50px;
+            height:50px;
+            margin:35px 14px 35px 20px;
+          }
+          div{
+            width:118px;
+            color:#fff;
+            p:nth-child(1){
+              font-size:16px;
+              line-height:40px;
+              margin-top:20px;
+              font-weight: 400;
+            }
+            p:nth-child(2){
+              font-size:24px;
+              font-weight: 700;
+              line-height:40px;
+              cursor: default;
+            }
+          }
+        }
+        .right-min-box{
+          width:58px;
+          display: flex;
+          div{
+            width:94px;
+            img{
+              width:20px;
+              height:20px;
+              margin:38px 19px 8px;
+            }
+            p{
+              color:#fff;
+              text-align: center;
+              line-height:20px;
+              font-size:16px;
+              font-weight: 400;
+              cursor: default;
+            }
+          }
+        }
+      }
+      .page-button-box{
+        overflow: hidden;
+        flex:1;
+        height:120px;
+        margin:10px;
+        border-radius:10px;
+        box-shadow: 0 4px 10px 0 rgba(0,0,0,0.1);
+      }
+    }
+    .bottom-max-big-box{
+      flex:1;
+      display:flex;
+      .bottom-left-max-big-box{
+        overflow: hidden;
+        width:500px;
+        height:722px;
+        margin:10px;
+        box-shadow: 0 4px 10px 0 rgba(0,0,0,0.1);
+        border-radius: 10px 10px 10px 10px;
+      }
+      .bottom-center-max-big-box{
+        overflow: hidden;
+        .hidden-danger-box{
+          overflow: hidden;
+          width:556px;
+          height:174px;
+          margin:10px 10px 20px;
+          box-shadow: 0 4px 10px 0 rgba(0,0,0,0.1);
+          border-radius: 10px 10px 10px 10px;
+          .hidden-danger-big-box{
+            display: flex;
+            .center-null-p{
+              width:1px;
+              height:30px;
+              background-color: #d8d8d8;
+              margin-top:48px;
+            }
+            .hidden-danger-min-box{
+              display: flex;
+              flex:1;
+              img{
+                width:60px;
+                height:60px;
+                margin:33px 21px 0 41px;
+              }
+              p{
+                margin-top:58px;
+                font-size:16px;
+                line-height:16px;
+                cursor: default;
+              }
+            }
+          }
+        }
+        .coverage-rate-box{
+          overflow: hidden;
+          width:556px;
+          height:228px;
+          margin:0 10px 20px;
+          box-shadow: 0 4px 10px 0 rgba(0,0,0,0.1);
+          border-radius: 10px 10px 10px 10px;
+        }
+        .statistics-box{
+          overflow: hidden;
+          width:556px;
+          height:280px;
+          margin:0 10px 10px;
+          box-shadow: 0 4px 10px 0 rgba(0,0,0,0.1);
+          border-radius: 10px 10px 10px 10px;
+        }
+      }
+      .bottom-right-max-big-box{
+        .dealt-with-danger{
+          overflow: hidden;
+          width:440px;
+          height:174px;
+          margin:10px 10px 20px;
+          box-shadow: 0 4px 10px 0 rgba(0,0,0,0.1);
+          border-radius: 10px 10px 10px 10px;
+          .dealt-with-danger-big-box{
+            display: flex;
+            padding:17px 50px;
+            .dealt-with-danger-min-box:nth-child(1){
+              width:200px;
+            }
+            .dealt-with-danger-min-box{
+              display: flex;
+              img{
+                width:20px;
+                height:20px;
+                margin-right:13px;
+              }
+              p{
+                line-height:20px;
+                font-size:16px;
+                color:#333;
+                cursor: default;
+                span{
+                  color:#009DFF;
+                }
+              }
+            }
+          }
+        }
+        .hidden-danger-statistics{
+          width:440px;
+          height:528px;
+          margin:0 10px 10px;
+          box-shadow: 0 4px 10px 0 rgba(0,0,0,0.1);
+          border-radius: 10px 10px 10px 10px;
+        }
+      }
+      .min-title-box{
+        display: flex;
+        height:45px;
+        p:nth-child(1){
+          background-color: #0183FA;
+          height:18px;
+          width:4px;
+          margin:24px 10px 0 20px;
+        }
+        p:nth-child(2){
+          font-size:16px;
+          color:#333;
+          line-height:24px;
+          margin-top:21px;
+          flex:1;
+        }
+        p:nth-child(3){
+          font-size:14px;
+          color:#0183fa;
+          line-height:24px;
+          margin-top:21px;
+          margin-right:20px;
+          cursor: pointer;
+        }
+      }
+    }
+  }
+</style>

src/views/safetyCheck/worktable/inspectionStatisticsEcharts.vue

@@ -0,0 +1,260 @@
+<template>
+  <div class="inspectionStatisticsEcharts" id="inspectionStatisticsEcharts-box"></div>
+</template>
+
+<script>
+  import { checkStatistics } from '@/apiDemo/safetyCheck/index'
+  export default {
+    name: 'inspectionStatisticsEcharts',
+    data(){
+      return{
+
+      }
+    },
+    created(){
+
+    },
+    mounted(){
+      this.eCharts();
+    },
+    methods:{
+      //eCharts方法
+      eCharts(){
+        checkStatistics().then(response => {
+          let data = {
+            name : [],
+            standards : [],
+            notStandards : [],
+          }
+          for(let i=0;i<response.rows.length;i++){
+            data.name.push(response.rows[i].yearMonth)
+            if(response.rows[i].notStandards.indexOf('%') != -1){
+              response.rows[i].notStandards = response.rows[i].notStandards.split('%')[0]
+              data.notStandards.push(response.rows[i].notStandards)
+            }else{
+              data.notStandards.push(response.rows[i].notStandards)
+            }
+            if(response.rows[i].standards.indexOf('%') != -1){
+              response.rows[i].standards = response.rows[i].standards.split('%')[0]
+              data.standards.push(response.rows[i].standards)
+            }else{
+              data.standards.push(response.rows[i].standards)
+            }
+          }
+          let myChart = this.$echarts.init(document.getElementById('inspectionStatisticsEcharts-box'));
+          let option = {
+            //你的代码
+            tooltip: {
+              show:true,
+              trigger: 'axis',
+              formatter: function(params) {
+                let html = '<div>';
+                html += '<p>'+params[0].name+'</p>'
+                for(let i=0;i<params.length;i++){
+                  html += '<p>'+params[i].marker+'&nbsp'+params[i].seriesName+'&nbsp:&nbsp'+params[i].data+'%<p>'
+                }
+                return html;
+              },
+              axisPointer: {
+                lineStyle: {
+                  color: 'rgb(126,199,255)',
+                },
+              },
+            },
+            legend: {
+              show: true,
+              icon: 'circle',
+              itemWidth: 30,
+              itemHeight: 10,
+              right:20,
+              textStyle: {
+                color: 'rgba(0, 0, 0, 1)',
+                fontSize: 14,
+                padding: [0, 8, 0, 8]
+              }
+            },
+            grid: {
+              top: '20%',
+              left: '10%',
+              right: '7%',
+              bottom: '15%',
+            },
+            xAxis: [
+              {
+                type: 'category',
+                boundaryGap: false,
+                axisLine: {
+                  show: true,
+                  lineStyle: {
+                    color: 'rgb(41,188,245)',
+                  },
+                },
+                axisLabel: {
+                  textStyle: {
+                    color: 'rgba(112, 151, 184, 1)',
+                    fontSize: 12,
+                  },
+                },
+                splitLine: {
+                  show: false,
+                },
+                axisTick: {
+                  show: false,
+                },
+                data: data.name,
+              },
+            ],
+            yAxis: [
+              {
+                name: "",
+                nameTextStyle: {
+                  color: "#fff",
+                  fontSize: 12,
+                  padding: [0, 60, 0, 0]
+                },
+                // minInterval: 1,
+                type: 'value',
+                splitLine: {
+                  show: false,
+                },
+                axisLine: {
+                  show: false,
+                },
+                axisLabel: {
+                  show: true,
+                  textStyle: {
+                    color: 'rgba(112, 151, 184, 1)',
+                    fontSize: 14
+                  }
+                },
+                axisTick: {
+                  show: false,
+                },
+              },
+            ],
+            series: [
+              {
+                name: '符合',
+                type: 'line',
+                symbol: 'circle',
+                smooth: true,
+                lineStyle: {
+                  normal: {
+                    width: 1,
+                    color: '#00AEFF', // 线条颜色
+                  },
+                },
+                showSymbol: false,
+                itemStyle: {
+                  normal: {
+                    color: '#00AEFF',//拐点颜色
+                    label: {
+                      show: false, //开启显示
+                      color: '#fff',
+                      position: 'top', //在上方显示
+                      formatter: function (res) {
+                        console.log('res',res)
+                        if (res.value) {
+                          return res.value
+                        } else {
+                          return 0
+                        }
+                      },
+                    },
+                  },
+                },
+                areaStyle: {
+                  color: {
+                    type: 'linear',
+                    x: 0,
+                    y: 0,
+                    x2: 0,
+                    y2: 1,
+                    colorStops: [  // 渐变颜色
+                      {
+                        offset: 0,
+                        color: 'rgba(0,174,255,1)',
+                      },
+                      {
+                        offset: 0.5,
+                        color: 'rgba(0,174,255,0.38)',
+                      },
+                      {
+                        offset: 1,
+                        color: 'rgba(0,174,255,0)',
+                      },
+                    ],
+                    global: false,
+                  },
+                },
+                data: data.standards,
+              },
+              {
+                name: '不符合',
+                type: 'line',
+                symbol: 'circle', // 默认是空心圆（中间是白色的），改成实心圆
+                smooth: true,
+                lineStyle: {
+                  normal: {
+                    width: 1,
+                    color: '#F66F00', // 线条颜色
+                  },
+                },
+                showSymbol: false,
+                itemStyle: {
+                  normal: {
+                    color: '#F66F00',//拐点颜色
+                    label: {
+                      show: true, //开启显示
+                      color: '#fff',
+                      position: 'top', //在上方显示
+                      formatter: function (res) {
+                        if (res.value) {
+                          return res.value
+                        } else {
+                          return 0
+                        }
+                      },
+                    },
+                  },
+                },
+                areaStyle: {
+                  color: {
+                    type: 'linear',
+                    x: 0,
+                    y: 0,
+                    x2: 0,
+                    y2: 1,
+                    colorStops: [  // 渐变颜色
+                      {
+                        offset: 0,
+                        color: 'rgba(246,111,0,1)',
+                      },
+                      {
+                        offset: 0.5,
+                        color: 'rgba(246,111,0,0.38)',
+                      },
+                      {
+                        offset: 1,
+                        color: 'rgba(246,111,0,0)',
+                      },
+                    ],
+                    global: false,
+                  },
+                },
+                data: data.notStandards,
+              }
+            ]
+          };
+          myChart.setOption(option);
+        })
+      },
+    }
+  }
+</script>
+
+<style scoped>
+  .inspectionStatisticsEcharts{
+    height:236px;
+  }
+</style>

src/views/safetyCheck/worktable/toDoListBox.vue

@@ -0,0 +1,435 @@
+<template>
+  <div class="toDoListBox">
+    <div class="toDoListBox-form-box">
+      <div class="form-button-box">
+        <p :class="queryParams.manageStatus == 0?'check-p':''" @click="titleClickButton(0)">待检查</p>
+        <p :class="queryParams.manageStatus == 1?'check-p':''" @click="titleClickButton(1)">检查中</p>
+        <p :class="queryParams.manageStatus == 2?'check-p':''" @click="titleClickButton(2)">待复核</p>
+      </div>
+      <el-form :model="queryParams" class="form-box" ref="queryForm" :inline="true">
+        <el-form-item label="" prop="searchValue" label-width="80px">
+          <el-input
+            maxLength="30"
+            v-model="queryParams.searchValue"
+            placeholder="搜索实验室/房间号"
+            style="width: 186px">
+            <p slot="append" class="el-icon-search" @click="handleQuery"></p>
+          </el-input>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div class="toDoListBox-list-box scrollbar-box"
+         @mouseleave="tableTimerFun"
+         @mouseenter="tableTimerOff"
+         ref="scrollDiv">
+      <div  class="for-list-box"
+            v-for="(item,index) in tableList" :key="index">
+        <div class="for-name-box">
+          <p class="name-p">{{item.subjectName}}-{{item.roomNumber}}</p>
+          <p class="type-p" v-if="item.isOverdue == 1">已逾期</p>
+          <p class="null-p"></p>
+          <img v-if="item.isAttachment == 1" @click="lookDocumentListButton(1,item)"
+               src="@/assets/ZDimages/safetyCheck/icon_gzt_bg.png">
+        </div>
+        <div class="for-title-box">
+          <p>{{item.title}}</p>
+        </div>
+        <div class="for-button-box">
+          <p>{{queryParams.manageStatus==0?'待检查':(queryParams.manageStatus==1?'检查中':(queryParams.manageStatus==2?'待复核':''))}}</p>
+          <p>{{item.checkType==1?'校院巡查':(item.checkType==2?'实验室自查':'')}}</p>
+          <p>{{item.collegeName}}</p>
+        </div>
+        <div class="for-time-box">
+          <p>计划周期：{{item.cycleStartTime}} 至 {{item.cycleEndTime}}</p>
+          <p v-if="item.manageStatus == 0 && item.checkIsStatus" @click="goPage(item)">开始检查</p>
+          <p v-if="item.manageStatus == 0 && !item.checkIsStatus" class="noButton">计划未开始</p>
+          <p v-if="item.manageStatus == 1 && item.isUpdate" @click="goPage(item)">编辑</p>
+          <p v-if="item.manageStatus == 2 && item.isCheck" @click="addDialogOpen(true,item)">复核</p>
+        </div>
+        <img class="position-img" v-if="item.checkRange == 1" src="@/assets/ZDimages/safetyCheck/icon_xyxc_qx.png">
+        <img class="position-img" v-if="item.checkRange == 2" src="@/assets/ZDimages/safetyCheck/icon_xyxc_xy.png">
+        <img class="position-img" v-if="item.checkRange == 3" src="@/assets/ZDimages/safetyCheck/icon_xyxc_sys.png">
+      </div>
+      <img  v-if="!tableList[0]" class="null-img" src="@/assets/ZDimages/basicsModules/null-data-1.png">
+    </div>
+    <infoDialog v-if="infoDialogType" :propsInfoDialogData="propsInfoDialogData"></infoDialog>
+    <lookDocumentListDialog v-if="lookDocumentListType" :propsLookDocumentListData="propsLookDocumentListData"></lookDocumentListDialog>
+  </div>
+</template>
+
+<script>
+  import { todoList, tobeReviewed,getFindByCheckPlanId } from '@/apiDemo/safetyCheck/index'
+  import lookDocumentListDialog from '@/components/lookDocumentDialog/lookDocumentListDialog.vue'
+  import infoDialog from '@/views/safetyCheck/components/infoDialog/infoDialog.vue'
+  export default {
+    name: 'toDoListBox',
+    components: {
+      infoDialog,
+      lookDocumentListDialog
+    },
+    data(){
+      return{
+        //子组件数据
+        infoDialogType:false,
+        propsInfoDialogData:{},
+        lookDocumentListType:false,
+        propsLookDocumentListData:{},
+        queryParams:{
+          manageStatus:0,
+          searchValue:"",
+        },
+        tableList:[],
+        total:0,
+        //跳转巡查权限
+        goInspectionManagement:false,
+        //跳转自查权限
+        goSelfInspectionManagement:false,
+        /*****************数据滚动相关*****************/
+        tableTimer: null,
+
+      }
+    },
+    created(){
+      this.getList();
+      this.setButtonList();
+    },
+    mounted(){
+
+    },
+    methods:{
+      //滚动方法
+      tableActionFun() {
+        this.$refs.scrollDiv.scrollTop = 0;
+        this.tableTimerFun();
+      },
+      //开始滚动
+      tableTimerFun() {
+        if(this.tableList[3]){
+          this.tableTimer = window.setInterval(() => {
+            let csrollTop = this.$refs.scrollDiv.scrollTop
+            let maxHeight = this.$refs.scrollDiv.scrollHeight - this.$refs.scrollDiv.offsetHeight
+            if (csrollTop >= maxHeight) {
+              this.$refs.scrollDiv.scrollTop = 0;
+            } else {
+              this.$refs.scrollDiv.scrollTop += 1;
+            }
+          }, 30);
+        }
+      },
+      //停止滚动
+      tableTimerOff(){
+        window.clearInterval(this.tableTimer)
+      },
+      //跳转
+      goPage(item){
+        //跳转 巡查/自查页面
+        if(item.checkType == 1){
+          //巡查
+          if(this.goInspectionManagement){
+            this.$router.push({
+              path: `/safetyCheck/schoolInspection/inspectionManagement`,
+              query:{
+                id:item.id
+              }
+            })
+          }else{
+            this.msgError('没有相关权限,请联系管理员')
+          }
+        }else if(item.checkType == 2){
+          //自查
+          if(this.goSelfInspectionManagement){
+            this.$router.push({
+              path: `/safetyCheck/laboratorySelfTest/selfInspectionManagement`,
+              query:{
+                id:item.id
+              }
+            })
+          }else{
+            this.msgError('没有相关权限,请联系管理员')
+          }
+        }
+      },
+      //开关详情页面
+      addDialogOpen(type,data){
+        if(this.infoDialogType != type){
+          if(type){
+            let obj = {
+              id:data.hazardId
+            }
+            this.$set(this,'propsInfoDialogData',obj);
+            this.$set(this,'infoDialogType',type);
+          }else{
+            this.$set(this,'infoDialogType',type);
+          }
+        }
+      },
+      titleClickButton(type){
+        if(this.queryParams.manageStatus != type){
+          this.$set(this.queryParams,'manageStatus',type);
+          this.getList();
+        }
+      },
+      //获取数据列表
+      getList(){
+        clearInterval(this.tableTimer);
+        if(this.queryParams.manageStatus == 2){
+          let obj = JSON.parse(JSON.stringify(this.queryParams))
+          obj.rectifyStatus = 3;
+          tobeReviewed(obj).then(response => {
+            this.$set(this,'tableList',response.data.records);
+            this.tableActionFun();
+          });
+        }else{
+          todoList(this.queryParams).then(response => {
+            this.$set(this,'tableList',response.data.records);
+            this.tableActionFun();
+          });
+        }
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.getList();
+      },
+      //查看多个文档
+      lookDocumentListButton(type,item){
+        if(type==1){
+          getFindByCheckPlanId({checkPlanId:item.checkPlanId}).then(response => {
+            let list = [];
+            for(let i=0;i<response.data.length;i++){
+              let obj = {
+                name:response.data[i].fileName,
+                url:response.data[i].fileUrl,
+              }
+              list.push(obj);
+            }
+            this.$set(this,'propsLookDocumentListData',{
+              title:"查看附件",
+              list:list
+            });
+            this.$set(this,'lookDocumentListType',true);
+          });
+        }else{
+          this.$set(this,'lookDocumentListType',false);
+        }
+      },
+      //权限查找
+      setButtonList() {
+        let localRoute = JSON.parse(localStorage.getItem("routeData"))
+        this.forRouteData('inspectionManagement',localRoute);
+        this.forRouteData('selfInspectionManagement',localRoute);
+      },
+      forRouteData(item,list){
+        let self = this;
+        for(let i=0;i<list.length;i++){
+          if(item == list[i].path){
+            if(item == 'inspectionManagement'){
+              self.$set(self,'goInspectionManagement',true);
+            }else if(item == 'selfInspectionManagement'){
+              self.$set(self,'goSelfInspectionManagement',true);
+            }
+          }else{
+            if(list[i].children){
+              self.forRouteData(item,list[i].children)
+            }
+          }
+        }
+      },
+    },
+    beforeDestroy() {
+      //清除定时器
+      window.clearInterval(this.tableTimer);
+      this.$set(this,'tableTimer',null);
+      this.$set(this,'tableList',[]);
+    },
+    destroyed() {
+      //清除定时器
+      window.clearInterval(this.tableTimer);
+      this.$set(this,'tableTimer',null);
+      this.$set(this,'tableList',[]);
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .toDoListBox{
+    height:676px;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+    .toDoListBox-form-box{
+      display: flex;
+      padding:30px 20px 0;
+      .form-button-box{
+        display: flex;
+        p{
+          cursor: pointer;
+          width:80px;
+          height:30px;
+          font-size:14px;
+          color:#333;
+          border:1px solid #E0E0E0;
+          border-radius:4px;
+          line-height:28px;
+          text-align: center;
+          margin-right:10px;
+        }
+        .check-p{
+          color:#fff;
+          border-color: #0183FA;
+          background-color: #0183FA;
+        }
+      }
+      ::v-deep .el-input__inner{
+        height:30px;
+        border: 1px solid #DCDFE6;
+        border-right:none;
+        padding-right:0;
+      }
+      ::v-deep .el-input-group__append{
+        padding:0 11px;
+        background-color: #fff;
+        cursor: pointer;
+      }
+    }
+    .toDoListBox-list-box{
+      position: relative;
+      padding:0 20px 20px;
+      flex:1;
+      .null-img{
+        width:160px;
+        margin:160px 0 0 170px;
+      }
+      .for-list-box{
+        height:190px;
+        border-radius:20px;
+        box-shadow: 0 4px 10px 0 rgba(0,0,0,0.2);
+        overflow: hidden;
+        margin-top:20px;
+        position: relative;
+        .for-name-box{
+          overflow: hidden;
+          padding:0 20px 0 58px;
+          display: flex;
+          margin:20px 0 12px;
+          .name-p{
+            height:24px;
+            line-height:24px;
+            font-size:16px;
+            color:#333;
+            max-width:280px;
+            display:block;
+            overflow: hidden;
+            text-overflow:ellipsis;
+            white-space:nowrap;
+          }
+          .type-p{
+            border-radius:4px;
+            text-align: center;
+            width:60px;
+            margin:2px 0 2px 10px;
+            height:20px;
+            line-height:20px;
+            color:#FF3131;
+            font-size:14px;
+            background-color: rgba(255,49,49,0.2);
+          }
+          .null-p{
+            flex:1;
+          }
+          img{
+            width:15px;
+            height:16px;
+            margin:4px 0 0 10px;
+            cursor: pointer;
+          }
+        }
+        .for-title-box{
+          overflow: hidden;
+          padding:0 20px 0 58px;
+          display: flex;
+          margin-bottom:18px;
+          p{
+            height:20px;
+            line-height:20px;
+            font-size:14px;
+            color:#333;
+            max-width:375px;
+            display:block;
+            overflow: hidden;
+            text-overflow:ellipsis;
+            white-space:nowrap;
+          }
+        }
+        .for-button-box{
+          display: flex;
+          margin:0 20px 20px 58px;
+          font-size:14px;
+          p:nth-child(1){
+            width:80px;
+            line-height:30px;
+            background: rgba(1,131,250,0.1);
+            margin-right:13px;
+            border-radius:80px;
+            text-align: center;
+            color:#0183FA;
+          }
+          p:nth-child(2){
+            width:100px;
+            padding:0 12px;
+            line-height:30px;
+            border:1px solid #E0E0E0;
+            border-radius:80px;
+            text-align: center;
+            color:#666666;
+          }
+          p:nth-child(3){
+            width:165px;
+            line-height:30px;
+            color:#333;
+            margin-left:22px;
+            display:block;
+            overflow: hidden;
+            text-overflow:ellipsis;
+            white-space:nowrap;
+          }
+
+        }
+        .for-time-box{
+          display: flex;
+          height:42px;
+          border-top:1px dashed #D8D8D8;
+          line-height: 42px;
+          p:nth-child(1){
+            margin-left:20px;
+            font-size:14px;
+            flex:1;
+            overflow: hidden;
+          }
+          p:nth-child(2){
+            padding:0 20px;
+            text-align: center;
+            cursor: pointer;
+            color:#0183FA;
+            font-size:14px;
+          }
+          .noButton{
+            color:#999!important;
+            cursor: inherit!important;
+          }
+        }
+        .position-img{
+          width:80px;
+          height:80px;
+          position: absolute;
+          left:0;
+          top:0;
+        }
+      }
+      .null-p{
+        text-align: center;
+        color:#999;
+        line-height:100px;
+      }
+    }
+  }
+</style>

src/views/safetyCheck/worktable/worktableButtonBox.vue

@@ -0,0 +1,136 @@
+<template>
+  <div class="worktableButtonBox">
+    <div class="for-button-box" @click="goPage(item)"
+         v-for="(item,index) in buttonList" :key="index">
+      <img :src="item.url">
+      <p class="for-name">{{item.name}}</p>
+      <p class="position-p" v-if="index!=0"></p>
+    </div>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'worktableButtonBox',
+    data(){
+      return{
+        routeList:[],
+        buttonList:[
+          {
+            name:"开展检查",
+            key:"startInspection",
+            url:require('@/assets/ZDimages/safetyCheck/icon_gzt_kzjc.png'),
+            path:"/safetyCheck/startInspection",
+            type:false,
+          },
+          {
+            name:"巡查管理",
+            key:"inspectionManagement",
+            url:require('@/assets/ZDimages/safetyCheck/icon_gzt_xcgl.png'),
+            path:"/safetyCheck/schoolInspection/inspectionManagement",
+            type:false,
+          },
+          {
+            name:"自查管理",
+            key:"selfInspectionManagement",
+            url:require('@/assets/ZDimages/safetyCheck/icon_gzt_zcgl.png'),
+            path:"/safetyCheck/laboratorySelfTest/selfInspectionManagement",
+            type:false,
+          },
+          {
+            name:"安全隐患",
+            key:"safetyHazard",
+            url:require('@/assets/ZDimages/safetyCheck/icon_gzt_aqyht.png'),
+            path:"/safetyCheck/safetyHazard",
+            type:false,
+          },
+          {
+            name:"随手拍",
+            key:"snapshotManagement",
+            url:require('@/assets/ZDimages/safetyCheck/icon_gzt_ssp.png'),
+            path:"/safetyCheck/snapshotManagement",
+            type:false,
+          },
+          {
+            name:"整改报告",
+            key:"rectificationReport",
+            url:require('@/assets/ZDimages/safetyCheck/icon_gzt_zgbg.png'),
+            path:"/safetyCheck/rectificationReport",
+            type:false,
+          },
+          {
+            name:"数据统计",
+            key:"dataStatistics",
+            url:require('@/assets/ZDimages/safetyCheck/icon_gzt_sjtj.png'),
+            path:"/safetyCheck/dataStatistics",
+            type:false,
+          },
+        ],
+      }
+    },
+    created(){
+    },
+    mounted(){
+      this.setButtonList();
+    },
+    methods:{
+      //权限查找
+      setButtonList(){
+        let self = this;
+        let localRoute = JSON.parse(localStorage.getItem("routeData"))
+        for(let x=0;x<self.buttonList.length;x++){
+          self.forRouteData(self.buttonList[x],localRoute);
+        }
+      },
+      forRouteData(item,list){
+        let self = this;
+        for(let i=0;i<list.length;i++){
+         if(item.key == list[i].path){
+           item.type = true;
+         }else{
+           if(list[i].children){
+             self.forRouteData(item,list[i].children)
+           }
+         }
+        }
+      },
+      goPage(item){
+        if(item.type){
+          this.$router.push({ path: item.path });
+        }else{
+          this.msgError('没有相关权限,请联系管理员')
+        }
+      },
+    }
+  }
+</script>
+
+<style scoped lang="scss">
+  .worktableButtonBox{
+    height:120px;
+    display: flex;
+    .for-button-box{
+      cursor: pointer;
+      width:118px;
+      position: relative;
+      img{
+        width:44px;
+        height:44px;
+        margin:24px 37px 13px;
+      }
+      .for-name{
+        font-size:16px;
+        line-height:20px;
+        text-align: center;
+      }
+      .position-p{
+        width:1px;
+        height: 30px;
+        position: absolute;
+        left:0;
+        top:45px;
+        background-color: #d8d8d8;
+      }
+    }
+  }
+</style>

vue.config.js

@@ -278,15 +278,6 @@ module.exports = {
           enforce:true,
           reuseExistingChunk: true
         },
-        safetyCheck: {
-          name: 'chunk-safetyCheck',
-          test: resolve('src/views/safetyCheck'),
-          priority: 0,
-          minSize: 0,
-          minChunks: 1,
-          enforce:true,
-          reuseExistingChunk: true
-        },
         /************新优化************/
         //基础模块
         basicsModules: {
@@ -428,6 +419,16 @@ module.exports = {
           enforce:true,
           reuseExistingChunk: true
         },
+        //化学品管理
+        safetyCheck: {
+          name: 'chunk-safetyCheck',
+          test: resolve('src/views/safetyCheck'),
+          priority: 0,
+          minSize: 0,
+          minChunks: 1,
+          enforce:true,
+          reuseExistingChunk: true
+        },
       }
     })
     config.optimization.runtimeChunk('single'),{