diantou/src_product/iam/audit/map/xm-audit-mapcoverage-list.vue

<template>
  <div style="padding: 20px; padding-top: 0" 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]">审计覆盖情况:{{ unitName }}</span>
    </div>
    <sd-data-table
      ref="dataTable"
      :columns="columns"
      :projectlist="true"
      :data-url="dataUrl"
      :actions="actions"
      :process-req="processReq"
      :process-res="processRes"
      :defultpagination-pagesize="50"
    >
      <template slot="islink" slot-scope="text, record">
        <a v-if="unitCode === '100000'" :title="text" @click="rowClick(record)">{{ text }}</a>
        <span v-if="unitCode !== '100000'" :title="text">{{ text }}</span>
      </template>
    </sd-data-table>
  </div>
</template>

<script>
import { Message } from 'ant-design-vue'
import TableActionTypes from '@/common/services/table-action-types'
import download from '@/common/services/download'
import MapService from './map-service.js'
import components from './_import-components/xm-audit-mapcoverage-list-import'

export default {
  name: 'XmAuditMapcoverageList',
  metaInfo: {
    title: '审计覆盖情况',
  },
  components,
  data() {
    return {
      params: null,
      columns: [],
      year: '',
      data: [],
      unitName: '',
      unitCode: '',
      actions: [
        {
          label: '导出',
          id: 'export',
          permission: null,
          type: TableActionTypes.primary,
          callback: () => {
            const params = JSON.parse(this.$route.query.params)
            // if (this.$route.query.type === 'fourYearCoverage') {
            MapService.exportCoverageList(params)
              .then((data) => {
                const url = URL.createObjectURL(data)
                download(url, '审计覆盖情况列表导出.xls')
              })
              .catch(() => {
                Message.error('导出失败')
              })
            // }
          },
        },
      ],
    }
  },
  computed: {
    dataUrl() {
      return 'api/xcoa-mobile/v1/iamtarget/getCoverageList'
    },
  },
  mounted() {
    const params = this.$route.query.params
    const year = this.$route.query.year
    this.columns.push({
      title: '序号',
      width: '80px',
    })
    this.columns.push({
      title: '单位名称',
      dataIndex: '1',
      scopedSlots: { customRender: 'islink' },
    })
    this.columns.push({ title: '单位ID', dataIndex: '2', sdHidden: true })
    this.columns.push({ title: year - 3, dataIndex: '3' })
    this.columns.push({ title: year - 2, dataIndex: '4' })
    this.columns.push({ title: year - 1, dataIndex: '5' })
    this.columns.push({ title: year, dataIndex: '6' })
  },
  methods: {
    processRes(res) {
      this.unitName = res.properties.unitName
      this.unitCode = res.properties.unitCode
      return res
    },
    processReq(req) {
      const params = JSON.parse(this.$route.query.params)
      req.data = {
        ...req.data,
        ...params,
      }
      if (req.data.pageIndex === undefined) {
        req.data.pageIndex = req.data.startPosition
      }

      if (req.data.pageSize === undefined) {
        req.data.pageSize = 10
      }
      return req
    },
    rowClick(record) {
      // 处理点击事件
      console.log(record)
      const now = new Date()
      const year = now.getFullYear()
      const param = {}
      param.type = 'gn'
      param.name = '境内'
      param.orgId = record[2]
      window.open(
        '#/xm-audit-mapcoverage-list?params=' +
          encodeURIComponent(JSON.stringify(param)) +
          '&year=' +
          year
      )
    },
  },
}
</script>

<style module lang="scss">
@use '@/common/design' as *;
.titlepoint {
  position: absolute;
  top: 12px;
  left: 20px;
  width: 8px;
  height: 27px;
  background: #1890ff;
  border-radius: 8px;
}
.toptitle {
  position: absolute;
  top: 9px;
  left: 40px;
  width: 1250px;
  font-size: 22px;
  font-weight: bold;
  color: #404040;
}
</style>