<template>
  <div class="alarm-overlay">
    <AlertModal
      v-if="pageType == 1"
      :AlertModalData="AlertModalData"
      @close="$emit('close')"/>
    <emergency
      v-if="pageType == 2"
      :alarmData="alarmData"
      @close="$emit('close')"
    />
  </div>
</template>

<script>
import AlertModal from './AlertModal.vue'
import emergency from './emergency.vue'

export default {
  name: 'AlarmWindow',
  components: { AlertModal,emergency },
  props: {
    alarmData: {
      type: Object,
      default: () => ({})
    }
  },
  data(){
    return{
      AlertModalData:{},
      pageType:0,
    }
  },
  mounted(){
    this.emergencyButton(1);
  },
  methods: {
    emergencyButton(val){
      if(val == 1){
        const e = this.alarmData;
        const obj = e.triggerUploadData[0];
        const deviceValue = obj.deviceValue;
        const unit = obj.unit;
        this.$set(this,'AlertModalData',{
          lab: e.subName + (e.roomNum ? `(${e.roomNum})` : ''),
          building: [e.schoolName, e.buildName, e.floorName].filter(Boolean).join(' · '),
          unit: e.deptName,
          param: e.eventName,
          value: deviceValue+''+(unit=='-'?'':unit),
          person: e.adminName,
          phone: e.adminPhone,
          time: e.eventStartTime ? e.eventStartTime.replace('T', ' ') : '',
          buildId:e.buildId,
          floorId:e.floorId,
          subId:e.subId,
          eventId:e.eventId,
        })
        // this.$refs.alertModal.show({
        //   lab: e.subName + (e.roomNum ? `(${e.roomNum})` : ''),
        //   building: [e.schoolName, e.buildName, e.floorName].filter(Boolean).join(' · '),
        //   unit: e.deptName,
        //   param: e.eventName,
        //   value: deviceValue+''+(unit=='-'?'':unit),
        //   person: e.adminName,
        //   phone: e.adminPhone,
        //   time: e.eventStartTime ? e.eventStartTime.replace('T', ' ') : '',
        //   buildId:e.buildId,
        //   floorId:e.floorId,
        //   subId:e.subId,
        // })
        this.$set(this,'pageType',val);
      }else if(val == 2){
        this.$set(this,'pageType',val);
      }
    },
  }
}
</script>

<style lang="scss" scoped>
.alarm-overlay {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.75);
  backdrop-filter: blur(4px);
}
</style>
