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

<template>
	<div>
		<headers></headers>
		<search :informationTotal="informationTotal"></search>
		<ul class="module-classify-list">
			<div class="module-classify-list" style="padding: 0px">
				<img
					class="banner"
					src="@/assets/ballot/20220923.png"
					alt=""
					style="width: 0px; height: 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">
            <div class="ballot-login" @click="getLogin"></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">
                            <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="rules" 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:73%; margin-left: -23%;"></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>
                        <div class="user-change" @click="changePassword">修改密码</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">
                            <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="rules" 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:73%; margin-left: -23%;"></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>
                        <div class="user-change" @click="changePassword">修改密码</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">
                            <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="rules" 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:73%; margin-left: -23%;"></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>
                        <div class="user-change" @click="changePassword">修改密码</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">
                            <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="rules" 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:73%; margin-left: -23%;"></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>
                        <div class="user-change" @click="changePassword">修改密码</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 class="ballotAnimals">
			<img
				@click="getUserPicDetal()"
				src="@/assets/Biodiversity/ddd23.png"
				style="width: 100%; height: 100%"
			/>
		</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 {
			rules: {
				id: [{ required: true, message: '请输入用户ID', 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: '', //用户登录的账号
			loginAccountEl: '',
			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: 'exhibitionService2',
					dataitem: [
						{
							label: 'common.ExhibitionServices',
							value: 'exhibitionService2',
						},
						{
							label: 'common.Cloudexhibition',
							value: 'exhibitionService',
						},
                        {
                        	label: 'common.OnlineExhibition',
                        	value: 'exhibitionService',
                        },
						// {
						//   label: "common.ExhibitionService",
						//   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.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
			this.loginAccountEl = 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: {
		//修改密码
		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
		},
		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)
					console.log(
						this.loginAccount,
						this.loginAccountEl,
						'====截取数据===='
					)
				}
				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.whiteList.includes(this.loginAccountEl)
					) {
						console.log(
							this.loginAccount,
							this.loginAccountEl,
							'白名单数据列表1'
						)
						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) {
			if (i && i.label == 'common.OnlineExhibition') {
				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()
			}
		},
		//生物多样性
		getUserPicDetal() {
			this.$router.push({ path: 'BiodiversityAndEnergyRevolution' })
		},
		//跳转到投票页
		toVotelist() {
			//投票老页面
			// this.$router.push({ path: "voteList" });
			//投票新页面
			this.$router.push({ path: 'voteInfo' })
		},
		// 跳转到活动页
		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.$i18n.locale == 'zh' ? '验证码错误!' : 'Verification code error!'
			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)
					localStorage.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)
				}
			})
		},
		// 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;
}

