<template>
    <van-row class="recordList">
      <van-row class="titleWrap">
        <span class="line"></span>
        <span class="title">设备状态</span>
      </van-row>
      <el-table ref="table" :data="videoSelect"  height="180"  highlight-current-row :header-cell-style="{background:'#F5F5F5',color:'#000','font-weight':'400'}" class="table">
        <el-table-column label="设备名称"  prop="name"  show-overflow-tooltip min-width="35%" />
        <el-table-column label="安装位置"  prop="name"  show-overflow-tooltip min-width="25%" />
        <el-table-column label="设备类型"  prop="name"  show-overflow-tooltip min-width="25%" >
          <template  slot-scope="scope">
            {{scope.row.unitType == "1" ? "摄像头" : scope.row.unitType == "2" ? "打印机" : scope.row.unitType == "3" ? "考勤机" : scope.row.unitType == "4" ? "人脸识别终端" : ""}}
          </template>
        </el-table-column>
        <el-table-column label="状态" prop="status" min-width="15%">
          <template  slot-scope="scope">
              <span :class="scope.row.status == '0' ? 'color8' : 'color1'">{{scope.row.status == "0" ? "在线" : "离线" }}</span>
          </template>
        </el-table-column>
      </el-table>
    </van-row>
</template>
<script>
export default {
  data() {
    return {
      table_interval:null,
      videoSelect:[]
    };
  },
  created(){
    this.initData();
  },
  mounted() {},
  methods: {
    //初始化数据
   
    initData() {
      let arr1 = 
        {
        "unitType": "2",
        "cameraFunctions": 0,
        "name": "8楼公共打印机",
        "status": 0,
        }
      let arr2 = 
        {
        "unitType": "3",
        "cameraFunctions": 0,
        "name": "考勤机",
        "status": 0,
        }
      let arr3 = 
        {
        "unitType": "4",
        "cameraFunctions": 0,
        "name": "人脸识别终端",
        "status": 1,
        }
      axios({
          method: 'post',
          url: 'http://10.21.39.1:8082/dhController/getLocalChannel?pageNo=1&pageSize=10&unitType=1&name=1F',
          timeout: 3000,
      }).then(res =>{
          if(res.data.data.pageList){
              let data = res.data.data.pageList
              this.videoSelect = data
              for(let i = 0; i<data.length; i++){
                  this.videoSelect[i].url = "http://" + data[i].nvr_ip + ":" + data[i].hls_port + "/live/cameraid/" + data[i].deviceId + "%24" + data[i].id.split("$")[(data[i].id.split("$")).length-1]  + "/substream/1.m3u8"
                  this.videoSelect[i].url = this.videoSelect[i].url +  ',' + data[i].name
              }
              this.videoSelect.unshift(arr1)
              this.videoSelect.push(arr2)
              this.videoSelect.push(arr3)
          }
      })
    },
    //数据滚动
    dataScrolling:function(){
        let top=this.$refs.initList.bodyWrapper;
        this.table_interval=setInterval(() => {
            top.scrollTop+=1;
            if(top.clientHeight+top.scrollTop==top.scrollHeight){
              top.scrollTop=0;
            }
        }, 100);
    },
  },
};
</script>

<style lang="scss" scoped></style>
