fj-dc-ui/.svn/pristine/2b/2bf01a2abe5942d5e07e211bda865fbef3467d50.svn-base

<!--  -->
<template>
  <div>
    <!-- 查询展示 -->
    <div :style="{'height':tableHeight1+'px'}">
      <el-table
        border
        :height="tableHeight"
        ref="multipleTable"
        :data="searchResult"
        tooltip-effect="dark"
        style="width: 100%"
      >
        <el-table-column align="center" type="index" label="序号" min-width="50" fixed>
          <template slot-scope="scope">{{ (currentPage - 1) * pageSize + (scope.$index + 1) }}</template>
        </el-table-column>
        <el-table-column
          header-align="center"
          align="center"
          min-width="100"
          prop="nm"
          label="督查对象名称"
          show-overflow-tooltip
        ></el-table-column>
        <el-table-column
          header-align="center"
          align="center"
          min-width="180"
          prop="inspPblmsName"
          label="问题类别"
          show-overflow-tooltip
        ></el-table-column>
        <!--<el-table-column-->
          <!--header-align="center"-->
          <!--align="center"-->
          <!--min-width="150"-->
          <!--prop="inspPblmName"-->
          <!--label="检查事项"-->
          <!--show-overflow-tooltip-->
        <!--&gt;</el-table-column>-->
        <el-table-column
          header-align="center"
          align="center"
          min-width="180"
          prop="inspPblmDesc"
          label="详细描述"
          show-overflow-tooltip
        ></el-table-column>
        <el-table-column
          header-align="center"
          align="center"
          min-width="60"
          prop="persName"
          label="上报人"
        ></el-table-column>
        <el-table-column
          prop="collTime"
          label="上报时间"
          :formatter="timestampToTime"
          sortable
          align="center"
          min-width="100"
          show-overflow-tooltip
        ></el-table-column>
        <el-table-column
                align="center"
                prop
                min-width="130"
                label="操作"
                fixed="right"
              >
                <template slot-scope="scope">
                  <el-button icon="el-icon-view"  title="查看详情"type="text" @click="showDetails(scope.row.pblmId)"></el-button>
                </template>
              </el-table-column>
      </el-table>
      <!-- 分页 -->
      <div>
        <el-pagination
          class="paginationCenter"
          background
          @size-change="handleSizeChange"
          @current-change="search"
          :current-page.sync="currentPage"
          :page-sizes="[10, 20, 50, 100]"
          :page-size="pageSize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total"
        ></el-pagination>
      </div>
    </div>

    <!-- 详情弹框 -->
    <el-dialog
      class="outerDialog custom_dialog"
      title="问题详情"
      v-if="supervisionDetailsVisible"
      :visible.sync="supervisionDetailsVisible"
      :append-to-body="true"
    >
      <supervision-details ref="xianqing" :problemId="currentProblemId" :objType="15"></supervision-details>
      <span slot="footer">
        <el-button style="margin-top:5px;" @click="supervisionDetailsVisible = false">返回</el-button>
      </span>
    </el-dialog>

  </div>
</template>

