guoshilong
2023-11-13 54849757852f6ab40eb17afbd03d1d839b60a38d
src/components/livestream-others.vue
@@ -7,7 +7,7 @@
      controls
      class="mt20"
    ></video>
    <p class="fz24">Live streaming source selection</p>
    <p class="fz24">直播源选择</p>
    <div class="flex-row flex-justify-center flex-align-center mt10">
      <template v-if="liveState && isDockLive">
@@ -19,7 +19,7 @@
      <template v-else>
      <a-select
        style="width: 150px"
        placeholder="Select Live Type"
        placeholder="选择直播流类型"
        @select="onLiveTypeSelect"
        v-model:value="livetypeSelected"
      >
@@ -34,7 +34,7 @@
      <a-select
        class="ml10"
        style="width:150px"
        placeholder="Select Drone"
        placeholder="选择设备"
        v-model:value="droneSelected"
      >
        <a-select-option
@@ -48,7 +48,7 @@
      <a-select
        class="ml10"
        style="width:150px"
        placeholder="Select Camera"
        placeholder="选择相机"
        v-model:value="cameraSelected"
      >
        <a-select-option
@@ -77,7 +77,7 @@
      <a-select
        class="ml10"
        style="width:150px"
        placeholder="Select Clarity"
        placeholder="选择画质"
        @select="onClaritySelect"
        v-model:value="claritySelected"
      >
@@ -91,23 +91,23 @@
    </div>
    <div class="mt20">
      <p class="fz10" v-if="livetypeSelected == 2">
        Please use VLC media player to play the RTSP livestream !!!
        请使用VLC媒体播放器播放RTSP直播!!!
      </p>
      <p class="fz10" v-if="livetypeSelected == 2">
        RTSP Parameter:{{ rtspData }}
        RTSP参数:{{ rtspData }}
      </p>
    </div>
    <div class="mt10 flex-row flex-justify-center flex-align-center">
      <a-button v-if="liveState && isDockLive" type="primary" large @click="onSwitch">Switch Lens</a-button>
      <a-button v-else type="primary" large @click="onStart">Play</a-button>
      <a-button v-if="liveState && isDockLive" type="primary" large @click="onSwitch">切换镜头</a-button>
      <a-button v-else type="primary" large @click="onStart">播放</a-button>
      <a-button class="ml20" type="primary" large @click="onStop"
        >Stop</a-button
        >暂停</a-button
      >
      <a-button class="ml20" type="primary" large @click="onUpdateQuality"
        >Update Clarity</a-button
        >更新画质</a-button
      >
      <a-button v-if="!liveState || !isDockLive" class="ml20" type="primary" large @click="onRefresh"
        >Refresh Live Capacity</a-button
        >刷新</a-button
      >
    </div>
  </div>
@@ -145,23 +145,23 @@
const clarityList: SelectOption[] = [
  {
    value: 0,
    label: 'Adaptive'
    label: '自适应'
  },
  {
    value: 1,
    label: 'Smooth'
    label: '正常'
  },
  {
    value: 2,
    label: 'Standard'
    label: '标准'
  },
  {
    value: 3,
    label: 'HD'
    label: '高清'
  },
  {
    value: 4,
    label: 'Super Clear'
    label: '超清'
  }
]
@@ -335,7 +335,7 @@
const onUpdateQuality = () => {
  if (!liveState.value) {
    message.info('Please turn on the livestream first.')
    message.info('请先打开直播')
    return
  }
  setLivestreamQuality({
@@ -343,7 +343,7 @@
    video_quality: claritySelected.value
  }).then(res => {
    if (res.code === 0) {
      message.success('Set the clarity to ' + clarityList[claritySelected.value].label)
      message.success('将清晰度设置为 ' + clarityList[claritySelected.value].label)
    }
  })
}
@@ -388,7 +388,7 @@
  videoSelected.value = firstVideo.value
  lensList.value = firstVideo.more
  lensSelected.value = firstVideo.label
  isDockLive.value = lensList.value.length > 0
  isDockLive.value = lensList.value?.length > 0
}
const onVideoSelect = (val: SelectOption) => {
  videoSelected.value = val.value
@@ -400,7 +400,7 @@
}
const onSwitch = () => {
  if (lensSelected.value === undefined || lensSelected.value === nonSwitchable) {
    message.info('The ' + nonSwitchable + ' lens cannot be switched, please select the lens to be switched.', 8)
    message.info('当前 ' + nonSwitchable + ' 镜头无法切换,请选择要切换的镜头', 8)
    return
  }
  changeLivestreamLens({
@@ -408,7 +408,7 @@
    video_type: lensSelected.value
  }).then(res => {
    if (res.code === 0) {
      message.success('Switching live camera successfully.')
      message.success('切换实时摄像机成功')
    }
  })
}