<template>
    <div class="call-start-message-container"
         @click="startCall"
         v-bind:class="{out:message.direction === 0}">
        <i class="icon-ion-android-call"></i>
        <p class="text" v-html="this.textContent"></p>
    </div>
</template>

<script>
import Message from "../../../../../wfc/messages/message";
import CallEndReason from "../../../../../wfc/av/engine/callEndReason";
import store from "../../../../../store";
import {numberValue} from "../../../../../wfc/util/longUtil";

export default {
    name: "CallStartMessageContentView",
    props: {
        message: {
            type: Message,
            required: true,
        }
    },
    data() {
        return {
            sharedMiscState: store.state.misc,
            sharedContactState: store.state.contact,
        }
    },
    mounted() {
    },

    methods: {
        startCall() {
            let callStartMsgContent = this.message.messageContent;
            let audioOnly = callStartMsgContent.audioOnly;
            this.$startVoipCall({audioOnly: audioOnly, conversation: this.message.conversation});
        },
    },

    computed: {
        textContent() {
            let voip = this.message.messageContent;
            let desc = this.$t('voip.desc');
            if (voip.endTime > 0 && voip.connectTime > 0) {
                let duration = parseInt((numberValue(voip.endTime) - numberValue(voip.connectTime)) / 1000);
                desc = `閫氳瘽鏃堕暱锛�${duration}''`
            } else {
                let reason = voip.status;
                switch (reason) {
                    case CallEndReason.REASON_Unknown:
                        desc = this.$t('voip.not_answer');
                        break;
                    case CallEndReason.REASON_Busy:
                        desc = '绾胯矾蹇�';
                        break;
                    case CallEndReason.REASON_SignalError:
                        desc = '缃戠粶閿欒';
                        break;
                    case CallEndReason.REASON_Hangup:
                        desc = '宸插彇娑�';
                        break;
                    case CallEndReason.REASON_RemoteHangup:
                        desc = '瀵规柟宸插彇娑�';
                        break;
                    case CallEndReason.REASON_OpenCameraFailure:
                        desc = '缃戠粶閿欒';
                        break;
                    case CallEndReason.REASON_Timeout:
                        desc = '鏈帴鍚�';
                        break;
                    case CallEndReason.REASON_AcceptByOtherClient:
                        desc = '宸插湪鍏朵粬绔帴鍚�';
                        break;
                    case CallEndReason.REASON_AllLeft:
                        desc = '閫氳瘽宸茬粨鏉�';
                        break;
                    case CallEndReason.RemoteBusy:
                        desc = '瀵规柟蹇�';
                        break;
                    case CallEndReason.RemoteTimeout:
                        desc = '瀵规柟鏈帴鍚�';
                        break;
                    case CallEndReason.RemoteNetworkError:
                        desc = '瀵规柟缃戠粶閿欒';
                        break;
                    case CallEndReason.RoomDestroyed:
                        desc = '閫氳瘽宸茬粨鏉�';
                        break;
                    case CallEndReason.RoomNotExist:
                        desc = '閫氳瘽宸茬粨鏉�';
                        break;
                    case CallEndReason.RoomParticipantsFull:
                        desc = ' 宸茶揪鏈€澶ч€氳瘽浜烘暟';
                        break;
                    default:
                        break

                }
            }
            return desc;
        }
    }
}
</script>

<style lang="css" scoped>
.call-start-message-container {
    margin: 0 10px;
    padding: 10px;
    background-color: white;
    position: relative;
    border-radius: 5px;
    display: flex;
    align-items: center;
}

.call-start-message-container p {
    padding-left: 5px;
    white-space: pre-line;
}

.call-start-message-container.out {
    background-color: #a8bdff;
}


.call-start-message-container .text {
    color: #050505;
    font-size: 13px;
}

</style>