<template>
  <div id="">
    <a-layout :style="{'height':this.tableHeight+'px'}">
      <a-layout-content style="border:1px solid #d5d5ff;margin-left:5px;padding:0px;overflow-x: hidden;">
        <a-table
          :loading="loading"
          ref="multipleTable"
          :data-source="problemList"
          :columns="columns"
          row-key="pblmId"
          :pagination="false"
          :style="{height: tableHeight1 + 'px'}"
          style="width: 100%">
          <span slot="index" slot-scope="text, recode, index">
            {{ (currentPage - 1) * pageSize + (index + 1) }}
          </span>
          <span slot="collTime" slot-scope="text">
            {{ timestampToTime(text) }}
          </span>
          <span slot="action" slot-scope="text">
            <a-button icon="eye" type="link" @click="showDetails(text.pblmId)" ></a-button>
          </span>
        </a-table>
        <a-pagination
          show-size-changer
          :pageSize.sync="pageSize"
          :total="total"
          :page-size-options="['10','20', '50','100']"
          :show-total="total => `共${total}条`"
          @showSizeChange="handleSizeChange"
          @change="search"
          style="margin-top: 10px;" />
      </a-layout-content>
    </a-layout>
    <a-modal :open="supervisionDetailsVisible" title="问题详情" width="60%" class="custom_dialog">
      <supervision-details ref="xianqing" :problemId="currentProblemId"></supervision-details>
      <span slot="footer">
        <a-button style="margin-top:5px;" @click="supervisionDetailsVisible = false">返回</a-button>
      </span>
    </a-modal>
  </div>
</template>

<script>
import request from '../../../../utils/gw_ajax_request';
import { formatDateTimeD } from '../../../../utils/gw_date';
import supervisionDetails from '../../../duChaWenTi/supervisionDetails_shuiku.vue';
export default {
  props: [
    'currentObjectId',
    'currentObjectName',
    'currentObjectRgstrId',
    'isJiangXi',
  ],
  data() {
    return {
      tableHeight: window.innerHeight * 0.5,
      tableHeight1: window.innerHeight * 0.5 - 2,
      problemList: [],
      loading: false,
      currentPage: 1,
      pageSize: 10,
      pageNum: 1,
      total: 0,
      supervisionDetailsVisible: false,
      currentProblemId: '',
      problemDeleteVisible: false,
      deleteId: '',
      editId: '',
      changeSupervisionVisible: false,
      showAddProblemDialog: false,
      rsvrRules: null,
      probId: '',
      columns: [
        {
          title: '序号',
          dataIndex: 'index',
          width: 70,
          align: 'center',
          ellipsis: true,
        },
        {
          title: '督查水库问题类别',
          dataIndex: 'inspPblmsName',
          width: 140,
          align: 'center',
          ellipsis: true,
        },
        {
          title: '检查项目',
          dataIndex: 'checkPoint',
          width: 100,
          align: 'center',
          ellipsis: true,
        },
        {
          title: '详细描述',
          dataIndex: 'inspPblmName',
          width: 100,
          align: 'center',
          ellipsis: true,
        },
        {
          title: '上报时间',
          dataIndex: 'collTime',
          width: 100,
          align: 'center',
          ellipsis: true,
        },
        {
          title: '操作',
          dataIndex: 'action',
          width: 100,
          align: 'center',
          ellipsis: true,
        },
      ],
    };
  },
  components: {
    // 详情页
    supervisionDetails,
  },
  computed: {
    persId() {
      return localStorage.getItem('persId')
        ? localStorage.getItem('persId')
        : '1098101939614724096';
    },
  },
  created() {
    this.findItemByType();
  },
  mounted() {
    this.getProblemList();
  },
  methods: {
    getProblemList() {
      const problemForm = {};
      problemForm.objId = this.currentObjectId;
      problemForm.objType = '1';
      problemForm.pageNum = this.currentPage;
      problemForm.pageSize = this.pageSize;
      problemForm.presId = this.persId;
      if (this.isJiangXi) {
        problemForm['repeat'] = '0';
      }
      this.loading = true;
      request
        .post(`/dc/insp/pblm/list/${this.persId}`, problemForm)
        .then((res) => {
          if (res.success) {
            this.problemList = res.data.list;
            this.total = res.data.total;
            this.loading = false;
          }
        })
        .catch((err) => {
          this.$message.error(err);
          this.loading = false;
        });
    },
    showDetails(pblmId) {
      this.currentProblemId = pblmId;
      this.supervisionDetailsVisible = true;
    },
    changeSup(pblmId) {
      this.editId = pblmId;
      this.changeSupervisionVisible = true;
    },
    removeSuperviseOne(pblmId) {
      this.deleteId = pblmId;
      this.problemDeleteVisible = true;
    },
    deleteSuccess() {
      this.problemDeleteVisible = false;
      this.getProblemList();
    },
    search(val) {
      this.currentPage = val;
      this.getProblemList();
    },
    handleSizeChange() {},
    timestampToTime(row, column) {
      var date = new Date(row.collTime);
      var Y = date.getFullYear() + '-';
      var M =
        (date.getMonth() + 1 < 10
          ? '0' + (date.getMonth() + 1)
          : '0' + 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;
    },
    closeEditDialog() {
      this.changeSupervisionVisible = false;
    },
    findItemByType() {
      const obj = {
        tname: 'BIS_INSP_BASE_PRES_EXT',
      };
      request
        .post('/bis/insp/item/ques/info/findItemByType', obj)
        .then((res) => {
          this.rsvrRules = res.data;
        });
    },
    addProblem(item) {
      const rest = this.rsvrRules;
      this.probId = rest[0].id;
      this.showAddProblemDialog = true;
    },
    closePlDialog(val) {
      this.showAddProblemDialog = false;
      this.getProblemList();
    },
  },
};
</script>

<style lang='less' scoped>

</style>
