dev/dcp-web-gate/src_old/views/AddFeatures/ballot/ballotCampaignMainPage.vue

<template>
     
    <div class="big-big-box">
        <banners-zh v-if="language.value == 'CN'"></banners-zh>
        <banners-en v-if="language.value == 'EN'"></banners-en>
        <banners-fr v-if="language.value == 'FR'"></banners-fr>
        <banners-ru v-if="language.value == 'RU'"></banners-ru>
        <!-- 顶部图片 -->
        <div class="topimg">
            <img src="@/assets/ballot/未标题-6_画板 1.png" alt="" />
        </div>
        <!-- 选择区域 -->
        <div class="body-info">
            <div class="select-info">
                <el-select v-model="language.value" @change="getChange">
                    <el-option v-for="(item, index) in options" :key="index" :label="item.label" :value="item.value">{{
                    item.label }}
                    </el-option>
                </el-select>
            </div>
            <div class="main-info">
                <div class="select-detail" v-if="language.value == 'CN'">
                    <div class="detail-first">
                        <div class="title-text1" @click="toLogin" :title="'进入投票系统'" v-if="lostInfoDe">
                            进入投票系统
                        </div>
                        <div class="title-info-text1" @click="getDetails" :title="'进入投票系统'" v-else>
                            进入投票系统
                        </div>
                        <div class="info-pic1">
                            <img src="@/assets/ballot/组 13984.png" alt="" />
                        </div>
                        <!-- <div class="time-title1"></div> -->
                        <div class="time-start1">
                            网络投票系统将于北京时间9月16日16:00关闭
                        </div>
                    </div>
                    <div class="detail-second">
                        <div class="title-text2" @click="toVideo" :title="'观看会议直播'">
                            观看会议直播
                        </div>
                        <div class="info-pic2">
                            <img src="@/assets/ballot/蒙版组 12674.png" alt="" />
                        </div>
                        <!-- <div class="time-title2"></div> -->
                        <div class="time-start2">
                            会员大会将于北京时间2022年9月16日16:00-18:00召开
                        </div>
                    </div>
                </div>
                <div class="select-detail" v-if="language.value == 'EN'">
                    <div class="detail-first">
                        <div class="title-text1" @click="toLogin" :title="'Enter Voting System'" v-if="lostInfoDe">
                            Enter Voting System
                        </div>
                        <div class="title-info-text1" @click="getDetails" :title="'Enter Voting System'" v-else>
                            Enter Voting System
                        </div>
                        <div class="info-pic1">
                            <img src="@/assets/ballot/组 13984.png" alt="" />
                        </div>
                        <!-- <div class="time-title1">The Online Voting System will open</div> -->
                        <div class="time-start1">
                            The Online Voting System will close at 16:00 on 16th September
                            (Beijing time, GMT+8)
                        </div>
                    </div>
                    <div class="detail-second">
                        <div class="title-text2" @click="toVideo" :title="'Meeting Live Stream'">
                            Meeting Live Stream
                        </div>
                        <div class="info-pic2">
                            <img src="@/assets/ballot/蒙版组 12674.png" alt="" />
                        </div>
                        <!-- <div class="time-title2"></div> -->
                        <div class="time-start2">
                            The General Meeting will be held between 16:00-18:00 on 16th
                            September 2022, Beijing time(GMT+8)
                        </div>
                    </div>
                </div>
                <div class="select-detail" v-if="language.value == 'FR'">
                    <div class="detail-first">
                        <div class="title-text1-fr" @click="toLogin" :title="'Entrer dans le système de vote'"
                            v-if="lostInfoDe">
                            Entrer dans le système de vote
                        </div>
                        <div class="title-info-text" @click="getDetails" :title="'Entrer dans le système de vote'"
                            v-else>
                            Entrer dans le système de vote
                        </div>
                        <div class="info-pic1">
                            <img src="@/assets/ballot/组 13984.png" alt="" />
                        </div>
                        <!-- <div class="time-title1">Le système de vote en ligne sera</div> -->
                        <div class="time-start1">
                            Le système de vote en ligne sera fermé à 16h00 le 16 septembre
                            (heure de Beijing, GMT+8)
                        </div>
                    </div>
                    <div class="detail-second">
                        <div class="title-text4" @click="toVideo">
                            Retransmission en direct de l'Assemblée générale
                        </div>
                        <div class="info-pic2">
                            <img src="@/assets/ballot/蒙版组 12674.png" alt="" />
                        </div>
                        <!-- <div class="time-title2"></div> -->
                        <div class="time-start2">
                            L'Assemblée générale se tiendra entre 16:00 et 18:00 le 16
                            septembre 2022, heure de Beijing (GMT+8)
                        </div>
                    </div>
                </div>
                <div class="select-detail" v-if="language.value == 'RU'">
                    <div class="detail-first">
                        <div class="title-text1-fr" @click="toLogin" :title="'Войти в систему голосования'"
                            v-if="lostInfoDe">
                            Войти в систему голосования
                        </div>
                        <div class="title-info-text" @click="getDetails" :title="'Войти в систему голосования'" v-else>
                            Войти в систему голосования
                        </div>
                        <div class="info-pic1">
                            <img src="@/assets/ballot/组 13984.png" alt="" />
                        </div>
                        <!-- <div class="time-title1">Онлайн система голосования</div> -->
                        <div class="time-start1">
                            Онлайн система голосования закрыта в 16:00 16-го сентября с.г. по
                            пекинскому времени
                        </div>
                    </div>
                    <div class="detail-second">
                        <div class="title-text2-fr" @click="toVideo" :title="'Просмотр прямой трансляции собрания'">
                            Просмотр прямой трансляции собрания
                        </div>
                        <div class="info-pic2">
                            <img src="@/assets/ballot/蒙版组 12674.png" alt="" />
                        </div>
                        <!-- <div class="time-title2"></div> -->
                        <div class="time-start2">
                            Общее собрание членов состоится с 16:00 до 18:00 в 16 сентября
                            2022 года по пекинскому времени
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- 底部图片 -->
        <footer-zh v-if="language.value == 'CN'"></footer-zh>
        <footer-en v-if="language.value == 'EN'"></footer-en>
        <footer-fr v-if="language.value == 'FR'"></footer-fr>
        <footer-ru v-if="language.value == 'RU'"></footer-ru>
    </div>
