<template>
<div class="advertising flex-center" :style="advertisement==''?'':'background: #000'">
  <div v-show="advertisement==''">广告位招租</div>
  <img v-show="advertisement.type=='img'" :src="advertisement.src" model="scaleToFill" style="width: 100%;height: 100%;"/>
  <img v-show="advertisement.type=='img'" :src="advertisement.src" model="scaleToFill" style="width: 100%;height: 100%;"/>
  <video v-show="advertisement.type=='video'" autoplay loop muted :src="advertisement.src" style="width: 100%;height: 100%;"></video>
</div>
</template>

<script>
import {getAdvertisement} from "@/api/resultApi";

export default {
  name: "advertising",
  data() {
    return {
      advertisement: ''
    };
  },
  mounted() {
    setTimeout(()=>{
      this.getAdvertisement()
    },1000)
  },
  methods: {
    // 获取广告链接
    getAdvertisement() {
      getAdvertisement({deviceId:this.cite.facility.id,screen: 'AdvertisingScreen'}).then((res) =>{
        // console.log(res)
        this.advertisement = res || ''
      })
    },
  },
}
</script>

<style>
#app .top {
  display: none;
}
.advertising {
  background: linear-gradient(359deg, #3dbf51 0%, #47d1a9 100%);
  width: 100%;
  height: 100%;
  position: fixed;
  font-size: 10rem;
  font-weight: bold;
  color: #ffffff;
  line-height: 10rem;
}
</style>