<template>
    <div v-if="info">
        <Row :gutter="30">
            <i-col :xs="24" :sm="24" :md="24" :lg="getCurrentLang() == 'tw' ? 12 : 24" class="title-part">
                <h2 class="event-title">
                    <span class="title-mark" v-show="info.eventType == 'Exam'" >{{$t("studentWeb.home.exam")}}</span>
                    <span class="title-mark" v-show="info.eventType == 'Vote'" >{{$t("studentWeb.home.vote")}}</span>
                    <span class="title-mark" v-show="info.eventType == 'Survey'" >{{$t("studentWeb.home.survey")}}</span>
                    {{ info.name }}
                </h2>
            </i-col>
            <i-col :xs="24" :sm="24" :md="24" :lg="getCurrentLang() == 'tw' ? 12 : 24" class="info-part">
                <ul class="base-info" :class="{'base-infoEn': getCurrentLang() == 'en'}">
                    <li
                    v-if="info.eventType == 'Exam' && paper.length !== 0 "
                    >
                        <svg-icon icon-class="subject" class="base-info-icon" />{{ $t('studentWeb.baseInfo.subject')}}
                        <span class="base-info-text">{{paper.length > 1 ? $t('studentWeb.event.allSubject') : paper[0].subject.name }}</span>
                        <!-- <span class="base-info-text" v-if="getCurrentLang()=='en'">{{ transSubjecttoEn(info.eventSubject) }}</span> -->
                    </li>
                    <li v-if="info.eventType == 'Vote'">
                        <svg-icon icon-class="teacher" class="base-info-icon" />投票类型：
                        <span class="base-info-text">{{ times }}</span>
                    </li>
                    <li>
                        <svg-icon icon-class="time" class="base-info-icon" />
                        <span>{{ !eventType ? $t('studentWeb.baseInfo.period') : $t('studentWeb.baseInfo.postTime') }}</span>
                        <span class="base-info-text" v-if="from != '通知' && from != 'hiteach'">
                            <span>
                                {{ !eventType ? dateFormat(info.startTime) + "～" : ""}}
                            </span>
                            {{ dateFormat(info.endTime) }}
                        </span>
                        <!--<span
                        class="base-info-text"
                        v-if="from == '通知'||from == 'hiteach'"
                        >{{ info.endTime + " 14:20" }}54345</span>-->
                    </li>
                    <!--<li v-if=" from == 'hiteach'">
                        <svg-icon icon-class="time" class="base-info-icon" />{{$t('studentWeb.baseInfo.classTime')}}:
                        <span class="base-info-text">{{ info.endTime }}</span>
                    </li>-->
                    <!--<li v-if="finishedCondition && !eventType && from != '通知'&&from!='hiteach'">
                        <svg-icon icon-class="done" class="base-info-icon" />
                        <span class="base-info-text">{{ $t('studentWeb.baseInfo.Fineshed')}}</span>
                    </li>
                    <li v-if="unfinishedCondition && !eventType && from != '通知'&&from!='hiteach'">
                        <svg-icon icon-class="undone" class="base-info-icon" />
                        <span class="base-info-text">{{ $t('studentWeb.baseInfo.unFinished')}}</span>
                    </li>-->
                </ul>
            </i-col>
        </Row>
    </div>
</template>

<script>
export default {
    name: "EventBasicInfo",
    props: [
        "eventType",
        "from",
        "paper",
        "info",
        "times"
    ],

    computed: {
        finishedCondition: function () {
            return (
                this.$store.getters.getItemTitle.isDone ||
                this.$store.getters.getFinishedItem.includes(
                  this.$store.getters.getItemTitle.eventID
                ) == true
            );
        },
        unfinishedCondition: function () {
            return (
                !this.$store.getters.getItemTitle.isDone &&
                this.$store.getters.getFinishedItem.includes(
                  this.$store.getters.getItemTitle.eventID
                ) == false
            );
        },
    },
    mounted() {
    },
    methods: {
        dateFormat(timestamp) {
            var date = new Date(timestamp)
            var Y = date.getFullYear() + '-'
            var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-'
            var D = (date.getDate() < 10 ? '0' + (date.getDate()) : date.getDate()) + ' '
            var H = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ":"
            var Min = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes())
            var S = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds()) + " "
            return Y + M + D + H + Min;
        },
        getCurrentLang() {
            return localStorage.getItem('lang');
        },
    },
};
</script>

<style></style>
