zc

src/views/safetyCheck/collegeInspect/hiddenDangersReview/index.vue

@@ -20,16 +20,6 @@
               />
             </el-select>
           </el-form-item>
-          <el-form-item label="" prop="queryParamsData2">
-            <el-select v-model="queryParams.queryParamsData2" placeholder="学院单位" style="width:190px;">
-              <el-option
-                v-for="dict in optionList"
-                :key="dict.value"
-                :label="dict.label"
-                :value="dict.value"
-              />
-            </el-select>
-          </el-form-item>
           <el-form-item label="" prop="queryParamsData2">
             <el-select v-model="queryParams.queryParamsData2" placeholder="楼栋" style="width:190px;">
               <el-option

src/views/safetyCheck/collegeInspect/selfInspectionManage/index.vue

@@ -2,55 +2,115 @@
 <template>
   <div class="app-container selfInspectionManage">
     <div class="page-container selfInspectionManagePage" v-if="pageType === 1">
-      <div class="page-form-title-box">
-        <el-form :model="queryParams" class="form-box" ref="queryForm"
-                 :inline="true" style="width:100%;">
-          <el-form-item label="" prop="queryParamsData1">
-            <el-input
-              maxLength="30"
-              v-model="queryParams.queryParamsData1"
-              placeholder="请输入"
-              style="width: 200px"
-            />
-          </el-form-item>
-          <el-form-item label="" prop="queryParamsData2">
-            <el-select v-model="queryParams.queryParamsData2" placeholder="请选择" style="width: 200px">
-              <el-option
-                v-for="dict in optionList"
-                :key="dict.value"
-                :label="dict.label"
-                :value="dict.value"
+      <!--左侧计划栏-->
+      <div class="page-content-left-box">
+        <!--计划栏搜索框-->
+        <div>
+          <el-form :model="leftQueryParams" class="form-box" ref="leftQueryForm"
+                   :inline="true" style="width:100%;">
+            <el-form-item label="" prop="leftQueryParamsData1">
+              <el-input
+                maxLength="30"
+                v-model="leftQueryParams.leftQueryParamsData1"
+                placeholder="计划标题"
+                clearable
+                @clear="leftClear"
+                style="width: 390px"
               />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="" prop="state">
-            <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>
-          <p class="page-inquire-common-style-button" @click="handleQuery">查询</p>
-          <p class="page-reset-common-style-button" @click="resetQuery">重置</p>
-          <p class="page-submit-common-style-button"
-             style="float: right;"
-             @click="tableButton(1)"
-             v-hasPermiRouter="['demo:demo:add']"
-          >新增</p>
-        </el-form>
+            </el-form-item>
+            <p class="page-save-common-style-button" style="width:80px;display: inline-block" @click="leftHandleQuery">查询</p>
+          </el-form>
+        </div>
+        <!--计划栏列表-->
+        <div class="left-list-box">
+          <div class="left-list-for-max-big-box" v-for="(bigItem,bigIndex) in leftListData" :key="bigIndex">
+            <div class="left-list-title-box" @click="leftBigCheckButton(bigIndex)">
+              <p :class="bigIndex == leftBigCheckType?'el-icon-caret-bottom':'el-icon-caret-right'"></p>
+              <p>{{bigItem.leftData1}}</p>
+              <p>{{bigItem.leftData2}}</p>
+            </div>
+            <div class="left-list-box">
+              <div class="left-list-for-box" v-if="bigIndex == leftBigCheckType"
+                   @click="leftCheckButton(index)"
+                   :class="index == leftCheckType ? 'check-left-list-for-box':''"
+                   v-for="(item,index) in bigItem.leftDataList" :key="index">
+                <div class="left-list-text-box">
+                  <p>{{item.leftDataListData1}}</p>
+                  <p>检查开始时间：{{parseTime(item.leftDataListData2,"{y}-{m}-{d}")}}</p>
+                </div>
+                <div class="left-list-progress-box">
+                  <el-progress :stroke-width="14" :percentage="item.leftDataListData4"></el-progress>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
       </div>
