portal-vue/src/views/home/Specification.vue

<template>
  <div>
    <el-card>
      <div slot="header" class="clearfix">
        <span>标准规范</span>
        <el-button class="header-more-btn" type="text" @click="showMore">更多<i class="el-icon-arrow-right" /></el-button>
      </div>
      <el-scrollbar class="spec-content">
        <el-table v-loading="loading" :data="tableData" :show-header="false">
          <el-table-column show-overflow-tooltip>
            <template slot-scope="scope">
              <el-link :underline="false" @click="showDetail(scope.row.id)">{{ scope.row.title }}</el-link>
            </template>
          </el-table-column>
          <el-table-column prop="createOrgName" width="300" show-overflow-tooltip />
          <el-table-column prop="createTime" width="150" />
        </el-table>
      </el-scrollbar>
    </el-card>
    <info-view ref="infoView" :type-data="typeData" is-home />
  </div>
</template>

<script>
import { fetchTableList } from '@/api/info'

import { hasValidRecords } from '@/utils/convert'

import InfoView from '@/views/info/InfoView'

export default {
  name: 'HomeSpec',
  components: {
    InfoView
  },
  data() {
    return {
      tableData: [],
      typeData: [{ 'id': 1, 'label': '通知通告' }, { 'id': 2, 'label': '信息交流' }, { 'id': 3, 'label': '标准规范' }],
      // others
      loading: false
    }
  },
  created() {
    this.getSpecData()
  },
  methods: {
    getSpecData() {
      this.loading = true
      const params = {
        current: 1,
        size: 50,
        delFlag: 0,
        messageType: 3
      }
      fetchTableList(params).then(response => {
        this.loading = false
        if (hasValidRecords(response)) {
          this.tableData = response.data.records
          this.total = response.data.total
        } else {
          this.tableData = []
          this.total = 0
        }
      }).catch(error => {
        console.log(error)
        this.loading = false
        this.$message({
          type: 'error',
          duration: 0,
          showClose: true,
          message: '获取标准规范列表出错: ' + error.message
        })
      })
    },
    showMore() {
      this.$router.push('/info')
    },
    showDetail(id) {
      this.$refs['infoView'].open(id)
    }
  }
}
</script>

<style lang="scss" scoped>
.spec-content{
  ::v-deep {
    .el-table {
      &::before {
        background-color: transparent !important;
      }
      td {
        border-bottom: none;
      }
    }
  }
}
</style>