<template>
  <div>
    <div class="column" v-if="details._recommends">
      <div class="column-title">提升建议</div>
      <div class="column-con">
        <div class="item">
          <div class="item-title item-title2"> {{ details._recommends.topic }}</div>
          <div class="item-con" v-html="details._recommends.note"></div>
        </div>
      </div>
    </div>
    <div class="column" v-if="details.video_url">
      <div class="column-title">测评视频</div>
      <div>
        <video :poster="details.video_url.replace('  ', '') + '?x-oss-process=video/snapshot,t_100,f_jpg,w_0,h_0,ar_auto'"
          :src="details.video_url" :controls="true">
          您的浏览器不支持 video 标签。
        </video>
      </div>
    </div>
  </div>
</template>
<script setup lang="ts">
import dataDictionary from "@/utils/dataDictionary"
const route = useRoute();
const dic: any = dataDictionary;

//父值
const props = defineProps({
  detailsData: {
    type: Object,
    default: {}
  },
});

const data = reactive<any>({
  details: {},
  query: {},
  typeKeyObj: {}
});
const { details, query, typeKeyObj } = toRefs(data);

onBeforeMount(() => {
  typeKeyObj.value = dic.typeKeyObj;
  query.value = route.query;
  details.value = JSON.parse(JSON.stringify(props.detailsData));
})
</script>

<style lang="scss" scoped></style>