</template>

<script>
import footerZh from '@/components/footersNewZH'
import footerEn from '@/components/footersNewEN'
import footerFr from '@/components/footersNewFR'
import footerRu from '@/components/footersNewRU'
import bannersZh from '@/components/ballotTopBannerZH'
import bannersEn from '@/components/ballotTopBannerEN'
import bannersFr from '@/components/ballotTopBannerFR'
import bannersRu from '@/components/ballotTopBannerRU'

export default {
    name: 'ballotCampaignMainPage',
    components: {
        footerZh,
        footerEn,
        footerFr,
        footerRu,
        bannersZh,
        bannersEn,
        bannersFr,
        bannersRu,
    },
    data () {
        return {
            lostInfoDe: false,
            options: [
                {
                    value: 'CN',
                    label: '中文',
                },
                {
                    value: 'EN',
                    label: 'English',
                },
                {
                    value: 'FR',
                    label: 'Français',
                },
                {
                    value: 'RU',
                    label: 'Русский',
                },
            ],
            language: {
                value: 'CN',
            },
        }
    },

    mounted () {
        let user = JSON.parse(sessionStorage.getItem('mettingUser'))
        console.log(user)
        if (user == null) {
            this.$router.push({ path: 'home' })
        } else {
            console.log('你好')
        }
        let language = sessionStorage.getItem('language')
        this.language.value = language
        this.initData()
    },
    methods: {
        initData () {
            let arr1 = JSON.parse(sessionStorage.getItem('mettingUser')).userId
            let num = arr1.substr(0, 5)
            console.log(num)
            if (num == '20220') {
                console.log('投票权限')
                this.lostInfoDe = true
            } else {
                console.log('没有权限')
            }
        },
        getDetails () {
            console.log(111)
            if (this.language.value == 'CN') {
                this.$message.warning('抱歉，您暂无投票权限')
            }
            if (this.language.value == 'EN') {
                this.$message.warning('Sorry, you are unauthorised to vote.')
            }
            if (this.language.value == 'FR') {
                this.$message.warning("Désolée, vous n'êtes pas autorisé de voter.")
            }
            if (this.language.value == 'RU') {
                this.$message.warning('Извините, у вас нет прав на голосование.')
            }
        },
        // 返回首页
        toHome () {
            this.$router.push({ path: 'home' })
        },
        //投票系统
        toLogin () {
            var _this = this
            let yy = new Date().getFullYear()
            let mm = new Date().getMonth() + 1
            let dd = new Date().getDate()
            let hh = new Date().getHours()
            let mf =
                new Date().getMinutes() < 10
                    ? '0' + new Date().getMinutes()
                    : new Date().getMinutes()
            let ss =
                new Date().getSeconds() < 10
                    ? '0' + new Date().getSeconds()
                    : new Date().getSeconds()
            let gettime1 = yy + '-' + mm + '-' + dd + ' ' + hh + ':' + mf

            // 投票开始时间
            let gettime2 = '2022-9-1 16:00'
            // 投票结束时间
            let gettime3 = '2022-9-16 16:00'

            var oDate1 = new Date(yy, mm, dd, hh, mf)
            var oDate3 = new Date('2022', '9', '16', '16', '00')
            if (oDate1.getTime() < oDate3.getTime()) {
                this.$router.push({ path: 'ballotDrawingBoardPalette' })
            } else {
                if (this.language.value == 'CN') {
                    this.$message.warning('网络投票系统已关闭')
                }
                if (this.language.value == 'EN') {
                    this.$message.warning('The online voting system is closed.')
                }
                if (this.language.value == 'FR') {
                    this.$message.warning('Le système de vote en ligne est fermé.')
                }
                if (this.language.value == 'RU') {
                    this.$message.warning('Система онлайн-голосования уже закрыта.')
                }
            }
        },
        //观看会议
        toVideo () {
            var _this = this
            let yy = new Date().getFullYear()
            let mm = new Date().getMonth() + 1
            let dd = new Date().getDate()
            let hh = new Date().getHours()
            let mf =
                new Date().getMinutes() < 10
                    ? '0' + new Date().getMinutes()
                    : new Date().getMinutes()
            let ss =
                new Date().getSeconds() < 10
                    ? '0' + new Date().getSeconds()
                    : new Date().getSeconds()
            let gettime1 = yy + '-' + mm + '-' + dd + ' ' + hh + ':' + mf
            // 会员大会开始时间
            let gettime2 = '2022-9-16 16:00'
            // 会员大会结束时间
            let gettime3 = '2022-9-16 18:00'
            var oDate1 = new Date(yy, mm, dd, hh, mf)
            var oDate2 = new Date('2021', '9', '16', '16', '00')
            var oDate3 = new Date('2023', '9', '16', '18', '00')
            if (oDate1.getTime() > oDate2.getTime()) {
                if (oDate1.getTime() < oDate3.getTime()) {
                    // 视频链接地址
                    if (this.language.value == 'EN') {
                        this.$router.push({ path: 'videoInfo' })
                        console.log('英语')
                    }
                    if (this.language.value == 'CN') {
                        this.$router.push({ path: 'videoInfo1' })
                        console.log('中文')
                    }
                    if (this.language.value == 'FR') {
                        this.$router.push({ path: 'videoInfo2' })
                        console.log('法语')
                    }
                    if (this.language.value == 'RU') {
                        this.$router.push({ path: 'videoInfo3' })
                        console.log('俄语')
                    }
                } else {
                    if (this.language.value == 'CN') {
                        this.$message.warning('会员大会已结束')
                    }
                    if (this.language.value == 'EN') {
                        this.$message.warning('The general meeting is over')
                    }
                    if (this.language.value == 'FR') {
                        this.$message.warning('L’assemblée générale est terminée')
                    }
                    if (this.language.value == 'RU') {
                        this.$message.warning('Собрание закончилось')
                    }
                }
            } else {
                if (this.language.value == 'CN') {
                    this.$message.warning('会员大会还未开始')
                }
                if (this.language.value == 'EN') {
                    this.$message.warning("The General Meeting hasn't started yet.")
                }
                if (this.language.value == 'FR') {
                    this.$message.warning("L'Assemblée générale n'a pas encore commencé.")
                }
                if (this.language.value == 'RU') {
                    this.$message.warning('Собрание членов  не началось.')
                }
            }
        },
        getChange () {
            let language = this.language.value
            sessionStorage.setItem('language', language)
            console.log(this.language.value)
        },
    },
}
</script>

