forked from integrated_whb/integrated_whb_vue
57 lines
1.2 KiB
Vue
57 lines
1.2 KiB
Vue
<template>
|
|
<el-dialog title="视频" v-model="visible">
|
|
<ali-player
|
|
:source="fnSrc(src)"
|
|
:vid="vid"
|
|
:play-auth="playAuth"
|
|
ref="playerRef"
|
|
/>
|
|
</el-dialog>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { useVModel } from "@vueuse/core";
|
|
import AliPlayer from "@/components/ali-player/index.vue";
|
|
import { ref, watchEffect } from "vue";
|
|
|
|
const VITE_FILE_URL = import.meta.env.VITE_FILE_URL;
|
|
defineOptions({
|
|
name: "LayoutVideo",
|
|
});
|
|
const props = defineProps({
|
|
src: {
|
|
type: String,
|
|
default: "",
|
|
},
|
|
vid: {
|
|
type: String,
|
|
default: "",
|
|
},
|
|
playAuth: {
|
|
type: String,
|
|
default: "",
|
|
},
|
|
visible: {
|
|
type: Boolean,
|
|
required: true,
|
|
default: false,
|
|
},
|
|
});
|
|
const emits = defineEmits(["update:visible"]);
|
|
const visible = useVModel(props, "visible", emits);
|
|
const playerRef = ref(null);
|
|
const fnSrc = (src) => {
|
|
if (src.indexOf("http") !== -1 || src.indexOf("https") !== -1) return src;
|
|
else return VITE_FILE_URL + src;
|
|
};
|
|
watchEffect(() => {
|
|
if (visible.value) {
|
|
playerRef.value && playerRef.value.play();
|
|
} else {
|
|
playerRef.value && playerRef.value.pause();
|
|
}
|
|
});
|
|
</script>
|
|
|
|
<style scoped lang="scss"></style>
|