dev/dcp-web-gate/src_old/views/ballotHome.vue

<template>
    <div>
        <headers></headers>
        <search :informationTotal="informationTotal"></search>
        <ul class="module-classify-list">
            <div class="module-classify-list" style="padding: 0px">
                <!-- <div class="broadcast" v-if="newSum!=0"> -->
                <!-- 信息播报 -->
                <!-- <div class="testtest_one" :class="{'testtest_tow':broadcastFlag_one,'testtest_three':broadcastFlag_tow,}">
					<span style="color:orange">New </span> <span style="color:white">{{$i18n.locale=='zh'?'信息播报':'Information broadcast'}} : </span> -->
                <!-- 播报滚动的情况 -->
                <!-- <div class="testtest_one scroll-up" ref="scroll" style="display:inline-block" v-if="scrollArr.length>1">
				        <ul style="width:300px;padding-top:2.5px">
				    		<li style="height:100%;width:100%"  v-for="(item,index) in broadcastList" :key="index">
				    			<template v-if="item.number != 0">
				    			    <span style="color:white">{{item.title}}:</span> <span style="color:orange;margin-right:10px">{{'+'+item.number}}</span>
				    		    </template>
				    		</li>
				        </ul>
						<ul style="width:300px;padding-top:2.5px">
				    		<li style="height:100%;width:100%"  v-for="(item,index) in broadcastList" :key="index">
				    			<template v-if="item.number != 0">
				    			    <span style="color:white">{{item.title}}:</span> <span style="color:orange;margin-right:10px">{{'+'+item.number}}</span>
				    		    </template>
				    		</li>
				        </ul>
				    </div> -->
                <!-- 播报不滚动的情况 -->
                <!-- <div class="testtest_one scroll-up" style="display:inline-block" v-if="scrollArr.length<2">
				        <ul style="width:300px;padding-top:2.5px">
				    		<li style="height:100%;width:100%"  v-for="(item,index) in broadcastList" :key="index">
				    			<template v-if="item.number != 0">
				    			    <span style="color:white">{{item.title}}:</span> <span style="color:orange;margin-right:10px">{{'+'+item.number}}</span>
				    		    </template>
				    		</li>
				        </ul>
				    </div>
				</div> -->
                <!-- 信息播报 -->
                <!-- </div> -->
                <li v-for="(item, index, trueindex) in initData" :key="item.value + index"
                    @mouseover="moduleClassifyHover(index)" @click="toViewImg(item), changeIcon(trueindex)"
                    style="cursor: pointer" @mouseout="moduleClassifyHover(-1)">
                    <div class="module-classify-info" :class="
                    	moduleClassify != index
                    		? ''
                    		: item.dataitem.length
                    		? 'module-classify-info-active2'
                    		: 'module-classify-info-active'
                    ">
                        <!-- <div class='new' v-if="newIcon[trueindex]&&newIcon[trueindex]!=0">New</div> -->
                        <div class="new" v-if="
                        	$i18n.locale == 'zh'
                        		? newIcon[trueindex] > mynewIcon[trueindex]
                        		: newIcon[trueindex] > mynewIconEn[trueindex]
                        ">
                            New
                        </div>
                        <div class="module-classify-icon">
                            <img :src="getIconUrl(item.icon + '3')" alt class="middle" />
                        </div>
                        <p class="module-classify-title" @click="toView(item.value, {})">
                            {{ $t(item.label) }}
                        </p>
                        <div class="module-classify-line"></div>
                    </div>
                    <div class="module-classify-children" :class="$i18n.locale == 'en' ? 'en' : ''">
                        <template v-for="(i, index) in item.dataitem">
                            <div class="cursor" :key="index" style="padding-left: 30px; width: 100%"
                                @click="toView(i.value, i.json ? i.json : '', item, i)">
                                ● {{ $t(i.label) }}
                            </div>
                        </template>
                    </div>
                </li>
            </div>
        </ul>
        <div class="latest-news-content" style="position: relative">
            <img class="most-watched cursor" @click="canClick && toViews('ConferenceDetail', paramKey)" :src="homeImg"
                alt="" />

            <!-- <img class="most-watched cursor"
		   @click="toViews('ConferenceDetail','1333254258275622912')"
		   src="@/assets/img/home/meeting_20210120.png"
		   alt=""
		   v-if="$i18n.locale!=='zh'"> -->
            <ul class="latest-news-list">
                <li style="position: relative" v-for="(item, num) in news" :key="num">
                    <div style="text-align: center">
                        <img :src="getIconUrl(item.icon)" width="44" height="44" alt="" class="cursor"
                            style="margin-top: 42px; margin-bottom: 22px" @click="toViewChange(num)" />
                        <p style="
								font-size: 26px;
								line-height: 26px;
								color: #333;
								font-weight: 500;
							">
                            {{ $t(item.label) }}
                        </p>
                    </div>
                    <ul>
                        <li v-for="(i, index) in item.newItem" :key="index">
                            <p v-if="num != 2" class="tdLabel1 cursor" style="
									width: 95%;
									overflow: hidden;
									text-overflow: ellipsis;
									white-space: nowrap;
									display: inline-block;
								" @click="
									viewChange(
										i.baseEntityId ? i.baseEntityId : i.projectId,
										index,
										num
									)
								">
                                <span class="spot"></span>
                                {{ $t(i.title ? i.title : i.projectName) }}
                            </p>
                            <!-- <p v-if="num==0" class="tdLabel2" style="width: 25%;text-align: center;float: right;">
								{{formatDate(i.publishDate)}}
							</p> -->
                            <!-- <p v-if="num==1" class="tdLabel2" style="width: 25%;text-align: center;float: right;">
								{{formatDate(i.createDate)}}
							</p> -->
                            <p v-if="num === 2" class="tdLabel1 cursor" @click="viewChange(i.id, index, num)">
                                <span class="spot"></span>
                                {{
                                $i18n.locale.toUpperCase() == 'ZH'
                                ? i.meetingName
                                : i.meetingNameEn
                                }}
                            </p>
                        </li>
                    </ul>
                    <p class="latest-news-more">
                        <span v-if="item.newItem.length > 0" @click="toViewChange(num)">+</span>
                    </p>
                </li>
            </ul>
        </div>

        <div :class="$i18n.locale == 'zh' ? 'quick-entry-list' : 'quick-entry-list2'">
            <div @click="toView('developmentCooperation')">
                <!-- <span @click="toView('developmentCooperation')"> <i class="el-icon-folder-remove"></i> {{$t('common.DevelopmentCooperationForum')}} </span> -->
            </div>
            <div @click="toView('onlineMeeting')">
                <!-- <span @click="toView('onlineMeeting')"> <i class="el-icon-data-analysis"></i> {{ $t('common.OnlineMeeting')}} </span> -->
            </div>
        </div>
        <!-- 理事会投票入口
        <div v-if="showHomeEntrance == true" class="voteBallot">
                   中文状态入口
            <img v-if="$i18n.locale == 'zh'" @click="clickVote()" :src="'api/file/pub/' + voteUrl[0].bannerUrl" alt=""
                style="width: 100%; height: 100%" />
                   英文状态入口
            <img v-if="$i18n.locale == 'en'" @click="clickVote()" :src="'api/file/pub/' + voteUrl[1].bannerUrl" alt=""
                style="width: 100%; height: 100%" />
        </div> -->

        <!-- 投票入口 -->
        <!-- <div class="ballot-info" @click="getLogin"></div> 
		<div class="box-bon">
			<div class="top-btm-box"></div>
		</div> -->
        <!-- 登录 -->
        <div class="ballot-details" v-if="ballotLanguage">
             
            <div class="user-box" v-if="languageInfo.value == 'CN'">
                <div class="login-top">
                    <div class="select-details-info">
                        <el-select v-model="languageInfo.value" class="select-select" @change="getLanguage">
                            <el-option v-for="(item, index) in optionLists" :key="index" :label="item.label"
                                :value="item.value">{{ item.label }}
                            </el-option>
                        </el-select>
                    </div>
                    <div class="login-text">用户登录</div>
                    <div class="close-pic" @click="closeInfo">
                        <img src="@/assets/ballot/close-l.png" alt="" />
                    </div>
                </div>
                <div class="user-info">
                    <el-form :model="ruleForm" :rules="rules1" ref="ruleForm">
                        <el-form-item class="user-id" prop="id">
                            <div class="user-text">ID:</div>
                            <el-input v-model="ruleForm.id" placeholder="请输入登录ID" autocomplete="off"></el-input>
                        </el-form-item>
                        <el-form-item class="user-pws" prop="password">
                            <div class="user-text">密码:</div>
                            <el-input placeholder="请输入登录密码" v-model="ruleForm.password" show-password></el-input>
                        </el-form-item>
                        <el-form-item class="user-yzm" prop="voteCode">
                            <div class="user-text">验证码:</div>
                            <el-input placeholder="请输入验证码" v-model="ruleForm.voteCode"
                                style="width: 70%; margin-left: -27%"></el-input>
                            <div class="verify">
                                <img :src="invitedUrl" alt="" @click="refreshCaptchaNew" />
                            </div>
                            <div class="voteWarn">{{ VerifyText }}</div>
                        </el-form-item>
                        <div class="user-login" @click="userLoginBallot('ruleForm')">
                            登&nbsp;&nbsp;&nbsp;录
                        </div>
                    </el-form>
                </div>
                <div class="btm-pic">
                    <img src="@/assets/ballot/未标题-2.png" alt="" />
                </div>
            </div>
             
            <div class="user-box" v-if="languageInfo.value == 'EN'">
                <div class="login-top">
                    <div class="select-details-info">
                        <el-select v-model="languageInfo.value" class="select-select" @change="getLanguage">
                            <el-option v-for="(item, index) in optionLists" :key="index" :label="item.label"
                                :value="item.value">{{ item.label }}
                            </el-option>
                        </el-select>
                    </div>
                    <div class="login-text">User Login</div>
                    <div class="close-pic" @click="closeInfo">
                        <img src="@/assets/ballot/close-l.png" alt="" />
                    </div>
                </div>
                <div class="user-info">
                    <el-form :model="ruleForm" :rules="rules2" ref="ruleForm">
                        <el-form-item class="user-id" prop="id">
                            <div class="user-text">ID:</div>
                            <el-input v-model="ruleForm.id" placeholder="Please enter your login ID" autocomplete="off">
                            </el-input>
                        </el-form-item>
                        <el-form-item class="user-pws" prop="password">
                            <div class="user-text">Password:</div>
                            <el-input placeholder="Please enter your password" v-model="ruleForm.password"
                                show-password></el-input>
                        </el-form-item>
                        <el-form-item class="user-yzm" prop="voteCode">
                            <div class="user-text">Verification Code:</div>
                            <el-input placeholder="Please enter verification code" v-model="ruleForm.voteCode"
                                style="width: 70%; margin-left: -27%"></el-input>
                            <div class="verify">
                                <img :src="invitedUrl" alt="" @click="refreshCaptchaNew" />
                            </div>
                            <div class="voteWarn">{{ VerifyText }}</div>
                        </el-form-item>
                        <div class="user-login" @click="userLoginBallot('ruleForm')">
                            Log in
                        </div>
                    </el-form>
                </div>
                <div class="btm-pic">
                    <img src="@/assets/ballot/未标题-2.png" alt="" />
                </div>
            </div>
             
            <div class="user-box" v-if="languageInfo.value == 'FR'">
                <div class="login-top">
                    <div class="select-details-info">
                        <el-select v-model="languageInfo.value" class="select-select" @change="getLanguage">
                            <el-option v-for="(item, index) in optionLists" :key="index" :label="item.label"
                                :value="item.value">{{ item.label }}
                            </el-option>
                        </el-select>
                    </div>
                    <div class="login-text">Connexion d'utilisateur</div>
                    <div class="close-pic" @click="closeInfo">
                        <img src="@/assets/ballot/close-l.png" alt="" />
                    </div>
                </div>
                <div class="user-info">
                    <el-form :model="ruleForm" :rules="rules3" ref="ruleForm">
                        <el-form-item class="user-id" prop="id">
                            <div class="user-text">ID:</div>
                            <el-input v-model="ruleForm.id" placeholder="Veuillez saisir votre identifiant de connexion"
                                autocomplete="off">
                            </el-input>
                        </el-form-item>
                        <el-form-item class="user-pws" prop="password">
                            <div class="user-text">Mot de passe:</div>
                            <el-input placeholder="Veuillez saisir votre mot de passe" v-model="ruleForm.password"
                                show-password></el-input>
                        </el-form-item>
                        <el-form-item class="user-yzm" prop="voteCode">
                            <div class="user-text">Code de vérification:</div>
                            <el-input placeholder="Veuillez saisir le code de vérification" v-model="ruleForm.voteCode"
                                style="width: 70%; margin-left: -27%"></el-input>
                            <div class="verify">
                                <img :src="invitedUrl" alt="" @click="refreshCaptchaNew" />
                            </div>
                            <div class="voteWarn">{{ VerifyText }}</div>
                        </el-form-item>
                        <div class="user-login" @click="userLoginBallot('ruleForm')">
                            Se connecter
                        </div>
                    </el-form>
                </div>
                <div class="btm-pic">
                    <img src="@/assets/ballot/未标题-2.png" alt="" />
                </div>
            </div>
             
            <div class="user-box" v-if="languageInfo.value == 'RU'">
                <div class="login-top">
                    <div class="select-details-info">
                        <el-select v-model="languageInfo.value" class="select-select" @change="getLanguage">
                            <el-option v-for="(item, index) in optionLists" :key="index" :label="item.label"
                                :value="item.value">{{ item.label }}
                            </el-option>
                        </el-select>
                    </div>
                    <div class="login-text">Вход</div>
                    <div class="close-pic" @click="closeInfo">
                        <img src="@/assets/ballot/close-l.png" alt="" />
                    </div>
                </div>
                <div class="user-info">
                    <el-form :model="ruleForm" :rules="rules4" ref="ruleForm">
                        <el-form-item class="user-id" prop="id">
                            <div class="user-text">ID:</div>
                            <el-input v-model="ruleForm.id" placeholder="Введите ваш логин" autocomplete="off">
                            </el-input>
                        </el-form-item>
                        <el-form-item class="user-pws" prop="password">
                            <div class="user-text">Пароль:</div>
                            <el-input placeholder="Введите ваш пароль" v-model="ruleForm.password" show-password>
                            </el-input>
                        </el-form-item>
                        <el-form-item class="user-yzm" prop="voteCode">
                            <div class="user-text">Код проверки:</div>
                            <el-input placeholder="Введите код проверки" v-model="ruleForm.voteCode"
                                style="width: 70%; margin-left: -27%"></el-input>
                            <div class="verify">
                                <img :src="invitedUrl" alt="" @click="refreshCaptchaNew" />
                            </div>
                            <div class="voteWarn">{{ VerifyText }}</div>
                        </el-form-item>
                        <div class="user-login" @click="userLoginBallot('ruleForm')">
                            Войти
                        </div>
                    </el-form>
                </div>
                <div class="btm-pic">
                    <img src="@/assets/ballot/未标题-2.png" alt="" />
                </div>
            </div>
        </div>
        <!-- 修改密码 -->
        <div>
            <!-- <div class="change-details" v-if="changeBallot">
            <div class="change-box1">
                <div class="change-top">
                    <div class="change-box">
                        <el-select v-model="languageInfo.value" class="change-change">
                            <el-option v-for="(item, index) in optionLists" :key="index" :label="item.label"
                                :value="item.value">
                            </el-option>
                        </el-select>
                    </div>
                    <div class="change-text">修改密码</div>
                    <div class="change-pic" @click="changeCloseInfo">
                        <img src="@/assets/ballot/close-l.png" alt="">
                    </div>
                </div>
                <div class="change-user-info">
                    <div class="change-item-id">
                        <div class="change-title">ID:</div>
                        <el-input v-model="changeList.id" placeholder="请输入ID"></el-input>
                    </div>
                    <div class="change-user-id">
                        <div class="change-title">原密码:</div>
                        <el-input v-model="changeList.oldPassword" placeholder="请输入原密码" show-password></el-input>
                    </div>
                    <div class="change-user-pws">
                        <div class="change-title">新密码:</div>
                        <el-input placeholder="请输入新密码" v-model="changeList.password" show-password></el-input>
                    </div>
                    <div class="change-user-yzm">
                        <div class="change-title">新密码:</div>
                        <el-input placeholder="请再次输入新密码" v-model="changeList.newPassword" show-password></el-input>
                    </div>
                    <div class="user-change1">密码规则:</div>
                    <div class="user-long">1.&nbsp;&nbsp;密码长度：8-20位</div>
                    <div class="user-style">
                        <div class="user-style1">2.&nbsp;&nbsp;密码格式：</div>
                        <div class="user-style2">大小写英文字母、数字、符合至少三项<br /> 混合，并且符合安全规定。</div>
                    </div>
                    <div class="user-change-pic" @click="sureChange">
                        确认修改
                    </div>
                </div>
                <div class="change-btm-pic">
                    <img src="@/assets/ballot/未标题-2.png" alt="">
                </div>
            </div>
        </div> -->
        </div>
        <!--    在线客服右侧浮窗-->
        <div style="
        position: fixed;
        left: 50%;
        top: 80%;
        transform: translate(595px, -50%);
        width: 70px;
        background: #fff;
        box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.5);
      " class="realTimeInfo_scree">
            <div style="
          width: 70px;
          height: 70px;
          background: #2a548c;
          text-align: center;
          font-size: 12px;
          color: #fff;
        " class="cursor" @click="toView('customerService')">
                <img src="@/assets/img/home/footer/customerServiceexport@2x.png" alt=""
                    style="width: 30px; margin-top: 10px" />
                <div>{{ $t("common.Online") }}</div>
            </div>
            <div style="
          width: 70px;
          height: 70px;
          text-align: center;
          font-size: 12px;
          color: #666;
          border-bottom: 1px solid rgba(241, 241, 241, 1);
          cursor: pointer;
        " @mouseover="mouseOver" @mouseleave="mouseLeave">
                <img src="@/assets/img/home/footer/QRcodeexport@2x.png" alt="" style="width: 30px; margin-top: 10px" />
                <div>{{ $i18n.locale == "zh" ? "手机网页版" : "Mobile Web" }}</div>
            </div>

            <div ref="QRCode" id="qrcode" style="
          position: absolute;
          transform: translate(-120%, -50%);
          display: none;
        "></div>
            <div style="
          width: 70px;
          height: 70px;
          text-align: center;
          font-size: 12px;
          color: #666;
          border-bottom: 1px solid rgba(241, 241, 241, 1);
        " class="cursor" @click="ShareChange">
                <img src="@/assets/img/home/footer/rectangle@2x.png" alt="" style="width: 30px; margin-top: 10px" />
                <div>{{ $t("common.Share") }}</div>
            </div>
            <div style="
          width: 70px;
          height: 70px;
          text-align: center;
          font-size: 12px;
          color: #666;
          border-bottom: 1px solid rgba(241, 241, 241, 1);
          cursor: pointer;
        " @click="toView('appDownload')">
                <img src="@/assets/img/home/footer/app.png" alt="" style="width: 30px; margin-top: 10px" />
                <div>{{ $t("common.appDownload") }}</div>
            </div>
            <!-- 首页跳转 -->
            <div style="
          width: 70px;
          height: 70px;
          text-align: center;
          font-size: 12px;
          color: #666;
          border-bottom: 1px solid rgba(241, 241, 241, 1);
        " class="cursor" @click="toView('home')">
                <img src="@/assets/img/home/footer/home@2x.png" alt="" style="width: 30px; margin-top: 10px" />
                <div>{{ $t("common.Home") }}</div>
            </div>
            <div style="position: absolute; transform: translate(90%, -90%)" v-show="ShareNum">
                <!-- <vshare ></vshare> -->
                <!-- <div class="share-component" data-sites="weibo,qzone,qq,wechat"></div> -->
                <share style="width: 84px; margin-bottom: 180px" :config="vshareConfig"></share>
            </div>
            <div style="
          width: 70px;
          height: 70px;
          text-align: center;
          display: none;
          font-size: 12px;
          color: #666;
          border-bottom: 1px solid rgba(241, 241, 241, 1);
        " class="cursor" @click="toUp" id="toUp">
                <img src="@/assets/img/home/footer/BackTopexport@2x.png" alt="" style="width: 30px; margin-top: 10px" />
                <div>{{ $t("common.Top") }}</div>
            </div>
        </div>
        <!--  -->
        <el-dialog width="50%" :visible.sync="detialPlayVideoVideo" @close="closePlay">
            <player :video-url="videoUrl" :state="state"></player>
        </el-dialog>
        <el-dialog width="50%" :visible.sync="detialPlayVideoPdf">
            <div>
                <iframe width="100%" id="embed" height="600px" :src="src" frameborder="0"></iframe>
            </div>
        </el-dialog>
        <footers></footers>
        <!-- 投票浮窗 -->
        <!-- <div class="mytest" v-if="voteflag">
      <i class="el-icon-circle-close" @click="voteoff()"></i>
      <img :src="'./api/file/pub/' + voteImg" alt="" @click="toVotelist()" />
    </div> -->

        <!-- 非洲活动飘窗 -->
        <!--    <div v-if="$i18n.locale == 'zh' ? true : false">-->
        <!--      <div class="africanActivity" v-if="activity">-->
        <!--        <i class="el-icon-circle-close" @click="voteoff1()"></i>-->
        <!--        <img src="@/assets/中文.png" alt="" @click="toVotelist1()" />-->
        <!--      </div>-->
        <!--    </div>-->
        <!--    <div v-else>-->
        <!--      <div class="africanActivity" v-if="activity">-->
        <!--        <i class="el-icon-circle-close" @click="voteoff1()"></i>-->
        <!--        <img src="@/assets/英文En.png" alt="" @click="toVotelist1()" />-->
        <!--      </div>-->
        <!--    </div>-->
        <!--	  广告栏浮窗-->
        <!--	  左对联-->
        <div class="advertise advertiseLeft" v-if="showLeftAdvertise && leftAdverList && leftAdverList.advPicUrl">
            <img @click="toshowLink(leftAdverList, 'web_left_couplet')"
                :src="'./api/file/pub/' + leftAdverList.advPicUrl" alt=""
                style="width: 150px; height: 434px; display: block" />
            <!--		<img @click="toshowLink(leftAdverList[0].advPicLink)" v-else src="@/assets/img/home/advertise/adverRight.png" alt="" style="height: 100%">-->
            <div class="close1" @click="closeAdver(1)">
                x {{ $t('common.CloseAdvertise') }}
            </div>
        </div>
        <!--		  右对联-->
        <div class="advertise advertiseRight" v-if="showLeftAdvertise && rightAdverList && rightAdverList.advPicUrl">
            <img @click="toshowLink(rightAdverList, 'web_right_couplet')"
                :src="'./api/file/pub/' + rightAdverList.advPicUrl" alt="" style="width: 100%; height: 100%" />
            <!--		<img @click="toshowLink(rightAdverList.advPicLink)" v-else src="@/assets/img/home/advertise/adverRight.png" alt="" style="height: 100%">-->
            <div class="close" @click="closeAdver(2)">
                x {{ $t('common.CloseAdvertise') }}
            </div>
        </div>
        <!--		  浮窗广告-->
        <div class="advertise advertiseUnderRight"
            v-if="showUnderRightAdver && UnderAdverList && UnderAdverList.advPicUrl">
            <img @click="toshowLink(UnderAdverList, 'web_suspensio')"
                :src="'./api/file/pub/' + UnderAdverList.advPicUrl" alt="" style="width: 100%; height: 100%" />
            <!--		<img @click="toshowLink(UnderAdverList.advPicLink)" v-else src="@/assets/img/home/advertise/adverUnderRight.png" alt="" style="width: 100%">-->
            <div class="close" @click="closeAdver(3)">
                x {{ $t('common.CloseAdvertise') }}
            </div>
        </div>
        <!-- 投票邀请码和验证码 -->
        <el-dialog title="" :visible.sync="dialogFormVisible">
            <el-form :model="form">
                <el-form-item :label="$i18n.locale == 'zh' ? '投票码' : 'Voting code'" :label-width="formLabelWidth">
                    <el-input v-model="form.code" autocomplete="off"></el-input>
                    <div class="voteWarn">{{ VoteText }}</div>
                </el-form-item>
                <el-form-item :label="$i18n.locale == 'zh' ? '验证码' : 'Verification code'" :label-width="formLabelWidth"
                    style="position: relative">
                    <el-input v-model="form.verify" autocomplete="off" style="width: 50%"></el-input>
                    <div class="verify">
                        <img :src="invitedUrl" alt="" @click="refreshCaptcha" />
                    </div>
                    <div class="voteWarn">{{ VerifyText }}</div>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="dialogFormVisible = false">{{
                $i18n.locale == 'zh' ? '取消' : 'cancel'
                }}</el-button>
                <el-button type="primary" @click="inviteEnter">{{
                $i18n.locale == 'zh' ? '确定' : 'confirm'
                }}</el-button>
            </div>
        </el-dialog>
    </div>
