<template>
  <div class="words_container">
    <!-- <el-row class="btn_box">
      <el-button type="primary" @click="dialogVisible = true">新增</el-button>
      <el-button @click="delWords()">删除</el-button>
    </el-row> -->
    <el-table
      ref="multipleTable"
      :data="tableData"
      tooltip-effect="dark"
      style="width: 100%"
      :row-class-name="tableRowClassName"
      :header-cell-style="{background:'#8cc3fb',color:'#fff'}"
    >
      <el-table-column
        type="index"
        align="center"
        label="序号"
        width="55"
      />
      <el-table-column
        prop="docName"
        label="文档名称"
        show-overflow-tooltip
        min-width="120"
        align="left"
      />
      <el-table-column
        prop="updateTime"
        label="更新时间"
        show-overflow-tooltip
        min-width="90"
        align="left"
      />
      <el-table-column
        label="操作"
        align="center"
        width="100"
      >
        <template slot-scope="scope">
          <el-button type="primary" size="mini" @click="downloadOperation(scope.row)">下载</el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>
<script>
export default {
  data() {
    return {
      tableData: [
        {
          index: '1',
          docName: '内蒙古自治区市场监督管理局信用监管综合系统操作手册',
          updateTime: '2026年1月13日'
        }
      ]
    }
  },
  mounted() {
  },
  methods: {
    tableRowClassName({ row, rowIndex }) {
      if (rowIndex % 2 === 1) {
        return 'warning-row'
      }
    },
    downloadOperation(row) {
      console.log(row)
      const name = row.docName + '.docx'
      window.open(process.env.NODE_ENV === '"development"' ? `/${name}` : `/aiccs/${name}`)
    }
  }
}
</script>
<style lang="scss" scoped>
  .words_container{
    margin-top:100px;
    margin-left: 400px;
    margin-right: 400px;
    .btn_box{
      padding:10px;
      margin-bottom: 15px;
      background: #fff;
      text-align: right;
    }
  }
</style>