-      <div class="page-conten-box">
-        <div class="page-content-left-box">
-
+      <div class="page-content-center-box"></div>
+      <!--右侧数据表格-->
+      <div class="page-content-right-box">
+        <div class="page-form-title-box" style="border:none;" :class="advancedType?'page-advanced-form-title-box':''">
+          <el-form :model="queryParams" class="form-box" ref="queryForm"
+                   :inline="true" style="width:100%;">
+            <div class="table-school-college-toggle-box">
+              <p :class="tableButtonCheckType==1?'p-check':''" @click="tableCheck(1)">全部</p>
+              <p :class="tableButtonCheckType==2?'p-check':''" @click="tableCheck(2)">待检查</p>
+              <p :class="tableButtonCheckType==3?'p-check':''" @click="tableCheck(3)">检查中</p>
+              <p :class="tableButtonCheckType==4?'p-check':''" @click="tableCheck(4)">已检查</p>
+            </div>
+            <el-form-item label="" prop="queryParamsData2">
+              <el-select v-model="queryParams.queryParamsData2" placeholder="楼栋" style="width:150px;">
+                <el-option
+                  v-for="dict in optionList"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="" prop="queryParamsData1">
+              <el-input
+                maxLength="30"
+                v-model="queryParams.queryParamsData1"
+                placeholder="实验室/房间号"
+                style="width:155px;"
+              />
+            </el-form-item>
+            <el-form-item label="" prop="queryParamsData2" v-if="advancedType">
+              <el-select v-model="queryParams.queryParamsData2" placeholder="安全分类" style="width:175px;">
+                <el-option
+                  v-for="dict in optionList"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="" prop="queryParamsData2" v-if="advancedType">
+              <el-select v-model="queryParams.queryParamsData2" placeholder="安全分级" style="width:175px;">
+                <el-option
+                  v-for="dict in optionList"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                />
+              </el-select>
+            </el-form-item>
+            <!--与我相关-->
+            <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">与我相关</p>
+                  <p class="el-icon-check icon-p-me" v-if="queryParams.myRelated==1"></p>
+                </div>
+              </div>
+            </div>
+            <p class="page-inquire-common-style-button" @click="handleQuery">查询</p>
+            <p class="page-reset-common-style-button" @click="resetQuery">重置</p>
+            <p class="page-save-common-style-button" style="display: inline-block;margin-left:10px;" @click="searchToggle">{{advancedType?'普通搜索':'高级搜索'}}</p>
+          </el-form>
         </div>
-        <div class="page-content-center-box"></div>
-        <div class="page-content-right-box">
+        <div class="page-conten-box page-content-right-bottom-box">
           <el-table class="table-box" v-loading="loading" border :data="dataList">
             <el-table-column label="名称" prop="name"  show-overflow-tooltip/>
             <el-table-column label="内容" prop="content" width="200" show-overflow-tooltip/>
@@ -124,25 +184,36 @@
         tableButtonType:this.hasPermiDom(['demo:demo:detail','demo:demo:edit','demo:demo:del',]),
         //页面状态
         pageType:1,
+        //复查状态选项卡
+        tableButtonCheckType:1,
         //页面遮罩
         loading:false,
         //下拉列表数据
         optionList:[{value:true,label:'启用'},{value:false,label:'停用'}],
+        //计划查询条件
+        leftQueryParams:{
+          leftQueryParamsData1:'',
+        },
         //查询条件
         queryParams:{
           page:1,
           pageSize:20,
+          myRelated:1,
           queryParamsData1:"",
           queryParamsData2 :null,
         },
         //时间数据
         dateRange:[],
+        //搜索模式切换
+        advancedType:false,
         //列表数据
         dataList:[],
         //数据数量
         total:0,
         //组件传参
         propsData:{},
