<template>
  <view class="spjk-box">
    <view class="select-bar">
        <uni-data-select
         v-model="value"
         :localdata="list"
         @change="change"
         :clear="false"
            >
        </uni-data-select>
    </view>
    <view class="video-box" >
      <iframe :src="webURL" style="height: 300px;width:370px;" frameborder="0" ref="videoFrame"></iframe>
    </view>
    <!-- <u-overlay :show="show" @click="show = false">
		<view class="warp" style="position:relative;">
			<view class="rect" >
      <iframe :src="webURL" style="height: 100vh;width:100vw" frameborder="0" ref="videoFrame"></iframe>
      <image src="/static/images/m1.png" style="position:absolute; bottom:0,right:0"></image>
      </view>
		</view>
	</u-overlay> -->
    <!-- <button @click="show=true">全屏</button> -->
  </view>
</template>

<script>
  export default {
    props:{
      stcd:String,
      source:String,
      default:''
    },
    data() {
      return {
        value: "",
        list:[],
        webURL:'',
        show:false
      }
    },
    methods: {
      // handleMessage(){
      //   console.log(111111111111111);
      // },
      async getList(){
        try{
          const {data} = await uni.$http.get(
          `/gunshiApp/xfflood/stbprp/cctv/listByStcd/${this.stcd}`)
          if(data.code == 200){
            let newData = data.data.map(item => ({...item,value:item.camId,text:item.name}))
            this.list = [...newData];
            this.value = newData[0].value
            this.getVideoSrc(newData[0].camId)
          }
        }catch(e){
          uni.$showMsg()
        }
      },
      async getVideoSrc(id){
        try{
          const {data} = await uni.$http.get(
          `/gunshiApp/xfflood/xfCctvB/preview/${id}`)
          if(data.code == 200){
           this.webURL="./static/h5Player/webplayer.html?cameraIndexCode="+id+"&cameraUrl="+data.data
          }
        }catch(e){
          uni.$showMsg()
        }
      },
      change(e) {
         console.log("e:", e);
         this.getVideoSrc(e)
     },
    },
    mounted() {
      this.getList()
    //     // 监听退出全屏事件，恢复竖屏模式
    // document.addEventListener('fullscreenchange', this.exitFullScreen);
    // document.addEventListener('webkitfullscreenchange', this.exitFullScreen);
    // document.addEventListener('mozfullscreenchange', this.exitFullScreen);
    // document.addEventListener('MSFullscreenChange', this.exitFullScreen);
    },
     onLoad() {
    window.addEventListener('message', (e)=>{console.log("eeee",e);});
  },
  }
</script>

<style lang="scss" scoped>
  .spjk-box{
    .select-bar{
      margin: 10px 15px;
    }
  }
</style>
