<template>
  <div id="bDCenter" style="width: 43%">
<!--      <icon name="chart-line" class="text-icon"></icon>-->
      <span class="text">设备基础信息</span>
      <div class="body-box">
        <dv-scroll-board :config="config" />
      </div>
  </div>
</template>

<script>
import {getAction} from "@api/manage";
export default {
  data() {
    return {
      config: {
        header: ['设备名称','生产厂家','设备规格','所在位置'],
        data: [],
        rowNum: 7, //表格行数
        headerHeight: 45,
        headerBGC: '#f0f2f3', //表头
        oddRowBGC: '#f1f1f1', //奇数行
        evenRowBGC: '#ffffff', //偶数行
        index: false,
        columnWidth: [230, 160, 160, 160],
        align: ['center','center','center','center'],
        waitTime:31536000000,
      },
      url: {
        queryDeviceStatus: "/device/buDevice/queryDeviceStatus",
      },
      currentIndex: 0, // 当前显示的行索引
    }
  },
  // mounted () {
  //   let that = this
  //   that.get()
  //   // 定时请求数据
  //   this.timer = setInterval(this.get, 1000 * 60 * 10)
  // },
  created() {
    this.get()
  },
  methods: {
    get(){
        getAction(this.url.queryDeviceStatus, {}, 'get').then((res) => {
          const { config } = this
          this.config.data = res.result
          this.config = { ...this.config }
        })
    },
  },
  // beforeDestroy () {
  //   clearInterval(this.timer)
  // }
}
</script>
<style lang="scss">
//$box-height: 400px;
//$box-width: calc(50%);
#bDCenter {
  padding: 5px;
  height: 400px;
  width: calc(50%);
  border-radius: 5px;
  .bg-color-black {
    height: 400px - 10px;
    border-radius: 5px;
  }
  .text {
    color: #000000;
    font-size: 16px;
    font-weight:bold;
  }
  .header{
    height: 45px;
    font-size: 15px;
  }
  .body-box {
    border-radius: 5px;
    overflow: hidden;
    .dv-scroll-board {
      width: 100%;
      height: 340px;
      color: #0a0000;
    }
  }
  .rows {
    overflow-y: auto; /* 允许垂直滚动 */
    position: relative; /* 确保滚动条定位正确 */
  }
  .rows::-webkit-scrollbar {
    width: 10px; /* 滚动条宽度 */
  }

  .rows::-webkit-scrollbar-track {
    background: #f1f1f1; /* 滚动条轨道背景色 */
  }

  .rows::-webkit-scrollbar-thumb {
    background: #888; /* 滚动条滑块背景色 */
    border-radius: 5px; /* 滑块边角半径 */
  }

  .rows::-webkit-scrollbar-thumb:hover {
    background: #555; /* 滑块鼠标悬停时背景色 */
  }
}

</style>