<style scoped>
@media screen and (max-width: 1370px) {
    * {
        padding: 0;
        margin: 0;
        box-sizing: border-box;
    }

    .topimg {
        width: 100%;
        background-color: #cdebf7;
    }

    .topimg>img {
        width: 100%;
        padding: 0;
        position: relative;
    }

    .backButton>img {
        width: 100%;
        height: 100%;
    }

    .body-info {
        width: 100%;
        height: 789px;
        background-color: #f2f2f2;
    }

    .main-info {
        width: 60%;
        height: 549px;
        margin: 0 auto;
        transform: translateY(150px);
        background-color: #ffffff;
        position: relative;
    }

    .select-info {
        width: 10%;
        z-index: 99;
        transform: translateX(680%) translateY(200%);
    }

    .select-detail {
        width: 100%;
        height: 350px;
        transform: translateY(30px);
        display: flex;
        justify-content: space-around;
    }

    .detail-first {
        width: 45%;
        background-color: #29a0ac;
        border-radius: 10px;
        position: relative;
    }

    .detail-second {
        width: 45%;
        height: 100%;
        background-color: #6b7ef5;
        border-radius: 10px;
        position: relative;
    }

    .title-text1 {
        width: 90%;
        height: 51px;
        background-color: #ffffff;
        color: #29a0ab;
        font-size: 20px;
        font-family: AlibabaPuHuiTiB;
        font-weight: 700;
        text-align: center;
        line-height: 51px;
        padding: 0 10px;
        border-radius: 50px;
        position: absolute;
        top: 55px;
        left: 5%;
    }

    .title-text1-fr {
        width: 90%;
        height: 51px;
        background-color: #ffffff;
        color: #29a0ab;
        font-size: 20px;
        font-family: AlibabaPuHuiTiB;
        font-weight: 700;
        text-align: center;
        line-height: 21px;
        padding: 5px 10px;
        border-radius: 50px;
        word-wrap: break-word;
        overflow: hidden;
        position: absolute;
        top: 55px;
        left: 5%;
    }

    .title-text1-fr:hover {
        cursor: pointer;
    }

    .title-info-text1 {
        width: 90%;
        height: 51px;
        background-color: #f8f8f8;
        color: #727070;
        font-size: 20px;
        font-family: AlibabaPuHuiTiB;
        font-weight: 700;
        text-align: center;
        line-height: 51px;
        padding: 0 10px;
        border-radius: 50px;
        position: absolute;
        top: 55px;
        left: 5%;
    }

    .title-info-text1:hover {
        cursor: pointer;
    }

    .title-info-text {
        width: 90%;
        height: 51px;
        background-color: #f8f8f8;
        color: #727070;
        font-size: 20px;
        font-family: AlibabaPuHuiTiB;
        font-weight: 700;
        text-align: center;
        line-height: 21px;
        padding: 5px 10px;
        word-wrap: break-word;
        overflow: hidden;
        border-radius: 50px;
        position: absolute;
        top: 55px;
        left: 5%;
    }

    .title-info-text:hover {
        cursor: pointer;
    }

    .title-text1:hover {
        cursor: pointer;
    }

    .title-text2 {
        width: 90%;
        height: 51px;
        background-color: #ffffff;
        color: #6b7ef5;
        font-size: 20px;
        font-family: AlibabaPuHuiTiB;
        font-weight: 700;
        text-align: center;
        padding: 0 10px;
        line-height: 51px;
        border-radius: 50px;
        position: absolute;
        top: 55px;
        left: 5%;
    }

    .title-text2-fr {
        width: 90%;
        height: 51px;
        background-color: #ffffff;
        color: #6b7ef5;
        font-size: 20px;
        font-family: AlibabaPuHuiTiB;
        font-weight: 700;
        text-align: center;
        padding: 5px 10px;
        line-height: 21px;
        border-radius: 50px;
        word-wrap: break-word;
        overflow: hidden;
        position: absolute;
        top: 55px;
        left: 5%;
    }

    .title-text4 {
        width: 90%;
        height: 51px;
        background-color: #ffffff;
        color: #6b7ef5;
        font-size: 16px;
        font-family: AlibabaPuHuiTiB;
        font-weight: 700;
        text-align: center;
        padding: 5px 10px;
        line-height: 21px;
        border-radius: 50px;
        word-wrap: break-word;
        overflow: hidden;
        position: absolute;
        top: 55px;
        left: 5%;
    }

    .title-text2-fr:hover {
        cursor: pointer;
    }

    .title-text4:hover {
        cursor: pointer;
    }

    .title-text2:hover {
        cursor: pointer;
    }

    .info-pic1 {
        width: 30%;
        height: 135px;
        border-radius: 10px;
        overflow: hidden;
        position: absolute;
        top: 214px;
        left: 70%;
    }

    .info-pic1>img {
        width: 100%;
        height: 100%;
    }

    .info-pic2 {
        width: 30%;
        height: 185px;
        border-radius: 10px;
        overflow: hidden;
        position: absolute;
        top: 214px;
        left: 75%;
    }

    .info-pic2>img {
        width: 100%;
        height: 100%;
    }

    .time-title1 {
        width: 100%;
        height: 43px;
        overflow-wrap: break-word;
        color: rgba(255, 255, 255, 1);
        font-size: 16px;
        font-family: AlibabaPuHuiTiR;
        text-align: left;
        line-height: 43px;
        position: absolute;
        top: 140px;
        left: 10%;
    }

    .time-start1 {
        width: 70%;
        height: 172px;
        overflow-wrap: break-word;
        color: rgba(255, 255, 255, 1);
        font-size: 16px;
        font-family: AlibabaPuHuiTiB;
        text-align: left;
        font-weight: 700;
        line-height: 38px;
        word-wrap: break-word;
        overflow: hidden;
        position: absolute;
        top: 140px;
        left: 10%;
    }

    .time-title2 {
        width: 100%;
        height: 43px;
        overflow-wrap: break-word;
        color: rgba(255, 255, 255, 1);
        font-size: 16px;
        font-family: AlibabaPuHuiTiR;
        text-align: left;
        line-height: 38px;
        word-wrap: break-word;
        overflow: hidden;
        position: absolute;
        top: 140px;
        left: 10%;
    }

    .time-start2 {
        width: 70%;
        height: 172px;
        overflow-wrap: break-word;
        color: rgba(255, 255, 255, 1);
        font-size: 16px;
        font-family: AlibabaPuHuiTiB;
        text-align: left;
        font-weight: 700;
        line-height: 43px;
        position: absolute;
        top: 140px;
        left: 10%;
    }
}