+        leftBigCheckType:"0",
+        leftCheckType:"0",
         leftListData:[
           {
             leftData1:'计划名称计划名称计划名称计划名称',
@@ -152,14 +223,33 @@
               {
                 leftDataListData1:'第一次检查',
                 leftDataListData2:'2024-08-06T11:06:57',
-                leftDataListData3:50,
-                leftDataListData4:'11',
+                leftDataListData3:'11',
+                leftDataListData4:50,
               },
               {
                 leftDataListData1:'第二次检查',
                 leftDataListData2:'2024-08-06T11:06:57',
-                leftDataListData3:60,
-                leftDataListData4:'12',
+                leftDataListData3:'12',
+                leftDataListData4:60,
+              },
+            ],
+          },
+          {
+            leftData1:'计划名称计划名称计划名称计划名称',
+            leftData2:'检查类型',
+            leftData3:'2',
+            leftDataList:[
+              {
+                leftDataListData1:'第一次检查',
+                leftDataListData2:'2024-08-06T11:06:57',
+                leftDataListData3:'21',
+                leftDataListData4:50,
+              },
+              {
+                leftDataListData1:'第二次检查',
+                leftDataListData2:'2024-08-06T11:06:57',
+                leftDataListData3:'22',
+                leftDataListData4:60,
               },
             ],
           }