<script>
//这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
//例如：import 《组件名称》 from '《组件路径》';
import { findPageInfo} from "../../../../../api/duChaAPI.js";
import request from "../../../../../utils/gw_ajax_request.js";
export default {
  //import引入的组件需要注入到对象中才能使用
  components: {
    //详情页
    supervisionDetails: resolve => {
      require(["../../../../duChaWenTi/supervisionDetails_shuiku.vue"], resolve);
    }
  },
  props: ["activedName","currentResCode","currentObjectRgstrId","currentObjectName","szRuls","currentObjectId","showOrEdit","swhsId"],
  data() {
    //这里存放数据
    return {
        testHeight1: window.innerHeight * 0.6,
        tableHeight: window.innerHeight * .45,
        tableHeight1: window.innerHeight * .55,
        problemList:[],
        searchResult:[],
        loading: false,
        currentPage: 1,
        pageSize: 10,
        pageNum: 1,
        total: 0,
        supervisionDetailsVisible:false,
        currentProblemId: '',
        problemDeleteVisible: false,
        deleteId: '',
        editId: '',
        changeSupervisionVisible: false,
        showAddProblemDialog: false,
        rsvrRules: null,
        probId: '',

    };
  },
  //监听属性 类似于data概念
  computed: {
      persId() {
            return localStorage.getItem("userid") ? localStorage.getItem("userid") : "1098101939614724096";
        }
  },
  //生命周期 - 创建完成（可以访问当前this实例）
  created() {

  },
  //生命周期 - 挂载完成（可以访问DOM元素）
  mounted() {
    this.search();
  },
  //监控data中的数据变化
  watch: {

  },
  //方法集合

  methods: {
    handleSizeChange(pageSize) {
      this.pageSize = pageSize;
      this.search();
    },
    // 查询
    search() {
      this.loading = true;
      let _self = this;
      let data = {};
      // data["gateName"] = "";
      // data["inspPblmName"] = "";
      data["objType"] = "15";
      data["presId"] = _self.persId;
      data["pageNum"] = _self.currentPage;
      data["regid"] = _self.currentObjectRgstrId;
      data["pageSize"] = _self.pageSize;
      data["villType"] = "15";
      // data["codes"] = _self.currentResCode;
      findPageInfo(data).then(res => {
        _self.loading = false;
        if (res.success) {
          _self.searchResult = res.data.list;
          _self.total = res.data.total;
        } else {
        }
      });
    },
    timestampToTime(row, column) {
      var date = new Date(row.collTime);
      var Y = date.getFullYear() + "-";
      var M =
        (date.getMonth() + 1 < 10
          ? "0" + (date.getMonth() + 1)
          : date.getMonth() + 1) + "-";
      var D =
        (date.getDate() < 10 ? "0" + date.getDate() : date.getDate()) + " ";
      var h =
        (date.getHours() < 10 ? "0" + date.getHours() : date.getHours()) + ":";
      var m =
        date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
      return Y + M + D + h + m;
    },
    // 详情弹框
    showDetails(id) {
      this.currentProblemId = id;
      this.supervisionDetailsVisible = true;
    },
  },
  beforeCreate() {}, //生命周期 - 创建之前
  beforeMount() {}, //生命周期 - 挂载之前
  beforeUpdate() {}, //生命周期 - 更新之前
  updated() {}, //生命周期 - 更新之后
  beforeDestroy() {}, //生命周期 - 销毁之前
  destroyed() {}, //生命周期 - 销毁完成
  activated() {} //如果页面有keep-alive缓存功能，这个函数会触发
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "../../../../duChaWenTi/base.css";
@import url("/src/assets/iconfont/iconfont.css");
@import url("/src/assets/css/mixin.scss");
.upload-container {
  width: 100%;
  position: relative;
  .image-uploader {
    width: 35%;
    float: left;
  }
  .image-preview {
    width: 200px;
    height: 200px;
    position: relative;
    border: 1px dashed #d9d9d9;
    float: left;
    // margin-left: 50px;
    .image-preview-wrapper {
      position: relative;
      width: 100%;
      height: 100%;
      img {
        width: 100%;
        height: 100%;
      }
    }
    .image-preview-action {
      position: absolute;
      width: 100%;
      height: 100%;
      left: 0;
      top: 0;
      cursor: default;
      text-align: center;
      color: #fff;
      opacity: 0;
      font-size: 20px;
      background-color: rgba(0, 0, 0, 0.5);
      transition: opacity 0.3s;
      cursor: pointer;
      text-align: center;
      line-height: 200px;
      .el-icon-delete {
        font-size: 36px;
      }
    }
    &:hover {
      .image-preview-action {
        opacity: 1;
      }
    }
  }
  .image-app-preview {
    margin-bottom: 10px;
    width: 40vh;
    height: 180px;
    position: relative;
    border: 1px dashed #d9d9d9;
    float: left;
    // margin-left: 50px;
    .app-fake-conver {
      height: 44px;
      position: absolute;
      width: 100%; // background: rgba(0, 0, 0, .1);
      text-align: center;
      line-height: 64px;
      color: #fff;
    }
  }
}
.bottom {
  margin-top: 13px;
  line-height: 12px;
}

.button {
  padding: 0;
  float: right;
}

.image {
  width: 100%;
  display: block;
}

.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
}

.clearfix:after {
  clear: both;
}
#wenTiContainer_sk .el-tree-node {
  /* overflow: auto; */
}

#wenTiContainer_sk .el-tree-node > .el-tree-node__children {
  overflow: auto;
}

.shuiku .el-date-editor.el-input {
  min-width: 180px !important;
}

.shuiku .header {
  padding: 0px 10px;
}

.shuiku .el-row {
  margin-bottom: 5px;
}

.shuiku .content {
  margin: 10px;
}

/* .search .el-table>>>.el-tooltip {
    white-space: pre-wrap !important;
    line-height: 30px;
    font-size: 0;
} */

.shuiku .search >>> .el-table .el-button:nth-child(odd) {
  margin-left: 0 !important;
}

.custom_dialog .el-dialog {
  width: 60% !important;
}

.custom_dialog .scroll300 {
  max-height: 60vh !important;
}

.shuiku .el-tag + .el-tag {
  margin-left: 10px;
}

.shuiku .button-new-tag {
  margin-left: 10px;
  height: 28px;
  line-height: 28px;
  padding-top: 0;
  padding-bottom: 0;
}

.shuiku .input-new-tag {
  width: 90px;
  margin-left: 10px;
  vertical-align: bottom;
}
</style>