</template>
<script>
import { goActivityTargetUrl } from '@/utils/urlConfig.js'
import { getLatestInformationPortal } from '@/api/baseUnitView'
// import headers from "@/components/headerNew";
//投票首页
import headers from '@/components/ballotHeader'
import { BallotsLogin, BallotChanges } from '@/api/ballot/ballot'
import HeaderItem from '@/components/headerItem'
import editor from '@/components/dialog'
import tabers from '@/components/taber'
import search from '@/components/searchNew'
import vshare from 'vshare'
import Share from 'vue-social-share'
import QRCode from 'qrcodejs2'
import footers from '@/components/footersNew'
import { getLatestBaseProjectViewPortal } from '@/api/project/baseProjectView'
import { allInformationViewCount } from '@/api/information/information'
import {
    getHomeImg,
    getLatestMeetingListPortal,
    getLatestMeetingListPortalEn,
} from '@/api/meeting/meetingOutInfo'
//用户投票状态查询方法引入
import {
    getBannerUrls,
    getCouncilVoteSituation,
    getCouncilVoteSituationBeforeLogin,
    voteCodeVakidate,
    captchaValidate,
} from '@/api/vote/council'
// import {get} from  "@/api/work/wtDeptWorkTaskInfo";   //注意引入
import player from '@/components/Player'
import pdf from 'vue-pdf'
import { getActivityForVotes } from '@/api/vote/vote'
import {
    advertisementTotals,
    advertisementEntitys,
    advertisementInfos,
    getAppAdvert,
} from '@/api/operation/baseAdvertisement'
//查询广告数据
import { getCaptcha } from '@/api/user'
import { getCaptchaNew } from '@/api/user'
//各个功能日新增数
import { getDataBroadcastInfos } from '@/api/dataBroadcastInfos'