/* body *{
-webkit-filter: grayscale(100%); 
-moz-filter: grayscale(100%); 
-ms-filter: grayscale(100%); 
-o-filter: grayscale(100%); 
filter: grayscale(100%);
filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); 
filter:gray; 
} */
/* 修改密码 */
.change-box1 {
	margin: 20px auto;
	width: 468px;
	height: 570px;
	z-index: 999;
	background: linear-gradient(0deg, #ffffff 0%, #2ba5df 100%);
	box-shadow: 0px -2px 4px 0px rgba(0, 0, 0, 0.5);
	overflow: hidden;
}

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

.change-box {
	width: 100px;
	height: 30px;
	z-index: 999999;
	overflow: hidden;
	position: absolute;
	top: 26px;
	left: 20px;
}

.change-change {
	width: 180px;
	height: 40px;
	line-height: 40px;
	font-size: 14px;
	transform: translateX(-60px) translateY(-2px);
}

.change-text {
	width: 80px;
	height: 20px;
	font-size: 20px;
	font-family: PingFangSC-Medium, PingFang SC;
	font-weight: 500;
	color: #262626;
	line-height: 20px;
	position: absolute;
	top: 32px;
	left: 194px;
}

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

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

.change-user-info {
	width: 384px;
	height: 508px;
	text-align: center;
	margin-left: 42px;
}

.change-item-id {
	width: 384px;
	height: 51px;
	margin-top: 20px;
	position: relative;
}

.change-user-id {
	width: 384px;
	height: 51px;
	margin-top: 10px;
	position: relative;
}

.change-user-pws {
	width: 384px;
	height: 51px;
	margin-top: 10px;
	position: relative;
}

.change-user-yzm {
	width: 384px;
	height: 51px;
	margin-top: 10px;
	position: relative;
}

.change-title {
	height: 39px;
	line-height: 39px;
	z-index: 999;
	width: 80px;
	text-align: left;
	border-radius: 10px;
	position: absolute;
	top: 0;
	left: 30px;
}

.user-change-pic {
	width: 386px;
	height: 59px;
	text-align: center;
	line-height: 59px;
	border-radius: 10px;
	cursor: pointer;
	background-color: #47c4ef;
	font-size: 24px;
	color: #fff;
}

.user-change1 {
	width: 375px;
	height: 16px;
	font-size: 16px;
	font-family: PingFangSC-Regular, PingFang SC;
	font-weight: 400;
	text-align: initial;
	color: #333333;
	line-height: 16px;
	margin-left: 10px;
}

.user-style {
	margin-top: 19px;
	display: flex;
	margin-left: 10px;
	text-align: initial;
}

.user-style1 {
	width: 115px;
	height: 24px;
	font-size: 16px;
	font-family: PingFangSC-Regular, PingFang SC;
	font-weight: 400;
	color: #333333;
	line-height: 24px;
	text-align: initial;
}

.user-style2 {
	width: 298px;
	height: 48px;
	font-size: 15px;
	font-family: PingFangSC-Regular, PingFang SC;
	font-weight: 400;
	color: #333333;
	line-height: 24px;
	text-align: initial;
}

.user-long {
	width: 357px;
	height: 20px;
	font-size: 15px;
	margin-top: 19px;
	margin-left: 10px;
	font-family: PingFangSC-Regular, PingFang SC;
	font-weight: 400;
	color: #333333;
	line-height: 20px;
	text-align: initial;
}

.change-btm-pic {
	padding: 0;
	margin: 0;
	position: absolute;
	top: 542px;
}

.change-details {
	width: 468px;
	height: 570px;
	z-index: 999;
	position: absolute;
	top: 50px;
	left: 50%;
	transform: translateX(-50%);
}

/* 投票 */
.ballot-details {
	width: 650px;
	height: 570px;
	z-index: 999;
	position: absolute;
	top: 50px;
	left: 50%;
	transform: translateX(-50%);
}

.user-box {
	width: 650px;
	height: 570px;
	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: 650px;
	height: 81px;
	background: #f5f5f5;
	border-radius: 4px 4px 0px 0px;
	position: relative;
}

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

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

.login-text {
	width: 240px;
	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: 192px;
}

.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: 600px;
	height: 508px;
	text-align: center;
	margin-left: 20px;
}

.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;
    color: #000;
} */

.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;
	cursor: pointer;
}

.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%;
}

.ballot-info {
	width: 163px;
	height: 38px;
	text-align: center;
	line-height: 32px;
	border-radius: 50px;
	position: absolute;
	top: 290px;
	right: 582px;
	z-index: 999;
	cursor: pointer;
	opacity: 0;
}

.ballot-login {
	width: 100%;
	height: 100%;
	color: #fff;
	font-size: 14px;
	font-weight: 700;
}

.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);
}
.ballotAnimals {
	position: fixed;
	left: 83%;
	top: 54%;
	z-index: 999;
	width: 290px;
	height: 110px;
	box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.5);
	cursor: pointer;
}
.verify {
	width: 138px;
	height: 35px;
	z-index: 99999;
	position: absolute;
	top: 0;
	right: 20px;
}

.voteWarn {
	height: 25px;
	color: red;
	font-size: 10px;
	line-height: 30px;
	transition: height 2s;
}

.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>