<template>
  <div style="padding: 20px;padding-top: 0px;" class="reporttablecardxm">
    <div
      style="position: absolute; padding-top: 10px;line-height: 32px;"
      class="header_sd-header_common"
    >
      <div :class="$style.titlepoint"></div>
      <span :class="['toptitle', $style.toptitle]">损失事件列表</span>
    </div>
    <sd-data-table
      ref="dataTable"
      :class="$style.dataTable"
      :projectlist="true"
      :columns="columns"
      :data-url="dataUrl"
      row-key="INST_ID"
      :actions="actions"
      :process-req="processReq"
      :defultpagination-pagesize="50"
    >
      <template slot="islink" slot-scope="text, record">
        <a @click="rowClick(record)">{{ text }}</a>
      </template>
    </sd-data-table>
  </div>
</template>

<script>
import crossWindowWatcher from '@/common/services/cross-window-watcher'
import TableColumnTypes from '@/common/services/table-column-types'
import moment from 'moment'
import download from '@/common/services/download'
import { Message } from 'ant-design-vue'
import TableActionTypes from '@/common/services/table-action-types'
import StatisticsService from './statistics-service'
import components from './_import-components/risk-loss-event-list-import'
const columns = [
  {
    title: '序号',
    customRender: (text, record, index) => `${index + 1}`,
    width: '80px',
  },
  {
    title: '发生日期',
    dataIndex: 'HAPPEN_TIME',
    sdRender: TableColumnTypes.date,
    defaultSortOrder: 'descend',
    width: '100px',
  },
  {
    title: '事件编号',
    dataIndex: 'EVENT_CODE',
    width: '100px',
  },
  {
    title: '事件名称',
    dataIndex: 'EVENT_NAME',
    scopedSlots: { customRender: 'islink' },
    width: '100px',
  },
  {
    title: '事件类型',
    dataIndex: 'EVENT_TYPE',
    width: '150px',
  },
  {
    title: '事件性质',
    dataIndex: 'EVENT_NATURE',
    width: '180px',
  },
  {
    title: '事件描述',
    dataIndex: 'EVENT_DESC',
    width: '150px',
  },
  {
    title: '是否重大风险事件',
    dataIndex: 'IS_MAJOR_EVENT',
    width: '150px',
  },
  {
    title: '损失金额（万元）',
    dataIndex: 'LOSS_AMOUNT',
    width: '150px',
  },
  {
    title: '责任单位/部门',
    dataIndex: 'RESPONSIBLE_DEPT_NAME',
    width: '350px',
  },
  {
    title: '事件责任人',
    dataIndex: 'RESPONSIBLE_USER_NAME',
    width: '100px',
  },
  {
    title: '是否涉诉',
    dataIndex: 'IS_LITIGATION',
    width: '100px',
  },
  {
    title: '是否涉外',
    dataIndex: 'IS_OUTSIDE',
    width: '100px',
  },
  {
    title: '处置进展',
    dataIndex: 'DISPOSAL_PROGRESS',
    width: '100px',
  },
  {
    title: '当前情况描述',
    dataIndex: 'SITUATION_DESC',
    width: '150px',
  },
  {
    title: '应对措施',
    dataIndex: 'COUNTERMEASURES',
    width: '100px',
  },
  {
    title: '填报单位',
    dataIndex: 'FILLING_UNIT_NAME',
    width: '100px',
  },
  {
    title: '填报人员',
    dataIndex: 'CREATOR_NAME',
    width: '100px',
  },
  {
    title: '填报日期',
    dataIndex: 'CREATION_TIME',
    sdRender: TableColumnTypes.date,
    width: '100px',
  },
]
export default {
  name: 'RiskLossEventList',
  metaInfo: {
    title: '风险损失事件透视图',
  },
  components,
  data() {
    return {
      columns,
      data: [],
      actions: [
        {
          label: '导出',
          id: 'export',
          permission: null,
          type: TableActionTypes.primary,
          callback: () => {
            const params = JSON.parse(this.$route.query.params)
            // 审计发现统计_钻取审计发现列表导出
            StatisticsService.exportLossEventData(params)
              .then((data) => {
                const url = URL.createObjectURL(data)
                download(url, '损失事件列表导出.xls')
              })
              .catch(() => {
                Message.error('导出失败')
              })
          },
        },
      ],
    }
  },
  computed: {
    dataUrl() {
      return 'api/xcoa-mobile/v1/risk-statistics-analysis/getLossEventDrillList'
    },
  },
  methods: {
    rowClick(record) {
      let url = ''
      if ((record.FLOW_STATE === '起草') | (record.FLOW_STATE === '开始')) {
        url = `/sd-webflow/pages/draft/` + record.INST_ID
      } else {
        url = `/sd-webflow/done-pages/` + record.INST_ID
      }
      crossWindowWatcher.waitForChanged(url).then((refreshFlag) => {
        if (refreshFlag) this.refresh()
      })
    },
    isJson(str) {
      if (typeof str === 'string') {
        try {
          const obj = JSON.parse(str)
          if (typeof obj === 'object' && obj) {
            return true
          } else {
            return false
          }
        } catch (e) {
          return false
        }
      }
    },
    processRes(res) {
      if (res.data.length > 0) {
        res.data.forEach((item) => {
          if (this.isJson(item.FIND_TYPE)) {
            item.FIND_TYPE = JSON.parse(item.FIND_TYPE).text
          }
        })
      }
      return res
    },
    processReq(req) {
      const parasm = JSON.parse(this.$route.query.params)
      req.data = {
        ...req.data,
        ...parasm,
      }
      if (req.data.pageIndex === undefined) {
        req.data.pageIndex = req.data.startPosition
      }

      if (req.data.pageSize === undefined) {
        req.data.pageSize = 50
      }

      return req
    },
  },
}
</script>

<style module lang="scss">
@use '@/common/design' as *;
.titlepoint {
  background: #1890ff;
  height: 27px;
  width: 8px;
  position: fixed;
  top: 12px;
  left: 20px;
  border-radius: 8px;
}
.toptitle {
  color: #404040;
  font-weight: bold;
  font-size: 22px;
  position: fixed;
  left: 40px;
  top: 9px;
}
:global(.reporttablecardxm) {
  :global(.ant-table-body) {
    height: calc(100vh - 140px);
    overflow: auto;
  }
}
.data-table {
  table {
    width: 3500px;
  }
}
</style>
