fj-dc-ui/.svn/pristine/3e/3ee42eaa610b7aa7e4ba05757097d83ad55e10d9.svn-base

<template>
  <el-container class="problem_list">
    <el-main style="padding: 10px 10px;">
      <div class="content_wrapper">
        <el-form ref="form" :inline="true" label-width="84px">
          <el-form-item label="附件序号">
            <el-input v-model="form.attach" placeholder="输入附件序号" clearable style="width: 140px"></el-input>
          </el-form-item>
          <el-form-item label="问题类别">
            <el-select
              v-model="form.inspPblmsName"
              clearable
              value-key="inspPblmsName"
              placeholder="请选择"
              @change="problemListChange"
              style="width:140px"
            >
              <el-option
                v-for="(item,index) in problemList"
                :key="index"
                :label="item.inspPblmsName"
                :value="item.inspPblmsName"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="检查项目">
            <el-select
              v-model="form.checkPoint"
              clearable
              value-key="checkPointName"
              placeholder="请选择"
              style="width:140px"
            >
              <el-option
                v-for="(item,index) in currentCheckPointList"
                :key="index"
                :label="item.checkPointName"
                :value="item.checkPointName"
              ></el-option>
            </el-select>
          </el-form-item>
          <!-- <el-form-item label="问题描述">
                        <el-input v-model="form.pblmsDesc" placeholder="输入问题描述" clearable style="width: 140px"></el-input>
          </el-form-item>-->
          <el-form-item label="严重程度">
            <el-select v-model="form.inspPblmCate" placeholder="请选择" style="width: 140px">
              <el-option label="一般" value="0"></el-option>
              <el-option label="较重" value="1"></el-option>
              <el-option label="严重" value="2"></el-option>
              <!-- <el-option label="特别严重" value="3"></el-option> -->
            </el-select>
          </el-form-item>
          <div class="operate_btn">
            <el-button
              style="margin-left:0;padding:7px 10px;"
              type="primary"
              @click="getProblemList()"
            >查询</el-button>
            <el-button style="margin-left:0;padding:7px 10px;" type="primary" @click="toAddFile">添加</el-button>
            <el-button type="success" @click="exPort" icon="el-icon-upload2">导出</el-button>
            <!-- <el-button style="margin-left:0;padding:7px 10px;" type="success" @click="exportExcel()">导出excel</el-button> -->
            <!-- <el-button style="margin-left:0;padding:7px 10px;" type="success" @click="exportWord()">导出word</el-button> -->
          </div>
        </el-form>
        <!-- 表格 -->
        <el-table
          :data="tableData"
          border
          stripe
          v-loading="loading"
          :height="tableHeight"
          style="width: 100%"
          @selection-change="handleSelectionChange"
        >
          <el-table-column type="selection" width="55"></el-table-column>
          <el-table-column prop="attach" label="附件序号" min-width="120" show-overflow-tooltip></el-table-column>
          <el-table-column prop="snNum" label="问题序号" min-width="100"></el-table-column>
          <el-table-column prop="inspPblmsName" label="问题类别" min-width="120"></el-table-column>
          <el-table-column prop="checkPoint" label="检查项目" min-width="120"></el-table-column>
          <el-table-column prop="pblmDesc" label="问题描述" min-width="500"></el-table-column>
          <el-table-column label="严重程度">
            <el-table-column prop="inspPblmCate" label="一般" show-overflow-tooltip min-width="60">
              <template slot-scope="scope">{{scope.row.inspPblmCate == '0' ? '√' : ''}}</template>
            </el-table-column>
            <el-table-column prop="inspPblmCate" label="较重" show-overflow-tooltip min-width="60">
              <template slot-scope="scope">{{scope.row.inspPblmCate == '1' ? '√' : ''}}</template>
            </el-table-column>
            <el-table-column prop="inspPblmCate" label="严重" show-overflow-tooltip min-width="60">
              <template slot-scope="scope">{{scope.row.inspPblmCate == '2' ? '√' : ''}}</template>
            </el-table-column>
            <!-- <el-table-column
                        prop="inspPblmCate"
                        label="特别严重"
                        show-overflow-tooltip
                        min-width="60">
                            <template slot-scope="scope">
                                {{scope.row.inspPblmCate == '3' ? '√' : ''}}
                            </template>
            </el-table-column>-->
          </el-table-column>

          <el-table-column fixed="right" label="操作" width="130">
            <template slot-scope="scope">
              <el-button type="text" size="small" @click="toEditProblem(scope.row)">编辑</el-button>
              <el-button type="text" size="small" @click="deleteProblem(scope.row)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
        <!-- 分页 -->
        <el-pagination
          style="text-align: center;"
          :pager-count="5"
          :current-page="pageIndex"
          background
          :page-size="pageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total"
          :page-sizes="[10, 20, 50, 100]"
          @current-change="pageIndexChange"
          @size-change="handleSizeChange"
        ></el-pagination>
      </div>

      <add-problem-com
        v-if="addFileVisiual"
        :titleType="titleType"
        :rowData="rowData"
        :currentNodeId="currentNodeId"
        :objId="objId"
        :listType="type"
        :pertype="pertype"
        @dialogClose="dialogClose"
      ></add-problem-com>
      <export-excel
        v-if="exportEvent"
        @dialogClose="dialogClose"
        :currentNodeId="currentNodeId"
        :listType="type"
      ></export-excel>
      <export-word
        v-if="exportWordDialog"
        @dialogClose="dialogClose"
        :problemId="problemId"
        :professionType="type"
      ></export-word>
    </el-main>
  </el-container>
