<template>
    <div
        class="
            msg-detail
            video-message
            d-flex
            align-items-center
            justify-content-center
        "
    >
        <video-player-icon @click.native="openFile"></video-player-icon>
    </div>
</template>

<script lang="ts">
    import { Component } from "vue-property-decorator";
    import BaseMessage from "./index";
    import VideoPlayerIcon from "./video-player-icon.vue";

    @Component({ components: { VideoPlayerIcon } })
    export default class Index extends BaseMessage {
        mounted() {
            this.buildMessageUrl();
        }
    }
</script>

<style lang="less" scoped>
    .video-message {
        height: 160px;
        width: 200px;
        background-color: #000 !important;
        border-radius: 0 !important;

        svg {
            cursor: pointer;
        }
    }
</style>