<template>
  <a-layout>
    <div style="min-width: 79%; height: 100%;background-color: #ffffff">
      <div class="search-wrapper">
        <span>督查批次：{{currentRow.pPnm}}</span>
        <span>督查组：{{currentRow.pnm}}</span>
        <span>人员类型：{{tableData.length>0?'组员':''}}</span>
        <span>督查时间范围：{{tableData.length>0?(formatDate(currentRow.sttm)+'~'+formatDate(currentRow.entm)):''}}</span>
        <a-button @click="flowHasDo" type="primary" style="float: right;">我知道了</a-button>
      </div>
      <a-table
              :dataSource="tableData"
              :loading="loading"
              :style="{ height: tableHeight + 'px' }"
              :columns="columns"
              :pagination="false"
              bordered>
        <template #bodyCell="{ column, record, index }">
          <template v-if="column.dataIndex === 'index'">
            {{ (index + 1) }}
          </template>
          <template v-else>
            {{ record[column.dataIndex] }}
          </template>
        </template>
      </a-table>
    </div>
  </a-layout>
</template>

<script>
import VideoPlayer from 'vue-video-player';
import { hostUrl } from '../../utils/global_variable.js';
import request from '../../utils/gw_ajax_request.js';
import { dateFormat } from '../../utils/gw_date';
import 'video.js/dist/video-js.css';
import 'vue-video-player/src/custom-theme.css';
export default {
  data() {
    return {
      globalNo: this.$route.query.globalNo, //SLDCe8c0ae2c5f8849b9befb48b50b012cbc
      msgNo: this.$route.query.msgNo?.endsWith(localStorage.getItem('persId'))
        ? this.$route.query.msgNo.slice(
            0,
            -localStorage.getItem('persId').length,
          )
        : this.$route.query.msgNo || '', //111015012004
      tableHeight: window.innerHeight - 240,
      dxdcMainHeight: window.innerHeight - 197,
      dxdcAsideHeight: window.innerHeight - 90,
      loading: false,
      tableData: [],
      currentRow: {
        batch: '',
        pnm: '',
        adName: '',
        persType: '组员',
        dateRange: '',
      },
      total: 0,
      columns: [
        {
          title: '序号',
          slots: { customRender: 'index' },
          align: 'center',
          width: 100,
          key: 'index',
          ellipsis: true,
        },
        {
          title: '对象名称',
          dataIndex: 'nm',
          align: 'center',
          key: 'nm',
        },
        {
          title: '行政区划',
          dataIndex: 'adLoc',
          align: 'center',
          key: 'adLoc',
        },
        {
          title: '督查事项',
          dataIndex: 'typeName',
          align: 'center',
          key: 'typeName',
        },
        {
          title: '位置',
          dataIndex: 'objLoc',
          align: 'center',
          key: 'objLoc',
        },
      ],
    };
  },
  components: {
    VideoPlayer,
  },
  computed: {
    persId() {
      return localStorage.getItem('persId')
        ? localStorage.getItem('persId')
        : '';
    },
    hasPriv() {
      return hasPriv('manage');
    },
    organCode() {
      return localStorage.getItem('currentRlcode')
        ? localStorage.getItem('currentRlcode')
        : '';
    },
    organNm() {
      return localStorage.getItem('currentOrgNm')
        ? localStorage.getItem('currentOrgNm')
        : '';
    },
    isNational() {
      return this.organCode.indexOf('00') == 0;
    },
    orgId() {
      return localStorage.getItem('currentOrgId')
        ? localStorage.getItem('currentOrgId')
        : '';
    },
    hostUrl() {
      return hostUrl;
    },
  },
  created() {},
  mounted() {
    setTimeout(() => {
      this.getDcMessList();
    }, 1000);
  },
  methods: {
    getDcMessList() {
      const params = {
        id: this.$route.query.msgNo?.endsWith(localStorage.getItem('persId'))
          ? this.$route.query.msgNo.slice(
              0,
              -localStorage.getItem('persId').length,
            )
          : this.$route.query.msgNo,
      };
      this.loading = true;
      request.post(`dc/insp/allObj/getList`, params).then((res) => {
        if (res.success) {
          this.tableData = res.data;
          this.loading = false;
          if (this.tableData && this.tableData.length > 0) {
            this.currentRow = this.tableData[0];
          }
        } else {
          this.$message.error(res.message);
        }
      });
    },
    flowHasDo() {
      const params = {
        globalNo: this.globalNo,
        msgNo: this.$route.query.msgNo,
      };
      request
        .post(`/bis/insp/BisInspFlowToDo/flowHasDo`, params)
        .then((res) => {
          if (res.success) {
            this.$message.success('成功');
            this.$eventBus.emit('affairs-center', {
              type: 'closeModal',
              data: {},
            });
          } else {
            this.$message.error(res.message);
          }
        });
    },
    formatDate(tm) {
      return dateFormat(tm, 'yyyy-MM-dd HH:mm:ss');
    },
  },
};
</script>

<style lang='less' scoped>
  .search-wrapper {
    padding: 10px;
    font-weight: bold;
    font-size: 15px;
    span{
      margin-left: 50px;
    }
  }
  video{
    width: 100%;
    height:200px;
  }
</style>
