<template>
  <LiveVideo :type="type" :url="url" />
</template>
<script setup lang="ts">
  import { onMounted, ref, onBeforeUnmount } from 'vue'
  import { getLive } from '/@/api/sys/other'
  import LiveVideo from './index1.vue'

  const props = defineProps({
    id: {
      type: [String, Number],
    },
  })
  const type = ref('')
  const url = ref('')
  const expires = ref(60)
  let timer: any = null
  onMounted(() => {
    getLiveById()
  })

  async function getLiveById() {
    if (props.id == null) return
    try {
      const data = await getLive(props.id)

      type.value = data.type
      url.value = data.address
      expires.value = data.expires
      refresh()
    } catch (error) {}
  }

  //根据expires定时刷新getLiveById
  function refresh() {
    if (expires.value <= 0) {
      return
    }
    timer = setTimeout(() => {
      getLiveById()
    }, expires.value * 1000)
  }

  onBeforeUnmount(() => {
    timer && clearTimeout(timer)
  })
</script>