</template>
<script>
import request from "@util/gw_ajax_request.js";
import { formatDateTime2 } from "@util/gw_date.js";
import addProblemCom from "./dialogCom/addInspectionProblemDcYdb.vue"; //添加
import ExportExcel from "./dialogCom/ExportExcel.vue"; //导出报表excel
import ExportWord from "./dialogCom/ExportWord.vue";
import { exportModel } from "@util/gw_exportModel"; //导出非报表
export default {
  props: [
    "currentNodeId",
    "type",
    "objId",
    "projectName",
    "pertype",
    "backStatus"
  ],
  data() {
    return {
      form: {
        checkPoint: "",
        dataStat: "",
        inspObjType: "",
        inspPblmCate: "", //问题状态(严重程度)，0：一般，1:较重，2:严重
        inspPblmsName: "", //问题类别
        checkPointName: "", //检查项目
        objInspPblms: "",
        pageNum: 1,
        pageSize: 20,
        pblmDesc: "", //问题描述
        snNum: "", //问题序号
        type: "13", //督查类型必传
        attach: "" //字段是附件(序号)
      },
      currentCheckPointList: [],
      problemList: [],
      subclassList: [],
      pblmPasi: "", //严重程度
      pblmNm: "",
      tableData: [],
      problemId: "",
      pageIndex: 1,
      pageSize: 20,
      total: 0,
      peiXunStateData: [],
      loading: false,
      addFileVisiual: false,
      modifyFileVisiual: false,
      exportEvent: false, //导出对话框v-if
      exportWordDialog: false,
      problemId: "",
      tableHeight: window.innerHeight - 200,
      dialogFormVisible: false,
      titleType: "添加",
      rowData: {} //编辑时的行数据
    };
  },
  components: {
    addProblemCom,
    ExportExcel,
    ExportWord
  },
  computed: {
    persId() {
      return localStorage.getItem("userid")
        ? localStorage.getItem("userid")
        : "1098101939614724096";
    }
  },
  mounted() {
    this.getPblmTypeMenu(); // 获取问题类型
    this.getProblemList(); //查询
  },
  activated() {},
  methods: {
    // add by luochenghai 20191129 后台获取问题类别
    getPblmTypeMenu() {
      var _self = this;
      let result = [];
      request
        .get("/dc/insp/pblms/getPblmType", {
          params: {
            type: "13",
            pguid: "13000000000000000000000000000000"
          }
        })
        .then(res => {
          if (res.success) {
            res.data.forEach(ele => {
              let haveinspPblmsName = false;
              result.forEach(inspPblm => {
                if (inspPblm["inspPblmsName"] == ele.inspPblmsName) {
                  //
                  let havechekPoint = false;
                  inspPblm["checkPoints"].forEach(chekPoint => {
                    if (chekPoint["checkPointName"] == ele.checkPoint) {
                      //
                      chekPoint["pblmDescs"].push({
                        pblmDesc: ele.pblmDesc,
                        sn: ele.sn,
                        guid: ele.guid
                      });
                      havechekPoint = true;
                    }
                  });
                  if (!havechekPoint) {
                    let newCheckPoint = {};
                    newCheckPoint["checkPointName"] = ele.checkPoint;
                    newCheckPoint["sort2"] = ele.sort2;
                    newCheckPoint["pblmDescs"] = [
                      {
                        pblmDesc: ele.pblmDesc,
                        sn: ele.sn,
                        guid: ele.guid
                      }
                    ];
                    inspPblm["checkPoints"].push(newCheckPoint);
                  }
                  haveinspPblmsName = true;
                }
              });
              if (!haveinspPblmsName) {
                let haveinspPblmsObj = {};
                haveinspPblmsObj["inspPblmsName"] = ele.inspPblmsName;
                haveinspPblmsObj["sort1"] = ele.sort1;
                haveinspPblmsObj["checkPoints"] = [
                  {
                    checkPointName: ele.checkPoint,
                    sort2: ele.sort2,
                    pblmDescs: [
                      {
                        pblmDesc: ele.pblmDesc,
                        sn: ele.sn,
                        guid: ele.guid
                      }
                    ]
                  }
                ];
                result.push(haveinspPblmsObj);
              }
            });

            _self.problemList = result;
            // console.log(_self.problemList);
          }
        });
    },
    //根据 检查项目 进行模糊查询
    problemListChange: function(item) {
      // console.log('打印出来看看'+item)
      for (var i = 0; i < this.problemList.length; i++) {
        if (this.problemList[i].inspPblmsName == item) {
          this.currentCheckPointList = this.problemList[i].checkPoints;
        }
      }
    },
    // end
    // 获取数据的函数
    getProblemList() {
      this.loading = true;
      request
        .post(`/dc/insp/pblms/getObjInspPblmsPage`, this.form)
        .then(res => {
          if (res.success) {
            this.loading = false;
            this.tableData = res.data.list;
            this.total = res.data.total;
          } else {
            this.loading = false;
            this.$message.error(res.message);
          }
        })
        .catch(err => {
          this.$message.error(err);
        });
    },

    toAddFile() {
      this.titleType = "添加";
      this.addFileVisiual = true;
    },
    //导出Excel
    exportExcel() {
      this.exportEvent = true;
    },
    //导出Word
    exportWord() {
      this.exportWordDialog = true;
    },
    toEditProblem(row) {
      this.titleType = "编辑";
      //Object.assign方法用来将源对象（source）的所有可枚举属性，复制到目标对象（target）
      Object.assign(this.rowData, row);
      this.addFileVisiual = true;
    },
    // 删除
    deleteProblem(row) {
      this.$confirm("确认删除该问题吗?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(() => {
        request.post(`/dc/insp/pblms/${row.guid}`).then(res => {
          if (res.success) {
            this.$message({
              type: "success",
              message: "删除成功!"
            });
            this.getProblemList(); //删除之后立刻重新拉取数据
          } else {
            this.$message({
              type: "error",
              message: res.message
            });
          }
        });
      });
    },
    pageIndexChange(val) {
      this.form.pageNum = val;
      this.getProblemList();
    },
    handleSizeChange(val) {
      this.form.pageSize = val;
      this.getProblemList(); //查询
    },
    dialogClose() {
      this.addFileVisiual = false;
      this.modifyFileVisiual = false;
      this.exportEvent = false;
      this.exportWordDialog = false;
      this.getProblemList(); //查询
    },
    pblmPasiChange(val) {
      this.getProblemList(); //查询
    },
    handleSelectionChange(val) {
      let problemArr = [];
      val.forEach(ele => {
        problemArr.push(ele.id);
      });
    },

    formatDate(date) {
      return formatDateTime2(date);
    },

    exPort() {
      var flag = this.$confirm("此操作导出当前页，请问是否确定导出？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      }).then(() => {
        let _self = this;
        let data = {};
        data.pageNum = _self.form.pageNum;
        data.pageSize = _self.form.pageSize;

        data.attach = _self.form.attach;
        data.snNum = _self.form.snNum;
        data.inspPblmsName = _self.form.inspPblmsName;
        data.checkPointName = _self.form.checkPointName;
        data.pblmDesc = _self.form.pblmDesc;
        data.inspPblmCate = _self.form.inspPblmCate;
        data.type = _self.form.type;
        data.isExport = "1";
        let datas = JSON.stringify(data);

        let url = `/pdcApi/dc/insp/pblms/getObjInspPblmsPage`;
        let downloadName = "淤地坝督查问题清单.xls";
        let type = "post";
        let result = exportModel(type, url, downloadName, datas);
      });
    }
  },
  watch: {
    currentNodeId(val) {
      this.getProblemList(); //查询
    },
    type(val) {
      this.getProblemList(); //查询
    },
    backStatus(val) {
      if (val) {
        //回退状态为成功时
        this.getProblemList(); //查询
      }
    }
  }
};
</script>
<style lang="scss">
.problem_list {
  .project_title {
    line-height: 50px;
    text-align: center;
    color: #333;
    border-bottom: solid 1px #eee;
  }
  h4 {
    line-height: 50px;
    color: #444;
  }
  .operate_btn {
    float: right;
    margin-bottom: 10px;
  }
  .inspPblmCate {
    padding: 2px 10px;
    border-radius: 10px;
    color: #ffffff;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
  }
  .el-form-item__label {
    font-size: large;
    color: #333;
  }
  .el-form--inline .el-form-item {
    margin-right: 6px;
  }
  .el-table__header th {
    font-size: large !important;
  }
  tr.el-table__row {
    font-size: large;
  }
}
</style>