@@ -173,6 +263,48 @@
       //this.getList();
     },
     methods: {
+      //左侧清除查询按钮
+      leftClear(){
+        this.$set(this.leftQueryParams,'leftQueryParamsData1','');
+        this.$set(this,'leftBigCheckType',0);
+        this.$set(this,'leftCheckType',0);
+      },
+      //左侧查询按钮
+      leftHandleQuery(){
+        this.$set(this,'leftBigCheckType',0);
+        this.$set(this,'leftCheckType',0);
+      },
+      //左侧计划切换
+      leftBigCheckButton(index){
+        if(this.leftBigCheckType !== index){
+          this.$set(this,'leftBigCheckType',index);
+          this.$set(this,'leftCheckType',0);
+          this.resetQuery();
+        }
+      },
+      //左侧计划子级切换
+      leftCheckButton(index){
+        if(this.leftCheckType !== index){
+          this.$set(this,'leftCheckType',index);
+          this.resetQuery();
+        }
+      },
+      //复查状态选项卡切换
+      tableCheck(type){
+        if (this.tableButtonCheckType !== type){
+          this.$set(this,'tableButtonCheckType',type);
+          this.resetQuery();
+        }
+      },
+      //搜索模式切换
+      searchToggle(){
+        this.$set(this,'advancedType',!this.advancedType);
+      },
+      //与我相关按钮
+      topRightClickType(){
+        this.$set(this.queryParams,'myRelated',this.queryParams.myRelated==1?0:1);
+        this.handleQuery();
+      },
       //查询按钮
       handleQuery(){
         this.$set(this.queryParams,'page',1);
@@ -184,6 +316,7 @@
         this.$set(this,'queryParams',{
           page:1,
           pageSize:20,
+          myRelated:1,
           queryParamsData1:"",
           queryParamsData2 :null,
         });
@@ -264,25 +397,161 @@
 <style scoped lang="scss">
   .selfInspectionManage{
     .selfInspectionManagePage{
-      .page-conten-box{
-        overflow: hidden;
+      overflow: hidden;
+      display: flex;
+      flex-direction: row;
+      flex:1;
+
+      .page-content-left-box{
+        width: 480px;
+        margin:20px;
+        .left-list-box{
+          .left-list-for-max-big-box{
+            .left-list-title-box{
+              cursor: pointer;
+              display: flex;
+              p{
+                height:30px;
+                line-height:30px;
+                margin:15px 0;
+              }
+              p:nth-child(1){
+                font-size:16px;
+                width:30px;
+              }
+              p:nth-child(2){
+                font-size:16px;
+                flex:1;
+                /*单行省略号*/
+                display:block;
+                overflow:hidden;
+                text-overflow:ellipsis;
+                white-space:nowrap;
+              }
+              p:nth-child(3){
+                font-size:14px;
+                width:80px;
+                height:30px;
+                text-align: center;
+                color:#fff;
+                background-color: #0183FA;
+                border-radius:4px;
+              }
+            }
+            .left-list-box{
+              .left-list-for-box{
+                cursor: pointer;
+                display: flex;
+                height:70px;
+                background-color: #F5F5F5;
+                padding:5px 23px;
+                .left-list-text-box{
+                  width:240px;
+                  p{
+                    height:30px;
+                    line-height: 30px;
+                    font-size:16px;
+                  }
+                  p:nth-child(2){
+                    color:#666666;
+                  }
+                }
+                .left-list-progress-box{
+                  flex:1;
+                  padding-top:15px;
+                }
+              }
+              .check-left-list-for-box{
+                background: rgba(1,131,250,0.1);
+              }
+            }
+          }
+        }
+      }
+      .page-content-center-box{
+        margin:20px 0;
+        border-right:1px dashed #dedede;
+      }
+      .page-content-right-box{
         display: flex;
-        flex-direction: row;
+        flex-direction: column;
+        overflow: hidden;
         flex:1;
-        .page-content-left-box{
-          width: 480px;
-          margin:20px;
-        }
-        .page-content-center-box{
-          margin:20px 0;
-          border-right:1px dashed #dedede;
-        }
-        .page-content-right-box{
+        .page-content-right-bottom-box{
           display: flex;
+          flex-direction: column;
           overflow: hidden;
           flex:1;
-          margin:20px;
-
+          padding:0 20px 20px;
+        }
+      }
+      .table-school-college-toggle-box{
+        overflow: hidden;
+        display: inline-block;
+        margin-right:10px;
+        p{
+          display: inline-block;
+          text-align: center;
+          width:80px;
+          line-height:40px;
+          height:40px;
+          color:#333;
+          background-color: #fff;
+          border:1px solid #E0E0E0;
+          font-size:14px;
+          cursor: pointer;
+        }
+        p:nth-child(1){
+          border-top-left-radius: 4px;
+          border-bottom-left-radius: 4px;
+          /*border-right:none;*/
+        }
+        p:nth-child(4){
+          border-top-right-radius: 4px;
+          border-bottom-right-radius: 4px;
+          /*border-left:none;*/
+        }
+        .p-check{
+          border:1px solid #0183FA;
+          background-color: #0183FA;
+          color:#fff;
+        }
+      }
+      .form-button-max-big-box-me{
+        display: inline-block;
+        overflow: hidden;
+        margin-right:10px;
+        .form-button-big-box-me{
+          display: flex;
+          div{
+            position: relative;
+            height:40px;
+            width:100px;
+            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;
+          }
         }
       }
     }

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

@@ -2,102 +2,178 @@
 <template>
   <div class="app-container inspectManage">
     <div class="page-container inspectManagePage" v-if="pageType === 1">
-      <div class="page-form-title-box">
-        <el-form :model="queryParams" class="form-box" ref="queryForm"
-                 :inline="true" style="width:100%;">
-          <el-form-item label="" prop="queryParamsData1">
-            <el-input
-              maxLength="30"
-              v-model="queryParams.queryParamsData1"
-              placeholder="请输入"
-              style="width: 200px"
-            />
-          </el-form-item>
-          <el-form-item label="" prop="queryParamsData2">
-            <el-select v-model="queryParams.queryParamsData2" placeholder="请选择" style="width: 200px">
-              <el-option
-                v-for="dict in optionList"
-                :key="dict.value"
-                :label="dict.label"
-                :value="dict.value"
+      <!--左侧计划栏-->
+      <div class="page-content-left-box">
+        <!--计划栏搜索框-->
+        <div>
+          <el-form :model="leftQueryParams" class="form-box" ref="leftQueryForm"
+                   :inline="true" style="width:100%;">
+            <el-form-item label="" prop="leftQueryParamsData1">
+              <el-input
+                maxLength="30"
+                v-model="leftQueryParams.leftQueryParamsData1"
+                placeholder="计划标题"
+                clearable
+                @clear="leftClear"
+                style="width: 390px"
               />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="" prop="state">
-            <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>
-          <p class="page-inquire-common-style-button" @click="handleQuery">查询</p>
-          <p class="page-reset-common-style-button" @click="resetQuery">重置</p>
-          <p class="page-submit-common-style-button"
-             style="float: right;"
-             @click="tableButton(1)"
-             v-hasPermiRouter="['demo:demo:add']"
-          >新增</p>
-        </el-form>
+            </el-form-item>
+            <p class="page-save-common-style-button" style="width:80px;display: inline-block" @click="leftHandleQuery">查询</p>
+          </el-form>
+        </div>
+        <!--计划栏列表-->
+        <div class="left-list-box">
+          <div class="left-list-for-max-big-box" v-for="(bigItem,bigIndex) in leftListData" :key="bigIndex">
+            <div class="left-list-title-box" @click="leftBigCheckButton(bigIndex)">
+              <p :class="bigIndex == leftBigCheckType?'el-icon-caret-bottom':'el-icon-caret-right'"></p>
+              <p>{{bigItem.leftData1}}</p>
+              <p>{{bigItem.leftData2}}</p>
+            </div>
+            <div class="left-list-box">
+              <div class="left-list-for-box" v-if="bigIndex == leftBigCheckType"
+                   @click="leftCheckButton(index)"
+                   :class="index == leftCheckType ? 'check-left-list-for-box':''"
+                   v-for="(item,index) in bigItem.leftDataList" :key="index">
+                <div class="left-list-text-box">
+                  <p>{{item.leftDataListData1}}</p>
+                  <p>检查开始时间：{{parseTime(item.leftDataListData2,"{y}-{m}-{d}")}}</p>
+                </div>
+                <div class="left-list-progress-box">
+                  <el-progress :stroke-width="14" :percentage="item.leftDataListData4"></el-progress>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
       </div>
-      <div class="page-content-box">
-        <el-table class="table-box" v-loading="loading" border :data="dataList">
-          <el-table-column label="名称" prop="name"  show-overflow-tooltip/>
-          <el-table-column label="内容" prop="content" width="200" show-overflow-tooltip/>
-          <el-table-column label="状态" prop="state" width="100" show-overflow-tooltip>
-            <template slot-scope="scope">
-              <el-switch
-                @click.native="tableButton(5,scope.row)"
-                class="switch captcha-img"
-                :active-value="true"
-                :inactive-value="false"
-                active-color="#0183FA"
-                inactive-color="#999"
-                v-model="scope.row.state"
-                active-text="启用"
-                inactive-text="停用"
-                disabled
-              ></el-switch>
-            </template>
-          </el-table-column>
-          <el-table-column label="创建时间" prop="createTime" width="200" show-overflow-tooltip>
-            <template slot-scope="scope">
-              <span>{{ parseTime(scope.row.createTime,"{y}-{m}-{d} {h}:{i}") }}</span>
-            </template>
-          </el-table-column>
-          <el-table-column label="操作" width="200" show-overflow-tooltip v-if="tableButtonType">
-            <template slot-scope="scope">
-              <div class="table-button-box">
-                <p class="table-button-null"></p>
-                <p class="table-button-p"
-                   @click="tableButton(2,scope.row)"
-                   v-hasPermiRouter="['demo:demo:detail']"
-                >详情</p>
-                <p class="table-button-p"
-                   @click="tableButton(3,scope.row)"
-                   v-hasPermiRouter="['demo:demo:edit']"
-                >编辑</p>
-                <p class="table-button-p"
-                   @click="tableButton(4,scope.row)"
-                   v-hasPermiRouter="['demo:demo:del']"
-                >删除</p>
-                <p class="table-button-null"></p>
+      <div class="page-content-center-box"></div>
+      <!--右侧数据表格-->
+      <div class="page-content-right-box">
+        <div class="page-form-title-box" style="border:none;" :class="advancedType?'page-advanced-form-title-box':''">
+          <el-form :model="queryParams" class="form-box" ref="queryForm"
+                   :inline="true" style="width:100%;">
+            <div class="table-school-college-toggle-box">
+              <p :class="tableButtonCheckType==1?'p-check':''" @click="tableCheck(1)">全部</p>
+              <p :class="tableButtonCheckType==2?'p-check':''" @click="tableCheck(2)">待检查</p>
+              <p :class="tableButtonCheckType==3?'p-check':''" @click="tableCheck(3)">检查中</p>
+              <p :class="tableButtonCheckType==4?'p-check':''" @click="tableCheck(4)">已检查</p>
+            </div>
+            <el-form-item label="" prop="queryParamsData2">
+              <el-select v-model="queryParams.queryParamsData2" placeholder="学院单位" style="width:157px;">
+                <el-option
+                  v-for="dict in optionList"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="" prop="queryParamsData2">
+              <el-select v-model="queryParams.queryParamsData2" placeholder="楼栋" style="width:150px;">
+                <el-option
+                  v-for="dict in optionList"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="" prop="queryParamsData2" v-if="advancedType">
+              <el-select v-model="queryParams.queryParamsData2" placeholder="安全分类" style="width:175px;">
+                <el-option
+                  v-for="dict in optionList"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="" prop="queryParamsData2" v-if="advancedType">
+              <el-select v-model="queryParams.queryParamsData2" placeholder="安全分级" style="width:175px;">
+                <el-option
+                  v-for="dict in optionList"
+                  :key="dict.value"
+                  :label="dict.label"
+                  :value="dict.value"
+                />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="" prop="queryParamsData1" v-if="advancedType">
+              <el-input
+                maxLength="30"
+                v-model="queryParams.queryParamsData1"
+                placeholder="实验室/房间号"
+                style="width:170px;"
+              />
+            </el-form-item>
+            <!--与我相关-->
+            <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">与我相关</p>
+                  <p class="el-icon-check icon-p-me" v-if="queryParams.myRelated==1"></p>
+                </div>
               </div>
-            </template>
-          </el-table-column>
-        </el-table>
-        <pagination :page-sizes="[20, 30, 40, 50]"
-                    v-show="total>0"
-                    :total="total"
-                    :page.sync="queryParams.page"
-                    :limit.sync="queryParams.pageSize"
-                    @pagination="getList"
-        />
+            </div>
+            <p class="page-inquire-common-style-button" @click="handleQuery">查询</p>
+            <p class="page-reset-common-style-button" @click="resetQuery">重置</p>
+            <p class="page-save-common-style-button" style="display: inline-block;margin-left:10px;" @click="searchToggle">{{advancedType?'普通搜索':'高级搜索'}}</p>
+          </el-form>
+        </div>
+        <div class="page-conten-box page-content-right-bottom-box">
+          <el-table class="table-box" v-loading="loading" border :data="dataList">
+            <el-table-column label="名称" prop="name"  show-overflow-tooltip/>
+            <el-table-column label="内容" prop="content" width="200" show-overflow-tooltip/>
+            <el-table-column label="状态" prop="state" width="100" show-overflow-tooltip>
+              <template slot-scope="scope">
+                <el-switch
+                  @click.native="tableButton(5,scope.row)"
+                  class="switch captcha-img"
+                  :active-value="true"
+                  :inactive-value="false"
+                  active-color="#0183FA"
+                  inactive-color="#999"
+                  v-model="scope.row.state"
+                  active-text="启用"
+                  inactive-text="停用"
+                  disabled
+                ></el-switch>
+              </template>
+            </el-table-column>
+            <el-table-column label="创建时间" prop="createTime" width="200" show-overflow-tooltip>
+              <template slot-scope="scope">
+                <span>{{ parseTime(scope.row.createTime,"{y}-{m}-{d} {h}:{i}") }}</span>
+              </template>
+            </el-table-column>
+            <el-table-column label="操作" width="200" show-overflow-tooltip v-if="tableButtonType">
+              <template slot-scope="scope">
+                <div class="table-button-box">
+                  <p class="table-button-null"></p>
+                  <p class="table-button-p"
+                     @click="tableButton(2,scope.row)"
+                     v-hasPermiRouter="['demo:demo:detail']"
+                  >详情</p>
+                  <p class="table-button-p"
+                     @click="tableButton(3,scope.row)"
+                     v-hasPermiRouter="['demo:demo:edit']"
+                  >编辑</p>
+                  <p class="table-button-p"
+                     @click="tableButton(4,scope.row)"
+                     v-hasPermiRouter="['demo:demo:del']"
+                  >删除</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.page"
+                      :limit.sync="queryParams.pageSize"
+                      @pagination="getList"
+          />
+        </div>
       </div>
     </div>
     <!--<add-page :propsData="propsData" v-if="pageType === 2"></add-page>-->
@@ -118,25 +194,76 @@
         tableButtonType:this.hasPermiDom(['demo:demo:detail','demo:demo:edit','demo:demo:del',]),
         //页面状态
         pageType:1,
+        //复查状态选项卡
+        tableButtonCheckType:1,
         //页面遮罩
         loading:false,
         //下拉列表数据
         optionList:[{value:true,label:'启用'},{value:false,label:'停用'}],
+        //计划查询条件
+        leftQueryParams:{
+          leftQueryParamsData1:'',
+        },
         //查询条件
         queryParams:{
           page:1,
           pageSize:20,
+          myRelated:1,
           queryParamsData1:"",
           queryParamsData2 :null,
         },
         //时间数据
         dateRange:[],
+        //搜索模式切换
+        advancedType:false,
         //列表数据
         dataList:[],
         //数据数量
         total:0,
         //组件传参
         propsData:{},
+        leftBigCheckType:"0",
+        leftCheckType:"0",
+        leftListData:[
+          {
+            leftData1:'计划名称计划名称计划名称计划名称',
+            leftData2:'检查类型',
+            leftData3:'1',
+            leftDataList:[
+              {
+                leftDataListData1:'第一次检查',
+                leftDataListData2:'2024-08-06T11:06:57',
+                leftDataListData3:'11',
+                leftDataListData4:50,
+              },
+              {
+                leftDataListData1:'第二次检查',
+                leftDataListData2:'2024-08-06T11:06:57',
+                leftDataListData3:'12',
+                leftDataListData4:60,
+              },
+            ],
+          },
+          {
+            leftData1:'计划名称计划名称计划名称计划名称',
+            leftData2:'检查类型',
+            leftData3:'2',
+            leftDataList:[
+              {
+                leftDataListData1:'第一次检查',
+                leftDataListData2:'2024-08-06T11:06:57',
+                leftDataListData3:'21',
+                leftDataListData4:50,
+              },
+              {
+                leftDataListData1:'第二次检查',
+                leftDataListData2:'2024-08-06T11:06:57',
+                leftDataListData3:'22',
+                leftDataListData4:60,
+              },
+            ],
+          }
+        ],
       }
     },
     created () {
@@ -146,6 +273,48 @@
       //this.getList();
     },
     methods: {
+      //左侧清除查询按钮
+      leftClear(){
+        this.$set(this.leftQueryParams,'leftQueryParamsData1','');
+        this.$set(this,'leftBigCheckType',0);
+        this.$set(this,'leftCheckType',0);
+      },
+      //左侧查询按钮
+      leftHandleQuery(){
+        this.$set(this,'leftBigCheckType',0);
+        this.$set(this,'leftCheckType',0);
+      },
+      //左侧计划切换
+      leftBigCheckButton(index){
+        if(this.leftBigCheckType !== index){
+          this.$set(this,'leftBigCheckType',index);
+          this.$set(this,'leftCheckType',0);
+          this.resetQuery();
+        }
+      },
+      //左侧计划子级切换
+      leftCheckButton(index){
+        if(this.leftCheckType !== index){
+          this.$set(this,'leftCheckType',index);
+          this.resetQuery();
+        }
+      },
+      //复查状态选项卡切换
+      tableCheck(type){
+        if (this.tableButtonCheckType !== type){
+          this.$set(this,'tableButtonCheckType',type);
+          this.resetQuery();
+        }
+      },
+      //搜索模式切换
+      searchToggle(){
+        this.$set(this,'advancedType',!this.advancedType);
+      },
+      //与我相关按钮
+      topRightClickType(){
+        this.$set(this.queryParams,'myRelated',this.queryParams.myRelated==1?0:1);
+        this.handleQuery();
+      },
       //查询按钮
       handleQuery(){
         this.$set(this.queryParams,'page',1);
@@ -157,6 +326,7 @@
         this.$set(this,'queryParams',{
           page:1,
           pageSize:20,
+          myRelated:1,
           queryParamsData1:"",
           queryParamsData2 :null,
         });
@@ -237,6 +407,163 @@
 <style scoped lang="scss">
   .inspectManage{
     .inspectManagePage{
+      overflow: hidden;
+      display: flex;
+      flex-direction: row;
+      flex:1;
+
+      .page-content-left-box{
+        width: 480px;
+        margin:20px;
+        .left-list-box{
+          .left-list-for-max-big-box{
+            .left-list-title-box{
+              cursor: pointer;
+              display: flex;
+              p{
+                height:30px;
+                line-height:30px;
+                margin:15px 0;
+              }
+              p:nth-child(1){
+                font-size:16px;
+                width:30px;
+              }
+              p:nth-child(2){
+                font-size:16px;
+                flex:1;
+                /*单行省略号*/
+                display:block;
+                overflow:hidden;
+                text-overflow:ellipsis;
+                white-space:nowrap;
+              }
+              p:nth-child(3){
+                font-size:14px;
+                width:80px;
+                height:30px;
+                text-align: center;
+                color:#fff;
+                background-color: #0183FA;
+                border-radius:4px;
+              }
+            }
+            .left-list-box{
+              .left-list-for-box{
+                cursor: pointer;
+                display: flex;
+                height:70px;
+                background-color: #F5F5F5;
+                padding:5px 23px;
+                .left-list-text-box{
+                  width:240px;
+                  p{
+                    height:30px;
+                    line-height: 30px;
+                    font-size:16px;
+                  }
+                  p:nth-child(2){
+                    color:#666666;
+                  }
+                }
+                .left-list-progress-box{
+                  flex:1;
+                  padding-top:15px;
+                }
+              }
+              .check-left-list-for-box{
+                background: rgba(1,131,250,0.1);
+              }
+            }
+          }
+        }
+      }
+      .page-content-center-box{
+        margin:20px 0;
+        border-right:1px dashed #dedede;
+      }
+      .page-content-right-box{
+        display: flex;
+        flex-direction: column;
+        overflow: hidden;
+        flex:1;
+        .page-content-right-bottom-box{
+          display: flex;
+          flex-direction: column;
+          overflow: hidden;
+          flex:1;
+          padding:0 20px 20px;
+        }
+      }
+      .table-school-college-toggle-box{
+        overflow: hidden;
+        display: inline-block;
+        margin-right:10px;
+        p{
+          display: inline-block;
+          text-align: center;
+          width:80px;
+          line-height:40px;
+          height:40px;
+          color:#333;
+          background-color: #fff;
+          border:1px solid #E0E0E0;
+          font-size:14px;
+          cursor: pointer;
+        }
+        p:nth-child(1){
+          border-top-left-radius: 4px;
+          border-bottom-left-radius: 4px;
+          /*border-right:none;*/
+        }
+        p:nth-child(4){
+          border-top-right-radius: 4px;
+          border-bottom-right-radius: 4px;
+          /*border-left:none;*/
+        }
+        .p-check{
+          border:1px solid #0183FA;
+          background-color: #0183FA;
+          color:#fff;
+        }
+      }
+      .form-button-max-big-box-me{
+        display: inline-block;
+        overflow: hidden;
+        margin-right:10px;
+        .form-button-big-box-me{
+          display: flex;
+          div{
+            position: relative;
+            height:40px;
+            width:100px;
+            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;
+          }
+        }
+      }
 
     }
   }