<!--消息列表-->
<template>
  <div class="iotHome-messageList">
    <div class="message-title-box">
      <p>告警消息</p>
      <p @click="goPage">更多>></p>
    </div>
    <div class="message-list-box scrollbar-box">
      <div class="message-for-box" v-for="(item,index) in newList" :key="index">
        <p>{{item.content}}</p>
        <p>{{ parseTime(item.createTime,"{y}-{m}-{d} {h}:{i}") }}</p>
      </div>
    </div>
  </div>
</template>

<script>
  import { iotAlarmLogMessages } from "@/api/iotDevice/index";
  export default {
    name: 'messageList',
    data(){
      return{
        newList:[],
      }
    },
    created(){
    },
    mounted(){
      this.iotAlarmLogMessages();

    },
    methods:{
      iotAlarmLogMessages(){
        iotAlarmLogMessages({}).then(response => {
          this.$set(this,'newList',response.data.records);
        })
      },
      //页面跳转
      goPage(){
        this.$router.push({ path: '/iotDevice/monitoringWarning/warningLog'});
      },
    },
  }
</script>

<style scoped lang="scss">
  .iotHome-messageList{
    flex:1;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    .message-title-box{
      display: flex;
      padding:20px;
      line-height:20px;
      font-size:16px;
      color:#333;
      p:nth-child(1){
        flex:1;
      }
      p:nth-child(2){
        color:#0183FA;
        cursor: pointer;
      }
    }
    .message-list-box{
      flex:1;
      padding-bottom:20px;
      .message-for-box{
        display: flex;
        p{
          color:#666;
          line-height:30px;
        }
        p:nth-child(1){
          padding-left:25px;
          flex:1;
          /*单行省略号*/
          display:block;
          overflow:hidden;
          text-overflow:ellipsis;
          white-space:nowrap;
        }
        p:nth-child(2){
          width:160px;
          text-align: right;
          padding-right:15px;
        }
      }
    }

  }
</style>