@media screen and (min-width: 1371px) {
    * {
        padding: 0;
        margin: 0;
        box-sizing: border-box;
    }

    .topimg {
        width: 100%;
        background-color: #cdebf7;
    }

    .topimg>img {
        width: 100%;
        padding: 0;
        position: relative;
    }

    .backButton>img {
        width: 100%;
        height: 100%;
    }

    .body-info {
        width: 100%;
        height: 789px;
        background-color: #f2f2f2;
    }

    .main-info {
        width: 60%;
        height: 549px;
        margin: 0 auto;
        transform: translateY(150px);
        background-color: #ffffff;
        position: relative;
    }

    .select-info {
        width: 10%;
        z-index: 99;
        transform: translateX(680%) translateY(200%);
    }

    .select-detail {
        width: 100%;
        height: 350px;
        transform: translateY(30px);
        display: flex;
        justify-content: space-around;
    }

    .detail-first {
        width: 45%;
        background-color: #29a0ac;
        border-radius: 10px;
        position: relative;
    }

    .detail-second {
        width: 45%;
        height: 100%;
        background-color: #6b7ef5;
        border-radius: 10px;
        position: relative;
    }

    .title-text1 {
        width: 90%;
        height: 51px;
        background-color: #ffffff;
        color: #29a0ab;
        font-size: 20px;
        font-family: AlibabaPuHuiTiB;
        font-weight: 700;
        text-align: center;
        line-height: 51px;
        padding: 0 10px;
        border-radius: 50px;
        position: absolute;
        top: 55px;
        left: 5%;
    }

    .title-text1-fr {
        width: 90%;
        height: 51px;
        background-color: #ffffff;
        color: #29a0ab;
        font-size: 20px;
        font-family: AlibabaPuHuiTiB;
        font-weight: 700;
        text-align: center;
        line-height: 51px;
        padding: 0 10px;
        border-radius: 50px;
        word-wrap: break-word;
        overflow: hidden;
        position: absolute;
        top: 55px;
        left: 5%;
    }

    .title-info-text1 {
        width: 90%;
        height: 51px;
        background-color: #f8f8f8;
        color: #727070;
        font-size: 20px;
        font-family: AlibabaPuHuiTiB;
        font-weight: 700;
        text-align: center;
        line-height: 51px;
        padding: 0 10px;
        border-radius: 50px;
        position: absolute;
        top: 55px;
        left: 5%;
    }

    .title-info-text1:hover {
        cursor: pointer;
    }

    .title-info-text {
        width: 90%;
        height: 51px;
        background-color: #f8f8f8;
        color: #727070;
        font-size: 20px;
        font-family: AlibabaPuHuiTiB;
        font-weight: 700;
        text-align: center;
        line-height: 51px;
        padding: 0 10px;
        border-radius: 50px;
        position: absolute;
        top: 55px;
        left: 5%;
    }

    .title-info-text:hover {
        cursor: pointer;
    }

    .title-text1:hover {
        cursor: pointer;
    }

    .title-text2 {
        width: 90%;
        height: 51px;
        background-color: #ffffff;
        color: #6b7ef5;
        font-size: 20px;
        font-family: AlibabaPuHuiTiB;
        font-weight: 700;
        text-align: center;
        padding: 0 10px;
        line-height: 51px;
        border-radius: 50px;
        position: absolute;
        top: 55px;
        left: 5%;
    }

    .title-text2-fr {
        width: 90%;
        height: 51px;
        background-color: #ffffff;
        color: #6b7ef5;
        font-size: 20px;
        font-family: AlibabaPuHuiTiB;
        font-weight: 700;
        text-align: center;
        padding: 0 10px;
        line-height: 51px;
        border-radius: 50px;
        word-wrap: break-word;
        overflow: hidden;
        position: absolute;
        top: 55px;
        left: 5%;
    }

    .title-text2-fr:hover {
        cursor: pointer;
    }

    .title-text4 {
        width: 90%;
        height: 51px;
        background-color: #ffffff;
        color: #6b7ef5;
        font-size: 16px;
        font-family: AlibabaPuHuiTiB;
        font-weight: 700;
        text-align: center;
        padding: 0 10px;
        line-height: 51px;
        border-radius: 50px;
        word-wrap: break-word;
        overflow: hidden;
        position: absolute;
        top: 55px;
        left: 5%;
    }

    .title-text4:hover {
        cursor: pointer;
    }

    .title-text1-fr:hover {
        cursor: pointer;
    }

    .title-text2:hover {
        cursor: pointer;
    }

    .info-pic1 {
        width: 30%;
        height: 135px;
        border-radius: 10px;
        overflow: hidden;
        position: absolute;
        top: 214px;
        left: 70%;
    }

    .info-pic1>img {
        width: 100%;
        height: 100%;
    }

    .info-pic2 {
        width: 30%;
        height: 185px;
        border-radius: 10px;
        overflow: hidden;
        position: absolute;
        top: 214px;
        left: 75%;
    }

    .info-pic2>img {
        width: 100%;
        height: 100%;
    }

    .time-title1 {
        width: 100%;
        height: 43px;
        overflow-wrap: break-word;
        color: rgba(255, 255, 255, 1);
        font-size: 16px;
        font-family: AlibabaPuHuiTiR;
        text-align: left;
        line-height: 43px;
        position: absolute;
        top: 140px;
        left: 10%;
    }

    .time-start1 {
        width: 70%;
        height: 172px;
        overflow-wrap: break-word;
        color: rgba(255, 255, 255, 1);
        font-size: 16px;
        font-family: AlibabaPuHuiTiB;
        text-align: left;
        font-weight: 700;
        line-height: 38px;
        word-wrap: break-word;
        overflow: hidden;
        position: absolute;
        top: 140px;
        left: 10%;
    }

    .time-title2 {
        width: 100%;
        height: 43px;
        overflow-wrap: break-word;
        color: rgba(255, 255, 255, 1);
        font-size: 16px;
        font-family: AlibabaPuHuiTiR;
        text-align: left;
        line-height: 38px;
        word-wrap: break-word;
        overflow: hidden;
        position: absolute;
        top: 140px;
        left: 10%;
    }

    .time-start2 {
        width: 70%;
        height: 172px;
        overflow-wrap: break-word;
        color: rgba(255, 255, 255, 1);
        font-size: 16px;
        font-family: AlibabaPuHuiTiB;
        text-align: left;
        font-weight: 700;
        line-height: 43px;
        position: absolute;
        top: 140px;
        left: 10%;
    }
}
</style>