<script setup>
const props = defineProps({
  messageContent: String|Number, // 消息内容
  viewType: Number, // 0发送 1接收
});

let videoUrl = ref('')
let loading = ref(false)

const initMessage = () => {
  switch (props.viewType) {
    case 0: // 发送 上传
      uploadMessage()
      break;
    case 1: // 接收
      videoUrl.value = props.messageContent
      break;
  }
}

const uploadMessage = async () => {
  try {
    loading.value = true
    const formData = new FormData()
    formData.append('uploadFile', props.messageContent.blob)
    formData.append('asImage', false)
    formData.append('fieldName', 'messageContent')
    const res = await request(`/website/tourMessage/upload`, {
      method: 'post',
      body: formData
    })
    await handleResponse(res)
    // videoUrl.value = res.data?.fileUrl ?? '';
    videoUrl.value = 'https://fastly.jsdelivr.net/npm/@vant/assets/cat.jpeg';
  } catch (e) {

  } finally {
    loading.value = false
  }
}

onMounted(() => {
  initMessage()
})

</script>

<template>
  <div class="flex flex-row">
    <div v-if="loading">loading...</div>
    <template v-if="viewType">
      <video :src="videoUrl"></video>
    </template>
    <template v-else>
      <video :src="videoUrl"></video>
    </template>
  </div>
</template>

<style scoped lang="scss">

</style>