index.vue 1.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576
  1. <template>
  2. <div class="WorldCup">
  3. <!-- 背景图 -->
  4. <img
  5. src="https://fastly.jsdelivr.net/npm/@vant/assets/cat.jpeg"
  6. style="width: 100%"
  7. />
  8. <!-- 宣传视频 -->
  9. <!-- <video
  10. preload="metadata"
  11. crossorigin="anonymous"
  12. class="video_fill"
  13. >
  14. 您的浏览器不支持 video 标签
  15. </video> -->
  16. <gsVideo url="http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4" />
  17. <!-- 活动介绍 -->
  18. <div>
  19. <van-cell-group>
  20. <van-cell title="活动介绍" />
  21. </van-cell-group>
  22. </div>
  23. <!-- 投稿区域 -->
  24. <div>
  25. <van-cell-group>
  26. <van-cell title="投稿区域" />
  27. </van-cell-group>
  28. </div>
  29. <!-- 投稿排行 -->
  30. <div>
  31. <van-cell-group>
  32. <van-cell title="投稿排行" />
  33. </van-cell-group>
  34. </div>
  35. <!-- 弹幕 -->
  36. <div>
  37. <van-cell-group inset>
  38. <van-field v-model="sms" center clearable placeholder="请输入弹幕">
  39. <template #button>
  40. <van-button size="small" type="primary">发送</van-button>
  41. </template>
  42. </van-field>
  43. </van-cell-group>
  44. </div>
  45. <!-- 冠军预测 -->
  46. <div>
  47. <van-cell-group>
  48. <van-cell title="冠军预测" />
  49. </van-cell-group>
  50. </div>
  51. </div>
  52. </template>
  53. <script setup>
  54. // import { reactive } from "vue";
  55. import { ref, onMounted } from "vue";
  56. import gsVideo from "@/components/video.vue";
  57. // import { isIpad, isIpod, isIphone } from "../../utils/isTerminal";
  58. /**
  59. * window.$originData.orginParames.title 页面标题
  60. * window.$originData.orginParames.parameters 固定参数值
  61. * window.$originData.urlParames url参数
  62. */
  63. const sms = ref("");
  64. onMounted(() => {});
  65. </script>
  66. <style>
  67. .WorldCup {
  68. width: 100vw;
  69. height: 100vh;
  70. font-size: 0;
  71. }
  72. </style>