<template>
  <div>
    <back-box>
      <template slot="title">
        <span>异常设备信息</span>
      </template>
    </back-box>
    <div class="page-content">
      <el-table :data="tableData" border style="width: 100%">
        <el-table-column
          prop="sn"
          label="设备编码"
          align="center"
          width="160"
        ></el-table-column>
        <el-table-column
          prop="type"
          label="设备类型"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="operationTime"
          label="异常类型"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="operationTime"
          label="最早发现时间"
          align="center"
          width="200"
        ></el-table-column>
        <el-table-column
          prop="operationTime"
          label="异常后答题次数"
          align="center"
        ></el-table-column>
        <el-table-column
          prop="operationTime"
          label="状态"
          align="center"
        ></el-table-column>
        <el-table-column label="操作" align="center"  width="200"
          ><template slot-scope="scoped">
            <el-link>处理</el-link></template
          ></el-table-column
        >
      </el-table>
      <div class="pagination-box">
        <el-pagination
          small=""
          layout="total,prev, pager, next"
          :hide-on-single-page="true"
          :total="total"
          @current-change="changePage"
          :current-page="page"
          :page-size="size"
        >
        </el-pagination>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      tableData: [],
      total: 0,
      page: 1,
      size: 20,
    };
  },
  created() {
    this._QueryData()
  },
  methods: {
    changePage(page) {
      this.page = page;
      this._QueryData();
    },
    async _QueryData() {
      this.loading = true;
      const {
        data = {},
        status,
        info,
      } = await this.$request.pDeviceLogList({
        page: this.page,
        size: this.size,
      });
      this.loading = false;
      if (status === 0) {
        this.tableData = (data?.list && [...data?.list]) || [];
        this.total = data.count;
      } else {
        this.$message.error(info);
      }
    },
  },
};
</script>

<style lang="scss" scoped>
.page-content {
  padding: 20px;
}
</style>