|
@@ -18,7 +18,7 @@
|
|
|
<div class="video-box" v-if="videoPaths && videoPaths.length != 0">
|
|
<div class="video-box" v-if="videoPaths && videoPaths.length != 0">
|
|
|
<img
|
|
<img
|
|
|
src="@/assets/images/alert/video-play.png"
|
|
src="@/assets/images/alert/video-play.png"
|
|
|
- @click="videoDialogVisible = true"
|
|
|
|
|
|
|
+ @click="handleOpenVideo"
|
|
|
style="
|
|
style="
|
|
|
object-fit: contain;
|
|
object-fit: contain;
|
|
|
width: 200px;
|
|
width: 200px;
|
|
@@ -57,16 +57,16 @@
|
|
|
</template>
|
|
</template>
|
|
|
</el-dialog>
|
|
</el-dialog>
|
|
|
|
|
|
|
|
- <el-dialog v-model="videoDialogVisible" class="video-dialog" align-center>
|
|
|
|
|
|
|
+ <el-dialog v-model="videoDialogVisible" class="video-dialog" align-center destroy-on-close>
|
|
|
<video
|
|
<video
|
|
|
type="video/mp4"
|
|
type="video/mp4"
|
|
|
muted="true"
|
|
muted="true"
|
|
|
preload="auto"
|
|
preload="auto"
|
|
|
:controls="true"
|
|
:controls="true"
|
|
|
autoplay
|
|
autoplay
|
|
|
- style="height: 620px; object-fit: contain"
|
|
|
|
|
|
|
+ style="object-fit: contain"
|
|
|
>
|
|
>
|
|
|
- <source :src="videoPaths![0]" />
|
|
|
|
|
|
|
+ <source :src="tempVideoUrl" />
|
|
|
</video>
|
|
</video>
|
|
|
</el-dialog>
|
|
</el-dialog>
|
|
|
</div>
|
|
</div>
|
|
@@ -92,6 +92,12 @@
|
|
|
return props.hasBeenChosen;
|
|
return props.hasBeenChosen;
|
|
|
});
|
|
});
|
|
|
|
|
|
|
|
|
|
+ const tempVideoUrl = ref('');
|
|
|
|
|
+ const handleOpenVideo = () => {
|
|
|
|
|
+ videoDialogVisible.value = true;
|
|
|
|
|
+ if (props.videoPaths) tempVideoUrl.value = props.videoPaths[0];
|
|
|
|
|
+ };
|
|
|
|
|
+
|
|
|
const handleClose = () => {
|
|
const handleClose = () => {
|
|
|
emits('close');
|
|
emits('close');
|
|
|
};
|
|
};
|
|
@@ -215,10 +221,11 @@
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.el-dialog__body {
|
|
.el-dialog__body {
|
|
|
- height: 100%;
|
|
|
|
|
|
|
+ // height: 100%;
|
|
|
padding: 0;
|
|
padding: 0;
|
|
|
display: flex;
|
|
display: flex;
|
|
|
justify-content: center;
|
|
justify-content: center;
|
|
|
|
|
+ background-color: #000;
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
</style>
|
|
</style>
|