<template>
  <div id="ImouPlayer">视频正在接入......</div>
</template>

<script setup name="ImouPlayer">
import bus from '@/bus';

import dialogTabsStore from '@/store/modules/dialogTabs';

const { proxy } = getCurrentInstance();

const useDialogTabs = dialogTabsStore();

const showData = ref(null);
const loading = ref(false);
const props = defineProps({
  // 数据SiteNo
  SiteNo: {
    type: String,
  },
});

let player = null;

const play = () => {
  player.play();
};
const pause = () => {
  player.pause();
};
const stop = () => {
  player.stop();
};
const capture = () => {
  player.capture();
};
const startTalk = () => {
  player.startTalk();
};
const stopTalk = () => {
  player.stopTalk();
};
const volume = value => {
  player.volume(value);
};
const fullScreen = () => {
  player.fullScreen();
};
const exitFullScreen = () => {
  player.exitFullScreen();
};
const startRecord = () => {
  player.startRecord();
};
const stopRecord = () => {
  player.stopRecord();
};

const destroy = () => {
  player.destroy();
  player = null;
};

const init = () => {
  if (player) {
    destroy();
  }
  player = new imouPlayer({
    id: 'ImouPlayer', // 视频容器ID
    width: 1200,
    height: 700,
    deviceId: 'MEGREZOPEN487006',
    channelId: '0',
    token: 'Kt_hz5948e8101bae42b3a7df2489eeefa9',
    // 1 直播  2 录播
    type: 1,
    // 直播 0 高清  1 标清  默认
    streamId: 1,
    // 录播 云录像 cloud 本地录像 localRecord 默认 云录像
    recordType: 'cloud',
    mute: false,
    handleError: err => {
      console.error('handleError', err);
    },
  });
  // window.player = player;
};

onMounted(() => {
  init();
});
</script>

<style lang="scss" scoped>
#ImouPlayer {
  width: 100%;
  height: 100%;
  background-color: #000;
  color: #ccc;
  text-align: center;
  padding-top: 30px;
  font-size: 20px;
}
</style>