FE-V2-PC/src/views/securityCheck/release/listPage.vue

<!--安全检查发布记录-->
<template>
  <div class="releasePage-listPage">
    <div class="releasePage-listPage-min" v-if="pageType == 1">
      <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
        <!--<el-col :span="1.5">-->
          <!--<p class="add-button-one-150"-->
             <!--style="margin-right:20px;"-->
             <!--@click="handleExport"-->
             <!--v-hasPermi="['laboratory:checkOption:export']"-->
          <!--&gt;生成整改告知书</p>-->
        <!--</el-col>-->
        <el-form-item label="整改状态" prop="zgStatus" label-width="70px">
          <el-select v-model="queryParams.zgStatus" placeholder="请选择整改状态" clearable style="width:160px;">
            <el-option label="待整改" value="0" />
            <el-option label="整改待复核" value="1" />
            <el-option label="复核未通过" value="2" />
            <el-option label="整改中" value="3" />
            <el-option label="完成" value="4" />
          </el-select>
        </el-form-item>
        <el-form-item label="实验室" prop="laboratoryName" label-width="60px">
          <el-input
            style="width:130px;"
            v-model="queryParams.laboratoryName"
            placeholder="请输入实验室"
            clearable
            size="small"
            maxLength="15"
          />
        </el-form-item>
        <el-form-item label="实验室负责人" prop="fzrName" label-width="100px">
          <el-input
            style="width:130px;"
            v-model="queryParams.fzrName"
            placeholder="请输入负责人"
            clearable
            maxLength="10"
            size="small"
          />
        </el-form-item>
        <el-form-item label="整改类型" prop="zgType" label-width="70px">
          <el-select v-model="queryParams.zgType" placeholder="请选择整改类型" clearable style="width:160px;">
            <el-option label="一般整改" value="0" />
            <el-option label="重大整改" value="1" />
          </el-select>
        </el-form-item>
        <el-form-item label="检查时间" 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">查询</p>
          <p class="reset-button-one" @click="resetQuery">重置</p>
        </el-form-item>
        <el-form-item style="float: right">
          <p class="reset-button-one" @click="backPage"><i class="el-icon-arrow-left"></i>返回</p>
        </el-form-item>
      </el-form>
      <el-table v-loading="loading" border :data="checkRecordList">
<!--        <el-table-column type="selection" width="55" align="center"/>-->
        <!--<el-table-column type="selection" width="55" align="center" />-->
        <!--<el-table-column label="创建人id" align="center" prop="id" />-->
        <el-table-column label="整改状态" align="left" prop="zgStatus" width="120">
          <template slot-scope="scope">
            <p>{{scope.row.zgStatus==0?'待整改':(scope.row.zgStatus==1?'整改待复核':(scope.row.zgStatus==2?'复核未通过':(scope.row.zgStatus==3?'整改中':(scope.row.zgStatus==4?'整改完成':''))))}}</p>
          </template>
        </el-table-column>
        <el-table-column label="实验室名称" align="left" prop="laboratoryName"  :show-overflow-tooltip="true" />
        <el-table-column label="实验楼" align="left" prop="buildingName" width="160"/>
        <el-table-column label="房间号" align="left" prop="fjNumber" width="100"/>
        <el-table-column label="实验室负责人" align="left" prop="fzrName" width="140"/>
        <el-table-column label="整改类型" align="left" prop="zgType" width="100">
          <template slot-scope="scope">{{scope.row.zgType==0?'一般整改':(scope.row.zgType==1?'重大整改':'')}}</template>
        </el-table-column>
        <el-table-column label="检查时间" align="left" prop="createTime" width="200"/>
        <el-table-column label="操作" align="left" class-name="small-padding fixed-width" width="120" v-if="tableButtonType">
          <template slot-scope="scope">
            <div class="button-box" style="display: flex;margin-left:20px;">
            <p class="table-min-button"
               @click="goPageInfo(2,scope.row)"
               v-hasPermi="['laboratory:checkRecord:query']"
            >查看</p>
            </div>
          </template>
        </el-table-column>
      </el-table>
      <pagination
        v-show="total>0"
        :total="total"
        :page.sync="queryParams.pageNum"
        :limit.sync="queryParams.pageSize"
        @pagination="getList"
      />
    </div>
    <check-record-info-page v-if="pageType == 2" :infoId="infoId"></check-record-info-page>
  </div>
</template>

