|
|
@@ -18,14 +18,37 @@
|
|
|
@mousedown="$event => handleSelectElement($event)"
|
|
|
@touchstart="$event => handleSelectElement($event)"
|
|
|
>
|
|
|
- <iframe :srcdoc="elementInfo.url" v-if="elementInfo.isHTML"
|
|
|
+ <!-- 视频类型(type 74):使用 video 标签 -->
|
|
|
+ <video
|
|
|
+ v-if="elementInfo.toolType === 74"
|
|
|
+ :src="elementInfo.url"
|
|
|
+ :width="elementInfo.width"
|
|
|
+ :height="elementInfo.height"
|
|
|
+ controls
|
|
|
+ :style="{ width: '100%', height: '100%', objectFit: 'contain' }"
|
|
|
+ ></video>
|
|
|
+ <!-- B站视频类型(type 75):使用 iframe -->
|
|
|
+ <iframe
|
|
|
+ v-else-if="elementInfo.toolType === 75"
|
|
|
+ :src="elementInfo.url"
|
|
|
:width="elementInfo.width"
|
|
|
:height="elementInfo.height"
|
|
|
:frameborder="0"
|
|
|
:allowfullscreen="true"
|
|
|
allow="camera *; microphone *; display-capture; midi; encrypted-media; fullscreen; geolocation; clipboard-read; clipboard-write; accelerometer; autoplay; gyroscope; payment; picture-in-picture; usb; xr-spatial-tracking;"
|
|
|
></iframe>
|
|
|
- <iframe v-else
|
|
|
+ <!-- 其他类型:保持原有逻辑 -->
|
|
|
+ <iframe
|
|
|
+ v-else-if="elementInfo.isHTML"
|
|
|
+ :srcdoc="elementInfo.url"
|
|
|
+ :width="elementInfo.width"
|
|
|
+ :height="elementInfo.height"
|
|
|
+ :frameborder="0"
|
|
|
+ :allowfullscreen="true"
|
|
|
+ allow="camera *; microphone *; display-capture; midi; encrypted-media; fullscreen; geolocation; clipboard-read; clipboard-write; accelerometer; autoplay; gyroscope; payment; picture-in-picture; usb; xr-spatial-tracking;"
|
|
|
+ ></iframe>
|
|
|
+ <iframe
|
|
|
+ v-else
|
|
|
:src="elementInfo.url"
|
|
|
:width="elementInfo.width"
|
|
|
:height="elementInfo.height"
|
|
|
@@ -98,6 +121,14 @@ const handleSelectElement = (e: MouseEvent | TouchEvent, canMove = true) => {
|
|
|
overflow: hidden;
|
|
|
position: absolute;
|
|
|
}
|
|
|
+.element-content video {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ cursor: move;
|
|
|
+ object-fit: contain;
|
|
|
+ background-color: #000;
|
|
|
+ position: absolute;
|
|
|
+}
|
|
|
.drag-handler {
|
|
|
position: absolute;
|
|
|
|