<template>
  <div>
    <van-nav-bar
      :title="detailData.axi_name"
      left-arrow
      @click-left="onClickLeft"
    ></van-nav-bar>
    <van-loading class="w-full text-center" v-if="loading" color="#FFFFFF" />
    <div v-else class="flex flex-col justify-center h-80vh">
        <video-player
        :key="detailData.axi_rxcj_spwj_v2" :src="detailData.axi_rxcj_spwj_v2"
        :poster="(detailData.axi_img)" class="w-full"
        />
    </div>
  </div>
</template>
<script setup lang='ts'>
import videoPlayer from './comp/video-player.vue'
import img1 from "~/assets/voice1.png";
import img2 from "~/assets/voice2.png";
const props = defineProps<{
  id: string;
}>();

const router = useRouter();
function onClickLeft() {
  router.back();
}

let detailData = $ref({});
let loading = $ref(true);

getDetail()
function getDetail() {
  request({
    url: "/aimooc/xnszr_img/detail",
    data: {
      axi_id: props.id,
    },
  }).then((res) => {
    if (res.code == "1") {
      const { one_info } = res.data;
      detailData = one_info;
      loading = false;
    }
  });
}

</script>