export default {
    name: 'Home',
    components: {
        headers,
        tabers,
        HeaderItem,
        search,
        footers,
        editor,
        vshare,
        Share,
        player,
        pdf,
    },
    data () {
        return {
            rules1: {
                id: [{ required: true, message: '请输入用户ID', trigger: 'blur' }],
                password: [
                    { required: true, message: '请输入用户密码', trigger: 'blur' },
                ],
                voteCode: [
                    { required: true, message: '请输入验证码', trigger: 'blur' },
                ],
            },
            rules2: {
                id: [
                    {
                        required: true,
                        message: 'Please enter your login ID',
                        trigger: 'blur',
                    },
                ],
                password: [
                    {
                        required: true,
                        message: 'Please enter your password',
                        trigger: 'blur',
                    },
                ],
                voteCode: [
                    {
                        required: true,
                        message: 'Please enter verification code',
                        trigger: 'blur',
                    },
                ],
            },
            rules3: {
                id: [
                    {
                        required: true,
                        message: 'Veuillez saisir votre identifiant de connexion',
                        trigger: 'blur',
                    },
                ],
                password: [
                    {
                        required: true,
                        message: 'Veuillez saisir votre mot de passe',
                        trigger: 'blur',
                    },
                ],
                voteCode: [
                    {
                        required: true,
                        message: 'Veuillez saisir le code de vérification',
                        trigger: 'blur',
                    },
                ],
            },
            rules4: {
                id: [{ required: true, message: 'Введите ваш логин', trigger: 'blur' }],
                password: [
                    { required: true, message: 'Введите ваш пароль', trigger: 'blur' },
                ],
                voteCode: [
                    { required: true, message: 'Введите код проверки', trigger: 'blur' },
                ],
            },
            changeList: {
                id: undefined,
                oldPassword: undefined,
                password: undefined,
                newPassword: undefined,
            },
            //投票
            ballotLanguage: false,
            changeBallot: false,
            optionLists: [
                {
                    value: 'CN',
                    label: '中文',
                },
                {
                    value: 'EN',
                    label: 'English',
                },
                {
                    value: 'FR',
                    label: 'Français',
                },
                {
                    value: 'RU',
                    label: 'Русский',
                },
            ],
            languageInfo: {
                value: 'CN',
            },
            ruleForm: {
                id: '',
                password: '',
                voteCode: '',
            },
            activity: true,
            scrollArea: '',
            speed: 20,
            timer: null,
            delay: 1000,
            liHeight: '',
            //============================
            goActivityTargetUrl,
            moduleClassify: -1,
            dialogVisible: false,
            ShareNum: false,
            videoUrl: require('../assets/pdfAndVideo/video.mp4'),
            currentPage: 0, // pdf文件页码
            pageCount: 0, // pdf文件总页数
            fileType: 'pdf', // 文件类型
            src: null,
            pdfPage: 1,
            pageCount: 0,
            detialPlayVideoVideo: false,
            detialPlayVideoPdf: false,
            state: false,
            homeImg: '',
            paramKey: '',
            canClick: '',
            showLeftAdvertise: true,
            showUnderRightAdver: true,
            adverseList: [],
            rightAdverList: {},
            leftAdverList: {},
            UnderAdverList: {},
            leftUrl: '',
            rightUrl: '',
            UnderRightUrl: '',
            voteImg: '', //投票宣传图
            voteflag: false,
            voteTime: '', //投票时间
            whiteList: '', //白名单
            isWhiteList: '', //是否启用白名单
            loginAccount: '', //用户登录的账号
            params: {
                pageNo: 1,
                pageSize: 3,
                language: '',
                //0为默认排序，1为关注排序
                descStatus: 0,
                messageOpenType: 'Y',
                status: 1,
            },

            news: [
                {
                    icon: 'new1',
                    label: 'common.LatestNews',
                    newItem: [],
                },
                {
                    icon: 'project1',
                    label: 'common.LatestProject',
                    newItem: [],
                },
                {
                    icon: 'meeting1',
                    label: 'common.LatestMeeting',
                    newItem: [],
                },
            ],
            initData: {
                data1: {
                    label: 'common.ProjectResources',
                    value: 'projectPresentation',
                    icon: 'resources',
                    dataitem: [
                        // {
                        //   label: "common.Pre-planning",
                        //   value: "projectPresentation",
                        // },
                        // {
                        //   label: "common.ProjectShowcase",
                        //   value: "projectPresentation",
                        // },
                        // {
                        //   label: "common.EvaluationAnalysis",
                        //   value: "projectPresentation",
                        // },
                        // {
                        //   label: "common.MatchTracking",
                        //   value: "projectPresentation",
                        // },
                    ],
                },
                data2: {
                    label: 'common.NewsData',
                    icon: 'news',
                    value: 'realTimeInfo1',
                    dataitem: [
                        // {
                        //   label: "common.Information",
                        //   value: "realTimeInfo",
                        //   json: "0",
                        // },
                        // {
                        //   label: "common.DataInformation",
                        //   value: "realTimeInfo",
                        //   json: "1",
                        // },
                        // {
                        //   label: "common.JournalInformation",
                        //   value: "realTimeInfo",
                        //   json: "2",
                        // },
                    ],
                },
                data3: {
                    label: 'common.GlobalData',
                    icon: 'data',
                    value: 'realTimeInfo',
                    dataitem: [
                        // {
                        //   label: "common.ResearchResults",
                        //   value: "resourceSharing",
                        // },
                        // {
                        //   label: "common.ResearchResources",
                        //   value: "resourceSharing",
                        // },
                        // {
                        //   label: "common.ConferenceFacilities",
                        //   value: "resourceSharing",
                        // },
                    ],
                },
                data4: {
                    label: 'common.CountryInformation',
                    icon: 'country',
                    value: 'countryInformation',
                    dataitem: [
                        // {
                        //   label: "common.Resources",
                        //   value: "countryInformation",
                        // },
                        // {
                        //   label: "common.EnergyDevelopmentPlanning",
                        //   value: "countryInformation",
                        // },
                        // {
                        //   label: "common.ProjectStatus",
                        //   value: "countryInformation",
                        // },
                        // {
                        //   label: "common.ProjectDevelopmentGuide",
                        //   value: "countryInformation",
                        // },
                    ],
                },
                data5: {
                    icon: 'enterprise',
                    label: 'common.EnterpriseShow',
                    value: 'enterprise',
                    dataitem: [
                        // {
                        //   label: "common.CompanyProfile",
                        //   value: "enterprise",
                        // },
                        // {
                        //   label: "common.ProductInformation",
                        //   value: "enterprise",
                        // },
                        // {
                        //   label: "common.CoreTechnology",
                        //   value: "enterprise",
                        // },
                        // {
                        //   label: "common.ProjectPerformance",
                        //   value: "enterprise",
                        // },
                    ],
                },
                data6: {
                    label: 'common.FinancialServices',
                    icon: 'finance',
                    value: 'financialServices',
                    dataitem: [
                        // {
                        //   label: "common.FinancialInstitutions",
                        //   value: "financialServices",
                        // },
                        // {
                        //   label: "common.Fund",
                        //   value: "financialServices",
                        // },
                        // {
                        //   label: "common.Investment&FinancingCases",
                        //   value: "financialServices",
                        // },
                    ],
                },
                data7: {
                    label: 'common.ThinkTankConsulting',
                    icon: 'ThinkTank',
                    value: 'thinkTankConsulting',
                    dataitem: [
                        // {
                        //   label: "common.ThinkTankNews",
                        //   value: "thinkTankConsulting",
                        // },
                        // {
                        //   label: "common.ServiceScope",
                        //   value: "thinkTankConsulting",
                        // },
                        // {
                        //   label: "common.ProjectCase",
                        //   value: "thinkTankConsulting",
                        // },
                        // {
                        //   label: "common.WillingnessToCooperate",
                        //   value: "thinkTankConsulting",
                        // },
                    ],
                },
                data8: {
                    label: 'common.CooperationNetwork',
                    icon: 'cooperation',
                    value: 'IntroductionMemberProfile',
                    dataitem: [
                        // {
                        //   label: "common.MemberIntroduction",
                        //   value: "IntroductionMemberProfile",
                        //   json: "member",
                        // },
                        // {
                        //   label: "common.AllianceIntroduction",
                        //   value: "IntroductionMemberProfile",
                        //   json: "union",
                        // },
                        // {
                        //   label: "common.CooperativeUnitIntroduction",
                        //   value: "IntroductionMemberProfile",
                        //   json: "cooperation",
                        // },
                        // {
                        //   label: "common.CustomService",
                        //   value: "IntroductionMemberProfile",
                        //   json: "custom",
                        // },
                    ],
                },
                data9: {
                    label: 'common.Cooperation&Communication',
                    icon: 'exchange',
                    value: 'cooperationExchange',
                    dataitem: [
                        // {
                        //   label: "common.MemberActivities",
                        //   value: "cooperationExchange",
                        // },
                        // {
                        //   label: "common.AllianceActivities",
                        //   value: "cooperationExchange",
                        // },
                        // {
                        //   label: "common.CooperationActivities",
                        //   value: "cooperationExchange",
                        // },
                    ],
                },
                data10: {
                    label: 'common.NationalregionalCommissions',
                    icon: 'commissions',
                    value: 'nationalregionalCommittees',
                    dataitem: [
                        // {
                        //   label: "common.BriefintroductiontotheCommittee",
                        //   value: "nationalregionalCommittees",
                        // },
                        // {
                        //   label: "common.Committeelayout",
                        //   value: "nationalregionalCommittees",
                        // },
                        // {
                        //   label: "common.Committeeactivities",
                        //   value: "nationalregionalCommittees",
                        // },
                    ],
                },
                // data9: {
                //   label: "common.ResourceSharing",
                //   icon: "share",
                //   value: "resourceSharing",
                //   dataitem: [
                // 	// {
                // 	//   label: "common.ResearchResults",
                // 	//   value: "resourceSharing",
                // 	// },
                // 	// {
                // 	//   label: "common.ResearchResources",
                // 	//   value: "resourceSharing",
                // 	// },
                // 	// {
                // 	//   label: "common.ConferenceFacilities",
                // 	//   value: "resourceSharing",
                // 	// },
                //   ],
                // },
                data11: {
                    label: 'common.ConferenceService',
                    icon: 'discussion',
                    value: 'conferenceServices',
                    dataitem: [
                        // {
                        //   label: "common.ConferenceInformation",
                        //   value: "conferenceServices",
                        // },
                        // {
                        //   label: "common.ConferenceResults",
                        //   value: "conferenceServices",
                        // },
                        // {
                        //   label: "common.ConferenceFeedback",
                        //   value: "conferenceServices",
                        // },
                    ],
                },
                data12: {
                    label: 'common.ExhibitionService',
                    icon: 'Exhibition',
                    value: 'exhibitionService',
                    dataitem: [
                        {
                            label: 'common.ExhibitionServices',
                            value: 'exhibitionService',
                        },
                        {
                            label: 'common.Cloudexhibition',
                            value: 'exhibitionService',
                        },
                        // {
                        //   label: "common.ExhibitionService",
                        //   value: "exhibitionService",
                        // },
                        {
                            label: 'common.OnlineExhibition',
                            value: 'exhibitionService',
                        },
                        // {
                        //   label: "common.Exhibitionresults",
                        //   value: "exhibitionService",
                        // },
                        // {
                        //   label: "common.Exhibitionfeedback",
                        //   value: "exhibitionService",
                        // },
                    ],
                },
            },
            informationTotal: '',
            dcpVip: '',
            showHomeEntrance: '',
            votedLeader: '',
            votedMatter: '',
            voteUrl: [],
            //以下为投票码和验证码部分(主席投票所需数据)
            dialogFormVisible: false,
            formLabelWidth: '120px',
            form: {
                code: '', //投票码
                verify: '', //验证码
            },
            invitedCode: [],
            codeUid: '',
            invitedUrl: '',
            VerifyText: '', //验证码提示信息
            VoteText: '', //投票码提示信息
            //==========================
            broadcastList: [], //新增数据播报
            newIcon: [], //从接口里面取出的各个新增数据值
            mynewIcon: [0, 0, 999, 999, 999, 999, 999, 0, 999, 0, 0, 999], //默认用cookie存储的新增值(中文)
            mynewIconEn: [0, 0, 999, 999, 999, 999, 999, 0, 999, 0, 0, 999], //默认用cookie存储的新增值(英文)
            broadcastFlag_one: false, //信息播报是否滚动样式flag
            broadcastFlag_tow: false,
            newSum: 0,
            scrollArr: [], //用来判断新增条数,从而判断是否让播报滚动
            vshareConfig: {
                shareList: [
                    // 此处放分享列表（ID）
                    'weixin',
                ],
                common: {
                    //此处放置通用设置
                    bdUrl: window.location.href,
                },
                share: [
                    {
                        //此处放置分享按钮设置
                    },
                ],
                url: window.location.href.replace('#/', ''), // 网址，默认使用
                sites: ['wechat'],
                wechatQrcodeTitle: '',
                wechatQrcodeHelper: '<p>https://www.geidcp.com</p>',
                image: [
                    //此处放置图片分享设置
                ],
                selectShare: [
                    //此处放置划词分享设置
                ],
            },
        }
    },
    watch: {
        '$i18n.locale' () {
            this.getDataBroadcastInfo()
            this.getRelevantList(1, null, this.$i18n.locale.toUpperCase())
            this.getBaseProject()
            this.getConfrences()
            this.qrcode()
            this.votefalgChange()
            this.getAdver()
        },
        videoUrl: function (val) {
            // const myPlayer = this.$refs.videoPlayer.player
            if (val !== '') {
                this.$refs.videoPlayer.player.src(val)
            }
        },
        state: function (val) {
            if (val) {
                this.$refs.videoPlayer.player.pause()
            }
        },
    },
    mounted () {
        this.getLanguage()
        this.getDataBroadcastInfo() //获取当日新增数
        this.getMynewicon()
        // setTimeout(()=>{
        // 	this.scrollbar();//信息播报滚动
        // },3000)
        // console.log('账号',this.$Cookies.get('userInfo'))
        //取出用户手机号和邮箱
        // this.src = '../assets/pdfAndVideo/SchemeOfOnlineExhibitionHall.pdf';
        if (this.$Cookies.get('token')) {
            this.loginAccount = JSON.parse(this.$Cookies.get('userInfo')).umsUser
                .userPreferredMobile
                ? JSON.parse(this.$Cookies.get('userInfo')).umsUser.userPreferredMobile
                : JSON.parse(this.$Cookies.get('userInfo')).umsUser.userEmail
        }
        if (window._bd_share_main) {
            window._bd_share_main.init()
        }
        this.getshowEnter()
        this.getVoteState()
        this.getBannerUrl()

        // this.src = pdf.createLoadingTask(this.src)
        window.addEventListener('scroll', this.showbtn, true)
        this.getRelevantList(1, null, this.$i18n.locale.toUpperCase()) // 最新资讯
        this.getBaseProject()
        this.getConfrences()
        this.getHomeImgs()
        this.getAdver()
        if (this.$Cookies.get('token')) {
            this.getActivityForVotesData()
        } //投票活动
        window.addEventListener('scroll', this.handleScroll)
        this.src = '/api/file/pub/def/Scheme3ofonlineexhibitionhall.pdf'
        document.all.iframeid.src = this.src ? this.src : ''
        this.$forceUpdate()
    },

    loadPdfHandler (e) {
        this.currentPage = 1 // 加载的时候先加载第一页
    },
    destroyed () {
        window.removeEventListener('scroll', this.handleScroll)
    },
    methods: {
        //修改密码
        getLanguage () {
            console.log(111)
            let language = this.languageInfo.value
            sessionStorage.setItem('language', language)
        },
        changePassword () {
            this.ballotLanguage = false
            this.changeBallot = true
        },
        sureChange () {
            if (this.changeList.password != this.changeList.newPassword) {
                this.$message.warning('两次密码不一致，请重新输入！')
            } else {
                let params = {
                    id: this.changeList.id,
                    oldPassword: this.changeList.oldPassword,
                    password: this.changeList.password,
                }
                console.log(params)
                BallotChanges(params).then((res) => {
                    console.log(res)
                    this.$message.success('修改成功,请重新登录')
                    setTimeout(() => {
                        this.ballotLanguage = true
                        this.changeBallot = false
                    })
                })
            }
            // if (localStorage.getItem('mettingUser')) {
            //     let idNum = localStorage.getItem('mettingUser')
            //     let idList = JSON.parse(idNum)
            //     let id = idList.userId
            //     console.log(id);
            // } else {
            //     alert('登录之后才可以修改密码')
            // }
        },
        //投票-新
        getLogin () {
            console.log(111)
            this.ballotLanguage = true
            this.changeBallot = false
            this.refreshCaptchaNew()
        },
        closeInfo () {
            this.ballotLanguage = false
            this.ruleForm.id = ''
            this.ruleForm.password = ''
            this.ruleForm.voteCode = ''
        },
        changeCloseInfo () {
            this.changeBallot = false
        },
        //投票登录
        userLoginBallot (formName) {
            this.$refs[formName].validate((valid) => {
                if (valid) {
                    this.CaptchaValidate()
                    // this.GetBallotsLoginDetail()
                } else {
                    console.log('error submit!!')
                    return false
                }
            })
        },
        getActivityForVotesData () {
            getActivityForVotes().then((res) => {
                this.voteTime = res.data.activityForVotes[0].voteEndDate //投票结束时间
                if (this.loginAccount.slice(0, 4) == '0086') {
                    this.loginAccount = this.loginAccount.slice(4)
                }
                this.isWhiteList = res.data.activityForVotes[0].isWhiteList
                this.whiteList = res.data.activityForVotes[0].whiteList
                //判断一下是否开启白名单,并判断用户账号是否在白名单里
                if (this.isWhiteList == 'Yes') {
                    if (
                        this.$Cookies.get('token') &&
                        this.$i18n.locale == 'zh' &&
                        this.whiteList.includes(this.loginAccount)
                    ) {
                        this.voteflag = true
                    }
                } else if (this.$Cookies.get('token') && this.$i18n.locale == 'zh') {
                    this.voteflag = true
                }
                //判断投票接口是否有数据,以及是否有投票图
                if (res.data.activityForVotes) {
                    this.voteImg = res.data.activityForVotes[0].coverPictureUrl
                    if (!this.voteImg) {
                        this.voteflag = false
                    }
                } else {
                    this.voteflag = false
                }
            })
        },
        handleScroll () {
            var scrollTop =
                window.pageYOffset ||
                document.documentElement.scrollTop ||
                document.body.scrollTop
            var offsetTop = document.querySelector('.realTimeInfo_scree').offsetTop
            let top =
                document.getElementsByClassName('realTimeInfo_scree')[0].style.top
            let leftAdver = document.getElementsByClassName('advertiseLeft')[0]
            let rightAdver = document.getElementsByClassName('advertiseRight')[0]
            let underRightAdver = document.getElementsByClassName(
                'advertiseUnderRight'
            )[0]
            console.log(top)
            if (scrollTop > 400) {
                document.getElementsByClassName('realTimeInfo_scree')[0].style.top =
                    '48%'
                if (leftAdver) {
                    leftAdver.style.top = '10%'
                }
                if (rightAdver) {
                    rightAdver.style.top = '10%'
                }
                if (underRightAdver) {
                    underRightAdver.style.top = '50%'
                }
            } else if (scrollTop < 510) {
                document.getElementsByClassName('realTimeInfo_scree')[0].style.top =
                    '80%'
                if (leftAdver) {
                    leftAdver.style.top = '40%'
                }
                if (rightAdver) {
                    rightAdver.style.top = '40%'
                }
                if (underRightAdver) {
                    underRightAdver.style.top = '80%'
                }
            }
        },
        moduleClassifyHover (index) {
            this.moduleClassify = index
        },
        previewPDF (row) { },
        closeDialog () {
            this.pdfPage = 1
        },
        //PDF改变页数
        previousPage () {
            var p = this.pdfPage
            p = p > 1 ? p - 1 : this.pageCount
            this.pdfPage = p
        },
        nextPage () {
            var p = this.pdfPage
            p = p < this.pageCount ? p + 1 : 1
            this.pdfPage = p
        },
        getConfrences () {
            var page = {
                pageSize: 3,
                pageNo: 1,
                lang: this.$i18n.locale,
            }
            if (page.lang == 'zh') {
                getLatestMeetingListPortal(page).then((res) => {
                    if (res.data) {
                        this.news[2].newItem = res.data.meetingBasicInfos || []
                    }
                })
            } else {
                getLatestMeetingListPortalEn(page).then((res) => {
                    if (res.data) {
                        this.news[2].newItem = res.data.meetingBasicInfos || []
                    }
                })
            }
        },
        getHomeImgs () {
            getHomeImg().then((res) => {
                if (res.data.homeImg) {
                    this.homeImg = './api/fileextend/pub/' + res.data.homeImg[0].bannerUrl
                    this.paramKey = res.data.homeImg[0].paramKey
                    this.canClick = true
                } else {
                    this.homeImg = require('@/assets/img/home/homeMeetingImg.png')
                    this.canClick = false
                }
            })
        },
        closePlay (val) {
            console.log(val)
        },
        toViewImg (item) {
            if (item.dataitem.length > 0) {
                this.toView(
                    item.dataitem[0].value,
                    item.dataitem[0].json ? item.dataitem[0].json : ''
                )
            } else {
                this.toView(item.value)
            }
        },
        qrcode () {
            document.getElementById('qrcode').innerHTML = ''
            this.url = window.location.href
            const that = this
            let qrcode = new QRCode('qrcode', {
                width: 132,
                height: 132,
                text: 'https://m.geidcp.com/#/?language=' + that.$i18n.locale, // 二维码地址
            })
        },
        ShareChange () {
            this.ShareNum = !this.ShareNum
        },
        mouseOver () {
            this.qrcode()
            this.ShareNum = false
            this.$refs['QRCode'].style.display = 'block'
        },
        mouseLeave () {
            this.$refs['QRCode'].style.display = 'none'
        },
        getRelevantList (num, type, language, title) {
            let page = {
                typeDict: type,
                language: language,
                pageSize: 3,
                pageNo: num,
                businessType: 'information',
                title: title ? title : '',
            }
            getLatestInformationPortal(page).then((res) => {
                if (res.data) {
                    this.news[0].newItem = res.data.portalInformationList || []
                }
            })
        },
        getBaseProject () {
            this.params.language = this.$i18n.locale.toUpperCase()
            getLatestBaseProjectViewPortal(this.params).then((result) => {
                var data = result.data
                if (data.baseProjectViews) {
                    this.news[1].newItem = result.data.baseProjectViews || []
                }
            })
            allInformationViewCount().then((result) => {
                var data = result.data
                if (data) {
                    this.informationTotal = data.cmsInformationViewCount
                }
            })
        },
        viewChange (id, index, num) {
            if (id) {
                if (num == 0) {
                    this.toViews('realTimeInfoItemdetails', id)
                }
                if (num == 1) {
                    this.toViews('projectPresentationDetails', id)
                }
                if (num == 2) {
                    localStorage.setItem('conferenceId', id)
                    this.toViews('ConferenceDetail', id)
                }
            }
        },
        toViewChange (index) {
            if (index == 0) {
                this.toView('realTimeInfo')
            }
            console.log(index + 'index')
            if (index == 1) {
                this.toView('projectPresentation')
            }
            if (index == 2) {
                this.toView('conferenceServices')
            }
        },
        CreateMeeting () {
            this.dialogVisible = true
        },
        showbtn () {
            let topBtn = document.getElementById('toUp')
            let scrollTop =
                window.pageYOffset ||
                document.documentElement.scrollTop ||
                document.body.scrollTop
            let browserHeight = window.outerHeight
            if (scrollTop > 100) {
                if (topBtn) {
                    topBtn.style.display = 'block'
                }
            } else {
                if (topBtn) {
                    topBtn.style.display = 'none'
                }
            }
        },
        getIconUrl (url) {
            return require('@/assets/img/home/' + url + '.png')
        },
        // 返回顶部
        toUp () {
            // window.scrollTo(0,0);
            var timer = setInterval(function () {
                let osTop =
                    document.documentElement.scrollTop || document.body.scrollTop
                let ispeed = Math.floor(-osTop / 5)
                document.documentElement.scrollTop = document.body.scrollTop =
                    osTop + ispeed
                this.isTop = true
                if (osTop === 0) {
                    clearInterval(timer)
                }
            }, 30)
        },
        toViews (router, json, item, i) {
            this.$store.commit('modify', router)
            window.localStorage.setItem('router', router)
            localStorage.setItem('conferenceId', json)
            const { href } = this.$router.resolve({
                name: router,
                query: {
                    key: json,
                },
            })
            window.open(href, '_blank')
        },
        toView (router, json, item, i, myself) {
            console.log(router, json, item, i, myself)
            if (i && i.label == 'common.OnlineExhibition') {
                // window.open("http://119.3.163.174:1080/23-2/", '_blank');
                window.open(
                    'http://tour.quanjingke.com/xiangmu/quanqiunengyuan_vtour_v7/index.html',
                    '_blank'
                )
            } else if (i && i.label == 'common.Cloudexhibition') {
                window.open('http://show.lksby.com/index', '_blank')
            } else if (i && i.label == 'common.Exhibitionfeedback') {
                this.detialPlayVideoPdf = true
            } else if (myself === 'newpro') {
                //进入新项目
                /*
                  1,判断用户是否登录----如果登录了就判断用户是否为会员
                  1.1 不是会员，弹窗提示 ‘示例：只有会员才能参与此活动’
                  1.2 是会员 执行下面的代码
                  1.3 未登录跳转到登录页
                */
                var popup = window.open(this.goActivityTargetUrl, '_blank')
                if (popup) {
                    let data = {
                        localStorage: {
                            'Auth-Token': '',
                            refresh_token: '',
                            user: this.$i18n.locale,
                            locale: '',
                        },
                        cookies: '',
                        // user:JSON.parse(localStorage.getItem('user')),
                        // lang: this.$i18n.locale,
                        isAutoLogin: true,
                    }
                    //遍历local storage
                    let storage = window.localStorage
                    Object.keys(data.localStorage).forEach((key) => {
                        data.localStorage[key] = storage.getItem(key)
                    })
                    //遍历cookie
                    let cookie = document.cookie
                    data.cookies = cookie.split('; ')
                    console.log(11)
                    console.log(data)
                    setTimeout(() => {
                        popup.postMessage(JSON.stringify(data), this.goActivityTargetUrl)
                    }, 500)
                }
            } else {
                if (json) {
                    if (router == 'projectPresentationDetails') {
                        this.$router.push({ name: router, query: { key: json } })
                    } else {
                        this.$router.push({ name: router, query: { key: json } })
                    }
                } else {
                    console.log(router, json, item, i, myself, '222222')
                    this.$router.push({ name: router })
                }
                this.$store.commit('modify', router)
                window.localStorage.setItem('router', router)
            }
        },
        //点击广告图片跳转并记录
        toshowLink (item, position) {
            console.log(item, position)
            let clickPic = {
                // position:position,
                advId: item.id,
            }
            getAppAdvert(clickPic).then((res) => {
                console.log(res)
            })
            if (item.advPicLink != '') {
                console.log(item.advPicLink)
                window.open(item.advPicLink, '_blank')
            } else {
                return
            }
        },
        //理事投票入口点击事件
        // clickVote() {
        //   if (!this.$Cookies.get('token')) {
        // 	// this.toView('login')
        // 	this.$router.push({path: 'login'});
        //   } else {
        // 	if (this.dcpVip) {
        // 	  this.$router.push({path: 'electionBallot'});
        // 	//   this.toView('electionBallot', '', '', '', 'newpro')
        // 	} else {
        // 	  this.$message.info(this.$t('common.notVip'));
        // 	}
        //   }
        // },
        clickVote () {
            if (!this.$Cookies.get('token')) {
                // this.toView('login')
                this.$router.push({ path: 'login' })
            } else {
                this.dialogFormVisible = true
                this.refreshCaptcha()
            }
        },

        //跳转到投票页
        toVotelist () {
            this.$router.push({ path: 'voteList' })
        },
        // 跳转到活动页
        toVotelist1 () {
            let language = window.localStorage.getItem('locale')
            let routerUrl = this.$router.resolve({
                // key:"154a437de7c611ecbac48cec4bc03c2d",
                path: '/nationalregionalCommissionsDetailds',
                query: {
                    key: '7419a7b7e63c11ec963e0894ef7fd169',
                    language: language,
                },
            })
            window.open(routerUrl.href, '_blank')
        },
        voteoff () {
            this.voteflag = false
        },
        voteoff1 () {
            this.activity = false
        },
        votefalgChange () {
            if (this.isWhiteList == 'Yes') {
                if (
                    this.$Cookies.get('token') &&
                    this.$i18n.locale == 'zh' &&
                    this.whiteList.includes(this.loginAccount)
                ) {
                    this.voteflag = true
                } else {
                    this.voteflag = false
                }
            } else if (this.isWhiteList == 'No') {
                if (this.$Cookies.get('token') && this.$i18n.locale == 'zh') {
                    this.voteflag = true
                } else {
                    this.voteflag = false
                }
            }
        },
        // 判断投票是否结束
        isVoteOver (t) {
            var ct = Date.parse(new Date())
            t = Date.parse(t)
            if (t - ct > 0) {
                return true
            } else {
                return false
            }
        },
        //登录后查询投票用户状态
        getVoteState () {
            getCouncilVoteSituation().then((res) => {
                let sta = res.data.councilVoteSituation
                this.dcpVip = sta.dcpVip
                this.showHomeEntrance = sta.showHomeEntrance
                this.votedLeader = sta.votedLeader
                this.votedMatter = sta.votedMatter
            })
        },
        //登录前查询是否显示投票入口
        getshowEnter () {
            getCouncilVoteSituationBeforeLogin().then((res) => {
                let status = res.data.councilVoteSituationBeforeLogin
                this.showHomeEntrance = status.showHomeEntrance
            })
        },
        //获取banner图片
        getBannerUrl () {
            getBannerUrls({
                paramKey: 'COUNCIL_VOTE_ENTRANCE_ZH,COUNCIL_VOTE_ENTRANCE_EN',
            }).then((res) => {
                this.voteUrl = res.data.bannerUrls
            })
        },
        //投票邀请码
        inviteEnter () {
            if (this.form.code.length == 0) {
                this.VoteText =
                    this.$i18n.locale == 'zh'
                        ? '投票码不能为空!'
                        : 'The voting code cannot be empty!'
                setTimeout(() => {
                    this.VoteText = ''
                }, 3000)
            }
            if (this.form.verify.length == 0) {
                this.VerifyText =
                    this.$i18n.locale == 'zh'
                        ? '验证码不能为空!'
                        : 'The verification code cannot be empty!'
                setTimeout(() => {
                    this.VerifyText = ''
                }, 3000)
            }
            if (this.form.code.length != 0 && this.form.verify.length != 0) {
                this.CaptchaValidate()
            }
            // var msg = this.$i18n.locale == 'zh'?'投票码和验证码不能为空!':'The voting code and verification code cannot be empty!'
            // if(this.form.code.length!=0 && this.form.verify.length!=0){
            // 	this.VoteCodeVakidate();
            // }else{
            // 	this.$message({
            //         message: msg,
            //         type: 'warning'
            //     });
            // }
        },
        refreshCaptchaNew () {
            getCaptchaNew(this.codeUid).then((response) => {
                this.codeUid = response['headers']['captcha-uid']
                let data = response.data
                if (data.size == 0) {
                    return
                }
                let reader = new FileReader()
                reader.onload = (e) => {
                    this.invitedUrl = e.target.result || ''
                }
                reader.readAsDataURL(data)
            })
        },
        refreshCaptcha () {
            getCaptcha(this.codeUid).then((response) => {
                this.codeUid = response['headers']['captcha-uid']
                let data = response.data
                if (data.size == 0) {
                    return
                }
                let reader = new FileReader()
                reader.onload = (e) => {
                    this.invitedUrl = e.target.result || ''
                }
                reader.readAsDataURL(data)
            })
        },
        VoteCodeVakidate () {
            var msg = this.$i18n.locale == 'zh' ? '投票码错误!' : 'Voting code error!'
            voteCodeVakidate(this.form.code)
                .then((res) => {
                    if (res.status == 200) {
                        this.$router.push({
                            path: 'electionBallot',
                            query: { votedLeader: this.votedLeader },
                        })
                    }
                })
                .catch((error) => {
                    this.VoteText = msg
                    setTimeout(() => {
                        this.VoteText = ''
                    }, 3000)
                })
        },

        CaptchaValidate () {
            var msgs =
                this.languageInfo.value == 'CN'
                    ? '验证码错误!'
                    : this.languageInfo.value == 'EN'
                        ? 'Verification code error!'
                        : this.languageInfo.value == 'FR'
                            ? 'Code de vérification incorrect!'
                            : 'Ошибка капча!'
            captchaValidate(this.ruleForm.voteCode, this.codeUid)
                .then((res) => {
                    if (res.status == 200) {
                        // this.VoteCodeVakidate();
                        this.GetBallotsLoginDetail()
                    }
                })
                .catch((error) => {
                    this.VerifyText = msgs
                    setTimeout(() => {
                        this.VerifyText = ''
                    }, 3000)
                })
        },
        GetBallotsLoginDetail () {
            let params = {
                voteCode: this.ruleForm.voteCode,
                id: this.ruleForm.id,
                password: this.ruleForm.password,
            }
            BallotsLogin(params)
                .then((res) => {
                    console.log(res)
                    if (res.status == '200') {
                        let userList = res.data
                        let mettingUser = JSON.stringify(userList)
                        sessionStorage.setItem('mettingUser', [mettingUser])
                        if (this.languageInfo.value == 'CN') {
                            this.$message.success('登录成功')
                        }
                        if (this.languageInfo.value == 'EN') {
                            this.$message.success('Login successfully')
                        }
                        if (this.languageInfo.value == 'FR') {
                            this.$message.success('Connexion réussie avec')
                        }
                        if (this.languageInfo.value == 'RU') {
                            this.$message.success('Посадка завершена.')
                        }
                        setTimeout(() => {
                            this.$router.push({ path: 'ballotCampaignMainPage' })
                        }, 1500)
                    }
                })
                .catch((error) => {
                    console.log(error)
                    if (this.languageInfo.value == 'CN') {
                        this.$message.error('账户或密码错误，请重新输入!')
                    }
                    if (this.languageInfo.value == 'EN') {
                        this.$message.error(
                            'The account or password is incorrect. Please re-enter it'
                        )
                    }
                    if (this.languageInfo.value == 'FR') {
                        this.$message.error(
                            'Compte ou mot de passe incorrect, veuillez le saisir à nouveau'
                        )
                    }
                    if (this.languageInfo.value == 'RU') {
                        this.$message.error('Пожалуйста, введите еще раз')
                    }
                })
        },
        // CaptchaValidate() {
        //     var msgs =
        //         this.$i18n.locale == "zh" ? "验证码错误!" : "Verification code error!";
        //     captchaValidate(this.form.verify, this.codeUid)
        //         .then((res) => {
        //             if (res.status == 200) {
        //                 this.VoteCodeVakidate();
        //             }
        //         })
        //         .catch((error) => {
        //             this.VerifyText = msgs;
        //             setTimeout(() => {
        //                 this.VerifyText = "";
        //             }, 3000);
        //         });
        // },
        // 关闭广告
        closeAdver (ele) {
            if (ele == 1 || ele == 2) {
                this.showLeftAdvertise = false
            } else {
                this.showUnderRightAdver = false
            }
        },
        //获取广告
        getAdver () {
            this.rightAdverList = {}
            this.leftAdverList = {}
            this.UnderAdverList = {}
            //左对联广告
            let paramsLeft = {
                position: 'web_left_couplet',
                language: this.$i18n.locale.toUpperCase(),
            }
            getAppAdvert(paramsLeft).then((res) => {
                if (res.data) {
                    let addverList2 = res.data[0].list
                    for (let i = 0; i < addverList2.length; i++) {
                        if (this.$i18n.locale == addverList2[i].languageDict) {
                            this.leftAdverList = addverList2[i]
                            break
                        } else {
                            this.leftAdverList = {}
                        }
                    }
                    console.log('this.leftAdverList')
                    console.log(this.leftAdverList)
                }
            })
            //右对联广告
            let paramsRight = {
                position: 'web_right_couplet',
                language: this.$i18n.locale.toUpperCase(),
            }

            getAppAdvert(paramsRight).then((res) => {
                if (res.data) {
                    let addverList3 = res.data[0].list
                    for (let i = 0; i < addverList3.length; i++) {
                        if (this.$i18n.locale == addverList3[i].languageDict) {
                            this.rightAdverList = addverList3[i]
                            break
                        } else {
                            this.rightAdverList = {}
                        }
                    }
                    console.log('this.rightAdverList')
                    console.log(this.rightAdverList)
                }
            })

            //浮窗广告
            let paramsUnderRight = {
                position: 'web_suspension',
                language: this.$i18n.locale.toUpperCase(),
            }
            getAppAdvert(paramsUnderRight).then((res) => {
                if (res.data) {
                    // this.UnderAdverList = res.data[0].list;
                    let addverList1 = res.data[0].list
                    for (let i = 0; i < addverList1.length; i++) {
                        if (this.$i18n.locale == addverList1[i].languageDict) {
                            this.UnderAdverList = addverList1[i]
                            break
                        } else {
                            this.UnderAdverList = {}
                        }
                    }
                    console.log('this.UnderAdverList')
                    console.log(this.UnderAdverList)
                }
            })
        },
        //打开页面时执行,如果没有cookie就存入,有的话取出赋值给mynewIcon
        getMynewicon () {
            //存中文
            if (!this.getCookie('newflag')) {
                this.setCookie('newflag', this.mynewIcon)
            } else {
                this.mynewIcon = this.getCookie('newflag').split(',')
            }
            //存英文
            if (!this.getCookie('newflagEn')) {
                this.setCookie('newflagEn', this.mynewIconEn)
            } else {
                this.mynewIconEn = this.getCookie('newflagEn').split(',')
            }
            //   console.log('华为手机Pro',this.mynewIcon,this.mynewIconEn);
        },
        //点击图标时改变相应的数据,并重新存入cookie
        changeIcon (i) {
            var arr = [0, 1, 6, 9, 10]
            if (arr.indexOf(i) != -1) {
                if (this.$i18n.locale == 'zh') {
                    this.mynewIcon[i] = this.newIcon[i]
                    this.setCookie('newflag', this.mynewIcon)
                } else {
                    this.mynewIconEn[i] = this.newIcon[i]
                    this.setCookie('newflagEn', this.mynewIconEn)
                }
            }
            // console.log('华为手机====',this.getCookie('newflag').split(',')[i],this.newIcon[i])
        },
        //cookie存入
        setCookie (cname, cvalue) {
            var d = new Date()
            var tomorrow =
                Date.parse(new Date(new Date().setHours(0, 0, 0, 0))) + 86400000 //第二天零点的时间戳毫秒数
            var now = Date.parse(new Date()) //现在的时间
            d.setTime(d.getTime() + (tomorrow - now))
            var expires = 'expires=' + d.toGMTString()
            document.cookie = cname + '=' + cvalue + '; ' + expires
        },
        //cookie获取
        getCookie (cname) {
            var name = cname + '='
            var ca = document.cookie.split(';')
            for (var i = 0; i < ca.length; i++) {
                var c = ca[i].trim()
                if (c.indexOf(name) == 0) return c.substring(name.length, c.length)
            }
            return ''
        },
        //============================
        getDataBroadcastInfo () {
            getDataBroadcastInfos(this.$i18n.locale).then((res) => {
                //   this.broadcastList = res.data.dataBroadcastInfos;
                var yes = res.data.dataBroadcastInfos
                this.broadcastList = []
                this.newIcon = []
                if (this.$i18n.locale == 'zh') {
                    for (var key in yes) {
                        //把更新的数据判断后放入一个数组
                        //   console.log('aabb',key,yes[key])
                        if (key == 'aProjectTodayNum') {
                            this.broadcastList.push({ title: '项目资源', number: yes[key] })
                            this.newIcon.push(Number(yes[key]))
                        } else if (key == 'bNewsTodayNum') {
                            this.broadcastList.push({ title: '资讯数据', number: yes[key] })
                            this.newIcon.push(Number(yes[key]))
                        } else if (key == 'cCountryTodayNum') {
                            this.broadcastList.push({ title: '国别信息', number: yes[key] })
                            this.newIcon.push(Number(yes[key]))
                        } else if (key == 'dUnitTodayNum') {
                            this.broadcastList.push({ title: '企业展示', number: yes[key] })
                            this.newIcon.push(Number(yes[key]))
                        } else if (key == 'eFinanceTodayNum') {
                            this.broadcastList.push({ title: '金融服务', number: yes[key] })
                            this.newIcon.push(Number(yes[key]))
                        } else if (key == 'fThinkTankTodayNum') {
                            this.broadcastList.push({ title: '智库咨询', number: yes[key] })
                            this.newIcon.push(Number(yes[key]))
                        } else if (key == 'gCooperationNetworkTodayNum') {
                            this.broadcastList.push({ title: '合作网络', number: yes[key] })
                            this.newIcon.push(Number(yes[key]))
                        } else if (key == 'hCooperationExchangeTodayNum') {
                            this.broadcastList.push({ title: '合作交流', number: yes[key] })
                            this.newIcon.push(Number(yes[key]))
                        } else if (key == 'iCommitteeTodayNum') {
                            this.broadcastList.push({
                                title: '区域和国家委员会',
                                number: yes[key],
                            })
                            this.newIcon.push(Number(yes[key]))
                        } else if (key == 'jResourceSharingTodayNum') {
                            this.broadcastList.push({ title: '资源共享', number: yes[key] })
                            this.newIcon.push(Number(yes[key]))
                        } else if (key == 'kMeetingTodayNum') {
                            this.broadcastList.push({ title: '会议服务', number: yes[key] })
                            this.newIcon.push(Number(yes[key]))
                        }
                    }
                } else {
                    for (var key in yes) {
                        //把更新的数据判断后放入一个数组
                        //   console.log('aabb',key,yes[key])
                        if (key == 'aProjectTodayNum') {
                            this.broadcastList.push({ title: 'Projects', number: yes[key] })
                            this.newIcon.push(Number(yes[key]))
                        } else if (key == 'bNewsTodayNum') {
                            this.broadcastList.push({ title: 'Info&Data', number: yes[key] })
                            this.newIcon.push(Number(yes[key]))
                        } else if (key == 'cCountryTodayNum') {
                            this.broadcastList.push({ title: 'Countries', number: yes[key] })
                            this.newIcon.push(Number(yes[key]))
                        } else if (key == 'dUnitTodayNum') {
                            this.broadcastList.push({
                                title: 'Enterprises',
                                number: yes[key],
                            })
                            this.newIcon.push(Number(yes[key]))
                        } else if (key == 'eFinanceTodayNum') {
                            this.broadcastList.push({
                                title: 'Financial Service',
                                number: yes[key],
                            })
                            this.newIcon.push(Number(yes[key]))
                        } else if (key == 'fThinkTankTodayNum') {
                            this.broadcastList.push({
                                title: 'Consulting',
                                number: yes[key],
                            })
                            this.newIcon.push(Number(yes[key]))
                        } else if (key == 'gCooperationNetworkTodayNum') {
                            this.broadcastList.push({
                                title: 'Cooperation Network',
                                number: yes[key],
                            })
                            this.newIcon.push(Number(yes[key]))
                        } else if (key == 'hCooperationExchangeTodayNum') {
                            this.broadcastList.push({
                                title: 'Cooperation & Communication',
                                number: yes[key],
                            })
                            this.newIcon.push(Number(yes[key]))
                        } else if (key == 'iCommitteeTodayNum') {
                            this.broadcastList.push({
                                title: 'Regional and National Committees',
                                number: yes[key],
                            })
                            this.newIcon.push(Number(yes[key]))
                        } else if (key == 'jResourceSharingTodayNum') {
                            this.broadcastList.push({
                                title: 'Resource Sharing',
                                number: yes[key],
                            })
                            this.newIcon.push(Number(yes[key]))
                        } else if (key == 'kMeetingTodayNum') {
                            this.broadcastList.push({
                                title: 'Conferences',
                                number: yes[key],
                            })
                            this.newIcon.push(Number(yes[key]))
                        }
                    }
                }
                this.newSum = 0
                this.scrollArr = []
                this.newIcon.forEach((item) => {
                    this.newSum = this.newSum + item
                    if (item > 0) {
                        this.scrollArr.push(item)
                    }
                })
                //   setTimeout(()=>{
                //   	this.scrollbar();//信息播报滚动
                //   },3000)
                console.log(
                    '狮子王--------------',
                    this.newIcon,
                    this.newSum,
                    this.scrollArr
                )
            })
        },
        scrollbar () {
            this.$nextTick(() => {
                this.scrollArea = this.$refs.scroll
                let li = this.scrollArea.getElementsByTagName('li')
                this.liHeight = li[0].offsetHeight
                this.scrollArea.scrollTop = 0
                // this.scrollArea.innerHTML += this.scrollArea.innerHTML;
                this.scrollArr.length > 1 && setTimeout(this.startScroll, this.delay)
            })
        },
        startScroll () {
            this.timer = setInterval(this.scrollUp, this.speed)
            this.scrollArea.scrollTop++
        },
        scrollUp () {
            // console.log('背灼炎天光',this.liHeight,this.scrollArea.scrollTop)
            if (Math.round(this.scrollArea.scrollTop) % this.liHeight == 0) {
                clearInterval(this.timer)
                setTimeout(this.startScroll, this.delay)
            } else {
                this.scrollArea.scrollTop++
                if (this.scrollArea.scrollTop >= this.scrollArea.scrollHeight / 2) {
                    this.scrollArea.scrollTop = 0
                }
            }
        },
        //new图标只显示==>项目资源、合作交流、资讯数据、资源共享、会议服务五个栏目
    },
}
</script>