<script>
  import { listJcjl } from "@/api/laboratory/release";
  import checkRecordInfoPage from "./checkRecordInfoPage.vue"
  export default {
    name: "Release",
    components: {
      checkRecordInfoPage
    },
    props:{
      checkId:{},
    },
    data() {
      return {
        tableButtonType:this.hasPermiDom(['laboratory:checkRecord:query']),
        pageType:1,
        // 遮罩层
        loading: true,
        // 选中数组
        ids: [],
        // 非单个禁用
        single: true,
        // 非多个禁用
        multiple: true,
        jcDwName:"",
        // 显示搜索条件
        showSearch: true,
        // 总条数
        total: 0,
        // 检查发布关系表格数据
        checkRecordList: [],
        // 弹出层标题
        title: "",
        // 是否显示弹出层
        open: false,
        // 查询参数
        queryParams: {
          pageNum: 1,
          pageSize:20,
          checkId: null,
          releaseDescribe: null,
          createByid: null,
        },
        // 表单参数
        form: {},
        // 表单校验
        rules: {
        },
        dateRange:[],
        infoId:"",
      };
    },
    created() {
      this.getList();
    },
    methods: {
      //页面状态切换
      goPageInfo(type,row){
        if(type == 2){
          this.pageType = 2;
          this.infoId = row.id;
        }else if(type == 1){
          this.pageType = 1;
          this.getList();
        }
      },
      backPage(){
        this.$parent.goPageInfo(1);
      },
      /** 查询检查发布关系列表 */
      getList() {
        this.loading = true;
        if(this.dateRange&&this.dateRange.length>0){
          this.queryParams.beginTime=this.dateRange[0]
          this.queryParams.endTime=this.dateRange[1]
        }else{
          this.queryParams.beginTime=null;
          this.queryParams.endTime=null
        }
        this.queryParams.ids = this.checkId;
        listJcjl(this.queryParams).then( response => {
          this.checkRecordList =  response.rows;
          this.total =  response.total;
          this.loading = false;
        });
      },
      // 取消按钮
      cancel() {
        this.open = false;
        this.reset();
      },
      // 表单重置
      reset() {
        this.form = {
          id: null,
          checkId: null,
          releaseDescribe: null,
          createByid: null,
          createBy: null,
          createTime: null,
          remark: null
        };
        this.resetForm("form");
      },
      /** 搜索按钮操作 */
      handleQuery() {
        this.queryParams.pageNum = 1;
        this.getList();
      },
      /** 重置按钮操作 */
      resetQuery() {
        this.dateRange = [];
        this.queryParams.beginTime = "";
        this.queryParams.endTime = "";
        // this.resetForm("queryForm");
        this.$set(this,'queryParams',{
          pageNum: 1,
          pageSize:20,
          zgStatus:"",
          laboratoryName: '',
          fzrName: '',
          zgType: '',
        });
        this.handleQuery();
      },
      // 多选框选中数据
      handleSelectionChange(selection) {
        let self = this;
        let list = selection.map(item => item.id);
        for(let i=0;i<self.checkRecordList.length;i++){
          if(list[0] == self.checkRecordList[i].id){
            if(self.checkRecordList[i].zgType == 1){
              this.$refs.selection.toggleRowSelection(self.checkRecordList[i],false);
              this.msgError("批量生成整改告知书只可勾选一般整改");
              return
            }
          }
        }
        if(selection[0]){
          if(!this.ids[0]){
            this.ids = selection.map(item => item.id);
            this.single = selection.length != 1;
            this.multiple = !selection.length;
            for(let i=0;i<self.checkRecordList.length;i++){
              if(list[0] == self.checkRecordList[i].id){
                self.jcDwName = self.checkRecordList[i].jcDwName;
              }
            }
          }else{
            let newId = list[list.length-1];
            let newName = "";
            let obj = {};
            for(let i=0;i<self.checkRecordList.length;i++){
              if(newId == self.checkRecordList[i].id){
                newName = self.checkRecordList[i].jcDwName;
                obj = self.checkRecordList[i];
              }
            }
            if(newName != this.jcDwName){
              this.$refs.selection.toggleRowSelection(obj,false);
              this.msgError("批量生成整改告知书只可勾选相同检查单位");
            }else{
              this.ids = selection.map(item => item.id);
              this.single = selection.length != 1;
              this.multiple = !selection.length;
            }
          }
        }else{
          this.ids = selection.map(item => item.id);
          this.single = selection.length != 1;
          this.multiple = !selection.length;
          self.jcDwName = "";
        }
      },
      /** 新增按钮操作 */
      handleAdd() {
        this.reset();
        this.open = true;
        this.title = "添加检查发布关系";
      },
      /** 修改按钮操作 */
      handleUpdate(row) {
        this.reset();
        const id = row.id || this.ids
        getRelease(id).then( response => {
          this.form =  response.data;
          this.open = true;
          this.title = "修改检查发布关系";
        });
      },
      /** 提交按钮 */
      submitForm() {
        this.$refs["form"].validate(valid => {
          if (valid) {
            if (this.form.id != null) {
              updateRelease(this.form).then( response => {
                this.msgSuccess("修改成功");
                this.open = false;
                this.getList();
              });
            } else {
              addRelease(this.form).then( response => {
                this.msgSuccess("新增成功");
                this.open = false;
                this.getList();
              });
            }
          }
        });
      },
      /** 删除按钮操作 */
      handleDelete(row) {
        const ids = row.id || this.ids;
        this.$confirm('是否确认删除检查发布关系编号为"' + ids + '"的数据项?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(function() {
          return delRelease(ids);
        }).then(() => {
          this.getList();
          this.msgSuccess("删除成功");
        }).catch(() => {});
      },
      /** 导出按钮操作 */
      handleExport() {
        if(!this.ids[0]){
          this.msgError("请选择要生成的数据")
          return
        }
        this.download('/laboratory/checkOption/genNotify/'+this.ids, {
        }, `整改告知书.docx`)
      },
    }
  };
</script>
<style scoped lang="scss">
  .releasePage-listPage{
    flex: 1;
    display: flex;
    flex-direction: column;
    overflow: hidden !important;
    .releasePage-listPage-min{
      flex: 1;
      display: flex;
      flex-direction: column;
      overflow: hidden !important;
      padding: 20px 20px 20px;
    }
  }
</style>