fj-dc-ui/.svn/pristine/30/30f6f01eafffa803be6bf201eebf6b919dbaae4d.svn-base

<template>
  <el-main class="xsd_list">
    <el-table
      v-loading="loading"
      border
      ref="multipleTable"
      :data="tableDataList"
      :height="tableHeight"
      tooltip-effect="dark"
      style="width: 100%">
      <el-table-column align="center" type="index" label="序号" min-width="40">
        <template slot-scope="scope">
          {{ (pageNum - 1) * pageSize + (scope.$index + 1) }}
        </template>
      </el-table-column>
      <el-table-column
        header-align="center"
        align="center"
        min-width="100"
        prop="hystName"
        label="督查对象名称"
        show-overflow-tooltip>
      </el-table-column>
      <el-table-column
        header-align="center"
        align="center"
        min-width="100"
        prop="adName"
        label="行政区划"
        show-overflow-tooltip>
      </el-table-column>
      <el-table-column
        align="center"
        show-overflow-tooltip
        prop="exmnType"
        label="工程类型"
        :formatter="engScalFormatter"
        min-width="80"
      ></el-table-column>
      <el-table-column
        align="center"
        show-overflow-tooltip
        label="小水电清理整改/生态流量填报状态"
        :formatter="engScalFormatter"
        min-width="100"
      >
        <template slot-scope="scope">
          {{scope.row.rectState ? dcState(scope.row.rectState) : '/'}}
        </template>
      </el-table-column>
      <el-table-column
        align="center"
        show-overflow-tooltip
        label="退出工作情况填报状态"
        :formatter="engScalFormatter"
        min-width="80"
      >
        <template slot-scope="scope">
          {{scope.row.oocState ? dcState(scope.row.oocState) : '/'}}
        </template>
      </el-table-column>
      <el-table-column
        align="center"
        show-overflow-tooltip
        label="小水电安全管理情况填报状态"
        min-width="85"
      >
        <template slot-scope="scope">
          {{scope.row.sfmngState ? dcState(scope.row.sfmngState) : '/'}}
        </template>
      </el-table-column>
      <el-table-column
        align="center"
        prop
        min-width="150"
        label="操作"
        show-overflow-tooltip
        fixed="right">
        <template slot-scope="scope">
          <el-button size="mini" type="warning"
                     v-if="ownPriv('manage') && !ifReadyOnly" @click="editTianBao(scope.row)"><i
            class="el-icon-edit"></i> 编辑
          </el-button>
          <el-button size="mini" type="danger" v-if="ownPriv('manage') &&!ifDisabled" @click="removeRow(scope.row.id)">
            <i
              class="el-icon-delete"></i> 删除
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <!-- 分页 -->
    <div class="paginationWarpper">
      <el-pagination
        class="paginationCenter"
        background
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page.sync="pageNum"
        :page-sizes="[10, 20, 50, 100]"
        :page-size="pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total">
      </el-pagination>
    </div>
    <xsdDjtb v-if="dialogProjectVisible"
             @cancelHandler="closeDialog"
             :currentObjectName="currentObjectName"
             :currentObjectId="currentObjectId"
             :rowData="rowData"
             :ifDisabled="ifDisabled"></xsdDjtb>

  </el-main>
</template>
<script>
  import request from "@util/gw_ajax_request.js";
  import {getXsdDengJiInfo} from '@api/duChaTianBao.js'
  import xsdDjtb from './xiaoshuidianDengjiTianbao/xsdDjtb'

  export default {
    components: {
      upload: resolve => {
        require(["@widget/uploadPdf.vue"], resolve);
      },
      xsdDjtb
    },
    props: ['currentObjectId', 'currentObjectRgstrId', 'currentResCode', 'type', 'name', 'ifReadyOnly', 'ifDisabled'],

    data() {
      return {
        tableHeight: 400,
        tableDataList: [
          {
            type: '1',
            name: '小水电立即退出类'
          },
          {
            type: '2',
            name: '小水电限期退出类'
          },
          {
            type: '3',
            name: '小水电保留类'
          },
          {
            type: '4',
            name: '小水电整改类'
          },
          {
            type: '5',
            name: '小水电（其他）'
          }
        ],
        loading: false,
        currentPage: 1,
        pageSize: 10,
        pageNum: 1,
        total: 0,
        dialogProjectVisible: false,
        componentId: '',  //当前弹窗加载的组件
        rowId: "",
        rowData: '',
        projectName: "",
        currentObjectName: ''
      };
    },
    computed: {
      recPersId() {
        return localStorage.getItem("userid") ? localStorage.getItem("userid") : "1098101939614724096";
      }
    },
    created() {
    },
    mounted() {
      this.getTableDataList();
    },
    methods: {
      getTableDataList() {
        let _self = this;
        let obj = {
          "rgstrId": _self.currentObjectRgstrId,
          "pageSize": _self.pageSize,
          "pageNum": _self.pageNum
        }
        getXsdDengJiInfo(obj).then(res => {
          if (res.success) {
            _self.tableDataList = res.data.list;
            _self.total = res.data.total;
          } else {
            this.$message.error(res.message)
          }
        });
      },
      engScalFormatter(row, column) {
        return row.exmnType == 1
          ? "整改类"
          : row.exmnType == 2
            ? "立即退出类"
            : row.exmnType == 3
              ? "其他"
              : row.exmnType == 4
                ? "保留类"
                : row.exmnType == 5
                  ? "限期退出"
                  : "";
      },
      cancelHandler() {
        this.$emit("cancelHandler");
      },
      handleSizeChange(val) {
        this.pageSize = val;
        this.getTableDataList();
      },
      handleCurrentChange(val) {
        this.pageNum = val;
        this.getTableDataList();
      },
      search() {
        this.getTableDataList();
      },
      addShuiKuSuccess() {
        this.search();
      },
      editTianBao(row) {
        this.currentObjectName = row.hystName;
        this.rowData = row;
        this.dialogProjectVisible = true;
      },
      removeRow(rowId) {
        this.$confirm("确认删除该数据吗?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
          request.get(`/bis/insp/hyst/info/del/${rowId}`).then(res => {
            if (res.success) {
              this.$message({
                type: "success",
                message: "删除成功!"
              });
              this.getTableDataList(); //删除之后立刻重新拉取数据
            } else {
              this.$message({
                type: "error",
                message: res.message
              });
            }
          });
        });
      },
      getMoveRow(rowId, url) {
        this.$confirm('确定要删除该工程, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          request.get(url + rowId)
            .then(res => {
              if (res.success) {
                this.$message.success("删除成功");
                this.getTableDataList();
              } else {
                this.$message.warning(res.message);
              }
            })
            .catch(err => {
              console.log(err);
            })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消删除'
          });
        });


      },
      //添加工程
      addProject() {
        this.rowId = "";
        this.titleText = "添加";
        this.dialogProjectVisible = true;
      },
      closeDialog() {
        this.dialogProjectVisible = false;
        this.getTableDataList();
      },
      dcState(val) {
        if (val == 0) {
          return '未填报'
        } else if (val == 1) {
          return '填报中'
        } else if (val == 2) {
          return '已填报'
        } else {
          return ''
        }
      }
    },
    watch: {
      projectName() {
        this.getTableDataList();
      }
    },
  }
</script>

<style lang="scss">
  .xsd_list {
    margin-left: 5px;
    padding: 0;

    .m10 {
      margin: 10px;
      text-align: right;
    }

    .w200 {
      width: 200px;
    }

    .paginationWarpper {
      margin-top: 10px;
    }
  }
</style>