<style scoped>
* {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}

.top-btm-box {
    width: 100%;
    height: 1206px;
    background-color: #000;
    position: absolute;
    opacity: 0.5;
    z-index: 998;
    transform: translateY(-1039px);
}

.box-bon {
    position: relative;
}

/* 投票 */

/* 投票开始 */
@media screen and (min-width: 1080px) {
    .ballot-details {
        width: 670px;
        height: 570px;
        z-index: 999;
        position: absolute;
        top: 80px;
        left: 50%;
        transform: translateX(-50%);
    }

    .user-box {
        width: 100%;
        height: 570px;
        z-index: 99999999999999999999;
        background: linear-gradient(0deg, #01b4ff 0%, #084ebf 100%);
        box-shadow: 0px -2px 4px 0px rgba(0, 0, 0, 0.5);
        overflow: hidden;
    }

    .login-top {
        width: 100%;
        height: 81px;
        background: #f5f5f5;
        border-radius: 4px 4px 0px 0px;
        position: relative;
    }

    .select-select {
        width: 140px;
        height: 41px;
        line-height: 41px;
        font-size: 14px;
        z-index: 999999999999999999999999999999999;
        transform: translateX(30px) translateY(20px);
    }

    /deep/.el-input__suffix {
        padding-right: 20px;
        color: #000;
    }

    .login-text {
        width: 100%;
        height: 20px;
        font-size: 20px;
        font-family: PingFangSC-Medium, PingFang SC;
        font-weight: 700;
        color: #262626;
        line-height: 20px;
        text-align: center;
        position: absolute;
        top: 32px;
        left: 0;
    }

    .close-pic {
        width: 25px;
        height: 24px;
        text-align: center;
        overflow: hidden;
        border-radius: 20px;
        cursor: pointer;
        position: absolute;
        top: 32px;
        right: 21px;
    }

    .close-pic>img {
        width: 100%;
        height: 100%;
    }

    .user-info {
        width: 80%;
        height: 508px;
        text-align: center;
        margin-left: 10%;
    }

    .user-id {
        width: 100%;
        height: 51px;
        margin-top: 40px;
        position: relative;
    }

    .user-pws {
        width: 100%;
        height: 51px;
        margin-top: 36px;
        position: relative;
    }

    .user-yzm {
        width: 100%;
        height: 51px;
        margin-top: 36px;
        position: relative;
    }

    .user-text {
        height: 39px;
        line-height: 39px;
        z-index: 999;
        width: 140px;
        text-align: left;
        font-size: 14px;
        border-radius: 10px;
        position: absolute;
        top: 0;
        left: 40px;
    }

    .user-login {
        width: 100%;
        height: 59px;
        text-align: center;
        line-height: 59px;
        cursor: pointer;
        background: linear-gradient(177deg, #84e2ff 0%, #30ade8 100%);
        box-shadow: 0px 2px 4px 0px #097fb0,
            inset 0px 3px 3px 0px rgba(194, 235, 255, 0.63);
        border-radius: 8px;
        margin-top: 38px;
        font-size: 24px;
        color: #fff;
    }

    .user-change {
        width: 56px;
        height: 20px;
        font-size: 14px;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        color: #0b5da1;
        line-height: 20px;
        cursor: pointer;
    }

    .btm-pic {
        width: 100%;
        padding: 0;
        margin: 0;
        position: absolute;
        top: 512px;
    }

    .btm-pic>img {
        width: 100%;
    }

    /deep/.user-info .el-input__inner {
        padding-left: 150px;
        background-color: #f5f5f5;
    }
}

@media screen and (min-width: 768px) and (max-width: 1079px) {
    .ballot-details {
        width: 600px;
        height: 570px;
        z-index: 999;
        position: absolute;
        top: 80px;
        left: 200px;
    }

    .user-box {
        width: 100%;
        height: 570px;
        z-index: 99999999999999999999;
        background: linear-gradient(0deg, #01b4ff 0%, #084ebf 100%);
        box-shadow: 0px -2px 4px 0px rgba(0, 0, 0, 0.5);
        overflow: hidden;
    }

    .login-top {
        width: 100%;
        height: 81px;
        background: #f5f5f5;
        border-radius: 4px 4px 0px 0px;
        position: relative;
    }

    .select-select {
        width: 140px;
        height: 41px;
        line-height: 41px;
        font-size: 14px;
        z-index: 999999999999999999999999999999999;
        transform: translateX(30px) translateY(20px);
    }

    /deep/.el-input__suffix {
        padding-right: 20px;
        color: #000;
    }

    .login-text {
        width: 100%;
        height: 20px;
        font-size: 20px;
        font-family: PingFangSC-Medium, PingFang SC;
        font-weight: 700;
        color: #262626;
        line-height: 20px;
        text-align: center;
        position: absolute;
        top: 32px;
        left: 0;
    }

    .close-pic {
        width: 25px;
        height: 24px;
        text-align: center;
        overflow: hidden;
        border-radius: 20px;
        cursor: pointer;
        position: absolute;
        top: 32px;
        right: 21px;
    }

    .close-pic>img {
        width: 100%;
        height: 100%;
    }

    .user-info {
        width: 80%;
        height: 508px;
        text-align: center;
        margin-left: 10%;
    }

    .user-id {
        width: 100%;
        height: 51px;
        margin-top: 40px;
        position: relative;
    }

    .user-pws {
        width: 100%;
        height: 51px;
        margin-top: 36px;
        position: relative;
    }

    .user-yzm {
        width: 100%;
        height: 51px;
        margin-top: 36px;
        position: relative;
    }

    .user-text {
        height: 39px;
        line-height: 39px;
        z-index: 999;
        width: 140px;
        text-align: left;
        font-size: 14px;
        border-radius: 10px;
        position: absolute;
        top: 0;
        left: 40px;
    }

    .user-login {
        width: 100%;
        height: 59px;
        text-align: center;
        line-height: 59px;
        cursor: pointer;
        background: linear-gradient(177deg, #84e2ff 0%, #30ade8 100%);
        box-shadow: 0px 2px 4px 0px #097fb0,
            inset 0px 3px 3px 0px rgba(194, 235, 255, 0.63);
        border-radius: 8px;
        margin-top: 38px;
        font-size: 24px;
        color: #fff;
    }

    .user-change {
        width: 56px;
        height: 20px;
        font-size: 14px;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        color: #0b5da1;
        line-height: 20px;
        cursor: pointer;
    }

    .btm-pic {
        width: 100%;
        padding: 0;
        margin: 0;
        position: absolute;
        top: 512px;
    }

    .btm-pic>img {
        width: 100%;
    }

    /deep/.user-info .el-input__inner {
        padding-left: 150px;
        background-color: #f5f5f5;
    }
}

@media screen and (max-width: 767px) {
    .ballot-details {
        width: 600px;
        height: 570px;
        z-index: 999;
        position: absolute;
        top: 80px;
        left: 200px;
    }

    .user-box {
        width: 100%;
        height: 570px;
        z-index: 99999999999999999999;
        background: linear-gradient(0deg, #01b4ff 0%, #084ebf 100%);
        box-shadow: 0px -2px 4px 0px rgba(0, 0, 0, 0.5);
        overflow: hidden;
    }

    .login-top {
        width: 100%;
        height: 81px;
        background: #f5f5f5;
        border-radius: 4px 4px 0px 0px;
        position: relative;
    }

    .select-select {
        width: 140px;
        height: 41px;
        line-height: 41px;
        font-size: 14px;
        z-index: 999999999999999999999999999999999;
        transform: translateX(30px) translateY(20px);
    }

    /deep/.el-input__suffix {
        padding-right: 20px;
        color: #000;
    }

    .login-text {
        width: 100%;
        height: 20px;
        font-size: 20px;
        font-family: PingFangSC-Medium, PingFang SC;
        font-weight: 700;
        color: #262626;
        line-height: 20px;
        text-align: center;
        position: absolute;
        top: 32px;
        left: 0;
    }

    .close-pic {
        width: 25px;
        height: 24px;
        text-align: center;
        overflow: hidden;
        border-radius: 20px;
        cursor: pointer;
        position: absolute;
        top: 32px;
        right: 21px;
    }

    .close-pic>img {
        width: 100%;
        height: 100%;
    }

    .user-info {
        width: 80%;
        height: 508px;
        text-align: center;
        margin-left: 10%;
    }

    .user-id {
        width: 100%;
        height: 51px;
        margin-top: 40px;
        position: relative;
    }

    .user-pws {
        width: 100%;
        height: 51px;
        margin-top: 36px;
        position: relative;
    }

    .user-yzm {
        width: 100%;
        height: 51px;
        margin-top: 36px;
        position: relative;
    }

    .user-text {
        height: 39px;
        line-height: 39px;
        z-index: 999;
        width: 140px;
        text-align: left;
        font-size: 14px;
        border-radius: 10px;
        position: absolute;
        top: 0;
        left: 40px;
    }

    .user-login {
        width: 100%;
        height: 59px;
        text-align: center;
        line-height: 59px;
        cursor: pointer;
        background: linear-gradient(177deg, #84e2ff 0%, #30ade8 100%);
        box-shadow: 0px 2px 4px 0px #097fb0,
            inset 0px 3px 3px 0px rgba(194, 235, 255, 0.63);
        border-radius: 8px;
        margin-top: 38px;
        font-size: 24px;
        color: #fff;
    }

    .user-change {
        width: 56px;
        height: 20px;
        font-size: 14px;
        font-family: PingFangSC-Regular, PingFang SC;
        font-weight: 400;
        color: #0b5da1;
        line-height: 20px;
        cursor: pointer;
    }

    .btm-pic {
        width: 100%;
        padding: 0;
        margin: 0;
        position: absolute;
        top: 512px;
    }

    .btm-pic>img {
        width: 100%;
    }

    /deep/.user-info .el-input__inner {
        padding-left: 150px;
        background-color: #f5f5f5;
    }
}

/* 投票结束 */
/*  */
.quick-entry-list,
.quick-entry-list2 {
    width: 1180px;
    overflow: hidden;
    margin: 0 auto 30px auto;
}

.quick-entry-list2>div,
.quick-entry-list>div {
    width: 50%;
    height: 120px;
    float: left;
    cursor: pointer;
}

.quick-entry-list>div:first-child {
    background: #5882f1 url('../assets/img/home/quick-entry1.png') no-repeat center center / 100% 100%;
}

.quick-entry-list>div:last-child {
    background: #0091ff url('../assets/img/home/quick-entry2.png') no-repeat center center / 100% 100%;
}

.quick-entry-list2>div:first-child {
    background: #5882f1 url('../assets/img/home/quick-entry3.png') no-repeat center center / 100% 100%;
}

.quick-entry-list2>div:last-child {
    background: #0091ff url('../assets/img/home/quick-entry4.png') no-repeat center center / 100% 100%;
}

.module-classify-list {
    width: 1180px;
    margin: 0 auto;
    padding: 0 0 30px 0;
    overflow: hidden;
    background: #fff;
}

.module-classify-list * {
    transition: all 0.3s;
}

.module-classify-list li {
    width: 180px;
    height: 205px;
    margin: 0 8px;
    float: left;
    padding: 0 18px;
    border-radius: 9px;
    position: relative;
    overflow: hidden;
}

.module-classify-list li:hover {
    box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.1);
}

.module-classify-info {
    position: relative;
}

.module-classify-icon {
    width: 70px;
    height: 70px;
    margin: 0 auto;
    margin-top: 46px;
    /* background: #F4F8FF; */
    border-radius: 50%;
    position: relative;
}

.module-classify-icon img {
    position: absolute;
    top: 0;
    left: 0;
    /* transform: translate(-50%, -50%); */
    width: 100%;
    height: 100%;
}

.module-classify-title {
    font-weight: 600;
    font-size: 17px;
    color: #666;
    line-height: 20px;
    margin-top: 23px;
    text-align: center;
    cursor: pointer;
}

.module-classify-line {
    width: 0%;
    height: 2px;
    background: #0091ff;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: -4px;
    transition: all 0.3s;
    opacity: 0;
}

.module-classify-info-active .module-classify-icon {
    margin-top: 37px;
    width: 84px;
    height: 84px;
    /* background: #0091FF; */
}

/* .module-classify-info-active .module-classify-icon img{
      width: 42px;
      height: 42px;
    } */
.module-classify-info-active2 {
    margin-top: 30px;
}

.module-classify-info-active2 .module-classify-icon {
    width: 48px;
    height: 48px;
    margin-top: 30px;
    /* background: #0091FF; */
}

/* .module-classify-info-active2 .module-classify-icon img{
      width: 24px;
      height: 24px;
    } */
.module-classify-info-active2 .module-classify-title {
    color: #0091ff;
    margin-top: 0;
}

.module-classify-info-active2 .module-classify-line {
    width: 100%;
    opacity: 1;
}

.module-classify-children {
    font-size: 12px;
    font-weight: 400;
    text-align: left;
    color: #0091ff;
    line-height: 20px;
    padding: 10px 0;
    opacity: 0;
    position: absolute;
    top: 205px;
    left: 20px;
    transition: all 0.3s;
}

.module-classify-children div {
    display: inline-block;
    width: 50%;
    font-size: 13px;
    overflow: hidden;
    white-space: nowrap;
    cursor: pointer;
}

.module-classify-list li:hover .module-classify-children {
    top: 110px;
    opacity: 1;
}

.module-classify-list li:hover .module-classify-children.en {
    top: 140px;
}

.latest-news-content {
    width: 1180px;
    margin: 0 auto;
}

.latest-news-content .most-watched {
    width: 100%;
}

.latest-news-more {
    text-align: right;
}

.latest-news-more span {
    font-size: 24px;
    font-weight: 900;
    color: #0091ff;
    cursor: pointer;
}

.latest-news-more span:hover {
    color: #dd541a;
}

.latest-news-list {
    overflow: hidden;
    padding-bottom: 20px;
}

.latest-news-list>li {
    width: 33.3%;
    min-height: 290px;
    float: left;
    padding: 0 14px;
    position: relative;
}

.latest-news-list>li::before {
    content: '';
    position: absolute;
    bottom: 30px;
    left: 0;
    width: 4px;
    height: 125px;
}

.latest-news-list>li:nth-child(1)::before {
    background: #608cc4;
}

.latest-news-list>li:nth-child(2)::before {
    background: #6dd400;
}

.latest-news-list>li:nth-child(3)::before {
    background: #ffaa05;
}

.latest-news-list ul {
    margin-top: 20px;
    margin-bottom: 10px;
    line-height: 30px;
    font-size: 14px;
}

.latest-news-list ul li {
    padding-left: 18px;
    position: relative;
    height: 30px;
}

.latest-news-list ul li p {
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.latest-news-list ul li::before {
    content: '';
    display: block;
    width: 8px;
    height: 8px;
    background: #cfe2fb;
    position: absolute;
    top: 11px;
    left: 0;
}

.mytest {
    position: fixed;
    top: 60%;
    right: 8%;
    z-index: 2;
    width: 300px;
    height: 150px;
}

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

.africanActivity {
    position: fixed;
    top: 60%;
    right: 8%;
    z-index: 2;
    width: 300px;
    height: 150px;
}

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

.el-icon-circle-close {
    position: absolute;
    top: 5px;
    right: 5px;
    background-color: white;
    border-radius: 50%;
}

.voteBallot {
    position: fixed;
    left: 67%;
    top: 11%;
    transform: translate(-800px, -50%);
    z-index: 999;
    width: 200px;
    height: 71px;
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.5);
}

/deep/.el-input__inner {
    width: 90%;
}

/deep/.el-dialog__body {
    padding: 10px 20px;
}

/deep/.el-form-item {
    margin-bottom: 5px;
}

.verify {
    width: 138px;
    height: 35px;
    z-index: 99999;
    position: absolute;
    top: 0;
    right: 20px;
}

.voteWarn {
    height: 25px;
    color: red;
    font-size: 14px;
    line-height: 30px;
    transition: height 2s;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
}

/deep/ .el-form-item__error {
    color: red;
    transform: translateX(30px);
    font-size: 14px;
}

/deep/ .el-form-item__content {
    line-height: 43px;
}

.advertise {
    border: 1px solid #ccc;
    box-sizing: border-box;
    z-index: 999;
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.5);
    cursor: pointer;
}

.advertiseLeft {
    width: 150px;
    height: 455px;
    position: fixed;
    top: 50%;
    left: 200px;
}

.advertiseRight {
    width: 80px;
    height: 300px;
    position: fixed;
    top: 40%;
    right: 20px;
}

.advertiseUnderRight {
    width: 180px;
    height: 150px;
    position: fixed;
    top: 80%;
    right: 20px;
}

.close {
    width: 150px;
    background: #f5f5f5;
    cursor: pointer;
    font-size: 14px;
    text-align: center;
    /*color: #ccc;*/
}

.close1 {
    width: 150px;
    /* background: #f5f5f5; */
    cursor: pointer;
    font-size: 14px;
    text-align: center;
}

.new {
    position: relative;
    z-index: 1;
    float: right;
    width: 38px;
    height: 20px;
    margin-right: 25%;
    line-height: 20px;
    background: red;
    color: white;
    text-align: center;
    border-radius: 9px;
    font-size: 13px;
}

.broadcast {
    width: 100%;
    background-color: #2b5e9e;
    height: 55px;
    line-height: 55px;
    margin: 20px 0 0 0;
    padding: 0 28px;
    border-top-left-radius: 35px;
    border-top-right-radius: 35px;
    white-space: nowrap;
    /* overflow: hidden; */
}

@-webkit-keyframes short {
    0% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    100% {
        -webkit-transform: translate3d(-300px, 0, 0);
        transform: translate3d(-280px, 0, 0);
    }
}

@-webkit-keyframes long {
    0% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    100% {
        -webkit-transform: translate3d(-300px, 0, 0);
        transform: translate3d(-980px, 0, 0);
    }
}

.testtest_one {
    width: max-content;
    height: 100%;
}

.testtest_one span {
    vertical-align: top;
}

.testtest_tow {
    width: max-content;
    /* 动画部分 */
    /* animation-name: rowup;
	animation-duration: 5s;
	animation-iteration-count: infinite; */
    -webkit-animation: 10s short linear infinite normal;
    animation: 10s short linear infinite normal;
}

.testtest_three {
    width: max-content;
    /* 动画部分 */
    /* animation-name: rowup;
	animation-duration: 5s;
	animation-iteration-count: infinite; */
    -webkit-animation: 12s long linear infinite normal;
    animation: 12s long linear infinite normal;
}

.scroll-up {
    height: 50px;
    line-height: 50px;
    overflow: hidden;
}
</style>